feat: remove chat-style UI from generation workspace
This commit is contained in:
Your Name
parent
7ce4d4cdc2
commit
3443dc01d3
@ -1689,6 +1689,7 @@ export function CanvasChatPanel({
|
||||
workflowContext = null,
|
||||
presentation = "panel",
|
||||
}: CanvasChatPanelProps) {
|
||||
const isWorkspacePresentation = presentation === "workspace";
|
||||
const { data: session } = useSession();
|
||||
const [input, setInput] = useState("");
|
||||
const [attachments, setAttachments] = useState<PickedObjectAttachment[]>([]);
|
||||
@ -2836,6 +2837,12 @@ export function CanvasChatPanel({
|
||||
setSelectedSkillTagId(null);
|
||||
}
|
||||
}, [canvasSkillTags, selectedSkillTagId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isWorkspacePresentation) return;
|
||||
if (!selectedSkillTagId) return;
|
||||
setSelectedSkillTagId(null);
|
||||
}, [isWorkspacePresentation, selectedSkillTagId]);
|
||||
|
||||
const VIDEO_PROVIDER_TYPES = new Set(["volcano-video", "doubao-video", "qianwen-video", "fal-video", "ruxa-video"]);
|
||||
const visualModels = useMemo(() => {
|
||||
@ -7673,16 +7680,22 @@ export function CanvasChatPanel({
|
||||
input.trim() || attachments.length > 0 || (!isDetailGenerationMode && selectedSkillTag)
|
||||
);
|
||||
const hasEnoughAgentUploads = !hasAgentUploadSlots || attachments.length >= agentRequiredUploadCount;
|
||||
const composerPlaceholder = isDetailGenerationMode
|
||||
? "可选补充：风格、情绪氛围、禁用元素、期望生成张数（如：生成8张）"
|
||||
: activeComposerMode === "agent" && selectedAgentPreset?.type === "text"
|
||||
? "可上传图片做分析，也可直接输入文案需求"
|
||||
: hasAgentUploadSlots
|
||||
? "请先上传产品图1、产品图2、模特图，再补充说明"
|
||||
: selectedSkillTag?.placeholder?.trim() ||
|
||||
(selectedSkillTag
|
||||
? `请输入「${selectedSkillTag.name}」相关需求`
|
||||
: canvasDynamicPlaceholder || "请输入你的设计需求，例如：绿色椅子 替换 Image");
|
||||
const composerPlaceholder = isWorkspacePresentation
|
||||
? isDetailGenerationMode
|
||||
? "可选补充：风格、情绪氛围、禁用元素、期望生成张数（如：生成8张）"
|
||||
: hasAgentUploadSlots
|
||||
? "可选补充本次生图要求，例如：高级感、暖灰色、近景特写、生成3张。"
|
||||
: "可选补充本次生成要求，例如：更高级、更生活化、暖调灯光。"
|
||||
: isDetailGenerationMode
|
||||
? "可选补充：风格、情绪氛围、禁用元素、期望生成张数（如：生成8张）"
|
||||
: activeComposerMode === "agent" && selectedAgentPreset?.type === "text"
|
||||
? "可上传图片做分析，也可直接输入文案需求"
|
||||
: hasAgentUploadSlots
|
||||
? "请先上传产品图1、产品图2、模特图，再补充说明"
|
||||
: selectedSkillTag?.placeholder?.trim() ||
|
||||
(selectedSkillTag
|
||||
? `请输入「${selectedSkillTag.name}」相关需求`
|
||||
: canvasDynamicPlaceholder || "请输入你的设计需求，例如：绿色椅子 替换 Image");
|
||||
const detailProductCount = DETAIL_PRODUCT_SLOT_INDEXES.filter((index) => Boolean(detailSlots[index]?.url)).length;
|
||||
const detailModelReady = DETAIL_MODEL_SLOT_INDEX >= 0 ? Boolean(detailSlots[DETAIL_MODEL_SLOT_INDEX]?.url) : false;
|
||||
const detailBundleCount = DETAIL_BUNDLE_SLOT_INDEXES.filter((index) => Boolean(detailSlots[index]?.url)).length;
|
||||
@ -7798,6 +7811,16 @@ export function CanvasChatPanel({
|
||||
renderableVisibleMessages.length === 0 &&
|
||||
!isLoading &&
|
||||
!shouldShowImageLoading;
|
||||
const workspaceEmptyTitle = !selectedAgentPresetId
|
||||
? "请先在左侧选择生图模式"
|
||||
: hasAgentUploadSlots && attachments.length < agentRequiredUploadCount
|
||||
? `请先补齐图片槽位（${attachments.length}/${agentRequiredUploadCount}）`
|
||||
: "准备开始生成";
|
||||
const workspaceEmptyDescription = !selectedAgentPresetId
|
||||
? "选择生图模式后，这里会显示生成结果。"
|
||||
: hasAgentUploadSlots && attachments.length < agentRequiredUploadCount
|
||||
? "从左侧 SKU / SPU 获取图片，或在下方继续上传替换后，再点击开始生成。"
|
||||
: "可在下方补充要求后点击开始生成，结果会显示在这里。";
|
||||
|
||||
const renderModelSelectContent = () => (
|
||||
<SelectContent className="w-[238px] max-h-[340px] overflow-hidden rounded-[18px] border border-[#cfd4dc] bg-[#f3f4f6]/90 p-1.5 shadow-[0_8px_20px_rgba(15,23,42,0.13)]">
|
||||
@ -7884,7 +7907,6 @@ export function CanvasChatPanel({
|
||||
const fallbackTitle = String(projectTitle || "").trim();
|
||||
return fallbackTitle || "未命名画布";
|
||||
}, [activeSessionTitle, projectTitle]);
|
||||
const isWorkspacePresentation = presentation === "workspace";
|
||||
|
||||
return (
|
||||
<div
|
||||
@ -8042,88 +8064,124 @@ export function CanvasChatPanel({
|
||||
)}
|
||||
>
|
||||
<div className="space-y-6 overflow-x-hidden pb-24 pr-1">
|
||||
{!isDetailGenerationMode && renderableVisibleMessages.length === 0 && (
|
||||
<div className={cn("flex flex-col h-full", isDetailGenerationMode ? "pt-0" : "pt-4")}>
|
||||
{/* Greeting */}
|
||||
<div className={cn(isDetailGenerationMode ? "mb-4" : "mb-8")}>
|
||||
<h1 className="mb-2 text-2xl font-bold">
|
||||
<span>Hi</span>
|
||||
{greetingUserName ? (
|
||||
<>
|
||||
<span>, </span>
|
||||
<span className="text-blue-600">{greetingUserName}</span>
|
||||
<span> {greetingPeriodText}</span>
|
||||
</>
|
||||
) : (
|
||||
<span> {greetingPeriodText}</span>
|
||||
)}
|
||||
</h1>
|
||||
<p className="text-muted-foreground">
|
||||
开始创作吧!
|
||||
{Number.isFinite(totalGeneratedImages) ? (
|
||||
<>
|
||||
{" "}累计为你生成了{" "}
|
||||
<span className="text-blue-600 font-semibold">
|
||||
{totalGeneratedImages.toLocaleString()}
|
||||
</span>{" "}
|
||||
张图。
|
||||
</>
|
||||
) : null}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{canvasSkillTags.length > 0 && (
|
||||
<div className="mb-8 rounded-3xl border border-[#eceef2] bg-white/90 p-4">
|
||||
<div className="mb-3 text-center">
|
||||
<h3 className="text-[16px] font-semibold text-[#1f2937]">{canvasSkillTagsTitle}</h3>
|
||||
{!isDetailGenerationMode && renderableVisibleMessages.length === 0 ? (
|
||||
isWorkspacePresentation ? (
|
||||
<div className="flex h-full min-h-[360px] items-center justify-center">
|
||||
<div className="w-full max-w-3xl rounded-[28px] border border-dashed border-[#d7dce5] bg-white/78 p-10 text-center shadow-sm backdrop-blur-sm dark:border-white/10 dark:bg-zinc-900/60">
|
||||
<div className="mx-auto mb-4 flex h-14 w-14 items-center justify-center rounded-2xl bg-[#eef2ff] text-[#4f46e5] dark:bg-[#312e81]/40 dark:text-[#a5b4fc]">
|
||||
<Sparkles className="h-6 w-6" />
|
||||
</div>
|
||||
<div className="grid grid-cols-3 gap-2">
|
||||
{canvasSkillTags.map((tag) => {
|
||||
const isActive = selectedSkillTag?.id === tag.id;
|
||||
const TagIcon = getCanvasSkillIconComponent(tag.iconName);
|
||||
return (
|
||||
<button
|
||||
key={tag.id}
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setSelectedSkillTagId(tag.id);
|
||||
const editor = textareaRef.current as HTMLDivElement | null;
|
||||
editor?.focus();
|
||||
}}
|
||||
className={cn(
|
||||
"inline-flex min-w-0 items-center justify-center gap-1.5 rounded-2xl border px-2 py-1.5 text-[13px] font-medium transition-colors",
|
||||
isActive
|
||||
? "border-[#6d7fff] bg-[#eef1ff] text-[#3341a9]"
|
||||
: "border-[#e4e7ec] bg-white text-[#30343b] hover:border-[#d6dae3] hover:bg-[#fafbfc]"
|
||||
)}
|
||||
<div className="text-2xl font-semibold tracking-tight text-foreground">
|
||||
{workspaceEmptyTitle}
|
||||
</div>
|
||||
<div className="mt-3 text-sm leading-6 text-muted-foreground">
|
||||
{workspaceEmptyDescription}
|
||||
</div>
|
||||
{attachments.length > 0 ? (
|
||||
<div className="mt-6 flex flex-wrap justify-center gap-2">
|
||||
{attachments.map((attachment, index) => (
|
||||
<div
|
||||
key={`${attachment.url}-${index}`}
|
||||
className="overflow-hidden rounded-2xl border bg-white shadow-sm dark:bg-zinc-900"
|
||||
>
|
||||
{tag.iconUrl ? (
|
||||
<img
|
||||
src={buildPreviewImageUrl(tag.iconUrl, 48)}
|
||||
alt={tag.name}
|
||||
className="h-3.5 w-3.5 rounded-sm object-cover"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
onError={(event) => {
|
||||
if (event.currentTarget.src !== tag.iconUrl) {
|
||||
event.currentTarget.src = tag.iconUrl || "";
|
||||
}
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<TagIcon className="h-3.5 w-3.5 text-current opacity-70" />
|
||||
)}
|
||||
<span className="truncate">{tag.name}</span>
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<img
|
||||
src={buildPreviewImageUrl(attachment.url, 160)}
|
||||
alt={attachment.name || `素材${index + 1}`}
|
||||
className="h-20 w-20 object-cover"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
onError={(event) => {
|
||||
if (event.currentTarget.src !== attachment.url) {
|
||||
event.currentTarget.src = attachment.url;
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Refresh - Removed */}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className={cn("flex flex-col h-full", isDetailGenerationMode ? "pt-0" : "pt-4")}>
|
||||
<div className={cn(isDetailGenerationMode ? "mb-4" : "mb-8")}>
|
||||
<h1 className="mb-2 text-2xl font-bold">
|
||||
<span>Hi</span>
|
||||
{greetingUserName ? (
|
||||
<>
|
||||
<span>, </span>
|
||||
<span className="text-blue-600">{greetingUserName}</span>
|
||||
<span> {greetingPeriodText}</span>
|
||||
</>
|
||||
) : (
|
||||
<span> {greetingPeriodText}</span>
|
||||
)}
|
||||
</h1>
|
||||
<p className="text-muted-foreground">
|
||||
开始创作吧!
|
||||
{Number.isFinite(totalGeneratedImages) ? (
|
||||
<>
|
||||
{" "}累计为你生成了{" "}
|
||||
<span className="text-blue-600 font-semibold">
|
||||
{totalGeneratedImages.toLocaleString()}
|
||||
</span>{" "}
|
||||
张图。
|
||||
</>
|
||||
) : null}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{canvasSkillTags.length > 0 && (
|
||||
<div className="mb-8 rounded-3xl border border-[#eceef2] bg-white/90 p-4">
|
||||
<div className="mb-3 text-center">
|
||||
<h3 className="text-[16px] font-semibold text-[#1f2937]">{canvasSkillTagsTitle}</h3>
|
||||
</div>
|
||||
<div className="grid grid-cols-3 gap-2">
|
||||
{canvasSkillTags.map((tag) => {
|
||||
const isActive = selectedSkillTag?.id === tag.id;
|
||||
const TagIcon = getCanvasSkillIconComponent(tag.iconName);
|
||||
return (
|
||||
<button
|
||||
key={tag.id}
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setSelectedSkillTagId(tag.id);
|
||||
const editor = textareaRef.current as HTMLDivElement | null;
|
||||
editor?.focus();
|
||||
}}
|
||||
className={cn(
|
||||
"inline-flex min-w-0 items-center justify-center gap-1.5 rounded-2xl border px-2 py-1.5 text-[13px] font-medium transition-colors",
|
||||
isActive
|
||||
? "border-[#6d7fff] bg-[#eef1ff] text-[#3341a9]"
|
||||
: "border-[#e4e7ec] bg-white text-[#30343b] hover:border-[#d6dae3] hover:bg-[#fafbfc]"
|
||||
)}
|
||||
>
|
||||
{tag.iconUrl ? (
|
||||
<img
|
||||
src={buildPreviewImageUrl(tag.iconUrl, 48)}
|
||||
alt={tag.name}
|
||||
className="h-3.5 w-3.5 rounded-sm object-cover"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
onError={(event) => {
|
||||
if (event.currentTarget.src !== tag.iconUrl) {
|
||||
event.currentTarget.src = tag.iconUrl || "";
|
||||
}
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<TagIcon className="h-3.5 w-3.5 text-current opacity-70" />
|
||||
)}
|
||||
<span className="truncate">{tag.name}</span>
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
) : null}
|
||||
|
||||
{renderableVisibleMessages.map((message, index) => {
|
||||
const assistantTextParts = message.role === "assistant"
|
||||
@ -8196,6 +8254,12 @@ export function CanvasChatPanel({
|
||||
(vote) => vote.messageId === message.id
|
||||
);
|
||||
const isVotingCurrentMessage = votingMessageId === message.id;
|
||||
|
||||
if (isWorkspacePresentation) {
|
||||
if (message.role !== "assistant" || !hasAssistantMedia) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div key={message.id} className="space-y-3">
|
||||
@ -8644,7 +8708,7 @@ export function CanvasChatPanel({
|
||||
document.body
|
||||
)}
|
||||
|
||||
{shouldShowCanvasBanner ? (
|
||||
{!isWorkspacePresentation && shouldShowCanvasBanner ? (
|
||||
<div className="px-4 pb-2">
|
||||
<div
|
||||
className={cn(
|
||||
@ -8681,6 +8745,14 @@ export function CanvasChatPanel({
|
||||
className="relative flex flex-col bg-card rounded-3xl border transition-all duration-200 focus-within:border-primary/50 focus-within:bg-background"
|
||||
data-canvas-chat-input-anchor="true"
|
||||
>
|
||||
{isWorkspacePresentation && !isDetailGenerationMode ? (
|
||||
<div className="border-b px-5 py-3">
|
||||
<div className="text-sm font-semibold text-foreground">补充要求</div>
|
||||
<div className="mt-1 text-xs text-muted-foreground">
|
||||
这里填写本次生图补充要求。图片槽位和生成结果都在当前工作台内完成，不再使用聊天对话方式。
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
{isDetailGenerationMode && (
|
||||
<div
|
||||
className={cn(
|
||||
@ -9419,7 +9491,7 @@ export function CanvasChatPanel({
|
||||
isDetailGenerationMode ? "min-h-[72px]" : "min-h-[60px]"
|
||||
)}
|
||||
>
|
||||
{!isDetailGenerationMode && selectedSkillTag && (
|
||||
{!isWorkspacePresentation && !isDetailGenerationMode && selectedSkillTag && (
|
||||
<div className="mb-2 flex">
|
||||
<button
|
||||
type="button"
|
||||
@ -9466,7 +9538,7 @@ export function CanvasChatPanel({
|
||||
</div>
|
||||
) : hasAgentUploadSlots ? (
|
||||
<div className="inline-flex items-center rounded-full bg-[#f4f5f7] px-3 py-1.5 text-xs text-[#5b6472]">
|
||||
请上传产品图1、产品图2、模特图
|
||||
{isWorkspacePresentation ? "请确认产品图1、产品图2、模特图槽位" : "请上传产品图1、产品图2、模特图"}
|
||||
</div>
|
||||
) : null}
|
||||
</div>
|
||||
@ -9714,92 +9786,94 @@ export function CanvasChatPanel({
|
||||
}}
|
||||
/>
|
||||
))}
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
className={cn(
|
||||
"relative h-8 cursor-pointer rounded-full px-3 text-sm font-medium",
|
||||
activeComposerMode === "video"
|
||||
? "border border-blue-500 bg-blue-50 text-blue-600 hover:bg-blue-100"
|
||||
: activeComposerMode === "detail"
|
||||
? "border border-violet-500 bg-violet-50 text-violet-700 hover:bg-violet-100"
|
||||
: activeComposerMode === "image"
|
||||
? "border border-purple-500 bg-purple-50 text-purple-700 hover:bg-purple-100"
|
||||
: "border border-[#9eb3ff] bg-white text-zinc-700 hover:bg-zinc-50"
|
||||
)}
|
||||
>
|
||||
<span className="flex items-center">
|
||||
{activeComposerMode === "video" ? (
|
||||
<Video className="mr-1 h-4 w-4" />
|
||||
) : activeComposerMode === "detail" ? (
|
||||
<LayoutGrid className="mr-1 h-4 w-4" />
|
||||
) : activeComposerMode === "image" ? (
|
||||
<ImagePlus className="mr-1 h-4 w-4" />
|
||||
) : (
|
||||
<Sparkles className="mr-1 h-4 w-4" />
|
||||
)}
|
||||
{activeModeLabel}
|
||||
</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent
|
||||
align="start"
|
||||
side="top"
|
||||
sideOffset={10}
|
||||
className="w-[156px] rounded-xl border border-[#d6d9df] bg-[#f4f5f7]/90 p-1.5 shadow-[0_8px_18px_rgba(15,23,42,0.14)]"
|
||||
>
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("agent")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "agent" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<Sparkles className="h-4 w-4" />
|
||||
<span className="flex-1">Agent</span>
|
||||
{activeComposerMode === "agent" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
{aiDetailGenerationEnabled ? (
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("detail")}
|
||||
{!isWorkspacePresentation ? (
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "detail" ? "bg-white/80" : "hover:bg-white/70"
|
||||
"relative h-8 cursor-pointer rounded-full px-3 text-sm font-medium",
|
||||
activeComposerMode === "video"
|
||||
? "border border-blue-500 bg-blue-50 text-blue-600 hover:bg-blue-100"
|
||||
: activeComposerMode === "detail"
|
||||
? "border border-violet-500 bg-violet-50 text-violet-700 hover:bg-violet-100"
|
||||
: activeComposerMode === "image"
|
||||
? "border border-purple-500 bg-purple-50 text-purple-700 hover:bg-purple-100"
|
||||
: "border border-[#9eb3ff] bg-white text-zinc-700 hover:bg-zinc-50"
|
||||
)}
|
||||
>
|
||||
<LayoutGrid className="h-4 w-4" />
|
||||
<span className="flex-1">AI详情生成</span>
|
||||
{activeComposerMode === "detail" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
<span className="flex items-center">
|
||||
{activeComposerMode === "video" ? (
|
||||
<Video className="mr-1 h-4 w-4" />
|
||||
) : activeComposerMode === "detail" ? (
|
||||
<LayoutGrid className="mr-1 h-4 w-4" />
|
||||
) : activeComposerMode === "image" ? (
|
||||
<ImagePlus className="mr-1 h-4 w-4" />
|
||||
) : (
|
||||
<Sparkles className="mr-1 h-4 w-4" />
|
||||
)}
|
||||
{activeModeLabel}
|
||||
</span>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent
|
||||
align="start"
|
||||
side="top"
|
||||
sideOffset={10}
|
||||
className="w-[156px] rounded-xl border border-[#d6d9df] bg-[#f4f5f7]/90 p-1.5 shadow-[0_8px_18px_rgba(15,23,42,0.14)]"
|
||||
>
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("agent")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "agent" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<Sparkles className="h-4 w-4" />
|
||||
<span className="flex-1">Agent</span>
|
||||
{activeComposerMode === "agent" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
) : null}
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("image")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "image" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<ImagePlus className="h-4 w-4" />
|
||||
<span className="flex-1">图像生成</span>
|
||||
{activeComposerMode === "image" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("video")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "video" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<Video className="h-4 w-4" />
|
||||
<span className="flex-1">视频生成</span>
|
||||
{activeComposerMode === "video" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
{aiDetailGenerationEnabled ? (
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("detail")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "detail" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<LayoutGrid className="h-4 w-4" />
|
||||
<span className="flex-1">AI详情生成</span>
|
||||
{activeComposerMode === "detail" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
) : null}
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("image")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "image" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<ImagePlus className="h-4 w-4" />
|
||||
<span className="flex-1">图像生成</span>
|
||||
{activeComposerMode === "image" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
<DropdownMenuItem
|
||||
onClick={() => handleSelectGenerationMode("video")}
|
||||
className={cn(
|
||||
"h-8 cursor-pointer rounded-lg px-2 text-[13px] font-medium text-[#2e3238]",
|
||||
activeComposerMode === "video" ? "bg-white/80" : "hover:bg-white/70"
|
||||
)}
|
||||
>
|
||||
<Video className="h-4 w-4" />
|
||||
<span className="flex-1">视频生成</span>
|
||||
{activeComposerMode === "video" ? <Check className="h-4 w-4 text-[#3b82f6]" /> : null}
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
) : null}
|
||||
|
||||
{!isDetailGenerationMode && (!isVideoModel || showVideoAttachmentButton) && (
|
||||
{!isWorkspacePresentation && !isDetailGenerationMode && (!isVideoModel || showVideoAttachmentButton) && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
@ -9841,7 +9915,7 @@ export function CanvasChatPanel({
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 flex-shrink-0">
|
||||
{activeComposerMode === "image" ? (
|
||||
{!isWorkspacePresentation && activeComposerMode === "image" ? (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
@ -9859,7 +9933,7 @@ export function CanvasChatPanel({
|
||||
</Button>
|
||||
) : null}
|
||||
|
||||
{activeComposerMode !== "detail" ? (
|
||||
{!isWorkspacePresentation && activeComposerMode !== "detail" ? (
|
||||
<Select
|
||||
value={modelSelectValue}
|
||||
onValueChange={(value) => {
|
||||
@ -9897,9 +9971,11 @@ export function CanvasChatPanel({
|
||||
) : null}
|
||||
|
||||
<Button
|
||||
size="icon"
|
||||
size={isWorkspacePresentation ? "default" : "icon"}
|
||||
className={cn(
|
||||
"h-8 w-8 rounded-full transition-all duration-200 flex-shrink-0",
|
||||
isWorkspacePresentation
|
||||
? "h-10 rounded-full px-4 transition-all duration-200 flex-shrink-0"
|
||||
: "h-8 w-8 rounded-full transition-all duration-200 flex-shrink-0",
|
||||
isDetailGenerationMode
|
||||
? canSend
|
||||
? "bg-gradient-to-r from-violet-600 to-fuchsia-600 text-white shadow-md hover:shadow-lg hover:opacity-90 dark:from-violet-500 dark:to-fuchsia-500"
|
||||
@ -9912,11 +9988,20 @@ export function CanvasChatPanel({
|
||||
disabled={isSubmitting || !canSend}
|
||||
>
|
||||
{isSubmitting ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
<>
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
{isWorkspacePresentation ? <span className="ml-2">生成中</span> : null}
|
||||
</>
|
||||
) : isDetailGenerationMode ? (
|
||||
<Sparkles className="h-4 w-4" />
|
||||
<>
|
||||
<Sparkles className="h-4 w-4" />
|
||||
{isWorkspacePresentation ? <span className="ml-2">开始生成</span> : null}
|
||||
</>
|
||||
) : (
|
||||
<ArrowUp className="h-4 w-4" />
|
||||
<>
|
||||
<ArrowUp className="h-4 w-4" />
|
||||
{isWorkspacePresentation ? <span className="ml-2">开始生成</span> : null}
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user