DeXun/fad-trade-next
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 重构导航和博客系统，支持多级菜单和API数据源

Browse Source 
- 重构导航菜单支持多级子菜单结构
- 博客系统改为从API获取数据，移除本地文件存储
- 删除旧的关于页面，准备重构
- 修复博客详情页slug匹配问题
- 默认首页重定向到中文版本
This commit is contained in:
砂糖
2025-11-21 17:49:17 +08:00
parent 0a420f2dbb
commit 216076ff2a
13 changed files with 178 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
components/header/HeaderLinks.tsx
View File

@@ -3,7 +3,6 @@
import { Link as I18nLink, usePathname, useRouter } from "@/i18n/routing";
import { cn } from "@/lib/utils";
import { HeaderLink } from "@/types/common";
import { ExternalLink } from "lucide-react";
import { useTranslations } from "next-intl";
const HeaderLinks = () => {
@@ -17,102 +16,34 @@ const HeaderLinks = () => {
return (
<div className="hidden md:flex flex-row items-center gap-x-2 text-sm font-medium text-muted-500">
{headerLinks.map((link) => {
const isAbout = link.href === "/about";
const isNews = link.href === "/blog";
if (isAbout) {
return (
<div key={link.name} className="relative group">
<I18nLink
href={link.href}
title={link.name}
prefetch={true}
className={cn(
"rounded-xl px-4 py-2 flex items-center gap-x-1 hover:bg-accent-foreground/10 hover:text-accent-foreground",
pathname === link.href && "font-semibold text-accent-foreground"
)}
>
{link.name}
</I18nLink>
{/* 移除触发器与菜单间的间隙，使用 pt-2 保持视觉间距但不中断 hover 区域 */}
<div className="absolute left-0 top-full hidden group-hover:block z-50 pt-2">
<div className="w-56 rounded-md border bg-white shadow-md overflow-hidden">
<I18nLink prefetch={false} href="/about/arch#arch-vision" className="block px-4 py-2 hover:bg-red-600 hover:text-white">友发愿景</I18nLink>
<I18nLink prefetch={false} href="/about/arch#arch-products" className="block px-4 py-2 hover:bg-red-600 hover:text-white">产品体系</I18nLink>
<I18nLink prefetch={false} href="/about/arch#arch-application" className="block px-4 py-2 hover:bg-red-600 hover:text-white">应用场景</I18nLink>
<I18nLink prefetch={false} href="/about/arch#arch-contact" className="block px-4 py-2 hover:bg-red-600 hover:text-white">联系方式</I18nLink>
</div>
</div>
</div>
);
}
if (isNews) {
return (
<div key={link.name} className="relative group">
<I18nLink
href={link.href}
title={link.name}
prefetch={true}
className={cn(
"rounded-xl px-4 py-2 flex items-center gap-x-1 hover:bg-accent-foreground/10 hover:text-accent-foreground",
pathname === link.href && "font-semibold text-accent-foreground"
)}
>
{link.name}
</I18nLink>
<div className="absolute left-0 top-full hidden group-hover:block z-50 pt-2">
<div className="w-44 rounded-md border bg-white shadow-md overflow-hidden">
{[
{ key: "company", label: "公司新闻" },
{ key: "experts", label: "专家访谈" },
{ key: "industry", label: "行业动态" },
{ key: "notice", label: "公告" },
].map((it) => (
<button
key={it.key}
className="block w-full text-left px-4 py-2 hover:bg-red-600 hover:text-white"
onMouseDown={(e) => {
const url = `${localePrefix}/blog?type=${it.key}`;
try { router.push(url as any); } catch {}
// 兜底，确保跳转
setTimeout(() => { if (typeof window !== 'undefined') window.location.href = url; }, 0);
}}
onClick={(e) => {
const url = `${localePrefix}/blog?type=${it.key}`;
try { router.push(url as any); } catch {}
}}
onTouchStart={() => {
const url = `${localePrefix}/blog?type=${it.key}`;
try { router.push(url as any); } catch {}
}}
>
{it.label}
</button>
))}
</div>
</div>
</div>
);
}
return (
<I18nLink
key={link.name}
href={link.href}
title={link.name}
prefetch={link.target && link.target === "_blank" ? false : true}
target={link.target || "_self"}
rel={link.rel || undefined}
className={cn(
"rounded-xl px-4 py-2 flex items-center gap-x-1 hover:bg-accent-foreground/10 hover:text-accent-foreground",
pathname === link.href && "font-semibold text-accent-foreground"
)}
>
{link.name}
{link.target && link.target === "_blank" && (
<span className="text-xs">
<ExternalLink className="w-4 h-4" />
</span>
)}
</I18nLink>
<div key={link.name} className="relative group">
<I18nLink
href={link.href}
title={link.name}
prefetch={true}
className={cn(
"rounded-xl px-4 py-2 flex items-center gap-x-1 hover:bg-accent-foreground/10 hover:text-accent-foreground",
pathname === link.href && "font-semibold text-accent-foreground"
)}
>
{link.name}
</I18nLink>
{
link?.children && (
<div className="absolute left-0 top-full hidden group-hover:block z-50 pt-2">
<div className="w-56 rounded-md border bg-white shadow-md overflow-hidden">
{link.children.map((child) => (
<I18nLink key={child.name} prefetch={false} href={child.href} className="block px-4 py-2 hover:bg-red-600 hover:text-white">
{child.name}
</I18nLink>
))}
</div>
</div>
)
}
</div>
);
})}
</div>