fix: 智能自动模式分阶段显示占位图
流程： 1. 用户发送请求 → 显示'AI正在思考'（Qwen3在分析） 2. 对话消息出现（带GENERATING_IMAGE标记）→ 切换到生图占位图 3. 图片生成完成 → 隐藏占位图 修改： - 检测 GENERATING_IMAGE 标记来区分阶段 - 分析阶段显示 ThinkingMessage - 生图阶段显示 ImageGenerationLoading Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Your Name
parent
231d726b37
commit
58d0b8b5dd
@ -158,9 +158,11 @@ function PureMessages({
|
||||
const isAutoModeWithImage = selectedModelId === "auto" &&
|
||||
lastUserMessage?.parts?.some((p: any) => p.type === "file" || p.type === "image");
|
||||
|
||||
// 🆕 检查是否有"图片正在生成"的标记
|
||||
const isGeneratingImage = lastMessage?.parts?.some(
|
||||
(part: any) => part.type === "text" && part.text?.includes("<!-- GENERATING_IMAGE -->")
|
||||
// 🆕 检查是否有"图片正在生成"的标记（表示对话消息已发送，正在等待图片生成）
|
||||
const isGeneratingImage = messages.some(msg =>
|
||||
msg.role === "assistant" && msg.parts?.some(
|
||||
(part: any) => part.type === "text" && part.text?.includes("<!-- GENERATING_IMAGE -->")
|
||||
)
|
||||
);
|
||||
|
||||
// 对于图片模型，检查是否有图片内容（包含 ![thumb| 或 ![thumb||| 标记）
|
||||
@ -178,11 +180,6 @@ function PureMessages({
|
||||
part.text.includes("![Generated Image")
|
||||
))
|
||||
);
|
||||
|
||||
// 🆕 如果有"正在生成"标记，强制认为没有图片内容（继续显示占位图）
|
||||
if (isGeneratingImage) {
|
||||
hasImageContent = false;
|
||||
}
|
||||
} else {
|
||||
// 普通模式：只检查最后一条消息
|
||||
hasImageContent = lastMessage?.parts && lastMessage.parts.some(
|
||||
@ -202,39 +199,59 @@ function PureMessages({
|
||||
// 判断是否是图片生成模型（包括 Gemini、火山、阿里）
|
||||
const isImageGenModel = isGeminiModel || isVolcanoVisionModel || isAlibabaImageModel;
|
||||
|
||||
// 根据模型类型判断是否有有效内容
|
||||
// 🆕 智能自动模式的特殊处理
|
||||
// - 收到 GENERATING_IMAGE 标记前：显示普通思考动画
|
||||
// - 收到 GENERATING_IMAGE 标记后：显示生图占位图
|
||||
// - 收到图片后：隐藏占位图
|
||||
let hasContent = false;
|
||||
if (isQianwenVideoModel || isVideoModel) {
|
||||
hasContent = hasVideoContent ?? false; // 视频模型：只有真正的视频才算有内容
|
||||
} else if (isImageGenModel || isAutoModeWithImage) {
|
||||
hasContent = hasImageContent ?? false; // 图片模型或智能自动+图片：只有图片才算有内容（文字不算）
|
||||
hasContent = hasVideoContent ?? false;
|
||||
} else if (isImageGenModel) {
|
||||
hasContent = hasImageContent ?? false;
|
||||
} else if (isAutoModeWithImage) {
|
||||
// 智能自动模式：只有图片出现才算有内容
|
||||
hasContent = hasImageContent ?? false;
|
||||
} else {
|
||||
hasContent = hasTextContent ?? false; // 其他模型：任何文本都算有内容
|
||||
hasContent = hasTextContent ?? false;
|
||||
}
|
||||
|
||||
// 根据模型类型设置延迟时间（视频模型 60 秒，图片模型 4 秒，其他 6 秒）
|
||||
// 🆕 智能自动模式如果有图片，也按图片模型处理
|
||||
// 根据模型类型设置延迟时间
|
||||
const delayTime = (isQianwenVideoModel || isVideoModel) ? 60000 : (isImageGenModel || isAutoModeWithImage) ? 4000 : 6000;
|
||||
|
||||
// 如果是 submitted 状态，立即显示
|
||||
if (status === "submitted") {
|
||||
setShowThinkingWithDelay(true);
|
||||
}
|
||||
// 如果是 streaming 状态且没有内容，显示
|
||||
else if (status === "streaming" && lastMessage?.role === "assistant" && !hasContent) {
|
||||
setShowThinkingWithDelay(true);
|
||||
}
|
||||
// 如果 AI 开始有内容了，延迟后隐藏
|
||||
else if (status === "streaming" && lastMessage?.role === "assistant" && hasContent) {
|
||||
const timer = setTimeout(() => {
|
||||
// 🆕 智能自动模式的占位图逻辑
|
||||
if (isAutoModeWithImage) {
|
||||
if (hasImageContent) {
|
||||
// 图片已生成，延迟后隐藏占位图
|
||||
const timer = setTimeout(() => {
|
||||
setShowThinkingWithDelay(false);
|
||||
}, delayTime);
|
||||
return () => clearTimeout(timer);
|
||||
} else if (isGeneratingImage) {
|
||||
// 收到 GENERATING_IMAGE 标记，显示生图占位图
|
||||
setShowThinkingWithDelay(true);
|
||||
} else if (status === "submitted" || (status === "streaming" && !hasTextContent)) {
|
||||
// 正在分析意图，显示普通思考动画
|
||||
setShowThinkingWithDelay(true);
|
||||
} else if (status === "streaming" && hasTextContent && !isGeneratingImage) {
|
||||
// 对话消息出现了但还没有 GENERATING_IMAGE 标记，继续显示思考动画
|
||||
setShowThinkingWithDelay(true);
|
||||
} else {
|
||||
setShowThinkingWithDelay(false);
|
||||
}, delayTime);
|
||||
|
||||
return () => clearTimeout(timer);
|
||||
}
|
||||
// 其他情况立即隐藏
|
||||
else {
|
||||
setShowThinkingWithDelay(false);
|
||||
}
|
||||
} else {
|
||||
// 非智能自动模式的原有逻辑
|
||||
if (status === "submitted") {
|
||||
setShowThinkingWithDelay(true);
|
||||
} else if (status === "streaming" && lastMessage?.role === "assistant" && !hasContent) {
|
||||
setShowThinkingWithDelay(true);
|
||||
} else if (status === "streaming" && lastMessage?.role === "assistant" && hasContent) {
|
||||
const timer = setTimeout(() => {
|
||||
setShowThinkingWithDelay(false);
|
||||
}, delayTime);
|
||||
return () => clearTimeout(timer);
|
||||
} else {
|
||||
setShowThinkingWithDelay(false);
|
||||
}
|
||||
}
|
||||
}, [status, messages, isGeminiModel, isQianwenVideoModel, isVolcanoVisionModel, isVideoModel, isAlibabaImageModel, selectedModelId]);
|
||||
|
||||
@ -363,20 +380,30 @@ 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");
|
||||
const showAutoModeImage = isAutoMode && userMessageHasImage;
|
||||
|
||||
// 🆕 检查是否收到了 GENERATING_IMAGE 标记（表示对话已发送，开始生图）
|
||||
const hasGeneratingMarker = messages.some(msg =>
|
||||
msg.role === "assistant" && msg.parts?.some(
|
||||
(part: any) => part.type === "text" && part.text?.includes("<!-- GENERATING_IMAGE -->")
|
||||
)
|
||||
);
|
||||
|
||||
// 🆕 智能自动模式：根据阶段显示不同占位图
|
||||
const showAutoModeImagePlaceholder = isAutoMode && userMessageHasImage && hasGeneratingMarker;
|
||||
const showAutoModeThinking = isAutoMode && userMessageHasImage && !hasGeneratingMarker;
|
||||
|
||||
if (showVideo) return <QianwenVideoLoading />;
|
||||
if (showGemini) return <GeminiImageLoading imageCount={imageCount} />;
|
||||
if (showVolcano) return <VolcanoVisionLoading imageCount={imageCount} />;
|
||||
// 🆕 阿里生图模型使用通用组件，橙色主题，最多 6 张，传递自定义模型名称
|
||||
if (showAlibabaImage) return <ImageGenerationLoading imageCount={imageCount} maxImages={6} providerType="alibaba-image" modelName={currentModelDisplayName} />;
|
||||
// 🆕 智能自动模式：如果用户发送了图片，显示智能处理占位图
|
||||
if (showAutoModeImage) return <ImageGenerationLoading imageCount={imageCount} maxImages={6} providerType="alibaba-image" modelName="智能处理" />;
|
||||
// 🆕 智能自动模式：收到 GENERATING_IMAGE 后显示生图占位图
|
||||
if (showAutoModeImagePlaceholder) return <ImageGenerationLoading imageCount={imageCount} maxImages={6} providerType="alibaba-image" modelName="智能处理" />;
|
||||
// 🆕 智能自动模式：分析阶段显示思考动画
|
||||
if (showAutoModeThinking) return <ThinkingMessage />;
|
||||
// 其他情况显示通用思考动画
|
||||
return <ThinkingMessage />;
|
||||
})()}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user