From 98807b135a359e411f20ea78a7f377e31925d505 Mon Sep 17 00:00:00 2001 From: Your Name Date: Sun, 1 Feb 2026 02:28:38 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E5=AF=B9=E8=AF=9D=E6=B6=88=E6=81=AF?= =?UTF-8?q?=E5=87=BA=E7=8E=B0=E5=90=8E=E5=BB=B6=E8=BF=9F6=E7=A7=92?= =?UTF-8?q?=E5=86=8D=E6=98=BE=E7=A4=BA=E7=94=9F=E5=9B=BE=E5=8D=A0=E4=BD=8D?= =?UTF-8?q?=E5=9B=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 流程： 1. 用户发送请求 → 显示思考动画 2. 对话消息出现 → 思考动画消失，显示对话文字 3. 等待6秒 → 显示生图占位图 4. 图片生成完成 → 占位图消失 修改： - 添加 showImagePlaceholderDelayed 状态 - 收到 GENERATING_IMAGE 标记后延迟6秒设置状态 - 生图占位图根据延迟状态显示 Co-authored-by: Cursor --- components/messages.tsx | 51 ++++++++++++++++++++++------------------- 1 file changed, 27 insertions(+), 24 deletions(-) diff --git a/components/messages.tsx b/components/messages.tsx index d18df2f..bd4a74d 100644 --- a/components/messages.tsx +++ b/components/messages.tsx @@ -126,6 +126,8 @@ function PureMessages({ // 控制等待动画延迟消失（Gemini 图片模型延迟 4 秒，其他模型 6 秒） const [showThinkingWithDelay, setShowThinkingWithDelay] = useState(false); + // 🆕 智能自动模式：收到对话消息后延迟显示生图占位图 + const [showImagePlaceholderDelayed, setShowImagePlaceholderDelayed] = useState(false); useEffect(() => { const lastMessage = messages.length > 0 ? messages[messages.length - 1] : null; @@ -222,21 +224,29 @@ function PureMessages({ if (isAutoModeWithImage) { if (hasImageContent) { // 图片已生成，延迟后隐藏占位图 + setShowImagePlaceholderDelayed(false); const timer = setTimeout(() => { setShowThinkingWithDelay(false); }, delayTime); return () => clearTimeout(timer); } else if (isGeneratingImage) { - // 收到 GENERATING_IMAGE 标记，显示生图占位图 - setShowThinkingWithDelay(true); + // 收到 GENERATING_IMAGE 标记，延迟6秒后显示生图占位图 + // 立即隐藏思考动画（因为对话文字已经显示了） + setShowThinkingWithDelay(false); + + // 延迟6秒后显示生图占位图 + const timer = setTimeout(() => { + setShowImagePlaceholderDelayed(true); + }, 6000); + return () => clearTimeout(timer); } else if (status === "submitted" || (status === "streaming" && !hasTextContent)) { // 正在分析意图，显示普通思考动画 setShowThinkingWithDelay(true); - } else if (status === "streaming" && hasTextContent && !isGeneratingImage) { - // 对话消息出现了但还没有 GENERATING_IMAGE 标记，继续显示思考动画 - setShowThinkingWithDelay(true); + setShowImagePlaceholderDelayed(false); } else { + // 其他情况：隐藏所有占位图 setShowThinkingWithDelay(false); + setShowImagePlaceholderDelayed(false); } } else { // 非智能自动模式的原有逻辑 @@ -363,6 +373,17 @@ function PureMessages({ messagesCount: messages.length, }); + // 🆕 检查智能自动模式 + const isAutoMode = selectedModelId === "auto"; + const lastUserMsg = [...messages].reverse().find(m => m.role === "user"); + const userMessageHasImage = lastUserMsg?.parts?.some((p: any) => p.type === "file" || p.type === "image"); + + // 🆕 智能自动模式：使用延迟状态显示生图占位图 + if (isAutoMode && userMessageHasImage && showImagePlaceholderDelayed) { + console.log("[Messages] ✅ 显示智能处理生图占位图 (延迟后)"); + return ; + } + // 显示条件：正常等待动画 或 恢复的待处理状态 const shouldShow = showThinkingWithDelay || hasRestoredPending; @@ -380,30 +401,12 @@ function PureMessages({ const showAlibabaImage = modelType === "alibaba-image" || (!modelType && isAlibabaImageModel); const showVideo = modelType === "volcano-video" || modelType === "qianwen-video" || (!modelType && (isQianwenVideoModel || isVideoModel)); - // 🆕 检查智能自动模式 - const isAutoMode = selectedModelId === "auto"; - const lastUserMsg = [...messages].reverse().find(m => m.role === "user"); - const userMessageHasImage = lastUserMsg?.parts?.some((p: any) => p.type === "file" || p.type === "image"); - - // 🆕 检查是否收到了 GENERATING_IMAGE 标记（表示对话已发送，开始生图） - const hasGeneratingMarker = messages.some(msg => - msg.role === "assistant" && msg.parts?.some( - (part: any) => part.type === "text" && part.text?.includes("") - ) - ); - - // 🆕 智能自动模式：根据阶段显示不同占位图 - const showAutoModeImagePlaceholder = isAutoMode && userMessageHasImage && hasGeneratingMarker; - const showAutoModeThinking = isAutoMode && userMessageHasImage && !hasGeneratingMarker; - if (showVideo) return ; if (showGemini) return ; if (showVolcano) return ; if (showAlibabaImage) return ; - // 🆕 智能自动模式：收到 GENERATING_IMAGE 后显示生图占位图 - if (showAutoModeImagePlaceholder) return ; // 🆕 智能自动模式：分析阶段显示思考动画 - if (showAutoModeThinking) return ; + if (isAutoMode && userMessageHasImage) return ; // 其他情况显示通用思考动画 return ; })()}