lunanting/ai-chatbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: integrate image editing tools into canvas sidebar and optimize UI
Some checks failed
Lint / build (20) (push) Has been cancelled
Details
Playwright Tests / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Your Name 2026-01-24 22:18:03 +08:00
parent 0279627ecc
commit 3c2943e1cb
1 changed files with 86 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

111
app/canvas/[id]/page.tsx
View File

@ -691,32 +691,93 @@ export default function CanvasEditorPage({ params }: PageProps) {
<Separator orientation="horizontal" className="w-5 my-0.5" />
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddTextNode} className="rounded-xl h-9 w-9">
<Type className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加文本</TooltipContent>
</Tooltip>
{/* 快捷工具 - 仅在选中图片时显示 */}
{selectedImageNode ? (
<>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('rmbg')} className="rounded-xl h-9 w-9">
<Scissors className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">抠图</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddImageNode} className="rounded-xl h-9 w-9">
<ImagePlus className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加图片</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddVideoNode} className="rounded-xl h-9 w-9">
<Video className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加视频</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('enhance')} className="rounded-xl h-9 w-9">
<Sparkles className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">变清晰</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('extend')} className="rounded-xl h-9 w-9">
<Expand className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">扩展</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('resize')} className="rounded-xl h-9 w-9">
<Maximize2 className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">调整</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('angle')} className="rounded-xl h-9 w-9">
<Move3D className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">角度</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => handleAction('scene-fusion')} className="rounded-xl h-9 w-9">
<Layers className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">场景</TooltipContent>
</Tooltip>
</>
) : (
<>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddTextNode} className="rounded-xl h-9 w-9">
<Type className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加文本</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddImageNode} className="rounded-xl h-9 w-9">
<ImagePlus className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加图片</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddVideoNode} className="rounded-xl h-9 w-9">
<Video className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加视频</TooltipContent>
</Tooltip>
</>
)}
<Separator orientation="horizontal" className="w-5 my-0.5" />