vue前端修改用户密码验证密码格式

         <el-dialog title="修改密码" :visible.sync="dialogFormVisible" class="updatepwdbox" :before-close="cancelform" :close-on-click-modal="false">
                <el-form :model="pwddata" label-width="100px"  status-icon :rules="rules2" ref="ruleFormPWD">
                   

                    <el-form-item prop="oldpwd" label="原密码:"  >
                      <el-input type="password" v-model="pwddata.oldpwd" autocomplete="off" placeholder="请输入原密码"></el-input>
                    </el-form-item>
                    <el-form-item prop="onepwd" label="新密码:" >
                       <el-input  type="password" v-model="pwddata.onepwd" autocomplete="off" :placeholder="pwdTips"></el-input>
                    </el-form-item>
                    <el-form-item prop="twopwd" label="确认密码:" >
                       <el-input type="password" v-model="pwddata.twopwd" autocomplete="off" :placeholder="pwdTips"></el-input>
                    </el-form-item> 
                    <el-form-item prop="keypwd" label="口令:"  >
                      <el-input type="password" v-model="pwddata.keypwd" autocomplete="off" placeholder="重置密码属于敏感操作,需输入平台口令密码" maxlength="20"></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer" class="dialog-footer">
                    <el-button @click="cancelform()">取 消</el-button>
                    <el-button type="primary"  @click="submitForm()">确 定</el-button>
                </div>
            </el-dialog>

