194 lines
5.7 KiB
Markdown
194 lines
5.7 KiB
Markdown
# 消息台重构任务单（卡片改列表 Feed）
|
||
|
||
> 目标：把消息台从双列卡片重构为高密度列表 Feed，保证用户可读、可操作、可追溯。
|
||
> 范围：仅前端（不改后端接口）。
|
||
> 新增硬约束：信息流严格按时间倒序，最新在上。
|
||
|
||
---
|
||
|
||
## 0. 实施原则（先定边界）
|
||
|
||
- 不改 `backend` 接口与字段，仅做前端映射/渲染重构。
|
||
- 保持 `buildInboxView` 领域聚合能力不变，避免影响 TopBar 与其他入口。
|
||
- 用户视角文案与技术字段解耦：技术字段可在行内展开区可见，默认隐藏。
|
||
- 主列表排序规则统一：`updated_at || created_at` 降序（最新在上）。
|
||
|
||
---
|
||
|
||
## 1. 现状定位（SCOUT）
|
||
|
||
- [x] 定位页面入口：`frontend/src/pages/InboxPage.tsx`
|
||
- [x] 定位数据聚合：`frontend/src/lib/inbox.ts`
|
||
- [x] 定位类型定义：`frontend/src/types/inbox.ts`
|
||
- [x] 定位顶部铃铛预览依赖：`frontend/src/components/layout/TopBar.tsx`
|
||
- [x] 确认以下信息：
|
||
- [x] 列表数据来源接口（notifications + ai-pmo work-items）
|
||
- [x] 当前卡片组件边界（`InboxCard`）
|
||
- [x] Tab 分类逻辑位置（`activeSection` + `display_kind`）
|
||
|
||
---
|
||
|
||
## 2. 爆炸半径评估（TRACE）
|
||
|
||
- [x] 执行 `FIND_USAGE buildInboxView`
|
||
- [x] 执行 `FIND_USAGE InboxDisplayKind`
|
||
- [x] 执行 `FIND_USAGE InboxSectionKey`
|
||
- [x] 执行 `FIND_USAGE getInboxSectionLabel`
|
||
- [x] 评估结论记录：
|
||
- [x] `InboxPage` 改造是否会影响 `TopBar` 预览行为
|
||
- [x] 是否需要保持 `action_required|auto_running|auto_done|info` 内部枚举不变
|
||
|
||
> 说明：本次推荐保持内部枚举不变，仅在 UI 层映射为“待处理/进行中/已完成/全部”。
|
||
|
||
---
|
||
|
||
## 3. 组件与文件改造清单（SNIPER）
|
||
|
||
### 3.1 新增文件
|
||
|
||
- [x] `frontend/src/components/inbox/InboxListItem.tsx`
|
||
- [x] `frontend/src/lib/inboxTextMap.ts`
|
||
- [x] `frontend/src/lib/formatInboxTime.ts`
|
||
|
||
### 3.2 修改文件
|
||
|
||
- [x] `frontend/src/pages/InboxPage.tsx`
|
||
- [x] `frontend/src/components/layout/TopBar.tsx`（复用统一时间格式函数，可选；本次保持现状未改）
|
||
- [x] `CLAUDE.md`（目录结构变更同步）
|
||
|
||
---
|
||
|
||
## 4. 列表行设计规范
|
||
|
||
### 4.1 两种行高
|
||
|
||
- 需要操作行：72px
|
||
- 左：状态图标 + 标题 + 副标题
|
||
- 右：项目名、时间、`主操作`、`详情`
|
||
- 纯通知行：52px
|
||
- 左：状态图标 + 标题 + 副标题
|
||
- 右：项目名、时间、`详情`
|
||
|
||
### 4.2 行内交互
|
||
|
||
- [x] 点击行本体：展开/收起详情（inline，不跳页）
|
||
- [x] 点击主操作按钮：执行动作，不触发行展开
|
||
- [x] 点击详情按钮：仅展开详情（或打开详情弹窗，二选一，需统一）
|
||
|
||
### 4.3 详情展开区（默认折叠）
|
||
|
||
- [x] 显示技术字段：`intent` 原始值、typed actions、`chat_id`、完整时间戳、重复次数、撤销信息
|
||
- [x] 默认主行不出现技术字段
|
||
|
||
---
|
||
|
||
## 5. 文案映射策略（用户视角）
|
||
|
||
### 5.1 intent 映射（显示层）
|
||
|
||
- `signal_source.onboard` → `信号源接入`
|
||
- `signal.create` → `新信号识别`
|
||
- `project.create` → `项目已创建`
|
||
- `query.read_only` → `信息查询`
|
||
- `followup.confirm` → `确认执行`
|
||
- `followup.continue` → `跟进处理`
|
||
- `ignore` → `系统忽略`
|
||
|
||
### 5.2 状态映射（显示层）
|
||
|
||
- `action_required` → `待处理`
|
||
- `auto_running` → `进行中`
|
||
- `auto_done` → `已完成`
|
||
- `info` → `通知`
|
||
|
||
### 5.3 标题清洗规则
|
||
|
||
- [x] 优先使用 `notification.title` / `work_item.title`
|
||
- [x] 包含 `给项目ID:` 前缀时仅保留后半段
|
||
- [x] `registry#` 替换为 `历史记录`
|
||
- [x] 去除明显技术噪音字段展示（默认行）
|
||
|
||
---
|
||
|
||
## 6. Tab 重构（不改底层枚举）
|
||
|
||
## 用户 Tab（展示）
|
||
|
||
- `待处理`（映射 `action_required`）
|
||
- `进行中`（映射 `auto_running`）
|
||
- `已完成`（映射 `auto_done`）
|
||
- `全部`（映射 `all`）
|
||
|
||
## 计数规则
|
||
|
||
- [x] 每个 Tab 角标来自当前项目过滤后的实时集合
|
||
- [x] `全部 = 待处理 + 进行中 + 已完成 + 通知`（若通知不单列则并入全部但不单独显示）
|
||
|
||
---
|
||
|
||
## 7. 时间与排序规则（强制）
|
||
|
||
### 7.1 时间显示
|
||
|
||
- 1 分钟内：`刚刚`
|
||
- 1 小时内：`X 分钟前`
|
||
- 当天：`HH:mm`
|
||
- 昨天：`昨天 HH:mm`
|
||
- 更早：`MM-DD HH:mm`
|
||
|
||
### 7.2 排序（硬约束）
|
||
|
||
- 主 Feed 严格按 `updated_at || created_at` 降序。
|
||
- 最新消息永远在最上方。
|
||
- Tab 切换、搜索、项目筛选后仍保持同一倒序规则。
|
||
- 如时间缺失：降级到 `created_at`；仍缺失时排到分组末尾。
|
||
|
||
---
|
||
|
||
## 8. 首屏密度与布局调整
|
||
|
||
- [x] 折叠/压缩顶部指标区（避免占用过高首屏）
|
||
- [x] 列表单列展示（移动端与桌面统一 Feed 心智）
|
||
- [x] 状态筛选仅作为过滤器，不采用任何看板分栏布局
|
||
- [x] 验证 1080p 下首屏可见条数 `>= 8`
|
||
|
||
---
|
||
|
||
## 9. 验收标准（Definition of Done）
|
||
|
||
- [x] 一屏可见条数 `>= 8`
|
||
- [x] 主列表默认无技术字段暴露（展开区除外）
|
||
- [x] Tab 筛选准确：待处理/进行中/已完成/全部
|
||
- [x] 时间显示全部为相对/友好格式
|
||
- [x] 点击行可展开/收起详情
|
||
- [x] 主 Feed 严格“最新在上”
|
||
- [x] `npm run build` 通过
|
||
- [x] `tsc --noEmit` 零错误
|
||
|
||
---
|
||
|
||
## 10. 自检命令（前端）
|
||
|
||
```bash
|
||
cd frontend
|
||
npm run build
|
||
npx tsc --noEmit
|
||
```
|
||
|
||
技术词裸露扫描（渲染主行）：
|
||
|
||
```bash
|
||
rg -n "typed actions|read_only|registry#|chat_id" frontend/src/pages frontend/src/components/inbox
|
||
```
|
||
|
||
> 期望：仅允许出现在“展开详情区”相关代码路径，不允许出现在默认主行渲染文本。
|
||
|
||
---
|
||
|
||
## 11. 交付物
|
||
|
||
- [x] 变更文件清单
|
||
- [x] 首屏可见条数描述（含测试分辨率）
|
||
- [x] 排序规则验证说明（最新在上）
|
||
- [x] 构建与类型检查结果
|