diff --git a/src/pages/member/service-info.vue b/src/pages/member/service-info.vue
index a3e6ea2..d3c4ab0 100644
--- a/src/pages/member/service-info.vue
+++ b/src/pages/member/service-info.vue
@@ -14,7 +14,14 @@
*服务区域
-
+
{{ areaText ? areaText : "请选择服务区域" }}
@@ -23,7 +30,14 @@
*服务分类
-
+
{{ cateText ? cateText : "请选择服务分类" }}
@@ -32,7 +46,14 @@
车辆类型
-
+
{{ carTypeText ? carTypeText : "请选择车辆类型" }}
@@ -47,6 +68,7 @@
range-key="name"
@change="changeServiceType"
class="select-widget"
+ :class="{ active: serviceTypeText.length > 0 }"
>
{{ serviceTypeText ? serviceTypeText : "请选择服务类型" }}
@@ -61,8 +83,43 @@
class="username"
v-model="username"
placeholder="请输入您的姓名"
- placeholder-class="placeholder-style-6"
+ placeholder-class="placeholder-style-5"
/>
+ 请上传您的身份证
+
+
+
+
+
+ 上传身份证正面
+
+
+
+
+
+
+ 上传身份证反面
+
+
+
+
+
+
+ 服务资质电工相关服务分类必上传
+
+
+
+
+
+ 上传资质
+
+
+
+
+
+ *自我介绍请输入个人的简要介绍
+
+
@@ -80,6 +137,7 @@ export default {
name: "member-service-info",
data() {
return {
+ maxContentLength: 300,
headimg: require("@/static/temp/member/2.png"),
areaList: [
{
@@ -121,6 +179,10 @@ export default {
carTypeText: "",
serviceTypeId: 0,
serviceTypeText: "",
+ idcardA: "",
+ idcardB: "",
+ license: "",
+ content: "",
};
},
components: {
@@ -136,6 +198,15 @@ export default {
uploadHeadImg() {
uni.chooseImage({});
},
+ uploadIdCardA() {
+ uni.chooseImage({});
+ },
+ uploadIdCardB() {
+ uni.chooseImage({});
+ },
+ uploadLicense() {
+ uni.chooseImage({});
+ },
changeArea(e) {
this.areaText = this.areaList[e.detail.value].name;
},
@@ -163,82 +234,162 @@ export default {
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;
}
- .input-item {
+ .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;
+}
+.select-widget.active {
+ color: #666666;
+}
+.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;
+ border-bottom: 2rpx solid #e8e7e7;
+ .title {
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;
- }
+ display: block;
+ font-size: 30rpx;
+ color: #2d2d2d;
}
- .select-widget {
+ .desc {
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;
- }
+ padding-left: 190rpx;
}
- .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 {
+}
+.input-item-section.license {
+ border-bottom: 0;
+ padding-bottom: 0;
+}
+.profile-box {
+ width: 100%;
+ box-sizing: border-box;
+ padding: 34rpx 10rpx 0 10rpx;
+ .username {
width: 100%;
- box-sizing: border-box;
- padding: 34rpx 10rpx;
- .username {
+ padding: 32rpx 0;
+ font-size: 30rpx;
+ color: #666666;
+ line-height: 30rpx;
+ border-bottom: 2rpx solid #e8e7e7;
+ }
+}
+.upload-title {
+ display: block;
+ font-size: 30rpx;
+ color: #666666;
+ line-height: 30rpx;
+ margin: 44rpx 0;
+}
+.upload-idcard {
+ display: flex;
+ justify-content: center;
+ .idcard-item:first-child {
+ margin-right: 22rpx;
+ }
+ .idcard-item {
+ background: #f6f6f6;
+ }
+ .image,
+ .icon {
+ width: 273rpx;
+ height: 164rpx;
+ }
+ .icon {
+ text-align: center;
+ .iconfont {
+ display: inline-block;
width: 100%;
- padding: 32rpx 0;
- font-size: 30rpx;
+ font-size: 120rpx;
+ color: #cccccc;
+ }
+ .text {
+ font-size: 24rpx;
color: #666666;
- line-height: 30rpx;
- border-bottom: 2rpx solid #e8e7e7;
+ line-height: 24rpx;
}
}
}
+.section-content-box {
+ margin-top: 40rpx;
+ padding: 0 10rpx;
+ .upload-image {
+ display: inline-block;
+ border: 1rpx solid #999999;
+ }
+ .image,
+ .icon {
+ width: 136rpx;
+ height: 136rpx;
+ }
+ .icon {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ .iconfont {
+ font-size: 60rpx;
+ color: #999999;
+ line-height: 60rpx;
+ }
+ .text {
+ font-size: 24rpx;
+ color: #999999;
+ line-height: 24rpx;
+ margin-top: 16rpx;
+ }
+ }
+ .textarea {
+ width: 100%;
+ height: 164rpx;
+ border: 2rpx solid #d8d8d8;
+ box-sizing: border-box;
+ padding: 10rpx;
+ color: #666666;
+ font-size: 30rpx;
+ }
+}
\ No newline at end of file