docs: 记录 #18 #23 验收通过

#18 归档状态改为验收通过，补上实现与归档的提交哈希，并链到 #23。 #23 新增归档：为什么用 .search-narrow 类而不是改被五个页面共用的 .toolbar input[type="text"]；搜索按钮靠左是收窄的自然结果，没有额外样式。两份都保留了"未验证到的部分"——浏览器实机交互、主题与缩放，用户已实机确认后验收。 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-07 14:19:44 +08:00
parent 96267f4a18
commit bf81bad741
2 changed files with 112 additions and 2 deletions
@@ -3,7 +3,7 @@
 - 类型：需求（界面）
 - 父级大工单：#14
 - 所属 MVP / 版本：#15 / MVP
- 状态：待验收
+- 状态：验收通过
 - 日期：2026-08-07
 - Gitea 工单：http://ilaer.eicp.net:8418/chengma/cmautobuy/issues/18

@@ -176,4 +176,7 @@ go test ./... -count=1    ok  cmautobuy/admin/service  0.945s

 ## 相关提交

- 见 `docs/task/` 同批提交
+- `eb8d357` feat: PDD 商品页面 (#18)
+- `4975c68` docs: 归档任务 #18
+
+后续调整见 [#23](23-admin-pdd-页工具条文案与宽度调整.md)（工具条文案与宽度）。
@@ -0,0 +1,107 @@
+# 23 Admin PDD 商品页工具条文案与宽度调整
+
+- 类型：需求（界面微调）
+- 父级大工单：#14
+- 所属 MVP / 版本：#15 / MVP
+- 关联：#18（本工单调整 #18 交付的页面）
+- 状态：验收通过
+- 日期：2026-08-07
+- Gitea 工单：http://ilaer.eicp.net:8418/chengma/cmautobuy/issues/23
+
+## 背景与目标
+
+PDD 商品页工具条的三处使用体验问题：
+
+1. 「创建」这个按钮名说不清创建什么——同一条工具条上还有「创建采集任务」，
+   两个都以「创建」开头，第一次用的人分不清哪个是加商品、哪个是发起采集。
+2. 「商品 ID/链接」搜索框占满整条剩余空间，太宽。
+3. 「搜索」按钮被那个宽输入框顶到很右边，离输入框很远，视觉上不像一组。
+
+## 最终方案
+
+```text
+改前  [创建] [创建采集任务]  采集状态[全部▾] 商品ID/链接[______________] [搜索]   [删除]
+改后  [添加 PDD 商品] [创建采集任务]  采集状态[全部▾] 商品ID/链接[___] [搜索]     [删除]
+```
+
+### 用新类名，不动全局规则
+
+`admin/static/css/app.css` 里的 `.toolbar input[type="text"] { flex: 1 }`
+被**五个页面共用**（蝦皮 / 顺运宝 / 任务 / 客户端 / PDD 各有一个搜索框）。
+直接改会把另外四页一起改掉，而本工单只要改 PDD 页。
+
+```css
+.toolbar input[type="text"].search-narrow { flex: 0 0 30%; }
+```
+
+多一个类，特异性高于通用规则，`flex` 覆盖生效；
+而 `min-width: 160px` 仍从通用规则继承，1366×768 那种窄屏下不会缩到没法输入。
+
+用 `flex` 而不是 `width`：工具条是 flex 布局，`width` 会被 `flex-grow` 盖掉，
+看不出效果。
+
+### 搜索按钮靠左是收窄的自然结果
+
+没有额外加对齐样式。搜索表单是 `.inline.grow`（`flex: 1`），
+输入框从 `flex: 1` 改成 `flex: 0 0 30%` 之后，表单里就没有会伸展的元素了，
+多余空间留在按钮之后，按钮自然贴着输入框。
+
+表单上的 `grow` 类**保留**——它负责把「删除」按钮顶到工具条最右侧，
+去掉的话删除按钮会跑到搜索按钮旁边。
+
+## 与建单方案的差异
+
+无。按工单实施。
+
+## 改了哪些
+
+- `admin/templates/pdd/list.html`：按钮文案改为「添加 PDD 商品」；
+  搜索框加 `search-narrow` 类。两处都加了注释说明为什么。
+- `admin/static/css/app.css`：新增一条 `.search-narrow` 规则，
+  放在通用规则之前，注释写明不要去改通用规则。
+- `docs/admin/05-ui-specification.md`：§5.1 工具条示意图与文案同步；
+  新增两条 `[必须]`——文案不能简写成「创建」、不要改通用规则。
+
+## 验收结果
+
+| 验收标准 | 结果 |
+|---|---|
+| 按钮显示「添加 PDD 商品」，点击仍打开创建弹窗 | 通过 |
+| 旧文案 `>创建<` 无残留 | 通过（0 处） |
+| 搜索框带 `search-narrow` 类 | 通过 |
+| 「搜索」按钮紧挨输入框 | 通过 |
+| 「删除」按钮仍在最右侧（`grow` 保留） | 通过 |
+| **另外四个页面搜索框宽度不变** | 通过（四页均不含 `search-narrow`） |
+| **全局规则 `.toolbar input[type="text"]` 未被修改** | 通过（仍是 `flex: 1; min-width: 160px`） |
+| 搜索功能不受影响 | 通过（带关键词能筛出结果） |
+| 五个页面均返回 200 | 通过 |
+| `docs/admin/05` §5.1 已同步 | 通过 |
+| `go vet` / `gofmt` / `go test` 全过 | 通过 |
+
+## 测试
+
+```
+go vet ./...              无输出
+gofmt -l .                无输出
+go test ./... -count=1    ok  repository 0.567s / service 1.180s
+```
+
+服务端渲染逐项核对，四个未受影响的页面逐个查 `search-narrow` 出现次数均为 0。
+
+**未验证到的部分：**
+
+- **没有在真实浏览器里目视确认。** 只验证了服务端产出的 HTML 和 CSS 规则，
+  30% 的实际视觉宽度、按钮间距是否舒服由用户实机确认。
+- 深色 / 浅色主题、1366×768、显示缩放下的表现未实测。
+
+用户已实机确认并验收通过。
+
+## 遗留问题
+
+另外四个页面（蝦皮 / 顺运宝 / 任务 / 客户端）的搜索框仍是撑满的，
+与 PDD 页不一致，而 `docs/admin/05` §2 要求五个页面布局统一。
+是否统一改过来待定，属于后续工单。
+
+## 相关提交
+
+- `96267f4` feat: PDD 商品页工具条文案与宽度调整 (#23)