优化修改密码

This commit is contained in:
zjl 2024-12-17 15:02:01 +08:00
parent 440a157027
commit 6b50a4d9ba

View File

@ -9,17 +9,20 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref,nextTick } from 'vue'; import { ref, nextTick } from 'vue';
import { basicModal, useModal } from '@/components/Modal'; import { basicModal, useModal } from '@/components/Modal';
import { ElMessage } from 'element-plus'; import { ElMessage } from 'element-plus';
import { BasicForm, FormSchema, useForm } from '@/components/Form/index'; import { BasicForm, FormSchema, useForm } from '@/components/Form/index';
import { changePassword } from '@/api/system/user'; import { changePassword } from '@/api/system/user';
/**
* 创建表单
*/
const schemas: FormSchema[] = [ const schemas: FormSchema[] = [
{ {
field: 'password', field: 'password',
component: 'Input', component: 'Input',
type:'password', type: 'password',
label: '旧密码', label: '旧密码',
componentProps: { componentProps: {
placeholder: '请输入旧密码', placeholder: '请输入旧密码',
@ -29,7 +32,7 @@
{ {
field: 'newPassword', field: 'newPassword',
component: 'Input', component: 'Input',
type:'password', type: 'password',
label: '新密码', label: '新密码',
componentProps: { componentProps: {
placeholder: '请输入新密码', placeholder: '请输入新密码',
@ -39,7 +42,7 @@
{ {
field: 'confirmPassword', field: 'confirmPassword',
component: 'Input', component: 'Input',
type:'password', type: 'password',
label: '确认密码', label: '确认密码',
componentProps: { componentProps: {
placeholder: '请再次输入新密码', placeholder: '请再次输入新密码',
@ -50,7 +53,10 @@
const modalRef: any = ref(null); const modalRef: any = ref(null);
const [register, { submit,resetFields,getFieldsValue }] = useForm({ /**
* 定义页面
*/
const [register, { submit, resetFields, getFieldsValue }] = useForm({
collapsedRows: 3, collapsedRows: 3,
labelWidth: 80, labelWidth: 80,
layout: 'horizontal', layout: 'horizontal',
@ -58,38 +64,53 @@
schemas, schemas,
}); });
/**
* 定义模态
*/
const [modalRegister, { openModal, closeModal, setSubLoading }] = useModal({ const [modalRegister, { openModal, closeModal, setSubLoading }] = useModal({
title: '修改密码', title: '修改密码',
subBtuText: '提交修改', subBtuText: '提交修改',
}); });
/**
* 提交表单数据
*/
async function formSubmit() { async function formSubmit() {
const formRes = await submit(); const formRes = await submit();
if (formRes) { if (formRes) {
try{ try {
await changePassword(getFieldsValue()) await changePassword(getFieldsValue());
closeModal(); closeModal();
ElMessage.success('修改成功'); ElMessage.success('修改成功');
} catch(e){ } catch (e) {
setSubLoading(false); setSubLoading(false);
} }
} else { } else {
ElMessage.error('验证失败,请填写完整信息'); ElMessage.error('验证失败,请填写完整信息');
setSubLoading(false); setSubLoading(false);
} }
} }
/**
* 显示弹窗
*/
async function showModal() { async function showModal() {
openModal(); openModal();
await nextTick() await nextTick();
resetFields() resetFields();
} }
/**
* 执行重置
* @param values 参数
*/
function handleReset(values: Recordable) { function handleReset(values: Recordable) {
console.log(values); console.log(values);
} }
/**
* 定义函数
*/
defineExpose({ defineExpose({
showModal, showModal,
}); });