import { Form, Input, Modal, message } from "antd";
|
import { api } from "../api";
|
|
export default function ChangePasswordModal({
|
open,
|
onClose,
|
}: {
|
open: boolean;
|
onClose: () => void;
|
}) {
|
const [form] = Form.useForm<{
|
old_password: string;
|
new_password: string;
|
confirm: string;
|
}>();
|
|
return (
|
<Modal
|
title="修改密码"
|
open={open}
|
destroyOnClose
|
onCancel={() => {
|
form.resetFields();
|
onClose();
|
}}
|
onOk={async () => {
|
const v = await form.validateFields();
|
try {
|
await api.post("/api/auth/change-password", {
|
old_password: v.old_password,
|
new_password: v.new_password,
|
});
|
message.success("密码已修改");
|
form.resetFields();
|
onClose();
|
} catch (e: unknown) {
|
const msg =
|
(e as { response?: { data?: { detail?: string } } })?.response?.data?.detail || "修改失败";
|
message.error(typeof msg === "string" ? msg : "修改失败");
|
}
|
}}
|
>
|
<Form form={form} layout="vertical">
|
<Form.Item name="old_password" label="原密码" rules={[{ required: true }]}>
|
<Input.Password autoComplete="current-password" />
|
</Form.Item>
|
<Form.Item name="new_password" label="新密码" rules={[{ required: true, min: 6 }]}>
|
<Input.Password autoComplete="new-password" />
|
</Form.Item>
|
<Form.Item
|
name="confirm"
|
label="确认新密码"
|
dependencies={["new_password"]}
|
rules={[
|
{ required: true },
|
({ getFieldValue }) => ({
|
validator(_, value) {
|
if (!value || getFieldValue("new_password") === value) return Promise.resolve();
|
return Promise.reject(new Error("两次输入的新密码不一致"));
|
},
|
}),
|
]}
|
>
|
<Input.Password autoComplete="new-password" />
|
</Form.Item>
|
</Form>
|
</Modal>
|
);
|
}
|
