feat(prompt): AI 提示词优化双栏交互
新增 prompt API 模块调用后端 /api/v1/prompt/optimize,PromptEditor 重构为左右双栏布局支持原始/优化提示词对比编辑,默认开启 AI 优化, 用户可关闭开关或手动编辑优化结果后再提交生成。
This commit is contained in:
@@ -13,7 +13,7 @@ const ASSET_TYPES: { value: AssetType; label: string }[] = [
|
||||
]
|
||||
|
||||
interface GenerateFormProps {
|
||||
onSubmit: () => void
|
||||
onSubmit: (prompt: string) => void
|
||||
submitting: boolean
|
||||
}
|
||||
|
||||
@@ -24,13 +24,32 @@ export default function GenerateForm({ onSubmit, submitting }: GenerateFormProps
|
||||
assetType,
|
||||
taskStyle,
|
||||
params,
|
||||
enableAI,
|
||||
optimizedPrompt,
|
||||
isOptimizing,
|
||||
setPrompt,
|
||||
setAssetType,
|
||||
toggleTaskStyle,
|
||||
setParams,
|
||||
setEnableAI,
|
||||
setOptimizedPrompt,
|
||||
runOptimize,
|
||||
} = useTaskStore()
|
||||
|
||||
const mergedStyle = mergeStyles(projectStyle, taskStyle)
|
||||
const finalPrompt = enableAI && optimizedPrompt ? optimizedPrompt : prompt
|
||||
|
||||
const handleOptimize = async () => {
|
||||
try {
|
||||
await runOptimize(projectStyle)
|
||||
} catch {
|
||||
// error handled in store
|
||||
}
|
||||
}
|
||||
|
||||
const handleSubmit = () => {
|
||||
onSubmit(finalPrompt)
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ display: 'flex', flexDirection: 'column', gap: 24 }}>
|
||||
@@ -62,16 +81,41 @@ export default function GenerateForm({ onSubmit, submitting }: GenerateFormProps
|
||||
<StyleSelector value={taskStyle} onChange={toggleTaskStyle} compact />
|
||||
</div>
|
||||
|
||||
{/* 提示词 */}
|
||||
{/* 提示词(含 AI 优化) */}
|
||||
<div>
|
||||
<h3 style={{ marginBottom: 12, fontSize: 14, color: 'var(--text-secondary)' }}>
|
||||
提示词
|
||||
</h3>
|
||||
<div
|
||||
style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
marginBottom: 12,
|
||||
}}
|
||||
>
|
||||
<h3 style={{ fontSize: 14, color: 'var(--text-secondary)' }}>
|
||||
提示词
|
||||
</h3>
|
||||
{enableAI && (
|
||||
<button
|
||||
type="button"
|
||||
className="btn-secondary"
|
||||
onClick={handleOptimize}
|
||||
disabled={isOptimizing || !prompt.trim()}
|
||||
style={{ padding: '6px 16px', fontSize: 13 }}
|
||||
>
|
||||
{isOptimizing ? '优化中...' : '优化提示词'}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<PromptEditor
|
||||
prompt={prompt}
|
||||
onPromptChange={setPrompt}
|
||||
style={mergedStyle}
|
||||
params={{ resolution: params.resolution, format: params.format }}
|
||||
enableAI={enableAI}
|
||||
onEnableAIToggle={setEnableAI}
|
||||
optimizedPrompt={optimizedPrompt}
|
||||
isOptimizing={isOptimizing}
|
||||
onOptimizedPromptChange={setOptimizedPrompt}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -113,8 +157,8 @@ export default function GenerateForm({ onSubmit, submitting }: GenerateFormProps
|
||||
<button
|
||||
type="button"
|
||||
className="btn-primary"
|
||||
onClick={onSubmit}
|
||||
disabled={submitting || !prompt.trim()}
|
||||
onClick={handleSubmit}
|
||||
disabled={submitting || !finalPrompt.trim()}
|
||||
style={{ alignSelf: 'flex-start', padding: '12px 32px', fontSize: 16 }}
|
||||
>
|
||||
{submitting ? '提交中...' : '开始生成'}
|
||||
|
||||
Reference in New Issue
Block a user