# 214 Admin：优化蝦皮标题宽度并显示 PDD 商品 ID

- 类型：需求
- 父级大工单：#14
- 所属 MVP / 版本：#15 / MVP 后续
- 状态：已完成，待用户验收
- 日期：2026-08-13
- Gitea 工单：http://ilaer.eicp.net:8418/chengma/cmautobuy/issues/214

## 背景与目标

蝦皮列表的商品名称列偏宽，PDD 关联列又直接显示完整 URL，挤压了颜色、尺码、SKU、
待补和采集状态等更常用的信息。本任务收紧标题列，并让列表正文只显示 PDD 商品 ID。

## 最终方案

商品名称列改为固定 120px，继续使用省略号和 `title` 展示完整标题。PDD 列正文显示
`pdd_goods_id`，完整 URL 仅放在悬停提示；未关联商品继续显示红色“未填写”。商品详情
中的完整 PDD 链接编辑入口保持不变。该实现与建单方案一致，未修改数据库和关联逻辑。

## 改了哪些

- `admin/service/shopee_list.go`：列表视图分别提供 PDD 商品 ID 和完整 URL。
- `admin/templates/shopee/list.html`：列名和单元格正文改为 PDD 商品 ID。
- `admin/static/css/app.css`：标题列改为稳定的 120px。
- `admin/service/shopee_list_test.go`、`admin/main_test.go`：覆盖已关联、未关联和列宽规则。
- `docs/admin/05-ui-specification.md`：同步列表展示规范。

## 验收结果

| 验收标准 | 结果 |
|---|---|
| 商品名称列收窄，长标题仍可悬停查看 | 通过（静态规则与模板测试） |
| 已关联商品正文只显示 PDD 商品 ID | 通过 |
| 未关联商品显示“未填写” | 通过 |
| 详情仍可编辑完整 PDD 链接 | 通过（原入口未改并通过模板回归） |
| Go 1.23 build、test、vet 全部通过 | 通过 |

## 测试

- 执行的命令：`$env:GOTOOLCHAIN="go1.23.0"; go build ./...; go test ./... -count=1; go vet ./...`
- 结果：全部通过。
- **没验证到的部分**：未在 1366×768 的真实浏览器中人工检查列宽视觉效果。

## 相关提交

- `5b7d922` style: 优化蝦皮列表关键信息展示 (#214)