refactor: 合并导航栏，减少导航项从 11 个到 7 个

合并相关功能页面：
- 智能路由 + 容错配置 → 路由管理（Tab 切换）
- 配置切换 + 配置管理 → 配置管理（Tab 切换）
- MCP + Prompts + Skills → 扩展（Tab 切换）

新增组件：
- RoutingManagementPage: 路由管理合并页面
- ConfigManagementPage: 配置管理合并页面
- ExtensionsPage: 扩展合并页面

各子页面支持 hideHeader 属性，嵌入合并页面时隐藏标题

Author: wutongci

src/App.tsx

@@ -1,33 +1,21 @@
 import { useState } from "react";
 import { Sidebar } from "./components/Sidebar";
 import { Dashboard } from "./components/Dashboard";
-import { Providers } from "./components/Providers";
 import { SettingsPage } from "./components/settings";
-import { SwitchPage } from "./components/switch";
-import { ClientsPage } from "./components/clients";
-import { McpPage } from "./components/mcp";
-import { PromptsPage } from "./components/prompts";
 import { ApiServerPage } from "./components/api-server/ApiServerPage";
-import { SkillsPage } from "./components/skills";
 import { ProviderPoolPage } from "./components/provider-pool";
-import { RoutingPage } from "./components/routing";
-import { ResiliencePage } from "./components/resilience";
-import { ConfigPage } from "./components/config";
+import { RoutingManagementPage } from "./components/routing/RoutingManagementPage";
+import { ConfigManagementPage } from "./components/config/ConfigManagementPage";
+import { ExtensionsPage } from "./components/extensions";
 
 type Page =
   | "dashboard"
-  | "clients"
-  | "api-server"
-  | "providers"
-  | "settings"
-  | "switch"
-  | "mcp"
-  | "prompts"
-  | "skills"
   | "provider-pool"
