From 7de9a8a054f0d557b79bf196d65c21bb86d0c17f Mon Sep 17 00:00:00 2001
From: oudecheng <13802883547@139.com>
Date: Fri, 7 Aug 2026 14:52:11 +0800
Subject: [PATCH] =?UTF-8?q?feat(web):=20=E9=A1=B6=E6=A0=8F=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E5=90=8E=E7=AB=AF=E7=89=88=E6=9C=AC=E5=8F=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

复用现有 /health 端点返回的 CARGO_PKG_VERSION，避免在 package.json 重复维护版本号；挂载时拉取一次，失败则不显示徽标。
---
 web/src/App.tsx       | 14 ++++++++++++++
 web/src/api/config.ts | 12 ++++++++++++
 2 files changed, 26 insertions(+)

diff --git a/web/src/App.tsx b/web/src/App.tsx
index 54097f3..6ea51c6 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -28,6 +28,7 @@ import { ConfigPage } from './components/Settings/ConfigPage';
 import { ConnectionStatus } from './components/ConnectionStatus';
 import { ChannelSelector } from './components/Header/ChannelSelector';
 import { SessionSelector } from './components/Header/SessionSelector';
+import { getVersion } from './api/config';
 import { useWebSocket } from './hooks/useWebSocket';
 import { useChat } from './hooks/useChat';
 import type {
@@ -47,6 +48,9 @@ function App() {
   const wsUrl = buildWsUrl(gatewaySettings);
   const lastAutoSwitchedTopicRef = useRef<string | null>(null);
 
+  // 后端版本号（来自 /health，源自 Cargo.toml 的 CARGO_PKG_VERSION）；挂载时拉取一次，失败则不显示。
+  const [appVersion, setAppVersion] = useState<string | null>(null);
+
   const {
     // 连接状态
     isConnected,
@@ -204,6 +208,11 @@ function App() {
     localStorage.setItem('picobot-show-thinking', String(showThinking));
   }, [showThinking]);
 
+  // 拉取后端版本号（/health 返回 CARGO_PKG_VERSION），仅一次。
+  useEffect(() => {
+    getVersion().then(setAppVersion);
+  }, []);
+
   // ---- WebSocket 初始化 ----
 
   // Step 1: 连接建立后先请求通道列表
@@ -616,6 +625,11 @@ function App() {
               <span className="text-[var(--text-primary)]">Pico</span>
               <span className="text-[var(--accent-cyan)] glow-text">Bot</span>
             </h1>
+            {appVersion && (
+              <span className="text-xs font-mono text-[var(--text-muted)] select-none">
+                v{appVersion}
+              </span>
+            )}
           </div>
           <div className="h-4 w-px bg-[var(--divider-color)]" />
           <ConnectionStatus status={status} />
diff --git a/web/src/api/config.ts b/web/src/api/config.ts
index 64919f9..b98eee9 100644
--- a/web/src/api/config.ts
+++ b/web/src/api/config.ts
@@ -37,3 +37,15 @@ export async function checkHealth(): Promise<boolean> {
     return false;
   }
 }
+
+/** 从 /health 端点获取后端版本号（源自 Cargo.toml 的 CARGO_PKG_VERSION）。 */
+export async function getVersion(): Promise<string | null> {
+  try {
+    const resp = await fetch(API.health);
+    if (!resp.ok) return null;
+    const data = (await resp.json()) as { status?: string; version?: string };
+    return data.version ?? null;
+  } catch {
+    return null;
+  }
+}