--- import Footer from '../components/sections/Footer.astro'; import 'font-awesome/css/font-awesome.min.css'; const { title = "浙江贝凡网络科技", activeNav = "home" } = Astro.props; interface NavChild { id: string; label: string; href: string; icon: string; } interface NavItem { id: string; label: string; href: string; icon: string; children?: NavChild[]; } const navItems: NavItem[] = [ { id: 'home', label: '公司介绍', href: '/', icon: 'fa-building' }, { id: 'products', label: '产品中心', href: '/qazk', icon: 'fa-cubes', children: [ { id: 'qazk', label: '工贸企业', href: '/qazk', icon: 'fa-cogs' }, { id: 'elderly', label: '智慧养老', href: '/elderly', icon: 'fa-heartbeat' }, { id: 'construction', label: '智慧工地', href: '/construction', icon: 'fa-industry' }, { id: 'kitchen', label: '明厨亮灶', href: '/kitchen', icon: 'fa-cutlery' }, { id: 'education', label: '智慧学校', href: '/education', icon: 'fa-graduation-cap' }, ] }, { id: 'customization', label: '本地化定制', href: '/customization', icon: 'fa-wrench' }, { id: 'partnership', label: '生态合作', href: '/partnership', icon: 'fa-handshake-o' }, ]; function isActive(item: NavItem): boolean { if (item.id === activeNav) return true; if (item.children) return item.children.some(child => child.id === activeNav); return false; } function getNavLinkClass(item: NavItem) { const baseClass = 'flex items-center gap-2 px-4 py-2.5 rounded-full font-medium transition-all duration-300'; if (isActive(item)) { return `${baseClass} bg-primary text-white shadow-md`; } return `${baseClass} text-gray-600 hover:text-primary hover:bg-primary/10`; } function getMobileNavLinkClass(item: NavItem) { const baseClass = 'flex flex-col items-center justify-center py-2 px-2 min-w-[4.5rem] rounded-xl transition-all duration-300'; if (isActive(item)) { return `${baseClass} bg-primary text-white`; } return `${baseClass} text-gray-600 hover:bg-primary/10`; } --- {title}
{ navItems.map(item => item.children ? ( ) : ( {item.label} )) }