372 lines
11 KiB
Vue
372 lines
11 KiB
Vue
<template>
|
||
<view class="page">
|
||
<u-navbar title="我的" placeholder bgColor="#00337A" :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"/>
|
||
<scroll-view class="content" scroll-y="true">
|
||
<view class="view-box">
|
||
<view style="margin-left: 40rpx;margin-bottom: 20rpx;">
|
||
<text>{{userData.userName}}</text> <text style="margin-left: 20rpx;">{{userData.phonenumber}}</text> <text style="margin-left: 20rpx;">{{userData.roleName}}</text>
|
||
</view>
|
||
<view style="margin-left: 40rpx;margin-bottom: 20rpx;">
|
||
<text>{{userData.companyName}}</text>
|
||
</view>
|
||
<view style="margin-left: 40rpx;margin-bottom: 20rpx;">
|
||
<text>{{proName}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="view-item" @click="goNews">
|
||
<image class="imgBox" src="../../../static/realName/news.png" mode=""></image>
|
||
<text class="textBox">我的消息</text>
|
||
</view>
|
||
<view class="view-item" @click="restPwd">
|
||
<image class="imgBox" src="../../../static/realName/reset_pass.png" mode=""></image>
|
||
<text class="textBox">修改密码</text>
|
||
</view>
|
||
<!-- <view class="view-item">
|
||
<image class="imgBox" src="../../../static/realName/my_upload.png" mode=""></image>
|
||
<text class="textBox">上传情况</text>
|
||
</view>
|
||
<view class="view-item">
|
||
<image class="imgBox" src="../../../static/realName/my_download.png" mode=""></image>
|
||
<text class="textBox">下载情况</text>
|
||
</view>
|
||
<view class="view-item">
|
||
<image class="imgBox" src="../../../static/realName/icon_update_data.png" mode=""></image>
|
||
<text class="textBox">更新数据</text>
|
||
</view> -->
|
||
<!-- <view class="view-item">
|
||
<image class="imgBox" src="../../../static/realName/my_update.png" mode=""></image>
|
||
<text class="textBox">更新系统</text>
|
||
</view> -->
|
||
<view class="view-item" @click=openAbout>
|
||
<image class="imgBox" src="../../../static/realName/my_about.png" mode=""></image>
|
||
<text class="textBox">关于我们</text>
|
||
</view>
|
||
<view class="view-item" @click=outLogin>
|
||
<image class="imgBox" src="../../../static/realName/icon_logout.png" mode=""></image>
|
||
<text class="textBox">退出登录</text>
|
||
</view>
|
||
</scroll-view>
|
||
|
||
<uni-popup ref="popup" background-color="#fff">
|
||
<view style="width:600rpx;height: auto;">密码修改</view>
|
||
<view class="popup-content">
|
||
<u--form :model="restForm" ref="uForm3" :rules="rules3" labelWidth="60">
|
||
<u-form-item label="新密码" prop="password">
|
||
<u-input class="login-input" :type="isOpen?'text':'password'" placeholder="请输入密码" prefixIcon="lock"
|
||
v-model="restForm.password" save="false" autocomplete="new-password">
|
||
<template slot="suffix">
|
||
<image @click="isOpen=!isOpen"
|
||
style="width: 40rpx;height: 40rpx;margin-right: 10rpx; z-index: 999;"
|
||
:src="isOpen?'../../static/images/design_ic_visibility.png':'../../static/images/design_ic_visibility_off.png'">
|
||
</image>
|
||
</template>
|
||
</u-input>
|
||
</u-form-item>
|
||
<u-form-item label="再次确认" prop="passwordA">
|
||
<u-input class="login-input" :type="isOpen2?'text':'password'" placeholder="请再次输入密码" prefixIcon="lock"
|
||
v-model="restForm.passwordA" save="false" autocomplete="new-password">
|
||
<template slot="suffix">
|
||
<image @click="isOpen2=!isOpen2"
|
||
style="width: 40rpx;height: 40rpx;margin-right: 10rpx; z-index: 999;"
|
||
:src="isOpen2?'../../static/images/design_ic_visibility.png':'../../static/images/design_ic_visibility_off.png'">
|
||
</image>
|
||
</template>
|
||
</u-input>
|
||
</u-form-item>
|
||
<view style="color: red;line-height: 30rpx;font-size: 24rpx;padding-top: 20rpx;">
|
||
注：密码必须至少包含一个大写字母、一个小写字母、一个数字和一个特殊符号，并且长度在8到16个字符之间
|
||
</view>
|
||
<view style="display: flex;">
|
||
<u-button class="loginBtn" style="margin-top: 30rpx;width: 30%;color: black;"
|
||
@click="closePwd" color="#d0d2d5">退出</u-button>
|
||
<u-button class="loginBtn" style="margin-top: 30rpx;width: 30%;" @click="submit"
|
||
color="#00367a">确认</u-button>
|
||
</view>
|
||
|
||
</u--form>
|
||
</view>
|
||
</uni-popup>
|
||
|
||
<u-popup :show="showPopup" mode="center" @close="closePopup">
|
||
<view style="width:600rpx;height: auto;position: relative;background-color: #fff;">
|
||
<view style="width: 100%;height: auto;background-color: #fff;">
|
||
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;font-weight: bold;">
|
||
版权
|
||
</view>
|
||
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;">
|
||
Facial Technology by ArcSoft®
|
||
</view>
|
||
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;">
|
||
Copyright by Bonus®
|
||
</view>
|
||
<view style="width: 96%;margin: 20rpx auto;padding:10rpx 0;">
|
||
Website http://www.ahbonus.cn/
|
||
</view>
|
||
</view>
|
||
<view style="width: 90%;margin: 40rpx auto;display: flex;justify-content: flex-end;">
|
||
<!-- <view style="width:40%;height:80rpx;line-height: 80rpx;text-align: center;background: #00337A;color: #FFF;border-radius: 10rpx;" @click="closePopup">取消</view> -->
|
||
<view style="width:30%;height:60rpx;line-height: 60rpx;text-align: center;background: #00337A;color: #FFF;border-radius: 10rpx;" @click="closePopup">确认</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
|
||
|
||
|
||
|
||
<m-tabbar fixed fill :current="3" :tabbar="tabbar"></m-tabbar>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import TabbarConfig from '../util/tabbar.js'
|
||
import config from '@/config'
|
||
|
||
export default {
|
||
data() {
|
||
const equalToPassword = (rule, value, callback) => {
|
||
if (this.restForm.password !== value) {
|
||
callback(new Error("两次输入的密码不一致"));
|
||
} else {
|
||
callback();
|
||
}
|
||
};
|
||
// 密码校验 长度不能小于8位且不能大于16位字符,必须包含大写字母、小写字母、数字和特殊符号
|
||
var ISPWD =
|
||
/^(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*,\._\+(){}])[0-9a-zA-Z!@#$%^&*,\\._\+(){}]{8,16}$/;
|
||
// 密码校验
|
||
const validatePassword = (rule, value, callback) => {
|
||
if (!ISPWD.test(this.restForm.password)) {
|
||
callback(new Error("用户密码必须包含大写字母、小写字母、数字和特殊符号"));
|
||
} else {
|
||
callback();
|
||
}
|
||
}
|
||
return {
|
||
tabbar: TabbarConfig,
|
||
userData:uni.getStorageSync('realNameUser'),
|
||
proId:uni.getStorageSync('realNameUser').proId,
|
||
subId: uni.getStorageSync('realNameUser').subId,
|
||
type:uni.getStorageSync('realNameUser').type,
|
||
proName:"",
|
||
showPopup:false,
|
||
restForm: {
|
||
password: "",
|
||
passwordA: ""
|
||
},
|
||
rules3: {
|
||
password: [{
|
||
required: true,
|
||
trigger: "blur",
|
||
message: "请输入您的密码"
|
||
},
|
||
{
|
||
min: 8,
|
||
max: 16,
|
||
message: '用户密码长度必须介于 8 和 16 之间',
|
||
trigger: 'blur'
|
||
},
|
||
{
|
||
required: true,
|
||
validator: validatePassword,
|
||
trigger: 'blur'
|
||
}
|
||
],
|
||
passwordA: [{
|
||
required: true,
|
||
message: '请再次输入新密码',
|
||
trigger: ['blur', 'change']
|
||
},
|
||
{
|
||
required: true,
|
||
validator: equalToPassword,
|
||
trigger: "blur"
|
||
}
|
||
]
|
||
},
|
||
isOpen:false,
|
||
isOpen2:false,
|
||
// userName: uni.getStorageSync('userName'),
|
||
// className: uni.getStorageSync('className'),
|
||
// facePath: config.fileUrl + uni.getStorageSync('facePath'),
|
||
// token: uni.getStorageSync('access_token')
|
||
}
|
||
},
|
||
onLoad() {
|
||
console.log(this.userData)
|
||
this.getPro()
|
||
},
|
||
methods: {
|
||
// 获取工程名称
|
||
getPro(){
|
||
let param;
|
||
if (this.type.indexOf('3')>-1){
|
||
param={
|
||
id:this.proId,
|
||
subId:-1
|
||
}
|
||
} else if (this.type.indexOf('4')>-1){
|
||
param={
|
||
id:-1,
|
||
subId:this.subId
|
||
}
|
||
}
|
||
|
||
uni.request({
|
||
url: config.lpAppUrl + '/offLine/getPro',
|
||
method: 'post',
|
||
data: param,
|
||
header: {
|
||
'Content-Type': 'application/x-www-form-urlencoded',
|
||
Authorization: uni.getStorageSync('realNameToken')
|
||
},
|
||
success: res => {
|
||
res = res.data;
|
||
if(res.code==200){
|
||
console.log(res)
|
||
this.proName = res.data[0].abbreviation||"";
|
||
}
|
||
},
|
||
fail: err => {
|
||
console.log(err)
|
||
}
|
||
})
|
||
},
|
||
//消息列表
|
||
goNews(){
|
||
uni.navigateTo({
|
||
url: `/pages/realName/my/news`
|
||
})
|
||
},
|
||
//关于我们
|
||
openAbout(){
|
||
this.showPopup=true
|
||
},
|
||
closePopup(){
|
||
this.showPopup=false;
|
||
},
|
||
restPwd() {
|
||
this.restForm.password=''
|
||
this.restForm.passwordA=''
|
||
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
||
this.$refs.popup.open("center")
|
||
},
|
||
closePwd() {
|
||
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
||
this.$refs.popup.close("center")
|
||
},
|
||
submit() {
|
||
let _this = this
|
||
this.$refs.uForm3.validate().then(res => {
|
||
let form = {
|
||
userId: uni.getStorageSync('realNameUser').userId,
|
||
password: this.restForm.password
|
||
}
|
||
console.log("form:",form)
|
||
|
||
uni.request({
|
||
url: config.lpAppUrl + '/offLine/updatePassword',
|
||
method: 'post',
|
||
data: form,
|
||
header: {
|
||
'Content-Type': 'application/x-www-form-urlencoded',
|
||
Authorization: uni.getStorageSync('realNameToken')
|
||
},
|
||
success: res => {
|
||
res = res.data;
|
||
if(res.code==200){
|
||
console.log(res)
|
||
this.closePwd()
|
||
uni.showToast({ title: '密码修改成功', icon: 'none' })
|
||
} else {
|
||
uni.$u.toast("修改失败")
|
||
}
|
||
},
|
||
fail: err => {
|
||
console.log(err)
|
||
}
|
||
})
|
||
}).catch(errors => {
|
||
// uni.$u.toast('校验失败')
|
||
})
|
||
},
|
||
outLogin(){
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '确定退出登录吗？',
|
||
success: res => {
|
||
if (res.confirm) {
|
||
uni.reLaunch({
|
||
url: '/pages/login'
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.page {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background-color: #f8f8f8;
|
||
// box-sizing: border-box;
|
||
// padding: 15vh 8vw;
|
||
.content{
|
||
width: 100%;
|
||
height: 84vh;
|
||
margin-top: 20rpx;
|
||
background-color: #f8f8f8;
|
||
padding-bottom: 40rpx;
|
||
}
|
||
|
||
.view-box{
|
||
width: 100%;
|
||
padding: 20rpx 0;
|
||
margin-bottom: 30rpx;
|
||
height: auto;
|
||
background-color: #F2F6F9;
|
||
}
|
||
.view-item{
|
||
width: 100%;
|
||
padding: 20rpx 0;
|
||
margin-bottom: 30rpx;
|
||
height: auto;
|
||
background-color: #F2F6F9;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.imgBox{
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin: 0 40rpx;
|
||
}
|
||
.textBox{
|
||
width: 200rpx;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
}
|
||
|
||
}
|
||
|
||
.popup-content {
|
||
@include flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 15px;
|
||
height: 480rpx;
|
||
background-color: #fff;
|
||
max-width: 600rpx;
|
||
}
|
||
|
||
image {
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
margin-right: 20rpx;
|
||
margin-left: 20rpx;
|
||
}
|
||
</style>
|