OPC/goauto
2
0
Fork 0
Code Issues 193 Pull Requests Actions Packages Projects Releases Wiki Activity

T49 优化 SYB 商品列表工具栏与列宽 #51

New Issue
Closed
opened 2026-08-20 15:37:11 +08:00 by ila · 2 comments
ila commented 2026-08-20 15:37:11 +08:00
Owner
Copy Link
Copy Source

基本信息

  • 类型：Admin UI 小范围布局优化
  • 交付单元：web
  • 前置：#41 SYB 商品页面已实施
  • 是否可并行：否；直接修改现有 SYB 商品列表
  • 提出时间：2026-08-20

原始需求摘要

在现有 SYB 商品页上压缩表格次要列，把空间集中给“虾皮商品”；移除“店铺管理”按钮，在原位置展示当前选择数量；把批量“重新解析”移到查询“重置”按钮同行右侧，并删除原批量工具栏行。

方案与设计证据

这是现有页面的小范围布局调整，明确复用当前 Element Plus 表格、筛选栏、按钮、禁用态和颜色规范，不新增页面、流程、状态、权限或 API，不需要 QuantUX。

列宽映射：

列 当前 调整后
货运单号 150 120（80%）
颜色 / 尺码 160 128（80%）
数量 70 56（80%）
虾皮关联 100 80（80%）
解析状态 160 80（50%）
操作 90 45（50%）
虾皮商品 200 421（接收约 221px 释放空间）

工具栏映射：

  • 删除“店铺管理”按钮；原位置显示“已选择 X 条”，保留 aria-live=polite。
  • “重新解析”移到“重置”按钮右侧，仍在未选择时禁用。
  • 删除原来的整行批量工具栏以及其中的 #44 说明文案。
  • 不改变导入、同步记录、查询、重置、选择、重新解析和详情行为。

验收标准

  • “重新解析”与“重置”同行且位于其右侧，原批量工具栏行消失。
  • “店铺管理”按钮消失，原位置显示实时“已选择 X 条”。
  • 指定列按上述宽度收窄，释放空间进入“虾皮商品”列。
  • 未选择时“重新解析”禁用；选择后可用且原批量重新解析流程不变。
  • 页面 lint、生产构建和浏览器布局/交互验证通过。

风险与文档影响

仅布局和入口位置变化，无数据库、API、权限和业务规则变化；长期 Wiki 无需更新。桌面窄窗口可能出现横向表格滚动，沿用现有 Element Plus 表格行为。

## 基本信息 - 类型：Admin UI 小范围布局优化 - 交付单元：web - 前置：#41 SYB 商品页面已实施 - 是否可并行：否；直接修改现有 SYB 商品列表 - 提出时间：2026-08-20 ## 原始需求摘要 在现有 SYB 商品页上压缩表格次要列，把空间集中给“虾皮商品”；移除“店铺管理”按钮，在原位置展示当前选择数量；把批量“重新解析”移到查询“重置”按钮同行右侧，并删除原批量工具栏行。 ## 方案与设计证据 这是现有页面的小范围布局调整，明确复用当前 Element Plus 表格、筛选栏、按钮、禁用态和颜色规范，不新增页面、流程、状态、权限或 API，不需要 QuantUX。 列宽映射： | 列 | 当前 | 调整后 | |---|---:|---:| | 货运单号 | 150 | 120（80%） | | 颜色 / 尺码 | 160 | 128（80%） | | 数量 | 70 | 56（80%） | | 虾皮关联 | 100 | 80（80%） | | 解析状态 | 160 | 80（50%） | | 操作 | 90 | 45（50%） | | 虾皮商品 | 200 | 421（接收约 221px 释放空间） | 工具栏映射： - 删除“店铺管理”按钮；原位置显示“已选择 X 条”，保留 `aria-live=polite`。 - “重新解析”移到“重置”按钮右侧，仍在未选择时禁用。 - 删除原来的整行批量工具栏以及其中的 #44 说明文案。 - 不改变导入、同步记录、查询、重置、选择、重新解析和详情行为。 ## 验收标准 - [ ] “重新解析”与“重置”同行且位于其右侧，原批量工具栏行消失。 - [ ] “店铺管理”按钮消失，原位置显示实时“已选择 X 条”。 - [ ] 指定列按上述宽度收窄，释放空间进入“虾皮商品”列。 - [ ] 未选择时“重新解析”禁用；选择后可用且原批量重新解析流程不变。 - [ ] 页面 lint、生产构建和浏览器布局/交互验证通过。 ## 风险与文档影响 仅布局和入口位置变化，无数据库、API、权限和业务规则变化；长期 Wiki 无需更新。桌面窄窗口可能出现横向表格滚动，沿用现有 Element Plus 表格行为。
ila commented 2026-08-20 15:42:41 +08:00
Author
Owner
Copy Link
Copy Source

实施结果（待验收）

  • 移除页面工具栏中的“店铺管理”，原位置显示“已选择 X 条”。
  • 将“重新解析”移至“重置”右侧，未选择商品时禁用。
  • 按确认比例压缩货运单号、目标颜色/尺码、数量、虾皮关联、解析状态和操作列，并将释放宽度分配给虾皮商品列。
  • 新增 Playwright 布局回归测试，覆盖按钮位置、选择计数、按钮启用状态及列宽。

验证

  • pnpm run build:prod：通过（仅有仓库既有构建警告）。
  • pnpm run lint：通过，0 errors；30 warnings 均为仓库既有警告。
  • npx playwright test tests/e2e/syb-product-layout.spec.ts --reporter=line：1/1 通过。
  • git diff --check：通过。

提交：d392ed54c4735816add83f82accdb2559e4d9db8

文档影响：无业务规则、API 或数据结构变化，无需更新 Wiki。

当前状态：待用户验收，工单保持开启。

## 实施结果（待验收） - 移除页面工具栏中的“店铺管理”，原位置显示“已选择 X 条”。 - 将“重新解析”移至“重置”右侧，未选择商品时禁用。 - 按确认比例压缩货运单号、目标颜色/尺码、数量、虾皮关联、解析状态和操作列，并将释放宽度分配给虾皮商品列。 - 新增 Playwright 布局回归测试，覆盖按钮位置、选择计数、按钮启用状态及列宽。 ## 验证 - `pnpm run build:prod`：通过（仅有仓库既有构建警告）。 - `pnpm run lint`：通过，0 errors；30 warnings 均为仓库既有警告。 - `npx playwright test tests/e2e/syb-product-layout.spec.ts --reporter=line`：1/1 通过。 - `git diff --check`：通过。 提交：`d392ed54c4735816add83f82accdb2559e4d9db8` 文档影响：无业务规则、API 或数据结构变化，无需更新 Wiki。 当前状态：待用户验收，工单保持开启。
ila commented 2026-08-20 16:34:19 +08:00
Author
Owner
Copy Link
Copy Source

??? 2026-08-20 ???????????:Task-51-SYB-list-layout;Wiki revision:a627417c412e44fbc6b0816f15395e131760522f??????

??? 2026-08-20 ???????????:Task-51-SYB-list-layout;Wiki revision:a627417c412e44fbc6b0816f15395e131760522f??????
ila closed this issue 2026-08-20 16:34:20 +08:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
No items
No labels
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
admin ila
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: OPC/goauto#51