优化PC核心工作流视觉 Wave2（05-27-pc-core-workflow-visual-wave2）

2026-05-27 18:12:23 +08:00
@@ -0,0 +1,3 @@
+{"file": ".trellis/spec/hyb-oa/frontend-react-vite-design.md", "reason": "检查前端变更是否遵守视觉裁决、认证页和验证要求。"}
+{"file": ".trellis/spec/frontend/index.md", "reason": "检查前端包入口和视觉权威边界。"}
+{"file": ".trellis/spec/guides/index.md", "reason": "检查共享复用和跨层影响。"}
@@ -0,0 +1,3 @@
+{"file": ".trellis/spec/hyb-oa/frontend-react-vite-design.md", "reason": "前端视觉和认证页布局约束，明确 frontend-design 为视觉裁决来源。"}
+{"file": ".trellis/spec/frontend/index.md", "reason": "前端包入口和当前视觉权威边界。"}
+{"file": ".trellis/spec/guides/index.md", "reason": "共享复用与跨层思考入口，避免重复造局部样式系统。"}
@@ -0,0 +1,33 @@
+# 实施记录
+
+## 实施策略
+
+1. 先增加少量 PC 工作台共享样式和视觉 token，避免四个页面各自堆 Tailwind。
+2. 登录页保持现有认证能力，只重排视觉层级和文案。
+3. 工作台优先压缩解释文字，重排“今日待处理 + 快捷动作 + 动态 + 二级入口”。
+4. 报销列表和审批待办统一命令栏和列表/表格主视觉。
+5. 完成后执行前端 typecheck、build、Trellis governance、diff check，并补视觉截图证据。
+
+## 风险控制
+
+- 不改 API、schema、权限、状态机、审批规则或企业微信配置。
+- 不写公网业务数据。
+- 如果视觉改动影响移动路由，必须在本轮验证中说明。
+
+## 实施结果
+
+- 新增 PC 操作台共享样式：`ops-status-strip`、`ops-command-bar`、`ops-table-focus`、`ops-inline-alert`，用于收敛状态指标、筛选/操作区和表格主视觉。
+- 登录页与找回密码页复用新的 `auth-panel` / `auth-shell`，保留账号密码、邮箱验证码、企业微信入口、忘记密码、密码显隐和 PWA 手动刷新提示。
+- Portal 工作台压缩说明文字，保留角色差异和权限入口，收紧常用动作、待处理、团队状态和通知区域密度。
+- 报销列表和审批待办统一为紧凑命令栏 + 状态条 + 表格主视觉，保留范围切换、导出、批量操作和审批快捷入口。
+- 新增 `client/tests/e2e/pc-core-workflow-visual-wave2.spec.ts`，mock API 覆盖登录页、Portal、报销列表和审批待办，并生成截图证据。
+- 将 PC 操作列表密度约定沉淀到 `.trellis/spec/hyb-oa/frontend-react-vite-design.md`。
+
+## 验证记录
+
+- `cd client && npm run typecheck`：通过。
+- `cd client && npm run build`：通过。
+- `cd client && npx playwright test tests/e2e/pc-core-workflow-visual-wave2.spec.ts --workers=1 --reporter=list`：通过，截图输出到 `output/playwright/pc-core-workflow-visual-wave2/`。
+- `node scripts/qa/check-trellis-governance.mjs`：通过。
+- `python3 ./.trellis/scripts/task.py validate 05-27-05-27-pc-core-workflow-visual-wave2`：通过。
+- `git diff --check`：通过。
@@ -0,0 +1,74 @@
+# PC 核心工作流视觉重塑 Wave2
+
+## Goal
+
+按 `frontend-design` 重新收敛 PC 核心入口视觉和交互层级，让登录页、工作台、报销列表和审批待办从“通用中后台模板”转向“精密、低噪音、高密度的小团队工作台”。
+
+## Start Confirmation
+
+- 用户在 2026-05-27 确认“按照你的建议执行”。
+- 本任务是前端视觉与交互改进，不改变后端 API、权限模型、审批规则、状态机、数据库 schema、企业微信配置或公网真实数据。
+
+## Scope
+
+- 登录页：精简登录方式层级和提示信息，强化“工作台入口”感，不改登录能力。
+- PC 工作台 `/portal`：压缩解释性文案，突出今日待处理、快捷动作、动态和二级入口。
+- 报销列表 `/reimbursements`：收敛指标、筛选、范围、导出和批量操作的视觉层级，让表格成为主角。
+- 审批待办 `/workflow/tasks`：统一为紧凑任务控制台，减少说明感，强化待处理/已处理/批量操作。
+- 共享样式：在现有 React/Vite/Tailwind 与组件基础上添加少量可复用 PC 工作台样式，避免为单页自造一套完整 UI。
+
+## Out of Scope
+
+- 不改移动专项页面，除非共享样式自然影响且可验证。
+- 不改报销详情、审批详情、通知中心、财务/AP/票据池和 C 类管理页；这些进入 Wave3/Wave4。
+- 不新增业务能力、不新增字段、不写公网业务数据、不部署生产配置。
+- 不把 `docs/产品设计规则.md` 重新扩展为视觉规则；视觉裁决继续以 `frontend-design` 为准。
+
+## Design Direction
+
+- Tone：precision operations console，克制、精密、低噪音、高密度。
+- Composition：少大卡片，强命令栏，表格/列表为主角；状态和动作比解释文字更重要。
+- Copy：删除或弱化“为何这么设计”的提示，保留业务下一步和风险提示。
+- Motion：保留轻量进入动画，不引入夸张动效。
+- Density：PC 端允许更紧凑，移动端不作为本轮主改范围。
+
+## Requirements
+
+- 登录页继续支持账号密码、邮箱验证码、企业微信入口、忘记密码和 PWA 更新提示。
+- 登录页不能恢复 PWA 自动刷新清空表单的问题。
+- 工作台继续按角色展示不同内容，不泄露无权限入口。
+- 报销列表继续支持状态切换、范围切换、代理、导出、批量审批、删除草稿和分页。
+- 审批待办继续支持审批/驳回/退回/转审入口和已处理查看。
+- 页面不得展示完整账号、Secret、token、真实票据、合同正文、银行资料、完整本地路径或 raw payload。
+
+## Acceptance Criteria
+
+- [x] 四个核心入口视觉更统一：登录、工作台、报销列表、审批待办。
+- [x] 解释性文案明显减少；核心动作和状态更突出。
+- [x] PC 表格/列表页的命令区更紧凑，不牺牲现有业务能力。
+- [x] `cd client && npm run typecheck` 通过。
+- [x] `cd client && npm run build` 通过。
+- [x] 相关 Playwright/视觉截图至少覆盖登录页、工作台、报销列表和审批待办。
+- [x] `node scripts/qa/check-trellis-governance.mjs` 与 `git diff --check` 通过。
+
+## Test Plan
+
+```bash
+cd client && npm run typecheck
+cd client && npm run build
+node scripts/qa/check-trellis-governance.mjs
+git diff --check
+```
+
+按可用本地服务补充 Playwright 视觉截图：
+
+```bash
+cd client && npx playwright test <focused visual specs> --workers=1 --reporter=list
+```
+
+## Technical Notes
+
+- 前端设计 skill：`frontend-design`
+- 前端 spec：`.trellis/spec/hyb-oa/frontend-react-vite-design.md`
+- 产品体验事实：`docs/产品设计规则.md`
+- 现有证据参考：`output/playwright/pc-frontend-visual-consistency-wave1/`、`output/playwright/oafront3-pc-readonly-postdeploy/`
@@ -0,0 +1,26 @@
+{
+  "id": "05-27-pc-core-workflow-visual-wave2",
+  "name": "05-27-pc-core-workflow-visual-wave2",
+  "title": "PC核心工作流视觉重塑 Wave2",
+  "description": "按 frontend-design 收敛登录页、PC 工作台、报销列表和审批待办的视觉层级与操作密度。",
+  "status": "in_progress",
+  "dev_type": null,
+  "scope": "client: auth layout, portal, reimbursements, workflow tasks visual refinement",
+  "package": null,
+  "priority": "P2",
+  "creator": "shunli",
+  "assignee": "shunli",
+  "createdAt": "2026-05-27",
+  "completedAt": null,
+  "branch": null,
+  "base_branch": "main",
+  "worktree_path": null,
+  "commit": null,
+  "pr_url": null,
+  "subtasks": [],
+  "children": [],
+  "parent": null,
+  "relatedFiles": [],
+  "notes": "",
+  "meta": {}
+}