fix: remove quick tools tab from canvas sidebar
This commit is contained in:
Your Name
parent
3c2943e1cb
commit
77b2b765ea
@ -463,18 +463,13 @@ export default function CanvasEditorPage({ params }: PageProps) {
|
||||
isPanelOpen ? "translate-x-0 opacity-100" : "translate-x-[120%] opacity-0"
|
||||
)}>
|
||||
<div className="h-full w-full rounded-2xl border bg-background/95 backdrop-blur-md shadow-2xl overflow-hidden flex flex-col">
|
||||
<Tabs defaultValue="chat" className="flex flex-col h-full">
|
||||
{/* 移除 Tabs 组件，直接显示 AI 对话面板 */}
|
||||
<div className="flex flex-col h-full">
|
||||
<div className="px-4 pt-4 pb-2 bg-muted/30 border-b flex items-center justify-between">
|
||||
<TabsList className="grid w-[calc(100%-40px)] grid-cols-2">
|
||||
<TabsTrigger value="chat" className="text-xs">
|
||||
<MessageSquare className="h-3.5 w-3.5 mr-1.5" />
|
||||
AI 对话
|
||||
</TabsTrigger>
|
||||
<TabsTrigger value="tools" className="text-xs">
|
||||
<Wand2 className="h-3.5 w-3.5 mr-1.5" />
|
||||
快捷工具
|
||||
</TabsTrigger>
|
||||
</TabsList>
|
||||
<div className="flex items-center gap-2 text-sm font-medium">
|
||||
<MessageSquare className="h-4 w-4" />
|
||||
AI 对话
|
||||
</div>
|
||||
|
||||
{/* Integrated Close Button */}
|
||||
<Tooltip>
|
||||
@ -492,168 +487,11 @@ export default function CanvasEditorPage({ params }: PageProps) {
|
||||
</Tooltip>
|
||||
</div>
|
||||
|
||||
{/* AI 对话标签页 */}
|
||||
<TabsContent value="chat" className="flex-1 overflow-hidden m-0">
|
||||
{/* AI 对话内容 */}
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<CanvasChatPanel chatId={`canvas-${id}`} />
|
||||
</TabsContent>
|
||||
|
||||
{/* 快捷工具标签页 */}
|
||||
<TabsContent value="tools" className="flex-1 overflow-hidden m-0">
|
||||
<ScrollArea className="h-full">
|
||||
<div className="p-4 space-y-6">
|
||||
{/* AI 图片生成 */}
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Wand2 className="h-4 w-4 text-primary" />
|
||||
<h3 className="font-semibold text-sm">AI 图片生成</h3>
|
||||
</div>
|
||||
|
||||
<div className="space-y-3">
|
||||
<div className="space-y-2">
|
||||
<Label className="text-xs">提示词</Label>
|
||||
<Textarea
|
||||
placeholder="描述你想要生成的图片..."
|
||||
value={prompt}
|
||||
onChange={(e) => setPrompt(e.target.value)}
|
||||
className="min-h-[100px] text-sm resize-none bg-muted/30"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label className="text-xs">负面提示词</Label>
|
||||
<Textarea
|
||||
placeholder="描述你不想出现的内容..."
|
||||
value={negativePrompt}
|
||||
onChange={(e) => setNegativePrompt(e.target.value)}
|
||||
className="min-h-[60px] text-sm resize-none bg-muted/30"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label className="text-xs">尺寸比例</Label>
|
||||
<Select value={aspectRatio} onValueChange={setAspectRatio}>
|
||||
<SelectTrigger className="h-9 bg-muted/30">
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{SIZE_PRESETS.map((preset) => (
|
||||
<SelectItem key={preset.value} value={preset.value}>
|
||||
{preset.label} ({preset.width}×{preset.height})
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<Label className="text-xs">生成数量</Label>
|
||||
<span className="text-xs text-muted-foreground">{imageCount}</span>
|
||||
</div>
|
||||
<Slider
|
||||
value={[imageCount]}
|
||||
onValueChange={([v]) => setImageCount(v)}
|
||||
min={1}
|
||||
max={4}
|
||||
step={1}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
className="w-full"
|
||||
onClick={handleGenerate}
|
||||
disabled={isGenerating || !prompt.trim()}
|
||||
>
|
||||
{isGenerating ? (
|
||||
<>
|
||||
<Loader2 className="h-4 w-4 mr-2 animate-spin" />
|
||||
生成中...
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Sparkles className="h-4 w-4 mr-2" />
|
||||
开始生成
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
{/* 图片编辑工具 */}
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Settings className="h-4 w-4 text-primary" />
|
||||
<h3 className="font-semibold text-sm">图片编辑工具</h3>
|
||||
</div>
|
||||
|
||||
{selectedImageNode ? (
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Scissors className="h-4 w-4 mr-2" />
|
||||
抠图
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Sparkles className="h-4 w-4 mr-2" />
|
||||
变清晰
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Expand className="h-4 w-4 mr-2" />
|
||||
扩展
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Maximize2 className="h-4 w-4 mr-2" />
|
||||
调整
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Move3D className="h-4 w-4 mr-2" />
|
||||
角度
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Layers className="h-4 w-4 mr-2" />
|
||||
场景
|
||||
</Button>
|
||||
</div>
|
||||
) : (
|
||||
<p className="text-xs text-muted-foreground text-center py-4 bg-muted/20 rounded-lg border border-dashed">
|
||||
选中图片节点以使用编辑工具
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
{/* 快捷操作 */}
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center gap-2">
|
||||
<Grid3X3 className="h-4 w-4 text-primary" />
|
||||
<h3 className="font-semibold text-sm">快捷操作</h3>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30" onClick={handleAddImageNode}>
|
||||
<ImagePlus className="h-4 w-4 mr-2" />
|
||||
添加图片
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30" onClick={handleAddTextNode}>
|
||||
<Type className="h-4 w-4 mr-2" />
|
||||
添加文本
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Upload className="h-4 w-4 mr-2" />
|
||||
上传图片
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="h-9 justify-start bg-muted/30">
|
||||
<Download className="h-4 w-4 mr-2" />
|
||||
导出
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ScrollArea>
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user