<template>
|
<div>
|
<el-dialog :visible.sync="dialogVisible" title="修改密码" :close-on-click-modal="false"
|
:modal-append-to-body="false" v-if="dialogVisible" width="40%">
|
<el-form size="mini" :model="form" label-width="120px" ref="form" :rules="formRules">
|
<el-form-item label="旧密码：" prop="oldPassword">
|
<el-input v-model="form.oldPassword" type="password" placeholder="请输入旧密码" clearable>
|
</el-input>
|
</el-form-item>
|
<el-form-item label="新密码：" prop="newPassword">
|
<el-input v-model="form.newPassword" type="password" placeholder="请输入新密码" clearable>
|
</el-input>
|
</el-form-item>
|
<el-form-item label="确认密码：" prop="checkPassword">
|
<el-input v-model="form.checkPassword" type="password" placeholder="请输入确认密码" clearable>
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button size="mini" @click="submit" type="primary" :loading="loading">保存</el-button>
|
<el-button size="mini" @click="dialogVisible = false">取消</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
<script>
|
import { forceModify } from '../../../api/oauth/index'
|
import { mapState, mapMutations } from 'vuex'
|
// import config from '@/app.config.js'
|
import { validatePwd } from '@/utils/validator'
|
const sm2 = require('sm-crypto').sm2
|
|
export default {
|
props: {
|
show: {
|
type: Boolean,
|
default: false
|
}
|
},
|
watch: {
|
show(newValue, oldValue) {
|
this.dialogVisible = newValue
|
},
|
dialogVisible(newValue, oldValue) {
|
this.$emit('update:show', newValue)
|
if (!newValue) {
|
this.initData()
|
}
|
}
|
},
|
data() {
|
return {
|
form: {
|
oldPassword: null,
|
newPassword: null,
|
checkPassword: null
|
},
|
loading: false,
|
formRules: {
|
oldPassword: [{ required: true, message: '请输入旧密码', trigger: 'change' }],
|
newPassword: [{ required: true, validator: validatePwd, trigger: 'change' }],
|
checkPassword: [{
|
required: true,
|
validator: (rule, value, callback) => {
|
if (!value) {
|
callback(new Error('请再次输入密码'))
|
} else if (value !== this.form.newPassword) {
|
callback(new Error('两次输入密码不一致'))
|
} else {
|
callback()
|
}
|
}
|
}]
|
},
|
dialogVisible: false
|
}
|
},
|
computed: {
|
...mapState(['userInfo'])
|
},
|
methods: {
|
...mapMutations(['logout']),
|
async _forceModify(params) {
|
if (this.loading) {
|
return
|
}
|
this.loading = true
|
try {
|
const res = await forceModify(params)
|
console.log(res)
|
this.logout()
|
this.$router.replace('/')
|
this.loading = false
|
} catch (error) {
|
this.loading = false
|
}
|
},
|
doSm3AndSm2Encrypt(sourceStr) {
|
return '04' + sm2.doEncrypt(sourceStr, process.env.VUE_APP_PUBLICKEY, 1)
|
// // 密码加密
|
// /* eslint-disable */
|
// const sm2Utils = new Sm2Utils();
|
// const public_key = config.public_key
|
// const sm3_random_plain =
|
// Sm3Utils.encryptFromText(sourceStr) +
|
// '|' +
|
// sm2Utils.randomWord(8) +
|
// '|' +
|
// sourceStr;
|
// const sm3_sm2_plain = sm2Utils.encryptFromText(
|
// public_key,
|
// sm3_random_plain,
|
// );
|
// return '{crypto}' + sm3_sm2_plain;
|
// /* eslint-enable */
|
},
|
/**
|
* 提交密码
|
*/
|
submit() {
|
this.$refs.form.validate(valid => {
|
if (valid) {
|
console.log(this.form.oldPassword, this.form.newPassword)
|
/* eslint-disable */
|
const params = {
|
"appId": process.env.VUE_APP_ID, // 应用id
|
"oldPsCode": this.doSm3AndSm2Encrypt(this.form.oldPassword),// 原密码
|
"psCode": this.doSm3AndSm2Encrypt(this.form.newPassword), // 密码
|
"confirmPsCode": this.doSm3AndSm2Encrypt(this.form.checkPassword) // 确认密码
|
}
|
/* eslint-enable */
|
this._forceModify(params)
|
} else {
|
console.log('error submit!!')
|
return false
|
}
|
})
|
},
|
/**
|
* 初始化
|
*/
|
initData() {
|
for (const key in this.form) {
|
this.form[key] = null
|
}
|
}
|
}
|
}
|
</script>
|
