"use client"; import { useState } from "react"; import Link from "next/link"; import { Navbar, NavbarBrand, NavbarContent, NavbarItem, NavbarMenuToggle, NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink, Drawer, DrawerContent, Button, } from "@hulianui/ui"; import { Cloud } from "lucide-react"; // 营销站顶部导航栏区块 —— 自包含、可整段复制。 // 粘性 + 毛玻璃（Navbar sticky 自带 bg-surface/80 + backdrop-blur）。 // 桌面：NavigationMenu（「产品」mega 下拉 + 方案/定价/文档/博客纯链接）。 // 移动端：汉堡 NavbarMenuToggle → 受控 Drawer 抽屉菜单。 // 复制后改：products 子项、主菜单 navItems、CTA href。 const products = [ { title: "弹性部署", desc: "git push 即上线，闲时归零" }, { title: "边缘网络", desc: "全球 300+ 节点就近分发" }, { title: "可观测", desc: "端到端日志、指标与追踪" }, { title: "算力市场", desc: "按秒计费的 GPU / CPU 实例" }, ]; const navItems = [ { label: "方案", href: "#solutions" }, { label: "定价", href: "#pricing" }, { label: "文档", href: "#docs" }, { label: "博客", href: "#blog" }, ]; export function NavbarBlock() { const [open, setOpen] = useState(false); return ( {/* 移动端汉堡 */} setOpen((v) => !v)} /> {/* 左：Logo */} 瀚云 {/* 中：桌面主菜单（含「产品」下拉分组） */} 产品

{products.map((p) => (

{p.title}

{p.desc}

))}

{navItems.map((it) => ( {it.label} ))} {/* 右：登录 + 免费开始 */} {/* 移动端抽屉菜单（受控） */} ); }