wxc
2 years ago
16 changed files with 241 additions and 220 deletions
@ -0,0 +1,145 @@ |
|||||||
|
<template> |
||||||
|
<el-dialog |
||||||
|
title="修改密码" |
||||||
|
:async="true" |
||||||
|
width="550px" |
||||||
|
@confirm="handleSubmit" |
||||||
|
> |
||||||
|
<el-form |
||||||
|
ref="formRef" |
||||||
|
:model="formData" |
||||||
|
label-width="84px" |
||||||
|
:rules="formRules" |
||||||
|
> |
||||||
|
<el-form-item label="旧密码" prop="oldpassword"> |
||||||
|
<el-input |
||||||
|
v-model.trim="formData.oldpassword" |
||||||
|
show-password |
||||||
|
clearable |
||||||
|
placeholder="请输入旧密码" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
|
||||||
|
<el-form-item label="新密码" prop="password"> |
||||||
|
<el-input |
||||||
|
v-model.trim="formData.password" |
||||||
|
show-password |
||||||
|
clearable |
||||||
|
placeholder="请输入密码" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
|
||||||
|
<el-form-item label="确认密码" prop="passwordConfirm"> |
||||||
|
<el-input |
||||||
|
v-model.trim="formData.passwordConfirm" |
||||||
|
show-password |
||||||
|
clearable |
||||||
|
placeholder="请输入确认密码" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<template #footer> |
||||||
|
<div class="dialog-footer"> |
||||||
|
<el-button @click="emit('close')">取消</el-button> |
||||||
|
<el-button type="primary" @click="handleSubmit">确认修改</el-button> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
</el-dialog> |
||||||
|
</template> |
||||||
|
<script lang="ts" setup> |
||||||
|
import type { FormInstance } from "element-plus"; |
||||||
|
import { |
||||||
|
adminAdd, |
||||||
|
adminEdit, |
||||||
|
adminDetail, |
||||||
|
resetPassword, |
||||||
|
} from "@/api/perms/admin"; |
||||||
|
import feedback from "@/utils/feedback"; |
||||||
|
const emit = defineEmits(["close"]); |
||||||
|
const formRef = shallowRef<FormInstance>(); |
||||||
|
|
||||||
|
const formData = reactive({ |
||||||
|
oldpassword: "", |
||||||
|
password: "", |
||||||
|
passwordConfirm: "", |
||||||
|
}); |
||||||
|
|
||||||
|
const password = (rule: object, value: string, callback: any) => { |
||||||
|
if (formData.oldpassword) { |
||||||
|
if (value == formData.oldpassword) |
||||||
|
callback(new Error("旧密码和原密码相同!")); |
||||||
|
} |
||||||
|
callback(); |
||||||
|
}; |
||||||
|
|
||||||
|
const passwordConfirmValidator = ( |
||||||
|
rule: object, |
||||||
|
value: string, |
||||||
|
callback: any |
||||||
|
) => { |
||||||
|
if (formData.password) { |
||||||
|
if (!value) callback(new Error("请再次输入密码")); |
||||||
|
if (value !== formData.password) |
||||||
|
callback(new Error("两次输入密码不一致!")); |
||||||
|
} |
||||||
|
callback(); |
||||||
|
}; |
||||||
|
const formRules = reactive({ |
||||||
|
oldpassword: [ |
||||||
|
{ |
||||||
|
required: true, |
||||||
|
message: "请输入旧密码", |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
] as any[], |
||||||
|
password: [ |
||||||
|
{ |
||||||
|
required: true, |
||||||
|
message: "请输入密码", |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
{ |
||||||
|
validator: password, |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
] as any[], |
||||||
|
passwordConfirm: [ |
||||||
|
{ |
||||||
|
required: true, |
||||||
|
message: "请再次输入密码", |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
{ |
||||||
|
validator: passwordConfirmValidator, |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
] as any[], |
||||||
|
}); |
||||||
|
|
||||||
|
const handleSubmit = async () => { |
||||||
|
await formRef.value?.validate(); |
||||||
|
await resetPassword(formData); |
||||||
|
feedback.msgSuccess("密码修改成功"); |
||||||
|
emit("close"); |
||||||
|
} |
||||||
|
|
||||||
|
const setFormData = async (row: any) => { |
||||||
|
formRules.password = [ |
||||||
|
{ |
||||||
|
validator: password, |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
]; |
||||||
|
formRules.passwordConfirm = [ |
||||||
|
{ |
||||||
|
validator: passwordConfirmValidator, |
||||||
|
trigger: "blur", |
||||||
|
}, |
||||||
|
]; |
||||||
|
}; |
||||||
|
|
||||||
|
const handleClose = () => { |
||||||
|
emit("close"); |
||||||
|
}; |
||||||
|
|
||||||
|
</script> |
||||||
@ -1,155 +0,0 @@ |
|||||||
<template> |
|
||||||
<div class="edit-popup"> |
|
||||||
<popup |
|
||||||
ref="popupRef" |
|
||||||
:title="popupTitle" |
|
||||||
:async="true" |
|
||||||
width="550px" |
|
||||||
@confirm="handleSubmit" |
|
||||||
@close="handleClose" |
|
||||||
> |
|
||||||
<el-form ref="formRef" :model="formData" label-width="84px" :rules="formRules"> |
|
||||||
|
|
||||||
<el-form-item label="旧密码" prop="oldpassword"> |
|
||||||
<el-input |
|
||||||
v-model.trim="formData.oldpassword" |
|
||||||
show-password |
|
||||||
clearable |
|
||||||
placeholder="请输入旧密码" |
|
||||||
/> |
|
||||||
</el-form-item> |
|
||||||
|
|
||||||
<el-form-item label="新密码" prop="password"> |
|
||||||
<el-input |
|
||||||
v-model.trim="formData.password" |
|
||||||
show-password |
|
||||||
clearable |
|
||||||
placeholder="请输入密码" |
|
||||||
/> |
|
||||||
</el-form-item> |
|
||||||
|
|
||||||
<el-form-item label="确认密码" prop="passwordConfirm"> |
|
||||||
<el-input |
|
||||||
v-model.trim="formData.passwordConfirm" |
|
||||||
show-password |
|
||||||
clearable |
|
||||||
placeholder="请输入确认密码" |
|
||||||
/> |
|
||||||
</el-form-item> |
|
||||||
|
|
||||||
|
|
||||||
</el-form> |
|
||||||
</popup> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
<script lang="ts" setup> |
|
||||||
import type { FormInstance } from 'element-plus' |
|
||||||
import Popup from '@/components/popup/index.vue' |
|
||||||
import { adminAdd, adminEdit, adminDetail, resetPassword } from '@/api/perms/admin' |
|
||||||
import { useDictOptions } from '@/hooks/useDictOptions' |
|
||||||
import { roleAll } from '@/api/perms/role' |
|
||||||
import { postAll } from '@/api/org/post' |
|
||||||
import { deptLists } from '@/api/org/department' |
|
||||||
import feedback from '@/utils/feedback' |
|
||||||
const emit = defineEmits(['success', 'close']) |
|
||||||
const formRef = shallowRef<FormInstance>() |
|
||||||
const popupRef = shallowRef<InstanceType<typeof Popup>>() |
|
||||||
const mode = ref('add') |
|
||||||
const popupTitle = computed(() => { |
|
||||||
return '修改密码' |
|
||||||
}) |
|
||||||
|
|
||||||
const formData = reactive({ |
|
||||||
oldpassword: '', |
|
||||||
password: '', |
|
||||||
passwordConfirm: '', |
|
||||||
}) |
|
||||||
|
|
||||||
|
|
||||||
const popupTrue = computed(() => { |
|
||||||
return mode.value == 'edit' ? true: false |
|
||||||
}) |
|
||||||
const password = (rule: object, value: string, callback: any) => { |
|
||||||
if (formData.oldpassword) { |
|
||||||
if (value == formData.oldpassword) callback(new Error('旧密码和原密码相同!')) |
|
||||||
} |
|
||||||
callback() |
|
||||||
} |
|
||||||
|
|
||||||
const passwordConfirmValidator = (rule: object, value: string, callback: any) => { |
|
||||||
if (formData.password) { |
|
||||||
if (!value) callback(new Error('请再次输入密码')) |
|
||||||
if (value !== formData.password) callback(new Error('两次输入密码不一致!')) |
|
||||||
} |
|
||||||
callback() |
|
||||||
} |
|
||||||
const formRules = reactive({ |
|
||||||
oldpassword: [ |
|
||||||
{ |
|
||||||
required: true, |
|
||||||
message: '请输入旧密码', |
|
||||||
trigger: 'blur' |
|
||||||
} |
|
||||||
] as any[], |
|
||||||
password: [ |
|
||||||
{ |
|
||||||
required: true, |
|
||||||
message: '请输入密码', |
|
||||||
trigger: 'blur' |
|
||||||
}, |
|
||||||
{ |
|
||||||
validator: password, |
|
||||||
trigger: 'blur' |
|
||||||
} |
|
||||||
] as any[], |
|
||||||
passwordConfirm: [ |
|
||||||
{ |
|
||||||
required: true, |
|
||||||
message: '请再次输入密码', |
|
||||||
trigger: 'blur' |
|
||||||
}, |
|
||||||
{ |
|
||||||
validator: passwordConfirmValidator, |
|
||||||
trigger: 'blur' |
|
||||||
} |
|
||||||
] as any[] |
|
||||||
}) |
|
||||||
|
|
||||||
|
|
||||||
const handleSubmit = async () => { |
|
||||||
await formRef.value?.validate() |
|
||||||
await resetPassword(formData) |
|
||||||
popupRef.value?.close() |
|
||||||
feedback.msgSuccess('操作成功') |
|
||||||
emit('success') |
|
||||||
} |
|
||||||
|
|
||||||
const open = (type = 'add') => { |
|
||||||
mode.value = type |
|
||||||
popupRef.value?.open() |
|
||||||
} |
|
||||||
|
|
||||||
const setFormData = async (row: any) => { |
|
||||||
formRules.password = [ |
|
||||||
{ |
|
||||||
validator: password, |
|
||||||
trigger: 'blur' |
|
||||||
} |
|
||||||
] |
|
||||||
formRules.passwordConfirm = [ |
|
||||||
{ |
|
||||||
validator: passwordConfirmValidator, |
|
||||||
trigger: 'blur' |
|
||||||
} |
|
||||||
] |
|
||||||
} |
|
||||||
|
|
||||||
const handleClose = () => { |
|
||||||
emit('close') |
|
||||||
} |
|
||||||
|
|
||||||
defineExpose({ |
|
||||||
open, |
|
||||||
setFormData |
|
||||||
}) |
|
||||||
</script> |
|
||||||
Loading…
Reference in new issue