Add traceability column to admin.html's video table (T10)

Fetches characters/garments/dance-refs alongside the library on load and joins each clip's characterId/garmentId/refDanceVideoId back to their names, so an operator can see "谁的脸 + 谁的衣服 + 哪条参考视频" per row (M.7). No composedImageId column — the one-step pipeline never produces an intermediate composed image. Extends the dressup-generate.test.js happy-path test to confirm the join resolves real names, not just matching ids. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

Add traceability column to admin.html's video table (T10)
Fetches characters/garments/dance-refs alongside the library on load and joins each clip's characterId/garmentId/refDanceVideoId back to their names, so an operator can see "谁的脸 + 谁的衣服 + 哪条参考视频" per row (M.7). No composedImageId column — the one-step pipeline never produces an intermediate composed image. Extends the dressup-generate.test.js happy-path test to confirm the join resolves real names, not just matching ids. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
yibo
1 parent 4d437a4c
Showing 2 changed files with 44 additions and 2 deletions
admin.html
dressup-generate.test.js
@@ -70,6 +70,7 @@
           <th data-sort="promptEn">名称(英)</th>
           <th data-sort="fullPrompt">Prompt</th>
           <th>视频地址</th>
+          <th>溯源（人物×衣服×参考视频）</th>
           <th data-sort="duration">时长</th>
           <th data-sort="likes">点赞</th>
           <th data-sort="source">来源</th>
@@ -96,6 +97,9 @@ window.fetch = async (...args) =&gt; {
 };
 let library = [];
+let characters = [];
+let garments = [];
+let danceRefs = [];
 let editingId = null;
 let sortKey = "createdAt";
 let sortDir = -1;
@@ -107,11 +111,34 @@ function escapeHtml(s) {
 }
 async function loadLibrary() {
-  const res = await fetch("/api/library?sort=newest");
-  library = await res.json();
+  const [libRes, charRes, garmentRes, danceRefRes] = await Promise.all([
+    fetch("/api/library?sort=newest"),
+    fetch("/api/admin/characters"),
+    fetch("/api/admin/garments"),
+    fetch("/api/admin/dance-refs"),
+  ]);
+  library = await libRes.json();
+  characters = await charRes.json();
+  garments = await garmentRes.json();
+  danceRefs = await danceRefRes.json();
   render();
 }
+function nameOf(list, id) {
+  if (!id) return null;
+  const item = list.find((x) => x.id === id);
+  return item ? item.name : id;
+}
+
+// T10: 一步法下没有 composedImageId/合成图，溯源只有这三个字段（M.7）。
+function traceability(c) {
+  const characterName = nameOf(characters, c.characterId);
+  const garmentName = nameOf(garments, c.garmentId);
+  const danceRefName = nameOf(danceRefs, c.refDanceVideoId);
+  if (!characterName && !garmentName && !danceRefName) return "-";
+  return [characterName, garmentName, danceRefName].map((n) => n || "?").join(" × ");
+}
+
 function filteredSorted() {
   const q = document.getElementById("searchInput").value.trim().toLowerCase();
   const source = document.getElementById("sourceFilter").value;
@@ -148,6 +175,7 @@ function render() {
           <td class="name"><input data-field="promptEn" value="${escapeHtml(c.promptEn || "")}" /></td>
           <td class="prompt"><textarea data-field="fullPrompt">${escapeHtml(c.fullPrompt || "")}</textarea></td>
           <td><input data-field="videoUrl" value="${escapeHtml(c.videoUrl || "")}" placeholder="留空=保持原有播放源" /></td>
+          <td>${escapeHtml(traceability(c))}</td>
           <td>${c.duration ?? "-"}s</td>
           <td>${c.likes || 0}</td>
           <td>${c.source}</td>
@@ -165,6 +193,7 @@ function render() {
           <td class="name">${escapeHtml(c.promptEn || "")}</td>
           <td class="prompt" title="${escapeHtml(c.fullPrompt || "")}">${escapeHtml((c.fullPrompt || "").slice(0, 80))}${(c.fullPrompt || "").length > 80 ? "…" : ""}</td>
           <td><a class="video-link" href="${videoHref(c)}" target="_blank">${videoHref(c)}</a></td>
+          <td>${escapeHtml(traceability(c))}</td>
           <td>${c.duration ?? "-"}s</td>
           <td>${c.likes || 0}</td>
           <td>${c.source}</td>
@@ -188,6 +188,19 @@ test(&quot;generate: full happy path lands a clip with character/garment/dance-ref tr
   assert.equal(clip.refDanceVideoId, danceRef.id);
   assert.equal(clip.channel, "dance");
+  // T10's admin.html traceability column joins clip.characterId/garmentId/
+  // refDanceVideoId back against the three admin lists to show "谁的脸 +
+  // 谁的衣服 + 哪条参考视频" — confirm that join actually resolves to the
+  // real names, not just matching ids.
+  const [charList, garmentList, danceRefList] = await Promise.all([
+    fetch(`${BASE}/api/admin/characters`, authed()).then((r) => r.json()),
+    fetch(`${BASE}/api/admin/garments`, authed()).then((r) => r.json()),
+    fetch(`${BASE}/api/admin/dance-refs`, authed()).then((r) => r.json()),
+  ]);
+  assert.equal(charList.find((x) => x.id === clip.characterId).name, "小美");
+  assert.equal(garmentList.find((x) => x.id === clip.garmentId).name, "红旗袍");
+  assert.equal(danceRefList.find((x) => x.id === clip.refDanceVideoId).name, "拉丁舞");
+
   // Re-submitting the same character x garment combo should hit the M.7
   // dedupe cache instead of generating again.
   const repeatRes = await fetch(