From ccf610bcf8f800fc32d1364275f558344d2dd1a6 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Sun, 1 Feb 2026 12:38:05 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=94=A8=E6=88=B7=E4=B8=8A=E4=BC=A0?=
 =?UTF-8?q?=E7=9A=84=E5=9B=BE=E7=89=87=E4=B9=9F=E6=B7=BB=E5=8A=A0=E5=88=B0?=
 =?UTF-8?q?=E7=94=BB=E5=B8=83=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

发送消息时将用户上传的图片立即添加到画布

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 components/canvas/CanvasChatPanel.tsx | 28 +++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/components/canvas/CanvasChatPanel.tsx b/components/canvas/CanvasChatPanel.tsx
index 202ca45..8d62c87 100644
--- a/components/canvas/CanvasChatPanel.tsx
+++ b/components/canvas/CanvasChatPanel.tsx
@@ -268,13 +268,33 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
     const parts: any[] = [];
     
     // 添加文件部分（作为 file 类型的 part）
-    attachments.forEach(a => {
+    // 同时将用户上传的图片添加到画布
+    attachments.forEach((a, index) => {
       parts.push({
         type: "file" as const,
         mediaType: a.contentType,
         name: a.name,
         url: a.url,
       });
+      
+      // 将用户上传的图片添加到画布
+      if (a.contentType?.startsWith('image/')) {
+        const existingNodes = nodes.length;
+        const x = 100 + ((existingNodes + index) % 4) * 320;
+        const y = 100 + Math.floor((existingNodes + index) / 4) * 320;
+        
+        addNode({
+          type: 'image',
+          position: { x, y },
+          size: { width: 300, height: 300 },
+          data: {
+            src: a.url,
+            status: 'completed',
+            prompt: '用户上传',
+          },
+          connections: [],
+        });
+      }
     });
     
     // 添加文本部分
@@ -289,9 +309,13 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
       parts: parts,
     });
     
+    if (attachments.length > 0) {
+      toast.success(`已将 ${attachments.length} 张图片添加到画布`);
+    }
+    
     setInput("");
     setAttachments([]);
-  }, [input, attachments, selectedModelId, sendMessage]);
+  }, [input, attachments, selectedModelId, sendMessage, addNode, nodes.length]);
 
   // 处理文件选择
   const handleFileSelect = async (e: React.ChangeEvent<HTMLInputElement>) => {