增加个人中心、提现、服务设置页面
This commit is contained in:
parent
8f6a01a3b9
commit
f64ddec11d
18
src/App.vue
18
src/App.vue
|
|
@ -57,6 +57,9 @@ export default {
|
||||||
.placeholder-style-4 {
|
.placeholder-style-4 {
|
||||||
color: #999999;
|
color: #999999;
|
||||||
}
|
}
|
||||||
|
.placeholder-style-5 {
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
// 沉浸样式
|
// 沉浸样式
|
||||||
.immerse-image {
|
.immerse-image {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -95,4 +98,19 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.common-save-form-btn {
|
||||||
|
width: 100%;
|
||||||
|
padding: 60rpx 0;
|
||||||
|
.btn {
|
||||||
|
width: 570rpx;
|
||||||
|
height: 98rpx;
|
||||||
|
background: #8b9beb;
|
||||||
|
border-radius: 49rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-size: 36rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 98rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,13 @@
|
||||||
"navigationBarTitleText": "登录"
|
"navigationBarTitleText": "登录"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/member/service-info",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "服务信息",
|
||||||
|
"enablePullDownRefresh": true
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/order/order",
|
"path": "pages/order/order",
|
||||||
"style": {
|
"style": {
|
||||||
|
|
@ -40,6 +47,13 @@
|
||||||
"navigationBarTitleText": "我的",
|
"navigationBarTitleText": "我的",
|
||||||
"enablePullDownRefresh": true
|
"enablePullDownRefresh": true
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/member/cash-withdraw",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "我要提现",
|
||||||
|
"enablePullDownRefresh": true
|
||||||
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"globalStyle": {
|
"globalStyle": {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
<template>
|
||||||
|
<app-layout title="我要提现">
|
||||||
|
<view class="withdraw-section">
|
||||||
|
<view class="title">提现金额</view>
|
||||||
|
<view class="input-box">
|
||||||
|
<text class="icon">¥</text>
|
||||||
|
<input
|
||||||
|
class="input"
|
||||||
|
type="number"
|
||||||
|
v-model="money"
|
||||||
|
placeholder="请输入提现金额，不可低于20元"
|
||||||
|
placeholder-class="placeholder-style-4"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
<view class="total-box">
|
||||||
|
<text class="text">可提现金额：</text>
|
||||||
|
<text class="num">¥0.00</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="withdraw-section withdraw-desc">
|
||||||
|
<view class="title">提现说明</view>
|
||||||
|
<view class="content">
|
||||||
|
1、提现周期为每周三提现一次，2小时内到账 2、请谨慎绑定微信号，信息错误将导致错误打款，责任由师傅自行承担
|
||||||
|
3、家居售后问题通常在用户试用中出现，如漏水、渗水、堵塞、固定松动等，因此平台对服务后订单设置7日反馈期，反馈期内若服务无售后问题，或非安装问题所造成售后，反馈期过后该笔订单金额自动转入可提现余额。
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="common-save-form-btn">
|
||||||
|
<view class="btn">确定提现</view>
|
||||||
|
</view>
|
||||||
|
</app-layout>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AppLayout from "@/components/layout/layout";
|
||||||
|
export default {
|
||||||
|
name: "member-cash-withdraw",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
AppLayout,
|
||||||
|
},
|
||||||
|
onLoad() {},
|
||||||
|
onShow() {},
|
||||||
|
onReady() {},
|
||||||
|
onReachBottom() {},
|
||||||
|
onPullDownRefresh() {},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.withdraw-section {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 38rpx 46rpx;
|
||||||
|
background-color: #ffffff;
|
||||||
|
.title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #2d2d2d;
|
||||||
|
line-height: 30rpx;
|
||||||
|
}
|
||||||
|
.input-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin: 50rpx 0;
|
||||||
|
.icon {
|
||||||
|
font-size: 48rpx;
|
||||||
|
line-height: 48rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #f83232;
|
||||||
|
}
|
||||||
|
.input {
|
||||||
|
width: 500rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #666666;
|
||||||
|
margin-left: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.total-box {
|
||||||
|
line-height: 30rpx;
|
||||||
|
.text {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.num {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #fb3636;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.withdraw-desc {
|
||||||
|
margin-top: 28rpx;
|
||||||
|
.content {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999999;
|
||||||
|
line-height: 40rpx;
|
||||||
|
padding: 50rpx 0 80rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :hasPaddingTop="false">
|
<app-layout v-model="safePt" btnType="unset" headerBackgroundColor="unset" :hasPaddingTop="false" :layoutPb="utils.rpx2px(40)">
|
||||||
<view class="member-container">
|
<view class="member-container">
|
||||||
<view class="immerse-image">
|
<view class="immerse-image">
|
||||||
<image class="image" :src="backgroundImage" mode="aspectFill" />
|
<image class="image" :src="backgroundImage" mode="aspectFill" />
|
||||||
|
|
@ -57,6 +57,42 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="member-section">
|
||||||
|
<view class="menu-item" @click="utils.toPage('/pages/member/cash-withdraw')">
|
||||||
|
<text class="title">我要提现</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">服务无忧保</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">提现记录</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">明细</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="member-section">
|
||||||
|
<view class="menu-item" @click="utils.toPage('/pages/member/service-info')">
|
||||||
|
<text class="title">设置服务信息</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">我的评价</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">在线客服</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="menu-item">
|
||||||
|
<text class="title">设置</text>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</app-layout>
|
</app-layout>
|
||||||
|
|
@ -191,4 +227,42 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.member-section {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 15rpx 22rpx;
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 22rpx;
|
||||||
|
}
|
||||||
|
.menu-item {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 36rpx 0;
|
||||||
|
border-bottom: 2rpx solid #efefef;
|
||||||
|
.title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333333;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
line-height: 30rpx;
|
||||||
|
}
|
||||||
|
.title::before {
|
||||||
|
display: inline-block;
|
||||||
|
content: "";
|
||||||
|
width: 12rpx;
|
||||||
|
height: 27rpx;
|
||||||
|
background: #8b9aeb;
|
||||||
|
margin-right: 14rpx;
|
||||||
|
}
|
||||||
|
.iconfont {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #666666;
|
||||||
|
line-height: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.menu-item:last-child {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -0,0 +1,244 @@
|
||||||
|
<template>
|
||||||
|
<app-layout title="设置服务信息">
|
||||||
|
<view class="service-info-container">
|
||||||
|
<view class="tips-box">
|
||||||
|
<widget-tips text="完成入驻后，平台将会根据您所设置的服务信息推送消息" textColor="#ffa800" />
|
||||||
|
</view>
|
||||||
|
<view class="service-form-container">
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="title">*我的头像</text>
|
||||||
|
<view class="headimg-box" @click="uploadHeadImg">
|
||||||
|
<image class="image" :src="headimg" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="title">*服务区域</text>
|
||||||
|
<picker mode="selector" :range="areaList" range-key="name" @change="changeArea" class="select-widget">
|
||||||
|
<text class="limit-line clamp-1">
|
||||||
|
{{ areaText ? areaText : "请选择服务区域" }}
|
||||||
|
</text>
|
||||||
|
</picker>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="title">*服务分类</text>
|
||||||
|
<picker mode="selector" :range="cateList" range-key="name" @change="changeCate" class="select-widget">
|
||||||
|
<text class="limit-line clamp-1">
|
||||||
|
{{ cateText ? cateText : "请选择服务分类" }}
|
||||||
|
</text>
|
||||||
|
</picker>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="title">车辆类型</text>
|
||||||
|
<picker mode="selector" :range="carTypeList" range-key="name" @change="changeCarType" class="select-widget">
|
||||||
|
<text class="limit-line clamp-1">
|
||||||
|
{{ carTypeText ? carTypeText : "请选择车辆类型" }}
|
||||||
|
</text>
|
||||||
|
</picker>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="input-item">
|
||||||
|
<text class="title">*服务类型</text>
|
||||||
|
<picker
|
||||||
|
mode="selector"
|
||||||
|
:range="serviceTypeList"
|
||||||
|
range-key="name"
|
||||||
|
@change="changeServiceType"
|
||||||
|
class="select-widget"
|
||||||
|
>
|
||||||
|
<text class="limit-line clamp-1">
|
||||||
|
{{ serviceTypeText ? serviceTypeText : "请选择服务类型" }}
|
||||||
|
</text>
|
||||||
|
</picker>
|
||||||
|
<text class="iconfont icon-jinru"></text>
|
||||||
|
</view>
|
||||||
|
<view class="input-item-section">
|
||||||
|
<text class="title">*认证资料<text class="desc">请录入身份资料</text></text>
|
||||||
|
<view class="profile-box">
|
||||||
|
<input
|
||||||
|
class="username"
|
||||||
|
v-model="username"
|
||||||
|
placeholder="请输入您的姓名"
|
||||||
|
placeholder-class="placeholder-style-6"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="common-save-form-btn">
|
||||||
|
<view class="btn">提交审核</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</app-layout>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AppLayout from "@/components/layout/layout";
|
||||||
|
import WidgetTips from "@/components/widgets/tips";
|
||||||
|
export default {
|
||||||
|
name: "member-service-info",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
headimg: require("@/static/temp/member/2.png"),
|
||||||
|
areaList: [
|
||||||
|
{
|
||||||
|
name: "绵阳",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "成都",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
cateList: [
|
||||||
|
{
|
||||||
|
name: "空调安装",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "装修服务",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
carTypeList: [
|
||||||
|
{
|
||||||
|
name: "大巴",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "轿车",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
serviceTypeList: [
|
||||||
|
{
|
||||||
|
name: "全职",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "兼职",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
areaId: 0,
|
||||||
|
areaText: "",
|
||||||
|
cateId: 0,
|
||||||
|
cateText: "",
|
||||||
|
carTypeId: 0,
|
||||||
|
carTypeText: "",
|
||||||
|
serviceTypeId: 0,
|
||||||
|
serviceTypeText: "",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
AppLayout,
|
||||||
|
WidgetTips,
|
||||||
|
},
|
||||||
|
onLoad() {},
|
||||||
|
onShow() {},
|
||||||
|
onReady() {},
|
||||||
|
onReachBottom() {},
|
||||||
|
onPullDownRefresh() {},
|
||||||
|
methods: {
|
||||||
|
uploadHeadImg() {
|
||||||
|
uni.chooseImage({});
|
||||||
|
},
|
||||||
|
changeArea(e) {
|
||||||
|
this.areaText = this.areaList[e.detail.value].name;
|
||||||
|
},
|
||||||
|
changeCate(e) {
|
||||||
|
this.cateText = this.cateList[e.detail.value].name;
|
||||||
|
},
|
||||||
|
changeCarType(e) {
|
||||||
|
this.carTypeText = this.carTypeList[e.detail.value].name;
|
||||||
|
},
|
||||||
|
changeServiceType(e) {
|
||||||
|
this.serviceTypeText = this.serviceTypeList[e.detail.value].name;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.service-info-container {
|
||||||
|
width: 710rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.service-form-container {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 14rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 16rpx;
|
||||||
|
background-color: #ffffff;
|
||||||
|
.input-item:last-child {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
.input-item {
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 44rpx 0;
|
||||||
|
border-bottom: 2rpx solid #e8e7e7;
|
||||||
|
.title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #2d2d2d;
|
||||||
|
}
|
||||||
|
.iconfont {
|
||||||
|
color: #a7a7a7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.select-widget {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 190rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #c9c9c9;
|
||||||
|
}
|
||||||
|
.headimg-box {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-right: 60rpx;
|
||||||
|
.image {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.input-item-section {
|
||||||
|
padding: 44rpx 0;
|
||||||
|
.title {
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #2d2d2d;
|
||||||
|
}
|
||||||
|
.desc {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #c9c9c9;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 190rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.profile-box {
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 34rpx 10rpx;
|
||||||
|
.username {
|
||||||
|
width: 100%;
|
||||||
|
padding: 32rpx 0;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #666666;
|
||||||
|
line-height: 30rpx;
|
||||||
|
border-bottom: 2rpx solid #e8e7e7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue