重构 Wave3 详情与移动体验（05-28-frontend-ux-wave3-business-mobile）

client/src/components/navigation/Sidebar.tsx

@@ -11,7 +11,7 @@ export function Sidebar() {
             <span className="size-2 rounded-full bg-primary" />
             今日优先
           </div>
-          <div className="mt-1.5 leading-6">先处理待办，再进入报销、项目和财务流程。</div>
+          <div className="mt-1.5 leading-6">待办、报销、项目和财务流程按优先级进入。</div>
         </div>
       </div>
 

client/src/pages/ContractsRegistryPage.tsx

@@ -25,6 +25,8 @@ import { PageHeader } from "../components/common/PageHeader";
 import { StatusBadge } from "../components/common/StatusBadge";
 import { DateTextInput } from "../components/common/DateTextInput";
 import { WorkspaceNotice } from "../components/patterns/ListWorkspace";
+import { MetricCard } from "../components/patterns/MetricCard";
+import { PageScaffold } from "../components/patterns/PageScaffold";
 import { Button } from "../components/ui/button";
 import { Input } from "../components/ui/input";
 import { Label } from "../components/ui/label";
@@ -244,6 +246,10 @@ export function ContractsRegistryPage() {
       ? "保留现有责任人"
       : "默认当前用户";
   const amountInvalid = Boolean(editor.amount.trim()) && !AMOUNT_PATTERN.test(editor.amount.trim());
+  const activeContractCount = visibleContracts.filter((item) => item.status === "active").length;
+  const draftContractCount = visibleContracts.filter((item) => item.status === "draft").length;
+  const archivedContractCount = visibleContracts.filter((item) => item.status === "archived").length;
+  const expiringContractCount = expiringQuery.data?.total ?? expiringItems.length;
 
   const refreshAll = async () => {
     await Promise.all([
@@ -305,10 +311,18 @@ export function ContractsRegistryPage() {
   });
 
   return (
-    <div className="space-y-6">
+    <PageScaffold>
       <PageHeader
+        eyebrow="合同"
         title="合同台账"
         subtitle="维护合同元数据、生命周期、到期预警与导出，不在 OA 存放涉密正文附件。"
+        meta={
+          <>
+            <span className="info-chip">可见 {visibleContracts.length} 份</span>
+            <span className="info-chip">30 天到期 {expiringContractCount} 份</span>
+            <span className="info-chip">私密正文不入库</span>
+          </>
+        }
         actions={
           <div className="flex flex-wrap gap-2">
             <Button
@@ -334,12 +348,21 @@ export function ContractsRegistryPage() {
         }
       />
 
-      <div className="card-std space-y-4 p-6">
+      <section className="ops-status-strip grid gap-4 md:grid-cols-2 xl:grid-cols-4" data-testid="contracts-registry-summary">
+        <MetricCard title="可见合同" value={visibleContracts.length} note={filters.projectId ? "已按项目过滤" : "当前筛选结果"} />
+        <MetricCard title="生效中" value={activeContractCount} note="需要关注到期和责任人" />
+        <MetricCard title="草稿" value={draftContractCount} note="补齐摘要、金额和归档位置" tone={draftContractCount > 0 ? "warning" : "neutral"} />
+        <MetricCard title="已归档" value={archivedContractCount} note="只保留台账和线下档案索引" />
+      </section>
+
+      <div className="detail-command-panel space-y-4" data-testid="contracts-registry-command">
         <div className="flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between">
           <div>
-            <div className="text-sm text-zinc-500">到期预警</div>
+            <div className="text-sm text-zinc-500">生命周期焦点</div>
             <div className="mt-1 text-3xl font-semibold text-zinc-900">{expiringQuery.data?.total ?? 0}</div>
-            <div className="text-sm text-zinc-600">份合同将在 {EXPIRING_DAYS} 天内到期</div>
+            <div className="text-sm text-zinc-600">
+              份合同将在 {EXPIRING_DAYS} 天内到期；续约会生成草稿合同，导出仅用于授权复核。
+            </div>
           </div>
           <div className="flex flex-wrap gap-2">
             <Button
@@ -759,7 +782,7 @@ export function ContractsRegistryPage() {
 
           <div className="space-y-3">
             {visibleContracts.map((item) => (
-              <div key={item.id} className="rounded-lg border border-zinc-200 p-4">
+              <div key={item.id} className="detail-evidence-card bg-white" data-testid="contracts-registry-row">
                 <div className="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
                   <div className="space-y-2">
                     <div className="flex flex-wrap items-center gap-3">
@@ -832,7 +855,7 @@ export function ContractsRegistryPage() {
           </div>
         </div>
       </div>
-    </div>
+    </PageScaffold>
   );
 }
 

client/src/pages/MobileApprovalsPage.tsx

@@ -996,6 +996,18 @@ export function MobileApprovalsPage() {
     filteredTaskCards.length > 0 && filteredTaskCards.every((task) => selectedBatchTaskIds.includes(task.id));
   const shouldShowDraftQueue = !isOnline || currentQueueItems.length > 0;
   const showMobileApprovalActions = Boolean(isPushDetail && selectedTask && selectedTaskAllowsActions);
+  const approvalFocusText = taskTab === "pending"
+    ? filteredTaskCards.length
+      ? `当前有 ${filteredTaskCards.length} 条待处理，可优先查看金额、时效或退回风险最高的事项。`
+      : "暂无待处理审批，收到企业微信或站内通知后可从这里直达详情。"
+    : "最近 30 天已处理审批用于复核，不支持再次审批。";
+  const selectedActionText = selectedTask
+    ? selectedTaskAllowsActions
+      ? canUseRemote
+        ? "核对摘要和历史后，可在底部直接通过、驳回或退回。"
+        : "当前离线，仅支持保存通过或驳回草稿，联网后再同步。"
+      : "当前任务已处理，本页只展示业务摘要和处理历史。"
+    : "";
 
   return (
     <>
@@ -1094,6 +1106,34 @@ export function MobileApprovalsPage() {
         </section>
       ) : null}
 
+      {!isPushDetail && canAccessRemoteApprovals ? (
+      <section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-approvals-focus">
+        <div className="mobile-section-header">
+          <div className="min-w-0">
+            <h3 className="mobile-section-title">当前办理焦点</h3>
+            <p className="mobile-list-card__subtitle mt-1">{approvalFocusText}</p>
+          </div>
+          <span className={`mobile-section-meta ${isOnline ? "text-emerald-600" : "text-orange-600"}`}>
+            {isOnline ? "在线" : "离线"}
+          </span>
+        </div>
+        <div className="mobile-info-grid text-sm">
+          <div>
+            <div className="text-xs text-zinc-500">当前筛选</div>
+            <div className="mt-1 text-xl font-semibold text-zinc-900">{filteredTaskCards.length}</div>
+          </div>
+          <div>
+            <div className="text-xs text-zinc-500">离线草稿</div>
+            <div className="mt-1 text-xl font-semibold text-zinc-900">{currentQueueItems.length}</div>
+          </div>
+          <div>
+            <div className="text-xs text-zinc-500">批量模式</div>
+            <div className="mt-1 text-sm font-semibold text-zinc-900">{batchMode ? `已选 ${selectedBatchTaskIds.length}` : "未开启"}</div>
+          </div>
+        </div>
+      </section>
+      ) : null}
+
       {!isPushDetail && canAccessRemoteApprovals ? (
       <section className="mobile-card mobile-page-stack" data-testid="mobile-approvals-list">
         <div className="mobile-section-header">
@@ -1341,6 +1381,11 @@ export function MobileApprovalsPage() {
 
         {selectedTask ? (
           <>
+            <div className="mobile-subcard bg-white text-sm" data-testid="mobile-approvals-detail-focus">
+              <div className="text-xs font-semibold text-zinc-500">下一步</div>
+              <div className="mt-1 leading-6 text-zinc-700">{selectedActionText}</div>
+            </div>
+
             <div className="mobile-list-card text-sm">
               <div className="mobile-list-card__header mobile-list-card__header--approval">
                 <div className="min-w-0">

client/src/pages/MobileNotificationsPage.tsx

@@ -116,12 +116,14 @@ export function MobileNotificationsPage() {
 
   const notificationItems = listQuery.data?.items ?? [];
   const totalPages = Math.max(1, Math.ceil((listQuery.data?.total ?? 0) / PAGE_SIZE));
+  const targetableNotificationCount = notificationItems.filter((item) => resolveMobileNotificationTargetLink(item)).length;
 
   return (
     <PageScaffold className="pb-4">
       <div className="mobile-page-stack" data-testid="mobile-notifications-page">
         <PageHeader
           title="通知"
+          subtitle="事件收件箱：未读优先，点击后回到对应业务页。"
           meta={<span className="badge-neutral">未读 {listQuery.data?.unreadCount ?? 0}</span>}
           actions={
             <Button
@@ -136,6 +138,32 @@ export function MobileNotificationsPage() {
           }
         />
 
+      <section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-notifications-focus">
+        <div className="mobile-section-header">
+          <div className="min-w-0">
+            <h3 className="mobile-section-title">当前消息焦点</h3>
+            <p className="mobile-list-card__subtitle mt-1">
+              {unreadOnly ? "只看未读，处理后会自动回到业务详情。" : "全部事件按时间排列，业务操作仍在详情页完成。"}
+            </p>
+          </div>
+          <span className="mobile-section-meta">{selectedType ? "已筛选" : "全部类型"}</span>
+        </div>
+        <div className="mobile-info-grid text-sm">
+          <div>
+            <div className="text-xs text-zinc-500">未读</div>
+            <div className="mt-1 text-xl font-semibold text-zinc-900">{listQuery.data?.unreadCount ?? 0}</div>
+          </div>
+          <div>
+            <div className="text-xs text-zinc-500">当前页</div>
+            <div className="mt-1 text-xl font-semibold text-zinc-900">{notificationItems.length}</div>
+          </div>
+          <div>
+            <div className="text-xs text-zinc-500">可直达</div>
+            <div className="mt-1 text-xl font-semibold text-zinc-900">{targetableNotificationCount}</div>
+          </div>
+        </div>
+      </section>
+
       <section className="mobile-card mobile-page-stack" data-testid="mobile-notifications-list">
         <div className="mobile-section-header">
           <div>

client/src/pages/MobilePurchaseRequestDetailPage.tsx

@@ -54,6 +54,11 @@ export function MobilePurchaseRequestDetailPage() {
 
   const detail = detailQuery.data ?? null;
   const displayCode = detail ? resolvePurchaseDisplayCode(detail) : "采购详情";
+  const nextStepText = detail
+    ? detail.pendingWorkflow?.task?.stepName
+      ? `当前在 ${detail.pendingWorkflow.task.stepName}，可从审批详情处理；本页用于核对采购依据。`
+      : resolvePurchaseStatusHint(detail)
+    : "";
 
   return (
     <PageScaffold className="space-y-3 pb-4">
@@ -77,7 +82,7 @@ export function MobilePurchaseRequestDetailPage() {
 
       {detail ? (
         <>
-          <section className="mobile-card" data-testid="mobile-purchase-detail-summary">
+          <section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-purchase-detail-summary">
             <div className="flex items-start justify-between gap-3">
               <div className="min-w-0">
                 <h2 className="truncate text-base font-semibold text-zinc-900">{displayCode}</h2>
@@ -96,9 +101,14 @@ export function MobilePurchaseRequestDetailPage() {
                 <div className="text-xs text-zinc-500">申请人</div>
                 <div className="mt-1 truncate font-medium text-zinc-900">{detail.applicant?.name ?? "-"}</div>
               </div>
+              <div>
+                <div className="text-xs text-zinc-500">当前节点</div>
+                <div className="mt-1 truncate font-medium text-zinc-900">{detail.pendingWorkflow?.task?.stepName ?? "-"}</div>
+              </div>
             </div>
-            <div className="mt-3 rounded-lg bg-zinc-50 px-3 py-2 text-xs leading-5 text-zinc-600">
-              {resolvePurchaseStatusHint(detail)}
+            <div className="mobile-subcard bg-white text-sm">
+              <div className="text-xs font-semibold text-zinc-500">下一步</div>
+              <div className="mt-1 leading-6 text-zinc-700">{nextStepText}</div>
             </div>
           </section>
 

client/src/pages/MobileReimbursementDetailPage.tsx

@@ -169,6 +169,34 @@ function itemLabel(item: ReimbursementItem) {
   return desc ? `${typeName} · ${desc}` : typeName;
 }
 
+function resolveMobileReimbursementNextStep(input: {
+  status: ReimbursementStatus;
+  canEdit: boolean;
+  itemCount: number;
+  invoiceCount: number;
+  attachmentCount: number;
+}) {
+  if (input.canEdit && input.itemCount === 0) {
+    return "先添加报销明细，再绑定发票或补充附件。";
+  }
+  if (input.canEdit && input.invoiceCount === 0) {
+    return "建议先添加或上传发票，提交前会做完整性检查。";
+  }
+  if (input.status === "draft" || input.status === "rejected") {
+    return "核对金额、发票和附件后，使用底部按钮提交审批。";
+  }
+  if (input.status === "reviewing") {
+    return "正在审批中，可查看节点和历史；需要补材料时按审批意见处理。";
+  }
+  if (input.status === "approved") {
+    return "已通过审批，等待财务付款和归档。";
+  }
+  if (input.status === "paid") {
+    return "已完成付款，本页用于查看发票、附件和审批留痕。";
+  }
+  return input.attachmentCount > 0 ? "查看附件、发票和审批记录。" : "查看当前报销状态和审批记录。";
+}
+
 export function MobileReimbursementDetailPage() {
   const { reimbursementId = "" } = useParams();
   const navigate = useNavigate();
@@ -813,6 +841,13 @@ export function MobileReimbursementDetailPage() {
   const showSubmitAction = Boolean(canEdit && canSubmitExpense);
   const showStickyActions = Boolean(showSubmitAction || canOpenInvoiceDialog);
   const showSecondaryActions = Boolean(actionError || canDeleteDraft || !canEdit);
+  const detailNextStep = resolveMobileReimbursementNextStep({
+    status: detail.status,
+    canEdit,
+    itemCount: detail.items.length,
+    invoiceCount: detail.invoices.length,
+    attachmentCount: detail.attachments?.length ?? 0,
+  });
 
   return (
     <PageScaffold
@@ -838,9 +873,20 @@ export function MobileReimbursementDetailPage() {
         testId="mobile-reimbursement-detail-header"
       />
 
-      <section className="mobile-card">
-        <div className="text-xs text-zinc-500">合计金额</div>
-        <div className="mt-1 text-3xl font-semibold text-zinc-900">{formatCurrency(detail.totalAmount)}</div>
+      <section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-reimbursement-detail-focus">
+        <div className="mobile-section-header mobile-section-header--top">
+          <div className="min-w-0">
+            <h2 className="mobile-section-title">当前办理摘要</h2>
+            <p className="mobile-list-card__subtitle mt-1">{detailNextStep}</p>
+          </div>
+          <span className={cn("rounded-full px-2.5 py-1 text-xs font-medium", STATUS_TONE[detail.status])}>
+            {STATUS_LABEL[detail.status]}
+          </span>
+        </div>
+        <div>
+          <div className="text-xs text-zinc-500">合计金额</div>
+          <div className="mt-1 text-3xl font-semibold text-zinc-900">{formatCurrency(detail.totalAmount)}</div>
+        </div>
         <div className="mobile-metric-grid mt-4 text-sm">
           <div className="rounded-lg bg-zinc-50 px-3 py-2">
             <div className="text-xs text-zinc-500">明细</div>

client/src/pages/MobileReimbursementsPage.tsx

@@ -54,6 +54,15 @@ function formatDate(value: string | null | undefined) {
   return value || "未填写日期";
 }
 
+function reimbursementListNextStep(status: ReimbursementStatus) {
+  if (status === "draft") return "补齐明细、发票和附件后提交审批。";
+  if (status === "reviewing") return "查看审批节点，必要时补充材料或催办。";
+  if (status === "approved") return "等待财务付款，核对金额和附件是否完整。";
+  if (status === "paid") return "已付款单据用于查询和归档，不再编辑。";
+  if (status === "rejected") return "按审批意见修改后重新提交。";
+  return "查看当前报销状态和可执行操作。";
+}
+
 function ReimbursementCard({
   item,
   canDeleteDraft,
@@ -208,6 +217,7 @@ export function MobileReimbursementsPage() {
     <PageScaffold className="space-y-4">
       <PageHeader
         title="移动报销"
+        subtitle="手机端只处理新建、补材料、查状态和草稿删除。"
         meta={<span className="badge-neutral">{STATUS_LABEL[status]}</span>}
         actions={
           canCreateExpense ? (
@@ -223,7 +233,14 @@ export function MobileReimbursementsPage() {
         }
       />
 
-      <section className="mobile-card mobile-focus-card">
+      <section className="mobile-card mobile-focus-card mobile-page-stack" data-testid="mobile-reimbursements-focus">
+        <div className="mobile-section-header">
+          <div className="min-w-0">
+            <h3 className="mobile-section-title">当前办理焦点</h3>
+            <p className="mobile-list-card__subtitle mt-1">{reimbursementListNextStep(status)}</p>
+          </div>
+          <span className="mobile-section-meta">{STATUS_LABEL[status]}</span>
+        </div>
         <div className="mobile-info-grid">
           <div>
             <div className="text-xs text-zinc-500">当前列表</div>
@@ -233,6 +250,10 @@ export function MobileReimbursementsPage() {
             <div className="text-xs text-zinc-500">当前金额</div>
             <div className="mt-1 text-2xl font-semibold text-zinc-900">{formatCurrency(String(totalAmount))}</div>
           </div>
+          <div>
+            <div className="text-xs text-zinc-500">下一步</div>
+            <div className="mt-1 text-sm font-semibold leading-5 text-zinc-900">{status === "draft" ? "补材料" : status === "reviewing" ? "看进度" : "查归档"}</div>
+          </div>
         </div>
       </section>
 

client/src/pages/PortalHomePage.tsx

@@ -719,7 +719,7 @@ function TodoAggregatePanel({ items }: { items: TodoAggregateItem[] }) {
 
   return (
     <SectionPanel
-      title="今天先处理"
+      title="今日待办焦点"
       description="审批、TODO 和异常提醒集中在这里。"
       className="portal-panel-fill"
     >
@@ -1127,7 +1127,7 @@ export function PortalHomePage() {
             : roleCapabilities.canManageSystem
             ? "先看待处理，再进入配置、审计和通知。"
             : isManagerView
-              ? "先处理审批，再看团队状态和周报缺口。"
+              ? "审批待办、团队状态和周报缺口集中查看。"
               : "先看待办，再提交申请、补材料或查看状态。"}
         actions={
           !payload.workspace.persisted && canSetupWorkspace ? (

client/src/pages/ProjectDetailPage.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from "react";
 import { Link, useParams } from "react-router-dom";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { fetchEmployees } from "../api/employees";
-import { archiveProject, createConfidentialDocumentRef, createProjectCommunicationLog, createProjectDelivery, createProjectMember, createProjectMilestone, createProjectRisk, createProjectTask, fetchProject, fetchProjectClosureChecklist, fetchProjectCommunicationLogs, fetchProjectDeliveries, fetchProjectDocumentRefs, fetchProjectExpensesSummary, fetchProjectMembers, fetchProjectMilestones, fetchProjectPurchaseSummary, fetchProjectRisks, fetchProjectTasks, fetchProjectTravelSummary, fetchProjectWeeklyReports, patchProject, patchProjectClosureChecklistItem, patchProjectCommunicationLog, patchProjectMember, patchProjectMilestone, patchProjectRisk, patchProjectTask, type ConfidentialityLevel, type DocumentStorageType, type ProjectCommunicationChannel, type ProjectClosureChecklistStatus, type ProjectDeliveryRecordType, type ProjectMilestoneStatus, type ProjectRiskLevel, type ProjectStatus, type ProjectTaskPriority, type ProjectTaskStatus } from "../api/projects";
+import { archiveProject, createConfidentialDocumentRef, createProjectCommunicationLog, createProjectDelivery, createProjectMember, createProjectMilestone, createProjectRisk, createProjectTask, fetchProject, fetchProjectClosureChecklist, fetchProjectCommunicationLogs, fetchProjectDeliveries, fetchProjectDocumentRefs, fetchProjectExpensesSummary, fetchProjectMembers, fetchProjectMilestones, fetchProjectPurchaseSummary, fetchProjectRisks, fetchProjectTasks, fetchProjectTravelSummary, fetchProjectWeeklyReports, patchProject, patchProjectClosureChecklistItem, patchProjectCommunicationLog, patchProjectMember, patchProjectMilestone, patchProjectRisk, patchProjectTask, type ConfidentialityLevel, type DocumentStorageType, type ProjectCommunicationChannel, type ProjectClosureChecklistStatus, type ProjectDeliveryRecordType, type ProjectDetail, type ProjectMilestoneStatus, type ProjectRiskLevel, type ProjectStatus, type ProjectTaskPriority, type ProjectTaskStatus } from "../api/projects";
 import { fetchContractsRegistry } from "../api/contractsRegistry";
 import { mapApiErrorMessage } from "../api/errorMessages";
 import { DetailSideMeta } from "../components/patterns/DetailSideMeta";
@@ -136,6 +136,30 @@ function formatDateTime(value: string | null) {
   return formatDisplayDateTime(value);
 }
 
+function resolveProjectNextAction(detail: ProjectDetail) {
+  if (detail.status === "archived") {
+    return "项目已归档，主要用于查询合同、交付、费用和资料引用。";
+  }
+  if (detail.closureSummary.pendingCount > 0) {
+    return `优先补齐 ${detail.closureSummary.pendingCount} 项收口清单，再执行完成或归档。`;
+  }
+  if (detail.closureSummary.facts.openRiskCount > 0) {
+    return `当前有 ${detail.closureSummary.facts.openRiskCount} 个未关闭风险，建议指定责任人和截止时间。`;
+  }
+  if (detail.counts.milestones > 0 && detail.status === "active") {
+    return "按里程碑和任务推进项目，客户沟通、交付记录和周报都在本页留痕。";
+  }
+  if (detail.status === "draft") {
+    return "先补齐负责人、项目经理、时间范围和摘要，再进入执行。";
+  }
+  return "当前项目可继续维护执行记录、费用关联和归档资料引用。";
+}
+
+function resolveProjectEvidenceText(detail: ProjectDetail) {
+  const facts = detail.closureSummary.facts;
+  return `交付 ${facts.deliveryRecordCount} · 合同 ${facts.contractCount} · 资料引用 ${facts.confidentialDocRefCount}`;
+}
+
 export function ProjectDetailPage() {
   const { projectId = "" } = useParams();
   const queryClient = useQueryClient();
@@ -538,13 +562,15 @@ export function ProjectDetailPage() {
   const milestoneItems = milestonesQuery.data?.items ?? detail.milestones;
   const taskItems = tasksQuery.data?.items ?? detail.tasks;
   const riskItems = risksQuery.data?.items ?? detail.risks;
+  const projectNextAction = resolveProjectNextAction(detail);
+  const projectEvidenceText = resolveProjectEvidenceText(detail);
 
   return (
     <>
     <PageScaffold>
       <EntityOverviewHero
         title={`${detail.projectNo} · ${detail.name}`}
-        subtitle="项目概览、执行、留痕与归档在同一工作台内查看和处理。"
+        subtitle="项目状态、下一步、执行留痕和归档边界集中在一个工作台内处理。"
         meta={
           <>
             <StatusBadge status={detail.status} />
@@ -569,7 +595,31 @@ export function ProjectDetailPage() {
         }
       />
 
-      <section className="grid gap-4 md:grid-cols-2 xl:grid-cols-6">
+      <section className="detail-command-panel" data-testid="project-current-command">
+        <div className="grid gap-4 xl:grid-cols-[minmax(0,1.1fr),minmax(260px,0.9fr)]">
+          <div className="min-w-0">
+            <div className="text-xs font-semibold text-zinc-500">当前办理焦点</div>
+            <p className="mt-1 text-sm leading-6 text-zinc-700">{projectNextAction}</p>
+            <div className="mt-3 flex flex-wrap gap-2">
+              <span className="info-chip">状态：{projectStatusLabel(detail.status)}</span>
+              <span className="info-chip">证据：{projectEvidenceText}</span>
+              {detail.isConfidential ? <span className="badge-warning">涉密资料仅登记引用</span> : null}
+            </div>
+          </div>
+          <div className="detail-fact-grid">
+            <div className="detail-fact-card">
+              <div className="detail-fact-card__label">收口待处理</div>
+              <div className="detail-fact-card__value">{detail.closureSummary.pendingCount}</div>
+            </div>
+            <div className="detail-fact-card">
+              <div className="detail-fact-card__label">未关闭风险</div>
+              <div className="detail-fact-card__value">{detail.closureSummary.facts.openRiskCount}</div>
+            </div>
+          </div>
+        </div>
+      </section>
+
+      <section className="ops-status-strip grid gap-4 md:grid-cols-2 xl:grid-cols-4">
         <MetricCard title="成员" value={counts?.members ?? 0} note="执行角色与观察者" />
         <MetricCard title="里程碑" value={counts?.milestones ?? 0} note="用于跟踪关键节点" />
         <MetricCard title="任务" value={counts?.tasks ?? 0} note="按优先级与状态推进" />
@@ -580,7 +630,7 @@ export function ProjectDetailPage() {
       </section>
 
       {(detail.status === "completed" || detail.status === "archived") && detail.closureSummary.pendingCount > 0 ? (
-        <div className="card-std border-amber-200 bg-amber-50 p-4" data-testid="project-closure-warning">
+        <div className="ops-inline-alert border-amber-200 bg-amber-50 text-amber-800" data-testid="project-closure-warning">
           <div className="font-medium text-zinc-900">项目已进入收口状态，但仍有 {detail.closureSummary.pendingCount} 项待处理</div>
           <div className="mt-1 text-sm text-zinc-600">本轮是软约束：允许完成或归档，但请尽快补齐交付、费用、合同与交接说明。</div>
         </div>

client/src/pages/WorkflowTaskDetailPage.tsx

@@ -115,6 +115,32 @@ function isAlreadyProcessedTaskError(error: unknown) {
   return isApiError(error) && error.details?.task === "already_processed";
 }
 
+function resolveWorkflowNextActionText(input: {
+  taskStatus: string;
+  entityType?: string | null;
+  allowedActions: string[];
+}) {
+  if (input.taskStatus !== "pending") {
+    return "当前审批任务已结束，本页用于查看摘要、依据和处理历史。";
+  }
+
+  const entityName = entityTitle(input.entityType ?? undefined);
+  if (input.allowedActions.includes("approve")) {
+    return `先核对${entityName}摘要、金额/时间和附件依据；确认无误后通过，存在缺口时退回补充。`;
+  }
+  if (input.allowedActions.includes("return")) {
+    return `当前节点可退回，请说明需要补充的${entityName}材料或字段。`;
+  }
+  if (input.allowedActions.includes("reject")) {
+    return `当前节点可驳回，请写清业务原因，便于申请人和后续审计理解。`;
+  }
+  if (input.allowedActions.includes("transfer")) {
+    return "当前节点可转审，请选择更合适的审批人并说明原因。";
+  }
+
+  return "当前账号没有可执行动作，请返回待办列表或联系管理员核对权限。";
+}
+
 export function WorkflowTaskDetailPage() {
   const { taskId = "" } = useParams();
   const navigate = useNavigate();
@@ -257,17 +283,23 @@ export function WorkflowTaskDetailPage() {
   const canTransfer = allowedActions.has("transfer");
   const allowedActionLabels = detail.allowedActions.map(workflowActionLabel).join(" / ");
   const businessStatusLabel = workflowInstanceStatusLabel(detail.workflowInstance?.currentStatus);
+  const nextActionText = resolveWorkflowNextActionText({
+    taskStatus: detail.task.status,
+    entityType: detail.workflowInstance?.entityType,
+    allowedActions: detail.allowedActions,
+  });
 
   return (
     <>
     <PageScaffold>
       <EntityOverviewHero
-        title={`任务详情 ${detail.task.stepName}`}
-        subtitle="摘要、动作和处理历史集中办理。"
+        title={`任务详情 · ${detail.task.stepName}`}
+        subtitle="先核对业务摘要和证据，再处理通过、退回、驳回或转审。"
         meta={(
           <>
             <StatusBadge status={detail.task.status} />
             <span className="info-chip">业务状态：{businessStatusLabel}</span>
+            <span className="info-chip">类型：{entityTitle(detail.workflowInstance?.entityType)}</span>
           </>
         )}
         actions={(
@@ -279,8 +311,20 @@ export function WorkflowTaskDetailPage() {
 
       <div className="detail-workspace-grid">
         <div className="space-y-5">
-          <SectionPanel title="审批对象摘要">
+          <SectionPanel title="当前状态与审批对象" description="首屏只放判断审批所需的状态、摘要和下一步。">
             <div className="space-y-4" data-testid="workflow-task-overview">
+              <div className="detail-command-panel" data-testid="workflow-task-next-action">
+                <div className="flex flex-col gap-3 md:flex-row md:items-start md:justify-between">
+                  <div className="min-w-0">
+                    <div className="text-xs font-semibold text-zinc-500">下一步</div>
+                    <p className="mt-1 text-sm leading-6 text-zinc-700">{nextActionText}</p>
+                  </div>
+                  <div className="shrink-0 rounded-lg border border-zinc-200 bg-white px-3 py-2 text-sm text-zinc-700">
+                    可执行：<span className="font-semibold text-zinc-900">{allowedActionLabels || "无"}</span>
+                  </div>
+                </div>
+              </div>
+
               <StatStrip columns={4} className="ops-status-strip">
                 <MetricCard title="当前节点" value={<span className="text-base">{detail.task.stepName}</span>} />
                 <MetricCard title="业务类型" value={<span className="text-base">{entityTitle(detail.workflowInstance?.entityType)}</span>} />
@@ -400,7 +444,7 @@ export function WorkflowTaskDetailPage() {
             </SectionPanel>
           ) : null}
 
-          <SectionPanel title="审批动作">
+          <SectionPanel title="审批动作" description="高风险动作会再次确认；驳回、退回和转审需要留下可复核说明。">
             <div className="detail-action-stack">
               {actionError ? (
                 <p
@@ -521,13 +565,16 @@ export function WorkflowTaskDetailPage() {
         </div>
 
         <div className="space-y-5">
-          <DetailSideMeta title="任务摘要">
+          <DetailSideMeta title="任务摘要" description="保留审批留痕所需的节点、角色和时间。">
             <div>节点：{detail.task.stepName}</div>
             <div>实例状态：{workflowInstanceStatusLabel(detail.workflowInstance?.currentStatus)}</div>
             <div>当前审批角色：{detail.task.assigneeRole ?? "-"}</div>
             <div>创建时间：{formatDateTime(detail.task.createdAt)}</div>
             <div>完成时间：{formatDateTime(detail.task.completedAt)}</div>
             <div>发起时间：{formatDateTime(detail.workflowInstance?.startedAt)}</div>
+            <div className="rounded-lg border border-zinc-200 bg-zinc-50 p-3 text-zinc-700">
+              {nextActionText}
+            </div>
           </DetailSideMeta>
         </div>
       </div>

client/tests/e2e/pc-detail-mobile-visual-wave3.spec.ts

@@ -264,6 +264,235 @@ const notifications = [
   },
 ];
 
+const projectDetail = {
+  id: "project-wave3",
+  projectNo: "HYB-W3",
+  name: "OA 试运行",
+  clientName: "海音达内部",
+  clientAlias: "海音达",
+  ownerEmployeeId: visualMe.id,
+  managerEmployeeId: visualMe.id,
+  status: "active",
+  startsAt: "2026-05-20",
+  targetEndAt: "2026-06-03",
+  actualEndAt: null,
+  summary: "真实试运行阶段，重点验证审批、报销、合同台账和移动入口。",
+  isConfidential: true,
+  createdAt: "2026-05-20T09:00:00.000Z",
+  updatedAt: "2026-05-27T09:30:00.000Z",
+  owner: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+  manager: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+  counts: {
+    members: 2,
+    milestones: 2,
+    tasks: 3,
+    risks: 1,
+    reimbursements: 1,
+    purchaseRequests: 1,
+    travelRequests: 0,
+    todoItems: 2,
+    weeklyReports: 1,
+    communicationLogs: 1,
+    closureChecklistItems: 3,
+    contracts: 1,
+    deliveries: 1,
+    documentRefs: 1,
+  },
+  members: [
+    {
+      id: "member-wave3",
+      employeeId: visualMe.id,
+      role: "manager",
+      joinedAt: "2026-05-20",
+      leftAt: null,
+      employee: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+    },
+  ],
+  milestones: [
+    {
+      id: "milestone-wave3",
+      title: "公网试运行准备",
+      description: null,
+      status: "in_progress",
+      dueDate: "2026-05-29",
+      completedAt: null,
+      ownerEmployeeId: visualMe.id,
+      sortOrder: 1,
+    },
+  ],
+  tasks: [
+    {
+      id: "project-task-wave3",
+      title: "整理试运行反馈",
+      description: "跟进移动端和合同台账反馈",
+      status: "doing",
+      priority: "high",
+      assigneeEmployeeId: visualMe.id,
+      dueDate: "2026-05-30",
+      blockedReason: null,
+      createdBy: visualMe.id,
+      assignee: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+      creator: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+      createdAt: "2026-05-27T09:00:00.000Z",
+      updatedAt: "2026-05-27T09:10:00.000Z",
+    },
+  ],
+  risks: [
+    {
+      id: "risk-wave3",
+      title: "移动端首屏信息过多",
+      detail: "需要保持办理摘要和主要动作优先。",
+      level: "medium",
+      status: "monitoring",
+      ownerEmployeeId: visualMe.id,
+      owner: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+      createdAt: "2026-05-27T09:00:00.000Z",
+      updatedAt: "2026-05-27T09:00:00.000Z",
+    },
+  ],
+  communicationSummary: {
+    totalCount: 1,
+    latestHappenedAt: "2026-05-27T10:00:00.000Z",
+    followUpDueTodayCount: 1,
+    overdueFollowUpCount: 0,
+  },
+  closureSummary: {
+    totalCount: 3,
+    pendingCount: 1,
+    waivedCount: 0,
+    warned: true,
+    facts: {
+      openRiskCount: 1,
+      openReimbursementCount: 1,
+      openTravelCount: 0,
+      deliveryRecordCount: 1,
+      contractCount: 1,
+      confidentialDocRefCount: 1,
+    },
+  },
+  capabilities: {
+    communicationLogEnabled: true,
+    closureChecklistEnabled: true,
+  },
+};
+
+const contractRegistryItem = {
+  id: "contract-wave3",
+  contractNo: "HT-2026-W3",
+  projectId: projectDetail.id,
+  contractType: "service",
+  counterpartyName: "北京示例服务有限公司",
+  summary: "OA 试运行服务协议台账摘要",
+  amount: "30000.00",
+  currency: "CNY",
+  signedDate: "2026-05-20",
+  effectiveDate: "2026-05-21",
+  expiryDate: "2026-06-20",
+  confidentialityLevel: "internal",
+  archiveLocation: "离线档案柜 A-01",
+  offlineArchiveNo: "OFF-2026-W3",
+  ownerEmployeeId: visualMe.id,
+  status: "active",
+  persistedStatus: "active",
+  createdAt: "2026-05-20T09:00:00.000Z",
+  updatedAt: "2026-05-27T09:00:00.000Z",
+  owner: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+  project: { id: projectDetail.id, projectNo: projectDetail.projectNo, name: projectDetail.name },
+};
+
+const purchaseDetail = {
+  id: "purchase-wave3",
+  requestNo: "CG20260527001",
+  applicantId: visualMe.id,
+  submitterId: visualMe.id,
+  departmentId: "dept-wave3",
+  legalEntityId: "legal-wave3",
+  costCenterId: "cost-wave3",
+  supplierId: "supplier-wave3",
+  documentCategoryId: "category-wave3",
+  budgetPoolId: "budget-wave3",
+  projectId: projectDetail.id,
+  title: "试运行办公物料采购",
+  reason: "补齐试运行期间需要的标签纸和档案用品。",
+  currencyCode: "CNY",
+  totalAmount: "1280.00",
+  expectedDeliveryDate: "2026-05-30",
+  status: "reviewing",
+  createdAt: "2026-05-27T08:30:00.000Z",
+  updatedAt: "2026-05-27T09:30:00.000Z",
+  applicant: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+  submitter: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+  department: { id: "dept-wave3", name: "研发部" },
+  legalEntity: { id: "legal-wave3", code: "HYD", name: "海音达" },
+  costCenter: { id: "cost-wave3", code: "RD", name: "研发中心", legalEntityId: "legal-wave3" },
+  supplier: { id: "supplier-wave3", code: "SUP-W3", name: "北京示例服务有限公司" },
+  documentCategory: { id: "category-wave3", code: "OFFICE", name: "办公用品", entityType: "purchase_request" },
+  budgetPool: { id: "budget-wave3", code: "OPS", name: "运营预算" },
+  project: { id: projectDetail.id, projectNo: projectDetail.projectNo, name: projectDetail.name, status: projectDetail.status },
+  items: [
+    {
+      id: "purchase-item-wave3",
+      description: "档案标签纸",
+      specification: "A4 / 100 张",
+      quantity: "2",
+      unitPrice: "640.00",
+      lineAmount: "1280.00",
+      isAssetCandidate: false,
+      createdAt: "2026-05-27T08:30:00.000Z",
+      updatedAt: "2026-05-27T08:30:00.000Z",
+    },
+  ],
+  attachments: [
+    {
+      id: "purchase-att-wave3",
+      originalName: "采购说明.pdf",
+      mimeType: "application/pdf",
+      fileSize: 64000,
+      fileSha256: "purchase-hash-wave3",
+      uploadedBy: visualMe.id,
+      createdAt: "2026-05-27T08:40:00.000Z",
+      uploader: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+      governanceStatus: "approved",
+      sensitivityLevel: "internal",
+      attachmentType: "supporting_material",
+      downloadPolicy: "reason_required",
+      reviewedBy: visualMe.id,
+      reviewedAt: "2026-05-27T08:50:00.000Z",
+      reviewNote: "已复核",
+      archivedBy: null,
+      archivedAt: null,
+      archiveNote: null,
+    },
+  ],
+  pendingWorkflow: {
+    instanceId: "workflow-purchase-wave3",
+    currentStatus: "reviewing",
+    currentStepId: "manager-review",
+    task: {
+      id: "task-purchase-wave3",
+      stepId: "manager-review",
+      stepName: "主管审批",
+      assigneeId: visualMe.id,
+      assigneeRole: "manager",
+    },
+  },
+  approvalHistory: [
+    {
+      id: "purchase-history-wave3",
+      taskId: "task-purchase-wave3",
+      actorId: visualMe.id,
+      actorName: visualMe.name,
+      actorEmployeeNo: visualMe.employeeNo,
+      action: "submit",
+      comment: "请审批",
+      createdAt: "2026-05-27T09:00:00.000Z",
+    },
+  ],
+  archiveOrder: null,
+  permissions: { canEditDraft: false, canSubmit: false, canWithdraw: false, canArchiveOrder: false },
+  riskFlags: [],
+};
+
 function envelope<T>(data: T) {
   return { requestId: "mock-wave3", data };
 }
@@ -449,8 +678,235 @@ async function mockWave3Apis(page: Page) {
       return;
     }
 
+    if (pathName === "/api/projects/project-wave3") {
+      await fulfillJson(route, { item: projectDetail });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/members") {
+      await fulfillJson(route, { items: projectDetail.members });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/milestones") {
+      await fulfillJson(route, { items: projectDetail.milestones });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/tasks") {
+      await fulfillJson(route, { items: projectDetail.tasks });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/risks") {
+      await fulfillJson(route, { items: projectDetail.risks });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/expenses/summary") {
+      await fulfillJson(route, {
+        totalAmount: reimbursementDetail.totalAmount,
+        items: [
+          {
+            id: reimbursementDetail.id,
+            formNumber: reimbursementDetail.formNumber,
+            status: reimbursementDetail.status,
+            totalAmount: reimbursementDetail.totalAmount,
+            reimbursementDate: reimbursementDetail.reimbursementDate,
+            updatedAt: "2026-05-27T09:20:00.000Z",
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/travel/summary") {
+      await fulfillJson(route, { totalAmount: "0.00", items: [] });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/purchase-requests/summary") {
+      await fulfillJson(route, {
+        totalAmount: purchaseDetail.totalAmount,
+        items: [
+          {
+            id: purchaseDetail.id,
+            requestNo: purchaseDetail.requestNo,
+            title: purchaseDetail.title,
+            status: purchaseDetail.status,
+            totalAmount: purchaseDetail.totalAmount,
+            updatedAt: purchaseDetail.updatedAt,
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/weekly-reports") {
+      await fulfillJson(route, {
+        items: [
+          {
+            id: "weekly-link-wave3",
+            weeklyReportId: "weekly-wave3",
+            weekStart: "2026-05-25",
+            status: "submitted",
+            employee: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+            progressText: "完成 Wave3 视觉复核",
+            riskText: null,
+            nextStepText: "继续公网验证",
+            updatedAt: "2026-05-27T09:20:00.000Z",
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/deliveries") {
+      await fulfillJson(route, {
+        items: [
+          {
+            id: "delivery-wave3",
+            title: "试运行准备记录",
+            recordType: "stage_acceptance",
+            summary: "完成页面体验基线复核。",
+            occurredAt: "2026-05-27",
+            owner: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+            createdAt: "2026-05-27T09:20:00.000Z",
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/document-refs") {
+      await fulfillJson(route, {
+        items: [
+          {
+            id: "doc-ref-wave3",
+            title: "试运行资料索引",
+            documentNo: "DOC-W3",
+            confidentialityLevel: "internal",
+            storageType: "offline_archive",
+            storagePath: "离线档案柜 A-01",
+            offlineArchiveNo: "OFF-2026-W3",
+            updatedAt: "2026-05-27T09:00:00.000Z",
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/communication-logs") {
+      await fulfillJson(route, {
+        items: [
+          {
+            id: "comm-wave3",
+            happenedAt: "2026-05-27T10:00:00.000Z",
+            channel: "meeting",
+            externalContactName: "试运行负责人",
+            externalOrgName: "海音达",
+            summary: "确认先优化详情页和移动入口。",
+            nextAction: "继续收集反馈",
+            nextFollowUpDate: "2026-05-29",
+            createdBy: visualMe.id,
+            createdAt: "2026-05-27T10:10:00.000Z",
+            updatedAt: "2026-05-27T10:10:00.000Z",
+            canEdit: true,
+            creator: { id: visualMe.id, employeeNo: visualMe.employeeNo, name: visualMe.name },
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/projects/project-wave3/closure-checklist") {
+      await fulfillJson(route, {
+        items: [
+          {
+            id: "closure-wave3",
+            itemKey: "contract",
+            title: "合同归档位置已登记",
+            status: "pending",
+            note: null,
+            sortOrder: 1,
+            completedAt: null,
+            completedBy: null,
+            canEdit: true,
+            completer: null,
+          },
+        ],
+      });
+      return;
+    }
+
     if (pathName === "/api/projects") {
-      await fulfillJson(route, { items: [reimbursementDetail.project] });
+      await fulfillJson(route, {
+        items: [
+          {
+            id: projectDetail.id,
+            projectNo: projectDetail.projectNo,
+            name: projectDetail.name,
+            clientName: projectDetail.clientName,
+            clientAlias: projectDetail.clientAlias,
+            status: projectDetail.status,
+            startsAt: projectDetail.startsAt,
+            targetEndAt: projectDetail.targetEndAt,
+            actualEndAt: projectDetail.actualEndAt,
+            summary: projectDetail.summary,
+            isConfidential: projectDetail.isConfidential,
+            owner: projectDetail.owner,
+            manager: projectDetail.manager,
+            counts: {
+              members: projectDetail.counts.members,
+              milestones: projectDetail.counts.milestones,
+              tasks: projectDetail.counts.tasks,
+              risks: projectDetail.counts.risks,
+              overdueMilestones: 0,
+              highPriorityTasks: 1,
+              openRisks: projectDetail.closureSummary.facts.openRiskCount,
+            },
+            updatedAt: projectDetail.updatedAt,
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/employees") {
+      await fulfillJson(route, {
+        page: 1,
+        pageSize: 100,
+        total: 1,
+        items: [
+          {
+            id: visualMe.id,
+            employeeNo: visualMe.employeeNo,
+            name: visualMe.name,
+            email: visualMe.email,
+            phone: visualMe.phone,
+            status: "active",
+          },
+        ],
+      });
+      return;
+    }
+
+    if (pathName === "/api/contracts-registry/expiring") {
+      await fulfillJson(route, {
+        days: Number(url.searchParams.get("days") ?? 30),
+        total: 1,
+        items: [contractRegistryItem],
+      });
+      return;
+    }
+
+    if (pathName === "/api/contracts-registry") {
+      await fulfillJson(route, { items: [contractRegistryItem] });
+      return;
+    }
+
+    if (pathName === "/api/purchase-requests/purchase-wave3") {
+      await fulfillJson(route, purchaseDetail);
       return;
     }
 
@@ -603,21 +1059,34 @@ test("Wave3 PC 详情和通知中心视觉截图", async ({ page }) => {
 
   await page.goto("/reimbursements/reim-wave3");
   await expect(page.getByRole("heading", { name: /报销详情/ })).toBeVisible();
-  await expect(page.getByText("办理摘要")).toBeVisible();
+  await expect(page.getByTestId("reimbursement-summary")).toBeVisible();
   await expect(page.getByTestId("reimbursement-payment-status")).toBeVisible();
   await page.screenshot({ path: screenshotPath("01-pc-reimbursement-detail.png"), fullPage: true });
 
   await page.goto("/workflow/tasks/task-wave3");
   await expect(page.getByRole("heading", { name: /任务详情/ })).toBeVisible();
+  await expect(page.getByTestId("workflow-task-next-action")).toBeVisible();
   await expect(page.getByText("审批动作")).toBeVisible();
   await expect(page.getByTestId("workflow-task-overview")).toBeVisible();
   await page.screenshot({ path: screenshotPath("02-pc-workflow-detail.png"), fullPage: true });
 
+  await page.goto("/projects/project-wave3");
+  await expect(page.getByRole("heading", { name: /HYB-W3/ })).toBeVisible();
+  await expect(page.getByTestId("project-current-command")).toBeVisible();
+  await expect(page.locator("table").first()).toBeVisible();
+  await page.screenshot({ path: screenshotPath("03-pc-project-detail.png"), fullPage: true });
+
+  await page.goto("/contracts-registry?projectId=project-wave3");
+  await expect(page.getByRole("heading", { name: "合同台账", exact: true })).toBeVisible();
+  await expect(page.getByTestId("contracts-registry-summary")).toBeVisible();
+  await expect(page.getByTestId("contracts-registry-row")).toBeVisible();
+  await page.screenshot({ path: screenshotPath("04-pc-contracts-registry.png"), fullPage: true });
+
   await page.goto("/notifications");
   await expect(page.getByRole("heading", { name: "通知" })).toBeVisible();
   await expect(page.getByTestId("notification-row").first()).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
-  await page.screenshot({ path: screenshotPath("03-pc-notifications.png"), fullPage: true });
+  await page.screenshot({ path: screenshotPath("05-pc-notifications.png"), fullPage: true });
 });
 
 test("Wave3 移动关键页视觉截图", async ({ page }) => {
@@ -632,35 +1101,53 @@ test("Wave3 移动关键页视觉截图", async ({ page }) => {
 
   await page.goto("/mobile/reimbursements");
   await expect(page.getByRole("heading", { name: "移动报销" })).toBeVisible();
+  await expect(page.getByTestId("mobile-reimbursements-focus")).toBeVisible();
   await expect(page.getByTestId("mobile-reimbursements-list")).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
   await expectNoHorizontalOverflow(page);
   await page.screenshot({ path: screenshotPath("05-mobile-reimbursements.png"), fullPage: true });
 
+  await page.goto("/mobile/reimbursements/reim-wave3");
+  await expect(page.getByTestId("mobile-reimbursement-detail-focus")).toBeVisible();
+  await expect(page.getByTestId("mobile-reimbursement-items")).toBeVisible();
+  await expect(page.locator("table")).toHaveCount(0);
+  await expectNoHorizontalOverflow(page);
+  await page.screenshot({ path: screenshotPath("06-mobile-reimbursement-detail.png"), fullPage: true });
+
   await page.goto("/mobile/approvals");
   await expect(page.getByRole("heading", { name: "审批", exact: true })).toBeVisible();
+  await expect(page.getByTestId("mobile-approvals-focus")).toBeVisible();
   await expect(page.getByTestId("mobile-approvals-list")).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
   await expectNoHorizontalOverflow(page);
-  await page.screenshot({ path: screenshotPath("06-mobile-approvals.png"), fullPage: true });
+  await page.screenshot({ path: screenshotPath("07-mobile-approvals.png"), fullPage: true });
 
   await page.goto("/mobile/approvals/task-wave3");
   await expect(page.getByTestId("mobile-approvals-detail")).toBeVisible();
+  await expect(page.getByTestId("mobile-approvals-detail-focus")).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
   await expectNoHorizontalOverflow(page);
-  await page.screenshot({ path: screenshotPath("07-mobile-approval-detail.png"), fullPage: true });
+  await page.screenshot({ path: screenshotPath("08-mobile-approval-detail.png"), fullPage: true });
 
   await page.goto("/mobile/notifications");
+  await expect(page.getByTestId("mobile-notifications-focus")).toBeVisible();
   await expect(page.getByTestId("mobile-notifications-list")).toBeVisible();
   await expect(page.getByTestId("mobile-notification-card").first()).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
   await expectNoHorizontalOverflow(page);
-  await page.screenshot({ path: screenshotPath("08-mobile-notifications.png"), fullPage: true });
+  await page.screenshot({ path: screenshotPath("09-mobile-notifications.png"), fullPage: true });
+
+  await page.goto("/mobile/purchase-requests/purchase-wave3");
+  await expect(page.getByTestId("mobile-purchase-detail-summary")).toBeVisible();
+  await expect(page.getByTestId("mobile-purchase-detail-items")).toBeVisible();
+  await expect(page.locator("table")).toHaveCount(0);
+  await expectNoHorizontalOverflow(page);
+  await page.screenshot({ path: screenshotPath("10-mobile-purchase-detail.png"), fullPage: true });
 
   await page.goto("/mobile/me");
   await expect(page.getByRole("heading", { name: "我的" })).toBeVisible();
   await expect(page.getByTestId("mobile-more-links")).toBeVisible();
   await expect(page.locator("table")).toHaveCount(0);
   await expectNoHorizontalOverflow(page);
-  await page.screenshot({ path: screenshotPath("09-mobile-me.png"), fullPage: true });
+  await page.screenshot({ path: screenshotPath("11-mobile-me.png"), fullPage: true });
 });