222 lines
8.9 KiB
TypeScript
222 lines
8.9 KiB
TypeScript
'use client';
|
|
|
|
import { usePathname } from 'next/navigation';
|
|
import { Button } from '@/app/components/ui/button';
|
|
import Header from '@/app/components/Header';
|
|
import Footer from '@/app/components/Footer';
|
|
import Link from 'next/link';
|
|
import { FileX, Home, ArrowLeft } from 'lucide-react';
|
|
|
|
export default function NotFound() {
|
|
const pathname = usePathname();
|
|
|
|
// 从路径中检测语言
|
|
const getLocaleFromPath = (path: string) => {
|
|
if (path.startsWith('/zh-TW')) return 'zh-TW';
|
|
if (path.startsWith('/en')) return 'en';
|
|
return 'zh-CN';
|
|
};
|
|
|
|
const locale = getLocaleFromPath(pathname);
|
|
|
|
// 根据语言设置翻译 - 与详情页面保持一致的结构
|
|
const translations = {
|
|
'zh-CN': {
|
|
nav: {
|
|
home: '首页',
|
|
products: '产品与服务',
|
|
news: '新闻资讯',
|
|
support: '客户支持',
|
|
about: '关于我们',
|
|
contact: '联系我们',
|
|
},
|
|
footer: {
|
|
sections: [
|
|
{
|
|
title: '目录',
|
|
items: ['首页', '产品与服务', '新闻资讯', '客户支持', '关于我们'],
|
|
},
|
|
{
|
|
title: '热门产品',
|
|
items: ['轻量云服务器', '站群服务器', 'EC2服务器', '高防服务器', 'S3云存储'],
|
|
},
|
|
{
|
|
title: '客户支持',
|
|
items: ['技术支持', '在线客服', '帮助文档', '服务状态'],
|
|
},
|
|
{
|
|
title: '公司信息',
|
|
items: ['关于我们', '联系我们', '隐私政策', '服务条款'],
|
|
},
|
|
],
|
|
},
|
|
// 404页面特有的翻译
|
|
notFound: {
|
|
title: '页面未找到',
|
|
description: '抱歉，您访问的页面不存在或已被移除。',
|
|
articleNotFound: '该文章可能没有对应的中文版本。',
|
|
suggestion: '建议您：',
|
|
checkUrl: '检查网址是否正确',
|
|
backHome: '返回首页',
|
|
backNews: '返回新闻列表',
|
|
contactUs: '如果问题持续存在，请联系我们',
|
|
brand: 'AwsLinker'
|
|
}
|
|
},
|
|
'zh-TW': {
|
|
nav: {
|
|
home: '首頁',
|
|
products: '產品與服務',
|
|
news: '新聞資訊',
|
|
support: '客戶支持',
|
|
about: '關於我們',
|
|
contact: '聯繫我們',
|
|
},
|
|
footer: {
|
|
sections: [
|
|
{
|
|
title: '目錄',
|
|
items: ['首頁', '產品與服務', '新聞資訊', '客戶支持', '關於我們'],
|
|
},
|
|
{
|
|
title: '熱門產品',
|
|
items: ['輕量雲服務器', '站群服務器', 'EC2服務器', '高防服務器', 'S3雲存儲'],
|
|
},
|
|
{
|
|
title: '客戶支持',
|
|
items: ['技術支持', '在線客服', '幫助文檔', '服務狀態'],
|
|
},
|
|
{
|
|
title: '公司信息',
|
|
items: ['關於我們', '聯繫我們', '隱私政策', '服務條款'],
|
|
},
|
|
],
|
|
},
|
|
// 404页面特有的翻译
|
|
notFound: {
|
|
title: '頁面未找到',
|
|
description: '抱歉，您訪問的頁面不存在或已被移除。',
|
|
articleNotFound: '該文章可能沒有對應的繁體中文版本。',
|
|
suggestion: '建議您：',
|
|
checkUrl: '檢查網址是否正確',
|
|
backHome: '返回首頁',
|
|
backNews: '返回新聞列表',
|
|
contactUs: '如果問題持續存在，請聯繫我們',
|
|
brand: 'AwsLinker'
|
|
}
|
|
},
|
|
'en': {
|
|
nav: {
|
|
home: 'Home',
|
|
products: 'Products & Services',
|
|
news: 'News',
|
|
support: 'Support',
|
|
about: 'About Us',
|
|
contact: 'Contact Us',
|
|
},
|
|
footer: {
|
|
sections: [
|
|
{
|
|
title: 'Directory',
|
|
items: ['Home', 'Products & Services', 'News', 'Support', 'About Us'],
|
|
},
|
|
{
|
|
title: 'Popular Products',
|
|
items: ['Lightweight Cloud Server', 'Station Group Server', 'EC2 Server', 'High-Defense Server', 'S3 Cloud Storage'],
|
|
},
|
|
{
|
|
title: 'Customer Support',
|
|
items: ['Technical Support', 'Online Service', 'Documentation', 'Service Status'],
|
|
},
|
|
{
|
|
title: 'Company Info',
|
|
items: ['About Us', 'Contact Us', 'Privacy Policy', 'Terms of Service'],
|
|
},
|
|
],
|
|
},
|
|
// 404页面特有的翻译
|
|
notFound: {
|
|
title: 'Page Not Found',
|
|
description: 'Sorry, the page you are looking for does not exist or has been removed.',
|
|
articleNotFound: 'This article may not be available in English.',
|
|
suggestion: 'We suggest you:',
|
|
checkUrl: 'Check if the URL is correct',
|
|
backHome: 'Go to Homepage',
|
|
backNews: 'Back to News',
|
|
contactUs: 'Contact us if the problem persists',
|
|
brand: 'DongYun Tech'
|
|
}
|
|
}
|
|
};
|
|
|
|
const currentTranslations = translations[locale];
|
|
const t = currentTranslations.notFound;
|
|
|
|
// 检查是否是文章页面
|
|
const isArticlePage = pathname.includes('/news/');
|
|
|
|
return (
|
|
<div className="min-h-screen bg-gray-50 flex flex-col">
|
|
<Header
|
|
language={locale}
|
|
setLanguage={() => {}}
|
|
translations={currentTranslations}
|
|
locale={locale}
|
|
/>
|
|
|
|
<main className="flex-1 flex items-center justify-center px-4 py-12">
|
|
<div className="max-w-md w-full text-center">
|
|
<div className="mb-8">
|
|
<div className="mx-auto w-24 h-24 bg-blue-100 rounded-full flex items-center justify-center mb-6">
|
|
<FileX className="w-12 h-12 text-blue-600" />
|
|
</div>
|
|
<h1 className="text-3xl font-bold text-gray-900 mb-4">
|
|
404
|
|
</h1>
|
|
<h2 className="text-xl font-semibold text-gray-700 mb-2">
|
|
{t.title}
|
|
</h2>
|
|
<p className="text-gray-600 mb-4">
|
|
{t.description}
|
|
</p>
|
|
{isArticlePage && (
|
|
<p className="text-blue-600 text-sm mb-6">
|
|
{t.articleNotFound}
|
|
</p>
|
|
)}
|
|
</div>
|
|
|
|
<div className="space-y-4">
|
|
<p className="text-sm text-gray-600 font-medium">
|
|
{t.suggestion}
|
|
</p>
|
|
|
|
<div className="space-y-3">
|
|
<Link href={locale === 'zh-CN' ? '/' : `/${locale}`}>
|
|
<Button className="w-full bg-blue-600 hover:bg-blue-700 text-white">
|
|
<Home className="w-4 h-4 mr-2" />
|
|
{t.backHome}
|
|
</Button>
|
|
</Link>
|
|
|
|
{isArticlePage && (
|
|
<Link href={locale === 'zh-CN' ? '/news' : `/${locale}/news`}>
|
|
<Button variant="outline" className="w-full">
|
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
|
{t.backNews}
|
|
</Button>
|
|
</Link>
|
|
)}
|
|
</div>
|
|
|
|
<p className="text-xs text-gray-500 mt-6">
|
|
{t.contactUs}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<Footer translations={currentTranslations} />
|
|
</div>
|
|
);
|
|
}
|