feat(canvas): 生图设置 - 支持透明背景输出 (#29) (#31)

Co-authored-by: linxi <linxi@enjoysoftware.cn>

web/src/pages/canvas/project.tsx

@@ -1030,6 +1030,8 @@ function InfiniteCanvasPage() {
                     prompt: "",
                     model: effectiveConfig.imageModel || effectiveConfig.model,
                     size: effectiveConfig.size,
+                    quality: effectiveConfig.quality,
+                    transparentBackground: effectiveConfig.transparentBackground,
                     count: getGenerationCount(effectiveConfig.canvasImageCount || effectiveConfig.count),
                 },
             );

web/src/pages/canvas/use-canvas-generation-retry.ts

@@ -62,7 +62,7 @@ export function useCanvasGenerationRetry({ projectId, activatedSkills, nodesRef,
             const retryMode: CanvasNodeGenerationMode = node.type === CanvasNodeType.Text ? "text" : node.type === CanvasNodeType.Video ? "video" : node.type === CanvasNodeType.Audio ? "audio" : "image";
             const generationConfig =
                 hasSavedImageMetadata && savedImageMetadata
-                    ? { ...effectiveConfig, model: savedImageMetadata.model || effectiveConfig.imageModel || effectiveConfig.model, quality: savedImageMetadata.quality || effectiveConfig.quality, size: savedImageMetadata.size || effectiveConfig.size, count: "1" }
+                    ? { ...effectiveConfig, model: savedImageMetadata.model || effectiveConfig.imageModel || effectiveConfig.model, quality: savedImageMetadata.quality || effectiveConfig.quality, size: savedImageMetadata.size || effectiveConfig.size, transparentBackground: (savedImageMetadata.transparentBackground || effectiveConfig.transparentBackground) === "true" ? "true" : "false", count: "1" }
                     : { ...buildGenerationConfig(effectiveConfig, sourceNode, retryMode), count: "1" };
             if (!isAiConfigReady(generationConfig, generationConfig.model)) {
                 openConfigDialog(true);
@@ -135,7 +135,7 @@ export function useCanvasGenerationRetry({ projectId, activatedSkills, nodesRef,
                 const imageConfig = NODE_DEFAULT_SIZE[CanvasNodeType.Image];
                 const imageSize = fitNodeSize(uploadedImage.width, uploadedImage.height, imageConfig.width, imageConfig.height);
                 const generationMetadata = savedImageMetadata?.generationType
-                    ? { generationType: savedImageMetadata.generationType, model: generationConfig.model, size: generationConfig.size, quality: generationConfig.quality, count: savedImageMetadata.count || 1, references: savedImageMetadata.references }
+                    ? { generationType: savedImageMetadata.generationType, model: generationConfig.model, size: generationConfig.size, quality: generationConfig.quality, transparentBackground: generationConfig.transparentBackground, count: savedImageMetadata.count || 1, references: savedImageMetadata.references }
                     : buildImageGenerationMetadata(useReferenceImages ? "edit" : "generation", generationConfig, 1, retryImages);
                 setNodes((current) => current.map((item) => (item.id === node.id ? { ...item, type: CanvasNodeType.Image, width: imageSize.width, height: imageSize.height, metadata: { ...item.metadata, ...imageMetadata(uploadedImage), prompt, ...generationMetadata } } : item)));
             } catch (error) {

web/src/pages/canvas/use-canvas-upload.ts

@@ -278,6 +278,7 @@ export function useCanvasUpload({
                     model: undefined,
                     size: undefined,
                     quality: undefined,
+                    transparentBackground: undefined,
                     count: undefined,
                     references: undefined,
                     primaryImageId: undefined,

web/src/pages/tasks/index.tsx

@@ -493,6 +493,7 @@ function backendProviderConfig(config: ReturnType<typeof resolveModelRequestConf
         model: config.model,
         size: config.size,
         quality: config.quality,
+        transparentBackground: config.transparentBackground,
         count: config.count,
         videoSeconds: config.videoSeconds,
         vquality: config.vquality,