cmautobuy/docs/task/216-顺运宝列表筛选与滚动.md

216 Admin：压缩顺运宝列表并优化筛选与滚动

• 类型：需求
• 父级大工单：#14
• 所属 MVP / 版本：#15 / Admin MVP 后续优化
• 状态：已完成，待用户验收
• 日期：2026-08-13
• Gitea 工单：#216

背景与目标

顺运宝列表列数较多，货运单明细 ID 占用可见空间，店铺和规格列偏宽；长列表滚动时 横向滚动条不容易到达。工具条还存在重复的店铺管理入口、偏宽筛选框和过时操作名称。 本次在不修改数据库及接口的前提下压缩列表，补充清除筛选入口，并改善长表滚动。

最终方案

• 列表不再单独显示货运单明细 ID，但复选框、详情入口、采购入口和服务端提交继续使用 syb_id，详情及任务来源信息仍可查看该值。
• 店铺列固定约 224px，规格列固定约 140px，超长内容继续省略并通过 title 查看。
• 顺运宝店铺和订单号搜索框使用页面专用的 140px 宽度，避免影响其他模块。
• 在“搜索”左侧增加“清除”，清空处理阶段、店铺、订单号及页码，同时保留当前同步 日期范围。
• 顺运宝表格改成有最大高度的纵横滚动区，固定表头，使横向滚动条位于滚动区底部； 760px 以下窄窗口回到自然页面高度。
• 去掉工具条内重复的“店铺管理”按钮，管理员仍通过主导航进入店铺管理模块。
• “创建 PDD 采集任务”统一改为“创建采集任务”，并删除列表底部的冗余提示语。

实际实现与建单方案一致。

改了哪些

• admin/templates/syb/list.html：调整工具条、搜索清除、列展示、操作名称和滚动区类名。
• admin/static/css/app.css：增加顺运宝专用筛选框、列宽、固定表头和滚动区样式。
• admin/syb_interaction_template_test.go：验证新文案、清除入口、列结构及内部 ID 仍保留。
• admin/main_test.go：验证顺运宝专用样式和主导航店铺入口没有被误删。
• docs/admin/01-requirements.md：同步顺运宝工具条、可见列及滚动要求。
• docs/admin/05-ui-specification.md：记录最终界面布局、尺寸和清除行为。

验收结果

验收标准	结果
列表不显示货运单 ID，内部选择和详情仍携带 syb_id	通过
店铺列约 224px、规格列约 140px，长内容可悬停查看	通过
工具条不再重复显示店铺管理，主导航入口保留	通过
创建按钮和弹窗标题显示“创建采集任务”	通过
两个搜索框约 140px，清除筛选时保留同步日期	通过
长列表使用固定表头的纵横滚动区	通过
冗余提示语已删除，空状态列数与新表格一致	通过
Admin Go 1.23 构建、测试和静态检查通过	通过

测试

• 执行的命令：$env:GOTOOLCHAIN="go1.23.0"; go build ./...; go test ./... -count=1; go vet ./...
• 结果：全部通过。
• 没验证到的部分：未在实际浏览器中以 1366×768 和窄窗口人工检查视觉效果；模板、 样式和交互契约已由自动化测试覆盖。

相关提交

• 40f6220 优化顺运宝列表筛选与滚动