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.
362 lines
7.7 KiB
362 lines
7.7 KiB
<template>
|
|
<view class="setting">
|
|
<form @submit="sureSubmit">
|
|
<view class="box">
|
|
<view class="box-avter" style="padding-bottom: 24rpx;">
|
|
<view class="name-text">
|
|
头像
|
|
</view>
|
|
<view class="avatar">
|
|
<image :src="info.avatar_url ? info.avatar_url : '/static/default-logo.png'"
|
|
class="image_logo"></image>
|
|
<button open-type="chooseAvatar" @chooseavatar="chooseavatar"></button>
|
|
</view>
|
|
<!-- <image @click="chooseImage()" :src="info.avatar_url ? info.avatar_url : '/static/default-logo.png'"
|
|
class="image_logo"></image> -->
|
|
</view>
|
|
<view class="box-avter conten-height">
|
|
<view class="name-text">
|
|
昵称
|
|
</view>
|
|
<input type="nickname" :value="info.nick_name" name='nick_name' placeholder="请输入用户昵称">
|
|
</view>
|
|
<view class="box-avter conten-height">
|
|
<view class="name-text">
|
|
性别
|
|
</view>
|
|
<picker style="width: 400rpx;text-align: right;" :value="genderIndex" :range="gender" :range-key="'name'"
|
|
@change="bindPickerChange">
|
|
<view class="lx" :style="genderIndex == -1 ? 'color:#999' : 'color:#333'">
|
|
{{ genderIndex == -1 ? '请选择' : gender[genderIndex].name }}
|
|
<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
<view class="box-avter conten-height" style="border: none;">
|
|
<view class="name-text">
|
|
手机号
|
|
</view>
|
|
<text>{{ info.mobile }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="box">
|
|
<view class="box-avter conten-height" @click="bindPickerInvoice">
|
|
<view class="name-text">
|
|
发票助手
|
|
</view>
|
|
<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
|
|
</view>
|
|
<view class="box-avter conten-height" @click="toTextPage(1)">
|
|
<view class="name-text">
|
|
用户服务协议
|
|
</view>
|
|
<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
|
|
</view>
|
|
<view class="box-avter conten-height" @click="toTextPage(2)">
|
|
<view class="name-text">
|
|
隐私政策
|
|
</view>
|
|
<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
|
|
</view>
|
|
<view class="box-avter conten-height" @click="toTextPage(3)">
|
|
<view class="name-text">
|
|
关于我们
|
|
</view>
|
|
<u-icon style="margin-left: 5rpx; color: #8A8A8A" name="arrow-right"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="box" style="padding: 0 40rpx;" @click="onOut">
|
|
<view class="box-avter conten-height" style="border: none;">
|
|
<view class="name-text">
|
|
注销账号
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box" style="padding: 0 40rpx;margin-bottom: 140rpx;" @click="onOut1">
|
|
<view class="box-avter conten-height" style="border: none;">
|
|
<view class="name-text">
|
|
退出登录
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="bottomBtn">
|
|
<!-- @click="sureSubmit" -->
|
|
<button class="submitBtn" formType="submit">确认修改</button>
|
|
</view>
|
|
</form>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import * as UploadApi from '@/api/upload'
|
|
import * as userApi from '@/api/user'
|
|
export default {
|
|
data() {
|
|
return {
|
|
genderIndex: -1,
|
|
gender: [{
|
|
name: '男',
|
|
id: 0
|
|
}, {
|
|
name: '女',
|
|
id: 1
|
|
},],
|
|
info: '',
|
|
imageList: [],
|
|
avatar_id: [],
|
|
nick_name: ''
|
|
};
|
|
},
|
|
onShow() { },
|
|
onLoad(params) {
|
|
console.log(uni.getStorageSync("userInfo"))
|
|
this.info = uni.getStorageSync("userInfo")
|
|
this.genderIndex = this.info.gender == '男' ? 0 : 1
|
|
},
|
|
methods: {
|
|
formSubmit(e) {
|
|
console.log(e)
|
|
},
|
|
chooseavatar(e){
|
|
console.log(e)
|
|
let tempFiles = e.detail.avatarUrl;
|
|
this.info.avatar_url = tempFiles
|
|
this.imageList = this.imageList.concat([
|
|
{
|
|
path: tempFiles
|
|
}
|
|
])
|
|
this.uploadFile()
|
|
},
|
|
sureSubmit(e) {
|
|
console.log(e)
|
|
this.info.nick_name = e.detail.value.nick_name
|
|
let params = {
|
|
nick_name: this.info.nick_name,
|
|
avatar_id: this.avatar_id[0],
|
|
gender: this.genderIndex == 0 ? 1 : 2
|
|
}
|
|
userApi.editUser(params)
|
|
.then(res => {
|
|
if (res.status == 200) {
|
|
uni.showToast({
|
|
title: '修改成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
uni.setStorageSync('userInfo', this.info)
|
|
} else {
|
|
uni.showToast({
|
|
title: '修改失败',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
})
|
|
.finally()
|
|
},
|
|
// 选择图片
|
|
chooseImage() {
|
|
const app = this
|
|
app.imageList = []
|
|
const oldImageList = app.imageList
|
|
// 选择图片
|
|
uni.chooseImage({
|
|
count: 1,
|
|
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
success({
|
|
tempFiles
|
|
}) {
|
|
app.info.avatar_url = tempFiles[0].path
|
|
app.imageList = oldImageList.concat(tempFiles)
|
|
app.uploadFile()
|
|
}
|
|
});
|
|
},
|
|
|
|
// 上传图片
|
|
uploadFile() {
|
|
const app = this
|
|
const {
|
|
imageList
|
|
} = app
|
|
// 批量上传
|
|
return new Promise((resolve, reject) => {
|
|
if (imageList.length > 0) {
|
|
UploadApi.image(imageList)
|
|
.then(fileIds => {
|
|
app.avatar_id = fileIds;
|
|
resolve(fileIds)
|
|
})
|
|
.catch(reject)
|
|
} else {
|
|
resolve()
|
|
}
|
|
})
|
|
},
|
|
onOut1() {
|
|
uni.showModal({
|
|
title: '您是否要退出登录？',
|
|
content: '',
|
|
success(o) {
|
|
if (o.confirm) {
|
|
uni.showToast({
|
|
title: '退出成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
uni.clearStorageSync()
|
|
setTimeout(function () {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
}, 2000);
|
|
}
|
|
}
|
|
});
|
|
},
|
|
onOut() {
|
|
uni.showModal({
|
|
title: '您是否要注销账号？',
|
|
content: '',
|
|
success(o) {
|
|
if (o.confirm) {
|
|
userApi.delUser({})
|
|
.then(res => {
|
|
if (res.status == 200) {
|
|
uni.showToast({
|
|
title: '注销成功',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
uni.removeStorage('token');
|
|
uni.removeStorage('userInfo');
|
|
uni.clearStorageSync()
|
|
uni.clearStorage()
|
|
setTimeout(function () {
|
|
uni.reLaunch({
|
|
url: '/pages/login/index'
|
|
})
|
|
}, 2000);
|
|
|
|
}
|
|
})
|
|
.finally()
|
|
|
|
}
|
|
}
|
|
});
|
|
},
|
|
toTextPage(n) {
|
|
uni.navigateTo({
|
|
url: "/pages/news1/text?pageFlag=" + n
|
|
})
|
|
},
|
|
bindPickerInvoice() {
|
|
uni.navigateTo({
|
|
url: "/pages/invoice/indexset"
|
|
})
|
|
},
|
|
bindPickerChange(e) {
|
|
this.genderIndex = e.detail.value
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page {
|
|
width: 100%;
|
|
}
|
|
|
|
.setting {
|
|
height: 100%;
|
|
margin-top: 20rpx;
|
|
padding-bottom: 50rpx;
|
|
}
|
|
|
|
.box {
|
|
background: #FFF;
|
|
padding: 24rpx 36rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.more {
|
|
width: 28rpx;
|
|
height: 28rpx;
|
|
}
|
|
|
|
.box-avter {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
border-bottom: 1rpx solid #f2f2f2;
|
|
}
|
|
|
|
.conten-height {
|
|
height: 100rpx;
|
|
}
|
|
|
|
.conten-height text {
|
|
font-size: 35rpx;
|
|
color: #333;
|
|
}
|
|
|
|
.box-avter input {
|
|
height: 100%;
|
|
color: #333;
|
|
width: 400rpx;
|
|
text-align: right;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.name-text {
|
|
font-size: 28rpx;
|
|
color: #303030;
|
|
}
|
|
.avatar{
|
|
width: 114rpx;
|
|
height: 114rpx;
|
|
position: relative;
|
|
}
|
|
.avatar button{
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
z-index: 2;
|
|
opacity: 0;
|
|
}
|
|
.image_logo {
|
|
width: 114rpx;
|
|
height: 114rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.bottomBtn {
|
|
width: 100%;
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
height: 140upx;
|
|
z-index: 88;
|
|
background: #fafafa;
|
|
}
|
|
|
|
.submitBtn {
|
|
height: 88upx;
|
|
line-height: 88upx;
|
|
background: #FFAAA4;
|
|
background: #FE483B;
|
|
border-radius: 36px;
|
|
font-size: 28upx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
text-align: center;
|
|
margin: 30rpx 58rpx;
|
|
}
|
|
</style>
|
|
|