优化参数管理页面新建编辑弹窗交互

web/src/app/admin/system-params/page.tsx

@@ -61,6 +61,7 @@ export default function AdminSystemParamsPage() {
   const [keyword, setKeyword] = useState("");
   const [statusFilter, setStatusFilter] = useState<StatusFilter>("all");
   const [editingId, setEditingId] = useState<number | null>(null);
+  const [editorOpen, setEditorOpen] = useState(false);
   const [error, setError] = useState("");
   const [success, setSuccess] = useState("");
 
@@ -113,6 +114,7 @@ export default function AdminSystemParamsPage() {
     setError("");
     setSuccess("");
     resetForm();
+    setEditorOpen(true);
   }, [resetForm]);
 
   const startEdit = useCallback((item: SystemParamSummary) => {
@@ -126,8 +128,14 @@ export default function AdminSystemParamsPage() {
       description: item.description ?? "",
       status: item.status,
     });
+    setEditorOpen(true);
   }, [formApi]);
 
+  const closeEditor = useCallback(() => {
+    setEditorOpen(false);
+    resetForm();
+  }, [resetForm]);
+
   const saveMutation = useMutation({
     mutationFn: async () => {
       if (!canManage) {
@@ -175,6 +183,7 @@ export default function AdminSystemParamsPage() {
     onSuccess: async (mode) => {
       setError("");
       setSuccess(mode === "created" ? "系统参数已创建" : "系统参数已更新");
+      setEditorOpen(false);
       resetForm();
       await refreshList();
     },
@@ -196,6 +205,7 @@ export default function AdminSystemParamsPage() {
     },
     onSuccess: async (deletedId) => {
       if (editingId === deletedId) {
+        setEditorOpen(false);
         resetForm();
       }
       setError("");
@@ -372,8 +382,21 @@ export default function AdminSystemParamsPage() {
       </Card>
 
       {canManage && (
-        <Card title={editingId === null ? "新建系统参数" : "编辑系统参数"}>
-          <Space direction="vertical" size={12} className="w-full">
+        <Modal
+          title={editingId === null ? "新建系统参数" : "编辑系统参数"}
+          open={editorOpen}
+          onCancel={closeEditor}
+          width={760}
+          destroyOnClose
+          footer={(
+            <Space>
+              <Button type="primary" loading={saveMutation.isPending} onClick={() => saveMutation.mutate()}>
+                {saveMutation.isPending ? "提交中..." : editingId === null ? "创建" : "保存"}
+              </Button>
+              <Button onClick={resetForm}>重置</Button>
+            </Space>
+          )}
+        >
           <Form<FormState> form={formApi} layout="vertical" initialValues={EMPTY_FORM}>
             <div className="grid gap-4 md:grid-cols-2">
               <Form.Item<FormState>
@@ -407,15 +430,7 @@ export default function AdminSystemParamsPage() {
               </Form.Item>
             </div>
           </Form>
-
-            <Space>
-              <Button type="primary" loading={saveMutation.isPending} onClick={() => saveMutation.mutate()}>
-                {saveMutation.isPending ? "提交中..." : editingId === null ? "创建" : "保存"}
-              </Button>
-              <Button onClick={resetForm}>重置</Button>
-            </Space>
-          </Space>
-        </Card>
+        </Modal>
       )}
     </Space>
   );