feat: global shell — header, footer, sidebars, and layout integration

app/(account)/layout.tsx

@@ -1,16 +1,14 @@
+import { AccountSidebar } from "@/components/account-sidebar"
+import { Header } from "@/components/header"
+
 export default function AccountLayout({ children }: { children: React.ReactNode }) {
   return (
-    <div className="flex min-h-screen">
-      <aside className="w-64 border-r bg-muted/30 p-4">
-        <h2 className="mb-4 text-lg font-semibold">账号设置</h2>
-        <nav className="space-y-2 text-sm text-muted-foreground">
-          <div>个人资料</div>
-          <div>钱包</div>
-          <div>通知</div>
-          <div>身份认证</div>
-        </nav>
-      </aside>
-      <main className="flex-1 p-6">{children}</main>
+    <div className="flex min-h-screen flex-col">
+      <Header />
+      <div className="flex flex-1">
+        <AccountSidebar />
+        <main className="flex-1 p-6">{children}</main>
+      </div>
     </div>
   )
 }

app/(dashboard)/layout.tsx

@@ -1,15 +1,14 @@
+import { DashboardSidebar } from "@/components/dashboard-sidebar"
+import { Header } from "@/components/header"
+
 export default function DashboardLayout({ children }: { children: React.ReactNode }) {
   return (
-    <div className="flex min-h-screen">
-      <aside className="w-64 border-r bg-muted/30 p-4">
-        <h2 className="mb-4 text-lg font-semibold">管理后台</h2>
-        <nav className="space-y-2 text-sm text-muted-foreground">
-          <div>服务管理</div>
-          <div>店铺管理</div>
-          <div>员工管理</div>
-        </nav>
-      </aside>
-      <main className="flex-1 p-6">{children}</main>
+    <div className="flex min-h-screen flex-col">
+      <Header />
+      <div className="flex flex-1">
+        <DashboardSidebar />
+        <main className="flex-1 p-6">{children}</main>
+      </div>
     </div>
   )
 }

app/(main)/layout.tsx

@@ -1,20 +1,12 @@
+import { Footer } from "@/components/footer"
+import { Header } from "@/components/header"
+
 export default function MainLayout({ children }: { children: React.ReactNode }) {
   return (
     <div className="flex min-h-screen flex-col">
-      <header className="border-b">
-        <nav className="container mx-auto flex h-16 items-center justify-between px-4">
-          <span className="text-xl font-bold">聚玩</span>
-          <div className="flex items-center gap-4">
-            <span className="text-sm text-muted-foreground">导航占位</span>
-          </div>
-        </nav>
-      </header>
+      <Header />
       <main className="flex-1">{children}</main>
-      <footer className="border-t py-6">
-        <div className="container mx-auto px-4 text-center text-sm text-muted-foreground">
-          © 聚玩 - 游戏陪玩服务平台
-        </div>
-      </footer>
+      <Footer />
     </div>
   )
 }

app/(order)/layout.tsx

@@ -1,3 +1,10 @@
+import { Header } from "@/components/header"
+
 export default function OrderLayout({ children }: { children: React.ReactNode }) {
-  return <div className="min-h-screen bg-muted/30">{children}</div>
+  return (
+    <div className="flex min-h-screen flex-col">
+      <Header />
+      <main className="flex-1 bg-muted/30">{children}</main>
+    </div>
+  )
 }

app/providers.tsx

@@ -2,6 +2,7 @@
 
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { useState } from "react"
+import { TooltipProvider } from "@/components/ui/tooltip"
 
 export function Providers({ children }: { children: React.ReactNode }) {
   const [queryClient] = useState(
@@ -16,5 +17,9 @@ export function Providers({ children }: { children: React.ReactNode }) {
       }),
   )
 
-  return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+  return (
+    <QueryClientProvider client={queryClient}>
+      <TooltipProvider>{children}</TooltipProvider>
+    </QueryClientProvider>
+  )
 }