de/frontend/src/views/system/user/PasswordUpdateForm.vue
2023-06-21 17:48:53 +08:00

113 lines
2.7 KiB
Vue

<template>
<el-form
ref="createUserForm"
:model="form"
:rules="rule"
size="small"
label-width="auto"
label-position="right"
>
<el-form-item v-if="!oldPwd" :label="$t('user.origin_passwd')" prop="oldPwd">
<dePwd v-model="form.oldPwd" />
</el-form-item>
<el-form-item :label="$t('user.new_passwd')" prop="newPwd">
<dePwd v-model="form.newPwd" />
</el-form-item>
<el-form-item :label="$t('user.confirm_passwd')" prop="repeatPwd">
<dePwd v-model="form.repeatPwd" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="save">{{
$t('commons.confirm')
}}</el-button>
</el-form-item>
</el-form>
</template>
<script>
import { updatePersonPwd } from '@/api/system/user'
import dePwd from '@/components/deCustomCm/DePwd.vue'
import { Base64 } from 'js-base64'
export default {
name: 'PasswordUpdateForm',
components: { dePwd },
props: {
oldPwd: {
type: String,
default: ""
}
},
data() {
return {
form: {},
rule: {
oldPwd: [
{
required: true,
message: this.$t('user.input_password'),
trigger: 'blur'
}
],
newPwd: [
{
required: true,
message: this.$t('user.input_password'),
trigger: 'blur'
},
{
required: true,
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
message: this.$t('member.password_format_is_incorrect'),
trigger: 'blur'
}
],
repeatPwd: [
{
required: true,
message: this.$t('user.input_password'),
trigger: 'blur'
},
{ required: true, trigger: 'blur', validator: this.repeatValidator }
]
}
}
},
created() {
if (this.oldPwd) {
this.form.oldPwd = this.oldPwd
}
},
methods: {
repeatValidator(rule, value, callback) {
if (value !== this.form.newPwd) {
callback(new Error(this.$t('member.inconsistent_passwords')))
} else {
callback()
}
},
save() {
this.$refs.createUserForm.validate((valid) => {
if (valid) {
const param = {
password: Base64.encode(this.form.oldPwd),
newPassword: Base64.encode(this.form.newPwd)
}
updatePersonPwd(param).then((res) => {
this.$success(this.$t('commons.save_success'))
this.$store.commit('user/SET_PASSWORD_MODIFIED', true)
this.logout()
})
} else {
return false
}
})
},
async logout() {
await this.$store.dispatch('user/logout')
this.$router.push('/')
}
}
}
</script>