fix: unify analytics and report pagination controls

src/apps/admin/AdminAnalyticsPage.tsx

@@ -10,18 +10,7 @@ import {
   type UnreportedSignatureItem,
   type PagedResult,
 } from '@/api/adminApi';
-import {
-  Breadcrumb,
-  Button,
-  CarrierTag,
-  Input,
-  Pagination,
-  Select,
-  Tabs,
-  Table,
-  Tag,
-  type TableColumn,
-} from '@/components/ui';
+import { Breadcrumb, Button, CarrierTag, Input, Pagination, Tabs, Table, Tag, type TableColumn } from '@/components/ui';
 import './AdminAnalyticsPage.css';
 import { successRateClassName, successRateTone } from '@/utils/successRate';
 
@@ -242,6 +231,12 @@ function AnalyticsPanel({ kind }: { kind: string }) {
     void loadData(page, appliedKeyword, keyword, appliedDate);
   }
 
+  function changePageSize(size: number) {
+    setPageSize(size);
+    if (kind === 'quality' || kind === 'unreported')
+      void loadData(1, appliedKeyword, appliedUnreportedKeyword, appliedDate, size);
+  }
+
   return (
     <section className="page-stack" aria-label={analyticsTabs.find((tab) => tab.value === kind)?.label}>
       <div className="page-heading">
@@ -249,17 +244,6 @@ function AnalyticsPanel({ kind }: { kind: string }) {
           <p className="muted">日期、筛选和分页在当前页签内独立生效。</p>
         </div>
         <div className="page-actions">
-          <Select
-            label="每页数量"
-            value={String(pageSize)}
-            options={[10, 25, 50, 100].map((value) => ({ value: String(value), label: `${value} 条/页` }))}
-            onChange={(event) => {
-              const size = Number(event.target.value);
-              setPageSize(size);
-              if (kind === 'quality' || kind === 'unreported')
-                void loadData(1, appliedKeyword, appliedUnreportedKeyword, appliedDate, size);
-            }}
-          />
           <Input
             aria-label="统计日期"
             max={shanghaiDateKey()}
@@ -312,27 +296,31 @@ function AnalyticsPanel({ kind }: { kind: string }) {
             pagination={false}
             rowKey="signatureId"
           />
-          {(signatureQuality?.total ?? 0) > 0 ? (
-            <Pagination
-              nextDisabled={
-                (signatureQuality?.page ?? 1) >=
-                Math.ceil((signatureQuality?.total ?? 0) / (signatureQuality?.pageSize ?? 10))
-              }
-              onNext={() => changeSignaturePage((signatureQuality?.page ?? 1) + 1)}
-              onPageChange={changeSignaturePage}
-              onPrevious={() => changeSignaturePage((signatureQuality?.page ?? 1) - 1)}
-              page={signatureQuality?.page ?? 1}
-              previousDisabled={(signatureQuality?.page ?? 1) <= 1}
-              total={signatureQuality?.total ?? 0}
-              totalPages={Math.ceil((signatureQuality?.total ?? 0) / (signatureQuality?.pageSize ?? 10))}
-            />
-          ) : null}
+          <Pagination
+            pageSize={pageSize}
+            onPageSizeChange={changePageSize}
+            nextDisabled={
+              (signatureQuality?.page ?? 1) >=
+              Math.max(1, Math.ceil((signatureQuality?.total ?? 0) / (signatureQuality?.pageSize ?? pageSize)))
+            }
+            onNext={() => changeSignaturePage((signatureQuality?.page ?? 1) + 1)}
+            onPageChange={changeSignaturePage}
+            onPrevious={() => changeSignaturePage((signatureQuality?.page ?? 1) - 1)}
+            page={signatureQuality?.page ?? 1}
+            previousDisabled={(signatureQuality?.page ?? 1) <= 1}
+            total={signatureQuality?.total ?? 0}
+            totalPages={Math.max(
+              1,
+              Math.ceil((signatureQuality?.total ?? 0) / (signatureQuality?.pageSize ?? pageSize)),
+            )}
+          />
         </div>
       ) : null}
 
       {kind === 'enterprise' ? (
         <RetirementHeatmap
           pageSize={pageSize}
+          onPageSizeChange={changePageSize}
           date={appliedDate}
           dimensionType="enterprise"
           dimensions={retirementDimensions}
@@ -343,6 +331,7 @@ function AnalyticsPanel({ kind }: { kind: string }) {
       {kind === 'channel' ? (
         <RetirementHeatmap
           pageSize={pageSize}
+          onPageSizeChange={changePageSize}
           date={appliedDate}
           dimensionType="channel"
           dimensions={retirementDimensions}
@@ -353,6 +342,8 @@ function AnalyticsPanel({ kind }: { kind: string }) {
 
       {kind === 'unreported' ? (
         <UnreportedSignaturesCard
+          pageSize={pageSize}
+          onPageSizeChange={changePageSize}
           data={unreportedSignatures}
           keyword={unreportedKeyword}
           loading={loading}
@@ -375,6 +366,7 @@ function AnalyticsPanel({ kind }: { kind: string }) {
 
 function RetirementHeatmap({
   pageSize,
+  onPageSizeChange,
   date,
   dimensionType,
   dimensions,
@@ -382,6 +374,7 @@ function RetirementHeatmap({
   title,
 }: {
   pageSize: number;
+  onPageSizeChange: (pageSize: number) => void;
   date: string;
   dimensionType: 'enterprise' | 'channel';
   dimensions: SignatureRetirementHeatmapDimension[];
@@ -504,16 +497,6 @@ function RetirementHeatmap({
               </tbody>
             </table>
           </div>
-          <Pagination
-            nextDisabled={currentPage >= totalPages}
-            onNext={() => setPage(currentPage + 1)}
-            onPageChange={setPage}
-            onPrevious={() => setPage(currentPage - 1)}
-            page={currentPage}
-            previousDisabled={currentPage <= 1}
-            total={rows.length}
-            totalPages={totalPages}
-          />
         </>
       ) : (
         <p className="empty-state">
@@ -522,11 +505,25 @@ function RetirementHeatmap({
             : '暂无已确认到运营商的报备事实，尚未形成检测热力图。'}
         </p>
       )}
+      <Pagination
+        pageSize={pageSize}
+        onPageSizeChange={onPageSizeChange}
+        nextDisabled={currentPage >= totalPages}
+        onNext={() => setPage(currentPage + 1)}
+        onPageChange={setPage}
+        onPrevious={() => setPage(currentPage - 1)}
+        page={currentPage}
+        previousDisabled={currentPage <= 1}
+        total={rows.length}
+        totalPages={totalPages}
+      />
     </div>
   );
 }
 
 function UnreportedSignaturesCard({
+  pageSize,
+  onPageSizeChange,
   data,
   keyword,
   loading,
@@ -534,6 +531,8 @@ function UnreportedSignaturesCard({
   onPageChange,
   onSearch,
 }: {
+  pageSize: number;
+  onPageSizeChange: (pageSize: number) => void;
   data: (PagedResult<UnreportedSignatureItem> & { date: string }) | null;
   keyword: string;
   loading: boolean;
@@ -553,7 +552,7 @@ function UnreportedSignaturesCard({
       render: (record) => `${record.messageCount.toLocaleString('zh-CN')} 条`,
     },
   ];
-  const totalPages = Math.max(1, Math.ceil((data?.total ?? 0) / (data?.pageSize ?? 10)));
+  const totalPages = Math.max(1, Math.ceil((data?.total ?? 0) / (data?.pageSize ?? pageSize)));
   return (
     <div className="surface signature-quality-card">
       <div className="signature-quality-card__heading">
@@ -589,18 +588,18 @@ function UnreportedSignaturesCard({
         pagination={false}
         rowKey={(record) => `${record.signatureId}:${record.applicationId ?? ''}`}
       />
-      {(data?.total ?? 0) > 0 ? (
-        <Pagination
-          nextDisabled={(data?.page ?? 1) >= totalPages}
-          onNext={() => onPageChange((data?.page ?? 1) + 1)}
-          onPageChange={onPageChange}
-          onPrevious={() => onPageChange((data?.page ?? 1) - 1)}
-          page={data?.page ?? 1}
-          previousDisabled={(data?.page ?? 1) <= 1}
-          total={data?.total ?? 0}
-          totalPages={totalPages}
-        />
-      ) : null}
+      <Pagination
+        pageSize={pageSize}
+        onPageSizeChange={onPageSizeChange}
+        nextDisabled={(data?.page ?? 1) >= totalPages}
+        onNext={() => onPageChange((data?.page ?? 1) + 1)}
+        onPageChange={onPageChange}
+        onPrevious={() => onPageChange((data?.page ?? 1) - 1)}
+        page={data?.page ?? 1}
+        previousDisabled={(data?.page ?? 1) <= 1}
+        total={data?.total ?? 0}
+        totalPages={totalPages}
+      />
     </div>
   );
 }