diff --git a/components/image-annotator.tsx b/components/image-annotator.tsx index 5a1f8c9..9c6eb56 100644 --- a/components/image-annotator.tsx +++ b/components/image-annotator.tsx @@ -2,6 +2,8 @@ import React, { useRef, useState, useEffect, useCallback } from "react"; import { createPortal } from "react-dom"; +import Link from "next/link"; +import { useTheme } from "next-themes"; import { X, Pencil, Circle, ArrowRight, Type, Check, Undo, Trash2, Scissors, Sparkles, Download, Expand, Move, Maximize2, ZoomIn, ZoomOut, Loader2 } from "lucide-react"; import { Button } from "./ui/button"; import { Input } from "./ui/input"; @@ -83,6 +85,12 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod const [isResizing, setIsResizing] = useState(false); // 尺寸调整处理中状态 const resizeCanvasRef = useRef(null); const resizeContainerRef = useRef(null); + + // 网站设置相关状态 + const [siteName, setSiteName] = useState("AI Chatbot"); + const [siteLogo, setSiteLogo] = useState(null); + const [siteLogoDark, setSiteLogoDark] = useState(null); + const { resolvedTheme } = useTheme(); // 比例选项定义 const aspectRatios = [ @@ -145,6 +153,18 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod // 确保在客户端渲染 useEffect(() => { setMounted(true); + + // 获取网站设置 + fetch(`/api/site-settings?t=${Date.now()}`) + .then((res) => res.json()) + .then((data) => { + if (data.siteName) setSiteName(data.siteName); + if (data.siteLogo) setSiteLogo(data.siteLogo); + if (data.siteLogoDark) setSiteLogoDark(data.siteLogoDark); + }) + .catch((err) => { + console.error("[ImageAnnotator] Failed to fetch site settings:", err); + }); }, []); // 加载图片 @@ -965,20 +985,42 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod onConfirm(dataUrl); }; + // 决定显示哪个 LOGO(根据主题) + const displayLogo = resolvedTheme === "dark" && siteLogoDark + ? siteLogoDark + : siteLogo; + // 弹窗内容 const modalContent = (
- {/* 弹窗容器 - 全屏显示(保留顶部导航栏) */} + {/* 弹窗容器 - 全屏显示 */}
e.stopPropagation()} > {/* 顶部标题栏 */}
- 图片编辑 + e.stopPropagation()} + > + {displayLogo ? ( + <> + {siteName} + {siteName} + + ) : ( + {siteName} + )} +