diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 49a9f89..867addf 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -27,6 +27,10 @@ export const metadata: Metadata = { metadataBase: new URL(process.env.NEXT_PUBLIC_SITE_URL || 'https://anything-vs-anything.com'), alternates: { canonical: '/', + languages: { + 'en': '/', + 'zh-CN': '/zh-CN', + }, }, openGraph: { title: "Anything vs Anything - AI-Powered Comparison Tool", diff --git a/src/app/page.tsx b/src/app/page.tsx index 4363270..4f8aad6 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -6,6 +6,7 @@ import ComparisonResults from '@/components/ComparisonResults'; import ComparisonHistory, { HistoryItem } from '@/components/ComparisonHistory'; import ComparisonTips from '@/components/ComparisonTips'; import AdBanner from '@/components/AdBanner'; +import LanguageSwitcher from '@/components/LanguageSwitcher'; import { saveToHistory } from '@/utils/historyStorage'; export default function Home() { @@ -70,6 +71,8 @@ export default function Home() {

Anything vs Anything

+ +

Compare any two things using AI-powered analysis

diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts index 4537f1a..0b54ffb 100644 --- a/src/app/sitemap.ts +++ b/src/app/sitemap.ts @@ -10,5 +10,11 @@ export default function sitemap(): MetadataRoute.Sitemap { changeFrequency: 'daily', priority: 1, }, + { + url: `${baseUrl}/zh-CN`, + lastModified: new Date(), + changeFrequency: 'daily', + priority: 0.9, + }, ] } \ No newline at end of file diff --git a/src/app/zh-CN/layout.tsx b/src/app/zh-CN/layout.tsx new file mode 100644 index 0000000..270e75c --- /dev/null +++ b/src/app/zh-CN/layout.tsx @@ -0,0 +1,129 @@ +import type { Metadata } from "next"; +import { Geist, Geist_Mono } from "next/font/google"; +import "../globals.css"; + +const geistSans = Geist({ + variable: "--font-geist-sans", + subsets: ["latin"], +}); + +const geistMono = Geist_Mono({ + variable: "--font-geist-mono", + subsets: ["latin"], +}); + +export const metadata: Metadata = { + title: "万物皆可比对 - AI智能比较工具", + description: "使用AI智能分析工具比较任何两个事物。获得产品、服务、概念等详细比较。免费在线比较生成器，提供智能洞察。", + keywords: "比较工具, AI比较, 产品比较, 服务比较, 对比工具, 万物比较, 分析工具, 决策辅助", + authors: [{ name: "万物皆可比对" }], + creator: "万物皆可比对", + publisher: "万物皆可比对", + formatDetection: { + email: false, + address: false, + telephone: false, + }, + metadataBase: new URL(process.env.NEXT_PUBLIC_SITE_URL || 'https://anything-vs-anything.com'), + alternates: { + canonical: '/zh-CN', + languages: { + 'en': '/', + 'zh-CN': '/zh-CN', + }, + }, + openGraph: { + title: "万物皆可比对 - AI智能比较工具", + description: "使用AI智能分析工具比较任何两个事物。获得产品、服务、概念等详细比较。", + url: '/zh-CN', + siteName: "万物皆可比对", + locale: 'zh_CN', + type: 'website', + images: [ + { + url: '/og-image.png', + width: 1200, + height: 630, + alt: '万物皆可比对 - AI比较工具', + }, + ], + }, + twitter: { + card: 'summary_large_image', + title: "万物皆可比对 - AI智能比较工具", + description: "使用AI智能分析工具比较任何两个事物。获得产品、服务、概念等详细比较。", + images: ['/og-image.png'], + }, + robots: { + index: true, + follow: true, + googleBot: { + index: true, + follow: true, + 'max-video-preview': -1, + 'max-image-preview': 'large', + 'max-snippet': -1, + }, + }, + verification: { + google: process.env.GOOGLE_SITE_VERIFICATION, + }, +}; + +export default function RootLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + return ( + + + + + + + + + + + + + {children} + + + ); +} \ No newline at end of file diff --git a/src/app/zh-CN/page.tsx b/src/app/zh-CN/page.tsx new file mode 100644 index 0000000..f20ec51 --- /dev/null +++ b/src/app/zh-CN/page.tsx @@ -0,0 +1,478 @@ +'use client'; + +import { useState } from 'react'; +import React from 'react'; +import { HistoryItem } from '@/components/ComparisonHistory'; +import AdBanner from '@/components/AdBanner'; +import LanguageSwitcher from '@/components/LanguageSwitcher'; +import { saveToHistory } from '@/utils/historyStorage'; + +export default function HomePage() { + const [comparisonResults, setComparisonResults] = useState(null); + const [isLoading, setIsLoading] = useState(false); + const [selectedExample, setSelectedExample] = useState<{ item1: string; item2: string } | null>(null); + + const popularExamples = [ + { item1: 'iPhone 15 Pro', item2: '三星 Galaxy S24 Ultra' }, + { item1: 'React', item2: 'Vue.js' }, + { item1: '咖啡', item2: '茶' }, + { item1: 'Netflix', item2: 'Disney+' }, + { item1: 'Python', item2: 'JavaScript' } + ]; + + const handleExampleClick = (example: { item1: string; item2: string }) => { + setSelectedExample(example); + }; + + const handleComparison = async (item1: string, item2: string, description1: string, description2: string) => { + setIsLoading(true); + + try { + const response = await fetch('/api/compare', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + item1, + item2, + description1, + description2, + }), + }); + + if (!response.ok) { + throw new Error('Failed to get comparison'); + } + + const data = await response.json(); + setComparisonResults(data.comparison); + + // Save to history + saveToHistory(item1, item2, description1, description2, data.comparison); + } catch (error) { + console.error('Error:', error); + setComparisonResults('比较过程中出现错误，请重试。'); + } finally { + setIsLoading(false); + } + }; + + const handleSelectHistory = (historyItem: HistoryItem) => { + setComparisonResults(historyItem.result); + }; + + return ( +
+
+
+

+ 万物皆可比对 +

+ + + +

+ 使用AI智能分析比较任何两个事物 +

+

+ 从产品和服务到概念和想法 - 获得由人工智能驱动的全面、公正的比较分析。 + 用详细分析做出明智决策。 +

+ +
+

热门比较

+
+ {popularExamples.map((example, index) => ( + + ))} +
+
+
+ +
+ setSelectedExample(null)} + /> +
+ +
+ +
+ +
+ +
+ + {comparisonResults && ( +
+ +
+ )} + +
+ +
+
+
+ ); +} + +// Chinese version of ComparisonForm +function ComparisonFormZH({ onSubmit, isLoading, selectedExample, onExampleUsed }: { + onSubmit: (item1: string, item2: string, description1: string, description2: string) => void; + isLoading: boolean; + selectedExample?: { item1: string; item2: string } | null; + onExampleUsed?: () => void; +}) { + const [item1, setItem1] = useState(''); + const [item2, setItem2] = useState(''); + const [description1, setDescription1] = useState(''); + const [description2, setDescription2] = useState(''); + const [showDescriptions, setShowDescriptions] = useState(false); + + // Handle selected example + React.useEffect(() => { + if (selectedExample) { + setItem1(selectedExample.item1); + setItem2(selectedExample.item2); + onExampleUsed?.(); + } + }, [selectedExample, onExampleUsed]); + + const examples = [ + { item1: 'iPhone 15 Pro', item2: '三星 Galaxy S24 Ultra', category: '智能手机' }, + { item1: 'React', item2: 'Vue.js', category: '前端框架' }, + { item1: '特斯拉 Model 3', item2: '宝马 i4', category: '电动汽车' }, + { item1: 'Netflix', item2: 'Disney+', category: '流媒体服务' }, + { item1: 'MacBook Pro', item2: 'ThinkPad X1 Carbon', category: '笔记本电脑' }, + { item1: '咖啡', item2: '茶', category: '饮品' } + ]; + + const getRandomExample = () => { + return examples[Math.floor(Math.random() * examples.length)]; + }; + + const fillRandomExample = () => { + const example = getRandomExample(); + setItem1(example.item1); + setItem2(example.item2); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + if (item1.trim() && item2.trim()) { + onSubmit(item1.trim(), item2.trim(), description1.trim(), description2.trim()); + } + }; + + return ( +
+
+

开始比较

+

输入任何两个您想要比较的项目 - 产品、服务、概念或想法

+ +
+ +
+
+
+ +
+ setItem1(e.target.value)} + placeholder="例如：iPhone 15 Pro、React、特斯拉 Model 3" + className={`w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 ${isLoading ? 'bg-gray-50 cursor-not-allowed' : 'bg-white'}`} + disabled={isLoading} + required + /> + {isLoading && ( +
+
+
+ )} +
+
+ +
+ +
+ setItem2(e.target.value)} + placeholder="例如：三星 Galaxy S24、Vue.js、宝马 i4" + className={`w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 ${isLoading ? 'bg-gray-50 cursor-not-allowed' : 'bg-white'}`} + disabled={isLoading} + required + /> + {isLoading && ( +
+
+
+ )} +
+
+
+ +
+ +
+ + {showDescriptions && ( +
+
+ +
+