Merge branch 'master' of http://192.168.0.200/knowledge-base-bj/deerflow-server into dhk-dev

# Conflicts:
#	frontend-web/src/open-canvas/components/ai-writing/AIWritingForm.tsx
#	frontend-web/src/open-canvas/components/ai-writing/AIWritingPanel.tsx
#	offline-backend-20260512/backend/CLAUDE.md
#	offline-backend-20260512/backend/app/gateway/services.py
#	offline-backend-20260512/backend/tests/test_ai_writing_knowledge_base.py

frontend-web/src/components/ai-elements/code-block.tsx

@@ -1,7 +1,8 @@
 "use client";
 
-import { Button } from "@/components/ui/button";
-import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+import { copyTextToClipboard } from "@/core/clipboard";
+import { cn } from "@/lib/utils";
 import { CheckIcon, CopyIcon } from "lucide-react";
 import {
   type ComponentProps,
@@ -144,18 +145,13 @@ export const CodeBlockCopyButton = ({
   ...props
 }: CodeBlockCopyButtonProps) => {
   const [isCopied, setIsCopied] = useState(false);
-  const { code } = useContext(CodeBlockContext);
-
-  const copyToClipboard = async () => {
-    if (typeof window === "undefined" || !navigator?.clipboard?.writeText) {
-      onError?.(new Error("Clipboard API not available"));
-      return;
-    }
-
-    try {
-      await navigator.clipboard.writeText(code);
-      setIsCopied(true);
-      onCopy?.();
+  const { code } = useContext(CodeBlockContext);
+
+  const copyToClipboard = async () => {
+    try {
+      await copyTextToClipboard(code);
+      setIsCopied(true);
+      onCopy?.();
       setTimeout(() => setIsCopied(false), timeout);
     } catch (error) {
       onError?.(error as Error);

frontend-web/src/components/page-sidebar.tsx

@@ -7,6 +7,7 @@ import {
   ChevronsUpDown,
   Folder,
   FolderOpen,
+  Gauge,
   ListTree,
   MousePointerClick,
   Settings,
@@ -231,6 +232,14 @@ function SecondaryNavSidebar() {
                       白名单管理
                     </DropdownMenuItem>
                   )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() => navigate("/page/strategy/settings/model-concurrency")}
+                    >
+                      <Gauge className="size-4" />
+                      模型并发限制
+                    </DropdownMenuItem>
+                  )}
                   {canManageSensitiveWords() && (
                     <DropdownMenuItem
                       onClick={() => navigate("/page/strategy/admin/sensitive-words")}

frontend-web/src/components/workspace/agents/agent-chat-sidebar.tsx

@@ -260,37 +260,68 @@ export function AgentChatSidebar({ activeAgentId }: { activeAgentId?: string })
                         key={agent.id}
                         href={href}
                         className={cn(
-                          "group relative flex w-full items-start gap-2.5 rounded-xl border px-2.5 py-2 transition-colors",
+                          "group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 transition-all duration-150",
                           isActive
-                            ? "border-primary/40 bg-primary/5"
-                            : "border-transparent hover:border-border hover:bg-accent/50",
+                            ? isDark
+                              ? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
+                              : "border-primary/50 bg-primary/10 shadow-sm"
+                            : isDark
+                              ? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
+                              : "border-transparent hover:border-border hover:bg-accent/50",
                         )}
                       >
                         <span
-                          className="mt-0.5 flex size-9 shrink-0 items-center justify-center rounded-lg text-white shadow-sm"
+                          className={cn(
+                            "mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
+                            isDark &&
+                              isActive &&
+                              "ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
+                          )}
                           style={{
                             backgroundImage: `linear-gradient(135deg, ${from}, ${to})`,
                           }}
                         >
-                          <Bot className="size-[18px]" />
+                          <Bot className="size-[19px]" />
                         </span>
                         <span className="min-w-0 flex-1">
                           <span
                             className={cn(
-                              "block truncate text-[13px] font-semibold",
-                              isActive ? "text-primary" : "text-foreground",
+                              "block truncate text-[16px] leading-5 font-bold",
+                              isActive
+                                ? isDark
+                                  ? "text-white"
+                                  : "text-primary"
+                                : isDark
+                                  ? "text-white/95"
+                                  : "text-foreground",
                             )}
                           >
                             {desensitize(agent.name)}
                           </span>
-                          <span className="mt-0.5 block truncate text-[11px] leading-snug text-muted-foreground">
+                          <span
+                            className={cn(
+                              "mt-1 block truncate text-[13px] leading-[1.35]",
+                              isDark
+                                ? isActive
+                                  ? "text-[#d6eaff]"
+                                  : "text-[#9ebfe2]"
+                                : "text-muted-foreground",
+                            )}
+                          >
                             {agent.description
                               ? desensitize(agent.description)
                               : "智能体助手"}
                           </span>
                         </span>
                         {isActive && (
-                          <span className="absolute top-1/2 right-1 h-6 w-1 -translate-y-1/2 rounded-full bg-primary" />
+                          <span
+                            className={cn(
+                              "absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
+                              isDark
+                                ? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
+                                : "bg-primary",
+                            )}
+                          />
                         )}
                       </Link>
                     );

frontend-web/src/components/workspace/agents/agent-detail-panel.tsx

@@ -138,6 +138,7 @@ export function AgentDetailPanel({
   disabled,
   defaultCollapsed,
   showRecentChats,
+  compactAppearanceActions,
 }: {
   agent: Agent | null | undefined;
   agentName: string;
@@ -147,6 +148,8 @@ export function AgentDetailPanel({
   defaultCollapsed?: boolean;
   /** 在面板底部展示「有关此智能体的最近对话」（仅智能体问答页开启，任务工作区不展示）。 */
   showRecentChats?: boolean;
+  /** 简洁模式下挂在右上角收起/展开按钮左侧的外观控件。 */
+  compactAppearanceActions?: ReactNode;
 }) {
   const router = useRouter();
   const [collapsed, setCollapsed] = useState(defaultCollapsed ?? false);
@@ -830,6 +833,7 @@ export function AgentDetailPanel({
         <span className="text-sm font-semibold">智能体信息</span>
         <div className="flex items-center gap-1">
           {headerActions}
+          {compactAppearanceActions}
           {collapseButton}
         </div>
       </div>
@@ -841,17 +845,20 @@ export function AgentDetailPanel({
     <>
       {/* ── Desktop (lg+): inline aside, collapsible to a rail ───────────── */}
       {collapsed ? (
-        <div className="hidden shrink-0 flex-col items-center border-l pt-3 lg:flex">
-          <Tooltip content="智能体信息">
-            <Button
-              variant="ghost"
-              size="icon-sm"
-              onClick={() => setCollapsed(false)}
-              aria-label="展开智能体信息"
-            >
-              <PanelRightOpenIcon className="size-4" />
-            </Button>
-          </Tooltip>
+        <div className="hidden shrink-0 items-start border-l px-2 pt-3 lg:flex">
+          <div className="flex items-center gap-1">
+            {compactAppearanceActions}
+            <Tooltip content="智能体信息">
+              <Button
+                variant="ghost"
+                size="icon-sm"
+                onClick={() => setCollapsed(false)}
+                aria-label="展开智能体信息"
+              >
+                <PanelRightOpenIcon className="size-4" />
+              </Button>
+            </Tooltip>
+          </div>
         </div>
       ) : (
         <aside className="bg-card/40 hidden h-full w-[360px] shrink-0 flex-col border-l lg:flex">

frontend-web/src/components/workspace/agents/agent-module-sidebar.tsx

@@ -211,34 +211,72 @@ export function AgentModuleSidebar({
       <Link
         key={`${keyPrefix}:${agent.id}`}
         href={href}
+        onClick={() => {
+          try {
+            sessionStorage.setItem(`agent-module:${moduleKey}:last-agent`, agent.id);
+          } catch {
+            // Ignore storage failures; route navigation is the source of truth.
+          }
+        }}
         className={cn(
-          "group relative flex w-full items-start gap-2.5 rounded-xl border px-2.5 py-2 transition-colors",
+          "group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 transition-all duration-150",
           isActive
-            ? "border-primary/40 bg-primary/5"
-            : "border-transparent hover:border-border hover:bg-accent/50",
+            ? isDark
+              ? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
+              : "border-primary/50 bg-primary/10 shadow-sm"
+            : isDark
+              ? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
+              : "border-transparent hover:border-border hover:bg-accent/50",
         )}
       >
         <span
-          className="mt-0.5 flex size-9 shrink-0 items-center justify-center rounded-lg text-white shadow-sm"
+          className={cn(
+            "mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
+            isDark &&
+              isActive &&
+              "ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
+          )}
           style={{ backgroundImage: `linear-gradient(135deg, ${from}, ${to})` }}
         >
-          <Bot className="size-[18px]" />
+          <Bot className="size-[19px]" />
         </span>
         <span className="min-w-0 flex-1">
           <span
             className={cn(
-              "block truncate text-[13px] font-semibold",
-              isActive ? "text-primary" : "text-foreground",
+              "block truncate text-[16px] leading-5 font-bold",
+              isActive
+                ? isDark
+                  ? "text-white"
+                  : "text-primary"
+                : isDark
+                  ? "text-white/95"
+                  : "text-foreground",
             )}
           >
             {desensitize(agent.name)}
           </span>
-          <span className="mt-0.5 block truncate text-[11px] leading-snug text-muted-foreground">
+          <span
+            className={cn(
+              "mt-1 block truncate text-[13px] leading-[1.35]",
+              isDark
+                ? isActive
+                  ? "text-[#d6eaff]"
+                  : "text-[#9ebfe2]"
+                : "text-muted-foreground",
+            )}
+          >
             {agent.description ? desensitize(agent.description) : "智能体助手"}
           </span>
         </span>
         {isActive && (
-          <span className="absolute top-1/2 right-1 h-6 w-1 -translate-y-1/2 rounded-full bg-primary" />
+          <span
+            className={cn(
+              "absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
+              isDark
+                ? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
+                : "bg-primary",
+            )}
+          />
         )}
       </Link>
     );

frontend-web/src/components/workspace/agents/agent-selector.tsx

@@ -20,6 +20,7 @@ import {
 } from "@/components/ui/dialog";
 import { PromptInputButton } from "@/components/ai-elements/prompt-input";
 import { AgentManageDialog } from "@/components/workspace/agents/agent-manage-dialog";
+import { Tooltip } from "@/components/workspace/tooltip";
 import { useAgentSelector, useAgentsPaginated } from "@/core/agents";
 import type { Agent } from "@/core/agents";
 import { getStoredAuth } from "@/core/auth";
@@ -86,6 +87,7 @@ export function AgentSelector({
   };
 
   const triggerLabel = selectedAgent ? desensitize(selectedAgent.name) : "选择 Agent";
+  const iconTooltipLabel = selectedAgent ? triggerLabel : "未选择";
   const iconMode = triggerVariant === "icon";
 
   return (
@@ -93,38 +95,40 @@ export function AgentSelector({
       <Dialog open={open} onOpenChange={setOpen}>
         <DialogTrigger asChild>
           {iconMode ? (
-            <Button
-              type="button"
-              variant="ghost"
-              size="icon"
-              disabled={disabled}
-              aria-label={selectedAgent ? `已选择智能体：${triggerLabel}` : "选择智能体"}
-              className={cn(
-                "relative size-9 rounded-full text-muted-foreground shadow-none hover:bg-muted/60 hover:text-foreground",
-                selectedAgent && "text-amber-600 hover:text-amber-700",
-                selectedAgent && iconActiveClassName,
-                iconButtonClassName,
-              )}
-            >
-              <BotIcon className="size-4" />
-              {selectedAgent && (
-                <span
-                  role="button"
-                  tabIndex={0}
-                  aria-label="清除已选 agent"
-                  className="absolute -right-1 -top-1 inline-flex size-4 items-center justify-center rounded-full border bg-background text-foreground shadow-sm hover:bg-muted"
-                  onClick={handleClear}
-                  onKeyDown={(e) => {
-                    if (e.key === "Enter" || e.key === " ") {
-                      e.preventDefault();
-                      onAgentChange(null);
-                    }
-                  }}
-                >
-                  <XIcon className="size-2.5" />
-                </span>
-              )}
-            </Button>
+            <Tooltip content={iconTooltipLabel}>
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon"
+                disabled={disabled}
+                aria-label={selectedAgent ? `已选择智能体：${triggerLabel}` : "选择智能体"}
+                className={cn(
+                  "relative size-9 rounded-full text-muted-foreground shadow-none hover:bg-muted/60 hover:text-foreground",
+                  selectedAgent && "text-amber-600 hover:text-amber-700",
+                  selectedAgent && iconActiveClassName,
+                  iconButtonClassName,
+                )}
+              >
+                <BotIcon className="size-4" />
+                {selectedAgent && (
+                  <span
+                    role="button"
+                    tabIndex={0}
+                    aria-label="清除已选 agent"
+                    className="absolute -right-1 -top-1 inline-flex size-4 items-center justify-center rounded-full border bg-background text-foreground shadow-sm hover:bg-muted"
+                    onClick={handleClear}
+                    onKeyDown={(e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        onAgentChange(null);
+                      }
+                    }}
+                  >
+                    <XIcon className="size-2.5" />
+                  </span>
+                )}
+              </Button>
+            </Tooltip>
           ) : (
             <PromptInputButton
               type="button"

frontend-web/src/components/workspace/appearance-controls.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Check, LayoutIcon, PanelLeftIcon, Shirt } from "lucide-react";
+import { Check, ExternalLink, LayoutIcon, PanelLeftIcon, Shirt } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 import { useNavigate } from "react-router-dom";
 
@@ -14,8 +14,9 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { useTheme, type ThemeType } from "@/contexts/ThemeContext";
-import { useLayoutMode } from "@/core/system-settings/hooks";
+import { useAppearanceSettings, useLayoutMode } from "@/core/system-settings/hooks";
 import { cn } from "@/lib/utils";
+import { buildLightAppUrl } from "@/strategy-components/lib/light-app";
 
 /**
  * 换肤 / 界面模式 顶栏控件。深色顶栏（Header）与简洁模式页面级顶栏（ChatPage 等）共用，
@@ -39,6 +40,43 @@ const triggerToneClass = (tone: AppearanceControlTone) =>
       ? "text-white hover:bg-[var(--brand-950)] hover:text-white active:bg-[#8a0618]"
       : "text-muted-foreground hover:bg-muted hover:text-foreground";
 
+export function CompactShortcutButtons({ tone }: { tone: AppearanceControlTone }) {
+  const { data: appearance } = useAppearanceSettings();
+  const buttons = (appearance?.compact_shortcut_buttons ?? [])
+    .filter((button) => button.enabled && button.label.trim() && button.url.trim())
+    .sort((a, b) => a.sort_order - b.sort_order);
+
+  if (buttons.length === 0) return null;
+
+  return (
+    <>
+      {buttons.map((button) => (
+        <Button
+          key={button.id}
+          type="button"
+          variant="ghost"
+          size="sm"
+          className={cn(
+            "h-8 max-w-[168px] shrink-0 gap-1.5 rounded-sm px-2 text-xs font-medium",
+            triggerToneClass(tone),
+          )}
+          title={button.label}
+          onClick={() => {
+            const url = buildLightAppUrl({
+              url: button.url,
+              routeParams: button.route_params.map((param) => ({ ...param })),
+            });
+            window.open(url, "_blank", "noopener,noreferrer");
+          }}
+        >
+          <ExternalLink className="size-4 shrink-0" />
+          <span className="truncate">{button.label}</span>
+        </Button>
+      ))}
+    </>
+  );
+}
+
 export function ThemeSwitcher({ tone }: { tone: AppearanceControlTone }) {
   const { theme, setTheme } = useTheme();
   const [open, setOpen] = useState(false);
@@ -136,9 +174,11 @@ const LAYOUT_OPTIONS = [
 export function LayoutModeSwitcher({
   tone,
   fallback = "compact",
+  navigateTo = "/page/workspace/chats/new",
 }: {
   tone: AppearanceControlTone;
   fallback?: "full" | "compact";
+  navigateTo?: string | null;
 }) {
   const [mode, setLayoutMode] = useLayoutMode();
   const navigate = useNavigate();
@@ -170,7 +210,9 @@ export function LayoutModeSwitcher({
               key={option.id}
               onClick={() => {
                 setLayoutMode(option.id);
-                navigate("/page/workspace/chats/new");
+                if (navigateTo) {
+                  navigate(navigateTo);
+                }
               }}
               className="gap-2"
             >

frontend-web/src/components/workspace/artifacts/artifact-file-detail.tsx

@@ -29,7 +29,7 @@ import {
   ArtifactHeader,
   ArtifactTitle,
 } from "@/components/ai-elements/artifact";
-import { Select, SelectItem } from "@/components/ui/select";
+import { Select, SelectItem } from "@/components/ui/select";
 import {
   SelectContent,
   SelectGroup,
@@ -41,7 +41,8 @@ import { CodeEditor } from "@/components/workspace/code-editor";
 import { MarkdownAiEditor } from "@/open-canvas/components/artifact/MarkdownAiEditor";
 import { publishArtifactToKnowledge } from "@/core/agents/api";
 import { useAgent } from "@/core/agents/hooks";
-import { apiFetch } from "@/core/api";
+import { apiFetch } from "@/core/api";
+import { copyTextToClipboard } from "@/core/clipboard";
 import {
   downloadArtifactFile,
 } from "@/core/artifacts/download";
@@ -51,9 +52,8 @@ import {
 } from "@/core/artifacts/hooks";
 import { resolveArtifactURL, urlOfArtifact } from "@/core/artifacts/utils";
 import { useI18n } from "@/core/i18n/hooks";
-import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
-import { installSkill } from "@/core/skills/api";
-import { streamdownPlugins } from "@/core/streamdown";
+import { downloadMarkdownAsDocx } from "@/core/scheduled-tasks/markdown-docx";
+import { streamdownPlugins } from "@/core/streamdown";
 import {
   checkCodeFile,
   getFileName,
@@ -81,7 +81,8 @@ import { useThread } from "../messages/context";
 import { Tooltip } from "../tooltip";
 
 import { useArtifacts } from "./context";
-import { SpreadsheetPreview } from "./spreadsheet-preview";
+import { SpreadsheetPreview } from "./spreadsheet-preview";
+import { SkillInstallDialog } from "./skill-install-dialog";
 
 const SANDBOX_RESUME_EVENT = "workspace:sandbox-resume-autoscroll";
 
@@ -238,7 +239,7 @@ export function ArtifactFileDetail({
 
   const [viewMode, setViewMode] = useState<"code" | "preview" | "edit">("code");
   const [allowAutoViewSwitch, setAllowAutoViewSwitch] = useState(true);
-  const [isInstalling, setIsInstalling] = useState(false);
+  const [installDialogOpen, setInstallDialogOpen] = useState(false);
   const [showPreviewSwitchPulse, setShowPreviewSwitchPulse] = useState(false);
   const [autoScrollEnabled, setAutoScrollEnabled] = useState(true);
   const [showResumeAutoScroll, setShowResumeAutoScroll] = useState(false);
@@ -439,29 +440,7 @@ export function ArtifactFileDetail({
     }, 1600);
   }, [scrollArtifactToBottom]);
 
-  const handleInstallSkill = useCallback(async () => {
-    if (isInstalling) return;
-
-    setIsInstalling(true);
-    try {
-      const result = await installSkill({
-        thread_id: threadId,
-        path: filepath,
-      });
-      if (result.success) {
-        toast.success(result.message);
-      } else {
-        toast.error(result.message ?? "Failed to install skill");
-      }
-    } catch (error) {
-      console.error("Failed to install skill:", error);
-      toast.error("Failed to install skill");
-    } finally {
-      setIsInstalling(false);
-    }
-  }, [threadId, filepath, isInstalling]);
-
-  const handleSaveArtifact = useCallback(async () => {
+  const handleSaveArtifact = useCallback(async () => {
     if (!canEditArtifact || updateArtifact.isPending) {
       return;
     }
@@ -704,18 +683,17 @@ export function ArtifactFileDetail({
             )}
             {!useWriteFileStreaming && filepath.endsWith(".skill") && (
               <Tooltip content={t.toolCalls.skillInstallTooltip}>
-                <ArtifactAction
-                  icon={isInstalling ? LoaderIcon : PackageIcon}
-                  label={t.common.install}
-                  tooltip={t.common.install}
-                  disabled={
-                    isInstalling ||
-                    env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true"
-                  }
-                  onClick={handleInstallSkill}
-                />
-              </Tooltip>
-            )}
+                <ArtifactAction
+                  icon={PackageIcon}
+                  label={t.common.install}
+                  tooltip={t.common.install}
+                  disabled={
+                    env.NEXT_PUBLIC_STATIC_WEBSITE_ONLY === "true"
+                  }
+                  onClick={() => setInstallDialogOpen(true)}
+                />
+              </Tooltip>
+            )}
             {isCodeFile && (
               <ArtifactAction
                 icon={CopyIcon}
@@ -723,7 +701,7 @@ export function ArtifactFileDetail({
                 disabled={!content}
                 onClick={async () => {
                   try {
-                    await navigator.clipboard.writeText(displayContent ?? "");
+                    await copyTextToClipboard(displayContent ?? "");
                     toast.success(t.clipboard.copiedToClipboard);
                   } catch (error) {
                     toast.error("Failed to copy to clipboard");
@@ -733,7 +711,7 @@ export function ArtifactFileDetail({
                 tooltip={t.clipboard.copyToClipboard}
               />
             )}
-            {!useWriteFileStreaming && language === "markdown" && (
+            {language === "markdown" && (
               <ArtifactAction
                 icon={isExportingWord ? LoaderIcon : FileType2Icon}
                 label="另存为 Word"
@@ -800,7 +778,7 @@ export function ArtifactFileDetail({
           </ArtifactActions>
         </div>
       </ArtifactHeader>
-      <ArtifactContent
+      <ArtifactContent
         ref={artifactContentRef}
         className="relative p-0"
         onWheelCapture={handlePauseAutoScroll}
@@ -888,10 +866,16 @@ export function ArtifactFileDetail({
               {t.common.loading}
             </div>
           ))}
-      </ArtifactContent>
-    </Artifact>
-  );
-}
+      </ArtifactContent>
+      <SkillInstallDialog
+        open={installDialogOpen}
+        onOpenChange={setInstallDialogOpen}
+        threadId={threadId}
+        filepath={filepath}
+      />
+    </Artifact>
+  );
+}
 
 function SandboxPreviewImage({
   src,

frontend-web/src/components/workspace/artifacts/artifact-file-list.tsx

@@ -1,6 +1,6 @@
-import { DownloadIcon, LoaderIcon, PackageIcon } from "lucide-react";
-import { useCallback, useState } from "react";
-import { toast } from "sonner";
+import { DownloadIcon, LoaderIcon, PackageIcon } from "lucide-react";
+import { useCallback, useState } from "react";
+import { toast } from "sonner";
 
 import { Button } from "@/components/ui/button";
 import {
@@ -10,18 +10,18 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card";
-import { downloadArtifactFile } from "@/core/artifacts/download";
-import { useI18n } from "@/core/i18n/hooks";
-import { installSkill } from "@/core/skills/api";
-import {
-  getFileExtensionDisplayName,
-  getFileIcon,
-  getFileName,
-} from "@/core/utils/files";
+import { downloadArtifactFile } from "@/core/artifacts/download";
+import { useI18n } from "@/core/i18n/hooks";
+import {
+  getFileExtensionDisplayName,
+  getFileIcon,
+  getFileName,
+} from "@/core/utils/files";
 import { cn } from "@/lib/utils";
 
-import { useThread } from "../messages/context";
-import { useArtifacts } from "./context";
+import { useThread } from "../messages/context";
+import { useArtifacts } from "./context";
+import { SkillInstallDialog } from "./skill-install-dialog";
 
 export function ArtifactFileList({
   className,
@@ -32,11 +32,11 @@ export function ArtifactFileList({
   files: string[];
   threadId: string;
 }) {
-  const { t } = useI18n();
-  const { isMock, publicShareCode } = useThread();
-  const { select: selectArtifact, setOpen } = useArtifacts();
-  const [installingFile, setInstallingFile] = useState<string | null>(null);
-  const [downloadingFile, setDownloadingFile] = useState<string | null>(null);
+  const { t } = useI18n();
+  const { isMock, publicShareCode } = useThread();
+  const { select: selectArtifact, setOpen } = useArtifacts();
+  const [installFile, setInstallFile] = useState<string | null>(null);
+  const [downloadingFile, setDownloadingFile] = useState<string | null>(null);
 
   const handleClick = useCallback(
     (filepath: string) => {
@@ -46,33 +46,14 @@ export function ArtifactFileList({
     [selectArtifact, setOpen],
   );
 
-  const handleInstallSkill = useCallback(
-    async (e: React.MouseEvent, filepath: string) => {
-      e.stopPropagation();
-      e.preventDefault();
-
-      if (installingFile) return;
-
-      setInstallingFile(filepath);
-      try {
-        const result = await installSkill({
-          thread_id: threadId,
-          path: filepath,
-        });
-        if (result.success) {
-          toast.success(result.message);
-        } else {
-          toast.error(result.message || "Failed to install skill");
-        }
-      } catch (error) {
-        console.error("Failed to install skill:", error);
-        toast.error("Failed to install skill");
-      } finally {
-        setInstallingFile(null);
-      }
-    },
-    [threadId, installingFile],
-  );
+  const handleInstallSkill = useCallback(
+    (e: React.MouseEvent, filepath: string) => {
+      e.stopPropagation();
+      e.preventDefault();
+      setInstallFile(filepath);
+    },
+    [],
+  );
 
   const handleDownload = useCallback(
     async (e: React.MouseEvent, filepath: string) => {
@@ -113,20 +94,15 @@ export function ArtifactFileList({
               {getFileExtensionDisplayName(file)} file
             </CardDescription>
             <CardAction className="row-span-1 self-center">
-              {file.endsWith(".skill") && (
-                <Button
-                  variant="ghost"
-                  disabled={installingFile === file}
-                  onClick={(e) => handleInstallSkill(e, file)}
-                >
-                  {installingFile === file ? (
-                    <LoaderIcon className="size-4 animate-spin" />
-                  ) : (
-                    <PackageIcon className="size-4" />
-                  )}
-                  {t.common.install}
-                </Button>
-              )}
+              {file.endsWith(".skill") && (
+                <Button
+                  variant="ghost"
+                  onClick={(e) => handleInstallSkill(e, file)}
+                >
+                  <PackageIcon className="size-4" />
+                  {t.common.install}
+                </Button>
+              )}
               <Button
                 variant="ghost"
                 disabled={downloadingFile === file}
@@ -142,7 +118,15 @@ export function ArtifactFileList({
             </CardAction>
           </CardHeader>
         </Card>
-      ))}
-    </ul>
-  );
-}
+      ))}
+      <SkillInstallDialog
+        open={!!installFile}
+        onOpenChange={(open) => {
+          if (!open) setInstallFile(null);
+        }}
+        threadId={threadId}
+        filepath={installFile}
+      />
+    </ul>
+  );
+}

frontend-web/src/components/workspace/artifacts/skill-install-dialog.tsx

@@ -0,0 +1,178 @@
+"use client";
+
+import { AlertCircleIcon, Loader2Icon, PackageIcon } from "lucide-react";
+import { useEffect, useMemo, useState } from "react";
+import { toast } from "sonner";
+
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import {
+  installSkill,
+  previewSkillInstall,
+  type PreviewSkillInstallResponse,
+} from "@/core/skills/api";
+
+export function SkillInstallDialog({
+  open,
+  onOpenChange,
+  threadId,
+  filepath,
+  onInstalled,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  threadId: string;
+  filepath: string | null;
+  onInstalled?: (skillName: string) => void;
+}) {
+  const [preview, setPreview] = useState<PreviewSkillInstallResponse | null>(null);
+  const [installName, setInstallName] = useState("");
+  const [loading, setLoading] = useState(false);
+  const [installing, setInstalling] = useState(false);
+
+  useEffect(() => {
+    if (!open || !filepath) {
+      setPreview(null);
+      setInstallName("");
+      setLoading(false);
+      setInstalling(false);
+      return;
+    }
+
+    let cancelled = false;
+    setLoading(true);
+    setPreview(null);
+    setInstallName("");
+
+    void previewSkillInstall({ thread_id: threadId, path: filepath })
+      .then((result) => {
+        if (cancelled) return;
+        setPreview(result);
+        setInstallName(result.skill_name);
+      })
+      .catch((error) => {
+        if (cancelled) return;
+        toast.error(error instanceof Error ? error.message : "Failed to preview skill install");
+        onOpenChange(false);
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
+      });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [filepath, onOpenChange, open, threadId]);
+
+  const trimmedName = installName.trim();
+  const unchangedConflict = useMemo(() => {
+    if (!preview) return false;
+    return trimmedName === preview.skill_name && !preview.can_install_as_is;
+  }, [preview, trimmedName]);
+
+  async function handleInstall() {
+    if (!filepath || !trimmedName || installing) return;
+    setInstalling(true);
+    try {
+      const result = await installSkill({
+        thread_id: threadId,
+        path: filepath,
+        skill_name: trimmedName,
+      });
+      if (!result.success) {
+        toast.error(result.message || "Failed to install skill");
+        return;
+      }
+      toast.success(result.message);
+      onInstalled?.(result.skill_name);
+      onOpenChange(false);
+    } catch (error) {
+      toast.error(error instanceof Error ? error.message : "Failed to install skill");
+    } finally {
+      setInstalling(false);
+    }
+  }
+
+  const helperText = preview?.owned_by_other
+    ? `该技能名已被 ${preview.owner_username || "其他用户"} 安装。你可以换个名字继续安装。`
+    : preview?.owned_by_me
+      ? "你已经安装过这个技能了；如果想保留一份新副本，可以换个名字安装。"
+      : preview?.builtin_conflict
+        ? "这个名字已被公共技能占用，请换个名字安装。"
+        : "可以直接安装，也可以先改一个更适合自己的名字。";
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>安装技能</DialogTitle>
+          <DialogDescription>安装前会校验技能归属；如果名字已被占用，可以改名后继续安装。</DialogDescription>
+        </DialogHeader>
+
+        {loading ? (
+          <div className="text-muted-foreground flex items-center justify-center gap-2 py-8 text-sm">
+            <Loader2Icon className="size-4 animate-spin" />
+            正在检查技能安装权限…
+          </div>
+        ) : preview ? (
+          <div className="space-y-4">
+            <div className="rounded-xl border bg-muted/35 p-3 text-sm">
+              <div className="font-medium">{preview.skill_name}</div>
+              {preview.description ? (
+                <div className="text-muted-foreground mt-1 line-clamp-3">{preview.description}</div>
+              ) : null}
+            </div>
+
+            <div className="space-y-2">
+              <div className="text-sm font-medium">安装名称</div>
+              <Input
+                value={installName}
+                onChange={(e) => setInstallName(e.currentTarget.value)}
+                placeholder="请输入技能名称"
+              />
+              <div className="text-muted-foreground text-xs">{helperText}</div>
+            </div>
+
+            {!preview.can_install_as_is && (
+              <div className="flex gap-2 rounded-xl border border-amber-300/60 bg-amber-50 px-3 py-2 text-sm text-amber-900">
+                <AlertCircleIcon className="mt-0.5 size-4 shrink-0" />
+                <div>{preview.message}</div>
+              </div>
+            )}
+
+            {preview.warnings.length > 0 && (
+              <div className="text-muted-foreground rounded-xl border px-3 py-2 text-xs">
+                {preview.warnings.join(" ")}
+              </div>
+            )}
+          </div>
+        ) : null}
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => onOpenChange(false)} disabled={installing}>
+            取消
+          </Button>
+          <Button
+            onClick={() => void handleInstall()}
+            disabled={loading || installing || !trimmedName || unchangedConflict}
+          >
+            {installing ? (
+              <Loader2Icon className="size-4 animate-spin" />
+            ) : (
+              <PackageIcon className="size-4" />
+            )}
+            安装
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+}

frontend-web/src/components/workspace/copy-button.tsx

@@ -1,8 +1,10 @@
-import { CheckIcon, CopyIcon } from "lucide-react";
-import { useCallback, useState, type ComponentProps } from "react";
-
-import { Button } from "@/components/ui/button";
-import { useI18n } from "@/core/i18n/hooks";
+import { CheckIcon, CopyIcon } from "lucide-react";
+import { useCallback, useState, type ComponentProps } from "react";
+import { toast } from "sonner";
+
+import { Button } from "@/components/ui/button";
+import { copyTextToClipboard } from "@/core/clipboard";
+import { useI18n } from "@/core/i18n/hooks";
 
 import { Tooltip } from "./tooltip";
 
@@ -12,14 +14,18 @@ export function CopyButton({
 }: ComponentProps<typeof Button> & {
   clipboardData: string;
 }) {
-  const { t } = useI18n();
-  const [copied, setCopied] = useState(false);
-  const handleCopy = useCallback(() => {
-    void navigator.clipboard.writeText(clipboardData);
-    setCopied(true);
-    setTimeout(() => setCopied(false), 2000);
-  }, [clipboardData]);
-  return (
+  const { t } = useI18n();
+  const [copied, setCopied] = useState(false);
+  const handleCopy = useCallback(async () => {
+    try {
+      await copyTextToClipboard(clipboardData);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch {
+      toast.error(t.clipboard.failedToCopyToClipboard);
+    }
+  }, [clipboardData, t.clipboard.failedToCopyToClipboard]);
+  return (
     <Tooltip content={t.clipboard.copyToClipboard}>
       <Button
         size="icon-sm"

frontend-web/src/components/workspace/general-qa-sidebar.tsx

@@ -349,33 +349,64 @@ export function GeneralQaSidebar() {
                       type="button"
                       onClick={() => handleSelectAgent(agent.id)}
                       className={cn(
-                        "group relative flex w-full items-start gap-2.5 rounded-xl border px-2.5 py-2 text-left transition-colors",
+                        "group relative flex w-full items-start gap-3 rounded-xl border px-3 py-2.5 text-left transition-all duration-150",
                         isActive
-                          ? "border-primary/40 bg-primary/5"
-                          : "border-transparent hover:border-border hover:bg-accent/50",
+                          ? isDark
+                            ? "border-[#2b8ffe] bg-[#0b4fae]/65 shadow-[0_0_0_1px_rgba(43,143,254,0.5),0_12px_28px_rgba(37,128,255,0.25)]"
+                            : "border-primary/50 bg-primary/10 shadow-sm"
+                          : isDark
+                            ? "border-[#2b8ffe]/20 bg-[#042b59]/35 hover:border-[#2b8ffe]/60 hover:bg-[#063b77]/60"
+                            : "border-transparent hover:border-border hover:bg-accent/50",
                       )}
                     >
                       <span
-                        className="mt-0.5 flex size-9 shrink-0 items-center justify-center rounded-lg text-white shadow-sm"
+                        className={cn(
+                          "mt-0.5 flex size-10 shrink-0 items-center justify-center rounded-lg text-white shadow-sm",
+                          isDark &&
+                            isActive &&
+                            "ring-2 ring-[#83c1ff]/35 shadow-[0_0_18px_rgba(43,143,254,0.45)]",
+                        )}
                         style={{ backgroundImage: `linear-gradient(135deg, ${from}, ${to})` }}
                       >
-                        <Bot className="size-[18px]" />
+                        <Bot className="size-[19px]" />
                       </span>
                       <span className="min-w-0 flex-1">
                         <span
                           className={cn(
-                            "block truncate text-[13px] font-semibold",
-                            isActive ? "text-primary" : "text-foreground",
+                            "block truncate text-[16px] leading-5 font-bold",
+                            isActive
+                              ? isDark
+                                ? "text-white"
+                                : "text-primary"
+                              : isDark
+                                ? "text-white/95"
+                                : "text-foreground",
                           )}
                         >
                           {desensitize(agent.name)}
                         </span>
-                        <span className="mt-0.5 block truncate text-[11px] leading-snug text-muted-foreground">
+                        <span
+                          className={cn(
+                            "mt-1 block truncate text-[13px] leading-[1.35]",
+                            isDark
+                              ? isActive
+                                ? "text-[#d6eaff]"
+                                : "text-[#9ebfe2]"
+                              : "text-muted-foreground",
+                          )}
+                        >
                           {agent.description ? desensitize(agent.description) : "智能体助手"}
                         </span>
                       </span>
                       {isActive && (
-                        <span className="absolute top-1/2 right-1 h-6 w-1 -translate-y-1/2 rounded-full bg-primary" />
+                        <span
+                          className={cn(
+                            "absolute top-1/2 right-1.5 h-8 w-1.5 -translate-y-1/2 rounded-full",
+                            isDark
+                              ? "bg-[#2b8ffe] shadow-[0_0_14px_rgba(43,143,254,0.85)]"
+                              : "bg-primary",
+                          )}
+                        />
                       )}
                     </button>
                   );

frontend-web/src/components/workspace/settings/appearance-settings-page.tsx

@@ -1,16 +1,30 @@
 "use client";
 
-import { DropletIcon, LayoutGridIcon, LayoutIcon, ListIcon, MoonIcon, PanelLeftIcon, SunIcon } from "lucide-react";
-import { useMemo, useState, type ComponentType, type SVGProps } from "react";
+import {
+  ArrowDown,
+  ArrowUp,
+  DropletIcon,
+  ExternalLink,
+  LayoutGridIcon,
+  LayoutIcon,
+  ListIcon,
+  MoonIcon,
+  PanelLeftIcon,
+  Plus,
+  SunIcon,
+  Trash2,
+} from "lucide-react";
+import { useEffect, useMemo, useState, type ComponentType, type SVGProps } from "react";
 import { useNavigate } from "react-router-dom";
 import { toast } from "sonner";
 
 import { useTheme } from "@/contexts/ThemeContext";
 
-import { FONT_SCALE_OPTIONS } from "@/components/font-scale";
-import { Button } from "@/components/ui/button";
-import {
-  Select,
+import { FONT_SCALE_OPTIONS } from "@/components/font-scale";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import {
+  Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
@@ -25,14 +39,24 @@ import { isIsolatedSession, setIsolatedSession } from "@/core/embed/embed-sessio
 import { enUS, isLocale, zhCN, type Locale } from "@/core/i18n";
 import { useI18n } from "@/core/i18n/hooks";
 import { useLocalSettings } from "@/core/settings";
-import {
-  useAppearanceSettings,
+import {
+  useAppearanceSettings,
   useCitationDisplaySettings,
   useLayoutMode,
   useUpdateAppearanceSettings,
   useUpdateCitationDisplaySettings,
-} from "@/core/system-settings/hooks";
-import { cn } from "@/lib/utils";
+} from "@/core/system-settings/hooks";
+import type {
+  CompactShortcutButton,
+  CompactShortcutRouteParam,
+} from "@/core/system-settings/api";
+import { cn } from "@/lib/utils";
+import {
+  APP_THEME_COLORS,
+  LOGIN_SOURCE_OPTIONS,
+  parseThemeMap,
+  stringifyThemeMap,
+} from "@/strategy-components/lib/light-app";
 
 import PrivateSquareSettingsPage from "@/pages/PrivateSquareSettingsPage";
 import PublishSquaresSettingsPage from "@/pages/PublishSquaresSettingsPage";
@@ -41,10 +65,101 @@ import SkillCompressionSettingsPage from "@/pages/SkillCompressionSettingsPage";
 
 import { SettingsSection } from "./settings-section";
 
-const languageOptions: { value: Locale; label: string }[] = [
-  { value: "en-US", label: enUS.locale.localName },
-  { value: "zh-CN", label: zhCN.locale.localName },
-];
+const languageOptions: { value: Locale; label: string }[] = [
+  { value: "en-US", label: enUS.locale.localName },
+  { value: "zh-CN", label: zhCN.locale.localName },
+];
+
+const DEFAULT_SHORTCUT_THEME_MAP = "red=red;blue=blue;dark-blue=dark-blue";
+
+function makeShortcutId() {
+  if (typeof crypto !== "undefined" && "randomUUID" in crypto) {
+    return crypto.randomUUID();
+  }
+  return `shortcut-${Date.now()}-${Math.random().toString(16).slice(2)}`;
+}
+
+function newShortcutParam(): CompactShortcutRouteParam {
+  return {
+    key: "access_token",
+    paramType: "login",
+    source: "access_token",
+    customValue: "",
+    themeValue: DEFAULT_SHORTCUT_THEME_MAP,
+  };
+}
+
+function newShortcutButton(): CompactShortcutButton {
+  return {
+    id: makeShortcutId(),
+    label: "快捷入口",
+    url: "",
+    route_params: [newShortcutParam()],
+    enabled: true,
+    sort_order: 0,
+  };
+}
+
+function normalizeShortcutDraft(
+  buttons: CompactShortcutButton[] | undefined,
+): CompactShortcutButton[] {
+  const source = buttons?.length ? buttons : [newShortcutButton()];
+  return [...source]
+    .sort((a, b) => a.sort_order - b.sort_order)
+    .map((button, index) => ({
+      ...button,
+      id: button.id || makeShortcutId(),
+      label: button.label || "快捷入口",
+      url: button.url || "",
+      route_params: (button.route_params?.length
+        ? button.route_params
+        : [newShortcutParam()]
+      ).map((param) => ({
+        key: param.key || "",
+        paramType: param.paramType || "login",
+        source: param.source || "access_token",
+        customValue: param.customValue ?? "",
+        themeValue: param.themeValue || DEFAULT_SHORTCUT_THEME_MAP,
+      })),
+      enabled: button.enabled ?? true,
+      sort_order: index,
+    }));
+}
+
+function cleanShortcutParams(
+  params: CompactShortcutRouteParam[],
+): CompactShortcutRouteParam[] {
+  return params
+    .filter((param) => param.key.trim())
+    .map((param) => {
+      const base: CompactShortcutRouteParam = {
+        key: param.key.trim(),
+        paramType: param.paramType,
+      };
+      if (param.paramType === "theme") {
+        base.themeValue = stringifyThemeMap(parseThemeMap(param.themeValue));
+        return base;
+      }
+      base.source = param.source || "access_token";
+      if (base.source === "other") {
+        base.customValue = (param.customValue ?? "").trim();
+      }
+      return base;
+    });
+}
+
+function cleanShortcutButtons(
+  buttons: CompactShortcutButton[],
+): CompactShortcutButton[] {
+  return buttons.map((button, index) => ({
+    id: button.id || makeShortcutId(),
+    label: button.label.trim() || "快捷入口",
+    url: button.url.trim(),
+    route_params: cleanShortcutParams(button.route_params),
+    enabled: button.enabled,
+    sort_order: index,
+  }));
+}
 
 export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
   const { t, locale, changeLocale } = useI18n();
@@ -52,10 +167,11 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
   const navigate = useNavigate();
   const currentTheme = theme;
   const [settings, setSettings] = useLocalSettings();
-  const isAdmin = getStoredAuth()?.system_role === "admin";
-  const { data: appearance } = useAppearanceSettings();
-  const updateAppearance = useUpdateAppearanceSettings();
-  const { data: citationDisplay } = useCitationDisplaySettings();
+  const isAdmin = getStoredAuth()?.system_role === "admin";
+  const { data: appearance } = useAppearanceSettings();
+  const updateAppearance = useUpdateAppearanceSettings();
+  const [shortcutDraft, setShortcutDraft] = useState<CompactShortcutButton[]>([]);
+  const { data: citationDisplay } = useCitationDisplaySettings();
   const updateCitationDisplay = useUpdateCitationDisplaySettings();
   const globalDefault = appearance?.default_theme ?? "light";
   const globalSkillView = appearance?.default_skill_view ?? "list";
@@ -63,8 +179,14 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
   const globalLayoutMode = appearance?.default_layout_mode ?? "full";
   // 有效界面模式：用户自己选过则以其为准，否则跟随管理员系统默认（再否则会话级回退）。
   const [effectiveLayoutMode, setLayoutMode] = useLayoutMode();
-  const cleanupWords =
-    citationDisplay?.cleanup_words ?? settings.display.citationCleanupWords ?? [];
+  const cleanupWords =
+    citationDisplay?.cleanup_words ?? settings.display.citationCleanupWords ?? [];
+
+  useEffect(() => {
+    setShortcutDraft(
+      normalizeShortcutDraft(appearance?.compact_shortcut_buttons),
+    );
+  }, [appearance?.compact_shortcut_buttons]);
 
   // 独立登录会话（本标签页）：开关切换鉴权存储 localStorage ↔ sessionStorage（见 scoped-storage）。
   const [isolatedSession, setIsolatedSessionState] = useState(() => isIsolatedSession());
@@ -115,7 +237,7 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
     }
   };
 
-  const handleSetDefaultView = async (
+  const handleSetDefaultView = async (
     kind: "skill" | "agent",
     value: "card" | "list",
   ) => {
@@ -134,7 +256,103 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
     } catch (e) {
       toast.error(e instanceof Error ? e.message : "保存失败");
     }
-  };
+  };
+
+  const patchShortcut = (
+    id: string,
+    patch: Partial<CompactShortcutButton>,
+  ) => {
+    setShortcutDraft((items) =>
+      items.map((item) => (item.id === id ? { ...item, ...patch } : item)),
+    );
+  };
+
+  const patchShortcutParam = (
+    id: string,
+    index: number,
+    patch: Partial<CompactShortcutRouteParam>,
+  ) => {
+    setShortcutDraft((items) =>
+      items.map((item) =>
+        item.id === id
+          ? {
+              ...item,
+              route_params: item.route_params.map((param, paramIndex) =>
+                paramIndex === index ? { ...param, ...patch } : param,
+              ),
+            }
+          : item,
+      ),
+    );
+  };
+
+  const moveShortcut = (id: string, direction: -1 | 1) => {
+    setShortcutDraft((items) => {
+      const index = items.findIndex((item) => item.id === id);
+      const target = index + direction;
+      if (index < 0 || target < 0 || target >= items.length) return items;
+      const next = [...items];
+      [next[index], next[target]] = [next[target]!, next[index]!];
+      return next.map((item, order) => ({ ...item, sort_order: order }));
+    });
+  };
+
+  const addShortcutParam = (id: string) => {
+    setShortcutDraft((items) =>
+      items.map((item) =>
+        item.id === id
+          ? {
+              ...item,
+              route_params: [...item.route_params, newShortcutParam()],
+            }
+          : item,
+      ),
+    );
+  };
+
+  const removeShortcutParam = (id: string, index: number) => {
+    setShortcutDraft((items) =>
+      items.map((item) =>
+        item.id === id
+          ? {
+              ...item,
+              route_params: item.route_params.filter((_, paramIndex) => paramIndex !== index),
+            }
+          : item,
+      ),
+    );
+  };
+
+  const handleSaveShortcuts = async () => {
+    for (const item of shortcutDraft) {
+      if (item.enabled && !item.url.trim()) {
+        toast.error(`请填写「${item.label.trim() || "快捷入口"}」的跳转链接，或先关闭该按钮`);
+        return;
+      }
+      for (const param of item.route_params) {
+        if (!param.key.trim()) {
+          toast.error("路由参数键名不可为空");
+          return;
+        }
+        if (
+          param.paramType === "login" &&
+          param.source === "other" &&
+          !param.customValue?.trim()
+        ) {
+          toast.error("登录参数自定义值不可为空");
+          return;
+        }
+      }
+    }
+    try {
+      await updateAppearance.mutateAsync({
+        compact_shortcut_buttons: cleanShortcutButtons(shortcutDraft),
+      });
+      toast.success("顶部快捷按钮已保存");
+    } catch (e) {
+      toast.error(e instanceof Error ? e.message : "保存失败");
+    }
+  };
 
   const themeOptions = useMemo(
     () => [
@@ -224,11 +442,11 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
         </div>
       </SettingsSection>
 
-      {isAdmin && (
-        <>
-          <Separator />
-          <SettingsSection
-            title="系统默认界面模式（管理员）"
+      {isAdmin && (
+        <>
+          <Separator />
+          <SettingsSection
+            title="系统默认界面模式（管理员）"
             description="给所有还没有手动切换过界面模式的用户的默认；已经自己切换过的用户保留其个人选择不受影响。"
           >
             <div className="flex flex-wrap items-center gap-2">
@@ -257,13 +475,47 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
                 {globalLayoutMode === "full" ? "全量模式" : "简洁模式"}
               </p>
             </div>
-          </SettingsSection>
-        </>
-      )}
-
-      {isAdmin && (
-        <>
-          <Separator />
+          </SettingsSection>
+        </>
+      )}
+
+      {isAdmin && (
+        <>
+          <Separator />
+          <SettingsSection
+            title="顶部快捷按钮（管理员）"
+            description="配置全量/简洁模式右上角、换肤按钮左侧显示的跳转按钮。支持多个按钮、启停和与应用管理一致的登录/主题参数。"
+          >
+            <CompactShortcutSettings
+              buttons={shortcutDraft}
+              saving={updateAppearance.isPending}
+              onAdd={() =>
+                setShortcutDraft((items) => [
+                  ...items,
+                  { ...newShortcutButton(), sort_order: items.length },
+                ])
+              }
+              onPatch={patchShortcut}
+              onMove={moveShortcut}
+              onRemove={(id) =>
+                setShortcutDraft((items) =>
+                  items
+                    .filter((item) => item.id !== id)
+                    .map((item, index) => ({ ...item, sort_order: index })),
+                )
+              }
+              onAddParam={addShortcutParam}
+              onPatchParam={patchShortcutParam}
+              onRemoveParam={removeShortcutParam}
+              onSave={handleSaveShortcuts}
+            />
+          </SettingsSection>
+        </>
+      )}
+
+      {isAdmin && (
+        <>
+          <Separator />
           <SettingsSection
             title="系统默认主题（管理员）"
             description="给所有还没有手动切换过主题的用户的默认主题；已经自己切换过的用户保留其个人设置不受影响。"
@@ -515,12 +767,304 @@ export function AppearanceSettingsPage({ onClose }: { onClose?: () => void }) {
         </>
       )}
     </div>
-  );
-}
-
-function ThemePreviewCard({
-  icon: Icon,
-  label,
+  );
+}
+
+function CompactShortcutSettings({
+  buttons,
+  saving,
+  onAdd,
+  onPatch,
+  onMove,
+  onRemove,
+  onAddParam,
+  onPatchParam,
+  onRemoveParam,
+  onSave,
+}: {
+  buttons: CompactShortcutButton[];
+  saving: boolean;
+  onAdd: () => void;
+  onPatch: (id: string, patch: Partial<CompactShortcutButton>) => void;
+  onMove: (id: string, direction: -1 | 1) => void;
+  onRemove: (id: string) => void;
+  onAddParam: (id: string) => void;
+  onPatchParam: (
+    id: string,
+    index: number,
+    patch: Partial<CompactShortcutRouteParam>,
+  ) => void;
+  onRemoveParam: (id: string, index: number) => void;
+  onSave: () => void;
+}) {
+  return (
+    <div className="space-y-3">
+      <div className="flex flex-wrap items-center justify-between gap-2">
+        <p className="text-muted-foreground text-xs">
+          已配置 {buttons.length} 个按钮；只有启用且填写了跳转链接的按钮会显示。
+        </p>
+        <div className="flex items-center gap-2">
+          <Button type="button" variant="outline" size="sm" onClick={onAdd}>
+            <Plus className="mr-1.5 size-4" />
+            添加按钮
+          </Button>
+          <Button
+            type="button"
+            size="sm"
+            onClick={onSave}
+            disabled={saving}
+          >
+            保存按钮配置
+          </Button>
+        </div>
+      </div>
+
+      {buttons.length === 0 ? (
+        <div className="text-muted-foreground rounded-lg border border-dashed p-6 text-center text-sm">
+          暂无按钮，点击“添加按钮”创建一个。
+        </div>
+      ) : (
+        <div className="space-y-3">
+          {buttons.map((button, index) => (
+            <div key={button.id} className="space-y-4 rounded-lg border p-4">
+              <div className="flex flex-col gap-3 xl:flex-row xl:items-start">
+                <div className="flex items-center gap-2 pt-6">
+                  <Switch
+                    checked={button.enabled}
+                    onCheckedChange={(checked) =>
+                      onPatch(button.id, { enabled: checked })
+                    }
+                    aria-label="启用快捷按钮"
+                  />
+                  <span className="text-muted-foreground text-xs">
+                    {button.enabled ? "启用" : "停用"}
+                  </span>
+                </div>
+                <div className="grid min-w-0 flex-1 gap-3 md:grid-cols-[220px_minmax(0,1fr)]">
+                  <div className="space-y-1.5">
+                    <div className="text-xs font-medium">按钮名称</div>
+                    <Input
+                      value={button.label}
+                      onChange={(event) =>
+                        onPatch(button.id, { label: event.target.value })
+                      }
+                      placeholder="如：业务系统"
+                    />
+                  </div>
+                  <div className="space-y-1.5">
+                    <div className="text-xs font-medium">跳转链接</div>
+                    <Input
+                      value={button.url}
+                      onChange={(event) =>
+                        onPatch(button.id, { url: event.target.value })
+                      }
+                      placeholder="https://example.com/page"
+                      className="font-mono"
+                    />
+                  </div>
+                </div>
+                <div className="flex shrink-0 items-center gap-1 pt-6">
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="icon-sm"
+                    onClick={() => onMove(button.id, -1)}
+                    disabled={index === 0}
+                    title="上移"
+                  >
+                    <ArrowUp className="size-4" />
+                  </Button>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="icon-sm"
+                    onClick={() => onMove(button.id, 1)}
+                    disabled={index === buttons.length - 1}
+                    title="下移"
+                  >
+                    <ArrowDown className="size-4" />
+                  </Button>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="icon-sm"
+                    className="text-destructive hover:text-destructive"
+                    onClick={() => onRemove(button.id)}
+                    title="删除"
+                  >
+                    <Trash2 className="size-4" />
+                  </Button>
+                </div>
+              </div>
+
+              <div className="rounded-lg border bg-muted/20 p-3">
+                <div className="mb-2 flex items-center justify-between gap-2">
+                  <div className="flex items-center gap-1.5 text-sm font-medium">
+                    <ExternalLink className="size-4" />
+                    路由参数
+                  </div>
+                  <Button
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    onClick={() => onAddParam(button.id)}
+                  >
+                    <Plus className="mr-1.5 size-4" />
+                    添加参数
+                  </Button>
+                </div>
+
+                {button.route_params.length === 0 ? (
+                  <div className="text-muted-foreground rounded-md border border-dashed bg-background/70 p-4 text-center text-xs">
+                    不追加额外参数。
+                  </div>
+                ) : (
+                  <div className="space-y-2">
+                    {button.route_params.map((param, paramIndex) => {
+                      const themeMap =
+                        param.paramType === "theme"
+                          ? parseThemeMap(param.themeValue)
+                          : {};
+                      return (
+                        <div
+                          key={`${button.id}-${paramIndex}`}
+                          className="space-y-2 rounded-md border bg-background p-2"
+                        >
+                          <div className="grid gap-2 md:grid-cols-[minmax(120px,1fr)_130px_minmax(180px,1.4fr)_32px]">
+                            <Input
+                              value={param.key}
+                              onChange={(event) =>
+                                onPatchParam(button.id, paramIndex, {
+                                  key: event.target.value,
+                                })
+                              }
+                              placeholder="参数名 key"
+                              className="font-mono text-xs"
+                            />
+                            <Select
+                              value={param.paramType}
+                              onValueChange={(value) =>
+                                onPatchParam(button.id, paramIndex, {
+                                  paramType: value as "login" | "theme",
+                                  source:
+                                    value === "login"
+                                      ? param.source || "access_token"
+                                      : undefined,
+                                })
+                              }
+                            >
+                              <SelectTrigger>
+                                <SelectValue />
+                              </SelectTrigger>
+                              <SelectContent>
+                                <SelectItem value="login">登录参数</SelectItem>
+                                <SelectItem value="theme">主题参数</SelectItem>
+                              </SelectContent>
+                            </Select>
+                            {param.paramType === "login" ? (
+                              <div className="flex min-w-0 gap-2">
+                                <Select
+                                  value={param.source || "access_token"}
+                                  onValueChange={(value) =>
+                                    onPatchParam(button.id, paramIndex, {
+                                      source: value,
+                                    })
+                                  }
+                                >
+                                  <SelectTrigger className="min-w-0 flex-1">
+                                    <SelectValue />
+                                  </SelectTrigger>
+                                  <SelectContent>
+                                    {LOGIN_SOURCE_OPTIONS.map((option) => (
+                                      <SelectItem
+                                        key={option.value}
+                                        value={option.value}
+                                      >
+                                        {option.label}
+                                      </SelectItem>
+                                    ))}
+                                  </SelectContent>
+                                </Select>
+                                {param.source === "other" && (
+                                  <Input
+                                    value={param.customValue ?? ""}
+                                    onChange={(event) =>
+                                      onPatchParam(button.id, paramIndex, {
+                                        customValue: event.target.value,
+                                      })
+                                    }
+                                    placeholder="自定义值"
+                                    className="w-32 text-xs"
+                                  />
+                                )}
+                              </div>
+                            ) : (
+                              <div className="text-muted-foreground flex items-center text-xs">
+                                按当前主题取值
+                              </div>
+                            )}
+                            <Button
+                              type="button"
+                              variant="ghost"
+                              size="icon-sm"
+                              className="text-destructive hover:text-destructive"
+                              onClick={() =>
+                                onRemoveParam(button.id, paramIndex)
+                              }
+                              title="删除参数"
+                            >
+                              <Trash2 className="size-4" />
+                            </Button>
+                          </div>
+
+                          {param.paramType === "theme" && (
+                            <div className="grid gap-2 rounded-md bg-muted/40 p-2 md:grid-cols-3">
+                              {APP_THEME_COLORS.map((color) => (
+                                <label
+                                  key={color.key}
+                                  className="flex min-w-0 items-center gap-2"
+                                >
+                                  <span
+                                    className="size-2.5 shrink-0 rounded-full"
+                                    style={{ backgroundColor: color.dot }}
+                                  />
+                                  <span className="text-muted-foreground shrink-0 text-xs">
+                                    {color.label}
+                                  </span>
+                                  <Input
+                                    value={themeMap[color.key] ?? color.key}
+                                    onChange={(event) =>
+                                      onPatchParam(button.id, paramIndex, {
+                                        themeValue: stringifyThemeMap({
+                                          ...themeMap,
+                                          [color.key]: event.target.value,
+                                        }),
+                                      })
+                                    }
+                                    placeholder={color.key}
+                                    className="h-8 min-w-0 font-mono text-xs"
+                                  />
+                                </label>
+                              ))}
+                            </div>
+                          )}
+                        </div>
+                      );
+                    })}
+                  </div>
+                )}
+              </div>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function ThemePreviewCard({
+  icon: Icon,
+  label,
   description,
   active,
   mode,

frontend-web/src/components/workspace/workspace-container.tsx

@@ -1,8 +1,8 @@
 "use client";
 
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-import { useMemo } from "react";
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { type ReactNode, useMemo } from "react";
 
 import {
   Breadcrumb,
@@ -30,11 +30,14 @@ export function WorkspaceContainer({
   );
 }
 
-export function WorkspaceHeader({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<"header">) {
+export function WorkspaceHeader({
+  className,
+  children,
+  rightActions,
+  ...props
+}: React.ComponentProps<"header"> & {
+  rightActions?: ReactNode;
+}) {
   const { t } = useI18n();
   const pathname = usePathname();
   const segments = useMemo(() => {
@@ -51,8 +54,8 @@ export function WorkspaceHeader({
       )}
       {...props}
     >
-      <div className="flex items-center gap-2 px-4">
-        <Breadcrumb>
+      <div className="flex items-center gap-2 px-4">
+        <Breadcrumb>
           <BreadcrumbList>
             {segments?.[0] && (
               <BreadcrumbItem className="hidden md:block">
@@ -88,11 +91,14 @@ export function WorkspaceHeader({
               </>
             )}
           </BreadcrumbList>
-        </Breadcrumb>
-      </div>
-    </header>
-  );
-}
+        </Breadcrumb>
+      </div>
+      {rightActions ? (
+        <div className="flex items-center gap-2 px-4">{rightActions}</div>
+      ) : null}
+    </header>
+  );
+}
 
 export function WorkspaceBody({
   className,

frontend-web/src/components/workspace/workspace-nav-menu.tsx

@@ -1,268 +1,277 @@
-"use client";
-
-import {
-  BellIcon,
-  BotIcon,
-  BrainIcon,
-  BriefcaseIcon,
-  CalendarClockIcon,
-  ChevronsUpDown,
-  DatabaseZapIcon,
-  GaugeIcon,
-  HistoryIcon,
-  MessageCircleQuestionIcon,
-  ScrollTextIcon,
-  Settings2Icon,
-  SettingsIcon,
-  SparklesIcon,
-  TagsIcon,
-  TrophyIcon,
-} from "lucide-react";
-import { useEffect, useState } from "react";
-
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuGroup,
-  DropdownMenuItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import {
-  SidebarMenu,
-  SidebarMenuButton,
-  SidebarMenuItem,
-  useSidebar,
-} from "@/components/ui/sidebar";
-import { getStoredAuth } from "@/core/auth";
-import { useI18n } from "@/core/i18n/hooks";
-import { useUnreadCount } from "@/core/notifications";
-import {
-  loadLogSystemSettings,
-  type LogSystemSettings,
-} from "@/core/system-settings/api";
-
-import { NotificationDialog } from "./notification-dialog";
-import { useNavigate } from "react-router-dom";
-
-import { SettingsDialog } from "./settings";
-
-function NavMenuButtonContent({
-  isSidebarOpen,
-  t,
-}: {
-  isSidebarOpen: boolean;
-  t: ReturnType<typeof useI18n>["t"];
-}) {
-  return isSidebarOpen ? (
-    <div className="text-sidebar-foreground/85 flex w-full items-center gap-2 text-left text-sm">
-      <SettingsIcon className="size-4" />
-      <span>{t.workspace.settingsAndMore}</span>
-      <ChevronsUpDown className="text-sidebar-foreground/55 ml-auto size-4" />
-    </div>
-  ) : (
-    <div className="flex size-full items-center justify-center">
-      <SettingsIcon className="text-sidebar-foreground/80 size-4" />
-    </div>
-  );
-}
-
-export function WorkspaceNavMenu() {
-  const navigate = useNavigate();
-  const isAdmin = getStoredAuth()?.system_role === "admin";
-  const [settingsOpen, setSettingsOpen] = useState(false);
-  const [settingsDefaultSection, setSettingsDefaultSection] = useState<
-    "appearance" | "memory" | "tools" | "about"
-  >("appearance");
-  const [notificationOpen, setNotificationOpen] = useState(false);
-  const [mounted, setMounted] = useState(false);
-  const [logSystem, setLogSystem] = useState<LogSystemSettings | null>(null);
-  const { open: isSidebarOpen } = useSidebar();
-  const { t } = useI18n();
-  const { data: unreadCount = 0 } = useUnreadCount();
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  useEffect(() => {
-    if (!isAdmin) return;
-    let cancelled = false;
-    loadLogSystemSettings()
-      .then((settings) => {
-        if (!cancelled) setLogSystem(settings);
-      })
-      .catch(() => {
-        if (!cancelled) setLogSystem(null);
-      });
-    return () => {
-      cancelled = true;
-    };
-  }, [isAdmin]);
-
-  return (
-    <>
-      <SettingsDialog
-        open={settingsOpen}
-        onOpenChange={setSettingsOpen}
-        defaultSection={settingsDefaultSection}
-      />
-      <NotificationDialog
-        open={notificationOpen}
-        onOpenChange={setNotificationOpen}
-      />
-      <SidebarMenu className="w-full">
-        <SidebarMenuItem>
-          {mounted ? (
-            <DropdownMenu>
-              <DropdownMenuTrigger asChild>
-                <SidebarMenuButton
-                  size="lg"
-                  className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
-                >
-                  <NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
-                </SidebarMenuButton>
-              </DropdownMenuTrigger>
-              <DropdownMenuContent
-                className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
-                align="end"
-                sideOffset={4}
-              >
-                <DropdownMenuGroup>
-                  <DropdownMenuItem onClick={() => setNotificationOpen(true)}>
-                    <BellIcon />
-                    {t.notifications.title}
-                    {unreadCount > 0 && (
-                      <span className="ml-auto flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium leading-none text-white">
-                        {unreadCount > 99 ? "99+" : unreadCount}
-                      </span>
-                    )}
-                  </DropdownMenuItem>
-                  <DropdownMenuItem
-                    onClick={() => {
-                      setSettingsDefaultSection("appearance");
-                      setSettingsOpen(true);
-                    }}
-                  >
-                    <Settings2Icon />
-                    {t.common.settings}
-                  </DropdownMenuItem>
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate("/page/workspace/settings/llm-metrics")
-                      }
-                    >
-                      <GaugeIcon />
-                      大模型调用统计
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate("/page/workspace/settings/checkpoint-migration")
-                      }
-                    >
-                      <DatabaseZapIcon />
-                      Checkpoint 迁移
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin ? (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate("/page/strategy/admin/user-leaderboard")
-                      }
-                    >
-                      <TrophyIcon />
-                      用户排行榜
-                    </DropdownMenuItem>
-                  ) : (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate("/page/strategy/user-leaderboard")
-                      }
-                    >
-                      <TrophyIcon />
-                      用户排行榜
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate("/page/workspace/admin/scheduled-tasks")
-                      }
-                    >
-                      <CalendarClockIcon />
-                      定时任务管理
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() => navigate("/page/workspace/admin/agents")}
-                    >
-                      <BotIcon />
-                      智能体管理
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() => navigate("/page/workspace/admin/skills")}
-                    >
-                      <SparklesIcon />
-                      技能管理
-                    </DropdownMenuItem>
-                  )}
-                  <DropdownMenuItem
-                    onClick={() => navigate("/page/workspace/admin/tags")}
-                  >
-                    <TagsIcon />
-                    {t.adminTags.title}
-                  </DropdownMenuItem>
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() => navigate("/page/workspace/admin/positions")}
-                    >
-                      <BriefcaseIcon />
-                      岗位管理
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        navigate(
-                          "/page/workspace/settings/recommended-questions",
-                        )
-                      }
-                    >
-                      <MessageCircleQuestionIcon />
-                      推荐问题配置
-                    </DropdownMenuItem>
-                  )}
-                  {isAdmin && logSystem?.enabled && logSystem.url && (
-                    <DropdownMenuItem
-                      onClick={() =>
-                        window.open(
-                          logSystem.url,
-                          "_blank",
-                          "noopener,noreferrer",
-                        )
-                      }
-                    >
-                      <ScrollTextIcon />
-                      {logSystem.label || "日志系统"}
-                    </DropdownMenuItem>
-                  )}
-                </DropdownMenuGroup>
-                <DropdownMenuSeparator />
-              </DropdownMenuContent>
-            </DropdownMenu>
-          ) : (
-            <SidebarMenuButton size="lg" className="pointer-events-none">
-              <NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
-            </SidebarMenuButton>
-          )}
-        </SidebarMenuItem>
-      </SidebarMenu>
-    </>
-  );
-}
+"use client";
+
+import {
+  BellIcon,
+  BotIcon,
+  BrainIcon,
+  BriefcaseIcon,
+  CalendarClockIcon,
+  ChevronsUpDown,
+  DatabaseZapIcon,
+  GaugeIcon,
+  HistoryIcon,
+  MessageCircleQuestionIcon,
+  PlugIcon,
+  ScrollTextIcon,
+  Settings2Icon,
+  SettingsIcon,
+  SparklesIcon,
+  TagsIcon,
+  TrophyIcon,
+} from "lucide-react";
+import { useEffect, useState } from "react";
+
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import {
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  useSidebar,
+} from "@/components/ui/sidebar";
+import { getStoredAuth } from "@/core/auth";
+import { useI18n } from "@/core/i18n/hooks";
+import { useUnreadCount } from "@/core/notifications";
+import {
+  loadLogSystemSettings,
+  type LogSystemSettings,
+} from "@/core/system-settings/api";
+
+import { NotificationDialog } from "./notification-dialog";
+import { useNavigate } from "react-router-dom";
+
+import { SettingsDialog } from "./settings";
+
+function NavMenuButtonContent({
+  isSidebarOpen,
+  t,
+}: {
+  isSidebarOpen: boolean;
+  t: ReturnType<typeof useI18n>["t"];
+}) {
+  return isSidebarOpen ? (
+    <div className="text-sidebar-foreground/85 flex w-full items-center gap-2 text-left text-sm">
+      <SettingsIcon className="size-4" />
+      <span>{t.workspace.settingsAndMore}</span>
+      <ChevronsUpDown className="text-sidebar-foreground/55 ml-auto size-4" />
+    </div>
+  ) : (
+    <div className="flex size-full items-center justify-center">
+      <SettingsIcon className="text-sidebar-foreground/80 size-4" />
+    </div>
+  );
+}
+
+export function WorkspaceNavMenu() {
+  const navigate = useNavigate();
+  const isAdmin = getStoredAuth()?.system_role === "admin";
+  const [settingsOpen, setSettingsOpen] = useState(false);
+  const [settingsDefaultSection, setSettingsDefaultSection] = useState<
+    "appearance" | "memory" | "tools" | "about"
+  >("appearance");
+  const [notificationOpen, setNotificationOpen] = useState(false);
+  const [mounted, setMounted] = useState(false);
+  const [logSystem, setLogSystem] = useState<LogSystemSettings | null>(null);
+  const { open: isSidebarOpen } = useSidebar();
+  const { t } = useI18n();
+  const { data: unreadCount = 0 } = useUnreadCount();
+
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  useEffect(() => {
+    if (!isAdmin) return;
+    let cancelled = false;
+    loadLogSystemSettings()
+      .then((settings) => {
+        if (!cancelled) setLogSystem(settings);
+      })
+      .catch(() => {
+        if (!cancelled) setLogSystem(null);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [isAdmin]);
+
+  return (
+    <>
+      <SettingsDialog
+        open={settingsOpen}
+        onOpenChange={setSettingsOpen}
+        defaultSection={settingsDefaultSection}
+      />
+      <NotificationDialog
+        open={notificationOpen}
+        onOpenChange={setNotificationOpen}
+      />
+      <SidebarMenu className="w-full">
+        <SidebarMenuItem>
+          {mounted ? (
+            <DropdownMenu>
+              <DropdownMenuTrigger asChild>
+                <SidebarMenuButton
+                  size="lg"
+                  className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
+                >
+                  <NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
+                </SidebarMenuButton>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent
+                className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
+                align="end"
+                sideOffset={4}
+              >
+                <DropdownMenuGroup>
+                  <DropdownMenuItem onClick={() => setNotificationOpen(true)}>
+                    <BellIcon />
+                    {t.notifications.title}
+                    {unreadCount > 0 && (
+                      <span className="ml-auto flex h-4 min-w-4 items-center justify-center rounded-full bg-red-500 px-1 text-[10px] font-medium leading-none text-white">
+                        {unreadCount > 99 ? "99+" : unreadCount}
+                      </span>
+                    )}
+                  </DropdownMenuItem>
+                  <DropdownMenuItem
+                    onClick={() => {
+                      setSettingsDefaultSection("appearance");
+                      setSettingsOpen(true);
+                    }}
+                  >
+                    <Settings2Icon />
+                    {t.common.settings}
+                  </DropdownMenuItem>
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate("/page/workspace/settings/llm-metrics")
+                      }
+                    >
+                      <GaugeIcon />
+                      大模型调用统计
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate("/page/workspace/settings/checkpoint-migration")
+                      }
+                    >
+                      <DatabaseZapIcon />
+                      Checkpoint 迁移
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin ? (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate("/page/strategy/admin/user-leaderboard")
+                      }
+                    >
+                      <TrophyIcon />
+                      用户排行榜
+                    </DropdownMenuItem>
+                  ) : (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate("/page/strategy/user-leaderboard")
+                      }
+                    >
+                      <TrophyIcon />
+                      用户排行榜
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate("/page/workspace/admin/scheduled-tasks")
+                      }
+                    >
+                      <CalendarClockIcon />
+                      定时任务管理
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() => navigate("/page/workspace/admin/agents")}
+                    >
+                      <BotIcon />
+                      智能体管理
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() => navigate("/page/workspace/admin/skills")}
+                    >
+                      <SparklesIcon />
+                      技能管理
+                    </DropdownMenuItem>
+                  )}
+                  <DropdownMenuItem
+                    onClick={() => navigate("/page/workspace/admin/tags")}
+                  >
+                    <TagsIcon />
+                    {t.adminTags.title}
+                  </DropdownMenuItem>
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() => navigate("/page/workspace/admin/plugins")}
+                    >
+                      <PlugIcon />
+                      插件管理
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() => navigate("/page/workspace/admin/positions")}
+                    >
+                      <BriefcaseIcon />
+                      岗位管理
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        navigate(
+                          "/page/workspace/settings/recommended-questions",
+                        )
+                      }
+                    >
+                      <MessageCircleQuestionIcon />
+                      推荐问题配置
+                    </DropdownMenuItem>
+                  )}
+                  {isAdmin && logSystem?.enabled && logSystem.url && (
+                    <DropdownMenuItem
+                      onClick={() =>
+                        window.open(
+                          logSystem.url,
+                          "_blank",
+                          "noopener,noreferrer",
+                        )
+                      }
+                    >
+                      <ScrollTextIcon />
+                      {logSystem.label || "日志系统"}
+                    </DropdownMenuItem>
+                  )}
+                </DropdownMenuGroup>
+                <DropdownMenuSeparator />
+              </DropdownMenuContent>
+            </DropdownMenu>
+          ) : (
+            <SidebarMenuButton size="lg" className="pointer-events-none">
+              <NavMenuButtonContent isSidebarOpen={isSidebarOpen} t={t} />
+            </SidebarMenuButton>
+          )}
+        </SidebarMenuItem>
+      </SidebarMenu>
+    </>
+  );
+}