2021-08-19 06:40:59 +00:00
|
|
|
|
<template>
|
2021-08-26 09:57:04 +00:00
|
|
|
|
<view>
|
2021-08-19 06:40:59 +00:00
|
|
|
|
<!-- 状态栏 -->
|
2021-08-19 09:27:37 +00:00
|
|
|
|
<status-nav :titleVal="'修改资料'" :whereCome="whereCome" :statusTitle="true"></status-nav>
|
2021-08-19 06:40:59 +00:00
|
|
|
|
<!-- 自定义二级分类 -->
|
|
|
|
|
|
<!-- 列表 -->
|
2022-04-11 02:12:11 +00:00
|
|
|
|
<view :style="{paddingTop: statusHeight+'px'}" class="fon28 pad-x20">
|
2021-08-19 06:40:59 +00:00
|
|
|
|
<view v-for="(itemd,indexd) in dataList" :key="indexd"
|
|
|
|
|
|
class="disjbac borbot mar-zy40" :class="(indexd!=1 && indexd!=5 && indexd!=6) ? 'pad-sx40':''">
|
|
|
|
|
|
<!-- 标题 -->
|
|
|
|
|
|
<view class="col9 flexs" style="width: 17.8%;">
|
|
|
|
|
|
<view v-if="indexd!=2 && indexd!=3 && indexd!=7">{{itemd.title}}:</view>
|
|
|
|
|
|
<!-- 恒美ID -->
|
|
|
|
|
|
<view v-if="indexd==2" class="disjb">
|
|
|
|
|
|
<view class="disjb width100">
|
|
|
|
|
|
<view>{{itemd.title.charAt(0)}}</view>
|
|
|
|
|
|
<view>{{itemd.title.charAt(1)}}</view>
|
|
|
|
|
|
<view>{{itemd.title.charAt(2)}}{{itemd.title.charAt(3)}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view>:</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 性别、地址 -->
|
|
|
|
|
|
<view v-if="indexd==3 || indexd==7" class="disjb">
|
|
|
|
|
|
<view class="disjb width100">
|
|
|
|
|
|
<view>{{itemd.title.charAt(0)}}</view>
|
|
|
|
|
|
<view>{{itemd.title.charAt(1)}}</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view>:</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="disac fe width100 tright">
|
|
|
|
|
|
<!-- 内容 -->
|
|
|
|
|
|
<view v-if="itemd.content!='' && (indexd!=1 && indexd!=5 && indexd!=6)" :class="indexd==1?'nic':'col3'" class="mar-y20 width100" :style="{marginRight:indexd==2?'39rpx':''}">{{itemd.content}}</view>
|
|
|
|
|
|
<!-- 性别下拉弹框 -->
|
|
|
|
|
|
<picker v-if="indexd==3" class="col3 mar-y20 width100" @change="changePicker" :value="current" :range="pickerData">
|
|
|
|
|
|
<view>{{pickerData[current]}}</view>
|
|
|
|
|
|
</picker>
|
|
|
|
|
|
<!-- 出生日期下拉框 -->
|
|
|
|
|
|
<picker v-if="indexd==4" mode="date" class="col3 mar-y20 width100" @change="changeTime" :value="currentt" :range="pickerTime">
|
|
|
|
|
|
<view>{{pickerTime[currentt]}}</view>
|
|
|
|
|
|
</picker>
|
|
|
|
|
|
<!-- 地址下拉框 -->
|
|
|
|
|
|
<!-- <picker v-if="indexd==7" mode="multiSelector" class="col3 mar-y20 width100" @change="changeAddress" :value="currenta" :range="pickerAddress">
|
|
|
|
|
|
<view>{{pickerAddress[0]}}{{pickerAddress[1]}}{{pickerAddress[2]}}</view>
|
|
|
|
|
|
</picker> -->
|
|
|
|
|
|
<!-- <view v-if="indexd==7" @tap="openPicker" class="width100 mar-y20">{{region}}</view> -->
|
|
|
|
|
|
<view v-if="indexd==7" @tap="openAddres2" class="width100 mar-y20">{{pickerText}}</view>
|
|
|
|
|
|
<!-- 用户昵称、真实姓名、联系电话输入框 -->
|
2022-01-12 04:24:29 +00:00
|
|
|
|
<input @focus="inputFo(indexd)" @blur="inputB(indexd)" v-if="indexd==1 || indexd==5 || indexd==6" :disabled="indexd==6" :type="(indexd==1 || indexd==5)?'text':'number'" :maxlength="indexd==6?11:10" v-model="itemd.content" class="mar-y20 tright pad-sx40 width100" style="border: none;" :placeholder="itemd.fcon"/>
|
2021-08-19 06:40:59 +00:00
|
|
|
|
<!-- 用户头像 -->
|
|
|
|
|
|
<image v-if="indexd==0" :src="itemd.imgSrc || moHead" :class="indexd==0?'head_img':'head_next'" class="" mode="aspectFill"></image>
|
|
|
|
|
|
<!-- <image @tap="chooseHead" v-if="itemd.imgSrc!=''" :src="itemd.imgSrc" :class="indexd==0?'head_img':'head_next'" class="" mode="aspectFill"></image> -->
|
|
|
|
|
|
<!-- 前进键 -->
|
|
|
|
|
|
<image v-if="indexd!=0 && indexd!=2" src="/static/public/nexth.png" class="head_next flexs"></image>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="" @tap="updataInfo" style="height: 90rpx;line-height: 90rpx;margin: 80rpx 100rpx 120rpx 100rpx;" class="radius20 fon40 bold colf tc" :style="{background:publicColor}">{{btnCon}}</view>
|
2022-04-13 12:50:09 +00:00
|
|
|
|
<!-- 底部弹框 -->
|
2021-08-19 06:40:59 +00:00
|
|
|
|
<!-- <city @choseVal="choseValue" :lotusAddressData="lotusAddressData"></city> -->
|
|
|
|
|
|
<simple-address ref="simpleAddress" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onConfirm" themeColor="#007AFF"></simple-address>
|
2021-08-26 09:57:04 +00:00
|
|
|
|
<!-- 底部客服 -->
|
|
|
|
|
|
<public-customer :nbottom="100"></public-customer>
|
2021-08-19 06:40:59 +00:00
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import simpleAddress from '@/components/simple-address/simple-address.vue';
|
|
|
|
|
|
export default {
|
|
|
|
|
|
components:{
|
|
|
|
|
|
// city,
|
|
|
|
|
|
simpleAddress
|
|
|
|
|
|
},
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
moHead:'/static/public/logo.png',
|
|
|
|
|
|
dataList:[
|
|
|
|
|
|
{title:'用户头像',content:'',imgSrc:'',fcon:''},
|
|
|
|
|
|
{title:'用户昵称',content:'',imgSrc:'',fcon:'请输入用户昵称'},
|
|
|
|
|
|
{title:'恒美ID',content:'',imgSrc:'',fcon:''},
|
|
|
|
|
|
{title:'性别',content:'',imgSrc:'',fcon:''},
|
|
|
|
|
|
{title:'出生日期',content:'',imgSrc:'',fcon:''},
|
|
|
|
|
|
{title:'真实姓名',content:'',imgSrc:'',fcon:'请输入真实姓名'},
|
|
|
|
|
|
{title:'联系电话',content:'',imgSrc:'',fcon:'请输入联系电话'},
|
|
|
|
|
|
{title:'地址',content:'',imgSrc:'',fcon:''},
|
|
|
|
|
|
],
|
|
|
|
|
|
isKuang:true,
|
|
|
|
|
|
current:0,
|
|
|
|
|
|
pickerData:['未知','男','女'],
|
|
|
|
|
|
currentt:0,
|
|
|
|
|
|
pickerTime:['1997-01-01'],
|
|
|
|
|
|
currenta:0,
|
|
|
|
|
|
// pickerAddress:['四川省 ','成都市 ','青羊区'],
|
|
|
|
|
|
// lotusAddressData:{
|
|
|
|
|
|
// visible:false,
|
|
|
|
|
|
// provinceName:'',
|
|
|
|
|
|
// cityName:'',
|
|
|
|
|
|
// townName:'',
|
|
|
|
|
|
// },
|
|
|
|
|
|
// region:'四川省成都市成华区',
|
|
|
|
|
|
cityPickerValueDefault: [0, 0, 1],
|
|
|
|
|
|
pickerText: '四川省成都市成华区',
|
|
|
|
|
|
btnCon:'保存',
|
|
|
|
|
|
uinfo:{},
|
|
|
|
|
|
addressInfo:[],
|
|
|
|
|
|
newProvice:'',//当前省份
|
|
|
|
|
|
newCity:'',//当前城市
|
2021-08-19 09:27:37 +00:00
|
|
|
|
newDistrict:'',//当前区县
|
2021-08-26 01:50:19 +00:00
|
|
|
|
whereCome:0,
|
2021-08-19 06:40:59 +00:00
|
|
|
|
}
|
|
|
|
|
|
},
|
2022-04-02 09:56:53 +00:00
|
|
|
|
computed: {
|
|
|
|
|
|
// 主题颜色
|
|
|
|
|
|
publicColor() {
|
|
|
|
|
|
return this.$store.state.publicColor
|
2022-04-11 02:12:11 +00:00
|
|
|
|
},
|
|
|
|
|
|
statusHeight() {
|
|
|
|
|
|
return this.$store.state.statusHeight
|
2022-04-02 09:56:53 +00:00
|
|
|
|
}
|
|
|
|
|
|
},
|
2021-08-22 08:53:12 +00:00
|
|
|
|
onShow() {
|
2022-03-09 10:06:05 +00:00
|
|
|
|
// 禁用小程序分享
|
|
|
|
|
|
this.$toolAll.tools.disableShareEv();
|
2021-08-22 08:53:12 +00:00
|
|
|
|
},
|
|
|
|
|
|
onUnload() {
|
|
|
|
|
|
uni.removeStorageSync('firstInfo')
|
|
|
|
|
|
},
|
2021-08-19 09:27:37 +00:00
|
|
|
|
onLoad(options) {
|
|
|
|
|
|
if(options.whereNum==2){
|
|
|
|
|
|
this.whereCome = options.whereNum
|
|
|
|
|
|
}
|
2021-08-19 06:40:59 +00:00
|
|
|
|
let chuo = new Date().getTime()// 获取当前时间戳
|
|
|
|
|
|
let time = this.$toolAll.tools.timestampToTime(chuo)// 转换日期格式为XXXX-XX-XX
|
|
|
|
|
|
// 获取当前位置的经纬度
|
|
|
|
|
|
wx.getLocation({
|
|
|
|
|
|
success:(res)=> {
|
|
|
|
|
|
// 逆解析经纬度
|
|
|
|
|
|
this.getDistrict(res.latitude, res.longitude)
|
|
|
|
|
|
},
|
|
|
|
|
|
})
|
2021-08-22 08:53:12 +00:00
|
|
|
|
let firstObj = uni.getStorageSync('firstInfo')
|
|
|
|
|
|
if(firstObj==''){
|
|
|
|
|
|
let obj = uni.getStorageSync('uinfo')
|
|
|
|
|
|
if(obj!='') this.uinfo = obj
|
|
|
|
|
|
this.dataList[0].imgSrc = obj.headimgurl//用户头像
|
|
|
|
|
|
this.dataList[1].content = obj.nickname//用户昵称
|
|
|
|
|
|
this.dataList[2].content = obj.coding//恒美ID
|
|
|
|
|
|
this.current = obj.gender//性别1男，2女,0未知
|
|
|
|
|
|
obj.birthday!='' ? this.pickerTime = [obj.birthday.slice(0,10)] : this.pickerTime = [time.slice(0,10)]//出生日期
|
|
|
|
|
|
obj.real_name!=null && obj.real_name !='' ? this.dataList[5].content = obj.real_name : this.dataList[5].fcon = '未知'//真实姓名
|
|
|
|
|
|
obj.mobile!='' ? this.dataList[6].content = obj.mobile : this.dataList[6].fcon = '未知'//电话
|
|
|
|
|
|
if(obj.county!='') this.pickerText = obj.province + obj.city + obj.county//省市区县
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.dataList[0].imgSrc = firstObj.headimgurl//用户头像
|
|
|
|
|
|
this.dataList[1].content = firstObj.nickname//用户昵称
|
2021-08-26 01:50:19 +00:00
|
|
|
|
this.dataList[2].content = firstObj.coding//恒美ID
|
2021-08-22 08:53:12 +00:00
|
|
|
|
this.current = firstObj.gender//性别1男，2女,0未知
|
|
|
|
|
|
}
|
2021-08-19 06:40:59 +00:00
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
updataInfo(){//修改资料事件
|
|
|
|
|
|
let params = {
|
|
|
|
|
|
real_name:this.dataList[5].content,//姓名
|
|
|
|
|
|
nickname:this.dataList[1].content,//昵称
|
|
|
|
|
|
mobile:this.dataList[6].content,//手机号
|
|
|
|
|
|
gender:this.current,//性别，0未知，1男，2女
|
|
|
|
|
|
province:this.addressInfo[0],//省份
|
|
|
|
|
|
city:this.addressInfo[1],//市
|
|
|
|
|
|
county:this.addressInfo[2],//区县
|
|
|
|
|
|
birthday:this.pickerTime[0]//生日（出生年月），日期格式：2021-08-10
|
|
|
|
|
|
}
|
|
|
|
|
|
this.$requst.post('user/edit-info',params).then(res=>{
|
|
|
|
|
|
if(res.code==0){
|
|
|
|
|
|
this.$toolAll.tools.showToast('资料修改成功')
|
|
|
|
|
|
setTimeout(()=>{
|
2021-08-24 00:54:50 +00:00
|
|
|
|
if(this.whereCome==2){
|
|
|
|
|
|
uni.navigateTo({
|
|
|
|
|
|
url:'/pages/tabbar/my/my'
|
|
|
|
|
|
})
|
|
|
|
|
|
} else {
|
|
|
|
|
|
uni.navigateBack({delta:1})
|
|
|
|
|
|
}
|
2021-08-19 06:40:59 +00:00
|
|
|
|
},1000)
|
|
|
|
|
|
}
|
|
|
|
|
|
},error=>{})
|
|
|
|
|
|
},
|
|
|
|
|
|
getDistrict(latitude, longitude) {//获取当前位置的省市区县
|
|
|
|
|
|
let ya = this
|
|
|
|
|
|
wx.request({
|
|
|
|
|
|
url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${latitude},${longitude}&key=B2ABZ-SIDKS-WD2O3-6CJ2U-CDZOT-U3FKF`,
|
|
|
|
|
|
header: {
|
|
|
|
|
|
'Content-Type':'application/json'
|
|
|
|
|
|
},
|
|
|
|
|
|
success:function(res) {
|
|
|
|
|
|
// console.log('地址数据：',res)
|
|
|
|
|
|
ya.newProvice = res.data.result.address_component.province
|
|
|
|
|
|
ya.newCity = res.data.result.address_component.city
|
|
|
|
|
|
ya.newDistrict = res.data.result.address_component.district
|
|
|
|
|
|
if(ya.pickerText=='') ya.pickerText = ya.newProvice + ya.newCity + ya.newDistrict
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
openAddres2() {//地址弹框事件
|
|
|
|
|
|
// 根据 label 获取
|
|
|
|
|
|
var index = this.$refs.simpleAddress.queryIndex([this.newProvice, this.newCity, this.newDistrict], 'label');
|
|
|
|
|
|
this.cityPickerValueDefault = index.index;
|
|
|
|
|
|
this.$refs.simpleAddress.open();
|
|
|
|
|
|
},
|
|
|
|
|
|
onConfirm(e) {//地址确认事件
|
|
|
|
|
|
this.pickerText = e.labelArr[0]+e.labelArr[1]+e.labelArr[2];
|
|
|
|
|
|
this.addressInfo = [e.labelArr[0],e.labelArr[1],e.labelArr[2]]
|
|
|
|
|
|
},
|
|
|
|
|
|
chooseHead(){//选择头像事件
|
|
|
|
|
|
uni.chooseImage({
|
|
|
|
|
|
count:1,
|
|
|
|
|
|
success: (res) => {
|
|
|
|
|
|
this.dataList[0].imgSrc = res.tempFilePaths[0]
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
},
|
|
|
|
|
|
changePicker(e){//性别选择
|
|
|
|
|
|
this.current = e.detail.value
|
|
|
|
|
|
},
|
|
|
|
|
|
changeTime(e){//出生日期选择
|
|
|
|
|
|
this.pickerTime = [e.detail.value]
|
|
|
|
|
|
},
|
|
|
|
|
|
changeAddress(e){
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
inputFo(index){//输入框获取焦点
|
|
|
|
|
|
if(this.dataList[index].content!=''){
|
|
|
|
|
|
this.dataList[index].fcon = this.dataList[index].content//将当前输入框的实际值赋值给当前输入框的placeholder属性
|
|
|
|
|
|
this.dataList[index].content = ''//清空当前输入框的实际值
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
inputB(index){//输入框失去焦点
|
|
|
|
|
|
if(index==1){
|
|
|
|
|
|
if(this.dataList[1].content==''){
|
|
|
|
|
|
this.dataList[1].content = this.uinfo.nickname
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if(index==5){
|
|
|
|
|
|
if(this.dataList[5].content==''){
|
|
|
|
|
|
this.dataList[5].content = this.uinfo.real_name
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if(index==6){
|
|
|
|
|
|
if(this.dataList[6].content==''){
|
|
|
|
|
|
this.dataList[6].content = this.uinfo.mobile
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
//打开picker
|
|
|
|
|
|
// openPicker() {
|
|
|
|
|
|
// this.lotusAddressData.visible = true;
|
|
|
|
|
|
// this.lotusAddressData.provinceName = this.newProvice;
|
|
|
|
|
|
// this.lotusAddressData.cityName = this.newCity;
|
|
|
|
|
|
// this.lotusAddressData.townName = this.newDistrict;
|
|
|
|
|
|
// },
|
|
|
|
|
|
//回传已选的省市区的值
|
|
|
|
|
|
// choseValue(res){
|
|
|
|
|
|
// //res数据源包括已选省市区与省市区code
|
|
|
|
|
|
// // console.log(res);
|
|
|
|
|
|
// this.lotusAddressData.visible = res.visible;//visible为显示与关闭组件标识true显示false隐藏
|
|
|
|
|
|
// //res.isChose = 1省市区已选 res.isChose = 0;未选
|
|
|
|
|
|
// if(res.isChose){
|
|
|
|
|
|
// this.lotusAddressData.provinceName = res.province;//省
|
|
|
|
|
|
// this.lotusAddressData.cityName = res.city;//市
|
|
|
|
|
|
// this.lotusAddressData.townName = res.town;//区
|
|
|
|
|
|
// this.region = `${res.province} ${res.city} ${res.town}`; //region为已选的省市区的值
|
|
|
|
|
|
// this.regionObj = {
|
|
|
|
|
|
// province:res.province,
|
|
|
|
|
|
// provinceCode:res.provinceCode,
|
|
|
|
|
|
// city:res.city,
|
|
|
|
|
|
// cityCode:res.cityCode,
|
|
|
|
|
|
// town:res.town,
|
|
|
|
|
|
// townCode:res.townCode
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }
|
|
|
|
|
|
// },
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
|
page{background-color: #FFFFFF;}
|
|
|
|
|
|
</style>
|
