From 5b19e6deba1669762ca87bf9f99ec2b24a4a6e29 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Fri, 19 Dec 2025 01:20:58 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=9B=BE=E7=89=87=E6=A0=87?=
 =?UTF-8?q?=E6=B3=A8=E5=92=8C=E5=8A=A0=E8=BD=BD=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/gemini-image-loading.tsx |  2 +-
 components/image-annotator.tsx      | 49 ++++++++++++++++++++++-------
 2 files changed, 39 insertions(+), 12 deletions(-)

diff --git a/components/gemini-image-loading.tsx b/components/gemini-image-loading.tsx
index d5ff5fc72..d98f04b55 100644
--- a/components/gemini-image-loading.tsx
+++ b/components/gemini-image-loading.tsx
@@ -119,7 +119,7 @@ export const GeminiImageLoading = memo(() => {
           
           {/* 提示文字 */}
           <span className="text-xs text-muted-foreground">
-            Gemini 正在创作 2 张图片，请稍候...
+            NanoBananaPro 正在创作 2 张图片，请稍候...
           </span>
         </div>
       </div>
diff --git a/components/image-annotator.tsx b/components/image-annotator.tsx
index d44f81123..702aa84ee 100644
--- a/components/image-annotator.tsx
+++ b/components/image-annotator.tsx
@@ -55,13 +55,19 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel }: ImageAnnotator
   const [textPosition, setTextPosition] = useState<{ x: number; y: number } | null>(null);
   const [scale, setScale] = useState(1);
   const [offset, setOffset] = useState({ x: 0, y: 0 });
+  const [isLoading, setIsLoading] = useState(true);
 
   // 加载图片
   useEffect(() => {
+    setIsLoading(true);
     const img = new window.Image();
     img.crossOrigin = "anonymous";
     img.onload = () => {
       setImage(img);
+      setIsLoading(false);
+    };
+    img.onerror = () => {
+      setIsLoading(false);
     };
     img.src = imageUrl;
   }, [imageUrl]);
@@ -428,17 +434,38 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel }: ImageAnnotator
 
         {/* 画布区域 */}
         <div ref={containerRef} className="flex flex-1 items-center justify-center overflow-hidden bg-muted/30 p-4">
-          <canvas
-            ref={canvasRef}
-            className="cursor-crosshair rounded-lg shadow-lg"
-            onMouseDown={handleStart}
-            onMouseMove={handleMove}
-            onMouseUp={handleEnd}
-            onMouseLeave={handleEnd}
-            onTouchStart={handleStart}
-            onTouchMove={handleMove}
-            onTouchEnd={handleEnd}
-          />
+          {isLoading ? (
+            /* 加载动画 */
+            <div className="flex flex-col items-center justify-center gap-3">
+              <div className="flex items-center gap-1">
+                <span 
+                  className="h-2 w-2 rounded-full bg-primary animate-bounce"
+                  style={{ animationDelay: "0ms" }}
+                />
+                <span 
+                  className="h-2 w-2 rounded-full bg-primary animate-bounce"
+                  style={{ animationDelay: "150ms" }}
+                />
+                <span 
+                  className="h-2 w-2 rounded-full bg-primary animate-bounce"
+                  style={{ animationDelay: "300ms" }}
+                />
+              </div>
+              <span className="text-sm text-muted-foreground">正在加载图片...</span>
+            </div>
+          ) : (
+            <canvas
+              ref={canvasRef}
+              className="cursor-crosshair rounded-lg shadow-lg"
+              onMouseDown={handleStart}
+              onMouseMove={handleMove}
+              onMouseUp={handleEnd}
+              onMouseLeave={handleEnd}
+              onTouchStart={handleStart}
+              onTouchMove={handleMove}
+              onTouchEnd={handleEnd}
+            />
+          )}
         </div>
       </div>