jiazhizhong/certimate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ui): useAntdForm

Browse Source
This commit is contained in:
Fu Diwei
2024-12-25 14:51:32 +08:00
parent c9024c5611
commit 4d0f7c2e02
43 changed files with 779 additions and 677 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
ui/src/pages/settings/SettingsPassword.tsx
View File

@@ -5,8 +5,9 @@ import { Button, Form, Input, message, notification } from "antd";
import { createSchemaFieldRule } from "antd-zod";
import { z } from "zod";
import { getErrMsg } from "@/utils/error";
import { useAntdForm } from "@/hooks";
import { getPocketBase } from "@/repository/pocketbase";
import { getErrMsg } from "@/utils/error";
const SettingsPassword = () => {
const navigate = useNavigate();
@@ -33,37 +34,36 @@ const SettingsPassword = () => {
path: ["confirmPassword"],
});
const formRule = createSchemaFieldRule(formSchema);
const [form] = Form.useForm<z.infer<typeof formSchema>>();
const [formPending, setFormPending] = useState(false);
const {
form: formInst,
formPending,
formProps,
} = useAntdForm<z.infer<typeof formSchema>>({
onSubmit: async (values) => {
try {
await getPocketBase().admins.authWithPassword(getPocketBase().authStore.model?.email, values.oldPassword);
await getPocketBase().admins.update(getPocketBase().authStore.model?.id, {
password: values.newPassword,
passwordConfirm: values.confirmPassword,
});
const [initialChanged, setInitialChanged] = useState(false);
messageApi.success(t("common.text.operation_succeeded"));
setTimeout(() => {
getPocketBase().authStore.clear();
navigate("/login");
}, 500);
} catch (err) {
notificationApi.error({ message: t("common.text.request_error"), description: getErrMsg(err) });
}
},
});
const [formChanged, setFormChanged] = useState(false);
const handleInputChange = () => {
const fields = form.getFieldsValue();
setInitialChanged(!!fields.oldPassword && !!fields.newPassword && !!fields.confirmPassword);
};
const handleFormFinish = async (fields: z.infer<typeof formSchema>) => {
setFormPending(true);
try {
await getPocketBase().admins.authWithPassword(getPocketBase().authStore.model?.email, fields.oldPassword);
await getPocketBase().admins.update(getPocketBase().authStore.model?.id, {
password: fields.newPassword,
passwordConfirm: fields.confirmPassword,
});
messageApi.success(t("common.text.operation_succeeded"));
setTimeout(() => {
getPocketBase().authStore.clear();
navigate("/login");
}, 500);
} catch (err) {
notificationApi.error({ message: t("common.text.request_error"), description: getErrMsg(err) });
} finally {
setFormPending(false);
}
const values = formInst.getFieldsValue();
setFormChanged(!!values.oldPassword && !!values.newPassword && !!values.confirmPassword);
};
return (
@@ -72,7 +72,7 @@ const SettingsPassword = () => {
{NotificationContextHolder}
<div className="md:max-w-[40rem]">
<Form form={form} disabled={formPending} layout="vertical" onFinish={handleFormFinish}>
<Form {...formProps} form={formInst} disabled={formPending} layout="vertical">
<Form.Item name="oldPassword" label={t("settings.password.form.old_password.label")} rules={[formRule]}>
<Input.Password placeholder={t("settings.password.form.old_password.placeholder")} onChange={handleInputChange} />
</Form.Item>
@@ -86,7 +86,7 @@ const SettingsPassword = () => {
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit" disabled={!initialChanged} loading={formPending}>
<Button type="primary" htmlType="submit" disabled={!formChanged} loading={formPending}>
{t("common.button.save")}
</Button>
</Form.Item>