updpwd.vue 6.29 KB
<template>
    <div>
        <!-- 修改密码diglog -->
		<el-dialog
          :title="$t('dialog.changePW')"
          class="manage-dialog"
          :visible.sync="passwordDialogVisible"
          :close-on-click-modal="false"
          @close="cancledialog()">
			<el-form :model="passwordForm" status-icon ref="passwordForm" :rules="rules">
				<!-- <el-form-item :label="$t('dialog.loginName')" prop="loginName">
					<el-input v-model="passwordForm.loginName" disabled=""></el-input>
				</el-form-item> -->
				<el-form-item :label="$t('dialog.oldPW')" prop="password">
					<el-input type="password" v-model="passwordForm.password"></el-input>
				</el-form-item>
				<el-form-item :label="$t('dialog.newPW')" prop="newpass">
					<el-input type="password" v-model="passwordForm.newpass"></el-input>
				</el-form-item>
				<el-form-item :label="$t('dialog.confirmPW')" prop="checkPass">
					<el-input type="password" v-model="passwordForm.checkPass"></el-input>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="passwordDialogVisible = false" class="dialog-btn">{{$t('dialog.cancel')}}</el-button>
				<el-button type="primary" @click="changeSubmit('passwordForm')" class="dialog-btn dialog-confirm-btn">{{$t('dialog.confirm')}}</el-button>
			</div>
		</el-dialog>
    </div>
</template>

<script>
export default {
    data() {
        var validatorName = (rule, value, callback) => {
			if (value === '') {
				return callback(new Error('请输入用户名'));
            }
            /*else if(value.length<2||value.length>10){
				return callback(new Error('长度在 2到 10 个字符'));
			}*/
			this.$api.management.userList({
				// loginName: value,
				// _t: Date.parse(new Date()) / 1000
			})
			.then((data) => {
				if(data.data.data.length!=0){
					return callback(new Error('用户名重复,请重新输入'));
				}else{
					callback();
				}
			})
			.catch((error) => { })
        };
        var validatePass = (rule, value, callback) => {
			var exp = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,16}$/; //密码强度正则,最少6位最多16位,包括1个大写字母,1个小写字母,1个数字,1个特殊字符以上两种
			// if (!exp.test(value)) {
			// 	return callback(new Error('请输入不小于六位包含字母数字的密码'));
			// }
			if (value === '') {
				callback(new Error('请输入旧密码'));
			}else{
				callback()
			}
		}
        var validatePass1 = (rule, value, callback) => {
			var exp = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,16}$/; 
			if (!exp.test(value)) {
				return callback(new Error('请输入不小于六位包含字母数字的密码'));
			}
			if (value === '') {
				callback(new Error('请输入密码'));
			}else if(value == this.passwordForm.password){
				callback(new Error('新旧密码相同'))
			} else {
				if (this.passwordForm.checkPass !== '') {
					this.$refs.passwordForm.validateField('checkPass');
				}
				callback();
			}
		};
		var validatePass2 = (rule, value, callback) => {
			var exp = /^(?![A-Z]+$)(?![a-z]+$)(?!\d+$)(?![\W_]+$)\S{6,16}$/; 
			if (!exp.test(value)) {
				return callback(new Error('请输入不小于六位包含字母数字的密码'));
			}
			if (value === '') {
			    callback(new Error('请再次输入密码'));
			} else if (value !== this.passwordForm.newpass) {
			    callback(new Error('两次输入密码不一致!'));
			} else {
			    callback();
			}
		};
        return {
            passwordDialogVisible: false,
            passwordForm:{
				password:'',
				newpass:'',
				checkPass:''
			},
            rules: {
				password:[
					{ validator:validatePass, trigger: 'change' },
					{ min: 6, max: 16, message: '密码长度不小于6位', trigger: 'blur' }
				],
				newpass: [
					{ validator: validatePass1, trigger: 'change' },
				],
				checkPass: [
					{ validator: validatePass2, trigger: 'change' },
				],
				realName: [
					{ required: true, message: '请输入姓名', trigger: 'blur' },
					// { min: 2, max: 10, message: '长度在 2到 10 个字符', trigger: 'blur' }
				],
				// loginName: [
				// 	{ required: true, message: '请输入姓名', trigger: 'blur' },
				// 	{ validator: validatorName, trigger: 'blur' }
				// ],
				// tel: [
				// 	{ validator: validatorTel, trigger: 'blur' }
				// ],
				// email:[
				// 	{ validator: validatorEmail, trigger: 'blur' }
				// ]
			},
        }
    },
    methods: {
        dialogInit(login_name) {
			this.passwordForm.loginName = login_name
            this.passwordDialogVisible = true;
        },
        cancledialog() {
            // this.passwordForm = {};
			this.$refs.passwordForm.resetFields();
        },
        changeSubmit(formName) {
			if(!this.passwordForm.newpass || !this.passwordForm.checkPass || !this.passwordForm.password){
				this.$message({
					showClose: true,
					message: '密码不能为空!',
					type: 'warning'
			    });
			}else if(this.passwordForm.newpass == this.passwordForm.checkPass){
				if(this.passwordForm.password == this.passwordForm.newpass){
				this.$message({
					showClose: true,
					message: '新旧密码不能相同!',
					type: 'warning'
              });
			  }else{
				  this.$api.management.editUser({
						loginName:this.passwordForm.loginName,
						oldPassWord:this.passwordForm.password,
						password:this.passwordForm.newpass
				  })
				.then((res) => {
					this.passwordDialogVisible = false
					if(res.data.code == 200) {
						this.$message({
							showClose: true,
							message: this.$t('message.changePWSuccess'),
							type: 'success'
						})
						this.logout()
					}else{
						this.$message({
							showClose: true,
							message: this.$t('message.changePWFailed'),
							type: 'error'
						})
					}
				})
				.catch((err) => { 
				})
			}
			}else {
				this.$message({
					showClose: true,
					message: '两次输入密码不一致!',
					type: 'warning'
              });
			}
		},
		logout() {
			for(let i in window.localStorage) {
				if(i == 'lang' || i == 'oldAlarm'){
					
				}else{
					window.localStorage.removeItem(i);
				}
			}
			for(let i in window.sessionStorage) {
				window.sessionStorage.removeItem(i);
			}
			let cookieInfo = this.$cookie.get();
			for(let k in cookieInfo) {
				this.$cookie.remove(k);
			}
			this.$router.push('/');
		},
    }
}
</script>


<style scoped>

</style>