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.
312 lines
7.3 KiB
312 lines
7.3 KiB
<template>
|
|
<view class="container">
|
|
|
|
|
|
<view class="form">
|
|
<!--input box start-->
|
|
<view class='input_box'>
|
|
<view class='i_box_1'>头像</view>
|
|
<view class='i_box_2'></view>
|
|
<view class='i_box_3'>
|
|
|
|
</view>
|
|
<view class='i_box_4'></view>
|
|
<view class='i_box_5'>
|
|
<view class="up">
|
|
<view class="img">
|
|
<u-upload
|
|
:fileList="uploadImg"
|
|
@afterRead="afterRead"
|
|
@delete="deletePic"
|
|
name="avatar"
|
|
width="26"
|
|
height="26"
|
|
:sizeType="['compressed']"
|
|
:deletable="true"
|
|
:maxCount="1"
|
|
:previewFullImage="false"
|
|
>
|
|
|
|
</u-upload>
|
|
</view>
|
|
<view class="icon" @click="clearImg">
|
|
<u-icon name="arrow-right" top="5"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--input box end-->
|
|
|
|
|
|
<!--input box start-->
|
|
<view class='input_box'>
|
|
<view class='i_box_1'>昵称</view>
|
|
<view class='i_box_2'></view>
|
|
<view class='i_box_3x'>
|
|
<u--input
|
|
placeholder="请输入昵称"
|
|
inputAlign="right"
|
|
border="none"
|
|
color="#999999"
|
|
maxlength="10"
|
|
v-model="info.nick_name"
|
|
></u--input>
|
|
</view>
|
|
<view class='i_box_5'>
|
|
<view class="up">
|
|
<view class="img">
|
|
</view>
|
|
<view class="icon">
|
|
<u-icon name="arrow-right" top="5"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--input box end-->
|
|
|
|
<!--input box start-->
|
|
<view class='input_box'>
|
|
<view class='i_box_1'>协议与说明</view>
|
|
<view class='i_box_2'></view>
|
|
<view class='i_box_3x'>
|
|
|
|
</view>
|
|
<view class='i_box_5'>
|
|
<view class="up">
|
|
<view class="img">
|
|
</view>
|
|
<view class="icon" >
|
|
<u-icon name="arrow-right" top="5"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--input box end-->
|
|
|
|
|
|
</view>
|
|
|
|
<view class="form" style="margin-top: 20rpx;" @click="logout">
|
|
<!--input box start-->
|
|
<view class='input_box'>
|
|
<view class='i_box_1'>注销账号</view>
|
|
<view class='i_box_2'></view>
|
|
<view class='i_box_3x'>
|
|
|
|
</view>
|
|
<view class='i_box_5'>
|
|
<view class="up">
|
|
<view class="img">
|
|
</view>
|
|
<view class="icon" >
|
|
<u-icon name="arrow-right" top="5"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--input box end-->
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
//form框
|
|
info: {
|
|
nick_name:'',
|
|
avatar:'',
|
|
|
|
},
|
|
uploadImg: [],
|
|
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
var _this = this;
|
|
_this.getUserInfo();
|
|
|
|
},
|
|
methods: {
|
|
|
|
//获取用户信息
|
|
getUserInfo()
|
|
{
|
|
var _this =this;
|
|
var _this =this;
|
|
var userInfo = _this.$user.session('userInfo');
|
|
if(_this.$com.isNull(userInfo.nick_name) )
|
|
{
|
|
userInfo.nick_name = '微信用户';
|
|
}
|
|
if(_this.$com.isNull(userInfo.avatar))
|
|
{
|
|
userInfo.avatar = '/static/img/user/avatar.png';
|
|
|
|
}
|
|
_this.info = userInfo;
|
|
_this.uploadImg =[{url:userInfo.avatar}];
|
|
|
|
},
|
|
// 删除图片
|
|
deletePic(event) {
|
|
var _this = this;
|
|
_this.uploadImg = [];
|
|
},
|
|
// 新增图片
|
|
afterRead(event) {
|
|
|
|
var _this = this
|
|
console.log('event',event);
|
|
var edetail = event.file.thumb;
|
|
if (edetail.indexOf('http://tmp') != -1 || edetail.indexOf('wxfile://tmp') != -1)
|
|
{
|
|
|
|
//上传
|
|
var upData = {filePath:edetail,fileType:'image'};
|
|
_this.$api.ossUpload(edetail,'user_small',upData,function(res){
|
|
console.log('ossUpload success',res);
|
|
},function(err){
|
|
console.log('ossUpload fail',err);
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
},
|
|
uploadFilePromise(url) {
|
|
|
|
},
|
|
loadData(){
|
|
|
|
},
|
|
getPhoneNumber(e){
|
|
var _this =this;
|
|
var detail = e.detail;
|
|
console.log(detail);
|
|
if (detail.errMsg === 'getPhoneNumber:ok') {
|
|
|
|
_this.getPhoneApi(detail);
|
|
} else {
|
|
_this.$com.alert('授权失败')
|
|
}
|
|
},
|
|
getPhoneApi(detail){
|
|
var _this = this;
|
|
|
|
var post ={
|
|
|
|
code: detail.code,
|
|
};
|
|
_this.$api.post('ycl/user/wx-phone',post,function(rs){
|
|
console.log(rs);
|
|
_this.info.phoneNumber = rs;
|
|
},function(err){
|
|
console.log(err);
|
|
});
|
|
|
|
},
|
|
|
|
//提交表单
|
|
add(){
|
|
var _this =this;
|
|
var info = _this.info;
|
|
|
|
if(_this.$com.isNull(info.nick_name))
|
|
{
|
|
_this.$com.showError('请输入昵称');
|
|
return;
|
|
}
|
|
if(_this.$com.isNull(info.avatar) && _this.$com.isNull(info.imgBase64))
|
|
{
|
|
_this.$com.showError('请上传头像');
|
|
return;
|
|
}
|
|
if(_this.$com.isNull(info.phoneNumber))
|
|
{
|
|
_this.$com.showError('手机号必须');
|
|
return;
|
|
}
|
|
_this.btn_loading = true;
|
|
_this.btn_disabled = true;
|
|
var post = info;
|
|
_this.$api.put('ycl/user/wx-update',post,function(rs){
|
|
console.log('更新token');
|
|
_this.$user.session('token',rs.token);
|
|
_this.$com.alert('更新成功');
|
|
setTimeout(function(){
|
|
uni.$u.route({
|
|
type:'navigateBack',
|
|
delta:1,
|
|
});
|
|
},1000);
|
|
});
|
|
//按钮还原
|
|
_this.btn_loading = false;
|
|
_this.btn_disabled = false;
|
|
|
|
},
|
|
//注销
|
|
logout()
|
|
{
|
|
uni.navigateTo({
|
|
url:'/pages/user/account/logout'
|
|
})
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.container{padding:10rpx 20rpx;}
|
|
.form{ padding:0rpx 20rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
|
}
|
|
/*form基本元素*/
|
|
/*input_box*/
|
|
.input_box{ display: flex;flex-direction:row; height: 100rpx; line-height: 100rpx;
|
|
border-radius: 15rpx; margin: 0rpx auto; color:#3D3D3D;}
|
|
|
|
.i_box_1{ width: 25%;height: 100rpx; font-size: 28rpx; text-align: left; }
|
|
.i_box_2{width: 0.3%;height: 80rpx; margin-top: 10rpx;}
|
|
.i_box_3{ height: 100rpx;min-width: 49.4%; width: auto;font-size: 26rpx;}
|
|
|
|
|
|
|
|
|
|
|
|
/*特殊的 改变部分*/
|
|
.i_box_3x{height: 100rpx;min-width: 65.7%; width: auto;font-size: 26rpx;}
|
|
::v-deep .u-input{ border:none !important; color:#3D3D3D !important; margin-top: 20rpx;}
|
|
.up{ width: 100%; height: auto; display: flex; margin-top: 20rpx;}
|
|
.up .img{width:80%; overflow: hidden; }
|
|
.up .img .u-upload{ margin-left: 80rpx;}
|
|
.up .icon{ width:20%;}
|
|
::v-deep .i_box_3x .u-button--info{ background-color: transparent !important; border: none !important; color: #FFFFFF !important; text-align: right !important;}
|
|
::v-deep .i_box_3x .u-button{display: block !important; padding:0rpx !important;}
|
|
::v-deep .u-upload__button{border-radius: 50% !important;}
|
|
::v-deep .u-upload__wrap__preview{border-radius: 50% !important;}
|
|
|
|
|
|
|
|
.btn-big{ width:100%;
|
|
height: 92rpx;
|
|
line-height: 92rpx;
|
|
margin:30rpx auto;
|
|
display:block;
|
|
border-radius:56rpx;
|
|
background:#00F0E2;
|
|
font-size:28rpx;
|
|
color:#fff;text-align: center;}
|
|
|
|
::v-deep .btn-big .u-button--info{ background-color: transparent !important; border: none !important; color: #FFFFFF !important; }
|
|
|
|
|
|
</style>
|
|
|