慧治理更新个人信息
This commit is contained in:
@@ -6,12 +6,13 @@
|
|||||||
<p class="mar-t22">头像</p>
|
<p class="mar-t22">头像</p>
|
||||||
<button class="user-img-div" open-type="chooseAvatar" @chooseavatar="handleWeixinSync">
|
<button class="user-img-div" open-type="chooseAvatar" @chooseavatar="handleWeixinSync">
|
||||||
<img v-if="user.avatarUrl" :src="user.avatarUrl" class="user-img">
|
<img v-if="user.avatarUrl" :src="user.avatarUrl" class="user-img">
|
||||||
|
<img v-else src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt="" class="user-img">
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<p>用户昵称</p>
|
<p>用户昵称</p>
|
||||||
<div class="item-right" v-if="!editNickName" @click="editNickName=true, userName= user.nickName">
|
<div class="item-right" v-if="!editNickName" @click="editNickName=true, userName= user.nickName">
|
||||||
<p class="name">{{ user.nickName }}</p>
|
<p class="name">{{ user.nickName || '' }}</p>
|
||||||
</div>
|
</div>
|
||||||
<input class="item-right" v-else type="text" v-model="userName" @blur="handleWeixinSync">
|
<input class="item-right" v-else type="text" v-model="userName" @blur="handleWeixinSync">
|
||||||
</div>
|
</div>
|
||||||
@@ -20,7 +21,7 @@
|
|||||||
<div class="item">
|
<div class="item">
|
||||||
<p>手机号</p>
|
<p>手机号</p>
|
||||||
<div class="item-right" v-if="!!!editPhone" @click="editPhone=true, userPhone= user.phone">
|
<div class="item-right" v-if="!!!editPhone" @click="editPhone=true, userPhone= user.phone">
|
||||||
<p class="name">{{ user.phone }}</p>
|
<p class="name">{{ user.phone || ''}}</p>
|
||||||
</div>
|
</div>
|
||||||
<input class="item-right" v-else type="number" v-model="userPhone" @blur="handleWeixin" maxlength="11">
|
<input class="item-right" v-else type="number" v-model="userPhone" @blur="handleWeixin" maxlength="11">
|
||||||
</div>
|
</div>
|
||||||
@@ -101,7 +102,6 @@ export default {
|
|||||||
},
|
},
|
||||||
success: uploadFileRes => {
|
success: uploadFileRes => {
|
||||||
this.avatar = JSON.parse(uploadFileRes.data).data[0].split(';')[0]
|
this.avatar = JSON.parse(uploadFileRes.data).data[0].split(';')[0]
|
||||||
console.log(JSON.parse(uploadFileRes.data).data[0].split(';')[0])
|
|
||||||
resolve(uploadFileRes)
|
resolve(uploadFileRes)
|
||||||
},
|
},
|
||||||
fail: err => {
|
fail: err => {
|
||||||
@@ -172,7 +172,6 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
p {
|
p {
|
||||||
color: #333;
|
color: #333;
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
<div class="wrap" @click="handleLogin()">
|
<div class="wrap" @click="handleLogin()">
|
||||||
<div class="user-img-div">
|
<div class="user-img-div">
|
||||||
<img :src="user.avatarUrl" alt="" class="user-img" v-if="user.id && user.avatarUrl"/>
|
<img :src="user.avatarUrl" alt="" class="user-img" v-if="user.id && user.avatarUrl"/>
|
||||||
<open-data type="userAvatarUrl" lang="zh_CN" class="user-img" v-else/>
|
<img class="user-img" src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" v-else alt="">
|
||||||
</div>
|
</div>
|
||||||
<div class="user-info">
|
<div class="user-info">
|
||||||
<div class="option">
|
<div class="option">
|
||||||
|
|||||||
@@ -5,22 +5,27 @@
|
|||||||
<div class="item solid">
|
<div class="item solid">
|
||||||
<p class="mar-t22">头像</p>
|
<p class="mar-t22">头像</p>
|
||||||
<button class="user-img-div" open-type="chooseAvatar" @chooseavatar="handleWeixinSync">
|
<button class="user-img-div" open-type="chooseAvatar" @chooseavatar="handleWeixinSync">
|
||||||
<img :src="user.avatarUrl" class="user-img">
|
<img v-if="user.avatarUrl" :src="user.avatarUrl" class="user-img">
|
||||||
|
<img v-else src="https://cdn.cunwuyun.cn/dvcp/myFamily/tx.png" alt="" class="user-img">
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<p>用户昵称</p>
|
<p>用户昵称</p>
|
||||||
<div v-if="!editNickName" @click="editNickName=true">
|
<div class="item-right" v-if="!editNickName" @click="editNickName=true, userName = user.nickName">
|
||||||
<p class="name" v-text="nickName"/>
|
<p class="name">{{ user.nickName || ''}}</p>
|
||||||
</div>
|
</div>
|
||||||
<input v-else type="nickname" class="editNickName" v-model="nickName" @blur="handleWeixinSync">
|
<input class="item-right" v-else type="text" v-model="nickName" @blur="handleWeixinSync">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item-content mar-b8">
|
<div class="item-content mar-b8">
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<p>手机号</p>
|
<p>手机号</p>
|
||||||
<div>{{ user.phone || '' }}</div>
|
<div class="item-right" v-if="!!!editPhone" @click="editPhone = true, userPhone = user.phone">
|
||||||
|
<p class="name">{{ user.phone || '' }}</p>
|
||||||
|
</div>
|
||||||
|
<input class="item-right" v-else type="number" v-model="userPhone" @blur="handleWeixin" maxlength="11">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="item-content" @click="onLogout">
|
<div class="item-content" @click="onLogout">
|
||||||
<div class="item">
|
<div class="item">
|
||||||
@@ -40,11 +45,21 @@ export default {
|
|||||||
...mapState(['user', 'token']),
|
...mapState(['user', 'token']),
|
||||||
nickName: {
|
nickName: {
|
||||||
set(v) {
|
set(v) {
|
||||||
|
this.userName = v
|
||||||
},
|
},
|
||||||
get() {
|
get() {
|
||||||
const {nickName} = this.user
|
const {nickName} = this.user
|
||||||
return nickName
|
return nickName
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
phone: {
|
||||||
|
set(v) {
|
||||||
|
this.userPhone = v
|
||||||
|
},
|
||||||
|
get() {
|
||||||
|
const { phone } = this.user
|
||||||
|
return phone
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
@@ -52,11 +67,29 @@ export default {
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
editNickName: false
|
editNickName: false,
|
||||||
|
editPhone: false,
|
||||||
|
avatar: '',
|
||||||
|
userName: '',
|
||||||
|
userPhone: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions(['getUserInfo', 'autoLogin']),
|
...mapActions(['getUserInfo', 'autoLogin']),
|
||||||
|
updateInfo() {
|
||||||
|
this.$instance.post(`/app/appwechatuser/update-nickName`, null, {
|
||||||
|
params: {
|
||||||
|
id: this.user.id,
|
||||||
|
nickName: this.userName ? this.userName : this.user.nickName,
|
||||||
|
avatarUrl: this.avatar ? this.avatar : this.user.avatarUrl,
|
||||||
|
phone: this.userPhone ? this.userPhone : this.user.phone,
|
||||||
|
}
|
||||||
|
}).then(res => {
|
||||||
|
if (res?.code == 0) {
|
||||||
|
this.$u.toast('修改成功')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
upLoad(img) {
|
upLoad(img) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
uni.uploadFile({
|
uni.uploadFile({
|
||||||
@@ -68,6 +101,7 @@ export default {
|
|||||||
Authorization: uni.getStorageSync('token')
|
Authorization: uni.getStorageSync('token')
|
||||||
},
|
},
|
||||||
success: uploadFileRes => {
|
success: uploadFileRes => {
|
||||||
|
this.avatar = JSON.parse(uploadFileRes.data).data[0].split(';')[0]
|
||||||
resolve(uploadFileRes)
|
resolve(uploadFileRes)
|
||||||
},
|
},
|
||||||
fail: err => {
|
fail: err => {
|
||||||
@@ -93,9 +127,23 @@ export default {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
handleWeixin({ detail }) {
|
||||||
|
if (detail.value) {
|
||||||
|
this.phone = detail.value
|
||||||
|
this.updateInfo()
|
||||||
|
}
|
||||||
|
},
|
||||||
handleWeixinSync({detail}) {
|
handleWeixinSync({detail}) {
|
||||||
const {value: nickName, avatarUrl} = detail
|
const {value: nickName, avatarUrl} = detail
|
||||||
this.autoLogin({nickName, avatarUrl})
|
this.autoLogin({nickName, avatarUrl})
|
||||||
|
if (avatarUrl?.length) {
|
||||||
|
this.upLoad(avatarUrl).then(() => {
|
||||||
|
this.updateInfo()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (nickName) {
|
||||||
|
this.updateInfo()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -108,11 +156,14 @@ export default {
|
|||||||
background-color: #F5F5F5;
|
background-color: #F5F5F5;
|
||||||
|
|
||||||
.info-list {
|
.info-list {
|
||||||
margin: 0 0 16px 0;
|
padding: 50px 32px 0 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
.item-content {
|
.item-content {
|
||||||
padding: 0 32px;
|
padding: 0 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
|
border-radius: 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
@@ -121,11 +172,11 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: content-box;
|
box-sizing: content-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
p {
|
p {
|
||||||
color: #333;
|
color: #333;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
|
width: 200px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div {
|
div {
|
||||||
@@ -133,11 +184,19 @@ export default {
|
|||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.item-right {
|
||||||
|
width: calc(100% - 200px);
|
||||||
|
text-align: right;
|
||||||
|
font-size: 28px;
|
||||||
|
p {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.user-img-div {
|
.user-img-div {
|
||||||
width: 104px;
|
width: calc(100% - 200px);
|
||||||
height: 104px;
|
text-align: right;
|
||||||
border-radius: 50%;
|
display: inline-block;
|
||||||
overflow: hidden;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-img {
|
.user-img {
|
||||||
|
|||||||
Reference in New Issue
Block a user