清除冗余代码

src/app/(root)/cityNodeStats/page.tsx

@@ -1,7 +1,6 @@
 'use client'
 
 import { useEffect, useState } from 'react'
-import { Table, TableHeader, TableBody, TableHead, TableRow, TableCell } from '@/components/ui/table'
 import { getCityNodeCount, type CityNode } from '@/actions/stats'
 import { Page } from '@/components/page'
 import { DataTable } from '@/components/data-table'

src/app/(root)/edge/page.tsx

@@ -2,7 +2,6 @@
 
 import { useEffect, useState } from 'react'
 import { Pagination } from '@/components/ui/pagination'
-import { Table, TableHeader, TableBody, TableHead, TableRow, TableCell } from '@/components/ui/table'
 import { getEdgeNodes, type Edge } from '@/actions/stats'
 import { zodResolver } from '@hookform/resolvers/zod'
 import { useForm } from 'react-hook-form'

src/app/(root)/gatewayConfig/page.tsx

@@ -1,6 +1,5 @@
 'use client'
 import { useEffect, useState, Suspense, useCallback } from 'react'
-import { Table, TableHeader, TableBody, TableHead, TableRow, TableCell } from '@/components/ui/table'
 import { getGatewayInfo, getGatewayConfig, type GatewayConfig, type GatewayInfo } from '@/actions/stats'
 import { Pagination } from '@/components/ui/pagination'
 import { toast } from 'sonner'

src/app/(root)/settings/page.tsx

@@ -9,9 +9,9 @@ import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/com
 import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'
 import { UserIcon, LockIcon, SearchIcon, Trash2Icon, PlusIcon, XIcon } from 'lucide-react'
 import { toast, Toaster } from 'sonner'
-import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'
 import { findUsers, createUser, removeUser } from '@/actions/user'
 import { Page } from '@/components/page'
+import { DataTable } from '@/components/data-table'
 
 // 用户类型定义
 interface UserData {
@@ -62,7 +62,6 @@ export default function Settings() {
     }
   }
 
-  // 初始加载用户列表
   useEffect(() => {
     fetchUsers()
   }, [])
@@ -83,7 +82,7 @@ export default function Settings() {
         })
         form.reset()
         setIsCreateMode(false)
-        fetchUsers() // 刷新用户列表
+        fetchUsers()
       }
     }
     catch (error) {
@@ -108,7 +107,7 @@ export default function Settings() {
         toast.success('用户删除成功', {
           description: '用户账户已删除',
         })
-        fetchUsers() // 刷新用户列表
+        fetchUsers()
       }
     }
     catch (error) {
@@ -118,10 +117,13 @@ export default function Settings() {
     }
   }
 
-  // 过滤用户列表
-  const filteredUsers = users.filter(user =>
-    user.account.toLowerCase().includes(searchTerm.toLowerCase()),
-  )
+  const newData = users
+    .filter(user => user.account.toLowerCase().includes(searchTerm.toLowerCase()))
+    .map(user => ({
+      id: user.id,
+      account: user.account,
+      createdAt: new Date(user.createdAt).toLocaleDateString(),
+    }))
 
   return (
     <Page>
@@ -260,42 +262,34 @@ export default function Settings() {
         </div>
 
         <div className="border rounded-lg">
-          <Table>
-            <TableHeader>
-              <TableRow>
-                <TableHead>账号</TableHead>
-                <TableHead>创建时间</TableHead>
-                <TableHead className="text-right">操作</TableHead>
-              </TableRow>
-            </TableHeader>
-            <TableBody>
-              {filteredUsers.length === 0 ? (
-                <TableRow>
-                  <TableCell colSpan={3} className="text-center py-4">
-                    暂无用户数据
-                  </TableCell>
-                </TableRow>
-              ) : (
-                filteredUsers.map(user => (
-                  <TableRow key={user.id}>
-                    <TableCell className="font-medium">{user.account}</TableCell>
-                    <TableCell>{new Date(user.createdAt).toLocaleDateString()}</TableCell>
-                    <TableCell className="text-right">
-                      <div className="flex justify-end">
-                        <Button
-                          variant="outline"
-                          size="sm"
-                          className="h-5 border-0 hover:bg-transparent"
-                          onClick={() => handleDeleteUser(Number(user.id))}
-                        ><Trash2Icon className="h-4 w-4" />
-                        </Button>
-                      </div>
-                    </TableCell>
-                  </TableRow>
-                ))
-              )}
-            </TableBody>
-          </Table>
+          <DataTable
+            data={newData}
+            columns={[
+              {
+                label: '账号',
+                props: 'account',
+              },
+              {
+                label: '创建时间',
+                props: 'createdAt',
+              },
+              {
+                label: '操作',
+                render: (val) => {
+                  return (
+                    <Button
+                      variant="outline"
+                      size="sm"
+                      className="h-5 border-0 hover:bg-transparent"
+                      onClick={() => handleDeleteUser(Number(val.id))}
+                    >
+                      <Trash2Icon className="h-4 w-4" />
+                    </Button>
+                  )
+                },
+              },
+            ]}
+          />
         </div>
       </div>
       <Toaster richColors />