加页面

src/client/member/pages/TemplateEdit.tsx

@@ -0,0 +1,79 @@
+import { Card, message, Button, Space, Spin } from 'antd';
+import { useQuery, useMutation, useQueryClient ,QueryClient,QueryClientProvider} from '@tanstack/react-query';
+import ExcelToJson from '../components/ExcelToJson/index';
+import type { Template } from '@/share/exceltypes';
+import { useNavigate, useParams } from 'react-router';
+
+function TemplateEdit() {
+  const navigate = useNavigate();
+  const { id } = useParams();
+  
+  const queryClient = useQueryClient();
+
+  const { data: template, isLoading } = useQuery<Template>({
+    queryKey: ['templates', 'detail', id],
+    queryFn: async () => {
+      if (!id) return null;
+      const response = await requestWithToken({
+        url: `/v1/member/templates?id=${id}`,
+        method: 'GET'
+      });
+      return response.data;
+    },
+    enabled: !!id
+  });
+
+  const { mutate: saveTemplate, isPending } = useMutation({
+    mutationFn: async (data: Partial<Template>) => {
+      const response = await requestWithToken({
+        url: id ? `/v1/member/templates?id=${id}` : '/v1/member/templates',
+        method: id ? 'PUT' : 'POST',
+        data: data
+      });
+      return response.data;
+    },
+    onSuccess: () => {
+      message.success('保存成功');
+      queryClient.invalidateQueries({ queryKey: ['templates'] });
+      // navigate('/member/templates');
+    },
+    onError: () => {
+      message.error('保存失败');
+    }
+  });
+
+  console.log("template", template);
+
+  return (
+    <div className="p-3 h-full">
+      <Card 
+        title={id ? "编辑模板" : "新增模板"}
+        extra={
+          <Space>
+            <Button onClick={() => navigate('/member/templates')}>
+              返回列表
+            </Button>
+          </Space>
+        }
+        styles={{
+          body: {
+            height: 'calc(100vh - 130px)'
+          }
+        }}
+      >
+        {id && isLoading ? (
+          <div className="flex justify-center items-center py-20">
+            <Spin tip="加载模板数据中..." />
+          </div>
+        ) : (
+          <ExcelToJson 
+            initialValue={template}
+            onSave={saveTemplate}
+          />
+        )}
+      </Card>
+    </div>
+  );
+} 
+
+export default TemplateEdit