254 lines
7.2 KiB
Vue
254 lines
7.2 KiB
Vue
<template>
|
|
<view :class="editRealName&editMobile&editArea&editAddress?'':'pad-b150'">
|
|
<status-nav :ifReturn="true" navBarTitle="个人中心" :marginBottom="0"></status-nav>
|
|
<view class="ucenter">
|
|
<view class="item flex">
|
|
<view class="title">头像</view>
|
|
<view class="img"><!-- @tap="changeHeadImg" -->
|
|
<image :src="headImgUrl" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="item flex">
|
|
<view class="title">昵称</view>
|
|
<view class="msg">{{nickName}}</view>
|
|
</view>
|
|
<view class="item flex" @tap="openEdit('real_name')">
|
|
<view class="title">真实姓名</view>
|
|
<input class="msg" type="text" v-model="realName" disabled="true">
|
|
<view class="more">
|
|
<image src="/static/public/icon-my-more.png" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="item flex" style="position: relative;">
|
|
<view class="title">联系电话</view>
|
|
<input class="msg" type="number" v-model="mobile" disabled="true">
|
|
<view class="more">
|
|
<image src="/static/public/icon-my-more.png" mode="widthFix"></image>
|
|
</view>
|
|
<button class="get-phone-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"></button>
|
|
</view>
|
|
<view class="item flex" @tap="openEdit('area')">
|
|
<view class="title">联系地址</view>
|
|
<input class="msg" type="text" v-model="area" disabled="true">
|
|
<view class="more">
|
|
<image src="/static/public/icon-my-more.png" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="item flex" @tap="openEdit('address')">
|
|
<view class="title">详细地址</view>
|
|
<input class="msg" type="text" v-model="address" disabled="true">
|
|
<view class="more">
|
|
<image src="/static/public/icon-my-more.png" mode="widthFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="item flex" v-if="businessCode!==''">
|
|
<view class="title">会员码</view>
|
|
<view class="msg">{{businessCode}}</view>
|
|
</view>
|
|
</view>
|
|
<!-- 修改弹窗 -->
|
|
<view class="pull-all-bg" v-show="isOpen" @tap="closeEdit"></view>
|
|
<view class="edit-box-bg" v-if="isOpen">
|
|
<view class="edit-box">
|
|
<view class="edit-close" @tap="closeEdit"><text>X</text></view>
|
|
<view class="title">{{title}}</view>
|
|
<view class="subtitle">{{subtitle}}</view>
|
|
<input class="input" type="text" v-model="msg" :placeholder="placeholder" placeholder-style="color:#000000" v-if="type=='input'">
|
|
<textarea class="textarea" v-model="msg" :placeholder="placeholder" placeholder-style="color:#000000" v-if="type=='textarea'"></textarea>
|
|
<view class="btn" @tap="submitEdit(field,msg)">确认</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import statusNav from '@/components/status-navs/status-nav';
|
|
import {getCartNum,userInfoEv} from '@/jsFile/public-api.js';
|
|
import {mapState} from 'vuex'//引入mapState
|
|
export default {
|
|
components:{
|
|
statusNav
|
|
},
|
|
data() {
|
|
return {
|
|
headImgUrl:'', //头像链接
|
|
nickName:'', //昵称
|
|
businessCode:'', //会员码
|
|
realName:'',//真实姓名
|
|
mobile:'',//电话
|
|
area:'',//联系地址
|
|
address:'',//详细地址
|
|
isOpen:false, //是否显示
|
|
title:'', //标题
|
|
subtitle:'', //副标题
|
|
msg:'', //修改内容
|
|
field:'', //修改位置
|
|
type:'input',
|
|
placeholder:'', //默认信息
|
|
headImg:'', //缓存头像链接
|
|
cacheBusinessId:-1, //商户id
|
|
}
|
|
},
|
|
computed:{
|
|
|
|
},
|
|
onLoad(op) {
|
|
if(op.business_id){
|
|
this.cacheBusinessId = op.business_id;
|
|
}
|
|
},
|
|
onShow() {
|
|
if(this.cacheBusinessId !== -1){
|
|
this.$requst.post('/api/index/change-business',{business_id:this.cacheBusinessId}).then(res=>{
|
|
if(res.code == 0){
|
|
this.getUserData();
|
|
userInfoEv();
|
|
}
|
|
})
|
|
}else{
|
|
this.getUserData();
|
|
userInfoEv();
|
|
}
|
|
},
|
|
methods: {
|
|
// 获取用户信息
|
|
getUserData(){
|
|
uni.showLoading();
|
|
this.$requst.get('/api/user/info').then(res=>{
|
|
// console.log(res,'用户信息')
|
|
if(res.code==0) {
|
|
this.headImgUrl = res.data.headimgurl;
|
|
this.nickName = res.data.nickname;
|
|
this.businessCode = res.data.business_code;
|
|
this.realName= res.data.real_name;
|
|
this.mobile= res.data.mobile;
|
|
this.area= res.data.area;
|
|
this.address= res.data.address;
|
|
}
|
|
uni.hideLoading();
|
|
})
|
|
},
|
|
|
|
// 选择修改信息
|
|
openEdit(type){
|
|
if(type == 'real_name'){
|
|
this.title = '姓名';
|
|
this.subtitle = '姓名';
|
|
this.placeholder = this.realName==''?'请输入姓名':'this.realName';
|
|
this.isOpen = true;
|
|
this.type='input';
|
|
this.field = 'real_name';
|
|
}
|
|
if(type == 'mobile'){
|
|
this.title = '电话';
|
|
this.subtitle = '电话';
|
|
this.placeholder = this.mobile==''?'请输入电话':this.mobile;
|
|
this.isOpen = true;
|
|
this.type='input';
|
|
this.field = 'mobile';
|
|
}
|
|
if(type == 'area'){
|
|
this.title = '联系地址';
|
|
this.subtitle = '联系地址';
|
|
this.placeholder = this.area==''?'请输入联系地址':this.area;
|
|
this.isOpen = true;
|
|
this.type='input';
|
|
this.field = 'area';
|
|
}
|
|
if(type == 'address'){
|
|
this.title = '详细地址';
|
|
this.subtitle = '详细地址';
|
|
this.placeholder = this.address==''?'请输入详细地址':this.address;
|
|
this.isOpen = true;
|
|
this.type='textarea';
|
|
this.field = 'address';
|
|
}
|
|
},
|
|
// 提交修改
|
|
submitEdit(field,value){
|
|
uni.showLoading();
|
|
if(field!==''&&value!==''){
|
|
let params={
|
|
field:field,
|
|
value:value
|
|
}
|
|
this.$requst.post('/api/user/update-info',params).then(res=>{
|
|
if(res.code==0) {
|
|
this.$toolAll.tools.showToast('修改成功');
|
|
// 关闭弹窗
|
|
this.closeEdit();
|
|
// 刷新用户信息
|
|
this.getUserData();
|
|
}
|
|
uni.hideLoading();
|
|
})
|
|
}else{
|
|
this.$toolAll.tools.showToast('您没有更改信息');
|
|
// 关闭弹窗
|
|
this.closeEdit();
|
|
}
|
|
|
|
},
|
|
|
|
// 关闭弹窗
|
|
closeEdit(){
|
|
this.title = '';
|
|
this.subtitle = '';
|
|
this.msg='';
|
|
this.isOpen = false;
|
|
this.type=''
|
|
},
|
|
// 获取授权信息
|
|
onGetPhoneNumber(e){
|
|
if(e.detail.errMsg=="getPhoneNumber:fail user deny"){ //用户决绝授权
|
|
this.$toolAll.tools.showToast('您已拒绝授权');
|
|
}else{ //允许授权
|
|
let params={
|
|
iv:e.detail.iv,
|
|
encryptedData:e.detail.encryptedData
|
|
}
|
|
this.$requst.post('/api/user/bind-phone',params).then(res=>{
|
|
if(res.code==0) {
|
|
this.$toolAll.tools.showToast('绑定成功');
|
|
// 刷新用户信息
|
|
this.getUserData();
|
|
}else{
|
|
this.$toolAll.tools.showToast(res.msg);
|
|
}
|
|
})
|
|
|
|
}
|
|
},
|
|
// 选择图片
|
|
changeHeadImg(){
|
|
uni.chooseImage({
|
|
count: 1, //默认9
|
|
sourceType: ['album','camera'], //从相册选择
|
|
success: (res)=> {
|
|
this.headImg = res.tempFilePaths[0];
|
|
this.uploadImg();
|
|
}
|
|
})
|
|
},
|
|
// 上传图片
|
|
uploadImg(){
|
|
uni.showLoading({
|
|
title: '上传中'
|
|
});
|
|
this.$requst.upload('/api/file/upload/image',{path:this.headImg}).then(res=>{
|
|
if(res.code==0) {
|
|
this.headImgUrl = this.$hostHttp+res.data.src;
|
|
// 修改信息
|
|
this.submitEdit('headimgurl',this.headImgUrl);
|
|
}
|
|
uni.hideLoading();
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|