Commit ef17f38a by 肖小磊

密码强度

parent 54975d3d
import { Loading } from 'element-ui'
var ApiConfig = {
baseLink: "http://115.159.142.32:8068/",
//baseLink: "http://115.159.142.32:8068/",
//baseLink: "http://localhost:58947/",
//baseLink: "http://10.126.226.37:8070/",
baseLink: "http://10.126.226.37:8070/",
//baseLink: "http://10.96.0.2:8070/",
Link: {
uploadFile: "UploadFile",
......
......@@ -60,7 +60,13 @@
<el-input v-model="UserModel.LoginName"></el-input>
</el-form-item>
<el-form-item label="密码 :">
<el-input v-model="UserModel.password" :disabled="UserModel.UserID!=0"></el-input>
<el-input v-model="UserModel.password" :disabled="UserModel.UserID!=0" @input="passwordCheck" maxlength="16" placeholder="请输入6-16位数字,字母,符号的组合密码"></el-input>
<div id="tips">
<span class="tips-item" :class="(userRegPwdLevel === 1) ? 's1' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 2) ? 's2' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 3) ? 's3' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 4) ? 's4' : ''">很强</span>
</div>
</el-form-item>
<el-form-item label="角色名称 :" align="left">
<template>
......@@ -153,6 +159,7 @@ export default {
UpdateUserShow: false,
DeleteUserShow: false,
ResetPwdShow: false,
userRegPwdLevel: 0, //用户注册密码强度
}
},
methods: {
......@@ -292,6 +299,11 @@ export default {
createUser() {
var that = this;
if(this.userRegPwdLevel<3)
{
alert('密码强度不够,请重新填写6-16位数字,字线与字符的组合')
return;
}
this.ApiFun.account.CreateUser({
data: that.UserModel,
success: function (data) {
......@@ -460,6 +472,36 @@ export default {
}
})
},
passwordCheck() {
// 0: 表示第一个级别 1:表示第二个级别 2:表示第三个级别
// 3: 表示第四个级别 4:表示第五个级别
let modes = 0;
if(this.UserModel.password.length < 6){ //最初级别
this.userRegPwdLevel = 1;
return false;
}
if(/\d/.test(this.UserModel.password)){ //如果用户输入的密码 包含了数字
modes++;
}
if(/[a-z]/.test(this.UserModel.password)){ //如果用户输入的密码 包含了小写的a到z
modes++;
}
if(/[A-Z]/.test(this.UserModel.password)){ //如果用户输入的密码 包含了大写的A到Z
modes++;
}
if(/\W/.test(this.UserModel.password)){ //如果是非数字 字母 下划线
modes++;
}
switch(modes){
case 1 : { this.userRegPwdLevel = 1; break; }
case 2 : { this.userRegPwdLevel = 2; break; }
case 3 : { this.userRegPwdLevel = 3; break; }
case 4 : { this.userRegPwdLevel = 4; break; }
}
},
},
created: function () {
this.searchUser();
......@@ -542,4 +584,52 @@ export default {
margin-top: 20px;
text-align: right;
}
#tips{
font-size: 12px;
height: 15px;
display: inline-block;
width: auto;
margin: 0 0 0 60px;
}
#tips span .word {
float: left;
width: 130px;
height: 20px;
color: #fff;
overflow:hidden;
margin-right: 10px;
background: #D7D9DD;
line-height:20px;
text-align: center;
}
#tips span {
float: left;
width: 40px;
height: 20px;
color: #fff;
overflow:hidden;
margin-right: 10px;
background: #D7D9DD;
line-height:20px;
text-align: center;
}
#tips .s1 {
background: #F45A68;
}
#tips .s2 {
background: #fc0;
}
#tips .s3 {
background: #cc0;
}
#tips .s4 {
background: #14B12F;
}
</style>
......@@ -48,7 +48,13 @@
<el-input type="password" v-model="ruleForm2.oldPass" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="新密码" prop="newPass">
<el-input type="password" v-model="ruleForm2.newPass" auto-complete="off"></el-input>
<el-input type="password" v-model="ruleForm2.newPass" auto-complete="off" @input="passwordCheck" maxlength="16" placeholder="请输入6-16位数字,字母,符号的组合密码"></el-input>
<div id="tips">
<span class="tips-item" :class="(userRegPwdLevel === 1) ? 's1' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 2) ? 's2' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 3) ? 's3' : ''"></span>
<span class="tips-item" :class="(userRegPwdLevel === 4) ? 's4' : ''">很强</span>
</div>
</el-form-item>
<el-form-item label="确认密码" prop="checkPass">
<el-input type="password" v-model="ruleForm2.checkPass" auto-complete="off" @keyup.enter.native="submitForm"></el-input>
......@@ -122,7 +128,8 @@ export default {
},
FunctionList: [],
showNoClientPos: false,
NoClientPosList: []
NoClientPosList: [],
userRegPwdLevel: 0, //用户注册密码强度
}
},
methods: {
......@@ -159,6 +166,11 @@ export default {
},
submitForm: function () {
if(this.userRegPwdLevel<3)
{
alert('密码强度不够,请重新填写6-16位数字,字线与字符的组合')
return;
}
this.$refs.ruleForm2.validate((valid) => {
if (valid) {
var modifyParams = {
......@@ -180,7 +192,35 @@ export default {
return false;
}
});
},
passwordCheck() {
// 0: 表示第一个级别 1:表示第二个级别 2:表示第三个级别
// 3: 表示第四个级别 4:表示第五个级别
let modes = 0;
if(this.ruleForm2.newPass.length < 6){ //最初级别
this.userRegPwdLevel = 1;
return false;
}
if(/\d/.test(this.ruleForm2.newPass)){ //如果用户输入的密码 包含了数字
modes++;
}
if(/[a-z]/.test(this.ruleForm2.newPass)){ //如果用户输入的密码 包含了小写的a到z
modes++;
}
if(/[A-Z]/.test(this.ruleForm2.newPass)){ //如果用户输入的密码 包含了大写的A到Z
modes++;
}
if(/\W/.test(this.ruleForm2.newPass)){ //如果是非数字 字母 下划线
modes++;
}
switch(modes){
case 1 : { this.userRegPwdLevel = 1; break; }
case 2 : { this.userRegPwdLevel = 2; break; }
case 3 : { this.userRegPwdLevel = 3; break; }
case 4 : { this.userRegPwdLevel = 4; break; }
}
},
},
created: function () {
this.loginName = this.$route.query.loginName;
......@@ -516,4 +556,32 @@ body {
line-height: 1;
padding-top: 10px;
}
#tips span {
float: left;
width: 40px;
height: 20px;
color: #fff;
overflow:hidden;
margin-right: 10px;
background: #D7D9DD;
line-height:20px;
text-align: center;
}
#tips .s1 {
background: #F45A68;
}
#tips .s2 {
background: #fc0;
}
#tips .s3 {
background: #cc0;
}
#tips .s4 {
background: #14B12F;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment