hyb-oa/.trellis/tasks/05-26-oa-frontend-pretrial-cleanup/implement.md

实施方案

执行原则

• 先统一高频 PC 页面观感，再处理低频边界页。
• 优先复用现有 client/src/components/patterns/* 和 components/ui/*，不引入新 UI 依赖。
• 改展示、默认筛选、折叠和文案，不改业务语义。
• 每一批改动后跑局部检查，避免大批量视觉改动难以定位问题。

页面批次

Batch 1：共享样板和高频 A 类页面

目标：把用户每天最先接触的页面统一成同一套 PC 工作台语言。

候选文件：

• client/src/pages/PortalHomePage.tsx
• client/src/pages/ReimbursementsPage.tsx
• client/src/pages/ReimbursementDetailPage.tsx
• client/src/pages/WorkflowTasksPage.tsx
• client/src/pages/WorkflowTaskDetailPage.tsx
• client/src/components/patterns/ListWorkspace.tsx
• client/src/components/patterns/SectionPanel.tsx

改动方向：

• Portal 保留工作台定位，但压缩说明文案，首屏突出待处理、我的申请、异常和常用入口。
• 报销/审批列表保持 ListWorkspace + WorkspaceHeader + FilterBar + PrimaryTable，统一副标题、指标条、状态页签和空状态。
• 报销/审批详情保持事实源结构，摘要、材料、审批流、日志和操作区层级一致。
• 如发现 SectionPanel 与 WorkspaceSection 密度冲突，优先用局部 class 或轻量补充组件统一密度，不做组件体系大重构。

Batch 2：B 类业务运营页面

目标：降低财务、合同、项目、资产页面的默认噪音，避免试运行用户被历史测试数据和高级配置分散。

候选文件：

• client/src/pages/ApOperationsPage.tsx
• client/src/pages/PaymentBatchesPage.tsx
• client/src/pages/ContractsRegistryPage.tsx
• client/src/pages/ProjectsPage.tsx
• client/src/pages/ProjectDetailPage.tsx
• client/src/pages/AssetRegistryPage.tsx

改动方向：

• AP/付款默认突出待付款、异常、待补资料；历史全量、导出、复核日志保留但次级化。
• 合同/项目弱化 TEST/SMOKE 噪音，首屏突出正式合同、到期、负责人、归档位置。
• 资产台账默认看资产列表和当前详情，分类维护、ERP 同步、元数据 JSON 后置或折叠。
• 操作按钮按主/次/危险分层，高风险动作保留确认。

Batch 3：C 类冻结/后置和边界页

目标：让普通管理员一眼知道哪些页面不是试运行主路径，减少误启用和误操作。

候选文件：

• client/src/pages/AttendancePage.tsx
• client/src/pages/BudgetsPage.tsx
• client/src/pages/TravelRequestsPage.tsx
• client/src/pages/ErpIntegrationPage.tsx
• client/src/pages/FeatureFlagsPage.tsx
• client/src/pages/CutoverConsolePage.tsx
• client/src/components/navigation/NavLinks.tsx
• client/src/features/navigation/schema.ts

改动方向：

• HR/考勤强调企业微信主办，OA 是留存/审计或应急边界。
• 预算、差旅、ERP、切换控制台保留可达性，但页面标题、说明或状态标签明确“未启用/只读/仅管理/后置”。
• 功能开关、通知渠道、切换控制台默认展示安全摘要，高级配置和危险动作后置。
• 导航不新增入口；如已有入口容易误导，只调整标签或说明。

验证流程

本地前端验证

cd client && npm run typecheck
cd client && npm run build

UI 规则与视觉证据

node scripts/qa/check-ui-design-rules.mjs --strict
bash scripts/qa/run-oafront3-pc-readonly-visual.sh

如涉及移动联动：

QA_ISSUE_ID=oa-frontend-pretrial VISUAL_MATRIX_SCOPE=mobile bash scripts/qa/run-visual-matrix.sh live

Trellis 与仓库检查

python3 ./.trellis/scripts/task.py validate 05-26-oa-frontend-pretrial-cleanup
node scripts/qa/check-trellis-governance.mjs
git diff --check

风险控制

• 若某个页面需要改 API、权限或状态机才能达成理想交互，停止在本任务内推进，只记录后续成熟化项。
• 若视觉矩阵需要公网环境或登录态，先跑能本地完成的 typecheck/build/design rules；公网检查需另按已有脚本和环境执行。
• 若修改范围超过 1-2 天，优先保 A 类核心页和 AP/付款，合同/项目/资产/C 类页降级为边界文案和默认折叠。
• 不把截图、报告或 Trellis 文件写入真实票据、合同正文、银行材料、完整账号或 raw payload。