From 5066a4e5732649c44dea1306f2d18205db28d7b4 Mon Sep 17 00:00:00 2001
From: torin <yuyan@duck.com>
Date: Mon, 20 Apr 2026 17:16:05 +0800
Subject: [PATCH] feat: show voice asset traces in studio

---
 frontend/src/components/GenerationTrace.vue | 16 ++++++++++++++--
 frontend/src/views/VoiceStudio.vue          | 13 +++++++++++++
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/GenerationTrace.vue b/frontend/src/components/GenerationTrace.vue
index a81c297..6b41fde 100644
--- a/frontend/src/components/GenerationTrace.vue
+++ b/frontend/src/components/GenerationTrace.vue
@@ -333,7 +333,13 @@ defineExpose({ refresh })
         >
           <div class="flex items-center justify-between gap-2">
             <span class="text-sm font-semibold">
-              {{ job.output_mode === 'asset_retry' ? '资源重试' : '内容生成' }}
+              {{
+                job.output_mode === 'asset_retry'
+                  ? '资源重试'
+                  : job.output_mode === 'asset_generation'
+                    ? '资源生成'
+                    : '内容生成'
+              }}
             </span>
             <span class="rounded-full border px-2 py-0.5 text-xs" :class="getJobStatusClass(job.status)">
               {{ getJobStatusLabel(job.status) }}
@@ -353,7 +359,13 @@ defineExpose({ refresh })
           <div class="flex flex-wrap items-center justify-between gap-3">
             <div>
               <div class="text-sm font-semibold">
-                {{ activeJob.output_mode === 'asset_retry' ? '资源重试事件' : '生成事件' }}
+                {{
+                  activeJob.output_mode === 'asset_retry'
+                    ? '资源重试事件'
+                    : activeJob.output_mode === 'asset_generation'
+                      ? '资源生成事件'
+                      : '生成事件'
+                }}
               </div>
               <div class="mt-1 text-xs" :class="mutedTextClass">
                 当前步骤：{{ getEventLabel(activeJob.current_step) }}
diff --git a/frontend/src/views/VoiceStudio.vue b/frontend/src/views/VoiceStudio.vue
index 3308481..56972f2 100644
--- a/frontend/src/views/VoiceStudio.vue
+++ b/frontend/src/views/VoiceStudio.vue
@@ -16,6 +16,7 @@ import BaseButton from '../components/ui/BaseButton.vue'
 import BaseCard from '../components/ui/BaseCard.vue'
 import BaseSelect from '../components/ui/BaseSelect.vue'
 import BaseTextarea from '../components/ui/BaseTextarea.vue'
+import GenerationTrace from '../components/GenerationTrace.vue'
 import LoadingSpinner from '../components/ui/LoadingSpinner.vue'
 import EmptyState from '../components/ui/EmptyState.vue'
 import {
@@ -88,6 +89,8 @@ const finalStorySummary = computed(() => {
   const value = activeSession.value?.story_state?.final_summary
   return typeof value === 'string' ? value : null
 })
+const finalStoryId = computed(() => activeSession.value?.final_story_id ?? null)
+const finalStoryHasAssetWork = computed(() => Boolean(finalStoryId.value))
 const turnSuccessRateLabel = computed(() => {
   if (!voiceAnalytics.value) return '0%'
   return `${Math.round(voiceAnalytics.value.turn_success_rate * 100)}%`
@@ -859,6 +862,9 @@ onBeforeUnmount(() => {
                   <p v-if="finalStorySummary" class="mt-2 text-sm text-emerald-700">
                     摘要：{{ finalStorySummary }}
                   </p>
+                  <p class="mt-2 text-sm text-emerald-700">
+                    保存后的封面补全与后续资源任务会继续挂到正式故事的生成轨迹里。
+                  </p>
                   <div class="mt-3">
                     <BaseButton size="sm" variant="secondary" @click="viewFinalStory">
                       <BookOpenIcon class="h-4 w-4" />
@@ -1088,6 +1094,13 @@ onBeforeUnmount(() => {
               </div>
 
               <div class="space-y-6">
+                <GenerationTrace
+                  v-if="finalStoryHasAssetWork"
+                  :story-id="finalStoryId"
+                  title="正式故事资产轨迹"
+                  description="语音共创保存后触发的封面补全、资源生成与后续恢复任务，会继续记录在这里。"
+                />
+
                 <div class="rounded-2xl border border-gray-100 bg-white p-4">
                   <h3 class="font-semibold text-gray-900">故事状态快照</h3>
                   <pre class="mt-4 overflow-x-auto rounded-xl bg-gray-950 p-4 text-xs leading-6 text-emerald-200">{{ JSON.stringify(activeSession.story_state, null, 2) }}</pre>