61 lines
2.1 KiB
TypeScript
61 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
import {
|
|
BookOpenCheck,
|
|
CalendarDays,
|
|
ClipboardCheck,
|
|
DatabaseZap,
|
|
Gauge,
|
|
Library,
|
|
ListChecks,
|
|
Settings,
|
|
ShieldAlert
|
|
} from "lucide-react";
|
|
|
|
const navItems = [
|
|
{ href: "/dashboard", label: "仪表盘", icon: Gauge },
|
|
{ href: "/sessions", label: "答疑场次", icon: CalendarDays },
|
|
{ href: "/review", label: "待审核", icon: ClipboardCheck },
|
|
{ href: "/high-risk", label: "高风险", icon: ShieldAlert },
|
|
{ href: "/standard-qa", label: "标准库", icon: Library },
|
|
{ href: "/callable-qa", label: "可调用库", icon: DatabaseZap },
|
|
{ href: "/logs", label: "运行日志", icon: ListChecks },
|
|
{ href: "/settings", label: "系统设置", icon: Settings }
|
|
];
|
|
|
|
export default function Sidebar() {
|
|
const pathname = usePathname();
|
|
|
|
return (
|
|
<aside className="z-20 flex w-full flex-col border-b border-line bg-white md:fixed md:inset-y-0 md:left-0 md:w-64 md:border-b-0 md:border-r">
|
|
<div className="flex h-16 shrink-0 items-center gap-3 border-b border-line px-5">
|
|
<BookOpenCheck className="h-6 w-6 text-jade" aria-hidden />
|
|
<div>
|
|
<div className="text-sm font-semibold text-ink">大本营答疑资产</div>
|
|
<div className="text-xs text-slate-500">后台系统 MVP</div>
|
|
</div>
|
|
</div>
|
|
<nav className="flex gap-1 overflow-x-auto px-3 py-3 md:block md:flex-1 md:space-y-1 md:overflow-visible md:py-4">
|
|
{navItems.map((item) => {
|
|
const Icon = item.icon;
|
|
const active = pathname === item.href || pathname.startsWith(`${item.href}/`);
|
|
return (
|
|
<Link
|
|
key={item.href}
|
|
href={item.href}
|
|
className={`flex h-10 shrink-0 items-center gap-3 rounded-md px-3 text-sm transition ${
|
|
active ? "bg-teal-50 text-jade" : "text-slate-600 hover:bg-slate-100 hover:text-ink"
|
|
}`}
|
|
>
|
|
<Icon className="h-4 w-4" aria-hidden />
|
|
<span>{item.label}</span>
|
|
</Link>
|
|
);
|
|
})}
|
|
</nav>
|
|
</aside>
|
|
);
|
|
}
|