Resetpassword.vue
3.8 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
<template>
<div class="passform-box">
<div class="re-header">重置密码</div>
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="100px"
class="passform"
>
<div class="passformitem">
<el-form-item label="旧密码" prop="oldpassword">
<el-input v-model="ruleForm.oldpassword" type="password"></el-input>
</el-form-item>
</div>
<div class="passformitem">
<el-form-item label="新密码" prop="newpassword">
<el-input v-model="ruleForm.newpassword" type="password"></el-input>
</el-form-item>
</div>
<div class="passformitem">
<el-form-item label="密码确认" prop="checknewpassword">
<el-input
v-model="ruleForm.checknewpassword"
type="password"
></el-input>
</el-form-item>
</div>
<el-form-item>
<el-button @click="back('ruleForm')">取消</el-button>
<el-button type="primary" @click="submitForm('ruleForm')"
>提交</el-button
>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data() {
var validatePass = (rule, value, callback) => {
if (value === "") {
callback(new Error("请输入密码"));
} else {
if(value == this.ruleForm.oldpassword) {
callback(new Error("新旧密码不能重复！"));
return
}
var pwdRegex = new RegExp('(?=.*[0-9])(?=.*[A-Z])(?=.*[a-z])(?=.*[^a-zA-Z0-9]).{8,30}');
if (!pwdRegex.test(value)) {
callback(new Error("您的密码复杂度太低（密码中必须包含大写和小写字母、数字、特殊字符长度大于8位），请及时修改密码！"))
}
if (this.ruleForm.checkPass !== "") {
this.$refs.ruleForm.validateField("checkPass");
}
callback();
}
};
var validatePass2 = (rule, value, callback) => {
if (value === "") {
callback(new Error("请再次输入密码"));
} else if (value !== this.ruleForm.newpassword) {
callback(new Error("两次输入密码不一致!"));
} else {
callback();
}
};
return {
ruleForm: {
oldpassword: "",
newpassword: "",
checknewpassword: ""
},
rules: {
oldpassword: [
{ required: true, message: "请输入旧密码", trigger: "blur" }
],
newpassword: [
{ validator: validatePass, trigger: "blur" },
{ required: true, message: "", trigger: "blur" }
],
checknewpassword: [
{ validator: validatePass2, trigger: "blur" },
{ required: true, message: "", trigger: "blur" }
]
}
};
},
methods: {
submitForm(formName) {
let data = {
old_pwd: this.baseencode(this.ruleForm.oldpassword),
new_pwd: this.baseencode(this.ruleForm.newpassword)
};
this.$refs[formName].validate(valid => {
if (valid) {
let user_unid = sessionStorage.getItem("user_unid");
this.$api.ops.resetPwd(data, user_unid).then(res => {
this.$router.push("/login");
}).catch(err => {
if (err.response) {
this.$message({
type: "error",
message: err.response.data.enote
});
}
});
} else {
console.log("error submit!!");
return false;
}
});
},
back() {
this.$router.back(-1);
},
resetForm(formName) {
this.$refs[formName].resetFields();
}
}
};
</script>
<style>
.passform {
margin: 20px;
width: 400px;
}
.passformitem {
margin-bottom: 20px;
}
.passform-box{
width: 400px;
}
.re-header{
margin-left: 60px;
margin-top: 20px;
}
</style>