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

polish realtime canvas controls
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-03-08 16:34:33 +08:00
parent de9bd67300
commit 591cc39e8d
1 changed files with 22 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
components/canvas/RealtimeCanvasDialog.tsx
View File

@ -760,7 +760,7 @@ export function RealtimeCanvasDialog({
const [config, setConfig] = useState<RealtimeConfig>(defaultRealtimeConfig);
const [status, setStatus] = useState<RealtimeStatus>("idle");
const [, setStatusMessage] = useState("等待连接");
const [prompt, setPrompt] = useState(FALLBACK_PROMPT);
const [prompt, setPrompt] = useState("");
const [previewUrl, setPreviewUrl] = useState("");
const [brushMode, setBrushMode] = useState<RealtimeBrushMode>("select");
const [brushColor, setBrushColor] = useState<string>(DEFAULT_BRUSH_COLOR);
@ -1671,7 +1671,9 @@ export function RealtimeCanvasDialog({
setSelectedLayerId(nextLayers[0]?.id || DRAW_LAYER_ID);
setBrushColor(project.brushColor || DEFAULT_BRUSH_COLOR);
setBrushSize(project.brushSize || 6);
setPrompt(project.prompt || FALLBACK_PROMPT);
setPrompt(
project.prompt && project.prompt !== FALLBACK_PROMPT ? project.prompt : ""
);
setPreviewUrl(project.previewUrl || "");
await loadDrawingLayerFromDataUrl(project.drawingLayerDataUrl || "");
saveHistory(nextLayers, project.canvasBackground || CANVAS_BACKGROUND);
@ -2650,8 +2652,20 @@ export function RealtimeCanvasDialog({
anchor.click();
}, [previewUrl]);
const handleCloseRealtime = useCallback(() => {
if (standalone && typeof window !== "undefined") {
if (window.history.length > 1) {
window.history.back();
return;
}
window.location.assign("/canvas");
return;
}
onOpenChange(false);
}, [onOpenChange, standalone]);
const startBlankProject = useCallback(() => {
setPrompt(FALLBACK_PROMPT);
setPrompt("");
setPreviewUrl("");
setProjectPanelOpen(false);
setSelectedLayerId(DRAW_LAYER_ID);
@ -2731,10 +2745,10 @@ export function RealtimeCanvasDialog({
</div>
<div className="pointer-events-none absolute top-6 right-6 z-50">
<div className="pointer-events-auto rounded-full border border-border/40 bg-background/80 p-1 shadow-sm backdrop-blur-md">
<div className="pointer-events-auto rounded-full border border-black bg-black p-1 shadow-sm">
<Button
className="h-9 w-9 rounded-full text-muted-foreground transition hover:bg-muted hover:text-foreground"
onClick={() => onOpenChange(false)}
className="h-9 w-9 rounded-full text-white transition hover:bg-white/10 hover:text-white"
onClick={handleCloseRealtime}
size="icon"
title="关闭"
type="button"
@ -3455,27 +3469,6 @@ export function RealtimeCanvasDialog({
</div>
</TooltipContent>
</Tooltip>
{standalone ? (
<Tooltip>
<TooltipTrigger asChild>
<Button
className="h-9 w-9 rounded-[16px] bg-primary text-primary-foreground transition hover:bg-primary/90 hover:text-primary-foreground"
onClick={() => onOpenChange(false)}
size="icon"
type="button"
variant="ghost"
>
<X className="h-4.5 w-4.5" />
</Button>
</TooltipTrigger>
<TooltipContent>
<div className="font-medium text-sm">关闭页面</div>
<div className="text-muted-foreground text-xs">
返回上一层画布
</div>
</TooltipContent>
</Tooltip>
) : null}
</div>
</TooltipProvider>
@ -3490,7 +3483,7 @@ export function RealtimeCanvasDialog({
triggerGenerate();
}
}}
placeholder="输入指令，基于当前画布实时生成"
placeholder={FALLBACK_PROMPT}
value={prompt}
/>
<div className="mt-2 flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between">
@ -3517,7 +3510,7 @@ export function RealtimeCanvasDialog({
</div>
<div className="flex items-center gap-2">
<Button
className="h-9 shrink-0 rounded-full bg-primary px-4 font-medium text-primary-foreground hover:bg-primary/90"
className="h-9 shrink-0 rounded-full bg-black px-4 font-medium text-white hover:bg-black/90"
disabled={status === "connecting"}
onClick={triggerGenerate}
size="sm"