94 lines
2.3 KiB
TypeScript
94 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
import * as React from "react";
|
|
import Link from "next/link";
|
|
import {
|
|
CreditCardIcon,
|
|
LayoutDashboardIcon,
|
|
WalletCardsIcon,
|
|
} from "lucide-react";
|
|
|
|
import { FluxentLogo } from "@/components/fluxent-logo";
|
|
import { NavMain, type NavMainItem } from "@/components/nav-main";
|
|
import { NavUser, type NavUserData } from "@/components/nav-user";
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarHeader,
|
|
SidebarMenu,
|
|
SidebarMenuButton,
|
|
SidebarMenuItem,
|
|
useSidebar,
|
|
} from "@/components/ui/sidebar";
|
|
|
|
const navMainItems: NavMainItem[] = [
|
|
{
|
|
title: "控制台",
|
|
url: "/",
|
|
icon: LayoutDashboardIcon,
|
|
},
|
|
{
|
|
title: "资金账户",
|
|
url: "/accounts",
|
|
icon: WalletCardsIcon,
|
|
},
|
|
{
|
|
title: "支付渠道",
|
|
url: "/channels",
|
|
icon: CreditCardIcon,
|
|
},
|
|
];
|
|
|
|
export function AppSidebar({
|
|
user,
|
|
...props
|
|
}: {
|
|
user: NavUserData;
|
|
} & React.ComponentProps<typeof Sidebar>) {
|
|
const { isMobile, setOpenMobile } = useSidebar();
|
|
|
|
const handleLogoNavigation = () => {
|
|
if (isMobile) {
|
|
setOpenMobile(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Sidebar variant="inset" {...props}>
|
|
{/* Sidebar Header: Fluxent Logo & Brand */}
|
|
<SidebarHeader className="p-2.5">
|
|
<SidebarMenu>
|
|
<SidebarMenuItem>
|
|
<SidebarMenuButton
|
|
size="lg"
|
|
render={<Link href="/" onClick={handleLogoNavigation} />}
|
|
className="gap-2.5 hover:bg-sidebar-accent"
|
|
>
|
|
<FluxentLogo size={32} />
|
|
<div className="grid flex-1 text-left leading-tight">
|
|
<span className="truncate font-heading text-sm font-bold tracking-tight text-sidebar-foreground">
|
|
Fluxent
|
|
</span>
|
|
<span className="truncate text-[10px] tracking-wider text-muted-foreground uppercase">
|
|
财务操作系统
|
|
</span>
|
|
</div>
|
|
</SidebarMenuButton>
|
|
</SidebarMenuItem>
|
|
</SidebarMenu>
|
|
</SidebarHeader>
|
|
|
|
{/* Sidebar Content: Main navigation & secondary links */}
|
|
<SidebarContent>
|
|
<NavMain items={navMainItems} />
|
|
</SidebarContent>
|
|
|
|
{/* Sidebar Footer: User profile card with dropdown */}
|
|
<SidebarFooter>
|
|
<NavUser user={user} />
|
|
</SidebarFooter>
|
|
</Sidebar>
|
|
);
|
|
}
|