angelo
/
web-store-retail-h5
forked from angelo/web-retail-h5
3
0
Fork 0
Code Pull Requests Activity

feat(selfSerivce): 自助服务-户籍变更跳转逻辑处理

This commit is contained in:
woody 2025-05-26 17:58:09 +08:00
parent 17f6fb9228
commit b66e3243de
3 changed files with 557 additions and 559 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

118
pages/selfService/index.vue
View File

@ -1,26 +1,26 @@
<template>
<view class="content">
<view @click="goRouter(item.path)"
<view
@click="goRouter(item.path)"
class="kuaibox"
v-for="(item, index) in theselfHeader"
:key="index">
:key="index"
>
<view class="">
{{ item.name }}
</view>
<image class="kuaiimg"
:src="item.url"
mode=""></image>
<image class="kuaiimg" :src="item.url" mode=""></image>
</view>
</view>
</template>
<script>
import * as sel from '@/config/selfService.js'
import { mapGetters } from "vuex";
import { mapGetters } from 'vuex'
export default {
computed: {
...mapGetters(["user"]),
...mapGetters(['user']),
},
data() {
return {
@ -43,12 +43,6 @@ export default {
path: '/pages/selfService/updateDomicile/updateDomicile',
id: '3',
},
{
name: '经销商认证',
url: '../../static/images/zz_jxs.png',
path: '/pages/delear/index',
id: '4',
},
// {
// name: '月度历史累计业绩',
// url: '../../static/images/zz_thhdd.png',
@ -69,97 +63,12 @@ export default {
},
],
theselfHeader: [],
userInfo:''
userInfo: '',
}
},
onLoad() {
this.userInfo = uni.getStorageSync("User");
onShow() {
this.userInfo = uni.getStorageSync('User')
this.checkIfShow()
if(this.userInfo.makerSpaceShow == 1||this.userInfo.makerSpaceShow==undefined) {
this.selfServiceList= [
{
name: '修改地址',
url: '../../static/images/zz_dz.png',
path: '/pages/selfService/updateAdress/updateAdress',
id: '1',
},
// {
// name: '订单自提',
// url: '../../static/images/zz_tjbb.png',
// path: '/pages/selfService/orderPick/orderPick',
// id: '2',
// },
{
name: '户籍变更',
url: '../../static/images/zz_gxbg.png',
path: '/pages/selfService/updateDomicile/updateDomicile',
id: '3',
},
// {
// name: '月度历史累计业绩',
// url: '../../static/images/zz_thhdd.png',
// path: '/pages/selfService/monthlyHistory/monthlyHistory',
// id: '7',
// },
{
name: '自助撤单',
url: '../../static/images/zz_gzs.png',
path: '/pages/selfService/cancleOrder/index',
id: '8',
},
{
name: '实名认证',
url: '../../static/images/zz_jxs.png',
path: '/pages/selfService/realName/realName',
id: '9',
},
]
}else{
this.selfServiceList= [
{
name: '修改地址',
url: '../../static/images/zz_dz.png',
path: '/pages/selfService/updateAdress/updateAdress',
id: '1',
},
// {
// name: '订单自提',
// url: '../../static/images/zz_tjbb.png',
// path: '/pages/selfService/orderPick/orderPick',
// id: '2',
// },
{
name: '户籍变更',
url: '../../static/images/zz_gxbg.png',
path: '/pages/selfService/updateDomicile/updateDomicile',
id: '3',
},
{
name: '体验中心发起人认证',
url: '../../static/images/zz_cxlj.png',
path: '/pages/makerspace/index',
id: '6',
},
// {
// name: '月度历史累计业绩',
// url: '../../static/images/zz_thhdd.png',
// path: '/pages/selfService/monthlyHistory/monthlyHistory',
// id: '7',
// },
{
name: '自助撤单',
url: '../../static/images/zz_gzs.png',
path: '/pages/selfService/cancleOrder/index',
id: '8',
},
{
name: '实名认证',
url: '../../static/images/zz_jxs.png',
path: '/pages/selfService/realName/realName',
id: '9',
},
]
}
},
methods: {
goRouter(path) {
@ -168,8 +77,8 @@ export default {
})
},
checkIfShow() {
sel.checkIfShow().then((res) => {
this.selfServiceList.forEach((ele) => {
sel.checkIfShow().then(res => {
this.selfServiceList.forEach(ele => {
if (ele.id == 1) {
ele.ifshow = res.data.existAddress
} else if (ele.id == 2) {
@ -192,8 +101,7 @@ export default {
}
})
const theselfHeader = []
this.selfServiceList.forEach((element) => {
this.selfServiceList.forEach(element => {
if (element.ifshow == 0) {
theselfHeader.push(element)
}

396
pages/selfService/updateDomicile/addDomicile.vue
View File

@ -1,89 +1,185 @@
<template>
<view class="main">
<view class="contents">
<u-form :model="dataForm" labelWidth="auto" ref="uForm">
<view class="view-class">
<u-form-item :label="'会员姓名'" label-width="200rpx" prop="memberName">
<u-input v-model="dataForm.memberName" disabled placeholder-class="place-class"
class="border-color" placeholder="请输入收货人姓名" />
<u-form-item
:label="'会员姓名'"
label-width="200rpx"
prop="memberName"
>
<u-input
v-model="dataForm.memberName"
disabled
placeholder-class="place-class"
class="border-color"
placeholder="请输入收货人姓名"
/>
</u-form-item>
</view>
<view class="view-class">
<u-form-item :label="'联系方式'" label-width="200rpx" prop="phone">
<u-input v-model="dataForm.phone" disabled placeholder-class="place-class" class="border-color"
placeholder="请输入联系方式" />
<u-input
v-model="dataForm.phone"
disabled
placeholder-class="place-class"
class="border-color"
placeholder="请输入联系方式"
/>
</u-form-item>
</view>
<view class="view-class">
<u-form-item label="新会员姓名" label-width="200rpx" prop="changeMemberName">
<u-input v-model="dataForm.changeMemberName" placeholder-class="place-class"
class="border-color" placeholder="请输入收货人姓名" />
<u-form-item
label="新会员姓名"
label-width="200rpx"
prop="changeMemberName"
>
<u-input
v-model="dataForm.changeMemberName"
placeholder-class="place-class"
class="border-color"
placeholder="请输入收货人姓名"
/>
</u-form-item>
</view>
<view class="view-class">
<u-form-item label="新联系方式" label-width="200rpx" prop="changePhone">
<u-input v-model="dataForm.changePhone" placeholder-class="place-class" class="border-color"
placeholder="请输入联系方式" />
<u-form-item
label="新联系方式"
label-width="200rpx"
prop="changePhone"
>
<u-input
v-model="dataForm.changePhone"
placeholder-class="place-class"
class="border-color"
placeholder="请输入联系方式"
/>
</u-form-item>
</view>
<view class="view-class">
<u-form-item label-width="200rpx" :label="'验证码'" prop="verificationCode" borderBottom ref="item1">
<u--input v-model="dataForm.verificationCode" placeholder="请输入" border="none"></u--input>
<u-button @tap='getCode' class="getcodes" type="primary" shape="circle" :text="tips"
color="#2FBC42"></u-button>
<u-form-item
label-width="200rpx"
:label="'验证码'"
prop="verificationCode"
borderBottom
ref="item1"
>
<u--input
v-model="dataForm.verificationCode"
placeholder="请输入"
border="none"
></u--input>
<u-button
@tap="getCode"
class="getcodes"
type="primary"
shape="circle"
:text="tips"
color="#2FBC42"
></u-button>
</u-form-item>
</view>
<view class="view-class">
<u-form-item label="情况说明" class="label-style" label-width="200rpx" prop="description">
<u-textarea v-model="dataForm.description" placeholder-class="place-class" class="border-color"
placeholder="请输入情况说明" />
<u-form-item
label="情况说明"
class="label-style"
label-width="200rpx"
prop="description"
>
<u-textarea
v-model="dataForm.description"
placeholder-class="place-class"
class="border-color"
placeholder="请输入情况说明"
/>
</u-form-item>
</view>
<view class="view-class" style="display: flex; align-items: center;justify-content: space-between;">
<u-form-item labelPosition='top' required label-width="200rpx" label="原证件(正面)">
<uploadImg :ifsfz='true' @imageUploaded='imageUploaded3' prop="idFront"
style="margin-right: 30rpx;" :bgimg="`../../../static/images/idCard1.png`"
v-model="dataForm.idFront"></uploadImg>
<view
class="view-class"
style="
display: flex;
align-items: center;
justify-content: space-between;
"
>
<u-form-item
labelPosition="top"
required
label-width="200rpx"
label="原证件(正面)"
>
<uploadImg
:ifsfz="true"
@imageUploaded="imageUploaded3"
prop="idFront"
style="margin-right: 30rpx"
:bgimg="`../../../static/images/idCard1.png`"
v-model="dataForm.idFront"
></uploadImg>
</u-form-item>
<u-form-item labelPosition='top' required label-width="200rpx" label="原证件(反面)">
<uploadImg :ifsfz='true' @imageUploaded='imageUploaded4' prop="idBack"
style="margin-right: 30rpx;" :bgimg="`../../../static/images/idCard2.png`"
v-model="dataForm.idBack"></uploadImg>
<u-form-item
labelPosition="top"
required
label-width="200rpx"
label="原证件(反面)"
>
<uploadImg
:ifsfz="true"
@imageUploaded="imageUploaded4"
prop="idBack"
style="margin-right: 30rpx"
:bgimg="`../../../static/images/idCard2.png`"
v-model="dataForm.idBack"
></uploadImg>
</u-form-item>
<!-- <u-form-item labelPosition='top' label="原会员证件照片" prop="remark">
<image class="idImages" style="margin-right: 20rpx;" :src="dataForm.idFront" mode=""></image>
<image class="idImages" :src="dataForm.idBack" mode=""></image>
</u-form-item> -->
</view>
<view class="view-class" style="display: flex; align-items: center;justify-content: space-between;">
<view
class="view-class"
style="
display: flex;
align-items: center;
justify-content: space-between;
"
>
<!-- <u-form-item labelPosition='top' label="新会员证件照片" prop="changeIdFront">
<uploadImg style="margin-right: 30rpx;" :bgimg="`../../../static/images/idCard1.png`"
v-model="dataForm.changeIdFront"></uploadImg>
<uploadImg :bgimg="`../../../static/images/idCard2.png`" v-model="dataForm.changeIdBack">
</uploadImg>
</u-form-item> -->
<u-form-item labelPosition='top' required label-width="180rpx" label="证件(正面)">
<uploadImg :ifsfz='true' @imageUploaded='imageUploaded1' prop="changeIdFront"
style="margin-right: 30rpx;" :bgimg="`../../../static/images/idCard1.png`"
v-model="dataForm.changeIdFront"></uploadImg>
<u-form-item
labelPosition="top"
required
label-width="180rpx"
label="证件(正面)"
>
<uploadImg
:ifsfz="true"
@imageUploaded="imageUploaded1"
prop="changeIdFront"
style="margin-right: 30rpx"
:bgimg="`../../../static/images/idCard1.png`"
v-model="dataForm.changeIdFront"
></uploadImg>
</u-form-item>
<u-form-item labelPosition='top' required label-width="180rpx" label="证件(反面)">
<uploadImg :ifsfz='true' @imageUploaded='imageUploaded2' prop="changeIdBack"
style="margin-right: 30rpx;" :bgimg="`../../../static/images/idCard2.png`"
v-model="dataForm.changeIdBack"></uploadImg>
<u-form-item
labelPosition="top"
required
label-width="180rpx"
label="证件(反面)"
>
<uploadImg
:ifsfz="true"
@imageUploaded="imageUploaded2"
prop="changeIdBack"
style="margin-right: 30rpx"
:bgimg="`../../../static/images/idCard2.png`"
v-model="dataForm.changeIdBack"
></uploadImg>
</u-form-item>
</view>
<!-- <view class="view-class">
@ -94,50 +190,38 @@
</view> -->
<view class="view-class">
<u-form-item :label="'备注'" label-width="200rpx" prop="remark">
<u-input v-model="dataForm.remark" placeholder-class="place-class" class="border-color"
placeholder="请输入" />
<u-input
v-model="dataForm.remark"
placeholder-class="place-class"
class="border-color"
placeholder="请输入"
/>
</u-form-item>
</view>
<u-code :seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-code>
<u-code
:seconds="seconds"
@end="end"
@start="start"
ref="uCode"
@change="codeChange"
></u-code>
</u-form>
</view>
<u-button type="success" shape="circle" class="btn" @click="submit">{{'确定'}}</u-button>
<u-popup class="thePopup" :show="successShow" mode="center" @close="successShow = false">
<view class="successPopup">
<view class="poupTop">
<view class="theiconbox">
<u-icon name="checkbox-mark" color="#ffffff" size="26"></u-icon>
</view>
<view class="theicontitle">
提交成功
</view>
</view>
<view class="poupContent">
我们将在24小时内完成业务受理！具体进度将会以
短信通知形式发送您，请注意查收！</br>
<!-- 售后电话：400-111-2818 -->
</view>
<view class="poupBtn" @click="sureBtn">
确定
</view>
</view>
</u-popup>
<u-button type="success" shape="circle" class="btn" @click="submit">{{
'确定'
}}</u-button>
</view>
</template>
<script>
import * as sel from '@/config/selfService.js'
import * as ban from "@/config/balance.js"
import * as ban from '@/config/balance.js'
import uploadImg from '@/components/uploadImg.vue'
import {
setToken
} from '@/config/auth.js'
import { setToken } from '@/config/auth.js'
export default {
components: {
uploadImg
uploadImg,
},
data() {
return {
@ -147,42 +231,47 @@
defaultCode: [],
urls: '/member/api/maker-space/update-file',
dataForm: {
memberName: "",
phone: "",
changeMemberName: "",
changePhone: "",
description: "",
amount: "",
remark: "",
idFront:"",
idBack:"",
changeIdFront: "",
changeIdBack: ""
memberName: '',
phone: '',
changeMemberName: '',
changePhone: '',
description: '',
amount: '',
remark: '',
idFront: '',
idBack: '',
changeIdFront: '',
changeIdBack: '',
},
choiceValue: "",
choiceValue: '',
successShow: false,
addressList: [],
rules: {
changeMemberName: [{
changeMemberName: [
{
// 必填项
required: true,
// 提示内容（会出现在u-form-item内的底部）
message: "姓名不能为空",
}],
message: '姓名不能为空',
},
],
changeIdFront: [{
changeIdFront: [
{
// 必填项
required: true,
// 提示内容（会出现在u-form-item内的底部）
message: "证件照片不能为空",
}],
changeIdBack: [{
message: '证件照片不能为空',
},
],
changeIdBack: [
{
// 必填项
required: true,
// 提示内容（会出现在u-form-item内的底部）
message: "证件照片不能为空",
}],
message: '证件照片不能为空',
},
],
// description: [{
// // 必填项
// required: true,
@ -191,31 +280,36 @@
// trigger: ["change"],
// }],
changePhone: [{
changePhone: [
{
required: true,
message: "请输入手机号",
trigger: ["blur"],
message: '请输入手机号',
trigger: ['blur'],
},
{
validator: (rule, value, callback) => {
return this.$u.test.mobile(value);
return this.$u.test.mobile(value)
},
message: "手机号格式不正确",
trigger: ["blur"],
message: '手机号格式不正确',
trigger: ['blur'],
},
],
idFront: [{
idFront: [
{
// 必填项
required: true,
// 提示内容（会出现在u-form-item内的底部）
message: "原证件照片不能为空",
}],
idBack: [{
message: '原证件照片不能为空',
},
],
idBack: [
{
// 必填项
required: true,
// 提示内容（会出现在u-form-item内的底部）
message: "原证件照片不能为空",
}],
message: '原证件照片不能为空',
},
],
},
tips: '',
seconds: 60,
@ -223,12 +317,10 @@
},
onLoad() {
this.applyChange()
},
onReady() {
this.$refs.uForm.setRules(this.rules);
this.$refs.uForm.setRules(this.rules)
},
methods: {
@ -245,35 +337,36 @@
this.dataForm.idBack = url
},
applyChange() {
sel.showChangeDomicile().then((res) => {
this.dataForm = res.data;
});
sel.showChangeDomicile().then(res => {
this.dataForm = res.data
})
},
codeChange(text) {
this.tips = text;
this.tips = text
},
getCode() {
if (this.dataForm.changePhone) {
if (this.$refs.uCode.canGetCode) {
// 模拟向后端请求验证码
uni.showLoading({
title: '正在获取验证码'
title: '正在获取验证码',
})
ban.getVerification({
phone: this.dataForm.changePhone
}).then((res) => {
uni.hideLoading();
ban
.getVerification({
phone: this.dataForm.changePhone,
})
.then(res => {
uni.hideLoading()
// 这里此提示会被this.start()方法中的提示覆盖
uni.$u.toast('验证码已发送');
uni.$u.toast('验证码已发送')
// 通知验证码组件内部开始倒计时
this.$refs.uCode.start();
this.$refs.uCode.start()
})
} else {
uni.$u.toast('倒计时结束后再发送');
uni.$u.toast('倒计时结束后再发送')
}
} else {
uni.$u.toast("请先输入手机号")
uni.$u.toast('请先输入手机号')
return
}
},
@ -285,17 +378,19 @@
},
submit() {
this.$refs.uForm.validate().then((res) => {
sel.saveChangeDomicile(this.dataForm).then((res) => {
this.$refs.uForm.validate().then(res => {
sel.saveChangeDomicile(this.dataForm).then(res => {
if (res.code == '200') {
// uni.showToast({
// title: res.msg,
// icon: 'none',
// success() {
// }
// })
this.successShow = true
uni.showToast({
title: '修改成功',
icon: 'none',
success() {
setTimeout(() => {
uni.navigateBack()
}, 600)
},
})
// this.successShow = true
}
})
})
@ -303,9 +398,6 @@
sureBtn() {
uni.navigateBack()
},
},
}
</script>
@ -362,7 +454,7 @@
view {
width: 36rpx;
height: 36rpx;
border: 1rpx solid #DDDDDD;
border: 1rpx solid #dddddd;
border-radius: 50%;
margin-top: 25rpx;
}
@ -386,7 +478,7 @@
font-size: 28rpx;
font-family: Source Han Sans CN;
font-weight: 400;
color: #005BAC;
color: #005bac;
}
}
@ -411,7 +503,6 @@
.border-color {
border: none;
}
page {
@ -425,11 +516,10 @@
width: 316rpx;
height: 192rpx;
}
}
.btn {
background-color: #005BAC;
background-color: #005bac;
border: none;
height: 92rpx;
line-height: 92rpx;
@ -440,7 +530,7 @@
.successPopup {
width: 560rpx;
background: #FFFFFF;
background: #ffffff;
border-radius: 20rpx;
padding: 26rpx 60rpx;
@ -475,13 +565,13 @@
}
.poupBtn {
background: #005BAC;
background: #005bac;
border-radius: 39rpx;
padding: 26rpx 0;
display: flex;
align-items: center;
justify-content: center;
color: #FFFFFF;
color: #ffffff;
margin-top: 70rpx;
margin-bottom: 40rpx;
}
@ -494,7 +584,7 @@
.getcodes {
width: 197rpx;
// height: 76rpx;
background: #2FBC42;
background: #2fbc42;
border-radius: 38rpx;
color: #fff;
}

6
pages/selfService/updateDomicile/updateDomicile.vue
View File

@ -1,6 +1,6 @@
<template>
<view class="content">
<view class="tab">
<!-- <view class="tab">
<view
v-for="(item, index) in tabList"
:key="index"
@ -10,7 +10,7 @@
>
{{ item.label }}
</view>
</view>
</view> -->
<template v-if="tableData.length > 0">
<view class="thecontent" v-for="(item, index) in tableData" :key="index">
@ -177,7 +177,7 @@ export default {
.join('&')
// let paramsString = encodeURIComponent(JSON.stringify(params))
uni.navigateTo({
uni.redirectTo({
url: '/pages/selfService/updateDomicile/addDomicile?' + queryString,
})
}