♻️ refactor(areas): 优化省市区管理页面代码

- 移除未使用的Filter和MapPin图标导入
- 移除未使用的refetch属性
- 将cacheTime替换为gcTime以符合最新React Query API
- 简化id参数传递方式，不再手动转换为字符串
- 修正删除接口状态码检查，从200改为204
- 优化状态切换接口调用方式
- 改进数据为空时的判断逻辑
- 优化表格数据渲染，移除多余的可选链
- 调整分页组件属性名以匹配最新API
- 统一处理创建和更新表单数据的类型

🐛 fix(areas): 修复省市区管理页面若干问题

- 修复状态切换失败时的错误提示信息
- 修复创建和更新省市区数据处理的类型问题
- 修复分页逻辑中页码和每页条数的更新处理

src/client/admin/pages/Areas.tsx

@@ -4,7 +4,7 @@ import { Button } from '@/client/components/ui/button';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/client/components/ui/card';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/client/components/ui/table';
 import { DataTablePagination } from '../components/DataTablePagination';
-import { Plus, Edit, Trash2, Search, Filter, Power, MapPin } from 'lucide-react';
+import { Plus, Edit, Trash2, Search, Power } from 'lucide-react';
 import { useState, useCallback } from 'react';
 import { areaClient } from '@/client/api';
 import type { InferResponseType, InferRequestType } from 'hono/client';
@@ -68,7 +68,7 @@ export const AreasPage: React.FC = () => {
   };
 
   // 查询省市区列表
-  const { data, isLoading, refetch } = useQuery({
+  const { data, isLoading } = useQuery({
     queryKey: ['areas', searchParams],
     queryFn: async () => {
       const res = await areaClient.$get({
@@ -78,7 +78,7 @@ export const AreasPage: React.FC = () => {
       return await res.json();
     },
     staleTime: 5 * 60 * 1000,
-    cacheTime: 10 * 60 * 1000,
+    gcTime: 10 * 60 * 1000,
   });
 
   // 创建省市区
@@ -100,7 +100,7 @@ export const AreasPage: React.FC = () => {
     mutationFn: async ({ id, data }: { id: number; data: UpdateAreaRequest }) => {
       await handleOperation(async () => {
         const res = await areaClient[':id'].$put({
-          param: { id: id.toString() },
+          param: { id },
           json: data
         });
         if (res.status !== 200) throw new Error('更新省市区失败');
@@ -118,9 +118,9 @@ export const AreasPage: React.FC = () => {
     mutationFn: async (id: number) => {
       await handleOperation(async () => {
         const res = await areaClient[':id'].$delete({
-          param: { id: id.toString() }
+          param: { id }
         });
-        if (res.status !== 200) throw new Error('删除省市区失败');
+        if (res.status !== 204) throw new Error('删除省市区失败');
       });
     },
     onSuccess: () => {
@@ -134,11 +134,11 @@ export const AreasPage: React.FC = () => {
   const toggleStatusMutation = useMutation({
     mutationFn: async ({ id, isDisabled }: { id: number; isDisabled: number }) => {
       await handleOperation(async () => {
-        const res = await areaClient[':id']['toggle-status'].$put({
-          param: { id: id.toString() },
+        const res = await areaClient[':id'].$put({
+          param: { id },
           json: { isDisabled }
         });
-        if (res.status !== 200) throw new Error('状态切换失败');
+        if (res.status !== 200) throw new Error('更新省市区状态失败');
       });
     },
     onSuccess: () => {
@@ -179,8 +179,8 @@ export const AreasPage: React.FC = () => {
   };
 
   // 处理创建省市区
-  const handleCreateArea = async (data: CreateAreaInput) => {
-    await createMutation.mutateAsync(data);
+  const handleCreateArea = async (data: CreateAreaInput | UpdateAreaInput) => {
+    await createMutation.mutateAsync(data as CreateAreaInput);
   };
 
   // 处理更新省市区
@@ -313,14 +313,14 @@ export const AreasPage: React.FC = () => {
                       加载中...
                     </TableCell>
                   </TableRow>
-                ) : data?.data?.length === 0 ? (
+                ) : !data?.data || data.data.length === 0 ? (
                   <TableRow>
                     <TableCell colSpan={8} className="text-center py-8">
                       暂无数据
                     </TableCell>
                   </TableRow>
                 ) : (
-                  data?.data?.map((area) => (
+                  data.data.map((area) => (
                     <TableRow key={area.id}>
                       <TableCell className="font-medium">{area.id}</TableCell>
                       <TableCell>{area.name}</TableCell>
@@ -375,11 +375,13 @@ export const AreasPage: React.FC = () => {
           {data && (
             <div className="mt-4">
               <DataTablePagination
-                page={page}
+                currentPage={page}
                 pageSize={pageSize}
-                total={data.total}
-                onPageChange={setPage}
-                onPageSizeChange={setPageSize}
+                totalCount={data.pagination.total}
+                onPageChange={(newPage, newPageSize) => {
+                  setPage(newPage);
+                  setPageSize(newPageSize);
+                }}
               />
             </div>
           )}