<template>
|
<view class="password">
|
<view class="form-card">
|
<!-- 注意,如果需要兼容微信小程序,最好通过setRules方法设置rules规则 -->
|
<u--form labelPosition="left" :model="model" :rules="rules" ref="uForm">
|
<u-form-item labelWidth='200rpx' label="原密码" prop="oldPassword" borderBottom ref="item1">
|
<u--input v-model="model.oldPassword" placeholder='请输入原密码' border="none"></u--input>
|
</u-form-item>
|
<u-form-item labelWidth='200rpx' label="新密码" prop="newPassword" borderBottom ref="item1">
|
<u--input v-model="model.newPassword" placeholder='请输入新密码' border="none"></u--input>
|
</u-form-item>
|
<u-form-item labelWidth='280rpx' label="请再次输入新密码" prop="newPassword1" ref="item1">
|
<u--input v-model="model.newPassword1" placeholder='请再次输入新密码' border="none"></u--input>
|
</u-form-item>
|
</u--form>
|
</view>
|
<button class="confirm_btn" @click="confirm">保存</button>
|
</view>
|
</template>
|
|
<script>
|
import {
|
updatePassword
|
} from "@/api/system/user"
|
import md5 from "../../utils/md5.js"
|
var result = ""
|
export default {
|
data() {
|
var newPassword = (rule, value, callback) => {
|
if (value === '') {
|
callback(new Error('请输入密码'));
|
} else {
|
if (this.model.newPassword !== '') {
|
this.$refs.uForm.validateField('newPassword1');
|
}
|
callback();
|
}
|
};
|
var newPassword1 = (rule, value, callback) => {
|
if (value === '') {
|
callback(new Error('请再次输入密码'));
|
} else if (value !== this.model.newPassword) {
|
callback(new Error('两次输入密码不一致!'));
|
} else {
|
callback();
|
}
|
};
|
var checkPassWord = (rule, value, callback) => {
|
let level = []
|
if (!value) {
|
return callback('密码不能为空')
|
}
|
if (value.length < 8) {
|
return callback('密码不少于8位')
|
}
|
if (value.length > 16) {
|
return callback('密码不大于16位')
|
}
|
// 是数字
|
let isDigit = /^.*[0-9]+.*/;
|
// isLowerCase 小写字母
|
let isLowerCase = /^.*[a-z]+.*/;
|
// isUpperCase 大写字母
|
let isUpperCase = /^.*[A-Z]+.*/;
|
// 特殊字符
|
let regEx = /^.*[^a-zA-Z0-9]+.*/;
|
// 记录匹配的次数
|
let num = 0;
|
if (isDigit.test(value)) {
|
num = num + 1;
|
}
|
if (isLowerCase.test(value)) {
|
num = num + 1;
|
}
|
if (isUpperCase.test(value)) {
|
num = num + 1;
|
}
|
if (regEx.test(value)) {
|
num = num + 1;
|
}
|
if (num <= 2) {
|
return callback("密码强度不足,密码至少包含三种:(1)大写字母、(2)小写字母、(3)数字、(4)特殊符号");
|
}
|
return callback()
|
}
|
return {
|
showSex: false,
|
model: {
|
oldPassword: '',
|
newPassword: "",
|
newPassword1: '',
|
},
|
rules: {
|
'oldPassword': [{
|
type: 'string',
|
required: true,
|
message: '请输入原密码',
|
trigger: ['blur', 'change']
|
}],
|
"newPassword": [{
|
type: 'string',
|
required: true,
|
message: '请输入新密码',
|
trigger: ['blur', 'change']
|
}, {
|
validator: newPassword,
|
trigger: 'blur'
|
},
|
{
|
validator: checkPassWord,
|
trigger: 'blur'
|
},
|
],
|
"newPassword1": [{
|
type: 'string',
|
required: true,
|
message: '请输入新密码',
|
trigger: ['blur']
|
},
|
{
|
validator: newPassword1,
|
trigger: 'blur'
|
}
|
],
|
},
|
radio: '',
|
switchVal: false
|
};
|
},
|
methods: {
|
|
confirm() {
|
this.$refs.uForm.validate().then(async res => {
|
const obj = {
|
newPassword: md5(this.model.newPassword),
|
oldPassword: md5(this.model.oldPassword),
|
newPassword1: md5(this.model.newPassword1),
|
}
|
const data = await updatePassword(obj).catch(err => {
|
const {
|
data
|
} = err
|
return uni.$u.toast(data.msg || "验证失败")
|
})
|
if (data.code != 200) return uni.$u.toast(data.msg)
|
uni.$u.toast("修改成功")
|
setTimeout(() => {
|
this.$u.func.globalNavigator("", "navBack")
|
}, 1500)
|
})
|
}
|
},
|
onReady() {
|
//如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则。
|
this.$refs.uForm.setRules(this.rules)
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.password {
|
background-color: #e6edfa;
|
padding: 20rpx 0;
|
height: 100vh;
|
|
.form-card {
|
background-color: #fff;
|
border-radius: 16rpx;
|
margin: 0 20rpx;
|
padding: 0 20rpx;
|
}
|
|
.confirm_btn {
|
background: #1180ff;
|
color: #fff;
|
height: 72rpx;
|
line-height: 72rpx;
|
width: 90%;
|
margin-top: 200rpx;
|
border-radius: 20rpx;
|
}
|
}
|
</style>
|