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.
 
 
 
 

155 lines
3.3 KiB

<template>
<view class="wrap">
<navigation title="建议与意见反馈"></navigation>
<view class="mainwrap2">
<view class="table_index">
<view class="item">
<view class="tip">编辑用户昵称</view>
<input type="nickname" @blur="updateUserNameMethod" v-model="name">
</view>
<view class="line"></view>
<view class="item" @click="chooseImage()">
<view class="tip">点击修改头像</view>
<image :src="avatarUrl"></image>
</view>
</view>
</view>
</view>
</template>
<script>
import {
mapState,
mapMutations
} from 'vuex'
export default {
data() {
return {
avatarUrl: "",
name: ""
};
},
onLoad(options) {
wx.cloud.init({
traceUser: true
});
this.avatarUrl = options.avatarUrl
this.name = options.name
},
computed: {
...mapState('m_user', ['userId'])
},
methods: {
...mapMutations('m_user', ['updateUserName', 'updateAvatarUrl', 'updateRedirectInfo']),
//选择图片
chooseImage() {
wx.chooseMedia({
count: 1,
mediaType: ['image'],
sizeType: ['compressed'], //可以指定是原图还是压缩图,这里用压缩
sourceType: ['album', 'camera'], //从相册选择
success: (res) => {
this.updateUserAvatarUrl(res.tempFiles[0].tempFilePath)
}
})
},
//编辑名称
async updateUserNameMethod() {
const {
data: res
} = await uni.$http.post('/small/wechat/editInfo', {
guid: this.userId,
nickname: this.name
})
if (!res.success) return uni.$showMsg()
this.updateUserName(this.name)
uni.showToast({
icon: 'none',
title: '编辑成功'
})
},
async updateUserAvatarUrl(url) {
//wx.uploadFile本身有一个this,所以要通过外部var _this = this 把this带进来
var _this = this
wx.uploadFile({
url: uni.$http.baseUrl + '/small/wechat/editUserAvatar',
filePath: url,
name: 'file',
formData: {
'guid': this.userId
},
success: function(res) {
if (res.data != null) {
const obj = JSON.parse(res.data);
if (obj == null || !obj.success) return uni.$showMsg()
_this.avatarUrl = uni.$http.baseUrl + obj.data;
_this.updateAvatarUrl(uni.$http.baseUrl + obj.data)
uni.showToast({
icon: 'none',
title: '编辑成功'
})
}
},
})
},
}
}
</script>
<style lang="scss">
@import url("@/static/base_css.css");
.table_index {
margin: 3% 3% 0;
padding: 50rpx 30rpx;
width: 94%;
height: 82vh;
background-image: linear-gradient(to bottom, #fff, transparent);
border-radius: 20rpx;
box-sizing: border-box;
}
.item {
display: flex;
align-items: center;
justify-content: space-between;
margin: 15rpx;
border-bottom: 1px solid #e5e5e5;
padding-bottom: 20rpx;
}
.tip {
display: flex;
flex-direction: row;
align-items: center;
text-align: left;
font-size: 14px;
color: #606266;
height: 72rpx;
padding: 0 24rpx 0 0;
vertical-align: middle;
flex-shrink: 0;
box-sizing: border-box;
}
.item input {
flex: 1;
padding: 5rpx 10rpx;
height: 70rpx;
flex-direction: row;
align-items: center;
border-radius: 4px;
border: 0 none;
box-sizing: border-box;
border-radius: 20rpx;
text-align: right;
}
.item image {
width: 150rpx;
height: 150rpx;
border-radius: 10rpx;
margin: 10rpx;
}
</style>