568 lines
15 KiB
Vue
568 lines
15 KiB
Vue
<template>
|
||
<view>
|
||
<u-navbar :custom-back="router" title="我的设置"></u-navbar>
|
||
<view class="flex-col group">
|
||
<view class="flex-col section_2">
|
||
<!-- <text class="text_1">账号设置</text> -->
|
||
<view class="flex-col group_1">
|
||
<view class="justify-between group_2 flex-center" @click="goEditpwd">
|
||
<view class="flex-center">
|
||
<image class="image-left image_3" src="/static/common/img/my/account.png"/>
|
||
<text>密码设置</text>
|
||
</view>
|
||
|
||
<image class="image_2 image_3" src="/static/common/img/row_right.png"/>
|
||
</view>
|
||
<view class="section_3"></view>
|
||
<view class="justify-between group_3 flex-center" @click="goAuthentication">
|
||
<view class="flex-center">
|
||
|
||
<image class="image-left image_3" src="/static/common/img/my/agreement.png"/>
|
||
<text>官方认证</text>
|
||
</view>
|
||
<image class="image_2 image_4" src="/static/common/img/row_right.png"/>
|
||
</view>
|
||
<view class="section_3"></view>
|
||
<view class="justify-between group_3 flex-center" @click="goInfo">
|
||
<view class="flex-center">
|
||
|
||
<image class="image-left image_3" src="/static/common/img/my/person.png"/>
|
||
<text>个人信息</text>
|
||
</view>
|
||
<image class="image_2 image_5" src="/static/common/img/row_right.png"/>
|
||
</view>
|
||
<!-- <view class="section_3"> </view>
|
||
<view class="justify-between group_4" @click="goRealDetail">
|
||
<text>实名认证</text>
|
||
<image src="/static/common/img/row_right.png" class="image_2 image_5" />
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="flex-col section_4">
|
||
<view class="flex-center">
|
||
|
||
<image class="image-left image_3" src="/static/common/img/my/privacy.png"/>
|
||
<text class="text_5">隐私设置</text>
|
||
</view>
|
||
<view class="flex-col group_5" style='margin-top:0;'>
|
||
<!-- <view class="justify-between group_6">
|
||
<text class="text_6">获取定位</text>
|
||
<u-switch @change="onChange" class="switch" v-model="switchs.isLocation"></u-switch>
|
||
</view> -->
|
||
<view class="section_3" style='box-shadow:none;'></view>
|
||
<view class="justify-between group_7">
|
||
<text class="text_7">不把我推荐给可能认识的人</text>
|
||
<u-switch v-model="switchs.isPush" class="switch" @change="onChange"></u-switch>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="flex-col section_5">
|
||
<text class="text_8">通用设置</text>
|
||
<view class="justify-between group_8">
|
||
<text class="text_9">消息提示</text>
|
||
<u-switch @change="onChange" class="switch" v-model="switchs.isMessage"></u-switch>
|
||
</view>
|
||
</view> -->
|
||
<view class="justify-between section_6 flex-center" @click="onFeedback">
|
||
<view class="flex-center">
|
||
<image class="image-left image_3" src="/static/common/img/my/evaluation.png"/>
|
||
<text>意见反馈</text>
|
||
</view>
|
||
<image class="image_2 image_9" src="/static/common/img/row_right.png"/>
|
||
</view>
|
||
<view class="flex-col items-center button" @click='show=true'>
|
||
<text>退出登录</text>
|
||
</view>
|
||
</view>
|
||
<!-- 修改密码 -->
|
||
<u-mask :show="editPasswrod">
|
||
<view class="editPwd">
|
||
<view class="form">
|
||
<div class="input">
|
||
<u-input v-model="form.oldPwd" :border="false" :type="'text'" placeholder="旧密码"/>
|
||
</div>
|
||
<div class="input">
|
||
<u-input v-model="form.newPwd" :border="false" placeholder="新密码" type="password"/>
|
||
</div>
|
||
<div class="input">
|
||
<u-input v-model="form.repeatPwd" :border="false" placeholder="重复密码" type="password"/>
|
||
</div>
|
||
<!-- <div class="codeInput">
|
||
<u-input v-model="form.code" :type="'number'" :border="false" placeholder="验证码" />
|
||
<u-button class="codeBtn" type="primary" size="medium">8556</u-button>
|
||
</div> -->
|
||
<view style="margin-bottom: 20rpx;color:grey;">
|
||
提示:密码长度应该大于5,必须包含字母、数字、特殊字符,且不能包含中文!
|
||
</view>
|
||
<div class="btns">
|
||
<u-button class="btn" @click="editPwd(false)">取消</u-button>
|
||
<u-button class="btn" type="primary" @click='editPwd(true)'>确认</u-button>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
</u-mask>
|
||
<u-top-tips ref="uTips" :navbar-height="0" :z-index='999999'></u-top-tips>
|
||
<u-modal v-model="show" :content="'确认退出'" :show-cancel-button='true' @confirm='logOut'></u-modal>
|
||
<u-toast ref="uToast"/>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {aesEncrypt} from '@/utils/encrypt.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
show: false,
|
||
editPasswrod: false,
|
||
form: {
|
||
oldPwd: "",
|
||
newPwd: "",
|
||
repeatPwd: "",
|
||
},
|
||
switchs: {
|
||
isLocation: false,
|
||
isPush: false,
|
||
isMessage: false,
|
||
},
|
||
EdcationList:[],
|
||
};
|
||
},
|
||
onLoad() {
|
||
this.switchs.userId = this.vuex_user.id
|
||
this.switchs.isLocation = this.vuex_user.isLocation
|
||
this.switchs.isMessage = this.vuex_user.isMessage
|
||
this.switchs.isPush = this.vuex_user.isPush
|
||
this.Mypage();
|
||
},
|
||
onShow(){
|
||
|
||
this.getUser()
|
||
},
|
||
methods: {
|
||
getUser() {
|
||
this.$u.apiList.GetUser({
|
||
userId: this.vuex_user.id
|
||
}).then((res) => {
|
||
this.$u.vuex('vuex_user', res.user)
|
||
this.$u.vuex('vuex_user_hobby', res.lableList)
|
||
})
|
||
},
|
||
onChange(e) {
|
||
this.$u.apiList.Setting(this.switchs).then((res) => {
|
||
this.getUser()
|
||
})
|
||
},
|
||
editPwd(state) {
|
||
if (state) {
|
||
if (this.form.oldPwd === "") {
|
||
// return this.$tips("请输入旧密码", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '请输入旧密码',
|
||
type: 'error',
|
||
})
|
||
}
|
||
if (this.form.newPwd === "") {
|
||
// return this.$tips("请输入新密码", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '请输入新密码',
|
||
type: 'error',
|
||
})
|
||
}
|
||
if (this.form.oldPwd == this.form.newPwd) {
|
||
// return this.$tips("新密码不能与旧密码一致", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '新密码不能与旧密码一致',
|
||
type: 'error',
|
||
})
|
||
}
|
||
if (this.form.newPwd.length < 5) {
|
||
// return this.$tips("您的密码长度应该大于5", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '您的密码长度应该大于5',
|
||
type: 'error',
|
||
})
|
||
}
|
||
let reg = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[\W_]).{5,}$/
|
||
if (!reg.test(this.form.newPwd)) {
|
||
// return this.$tips("密码必须包含字母、数字、特殊字符,且不能包含中文!", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '密码必须包含字母、数字、特殊字符,且不能包含中文!',
|
||
type: 'error',
|
||
})
|
||
}
|
||
if (this.form.repeatPwd === "") {
|
||
// return this.$tips("请确认密码", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '请确认密码',
|
||
type: 'error',
|
||
})
|
||
}
|
||
if (this.form.repeatPwd !== this.form.newPwd) {
|
||
// return this.$tips("请确认两次密码是否一致", "error");
|
||
return this.$refs.uToast.show({
|
||
title: '请确认两次密码是否一致',
|
||
type: 'error',
|
||
})
|
||
}
|
||
const data = {
|
||
userId: this.vuex_user.id,
|
||
oldPassword: aesEncrypt(this.form.oldPwd),
|
||
password: aesEncrypt(this.form.repeatPwd),
|
||
|
||
}
|
||
this.$u.api.myChangePassword(data).then((res) => {
|
||
this.editPasswrod = false;
|
||
// this.$tips("修改成功");
|
||
this.$refs.uToast.show({
|
||
title: '修改成功',
|
||
type: 'success',
|
||
})
|
||
this.form.newPwd = ''
|
||
this.form.oldPwd = ''
|
||
this.form.repeatPwd = ''
|
||
})
|
||
.catch((err) => {
|
||
// return this.$tips(err.error, "error");
|
||
return this.$refs.uToast.show({
|
||
title: err.error,
|
||
type: 'error',
|
||
})
|
||
})
|
||
} else {
|
||
this.editPasswrod = false,
|
||
this.form.newPwd = ''
|
||
this.form.repeatPwd = ''
|
||
}
|
||
},
|
||
// 退出登录
|
||
logOut() {
|
||
this.$u.vuex("vuex_msgList", '');
|
||
this.$u.vuex('vuex_user', '')
|
||
this.$u.vuex('vuex_token', '')
|
||
uni.clearStorage();
|
||
this.$u.route({
|
||
url: "/pages/login/login/login",
|
||
});
|
||
},
|
||
// 个人信息
|
||
goInfo() {
|
||
this.$u.route({
|
||
url: "/pages/my/myDetails/myDetails",
|
||
params: {},
|
||
});
|
||
},
|
||
goRealDetail() {
|
||
this.$u.route({
|
||
url: "/pages/my/realDetail/realDetail",
|
||
params: {},
|
||
});
|
||
},
|
||
async Mypage() {
|
||
const data = {
|
||
userId: this.vuex_user.id,
|
||
}
|
||
const res = await this.$u.apiList.MyPage(data)
|
||
this.EdcationList = res.edcationList
|
||
|
||
},
|
||
// 官方认证
|
||
goAuthentication() {
|
||
// 如果是学生
|
||
if([0,2].includes(this.vuex_user.userType)){
|
||
if(!this.EdcationList.length){
|
||
return this.$refs.uToast.show({
|
||
title: '请先进行教育经历认证',
|
||
type: 'warning',
|
||
})
|
||
}
|
||
const findRow = this.EdcationList.find(x=>x.isSelected === true);
|
||
// console.log(findRow,'findRow--')
|
||
if([0,2].includes(findRow.certifyStatus)){
|
||
return this.$refs.uToast.show({
|
||
title: '请先进行教育经历认证',
|
||
type: 'warning',
|
||
})
|
||
}
|
||
|
||
}
|
||
// 如果是教师
|
||
if([1].includes(this.vuex_user.userType)){
|
||
// 校验当前学校是否审核通过
|
||
if(!this.EdcationList.length){
|
||
return this.$refs.uToast.show({
|
||
title: '请先进行任职学校认证',
|
||
type: 'none',
|
||
})
|
||
}
|
||
const findRow = this.EdcationList.find(x=>x.isSelected === true);
|
||
if([0,2].includes(findRow.certifyStatus)){
|
||
return this.$refs.uToast.show({
|
||
title: '请先进行任职学校认证',
|
||
type: 'none',
|
||
})
|
||
}
|
||
}
|
||
this.$u.route({
|
||
url: "/pages/my/authentication/authentication",
|
||
params: {},
|
||
});
|
||
},
|
||
goEditpwd(){
|
||
this.$u.route({
|
||
url: "/pages/my/mySeting/mySetPwd"
|
||
});
|
||
},
|
||
//返回上一级
|
||
router() {
|
||
uni.switchTab({
|
||
url: '/pages/my/my/my'
|
||
});
|
||
},
|
||
//意见反馈
|
||
onFeedback() {
|
||
this.$u.route({
|
||
url: '/pages/my/Feedback/Feedback'
|
||
})
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.editPwd {
|
||
.form {
|
||
width: 80%;
|
||
background-color: #ffffff;
|
||
border-radius: 14rpx;
|
||
position: absolute;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%, -50%);
|
||
padding: 30rpx;
|
||
|
||
.input {
|
||
background-color: #f6f7fa;
|
||
border-radius: 14rpx;
|
||
font-size:28rpx;
|
||
color: #b4b6bd;
|
||
margin-bottom: 40rpx;
|
||
padding: 10rpx 20rpx;
|
||
}
|
||
|
||
.codeInput {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 40rpx;
|
||
|
||
::v-deep .u-input {
|
||
background-color: #f6f7fa;
|
||
border-radius: 14rpx;
|
||
font-size:28rpx;
|
||
color: #b4b6bd;
|
||
padding: 10rpx 10rpx !important;
|
||
}
|
||
|
||
.codeBtn {
|
||
width: 100rpx;
|
||
height: 100rpx;
|
||
background-color: #eaf5ff;
|
||
border-radius: 14rpx;
|
||
font-size: 52rpx;
|
||
line-height: 46rpx;
|
||
color: #2e9bff;
|
||
margin-left: 24rpx;
|
||
}
|
||
}
|
||
|
||
.btns {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.btn {
|
||
width: 40%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.image_2 {
|
||
width: 15rpx;
|
||
height: 28rpx;
|
||
}
|
||
.image-left{
|
||
width: 88rpx;
|
||
height: 88rpx;
|
||
}
|
||
|
||
.section_3 {
|
||
background-color: rgb(255, 255, 255);
|
||
box-shadow: 2rpx 2rpx rgba(29, 38, 46, 0.08);
|
||
height: 10rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.switch {
|
||
width: 90rpx;
|
||
}
|
||
|
||
.group {
|
||
padding: 20rpx 0 10rpx;
|
||
flex: 1 1 auto;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.section_2 {
|
||
width: calc(100% - 80rpx);
|
||
margin: 0 auto;
|
||
border-radius: 30rpx;
|
||
padding: 46rpx 0 34rpx 26rpx;
|
||
background-color: rgb(255, 255, 255);
|
||
}
|
||
|
||
.section_4 {
|
||
width: calc(100% - 80rpx);
|
||
margin: 20rpx auto;
|
||
border-radius: 30rpx;
|
||
padding: 46rpx 40rpx 48rpx 26rpx;
|
||
background-color: rgb(255, 255, 255);
|
||
}
|
||
|
||
.section_5 {
|
||
width: calc(100% - 80rpx);
|
||
margin: 0 auto;
|
||
border-radius: 30rpx;
|
||
padding: 46rpx 40rpx 34rpx 26rpx;
|
||
background-color: rgb(255, 255, 255);
|
||
}
|
||
|
||
.section_6 {
|
||
width: calc(100% - 80rpx);
|
||
margin: 0 auto;
|
||
border-radius: 30rpx;
|
||
padding: 46rpx 34rpx 38rpx 26rpx;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
background-color: rgb(255, 255, 255);
|
||
}
|
||
|
||
.button {
|
||
margin-top: 34rpx;
|
||
padding: 30rpx 0 30rpx;
|
||
align-self: center;
|
||
color: #ef3920;
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
letter-spacing: 6rpx;
|
||
white-space: nowrap;
|
||
background-color: #fff;
|
||
border-radius: 60rpx;
|
||
width: calc(100% - 100rpx);
|
||
border: 2rpx solid #fac3bc;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.text_1 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 38rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.group_1 {
|
||
// margin-top: 58rpx;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.text_5 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.group_5 {
|
||
margin-top: 58rpx;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.text_8 {
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.group_8 {
|
||
margin-top: 20rpx;
|
||
padding-left: 10rpx;
|
||
color: rgb(55, 59, 72);
|
||
font-size: 34rpx;
|
||
line-height: 34rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.image_9 {
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.group_2 {
|
||
padding: 0 10rpx 14rpx;
|
||
}
|
||
|
||
.group_3 {
|
||
padding: 34rpx 10rpx 10rpx;
|
||
}
|
||
|
||
.group_4 {
|
||
padding-top: 28rpx;
|
||
}
|
||
|
||
.group_6 {
|
||
padding: 0 2rpx 4rpx;
|
||
}
|
||
|
||
.group_7 {
|
||
padding-top: 26rpx;
|
||
}
|
||
|
||
.text_9 {
|
||
margin: 10rpx 0 10rpx;
|
||
}
|
||
|
||
.image_3 {
|
||
margin-right: 26rpx;
|
||
// margin-top: 10rpx;
|
||
}
|
||
|
||
.image_4 {
|
||
margin-right: 26rpx;
|
||
margin-top: 10rpx;
|
||
}
|
||
|
||
.image_5 {
|
||
margin-right: 26rpx;
|
||
margin-top: 4rpx;
|
||
}
|
||
|
||
.text_6 {
|
||
margin: 10rpx 0 10rpx;
|
||
}
|
||
|
||
|
||
.text_7 {
|
||
margin-top: 6rpx;
|
||
}
|
||
.flex-center{
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
</style>
|