Browse Source

修改用户信息页面交互

master
kuaileWu 1 year ago
parent
commit
33dea4d64b
  1. 2
      pages/modify_visitor/modify_visitor.vue
  2. 55
      pages/user_modify/user_modify.vue
  3. 2
      pages/usercenter/usercenter.vue

2
pages/modify_visitor/modify_visitor.vue

@ -54,7 +54,7 @@
clearTimeout(addtimer) clearTimeout(addtimer)
this.adding = false this.adding = false
if(data == -1) return if(data == -1) return
this.$func.toPage('/pages/visitors/visitors?type='+this.type); this.$func.toPage('/pages/visitors/visitors?type='+this.type)
}); });
}, },
nameBlurEvent(value, res){ nameBlurEvent(value, res){

55
pages/user_modify/user_modify.vue

@ -5,28 +5,29 @@
<view class="item"> <view class="item">
<view class="left PfScMedium">头像</view> <view class="left PfScMedium">头像</view>
<view class="right" @click="upload"> <view class="right" @click="upload">
<img :src="avator" class="avator"> <img :src="avator" class="avator" v-if="!uinfo.avatar">
<img :src="uinfo.avatar" class="avator" v-else>
<view class="avator_tips">点击上传照片</view> <view class="avator_tips">点击上传照片</view>
</view> </view>
</view> </view>
<view class="item"> <view class="item">
<view class="left PfScMedium">昵称</view> <view class="left PfScMedium">昵称</view>
<view class="right"> <view class="right">
<input type="text" placeholder="请输入用户昵称"> <input type="text" placeholder="请输入用户昵称" v-model="uinfo.nickname" disabled="">
</view> </view>
</view> </view>
<view class="item"> <view class="item">
<view class="left PfScMedium">用户编号</view> <view class="left PfScMedium">用户编号</view>
<view class="right over copy-box"> <view class="right over copy-box">
<view>17678689931</view> <view>{{uinfo.uid}}</view>
<img :src="cssUrl+'copy.svg'" class="copy" @click="copyUid('17678689931')"> <img :src="cssUrl+'copy.svg'" class="copy" @click="copyUid(uinfo.uid)">
</view> </view>
</view> </view>
</view> </view>
<view class="submit-blank"></view> <view class="submit-blank"></view>
<view class="submit-box btPadding"> <view class="submit-box btPadding">
<view class="primary btn btn3" hover-class="hover">保存</view> <view class="primary btn btn3" hover-class="hover" @click="save">保存</view>
</view> </view>
</view> </view>
</template> </template>
@ -36,41 +37,59 @@
data() { data() {
return { return {
cssUrl:this.cssUrl, cssUrl:this.cssUrl,
avator:this.cssUrl+'default_avator.svg' avator:this.cssUrl+'default_avator.svg',
uinfo:{}
} }
},
onLoad() {
this.getUser()
}, },
methods: { methods: {
save(){
this.$pop.modelShow('保存成功')
},
getUser(){
this.$http.req('client/user/info', {}, 'POST').then(data=>{
if(data == -1) return
this.uinfo = data
});
},
copyUid(uid) { copyUid(uid) {
var that = this
uni.setClipboardData({ uni.setClipboardData({
data: uid, data: uid,
success: function () { success: function () {
uni.showToast({
title:'用户编号已复制',
icon:'none'
})
} }
}); });
}, },
upload() { upload() {
var that = this
var token = uni.getStorageSync('token')
uni.chooseImage({ uni.chooseImage({
count: 1, count: 1,
success: function(res) { success: function(res) {
var tempFilePaths = res.tempFilePaths; var tempFilePaths = res.tempFilePaths;
uni.uploadFile({ uni.uploadFile({
url: 'http://example.com/upload', url: '/api/client/common/avatar/',
filePath: tempFilePaths[0], filePath: tempFilePaths[0],
name: 'file', name: 'file',
header: { header: {
'content-type' : 'multipart/form-data' 'Authorization': token
},
formData:{
'user': 'test'
}, },
success: function(res){ success: function(res){
console.log(res.data); try{
var data = JSON.parse(res.data)
if(data.code != 2000){
that.$pop.modelShow('上传失败:'+data.msg)
return
}
that.uinfo.avatar = data.data.url
}catch(e){
that.$pop.modelShow('上传失败~'+e.message)
}
}, },
fail: function(res){ fail: function(res){
console.log(res); that.$pop.modelShow('上传失败')
} }
}); });
} }
@ -132,7 +151,7 @@
} }
.avator_tips{ .avator_tips{
position: absolute; position: absolute;
bottom: 0; bottom: 10rpx;
right: 0; right: 0;
width: 100%; width: 100%;
z-index: 1; z-index: 1;

2
pages/usercenter/usercenter.vue

@ -34,7 +34,7 @@
components:{ components:{
tabbar:tabbar tabbar:tabbar
}, },
onLoad() { onShow() {
this.getUser() this.getUser()
}, },
methods: { methods: {

Loading…
Cancel
Save