Просмотр исходного кода

♻️ refactor(contacts): optimize data handling and pagination logic

- replace onSuccess callback with useEffect hook for client data assignment
- add useEffect hook to update pagination total when data changes
- remove direct total prop from pagination component

🐛 fix(contacts): correct id type conversion in api calls

- convert id string to integer when calling update contact api
- convert id string to integer when calling delete contact api
yourname 8 месяцев назад
Родитель
Сommit
e96aa5ee18
1 измененных файлов с 21 добавлено и 11 удалено
  1. 21 11
      src/client/admin/pages/Contacts.tsx

+ 21 - 11
src/client/admin/pages/Contacts.tsx

@@ -28,11 +28,15 @@ const Contacts: React.FC = () => {
       const response = await clientClient.$get({ query: { page: 1, pageSize: 1000 } });
       if (response.status !== 200) throw new Error('Failed to fetch clients');
       return response.json() as Promise<InferResponseType<typeof clientClient.$get, 200>>;
-    },
-    onSuccess: (result) => {
-      setClients(result.data);
-    },
+    }
   });
+
+  // 直接使用data设置客户列表
+  React.useEffect(() => {
+    if (clientsData) {
+      setClients(clientsData.data);
+    }
+  }, [clientsData]);
   
   // 获取联系人列表数据
   const fetchContacts = async ({ page, pageSize }: { page: number; pageSize: number }): Promise<LinkmanListResponse> => {
@@ -55,7 +59,16 @@ const Contacts: React.FC = () => {
 
   // 直接使用data处理数据
   const dataSource = data?.data || [];
-  const total = data?.pagination.total || 0;
+  
+  // 监听data变化更新分页总数
+  React.useEffect(() => {
+    if (data) {
+      setPagination(prev => ({
+        ...prev,
+        total: data.pagination.total
+      }));
+    }
+  }, [data]);
   
   // 搜索
   const handleSearch = () => {
@@ -123,7 +136,7 @@ const Contacts: React.FC = () => {
   // 更新联系人记录
   const updateContact = useMutation({
     mutationFn: async ({ id, data }: { id: string; data: any }) => {
-      const response = await linkmanClient[':id'].$put({ param: { id }, json: data });
+      const response = await linkmanClient[':id'].$put({ param: { id: parseInt(id, 10) }, json: data });
       if (!response.ok) throw new Error('Failed to update contact');
       return response.json();
     },
@@ -140,7 +153,7 @@ const Contacts: React.FC = () => {
   // 删除联系人记录
   const deleteContact = useMutation({
     mutationFn: async (id: string) => {
-      const response = await linkmanClient[':id'].$delete({ param: { id } });
+      const response = await linkmanClient[':id'].$delete({ param: { id: parseInt(id, 10) } });
       if (!response.ok) throw new Error('Failed to delete contact');
       return response.json();
     },
@@ -267,10 +280,7 @@ const Contacts: React.FC = () => {
         dataSource={dataSource}
         rowKey="id"
         loading={loading}
-        pagination={{
-          ...pagination,
-          total
-        }}
+        pagination={pagination}
         onChange={handleTableChange}
         bordered
       />