's'

components/admin/main-nav.tsx

@@ -0,0 +1,25 @@
+import Link from "next/link"
+import { cn } from "@/lib/utils"
+import Image from "next/image"
+
+export function MainNav({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLElement>) {
+  return (
+    <nav
+      className={cn("flex items-center space-x-4 lg:space-x-6", className)}
+      {...props}
+    >
+      <Link href="/admin" className="flex items-center space-x-2">
+        <Image
+          src="/assets/images/logo@2x.png"
+          alt="Logo"
+          width={120}
+          height={40}
+          className="h-8 w-auto"
+        />
+      </Link>
+    </nav>
+  )
+} 

components/admin/search.tsx

@@ -0,0 +1,14 @@
+import { Input } from "@/components/ui/input"
+import { Search as SearchIcon } from "lucide-react"
+
+export function Search() {
+  return (
+    <div className="relative w-64">
+      <SearchIcon className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
+      <Input
+        placeholder="搜索..."
+        className="pl-8"
+      />
+    </div>
+  )
+} 

components/admin/side-nav.tsx

@@ -0,0 +1,71 @@
+import Link from "next/link"
+import { usePathname } from "next/navigation"
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import { ScrollArea } from "@/components/ui/scroll-area"
+import { 
+  LayoutDashboard,
+  Settings,
+  Menu as MenuIcon,
+  Database
+} from "lucide-react"
+
+const sidebarNavItems = [
+  {
+    title: "控制台",
+    href: "/admin",
+    icon: LayoutDashboard,
+  },
+  {
+    title: "站点设置",
+    href: "/admin/site",
+    icon: Settings,
+  },
+  {
+    title: "导航管理",
+    href: "/admin/navigation",
+    icon: MenuIcon,
+  },
+  {
+    title: "资源管理",
+    href: "/admin/resources",
+    icon: Database,
+  },
+]
+
+interface SideNavProps extends React.HTMLAttributes<HTMLDivElement> {}
+
+export function SideNav({ className, ...props }: SideNavProps) {
+  const pathname = usePathname()
+
+  return (
+    <div className={cn("pb-12 border-r h-screen", className)} {...props}>
+      <div className="space-y-4 py-4">
+        <div className="px-3 py-2">
+          <div className="space-y-1">
+            <h2 className="mb-2 px-4 text-xl font-semibold tracking-tight">
+              管理菜单
+            </h2>
+            <ScrollArea className="h-[calc(100vh-8rem)]">
+              <div className="space-y-1">
+                {sidebarNavItems.map((item) => (
+                  <Button
+                    key={item.href}
+                    variant={pathname === item.href ? "secondary" : "ghost"}
+                    className="w-full justify-start"
+                    asChild
+                  >
+                    <Link href={item.href}>
+                      <item.icon className="mr-2 h-4 w-4" />
+                      {item.title}
+                    </Link>
+                  </Button>
+                ))}
+              </div>
+            </ScrollArea>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+} 

components/admin/user-nav.tsx

@@ -0,0 +1,80 @@
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+} from "@/components/ui/dropdown-menu"
+import { Button } from "@/components/ui/button"
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
+import { signOut } from 'next-auth/react'
+import { useTheme } from "next-themes"
+import { Moon, Sun, Monitor } from "lucide-react"
+
+interface UserNavProps {
+  user: {
+    name?: string | null
+    email?: string | null
+    image?: string | null
+  }
+}
+
+export function UserNav({ user }: UserNavProps) {
+  const { setTheme } = useTheme()
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="ghost" className="relative h-8 w-8 rounded-full">
+          <Avatar className="h-8 w-8">
+            <AvatarImage src={user.image || ''} alt={user.name || ''} />
+            <AvatarFallback>{user.name?.[0]}</AvatarFallback>
+          </Avatar>
+        </Button>
+      </DropdownMenuTrigger>
+      <DropdownMenuContent className="w-56" align="end" forceMount>
+        <DropdownMenuLabel className="font-normal">
+          <div className="flex flex-col space-y-1">
+            <p className="text-sm font-medium leading-none">{user.name}</p>
+            <p className="text-xs leading-none text-muted-foreground">
+              {user.email}
+            </p>
+          </div>
+        </DropdownMenuLabel>
+        <DropdownMenuSeparator />
+        <DropdownMenuSub>
+          <DropdownMenuSubTrigger>
+            <Sun className="h-4 w-4 mr-2 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+            <Moon className="absolute h-4 w-4 mr-2 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+            <span className="ml-2">主题</span>
+          </DropdownMenuSubTrigger>
+          <DropdownMenuSubContent>
+            <DropdownMenuItem onClick={() => setTheme("light")}>
+              <Sun className="h-4 w-4 mr-2" />
+              浅色
+            </DropdownMenuItem>
+            <DropdownMenuItem onClick={() => setTheme("dark")}>
+              <Moon className="h-4 w-4 mr-2" />
+              深色
+            </DropdownMenuItem>
+            <DropdownMenuItem onClick={() => setTheme("system")}>
+              <Monitor className="h-4 w-4 mr-2" />
+              跟随系统
+            </DropdownMenuItem>
+          </DropdownMenuSubContent>
+        </DropdownMenuSub>
+        <DropdownMenuSeparator />
+        <DropdownMenuItem
+          className="text-red-600 cursor-pointer"
+          onClick={() => signOut({ callbackUrl: '/' })}
+        >
+          退出登录
+        </DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  )
+}