feat(P1): Add align-prompt feature for better text-image relevance

frontend/src/app/editor/page.tsx

@@ -229,6 +229,7 @@ function SelectedFrameDetails() {
     const [isSaving, setIsSaving] = useState(false)
     const [isRegeneratingImage, setIsRegeneratingImage] = useState(false)
     const [isRegeneratingAudio, setIsRegeneratingAudio] = useState(false)
+    const [isAligningPrompt, setIsAligningPrompt] = useState(false)
     const [error, setError] = useState<string | null>(null)
 
     // Update local state when frame changes
@@ -322,6 +323,31 @@ function SelectedFrameDetails() {
         }
     }
 
+    const handleAlignPrompt = async () => {
+        if (!storyboard || !selectedFrame) return
+
+        setIsAligningPrompt(true)
+        setError(null)
+
+        try {
+            const result = await editorApi.alignPrompt(
+                storyboard.id,
+                selectedFrame.id,
+                narration || selectedFrame.narration
+            )
+
+            // Update local store with new image prompt
+            updateFrame(selectedFrame.id, {
+                imagePrompt: result.image_prompt,
+            })
+            setImagePrompt(result.image_prompt)
+        } catch (err: any) {
+            setError(err.message || '对齐提示词失败')
+        } finally {
+            setIsAligningPrompt(false)
+        }
+    }
+
     return (
         <div className="space-y-4">
             {error && (
@@ -434,6 +460,18 @@ function SelectedFrameDetails() {
                         ) : null}
                         重新生成音频
                     </Button>
+                    <Button
+                        size="sm"
+                        variant="outline"
+                        className="w-full"
+                        onClick={handleAlignPrompt}
+                        disabled={isAligningPrompt}
+                    >
+                        {isAligningPrompt ? (
+                            <Loader2 className="h-4 w-4 animate-spin mr-2" />
+                        ) : null}
+                        对齐提示词
+                    </Button>
                 </div>
             )}
         </div>

frontend/src/services/editor-api.ts

@@ -197,6 +197,31 @@ class EditorApiClient {
         return response.json()
     }
 
+    /**
+     * Align image prompt with narration - regenerate prompt based on narration
+     */
+    async alignPrompt(
+        storyboardId: string,
+        frameId: string,
+        narration?: string
+    ): Promise<{ image_prompt: string; success: boolean }> {
+        const response = await fetch(
+            `${this.baseUrl}/editor/storyboard/${storyboardId}/frames/${frameId}/align-prompt`,
+            {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ narration }),
+            }
+        )
+
+        if (!response.ok) {
+            const error = await response.json().catch(() => ({ detail: response.statusText }))
+            throw new Error(error.detail || `Failed to align prompt: ${response.statusText}`)
+        }
+
+        return response.json()
+    }
+
     /**
      * Inpaint (局部重绘) image for a frame
      */