132 lines
10 KiB
Markdown
132 lines
10 KiB
Markdown
---
|
||
id: T-607
|
||
title: AI工场图片网格与生成设置布局优化
|
||
phase: 7
|
||
deps: [T-606]
|
||
status: DONE
|
||
created: 2026-07-11
|
||
---
|
||
|
||
## 问题 / 背景
|
||
|
||
T-605 已为 AI工场补了缩略图图标和状态，但「蝦皮原主图」「照片池」仍以 `QTableWidget` 的字段表格呈现。运营用户在九张原图、候选图和生成任务之间需要读列文本，不能快速看图、选图、拖图。
|
||
|
||
现有“拉取蝦皮主图”只通过 CDP 读取并保存远程 URL；原图尚未下载时 GUI 只能显示占位图。若要做到“拉取后能看到缩小图”，不能为此把九张完整原图都同步保存到本地，也不能在主线程逐张拉取而卡住界面。
|
||
|
||
另外，当前照片池表会同时列出所有尚未下载的原图，造成原图区和照片池重复；这和“单击原图后下载并加入照片池”的用户理解不一致。
|
||
|
||
本任务目标：**把原主图和照片池改成稳定、可扫读的缩略图网格；拉图后异步展示真实缩略图；只有已下载可用的原图才进入照片池，同时保留现有选源图、预览、拖入终选、任务续查等行为。**
|
||
|
||
## 方案
|
||
|
||
### 1. 统一缩略图卡片网格
|
||
|
||
修改 `app/gui/tabs/image_studio.py`，必要时在同文件或专属 GUI 辅助模块中新增可复用的缩略图网格组件：
|
||
|
||
- 原图区和照片池使用同一套图片卡片视觉语言，不再展示“序号/状态/远程地址/本地文件”等表格列。
|
||
- 卡片尺寸固定并设置 `gridSize`/最小尺寸，缩略图加载中、失败和空状态都不改变布局。
|
||
- 原图区按 `source_order` 展示最多 9 张蝦皮原主图；以紧凑响应式网格排布，1280×820 常用窗口下九张图无需横向遮挡，可自然换为两至三行。
|
||
- 照片池使用可滚动网格：已下载原图、已下载生成主图/详情图展示实际缩略图；未完成生成任务展示固定任务卡片。
|
||
- 照片池卡片保留必要的视觉信息：原图/主图/详情图角标、比例、当前源图高亮、排队中/已提交/生成中/失败/已停止状态。详细远程地址和本地路径仅放 tooltip，不作为主界面字段。
|
||
|
||
### 2. 拉图后异步加载真实缩略图
|
||
|
||
- 保持当前 CDP 流程不变：先由既有 worker 读取蝦皮商品页中的主图 URL，写入项目原图快照。
|
||
- 在 URL 已取得后，以后台 worker/受限并发下载缩略图数据用于 GUI 展示；每次只处理有限数量，避免九个请求同时占满网络、阻塞生成或卡住主线程。
|
||
- 缩略图仅作为本次 GUI 会话缓存；不得因为预览九张图而把完整原图落入项目目录、不得修改“单击原图才下载原图并加入照片池”的落盘语义。
|
||
- 缩略图下载失败时保留固定失败占位和中文 tooltip/重试入口；单张缩略图失败不得让整次 CDP 拉图失败，也不得影响其他原图的点击下载能力。
|
||
- 不在日志中暴露完整图片 URL、Cookie 或其他敏感请求信息。
|
||
|
||
### 3. 收敛照片池业务展示语义
|
||
|
||
- 原图区单击：沿用既有原图下载和入池流程；下载完成后该原图才出现在照片池，并可被选为生成源图。
|
||
- 原图区双击：沿用下载完成后打开大图预览的行为；未下载时先走既有下载 worker。
|
||
- 照片池只展示可用本地资产（已下载原图、已生成图片）和与当前项目有关的未完成/失败任务卡片；不再把九张仅有远程 URL 的原图重复列入照片池。
|
||
- 照片池单击选源图、双击大图预览、右键移除、拖进主图/详情图终选槽的交互必须保留。右键移除仍只移除 AI工场资产记录，不物理删除本地图片文件。
|
||
- 生成完成、继续查询、原图下载完成、项目切换和软删除后的刷新，都必须刷新两类网格及当前源图状态，避免显示旧项目的缩略图。
|
||
|
||
### 4. 性能与可用性约束
|
||
|
||
- 图片解码、网络读取、缓存整理全部在后台完成；主线程只接收结果并更新界面。
|
||
- 不启动/切换 Chrome 来加载缩略图；不改变 `open_product(..., bring_to_front=False)`、CDP 选择器或登录判断。
|
||
- 预览缓存按当前 tab 生命周期或当前项目管理，项目切换/关闭时释放不再引用的 `QPixmap`，避免长时间使用导致内存无界增长。
|
||
- 禁止使用嵌套卡片制造视觉层级；原图区/照片池是面板，单张图片才是卡片。
|
||
|
||
### 5. 收紧生成设置布局
|
||
|
||
- 去掉源图预览框右侧的说明文字；未选择源图时由预览框空状态和 tooltip 表达，避免右栏出现重复说明。
|
||
- 源图预览框右侧第一行放「提示词模板」标签和模板下拉框；第二行把「新建」「重命名」「保存」「删除」四个按钮等宽并排。
|
||
- 释放出的垂直空间分配给完整提示词输入框；提示词说明保留在输入框下方。
|
||
- 「类型」「数量」「比例」改为提示词输入框下方的同一行紧凑控件组，保留现有下拉/数字输入语义和生成按钮动态文案。
|
||
|
||
## 验收要点
|
||
|
||
- 拉取有效商品后，原图区按原图顺序展示最多 9 张真实缩略图；缩略图加载不冻结 GUI。
|
||
- 原图区九张图在 1280×820 下不会横向互相遮挡或挤出区域；较窄窗口可稳定换行或滚动。
|
||
- 单张缩略图下载失败只显示该卡片的中文失败状态，不让整次拉图失败，也不显示裸露英文技术错误。
|
||
- 原图区单击后，原图下载并进入照片池；未下载的原图不会与原图区重复显示在照片池。
|
||
- 照片池以同一套缩略图卡片展示已下载原图、已生成图片和任务状态；源图、类型、比例、失败/生成中状态可一眼区分。
|
||
- 照片池的选源图、双击预览、右键移除、拖入终选、终选排序、生成、停止、继续查询和导出均不回归。
|
||
- 项目切换、删除后切换到其他项目、后台任务完成后，不显示旧项目缩略图或错误的源图高亮。
|
||
- 不改 CDP 拉图/Chrome/登录流程，不因缩略图预览批量保存九张完整原图，不暴露远程 URL 或敏感信息到用户日志。
|
||
- 生成设置区不再出现源图右侧说明文字；模板选择与四个模板操作按钮按两行排列，提示词输入框面积增大，类型/数量/比例在同一行。
|
||
|
||
## 测试要求
|
||
|
||
更新或新增：
|
||
|
||
- `tests/test_gui.py`
|
||
- 覆盖原图区和照片池使用缩略图网格、固定卡片尺寸、中文空状态/失败状态。
|
||
- 覆盖九张原图按 `source_order` 进入原图区，未下载原图不进入照片池。
|
||
- 覆盖下载完成后原图进入照片池、可选源图，并保留既有拖入终选和预览行为。
|
||
- 覆盖项目切换/删除后的缩略图和源图状态清理。
|
||
- `tests/test_image_studio_images.py` 或对应现有图片测试
|
||
- mock 远程图片响应，覆盖缩略图异步加载成功、单张失败隔离、缓存不落盘完整原图。
|
||
|
||
验证命令：
|
||
|
||
```bash
|
||
python -m ruff check app tests main.py
|
||
py -3.10 -m compileall app main.py
|
||
py -3.10 -m unittest discover -s tests
|
||
git diff --check
|
||
```
|
||
|
||
人工验收建议：
|
||
|
||
- 在登录账号下拉取一个有 9 张主图的商品，确认九张真实缩略图可见、Chrome 不抢前台、单击一张后才进入照片池。
|
||
- 生成主图和详情图各一张，确认照片池卡片能区分原图/主图/详情图和源图状态，并能拖入终选后导出。
|
||
|
||
## 边界（不改什么）
|
||
|
||
- 不改 `image_studio_projects`、assets、jobs、selections 的 DB schema。
|
||
- 不改变原图完整文件的落盘目录、导出目录和图片格式转换规则。
|
||
- 不改 `app/editor.py`、CDP 选择器、商品页打开/关闭、Chrome 启动或登录检测逻辑。
|
||
- 不改 cmhub 提交、轮询、下载、计费、重试或 BYOK 逻辑。
|
||
- 不新增本地图片导入、图片编辑算法或自动上传蝦皮。
|
||
- 不改①至⑤模块。
|
||
|
||
## 执行记录
|
||
|
||
- 2026-07-11：已完成。
|
||
- 代码：
|
||
- `app/gui/tabs/image_studio.py`：原图区和照片池由字段表格改为固定尺寸的 `QListWidget` 图片网格。原图区按 `source_order` 展示主图；照片池只展示已落盘可用的原图/生成图和未完成或失败任务卡片，不再重复显示只有远程 URL 的原图。
|
||
- `app/gui/tabs/image_studio.py`：接入既有 `image_studio_images.ThumbnailLoader`。远程缩略图使用受限后台线程池和内存缓存，结果通过 Qt signal 回到 GUI 线程；不保存完整原图、不在日志中输出远程 URL。单张失败只显示中文卡片状态，并可右键「重新加载缩略图」。
|
||
- `app/gui/tabs/image_studio.py`：项目切换、软删除和窗口关闭会取消不再需要的缩略图回调并释放 GUI 缓存；原图区点击下载、照片池选源图/预览/右键移除/拖入终选、任务续查均保留。
|
||
- `app/gui/tabs/image_studio.py`：生成设置去掉源图右侧说明文字；模板标签与下拉在源图右侧第一行，四个模板操作按钮同列第二行；提示词输入框扩展，类型/数量/比例调整为其下方同一行。
|
||
- 测试：
|
||
- `tests/test_gui.py`：更新 AI工场构建测试，覆盖网格替换、缩略图仅内存预览、原图落盘后才进入照片池、单张缩略图失败重试、9 张原图顺序、固定网格尺寸、模板按钮同排和三项生成参数同排。
|
||
- `tests/test_gui.py`：更新已提交 cmhub 任务卡片断言，确认照片池保留可继续查询的任务状态和扣点信息。
|
||
- `tests/test_image_studio_images.py`：既有缩略图下载、内存缓存、取消和不落盘原图测试继续通过。
|
||
- 验证：
|
||
- 主工作区定向验证通过：
|
||
- `py -3.10 -m unittest tests.test_gui.GuiTests.test_image_studio_tab_builds_project_pool_and_template_controls tests.test_gui.GuiTests.test_image_studio_thumbnail_grids_keep_order_and_hide_remote_pool_duplicates tests.test_gui.GuiTests.test_image_studio_tab_shows_resume_and_job_billing_status tests.test_gui.GuiTests.test_image_studio_final_selection_order_and_guards tests.test_image_studio_images`
|
||
- `python -m ruff check app tests main.py`
|
||
- `py -3.10 -m compileall app main.py`
|
||
- `git diff --check -- app/gui/tabs/image_studio.py tests/test_gui.py docs/tasks/T-607.md`
|
||
- 主工作区存在未提交默认提示词文件改动；为隔离无关改动，在临时干净 worktree `D:\chengma\cmshopee-t607-verify` 应用本任务 diff 后通过：
|
||
- `python -m ruff check app tests main.py`
|
||
- `py -3.10 -m compileall app main.py`
|
||
- `py -3.10 -m unittest discover -s tests`（381 tests）
|
||
- `git diff --check`
|