From 3e0f3241a4428a213bffa5f47538e77647ba3744 Mon Sep 17 00:00:00 2001 From: chengma Date: Mon, 10 Aug 2026 16:35:54 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E5=BD=92=E6=A1=A3=E4=BB=BB=E5=8A=A1=20?= =?UTF-8?q?#105?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../105-admin顺运宝标题图片交互与原图预览.md | 50 +++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 docs/task/105-admin顺运宝标题图片交互与原图预览.md diff --git a/docs/task/105-admin顺运宝标题图片交互与原图预览.md b/docs/task/105-admin顺运宝标题图片交互与原图预览.md new file mode 100644 index 0000000..208ae4f --- /dev/null +++ b/docs/task/105-admin顺运宝标题图片交互与原图预览.md @@ -0,0 +1,50 @@ +# 105 Admin：区分顺运宝标题与图片交互并增加原图预览 + +- 类型：需求 +- 父级大工单：#14 +- 所属 MVP / 版本：#15 Admin 四模块可用闭环 +- 状态：已完成，待用户验收 +- 日期：2026-08-10 +- Gitea 工单：http://ilaer.eicp.net:8418/chengma/cmautobuy/issues/105 + +## 背景与目标 + +顺运宝列表原来把处理详情绑定在整行双击上，标题、图片和其他单元格没有明确区别。 +本任务让采购员通过商品标题进入处理详情，通过缩略图查看顺运宝原图，并避免其他单元格误触详情。 + +## 最终方案 + +- 移除顺运宝行上的整行详情触发属性，其他模块的公共行双击行为不变。 +- 商品标题改为可聚焦按钮，鼠标单击、双击以及键盘 Enter / Space 都能打开原有服务端渲染详情弹窗。 +- 缩略图改为带明确标签的按钮；单击或双击打开独立原图弹窗，不再触发处理详情。 +- 原图继续使用顺运宝 URL，不代理、不下载、不缓存、不写入数据库；弹窗提供加载状态、失败提示和新窗口打开入口。 +- 复用公共弹窗的关闭、Esc、遮罩和焦点恢复机制。 + +## 改了哪些 + +- `admin/templates/syb/list.html`：拆分标题、图片与其他单元格交互，增加原图弹窗。 +- `admin/static/js/app.js`：增加原图加载及错误反馈，并防止同一详情因双击重复请求。 +- `admin/static/css/app.css`：增加可见焦点、缩略图按钮和可视区自适应原图样式。 +- `admin/syb_interaction_template_test.go`：验证语义化入口、原图属性和整行入口移除。 +- `docs/admin/05-ui-specification.md`：更新顺运宝列表和处理弹窗交互基线。 + +## 验收结果 + +| 验收标准 | 结果 | +|---|---| +| 标题可用鼠标及键盘打开处理详情 | 通过（模板与事件绑定检查） | +| 图片打开原图弹窗且不打开处理详情 | 通过（模板测试与事件绑定检查） | +| 原图按可视区缩放，并有加载失败与新窗口入口 | 通过 | +| 其他普通单元格不触发顺运宝详情 | 通过 | +| 图片具有替代文本、可见焦点且关闭后恢复焦点 | 通过 | +| 不代理、缓存或落库图片，不改接口 | 通过 | + +## 测试 + +- 执行的命令：`GOTOOLCHAIN=go1.23.0 go vet ./...`、`go build ./...`、`go test ./... -count=1`、`node --check static/js/app.js`、`git diff --check`。 +- 结果：全部通过。 +- **没验证到的部分**：未使用生产顺运宝账号在浏览器加载真实远程原图；需要用户在部署环境手工确认远程图片可访问及 1366×768 下的视觉效果。 + +## 相关提交 + +- `fb2e4c4` feat: 区分顺运宝标题与图片交互 (#105)