diff --git a/components/agents/AgentPsdTemplateEditorDialog.tsx b/components/agents/AgentPsdTemplateEditorDialog.tsx index 047fc5028..12e6689c9 100644 --- a/components/agents/AgentPsdTemplateEditorDialog.tsx +++ b/components/agents/AgentPsdTemplateEditorDialog.tsx @@ -88,6 +88,25 @@ export function AgentPsdTemplateEditorDialog({ [selectedTemplateId, templates] ); + const editableImageLayers = useMemo( + () => + (selectedTemplate?.layers || []).filter((layer) => + isAgentPsdImageLayerSlot(layer) + ), + [selectedTemplate] + ); + const editableTextLayers = useMemo( + () => + (selectedTemplate?.layers || []).filter((layer) => + isAgentPsdTextLayerSlot(layer) + ), + [selectedTemplate] + ); + const fixedLayerCount = useMemo(() => { + if (!selectedTemplate) return 0; + return Math.max(0, selectedTemplate.layerCount - selectedTemplate.layers.length); + }, [selectedTemplate]); + useEffect(() => { if (!open) return; @@ -123,7 +142,7 @@ export function AgentPsdTemplateEditorDialog({ ...current, [slotId]: payload.url, })); - toast.success("素材已上传"); + toast.success("替换图片已上传"); } catch (error) { toast.error(error instanceof Error ? error.message : "素材上传失败"); } finally { @@ -159,7 +178,7 @@ export function AgentPsdTemplateEditorDialog({ } setRenderedResultUrl(payload.result.url); - toast.success("套版结果已生成"); + toast.success("模板替换结果已生成"); } catch (error) { toast.error(error instanceof Error ? error.message : "PSD 模板渲染失败"); } finally { @@ -176,7 +195,7 @@ export function AgentPsdTemplateEditorDialog({ @@ -184,266 +203,300 @@ export function AgentPsdTemplateEditorDialog({ 套用 PSD 模板 - 当前结果图会自动填入默认图片槽位,文字槽位可直接输入,其他图片槽位可继续上传素材替换。 + 这里是直接把当前图片和输入文字替换进 PSD 模板,不会再次调用 AI 生图模型。 -
-
-
-
- - -
- - {selectedTemplate ? ( - <> -
-
- {selectedTemplate.name} -
-
- -
- {selectedTemplate.brandName} - - {selectedTemplate.width} x {selectedTemplate.height} - - - { - selectedTemplate.layers.filter((layer) => layer.slotType === "image").length - }{" "} - 个图片槽位 - - - { - selectedTemplate.layers.filter((layer) => layer.slotType === "text").length - }{" "} - 个文字槽位 - -
- - {selectedTemplate.description ? ( -
- {selectedTemplate.description} -
- ) : null} - - - - ) : ( -
- {isLoading - ? "正在加载可用模板..." - : normalizedBrandName - ? `当前品牌“${normalizedBrandName}”下还没有可用 PSD 模板,请先去后台配置。` - : "当前还没有启用的 PSD 模板,请先去后台配置。"} -
- )} -
-
- -
-
-
槽位内容
-
- 图片槽位支持上传和套用当前结果图,文字槽位直接输入即可。 -
-
- - +
+
+
- {selectedTemplate?.layers.length ? ( - selectedTemplate.layers.map((layer) => { - if (isAgentPsdImageLayerSlot(layer)) { - const assignedUrl = imageAssignments[layer.id] || ""; - const slotUploadInputId = `psd-slot-upload-${layer.id}`; +
+ + +
- return ( -
-
-
{layer.layerName}
- 图片槽位 - {layer.isRequired ? 必传 : null} - {layer.isDefaultResultSource ? ( - 默认结果图 - ) : null} - - {layer.width} x {layer.height} - -
-
{layer.layerPath}
- - {assignedUrl ? ( -
-
- {layer.layerName} -
-
- ) : ( -
- 暂未分配素材 -
- )} - -
- {sourceImageUrl ? ( - - ) : null} - - {layer.allowUserUploadOverride ? ( - <> - handleSlotUpload(layer.id, event)} - /> - - - ) : null} - - {assignedUrl ? ( - - ) : null} -
-
- ); - } - - const textValue = textAssignments[layer.id] || ""; - return ( -
-
-
{layer.layerName}
- 文字槽位 - {layer.isRequired ? 必填 : null} - - {layer.width} x {layer.height} - - {layer.fontLabel || layer.fontFamily ? ( - {layer.fontLabel || layer.fontFamily} - ) : null} -
-
{layer.layerPath}
- -
-