You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
414 lines
8.5 KiB
414 lines
8.5 KiB
<template>
|
|
<page-meta :page-style="themeColor"></page-meta>
|
|
<div>
|
|
<div class="view">
|
|
<div class="card">
|
|
<div class="row1" style="margin: 10rpx 0rpx !important;">
|
|
<div class="left">用户头像</div>
|
|
<div class="right" @click="show = true">
|
|
<div class="avatar">
|
|
<image :src="$util.img(img.length>0?img:userInfo.headimg)" mode="aspectFill"></image>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<u-line></u-line>
|
|
<div class="row">
|
|
<div class="left">用户账号</div>
|
|
<div class="right">
|
|
{{userInfo.mobile}}
|
|
</div>
|
|
</div>
|
|
<u-line></u-line>
|
|
|
|
<div class="row">
|
|
<div class="left">客户昵称</div>
|
|
<div class="right">
|
|
<input type="text" v-model="userInfo.nickname" @blur="blur" />
|
|
</div>
|
|
</div>
|
|
<u-line></u-line>
|
|
|
|
<div class="row">
|
|
<div class="left">联系人</div>
|
|
<div class="right"><input type="text" v-model="storeInfo.contacts" /></div>
|
|
</div>
|
|
<u-line></u-line>
|
|
|
|
<div class="row">
|
|
<div class="left">电话号码</div>
|
|
<div class="right">
|
|
<!-- {{nickname}} -->
|
|
<input type="number" v-model="storeInfo.phone" />
|
|
</div>
|
|
</div>
|
|
|
|
<u-line></u-line>
|
|
<div class="row">
|
|
<div class="left">电子邮箱</div>
|
|
<div class="right">
|
|
<input type="text" v-model="storeInfo.email" placeholder="请输入" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <u-line></u-line> -->
|
|
<!-- <div class="row">
|
|
<div class="left">联系地址</div>
|
|
<div class="right1">
|
|
<u--textarea border="none"
|
|
v-model="address"
|
|
placeholder="请输入内容"
|
|
autoHeight
|
|
></u--textarea>
|
|
</div>
|
|
</div> -->
|
|
</div>
|
|
|
|
<u-overlay :show="show" @click="show = false">
|
|
<div class="downloadBtn" @click="upload()">上传头像</div>
|
|
<div class="cancel">取消</div>
|
|
</u-overlay>
|
|
</div>
|
|
<view class="btn" style="padding-left:-30rpx; ">
|
|
<!-- #ifdef APP-PLUS -->
|
|
<view class="bindWX" @click="binWX" shape="circle">绑定微信账号</view>
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view class="bindWX" @click="binMPWX" shape="circle">绑定微信账号</view>
|
|
<!-- #endif -->
|
|
<view type="primary" class="add" @click="saveAddress" shape="circle">确定</view>
|
|
</view>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
storeInfo: {},
|
|
userInfo: {},
|
|
show: false,
|
|
myStore: uni.getStorageSync('myStore'),
|
|
img: ''
|
|
};
|
|
},
|
|
onShow() {
|
|
this.getUserInfo();
|
|
this.getStoreInfo();
|
|
},
|
|
methods: {
|
|
toAccountDetail() {
|
|
uni.navigateTo({
|
|
url: '/pages_tool/member/account_info'
|
|
});
|
|
},
|
|
getStoreInfo() {
|
|
this.$api.sendRequest({
|
|
url: '/api/member/getStoreInfo',
|
|
data: {
|
|
id: this.myStore.id
|
|
},
|
|
success: res => {
|
|
this.storeInfo = res.data;
|
|
console.log(res.data);
|
|
}
|
|
});
|
|
},
|
|
getUserInfo() {
|
|
this.$api.sendRequest({
|
|
url: '/api/member/info',
|
|
data: {
|
|
token: uni.getStorageSync('token')
|
|
},
|
|
success: res => {
|
|
this.userInfo = res.data;
|
|
}
|
|
});
|
|
},
|
|
|
|
//修改头像
|
|
upload(type, size = 1) {
|
|
this.$util.upload(
|
|
size, {
|
|
path: 'headimg'
|
|
},
|
|
res => {
|
|
|
|
this.img = res[0];
|
|
|
|
}
|
|
);
|
|
},
|
|
blur() {
|
|
|
|
},
|
|
binWX() {
|
|
uni.login({
|
|
provider: 'weixin',
|
|
onlyAuthorize: false, // 微信登录仅请求授权认证
|
|
success: res => {
|
|
let that = this;
|
|
uni.getUserInfo({
|
|
provider: 'weixin',
|
|
success: function(infoRes) {
|
|
let { userInfo } = { ...infoRes }
|
|
console.log(userInfo);
|
|
that.$api.sendRequest({
|
|
url: '/api/member/appBindWx',
|
|
data: {
|
|
openid: userInfo.openId,
|
|
unionid: userInfo.unionId,
|
|
nickname: userInfo.nickName,
|
|
headimg: userInfo.avatarUrl
|
|
},
|
|
success: WXres => {
|
|
that.$util.showToast({
|
|
title: WXres.message
|
|
});
|
|
console.log(WXres, `appBindWx`);
|
|
},
|
|
complete: WXr => {
|
|
console.log(WXr);
|
|
|
|
}
|
|
})
|
|
}
|
|
});
|
|
},
|
|
fail: function(err) {
|
|
console.log(err);
|
|
// 登录授权失败
|
|
// err.code是错误码
|
|
},
|
|
complete: r => {
|
|
console.log(r);
|
|
}
|
|
});
|
|
},
|
|
binMPWX() {
|
|
uni.login({
|
|
provider: 'weixin',
|
|
onlyAuthorize: false, // 微信登录仅请求授权认证
|
|
success: res => {
|
|
console.log(res.code);
|
|
let code = res.code;
|
|
let that = this;
|
|
uni.getUserInfo({
|
|
provider: 'weixin',
|
|
success: function(infoRes) {
|
|
console.log(infoRes);
|
|
let { userInfo } = { ...infoRes }
|
|
that.$api.sendRequest({
|
|
url: '/api/member/wechatBindWx',
|
|
data: {
|
|
code,
|
|
nickname: userInfo.nickName,
|
|
headimg: userInfo.avatarUrl
|
|
},
|
|
success: WXres => {
|
|
console.log(WXres, `wechatBindWx`);
|
|
that.$util.showToast({
|
|
title: WXres.message
|
|
});
|
|
},
|
|
complete: WXr => {
|
|
console.log(WXr);
|
|
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
})
|
|
},
|
|
saveAddress() {
|
|
this.$api.sendRequest({
|
|
url: '/api/member/editStoreOther',
|
|
data: {
|
|
id: this.storeInfo.id,
|
|
contacts: this.storeInfo.contacts,
|
|
phone: this.storeInfo.phone,
|
|
email: this.storeInfo.email
|
|
},
|
|
success: res => {
|
|
this.$util.showToast({
|
|
title: res.message
|
|
});
|
|
}
|
|
});
|
|
this.$api.sendRequest({
|
|
url: '/api/member/modifynickname',
|
|
data: {
|
|
token: uni.getStorageSync('token'),
|
|
nickname: this.userInfo.nickname
|
|
},
|
|
success: res => {
|
|
|
|
}
|
|
});
|
|
this.$api.sendRequest({
|
|
url: '/api/member/modifyheadimg',
|
|
data: {
|
|
token: uni.getStorageSync('token'),
|
|
headimg: this.img
|
|
},
|
|
success: res => {
|
|
|
|
}
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.view {
|
|
padding: 30rpx;
|
|
|
|
.card {
|
|
box-sizing: border-box;
|
|
background: #ffffff;
|
|
border-radius: 24rpx;
|
|
padding: 10rpx 30rpx;
|
|
|
|
.row1 {
|
|
padding: 10rpx 0 10rpx 0;
|
|
display: flex;
|
|
|
|
.left {
|
|
align-self: center;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333333;
|
|
}
|
|
|
|
.right {
|
|
align-self: center;
|
|
flex: 1;
|
|
text-align: right;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333333;
|
|
|
|
.avatar {
|
|
image {
|
|
width: 64rpx;
|
|
height: 64rpx;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
|
|
::v-deep {
|
|
.u-input--radius {
|
|
background: #fff;
|
|
border: 0;
|
|
}
|
|
|
|
.uni-input-placeholder {
|
|
text-align: right !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.row {
|
|
padding: 30rpx 0 30rpx 0;
|
|
display: flex;
|
|
|
|
.left {
|
|
width: 120rpx;
|
|
margin-right: 30rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333333;
|
|
}
|
|
|
|
.right {
|
|
flex: 1;
|
|
text-align: right;
|
|
// float: right;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333333;
|
|
margin-left: 30rpx;
|
|
}
|
|
|
|
.right1 {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
color: #333333;
|
|
margin-left: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.downloadBtn {
|
|
width: calc(100% - 60rpx);
|
|
height: 100rpx;
|
|
position: absolute;
|
|
left: 30rpx;
|
|
bottom: 200rpx;
|
|
background: #ffffff;
|
|
border-radius: 24rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: $base-color;
|
|
}
|
|
|
|
.cancel {
|
|
width: calc(100% - 60rpx);
|
|
height: 100rpx;
|
|
position: absolute;
|
|
left: 30rpx;
|
|
bottom: 70rpx;
|
|
background: #ffffff;
|
|
border-radius: 24rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: $base-color;
|
|
}
|
|
}
|
|
|
|
.btn {
|
|
width: 100%;
|
|
position: absolute;
|
|
bottom: 30px;
|
|
margin: 0 auto;
|
|
left: 0;
|
|
right: 0;
|
|
padding-bottom: constant(safe-area-inset-bottom);
|
|
/*兼容 IOS<11.2*/
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
|
|
/*兼容 IOS>11.2*/
|
|
.bindWX {
|
|
margin: 0 auto;
|
|
margin-bottom: 30rpx;
|
|
width: 80%;
|
|
|
|
border-radius: 50rpx;
|
|
color: #fff;
|
|
background-color: #5ac725;
|
|
border-color: #5ac725;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
text-align: center;
|
|
padding: 10rpx 20rpx
|
|
}
|
|
|
|
.add {
|
|
border-radius: 50rpx;
|
|
width: 80%;
|
|
margin: 0 auto;
|
|
color: #fff;
|
|
background-color: #3c9cff;
|
|
border-color: #3c9cff;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
text-align: center;
|
|
padding: 10rpx 20rpx
|
|
}
|
|
}
|
|
</style>
|