# AIGC Upgrade Image Implementation Plan

> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.

**Goal:** Show the already generated source image in the `useTemplate` upgrade flow while preserving the selected template copy.

**Architecture:** Keep `upgradeTaskId` as the navigation contract. In `useTemplate.vue`, load the source generator task detail only for upgrade flows, then overlay its `imageResultUrl` onto the selected template as `templateContentUrl`. `TemplateVersionHero` remains unchanged because it already renders `templateContentUrl`.

**Tech Stack:** Vue 3 `<script setup>`, uni-app lifecycle/API wrappers, Node.js built-in test runner.

---

### Task 1: Add a failing regression assertion

**Files:**
- Modify: `tests/aigc-detail-continuation.test.cjs`

- [ ] **Step 1: Add the upgrade-source-image test**

Append a test that reads `src/pages-aigc/useTemplate/useTemplate.vue` and asserts that the page imports `getAigcGeneratorTaskDetail`, calls it with `{ taskId: upgradeTaskId.value }`, and assigns `imageResultUrl` to `templateContentUrl` inside the `currentTemplate` computed value.

- [ ] **Step 2: Run the focused test and verify RED**

Run:

```powershell
node --test tests/aigc-detail-continuation.test.cjs
```

Expected: the existing tests pass and the new source-image test fails because `useTemplate.vue` does not yet load the source task detail or overlay `imageResultUrl`.

### Task 2: Load and display the generated source image

**Files:**
- Modify: `src/pages-aigc/useTemplate/useTemplate.vue:46-107,116-184`

- [ ] **Step 1: Add source task state and API import**

Import `getAigcGeneratorTaskDetail` from the existing AIGC API module and add `const upgradeSourceTaskDetail = ref(null);` beside the existing upgrade state.

- [ ] **Step 2: Overlay the source image in `currentTemplate`**

Keep the existing template lookup as the base value. When `isImageToVideoUpgrade.value` is true and `upgradeSourceTaskDetail.value.imageResultUrl` is non-empty, return a shallow copy with `templateContentUrl` set to that URL; otherwise return the base template unchanged.

Use this shape:

```js
const currentTemplate = computed(() => {
  const template =
    templates.value.find((item) => item.templateId === templateId.value) || templates.value[0] || {};
  const imageResultUrl = String(upgradeSourceTaskDetail.value?.imageResultUrl || "").trim();

  if (!isImageToVideoUpgrade.value || !imageResultUrl) return template;
  return { ...template, templateContentUrl: imageResultUrl };
});
```

- [ ] **Step 3: Fetch the source task detail only for upgrade flows**

Add `fetchUpgradeSourceTaskDetail` after `fetchImageToVideoItemDetail`. Return immediately for non-upgrade flows. For an upgrade, call `getAigcGeneratorTaskDetail({ taskId: upgradeTaskId.value })`; on a valid object response assign `upgradeSourceTaskDetail.value`, otherwise show `获取原图片失败`. Catch the request error, log a warning, and show the same toast. Call it from `fetchPageData` after `fetchTemplateList` and before the existing item-list request.

- [ ] **Step 4: Run the focused test and verify GREEN**

Run:

```powershell
node --test tests/aigc-detail-continuation.test.cjs
```

Expected: all tests pass with zero failures.

### Task 3: Check the final diff

**Files:**
- Verify: `src/pages-aigc/useTemplate/useTemplate.vue`
- Verify: `tests/aigc-detail-continuation.test.cjs`

- [ ] **Step 1: Run whitespace validation**

Run `git diff --check` and expect exit code 0.

- [ ] **Step 2: Confirm scope**

Run `git status --short` and confirm only the intended source/test changes remain uncommitted; preserve the user’s pre-existing `detail.vue` and `AigcApi.js` work without rewriting it.