# M14 / issue-146 开发日志：admin 简历编辑页布局收口与模块折叠

- Issue：`#146`
- 里程碑：`M14 编辑体验与亮点表达重构`
- 分支：`fys-dev/feat-m14-issue-146-admin-editor-layout`
- 日期：`2026-04-06`

## 背景

`/dashboard/resume` 在功能上已经能维护完整标准简历模型，但页面节奏仍然偏“长表单”：

- 顶部 `status-box` 占位大，但信息密度不高
- 说明区和模块规划卡片常驻，压缩了真正的编辑空间
- 教育、工作、项目、技能、亮点越多，页面越容易失去结构感
- 用户进入页面后，很难一眼判断“我现在正在维护哪一段”

这会让后台明明已经具备完整 schema，却在交互上仍然显得笨重。

## 本次目标

- 收掉低效说明占位
- 把简历编辑器整理成真正的模块工作区
- 让基础信息、教育、工作、项目、技能、亮点支持折叠 / 展开
- 在不影响保存能力的前提下，提高页面可读性与空间利用率

## 非目标

- 不改双语数据模型
- 不改中文 / 英文编辑方式
- 不改公开页亮点表达
- 不进入新的 schema 调整或发布链路改造

## 实际改动

### 1. 把编辑器从长表单整理成模块工作区

更新：

- [resume-draft-editor-panel.tsx](/Users/fri/Desktop/personal/my-resume/apps/admin/components/resume-draft-editor-panel.tsx)

本轮新增了两层可复用的折叠结构：

- `EditorSection`
- `EditorEntry`

前者负责“基础信息 / 教育 / 工作 / 项目 / 技能 / 亮点”这类主模块，后者负责模块下的单段经历、单个项目、单个技能组、单条亮点。

这样页面不再一次性把全部字段直接摊开，而是先展示：

- 模块标题
- 简短说明
- 当前条目数
- 展开 / 折叠状态

进入某个模块后，再按条目继续展开细看，页面节奏会清楚很多。

### 2. 收掉高占位提示区，改成紧凑状态栏

原来“草稿态与发布态分离”的提示块占位偏大，本轮改成了更紧凑的一行说明：

- 左侧保留核心语义
- 右侧用 `Chip` 显示最近保存时间

这样依然保留了“保存不等于发布”的关键教学信息，但不再抢编辑空间。

### 3. 简化编辑页头部说明

更新：

- [admin-resume-shell.tsx](/Users/fri/Desktop/personal/my-resume/apps/admin/components/admin-resume-shell.tsx)

原来顶部使用双栏说明区，一边是页面说明，一边是模块规划。现在改成：

- 一张主说明卡
- 一条紧凑 inline note
- 一组轻量模块状态 pill

这样保留了“当前已接通哪些模块”的导航信息，但把空间还给真正的表单工作区。

### 4. 用测试把折叠行为锁住

更新：

- [resume-draft-editor-panel.spec.tsx](/Users/fri/Desktop/personal/my-resume/apps/admin/components/__tests__/resume-draft-editor-panel.spec.tsx)

新增了模块折叠 / 展开的测试。

这里还有一个值得记下来的细节：HeroUI 的 `Disclosure` 关闭后不会直接卸载内容节点，而是通过状态和样式控制展开。因此测试最终改成校验：

- `aria-expanded="true"`
- `aria-expanded="false"`

而不是假设 DOM 会被移除。这个调整也更贴近真实组件行为。

## Review 记录

### 是否符合当前 issue 目标

符合。

这轮只收页面结构密度和模块折叠，没有提前进入双语编辑模式重构，也没有动公开页亮点区。

### 是否有值得继续抽离的空间

有，下一轮会更明显：

- 当前中文 / 英文输入仍然共存于同一套模块内
- 折叠之后，模块边界清晰了，但字段维护负担还没有真正下降

所以这轮先解决“结构密度”，下一轮再解决“编辑模式”，顺序是合理的。

## 自测结果

已执行：

- `pnpm --filter @my-resume/admin test`
- `pnpm --filter @my-resume/admin typecheck`

结果：

- 单元测试通过
- 类型检查通过

## 后续可沉淀为教程的点

- 为什么长表单应该先收成模块工作区，再讨论字段体验
- 为什么折叠测试不能假设组件会直接卸载 DOM
- 为什么“结构密度优化”和“交互模式重构”最好拆成两张 issue，而不是一次混做
