YingXingAI/pages/my/mySeting/mySeting.vue

568 lines
15 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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>