fix: align daily operations statistics

src/apps/admin/AdminHome.tsx

@@ -11,6 +11,7 @@ import {
   Button,
   Chart,
   Modal,
+  Pagination,
   Table,
   Tag,
   type TableColumn,
@@ -27,6 +28,12 @@ type EnterpriseSpendRank = {
   availableBalance: number;
 };
 
+type RankedSignatureQualityStat = SignatureQualityStat & {
+  rank: number;
+};
+
+const SIGNATURE_PAGE_SIZE = 10;
+
 const balanceTone = {
   充足: 'success',
   紧张: 'warning',
@@ -47,6 +54,8 @@ export function AdminHome() {
   const [quality, setQuality] = useState<SendQualityResponse | null>(null);
   const [error, setError] = useState('');
   const [selectedEnterprise, setSelectedEnterprise] = useState<EnterpriseSpendRank | null>(null);
+  const [plainSignaturePage, setPlainSignaturePage] = useState(1);
+  const [drainageSignaturePage, setDrainageSignaturePage] = useState(1);
 
   useEffect(() => {
     Promise.all([adminApi.getDashboard(), adminApi.getSendQuality()])
@@ -131,8 +140,8 @@ export function AdminHome() {
     },
   ];
 
-  const signatureColumns: Array<TableColumn<SignatureQualityStat>> = [
-    { key: 'rank', title: '排名', width: '72px', render: (_record, index) => index + 1 },
+  const signatureColumns: Array<TableColumn<RankedSignatureQualityStat>> = [
+    { key: 'rank', title: '排名', width: '72px', render: (record) => record.rank },
     { key: 'signatureName', title: '签名', render: (record) => <div><strong>{record.signatureName}</strong><p className="text-caption">{record.tenantName}</p></div> },
     { key: 'total', title: '发送总数', align: 'right', render: (record) => formatCount(record.total) },
     { key: 'successCount', title: '成功', align: 'right', render: (record) => formatCount(record.successCount) },
@@ -143,6 +152,22 @@ export function AdminHome() {
   ];
   const plainSignatureQuality = quality?.signatures.filter((item) => !item.hasDrainage) ?? [];
   const drainageSignatureQuality = quality?.signatures.filter((item) => item.hasDrainage) ?? [];
+  const plainSignatureTotalPages = Math.max(1, Math.ceil(plainSignatureQuality.length / SIGNATURE_PAGE_SIZE));
+  const drainageSignatureTotalPages = Math.max(1, Math.ceil(drainageSignatureQuality.length / SIGNATURE_PAGE_SIZE));
+  const pagedPlainSignatureQuality = plainSignatureQuality
+    .slice((plainSignaturePage - 1) * SIGNATURE_PAGE_SIZE, plainSignaturePage * SIGNATURE_PAGE_SIZE)
+    .map((item, index) => ({ ...item, rank: (plainSignaturePage - 1) * SIGNATURE_PAGE_SIZE + index + 1 }));
+  const pagedDrainageSignatureQuality = drainageSignatureQuality
+    .slice((drainageSignaturePage - 1) * SIGNATURE_PAGE_SIZE, drainageSignaturePage * SIGNATURE_PAGE_SIZE)
+    .map((item, index) => ({ ...item, rank: (drainageSignaturePage - 1) * SIGNATURE_PAGE_SIZE + index + 1 }));
+
+  useEffect(() => {
+    setPlainSignaturePage((page) => Math.min(page, plainSignatureTotalPages));
+  }, [plainSignatureTotalPages]);
+
+  useEffect(() => {
+    setDrainageSignaturePage((page) => Math.min(page, drainageSignatureTotalPages));
+  }, [drainageSignatureTotalPages]);
 
   return (
     <section className="page-stack admin-dashboard">
@@ -207,7 +232,17 @@ export function AdminHome() {
             </div>
             <Tag tone="info">{plainSignatureQuality.length} 个签名</Tag>
           </div>
-          <Table columns={signatureColumns} data={plainSignatureQuality} emptyText="今日暂无不含引流的签名发送记录" rowKey="id" />
+          <Table columns={signatureColumns} data={pagedPlainSignatureQuality} emptyText="今日暂无不含引流的签名发送记录" rowKey="id" />
+          <Pagination
+            total={plainSignatureQuality.length}
+            page={plainSignaturePage}
+            totalPages={plainSignatureTotalPages}
+            previousDisabled={plainSignaturePage <= 1}
+            nextDisabled={plainSignaturePage >= plainSignatureTotalPages}
+            onPrevious={() => setPlainSignaturePage((page) => Math.max(1, page - 1))}
+            onNext={() => setPlainSignaturePage((page) => Math.min(plainSignatureTotalPages, page + 1))}
+            onPageChange={setPlainSignaturePage}
+          />
         </div>
         <div className="surface section-stack">
           <div className="section-heading">
@@ -217,7 +252,17 @@ export function AdminHome() {
             </div>
             <Tag tone="accent">{drainageSignatureQuality.length} 个签名</Tag>
           </div>
-          <Table columns={signatureColumns} data={drainageSignatureQuality} emptyText="今日暂无含引流的签名发送记录" rowKey="id" />
+          <Table columns={signatureColumns} data={pagedDrainageSignatureQuality} emptyText="今日暂无含引流的签名发送记录" rowKey="id" />
+          <Pagination
+            total={drainageSignatureQuality.length}
+            page={drainageSignaturePage}
+            totalPages={drainageSignatureTotalPages}
+            previousDisabled={drainageSignaturePage <= 1}
+            nextDisabled={drainageSignaturePage >= drainageSignatureTotalPages}
+            onPrevious={() => setDrainageSignaturePage((page) => Math.max(1, page - 1))}
+            onNext={() => setDrainageSignaturePage((page) => Math.min(drainageSignatureTotalPages, page + 1))}
+            onPageChange={setDrainageSignaturePage}
+          />
         </div>
       </div>