feat: 同步角色选角与首帧身份约束

2026-08-31 19:14:58 +08:00
parent aeb3ce2986
commit 53917268d3
20 changed files with 940 additions and 112 deletions
@@ -0,0 +1,84 @@
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import { AppDialog } from '../../../components/ui'
+import { validImageSize } from '../../subject-images/model'
+import type { GenerateCastingCandidateInput } from '../types'
+
+/** Character 选角候选表单固定使用 primary，且不会自动选择演员。 */
+const props = defineProps<{ subjectId: string; subjectName: string; disabled: boolean }>()
+const open = defineModel<boolean>('open', { default: false })
+const emit = defineEmits<{ generate: [input: GenerateCastingCandidateInput] }>()
+const prompt = ref('')
+const width = ref<number | ''>('')
+const height = ref<number | ''>('')
+const acknowledged = ref(false)
+const valid = computed(() => validImageSize(width.value, height.value))
+
+/** 每次切换角色或重新打开都清空自定义覆盖与费用确认。 */
+function reset() {
+    prompt.value = ''
+    width.value = ''
+    height.value = ''
+    acknowledged.value = false
+}
+watch([() => props.subjectId, open], reset)
+
+/** 只发送选角候选接口接受的字段，不携带普通身份图视角参数。 */
+function submit() {
+    if (props.disabled || !valid.value || !acknowledged.value) return
+    emit('generate', {
+        provider: 'seedream',
+        ...(prompt.value.trim() ? { prompt: prompt.value.trim() } : {}),
+        ...(width.value !== '' && height.value !== '' ? { width: width.value, height: height.value } : {})
+    })
+    open.value = false
+}
+</script>
+
+<template>
+    <AppDialog v-model:open="open" title="生成角色选角候选" :description="`${subjectName} · 候选不会自动成为身份母版`">
+        <form class="mt-5 space-y-4" @submit.prevent="submit">
+            <p class="alert text-xs">
+                后端会依据角色 Identity、项目视觉风格和默认选角约束生成一张 primary
+                候选。生成完成后仍需人工点击“确认选角”。
+            </p>
+            <label class="block">
+                <span class="field-label">覆盖本次完整提示词（可选）</span>
+                <textarea
+                    id="casting-candidate-prompt"
+                    v-model="prompt"
+                    class="input min-h-24"
+                    placeholder="建议留空，使用后端编译的稳定身份和选角约束"
+                />
+            </label>
+            <p v-if="prompt.trim()" class="text-xs text-danger">
+                自定义文本会替换后端完整提示词，请自行包含人物身份、基础服装和中性参考图要求。
+            </p>
+            <div class="grid grid-cols-2 gap-4">
+                <label
+                    ><span class="field-label">宽度（px）</span
+                    ><input v-model.number="width" class="input" type="number" min="1" placeholder="后端默认"
+                /></label>
+                <label
+                    ><span class="field-label">高度（px）</span
+                    ><input v-model.number="height" class="input" type="number" min="1" placeholder="后端默认"
+                /></label>
+            </div>
+            <p v-if="!valid" class="text-xs text-danger">宽高需要同时留空，或同时填写正整数。</p>
+            <label class="flex items-start gap-2 text-xs leading-6">
+                <input
+                    id="casting-candidate-cost"
+                    v-model="acknowledged"
+                    type="checkbox"
+                    class="mt-1.5 accent-accent"
+                />我已确认调用 Seedream 可能产生费用，且当前没有同项目生成任务。
+            </label>
+            <div class="dialog-footer">
+                <button type="button" class="button button-secondary" @click="open = false">取消</button>
+                <button type="submit" class="button button-primary" :disabled="disabled || !valid || !acknowledged">
+                    确认生成候选
+                </button>
+            </div>
+        </form>
+    </AppDialog>
+</template>