export default { 
    
    data: function ()  { 
        var validatePass = (rule, value, callback) => { 
            if (!value) {
              callback(new Error('请输入密码'));
            } else {
                // const reg =  /^(?=.*[0-9].*)(?=.*[A-Z].*)(?=.*[a-z].*)(?=.*[~!@#$%^&*()_+={}:;<>?,.].*).{8,12}$ /; 
                console.log(this.pwdreg);
                const reg = new RegExp(this.pwdreg,''); 
                if (reg.test(value)) {
                    callback();
                } else {
                    return callback(new Error('密码格式不正确,'+this.pwdTips));
                } 
            }
        };
        var validatePass2 = (rule, value, callback) => {
            if (value === '') {
                callback(new Error('请再次输入密码'));
            } else if (value !== this.pwddata.onepwd) {
                callback(new Error('两次输入密码不一致!'));
            } else {
                callback();
            }
        };

        return { 
            leftNav:true,
            collapsed:false,
            sysUserName: '', 
            activemenu:'index',
            secondMenuselected:'',
            title:'首页',
            navselected:"index",
            menulist:[],
            dialogVisible:false,
            dialogFormVisible: false,
            pwddata:{
                oldpwd:'',
                onepwd:'',
                twopwd:'',
                keypwd:'',
            }, 
            pwdreg:'', //密码正则
            pwdTips:'',
            rules2: {
                oldpwd: [
                    { required: true, message: '原密码不能为空', trigger: 'blur' },  
                ],
                onepwd: [
                    { required: true, message: '新密码不能为空', trigger: 'blur' }, 
                    { validator: validatePass , trigger: 'blur' }
                ],
                twopwd: [
                    { required: true, message: '确认密码不能为空', trigger: 'blur' }, 
                    { validator: validatePass2, trigger: 'blur' }
                ],
                keypwd:[
                    { required: true, message: '平台口令密码不能为空', trigger: 'blur' }, 
                ],
                 
            },

            content:'',
            _beforeUnload_time:'',
            _gap_time:0,
            mainstyle:'',
            myKey:'4dogs.cn',
        }
     
    },
    created:function(){
        //是否登录
        // var is_expired = localStorage.getItem('is_expired');  
        var user = sessionStorage.getItem('user');  
        // var user = this.$store.state.name; 
        //this.sysUserName = user  || ''; 
        // var sessionid = this.getCookie('sessionid');
        
        if(!user){
            this.$router.push('/login'); 
        }else{  
            this.sysUserName = user  || '';  
        } 
        if(this.$route.path == '/'){
            this.leftNav = false; 
        }
        else if(this.$route.path.indexOf('index') != -1 ){ //存在
            this.leftNav = false;  
        }else{
            // if(!sessionStorage.getItem('permidlist')){
            //     this.getPermidlist();
            // } 
            this.leftNav = true;
            // this.getNavType();
           
        }
    }, 
    mounted:function(){  
        if(this.$route.path == '/'){
            this.leftNav = false; 
            this.mainstyle ='width:100%';
        } 
        else if(this.$route.path.indexOf('index') != -1 ){ //存在
            this.leftNav = false;  
             this.mainstyle ='width:100%';
        }
        else{
           
            // if(!sessionStorage.getItem('permidlist')){
            //     this.getPermidlist();
            // }
            this.leftNav = true;  
            this.mainstyle = 'width:calc(100% - 200px)';
            this.getNavType(); 
        }
          
        window.addEventListener('beforeunload', e => this.beforeunloadFn())
        window.addEventListener('unload', e => this.unloadFn())
        var isfristlogin = sessionStorage.getItem('isfristlogin'); 
        if(isfristlogin == 0 ){
            this.$notify({
                title: '提示',
                message: '您的密码为原始密码,请进行修改(点击用户名,下拉选择修改密码)',
                duration:0,
                // showClose: false,
                offset: 50
            });
        }
        // this.getpwdconfig();
    
    },
    destroyed:function(){
        window.removeEventListener('beforeunload', e => this.beforeunloadFn());
        window.removeEventListener('unload', e => this.unloadFn());
    },
    watch:{
        // 监测store.state 左侧菜单
        '$store.state.activefirstMenu': 'getNavType',
        '$store.state.activesecondMenu': 'getNavType', 
        '$route': function(to, from){ // 路由改变时执行   
           
            if(this.$route.path == '/'){
                this.leftNav = false; 
                this.mainstyle ='width:100%';
            }
            else if(to.path.indexOf('index') != -1 ){ //存在
                this.leftNav = false;
                this.mainstyle ='width:100%';
            }
            else{ 
                // if(!sessionStorage.getItem('permidlist')){
                //     this.getPermidlist(); 
                // }else{
                    this.getNavType(); 
                // }
                this.leftNav = true;
                this.mainstyle = 'width:calc(100% - 200px)';
            } 
            
        }
    },
    methods: {   
        unloadFn(){
            this._gap_time=new Date().getTime()-this._beforeUnload_time;
            if(this._gap_time<=5){ 
                let _this = this;
                _this.$ajax({
                    method:'get',
                    url:'/myuser/userlogout', 
                })
                .then(data => {   
                    var dt = data.data;   
                    if(dt.success ){ 
                    } 
                    
                })
                .catch(data=>{ 
                }); 
            } 
        },
        getpwdconfig:function(){
            var that = this;
                this.$ajax( {
                    method:'post',
                    url:'/myuser/securityshow', 
                    data:this.qs.stringify() 
                })
                .then(function(data){ 
                    var dt  = data.data;    
                    if(dt.success){ //成功  
                        // that.failnum = dt.failnum; 
                        //^(?=.*[0-9].*)(?=.*[A-Z].*)(?=.*[a-z].*)(?=.*[~!@#$%^&*()_+={}:;<>?,.].*).{8,12}$ 
                        //^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$
                        var pwdtypes = dt.types.split(','); 
                        that.pwdreg = '^';
                        that.pwdTips= '密码包含';
                        for(var i=0;i< pwdtypes.length;i++){ //数字0 小写1 大写2 符号3
                            if(pwdtypes[i] ==0 ){
                                that.pwdreg+='(?=.*[0-9].*)'; 
                                that.pwdTips += '数字、';
                            }
                            else if(pwdtypes[i]  == 1){
                                that.pwdreg+='(?=.*[a-z].*)'; 
                                that.pwdTips += '小写字母、';
                            }
                            else if(pwdtypes[i]  == 2){
                                that.pwdreg+='(?=.*[A-Z].*)'; 
                                that.pwdTips += '大写字母、';
                            }
                            else if(pwdtypes[i]  == 3){
                                that.pwdreg+='(?=.*[~!@#$%^&*()_+={}:;<>?,.].*)'; 
                                that.pwdTips += '特殊符号(~!@#$%^&*()_+={}:;<>?,.)';
                            }
                        }
                        // that.pwdreg+='.{'+dt.passwdlength+',16}$';
                        // that.pwdTips +='且长度 '+dt.passwdlength+' - 16个字符'; 
                         that.pwdreg+='.{8,20}$';
                         that.pwdTips +='且长度 8 - 20个字符'; 
                    } 
                    
                })
                .catch(data=>{ 
                })  

        },
        getNavType(){   
            var firstMenu = this.$store.state.activefirstMenu;  
            this.navselected = firstMenu;  
            if(firstMenu == '/index') return; 
            var list  =  this.$store.state.secondMenu[firstMenu];   //全部路由
            var pageJurisdiction = this.$store.state.pageJurisdiction; //页面需要判断的路由
            var pagearr = [];
            var permidarr = sessionStorage.getItem('permidlist'); //获取后台接口路由
            if(!permidarr) return;
            for(var j = 0;j<pageJurisdiction.length;j++){
                if(permidarr.indexOf(pageJurisdiction[j].path) == -1){ //不存在,有权限
                    for(var i=0;i<list.length;i++){
                        if(list[i].name ==pageJurisdiction[j].name){
                            list.splice(i,1);
                        }
                    }
                }
            } 
            // console.log(list);
            this.menulist = list; 
            
            this.secondMenuselected = this.$store.state.activesecondMenu; 
        }, 
        getCookie: function (cname) {
            var name = cname + "=";
            var ca = document.cookie.split(';'); 
            for (var i = 0; i < ca.length; i++) {
                var c = ca[i]; 
                while (c.charAt(0) == ' ') c = c.substring(1);
                if (c.indexOf(name) != -1){
                    return c.substring(name.length, c.length);
                }
            }
            return "";
        },  
        handleCommand:function(command){
            if(command == 'updatepwd'){
                this.dialogFormVisible = true;
                this.getpwdconfig();
            }
            if(command == 'systemproblem'){
                this.dialogVisible = true;
            }
        },  
        cancelform:function(){  //取消更改密码
            this.$refs.ruleFormPWD.resetFields(); //清空
            this.dialogFormVisible = false;
        },
        submitForm() {
            var that = this;
            this.$refs.ruleFormPWD.validate((valid) => {
                if (valid) {
                    
                    this.$ajax( {
                        method:'post',
                        url:'/myuser/setnewpwd', 
                        data:that.qs.stringify({
                            oldpwd:encryptCBC(that.pwddata.oldpwd,this.myKey),
                            onepwd:encryptCBC(that.pwddata.onepwd,this.myKey),
                            twopwd:encryptCBC(that.pwddata.twopwd,this.myKey),
                            keypwd:encryptCBC(that.pwddata.keypwd,this.myKey),
                        }) 
                    })
                    .then(function(data){ 
                        var dt  = data.data;   
                        if(dt.success){ //成功 
                            that.dialogFormVisible = false;
                            that.$message({
                                message:dt.msg,
                                type: 'success'
                            }); 
                        } 
                        else{ 
                            //that.$refs.ruleFormPWD.resetFields(); //清空
                        } 
                    })
                    .catch(data=>{ 
                    }) 
                }
                // else {
                //     this.$refs.ruleFormPWD.resetFields(); //清空 
                //     return false;
                // }
            });
        }, 
        systemcancelform:function(){  //取消提交系统问题
            this.$refs.rulesystem.resetFields(); //清空
            this.dialogVisible = false;
        },
        systemsubmitForm:function(){
            var that = this;
            this.$ajax( {
                method:'post',
                url:'/loophole/adduserdemond', 
                data:this.qs.stringify({
                    content:this.content
                })
            })
            .then(function(data){ 
                var dt  = data.data;    
                if(dt.success){ //成功
                     that.$message({
                        message:dt.msg,
                        type: 'success'
                    });
                    // that.getTableData();
                    that.dialogVisible = false;
                    that.content = '';
                    that.$refs.rulesystem.resetFields(); //清空
                } 
                
            })
            .catch(data=>{ 
            })
        },
        // 退出登录
        logout: function () {
            var _this = this;
            this.$confirm('确认退出吗?', '提示', {
                // type: 'warning'
            }).then(() => { 
                this.$ajax({
                    method:'get',
                    url:'/myuser/userlogout', 
                })
                .then(data => {  
                    var dt = data.data;   
                    if(dt.success ){
                        this.$message({
                            message:dt.msg,
                            type: 'success'
                        });
                        this.clearCookie('','');
                        sessionStorage.removeItem('user'); 
                        sessionStorage.removeItem('permidlist'); 
                        sessionStorage.removeItem('isfristlogin');
                        // sessionStorage.setItem('isfristlogin',1)
                        // localStorage.removeItem('is_expired');  
                        this.$router.push('/login');
                        location.reload();
                    } 
                    
                })
                .catch(data=>{ 
                });

            }).catch(() => {

            });
        },
        changerouter:function(name){
            this.title = name;
        },
        clearCookie: function (name,value) {
            var exp = new Date();
            exp.setTime(exp.getTime() - 1); 
            document.cookie = name + "=" + escape(value)+ ";expires=" + exp.toGMTString();;
         
        },
    },
    
}

猜你喜欢

转载自blog.csdn.net/qq_42177730/article/details/115177152