From 54fff09e748d5048a328a150d7d5fd28a3d0a9b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=89=E9=91=AB=E5=8D=87?= <xsji@kland.com.cn>
Date: Wed, 17 Jun 2026 17:35:48 +0800
Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E4=B8=8D=E5=B8=A6=20sidebar?=
 =?UTF-8?q?=20=E7=9A=84=E8=81=8A=E5=A4=A9=E9=A1=B5=E9=A1=B6=E6=A0=8F?=
 =?UTF-8?q?=E5=8F=B3=E4=BE=A7=E4=B9=9F=E5=B1=95=E7=A4=BA=E5=90=8D=E7=A7=B0?=
 =?UTF-8?q?+=E5=B2=97=E4=BD=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

紧凑布局（无全局 Header）下复用 UserIdentityBadge，数据源与全量模式 Header 一致，仅在 !compactChrome 时渲染，避免与全局顶栏重复。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../workspace/user-identity-badge.tsx         | 54 +++++++++++++++++++
 frontend-web/src/pages/ChatPage.tsx           | 12 +++++
 2 files changed, 66 insertions(+)
 create mode 100644 frontend-web/src/components/workspace/user-identity-badge.tsx

diff --git a/frontend-web/src/components/workspace/user-identity-badge.tsx b/frontend-web/src/components/workspace/user-identity-badge.tsx
new file mode 100644
index 00000000..5929040e
--- /dev/null
+++ b/frontend-web/src/components/workspace/user-identity-badge.tsx
@@ -0,0 +1,54 @@
+"use client";
+
+import { User } from "lucide-react";
+import { useMemo } from "react";
+
+import { getStoredAuth } from "@/core/auth";
+import { useMyPosition } from "@/core/positions";
+import { cn } from "@/lib/utils";
+import { readUserInfo } from "@/strategy-components/lib/light-app";
+
+/**
+ * 名称 + 岗位 用户标识。全量模式由 strategy-components/Header.tsx 顶栏右侧展示；
+ * 紧凑模式（不带全局顶栏）无处承载，故抽成共享组件，复用同一套数据来源
+ * （`readUserInfo().userName` 优先、回退 auth 邮箱前缀；岗位取 `useMyPosition`），
+ * 供页面级顶栏（如 ChatPage）右侧复用，保证两套布局一致。
+ *
+ * 配色按当前内容区前景色（foreground / muted-foreground），适配聊天页浅底顶栏，
+ * 而非 Header 的白字贴 banner 方案。
+ */
+export function UserIdentityBadge({ className }: { className?: string }) {
+  const auth = getStoredAuth();
+  const { data: myPosition } = useMyPosition();
+  const positionName = myPosition?.name?.trim() || "";
+
+  // 与 Header.tsx 一致：外部登录写入的真实用户名优先，缺省回退邮箱前缀。
+  const displayName = useMemo(() => {
+    const info = readUserInfo();
+    const name = typeof info.userName === "string" ? info.userName.trim() : "";
+    if (name) return name;
+    const email = auth?.email?.trim();
+    return email ? email.split("@")[0] : "用户";
+  }, [auth?.email]);
+
+  return (
+    <div
+      className={cn("flex shrink-0 items-center gap-2", className)}
+      title={positionName ? `${displayName}·${positionName}` : displayName}
+    >
+      <div className="bg-muted text-muted-foreground flex size-7 shrink-0 items-center justify-center rounded-full">
+        <User className="size-3.5" />
+      </div>
+      <div className="hidden min-w-0 text-left sm:block">
+        <p className="text-foreground truncate text-sm font-medium leading-tight">
+          {displayName}
+        </p>
+        {positionName && (
+          <p className="text-muted-foreground truncate text-[11px] leading-tight">
+            {positionName}
+          </p>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/frontend-web/src/pages/ChatPage.tsx b/frontend-web/src/pages/ChatPage.tsx
index 81f21b66..b1c24df3 100644
--- a/frontend-web/src/pages/ChatPage.tsx
+++ b/frontend-web/src/pages/ChatPage.tsx
@@ -27,6 +27,7 @@ import { QuestionNavigator } from "@/components/workspace/question-navigator";
 import { ThreadTitle } from "@/components/workspace/thread-title";
 import { TodoList } from "@/components/workspace/todo-list";
 import { TokenUsageIndicator } from "@/components/workspace/token-usage-indicator";
+import { UserIdentityBadge } from "@/components/workspace/user-identity-badge";
 import { Welcome } from "@/components/workspace/welcome";
 import { CompactWelcome } from "@/components/workspace/compact-welcome";
 import { readSidebarEnabled } from "@/core/page-layout/sidebar-enabled";
@@ -481,6 +482,17 @@ export default function ChatPage() {
               <ExportTrigger threadId={threadId} />
               <KnowledgeSaveTrigger threadId={threadId} />
               <ArtifactTrigger />
+              {/* 不带全局顶栏（紧凑模式）时，名称+岗位回落到聊天页顶栏右侧，
+                  与全量模式 Header 右上角保持一致。全量模式已有顶栏则不重复展示。 */}
+              {!compactChrome && (
+                <>
+                  <div
+                    className="bg-border/70 mx-1 h-6 w-px shrink-0"
+                    aria-hidden
+                  />
+                  <UserIdentityBadge />
+                </>
+              )}
             </div>
           </header>
           <main className="flex min-h-0 max-w-full grow flex-col">