-  | "routing"
-  | "resilience"
-  | "config";
+  | "routing-management"
+  | "config-management"
+  | "extensions"
+  | "api-server"
+  | "settings";
 
 function App() {
   const [currentPage, setCurrentPage] = useState<Page>("dashboard");
@@ -38,28 +26,16 @@ function App() {
         return <Dashboard />;
       case "provider-pool":
         return <ProviderPoolPage />;
-      case "clients":
-        return <ClientsPage />;
+      case "routing-management":
+        return <RoutingManagementPage />;
+      case "config-management":
+        return <ConfigManagementPage />;
+      case "extensions":
+        return <ExtensionsPage />;
       case "api-server":
         return <ApiServerPage />;
-      case "providers":
-        return <Providers />;
       case "settings":
         return <SettingsPage />;
-      case "switch":
-        return <SwitchPage />;
-      case "mcp":
-        return <McpPage />;
-      case "prompts":
-        return <PromptsPage />;
-      case "skills":
-        return <SkillsPage />;
-      case "routing":
-        return <RoutingPage />;
-      case "resilience":
-        return <ResiliencePage />;
-      case "config":
-        return <ConfigPage />;
       default:
         return <Dashboard />;
     }

src/components/Sidebar.tsx

@@ -1,32 +1,22 @@
 import {
   LayoutDashboard,
   Settings,
-  Plug,
-  MessageSquare,
-  Monitor,
   Globe,
-  Boxes,
   Database,
   Route,
-  Shield,
   FileCode,
+  Puzzle,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
 
 type Page =
   | "dashboard"
-  | "clients"
-  | "api-server"
-  | "providers"
-  | "settings"
-  | "switch"
-  | "mcp"
-  | "prompts"
-  | "skills"
   | "provider-pool"
-  | "routing"
-  | "resilience"
-  | "config";
+  | "routing-management"
+  | "config-management"
+  | "extensions"
+  | "api-server"
+  | "settings";
 
 interface SidebarProps {
   currentPage: Page;
@@ -36,14 +26,10 @@ interface SidebarProps {
 const navItems = [
   { id: "dashboard" as Page, label: "仪表盘", icon: LayoutDashboard },
   { id: "provider-pool" as Page, label: "凭证池", icon: Database },
-  { id: "routing" as Page, label: "智能路由", icon: Route },
-  { id: "resilience" as Page, label: "容错配置", icon: Shield },
-  { id: "config" as Page, label: "配置管理", icon: FileCode },
-  { id: "clients" as Page, label: "配置切换", icon: Monitor },
+  { id: "routing-management" as Page, label: "路由管理", icon: Route },
+  { id: "config-management" as Page, label: "配置管理", icon: FileCode },
+  { id: "extensions" as Page, label: "扩展", icon: Puzzle },
   { id: "api-server" as Page, label: "API Server", icon: Globe },
-  { id: "mcp" as Page, label: "MCP", icon: Plug },
-  { id: "prompts" as Page, label: "Prompts", icon: MessageSquare },
-  { id: "skills" as Page, label: "Skills", icon: Boxes },
   { id: "settings" as Page, label: "设置", icon: Settings },
 ];
 

src/components/clients/ClientsPage.tsx

@@ -4,18 +4,24 @@ import { AppTabs } from "./AppTabs";
 import { ProviderList } from "./ProviderList";
 import { HelpTip } from "@/components/HelpTip";
 
-export function ClientsPage() {
+interface ClientsPageProps {
+  hideHeader?: boolean;
+}
+
+export function ClientsPage({ hideHeader = false }: ClientsPageProps) {
   const [activeApp, setActiveApp] = useState<AppType>("claude");
 
   return (
     <div className="space-y-6">
-      <div>
-        <h2 className="text-2xl font-bold">配置切换</h2>
-        <p className="text-muted-foreground">
-          一键切换 Claude Code / Codex / Gemini CLI 的 API 配置，快速在不同
-          Provider 间切换
-        </p>
-      </div>
+      {!hideHeader && (
+        <div>
+          <h2 className="text-2xl font-bold">配置切换</h2>
+          <p className="text-muted-foreground">
+            一键切换 Claude Code / Codex / Gemini CLI 的 API 配置，快速在不同
+            Provider 间切换
+          </p>
+        </div>
+      )}
 
       <HelpTip title="关于 ProxyCast 本地代理" variant="blue">
         <p className="text-sm text-blue-700 dark:text-blue-400">

src/components/config/ConfigManagementPage.tsx

@@ -0,0 +1,50 @@
+import { useState } from "react";
+import { Monitor, FileCode } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { ClientsPage } from "../clients/ClientsPage";
+import { ConfigPage } from "./ConfigPage";
+
+type Tab = "switch" | "config";
+
+const tabs = [
+  { id: "switch" as Tab, label: "配置切换", icon: Monitor },
+  { id: "config" as Tab, label: "配置文件", icon: FileCode },
+];
+
+export function ConfigManagementPage() {
+  const [activeTab, setActiveTab] = useState<Tab>("switch");
+
+  return (
+    <div className="space-y-6">
+      <div>
+        <h2 className="text-2xl font-bold">配置管理</h2>
+        <p className="text-muted-foreground">管理客户端配置和配置文件</p>
+      </div>
+
+      {/* Tab 切换 */}
+      <div className="flex gap-1 border-b">
+        {tabs.map((tab) => (
+          <button
+            key={tab.id}
+            onClick={() => setActiveTab(tab.id)}
+            className={cn(
+              "flex items-center gap-2 px-4 py-2 text-sm font-medium border-b-2 -mb-px transition-colors",
+              activeTab === tab.id
+                ? "border-primary text-primary"
+                : "border-transparent text-muted-foreground hover:text-foreground",
+            )}
+          >
+            <tab.icon className="h-4 w-4" />
+            {tab.label}
+          </button>
+        ))}
+      </div>
+
+      {/* Tab 内容 */}
+      <div className="pt-2">
+        {activeTab === "switch" && <ClientsPage hideHeader />}
+        {activeTab === "config" && <ConfigPage hideHeader />}
+      </div>
+    </div>
+  );
+}