DG9 统一全站 UI 布局样板迁移

关联 Issue: DG9-0..DG9-12

client/src/pages/ReimbursementsPage.tsx

@@ -25,11 +25,10 @@ import { hasPermission } from "../auth/permissions";
 import { toast } from "sonner";
 import { downloadBlob } from "../lib/download";
 import { resolveReimbursementDisplayCode } from "../lib/reimbursementDisplay";
-import { PageHeader } from "../components/common/PageHeader";
 import { Pagination } from "../components/common/Pagination";
 import { StatusBadge } from "../components/common/StatusBadge";
 import { TableSkeleton } from "../components/common/TableSkeleton";
-import { FilterBar, ListWorkspace, PrimaryTable } from "../components/patterns/ListWorkspace";
+import { FilterBar, ListWorkspace, PrimaryTable, StatStrip, WorkspaceHeader } from "../components/patterns/ListWorkspace";
 import { MetricCard } from "../components/patterns/MetricCard";
 import { Button } from "../components/ui/button";
 import {
@@ -362,7 +361,7 @@ export function ReimbursementsPage() {
 
   return (
     <ListWorkspace>
-      <PageHeader
+      <WorkspaceHeader
         title="我的报销"
         subtitle="草稿、审批、支付。"
         actions={
@@ -513,12 +512,12 @@ export function ReimbursementsPage() {
         </p>
       ) : null}
 
-      <section className="grid gap-4 md:grid-cols-2 xl:grid-cols-4">
+      <StatStrip columns={4}>
         <MetricCard title="当前列表" value={stats.currentPageCount} note={`共 ${listQuery.data?.total ?? 0} 条`} />
         <MetricCard title="当前金额" value={formatCurrency(stats.currentPageAmount)} note="当前页" />
         <MetricCard title="审批中" value={stats.reviewing} note="待推进" tone={stats.reviewing > 0 ? "warning" : "neutral"} />
         <MetricCard title="已支付" value={stats.paid} note={scope === "all" ? "全范围" : "仅自己"} />
-      </section>
+      </StatStrip>
 
       <FilterBar className="space-y-4">
         <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">