136 lines
3.2 KiB
Vue
136 lines
3.2 KiB
Vue
<template>
|
|
<view class="container">
|
|
<view class="title">完善注册信息</view>
|
|
<view class="subTitle">请完善头像昵称及联系信息</view>
|
|
<view class="table">
|
|
<view class="left">
|
|
<view class="label">头像</view>
|
|
<view class="desc">点击更换头像</view>
|
|
</view>
|
|
<view class="right">
|
|
<u-upload @afterRead="afterReadImg" :deletable="false" :maxCount="1">
|
|
<image class="avatar_pic" :src="avatarInfo.url" alt="" />
|
|
</u-upload>
|
|
</view>
|
|
</view>
|
|
<view class="table">
|
|
<view class="left">
|
|
<view class="label">昵称</view>
|
|
</view>
|
|
<view class="right">
|
|
<input type="text" placeholder="请填写昵称" :value="name" @input="headerInputClick">
|
|
</view>
|
|
</view>
|
|
<view class="table">
|
|
<view class="left">
|
|
<view class="label">手机号</view>
|
|
</view>
|
|
<view class="right">
|
|
<view>{{ mobile }}</view>
|
|
<button
|
|
type="default"
|
|
class="desc"
|
|
open-type="getPhoneNumber"
|
|
@getphonenumber="getPhoneNumber"
|
|
@click="heandleChangePhoneClick"
|
|
>更换</button>
|
|
</view>
|
|
</view>
|
|
<view class="btn" @click="headerSubmitClick">保存</view>
|
|
<view class="agreement">同意《用户隐私保护政策》</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import { request, upload, picUrl } from '../../../utils';
|
|
import { apiArr } from '../../../api/login';
|
|
import { apiArr as apiArr2 } from '../../../api/v2User';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
avatarInfo: {},
|
|
name: '',
|
|
mobile: '',
|
|
}
|
|
},
|
|
methods: {
|
|
headerInputClick(e) {
|
|
const { value} = e.detail;
|
|
this.name = value;
|
|
},
|
|
heandleChangePhoneClick() {},
|
|
|
|
// 小程序登录获取手机号接口
|
|
getPhoneNumber(event) {
|
|
console.log('获取手机号', event);
|
|
if (event.detail.errMsg === "getPhoneNumber:ok") {
|
|
request(apiArr.loginGetUserPhone, 'POST', {
|
|
code: event.detail.code
|
|
}).then((res) => {
|
|
console.log('111', res);
|
|
this.mobile = res.phone;
|
|
})
|
|
} else {
|
|
console.error('用户拒绝授权:', event.detail.errMsg);
|
|
}
|
|
},
|
|
|
|
// 上传图片
|
|
async afterReadImg(e){
|
|
console.log('eeee', e);
|
|
const { file} = e;
|
|
upload(file.url, res => {
|
|
console.log('1111', res);
|
|
this.avatarInfo = {
|
|
url: picUrl + res.data.path,
|
|
picUrl: res.data.path,
|
|
}
|
|
})
|
|
uni.showToast({
|
|
title: '上传成功',
|
|
icon: 'success'
|
|
});
|
|
},
|
|
|
|
|
|
|
|
async headerSubmitClick() {
|
|
console.log('提交', this.name);
|
|
const res = await request(apiArr2.userInfoUpdate, 'POST', {
|
|
avatar: this.avatarInfo.picUrl,
|
|
nick_name: this.name,
|
|
mobile: this.mobile
|
|
});
|
|
console.log('111111111', res)
|
|
uni.showToast({
|
|
title: '保存成功',
|
|
icon: 'success',
|
|
mask: true
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack({ delta: 1 })
|
|
}, 2000)
|
|
},
|
|
|
|
async init() {
|
|
const res = await request(apiArr2.getUserInfo, 'POST', {});
|
|
console.log('111211', res);
|
|
this.avatarInfo = {
|
|
url: res.avatar ? picUrl + res.avatar : 'https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_309.png',
|
|
picUrl: res.avatar
|
|
}
|
|
this.name = res.nick_name;
|
|
this.mobile = res.mobile;
|
|
},
|
|
},
|
|
onLoad() {
|
|
this.init();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
@import url("./index.css");
|
|
</style> |