init

2026-01-24 16:54:44 +08:00
commit 70f337bb92
186 changed files with 23792 additions and 0 deletions
--- a/app/BaiDuAnalytics.tsx
+++ b/app/BaiDuAnalytics.tsx
@@ -0,0 +1,33 @@
+"use client";
+
+import Script from "next/script";
+
+const BaiDuAnalytics = () => {
+  return (
+    <>
+      {process.env.NEXT_PUBLIC_BAIDU_TONGJI ? (
+        <>
+          <Script
+            id="baidu-tongji"
+            strategy="afterInteractive"
+            dangerouslySetInnerHTML={{
+              __html: `
+              var _hmt = _hmt || [];
+              (function() {
+                var hm = document.createElement("script");
+                hm.src = "https://hm.baidu.com/hm.js?${process.env.NEXT_PUBLIC_BAIDU_TONGJI}";
+                var s = document.getElementsByTagName("script")[0]; 
+                s.parentNode.insertBefore(hm, s);
+              })();
+            `,
+            }}
+          />
+        </>
+      ) : (
+        <></>
+      )}
+    </>
+  );
+};
+
+export default BaiDuAnalytics;
--- a/app/GoogleAdsense.tsx
+++ b/app/GoogleAdsense.tsx
@@ -0,0 +1,24 @@
+"use client";
+
+import Script from "next/script";
+
+const GoogleAdsense = () => {
+  return (
+    <>
+      {process.env.NEXT_PUBLIC_GOOGLE_ADSENSE_ID ? (
+        <>
+          <Script
+            async
+            src={`https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-${process.env.NEXT_PUBLIC_GOOGLE_ADSENSE_ID}`}
+            crossOrigin="anonymous"
+            strategy="afterInteractive"
+          />
+        </>
+      ) : (
+        <></>
+      )}
+    </>
+  );
+};
+
+export default GoogleAdsense;
--- a/app/GoogleAnalytics.tsx
+++ b/app/GoogleAnalytics.tsx
@@ -0,0 +1,37 @@
+"use client";
+
+import Script from "next/script";
+import * as gtag from "../gtag.js";
+
+const GoogleAnalytics = () => {
+  return (
+    <>
+      {gtag.GA_TRACKING_ID ? (
+        <>
+          <Script
+            strategy="afterInteractive"
+            src={`https://www.googletagmanager.com/gtag/js?id=${gtag.GA_TRACKING_ID}`}
+          />
+          <Script
+            id="gtag-init"
+            strategy="afterInteractive"
+            dangerouslySetInnerHTML={{
+              __html: `
+                window.dataLayer = window.dataLayer || [];
+                function gtag(){dataLayer.push(arguments);}
+                gtag('js', new Date());
+                gtag('config', '${gtag.GA_TRACKING_ID}', {
+                page_path: window.location.pathname,
+                });
+              `,
+            }}
+          />
+        </>
+      ) : (
+        <></>
+      )}
+    </>
+  );
+};
+
+export default GoogleAnalytics;
--- a/app/PlausibleAnalytics.tsx
+++ b/app/PlausibleAnalytics.tsx
@@ -0,0 +1,39 @@
+"use client";
+
+import Script from "next/script";
+
+// 你可以将域名放在环境变量中，这里先直接使用你提供的域名
+const PLAUSIBLE_DOMAIN = process.env.NEXT_PUBLIC_PLAUSIBLE_DOMAIN;
+const PLAUSIBLE_SRC = process.env.NEXT_PUBLIC_PLAUSIBLE_SRC;
+
+const PlausibleAnalytics = () => {
+  return (
+    <>
+      {PLAUSIBLE_DOMAIN ? (
+        <>
+          <Script
+            strategy="afterInteractive"
+            data-domain={PLAUSIBLE_DOMAIN}
+            src={PLAUSIBLE_SRC}
+            defer
+          />
+          <Script
+            id="plausible-init"
+            strategy="afterInteractive"
+            dangerouslySetInnerHTML={{
+              __html: `
+                window.plausible = window.plausible || function() { 
+                  (window.plausible.q = window.plausible.q || []).push(arguments) 
+                }
+              `,
+            }}
+          />
+        </>
+      ) : (
+        <></>
+      )}
+    </>
+  );
+};
+
+export default PlausibleAnalytics;
--- a/app/[locale]/about/[section]/page.tsx
+++ b/app/[locale]/about/[section]/page.tsx
@@ -0,0 +1,121 @@
+import MDXComponents from "@/components/mdx/MDXComponents";
+import { Locale, LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import fs from "fs/promises";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+import { MDXRemote } from "next-mdx-remote-client/rsc";
+import path from "path";
+import remarkGfm from "remark-gfm";
+
+// 强制静态渲染
+export const dynamic = "force-static";
+
+const options = {
+  parseFrontmatter: true,
+  mdxOptions: {
+    remarkPlugins: [remarkGfm],
+    rehypePlugins: [],
+  },
+};
+
+// 增强：添加参数校验，防止undefined
+async function getMDXContent(locale: string, section: string) {
+  // 兜底校验：确保参数是字符串
+  const validLocale = locale?.trim() || "en"; // 兜底为默认语言
+  const validSection = section?.trim() || "company"; // 兜底为默认section
+
+  // 校验LOCALES是否包含当前locale
+  if (!LOCALES.includes(validLocale)) {
+    console.error(`Locale "${validLocale}" not found in LOCALES!`);
+    return "";
+  }
+
+  const filePath = path.join(
+    process.cwd(),
+    "content",
+    "about",
+    validSection, // 使用校验后的section
+    `${validLocale}.mdx` // 使用校验后的locale
+  );
+
+  try {
+    // 先检查文件是否存在，避免读取不存在的文件
+    await fs.access(filePath);
+    const content = await fs.readFile(filePath, "utf-8");
+    return content;
+  } catch (error) {
+    console.error(`Error accessing/reading MDX file (${filePath}):`, error);
+    return "";
+  }
+}
+
+// 修正：路由参数类型（locale + section）
+type Params = {
+  locale: string;
+  section: string;
+};
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, section } = params;
+  const t = await getTranslations({ locale, namespace: "About" });
+
+  return constructMetadata({
+    page: `About - ${section}`,
+    title: t(`title`) || t("title"), // 适配不同section的标题
+    description: t(`description`) || t("description"),
+    locale: locale as Locale,
+    path: `/about/${section}`,
+    canonicalUrl: `/about/${section}`,
+  });
+}
+
+// 页面组件：从params获取locale和section（路由参数）
+export default async function AboutPage({
+  params,
+}: {
+  params: Promise<Params>;
+}) {
+  const { locale, section } = await params;
+
+  console.log(`Rendering AboutPage for locale: ${locale}, section: ${section}`);
+  // 调用带校验的getContent函数
+  const content = await getMDXContent(locale, section);
+
+  return (
+    <article className="w-full md:w-3/5 px-2 md:px-12">
+      <MDXRemote
+        source={content}
+        components={MDXComponents}
+        options={options}
+      />
+    </article>
+  );
+}
+
+// 关键：生成locale + section的所有静态组合（覆盖vi/organization等）
+export async function generateStaticParams() {
+  // const sections = ['company', 'awards', 'base', 'culture', 'history', 'organization'];
+  const sections = ['company'];
+
+  // 确保LOCALES包含"vi"（越南语），否则会生成undefined！
+  // if (!LOCALES.includes("vi")) {
+  //   console.warn("⚠️ LOCALES does not include 'vi'! Add it to fix /vi/about/* paths.");
+  //   // 临时兜底：如果没有vi，手动添加（或检查你的i18n/routing.ts）
+  //   // LOCALES.push("vi"); 
+  // }
+
+  // 生成所有locale × section的组合
+  return LOCALES.flatMap((locale) =>
+    sections.map((section) => ({
+      locale,
+      section,
+    }))
+  );
+}
--- a/app/[locale]/about/page.tsx
+++ b/app/[locale]/about/page.tsx
@@ -0,0 +1,32 @@
+import { LOCALES } from "@/i18n/routing";
+import { redirect } from "next/navigation";
+
+// 重定向到 /about/company
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ locale: string }>;
+}) {
+  const { locale } = await params;
+  return redirect(`/${locale}/about/company`);
+}
+
+// 关键：生成locale + section的所有静态组合（覆盖vi/organization等）
+export async function generateStaticParams() {
+  const sections = ['company', 'awards', 'base', 'culture', 'history', 'organization'];
+
+  // 确保LOCALES包含"vi"（越南语），否则会生成undefined！
+  if (!LOCALES.includes("vi")) {
+    console.warn("⚠️ LOCALES does not include 'vi'! Add it to fix /vi/about/* paths.");
+    // 临时兜底：如果没有vi，手动添加（或检查你的i18n/routing.ts）
+    // LOCALES.push("vi"); 
+  }
+
+  // 生成所有locale × section的组合
+  return LOCALES.flatMap((locale) =>
+    sections.map((section) => ({
+      locale,
+      section,
+    }))
+  );
+}
--- a/app/[locale]/blog/BlogCard.tsx
+++ b/app/[locale]/blog/BlogCard.tsx
@@ -0,0 +1,31 @@
+import { Link as I18nLink } from "@/i18n/routing";
+import { BlogPost } from "@/types/blog";
+import dayjs from "dayjs";
+import Image from "next/image";
+
+export function BlogCard({ post, locale }: { post: BlogPost; locale: string }) {
+  return (
+    <I18nLink
+      href={`/blog${post.slug}`}
+      prefetch={false}
+      className="bg-transparent rounded-lg hover:underline"
+    >
+      <div className="relative rounded shadow-md  pt-[56.25%]">
+        <Image
+          src={post.image || "/placeholder.svg"}
+          alt={post.title}
+          fill
+          className="object-cover shadow-sm w-full rounded hover:shadow-lg transition-shadow duration-200 h-[200p]"
+        />
+      </div>
+      <div className="py-3 flex-1 flex flex-col">
+        <h2 className="text-lg font-500 line-clamp-2 flex-grow">
+          {post.title}
+        </h2>
+        <p className="text-gray-600 dark:text-gray-400 text-sm mt-2">
+          {dayjs(post.date).format("YYYY-MM-DD")}
+        </p>
+      </div>
+    </I18nLink>
+  );
+}
--- a/app/[locale]/blog/ParallaxHero.tsx
+++ b/app/[locale]/blog/ParallaxHero.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import Image from "next/image";
+import { useEffect, useState } from "react";
+
+export default function ParallaxHero() {
+  const [y, setY] = useState(0);
+  useEffect(() => {
+    const onScroll = () => setY(window.scrollY);
+    window.addEventListener("scroll", onScroll, { passive: true });
+    return () => window.removeEventListener("scroll", onScroll);
+  }, []);
+
+  const maxH = 420;
+  const minH = 140;
+  const delta = Math.max(0, Math.min(maxH - minH, y));
+  const height = maxH - delta;
+  const overlayOpacity = 0.25 + delta / (maxH - minH) * 0.15;
+  const titleScale = 1 - delta / (maxH - minH) * 0.2;
+
+  return (
+    <div className="relative" style={{ height: maxH }}>
+      <div className="sticky top-0 z-40">
+        <div className="relative w-full" style={{ height }}>
+          <Image src="/placeholder.svg" alt="投资者关系" fill className="object-cover" priority />
+          <div className="absolute inset-0" style={{ backgroundColor: `rgba(0,0,0,${overlayOpacity})` }} />
+          <div className="absolute left-6 md:left-12 bottom-6 md:bottom-10 text-white" style={{ transform: `scale(${titleScale})`, transformOrigin: "left bottom" }}>
+            <div className="text-2xl md:text-4xl font-semibold">投资者关系</div>
+            <div className="text-lg md:text-2xl mt-1 opacity-90">Investor</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
--- a/app/[locale]/blog/[slug]/page.tsx
+++ b/app/[locale]/blog/[slug]/page.tsx
@@ -0,0 +1,156 @@
+import { Callout } from "@/components/mdx/Callout";
+import MDXComponents from "@/components/mdx/MDXComponents";
+import { Locale, LOCALES } from "@/i18n/routing";
+import { getPosts } from "@/lib/getBlogs";
+import { constructMetadata } from "@/lib/metadata";
+import { BlogPost } from "@/types/blog";
+import fs from "fs/promises";
+import matter from 'gray-matter';
+import { Metadata } from "next";
+import { MDXRemote } from "next-mdx-remote-client/rsc";
+import { notFound } from "next/navigation";
+import path from "path";
+
+type Params = Promise<{
+  locale: string;
+  slug: string;
+}>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+async function getMDXContent(locale: string, section: string): Promise<BlogPost> {
+  const filePath = path.join(
+    process.cwd(),
+    "blogs",
+    locale,
+    `${section}.mdx`
+  );
+
+  try {
+    const content = await fs.readFile(filePath, "utf-8");
+
+    // 解析MDX文件的frontmatter和内容
+    const { data: frontmatter, content: postContent } = matter(content);
+
+    // 构建BlogPost对象
+    const blogPost: BlogPost = {
+      locale,
+      title: frontmatter.title || '',
+      description: frontmatter.description,
+      image: frontmatter.image,
+      slug: frontmatter.slug || '',
+      tags: frontmatter.tags,
+      // 解析日期
+      date: frontmatter.date ? new Date(frontmatter.date) : new Date(),
+      // 设置visible默认值为published
+      visible: frontmatter.visible || 'published',
+      // 处理pin字段 - 如果有pin标记则为true，否则为false
+      pin: frontmatter.pin === 'pin',
+      // 去除frontmatter后的内容
+      content: postContent.trim(),
+      // 所有frontmatter作为metadata
+      metadata: { ...frontmatter }
+    };
+
+    return blogPost;
+
+  } catch (error) {
+    console.error(`Error reading MDX file: ${error}`);
+    // 返回默认的BlogPost对象（符合类型要求）
+    return {
+      title: '',
+      slug: '',
+      date: new Date(),
+      content: '',
+      visible: 'published',
+      pin: false,
+      metadata: {},
+      locale
+    };
+  }
+}
+
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+  let post = await getMDXContent(locale, slug);
+
+  if (!post) {
+    return constructMetadata({
+      title: "404",
+      description: "Page not found",
+      noIndex: true,
+      locale: locale as Locale,
+      path: `/blog/${slug}`,
+      canonicalUrl: `/blog/${slug}`,
+    });
+  }
+
+  return constructMetadata({
+    page: "blog",
+    title: post.title || '',
+    description: post.description || '',
+    images: [],
+    locale: locale as Locale,
+    path: `/blog/${slug}`,
+    canonicalUrl: `/blog/${slug}`,
+  });
+}
+
+export default async function BlogPage({ params }: { params: Params }) {
+  const { locale, slug } = await params;
+  let post = await getMDXContent(locale, slug);
+
+  if (!post) {
+    return notFound();
+  }
+
+  return (
+    <div className="w-full md:w-3/5 px-2 md:px-12">
+      <h1 className="break-words text-4xl font-bold mt-6 mb-4">{post.title}</h1>
+      {post.image && (
+        <img src={post.image} alt={post.title} className="rounded-sm" />
+      )}
+      {post.tags && post.tags.split(",").length ? (
+        <div className="flex flex-wrap gap-2">
+          {post.tags.split(",").map((tag) => {
+            return (
+              <div
+                key={tag}
+                className={`rounded-md bg-gray-200 hover:!no-underline dark:bg-[#24272E] flex px-2.5 py-1.5 text-sm font-medium transition-colors hover:text-black hover:dark:bg-[#15AFD04C] hover:dark:text-[#82E9FF] text-gray-500 dark:text-[#7F818C] outline-none focus-visible:ring transition`}
+              >
+                {tag.trim()}
+              </div>
+            );
+          })}
+        </div>
+      ) : (
+        <></>
+      )}
+      {post.description && <Callout>{post.description}</Callout>}
+      <MDXRemote source={post?.content || ""} components={MDXComponents} />
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  let posts = (await getPosts()).posts;
+
+  // Filter out posts without a slug
+  posts = posts.filter((post) => post.slug);
+
+  return LOCALES.flatMap((locale) =>
+    posts.map((post) => {
+      const slugPart = post.slug.replace(/^\//, "").replace(/^blog\//, "");
+
+      return {
+        locale,
+        slug: slugPart,
+      };
+    })
+  );
+}
--- a/app/[locale]/blog/page.tsx
+++ b/app/[locale]/blog/page.tsx
@@ -0,0 +1,186 @@
+import ParallaxHero from "@/app/[locale]/blog/ParallaxHero";
+import TablerEyeFilled from "@/components/icons/eye";
+import { Link as I18nLink, Locale, LOCALES } from "@/i18n/routing";
+import { getPosts } from "@/lib/getBlogs";
+import { constructMetadata } from "@/lib/metadata";
+import dayjs from "dayjs";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+
+type Params = Promise<{ locale: string }>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "Blog" });
+
+  return constructMetadata({
+    page: "Blog",
+    title: t("title"),
+    description: t("description"),
+    locale: locale as Locale,
+    path: `/blog`,
+    canonicalUrl: `/blog`,
+  });
+}
+
+export default async function Page({
+  params,
+  // searchParams,
+}: {
+  params: Params;
+}) {
+  const { locale } = await params;
+  // const resolvedSearchParams = await searchParams;
+  // const category = resolvedSearchParams.category as string || "";
+
+  let { posts } = await getPosts(locale);
+
+  const t = await getTranslations("Blog");
+
+  // const pageRaw = resolvedSearchParams.page as string || "1";
+  // const page = Math.max(1, parseInt(10, 10));
+  const page = 1;
+  const pageSize = 10;
+  const totalPages = Math.max(1, Math.ceil(posts.length / pageSize));
+  const start = (page - 1) * pageSize;
+  const end = start + pageSize;
+  const pagePosts = posts.slice(start, end);
+
+  return (
+    <div className="w-full">
+      <ParallaxHero />
+
+      {/* 顶部操作区：标签 + 面包屑 */}
+      <div className="container mx-auto px-4">
+        <div className="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mt-4">
+          {/* <div className="flex gap-3">
+            <button className="px-4 py-2 rounded-md border bg-white text-gray-700 shadow-sm hover:bg-gray-50">
+              投资者保护
+            </button>
+            <button className="px-4 py-2 rounded-md border bg-white text-gray-700 shadow-sm hover:bg-gray-50">
+              公司公告
+            </button>
+          </div> */}
+          <div className="flex items-center gap-2 text-sm text-gray-500">
+            <I18nLink href="/" prefetch={false} className="hover:underline">
+              首页
+            </I18nLink>
+            <span>/</span>
+            <I18nLink href="/blog" prefetch={false} className="hover:underline">
+              新闻中心
+            </I18nLink>
+          </div>
+        </div>
+
+        {/* 列表 */}
+        <div className="mt-4">
+          {pagePosts.map((post) => {
+            const year = dayjs(post.date).format("YYYY");
+            const monthDay = dayjs(post.date).format("MM-DD");
+            const views = (post.metadata?.views as number) || 0;
+            return (
+              <I18nLink
+                key={post.slug}
+                href={`/blog/${post.slug}`}
+                prefetch={false}
+                className="block rounded-md mb-4 bg-gray-100 px-6 py-5 transition-all duration-200 shadow hover:bg-gray-200 hover:translate-y-[1px] hover:shadow-inner active:translate-y-[2px] active:shadow-inner focus:outline-none focus:ring-1 focus:ring-gray-300"
+              >
+                <div className="flex items-center">
+                  <div className="flex-1 pr-4">
+                    <div className="text-base md:text-lg font-medium text-gray-800">
+                      {post.title}
+                    </div>
+                    <div className="mt-2 text-xs text-gray-600 flex items-center gap-1">
+                      <TablerEyeFilled className="w-4 h-4" />
+                      访问量：{views}
+                    </div>
+                  </div>
+                  <div className="w-24 md:w-28 text-right">
+                    <div className="text-xs text-gray-500">{year}</div>
+                    <div className="text-2xl md:text-3xl font-bold text-gray-500">{monthDay}</div>
+                  </div>
+                </div>
+              </I18nLink>
+            );
+          })}
+        </div>
+
+        <div className="my-6 flex items-center justify-center gap-2">
+          <I18nLink
+            href={`/blog?page=${Math.max(1, page - 1)}`}
+            prefetch={false}
+            className={`px-2.5 py-1 border rounded-sm text-sm ${page === 1 ? "bg-gray-100 text-gray-400" : "bg-white hover:bg-gray-50"
+              }`}
+          >
+            {"<"}
+          </I18nLink>
+          {(() => {
+            const items: (number | string)[] = [];
+            const showTotal = totalPages;
+            const maxNumbers = 4;
+            const startNum = 1;
+            const endNum = Math.min(showTotal, maxNumbers);
+            for (let n = startNum; n <= endNum; n++) items.push(n);
+            if (showTotal > maxNumbers + 1) items.push("...");
+            if (showTotal > maxNumbers) items.push(showTotal);
+            return items.map((it, idx) => {
+              if (typeof it === "string")
+                return (
+                  <span key={`dot-${idx}`} className="px-2.5 py-1 text-sm text-gray-500">
+                    {it}
+                  </span>
+                );
+              const isActive = it === page;
+              return (
+                <I18nLink
+                  key={it}
+                  href={`/blog?page=${it}`}
+                  prefetch={false}
+                  className={`px-2.5 py-1 border rounded-sm text-sm ${isActive
+                    ? "bg-red-600 text-white border-red-600"
+                    : "bg-white hover:bg-gray-50"
+                    }`}
+                >
+                  {it}
+                </I18nLink>
+              );
+            });
+          })()}
+          <I18nLink
+            href={`/blog?page=${Math.min(totalPages, page + 1)}`}
+            prefetch={false}
+            className={`px-2.5 py-1 border rounded-sm text-sm ${page === totalPages ? "bg-gray-100 text-gray-400" : "bg-white hover:bg-gray-50"
+              }`}
+          >
+            {">"}
+          </I18nLink>
+          <span className="ml-2 text-sm text-gray-600">跳往</span>
+          <form action="/blog" method="get" className="flex items-center gap-1">
+            <input
+              type="number"
+              name="page"
+              min={1}
+              max={totalPages}
+              defaultValue={page}
+              className="w-14 h-7 border rounded-sm px-2 text-sm"
+            />
+            <button className="px-2.5 h-7 border rounded-sm text-sm bg-white hover:bg-gray-50" type="submit">
+              前往
+            </button>
+            <span className="text-sm text-gray-600">页</span>
+          </form>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({ locale }));
+}
--- a/app/[locale]/globals.css
+++ b/app/[locale]/globals.css
@@ -0,0 +1,2 @@
+@import url(../../styles/globals.css);
+@import url(../../styles/loading.css);
--- a/app/[locale]/layout.tsx
+++ b/app/[locale]/layout.tsx
@@ -0,0 +1,110 @@
+import BaiDuAnalytics from "@/app/BaiDuAnalytics";
+import GoogleAdsense from "@/app/GoogleAdsense";
+import GoogleAnalytics from "@/app/GoogleAnalytics";
+import PlausibleAnalytics from "@/app/PlausibleAnalytics";
+import Footer from "@/components/footer/Footer";
+import Header from "@/components/header/Header";
+import { LanguageDetectionAlert } from "@/components/LanguageDetectionAlert";
+import { TailwindIndicator } from "@/components/TailwindIndicator";
+import { siteConfig } from "@/config/site";
+import { DEFAULT_LOCALE, Locale, routing } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import { cn } from "@/lib/utils";
+import "@/styles/globals.css";
+import "@/styles/loading.css";
+import { Analytics } from "@vercel/analytics/react";
+import { Metadata, Viewport } from "next";
+import { hasLocale, NextIntlClientProvider } from "next-intl";
+import {
+  getMessages,
+  getTranslations,
+  setRequestLocale,
+} from "next-intl/server";
+import { ThemeProvider } from "next-themes";
+import { notFound } from "next/navigation";
+// import './globals.css';
+
+type MetadataProps = {
+  params: Promise<{ locale: string }>;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "Home" });
+
+  return constructMetadata({
+    page: "Home",
+    title: t("title"),
+    description: t("description"),
+    locale: locale as Locale,
+    path: `/`,
+    canonicalUrl: `/`,
+  });
+}
+
+export const viewport: Viewport = {
+  themeColor: siteConfig.themeColors,
+};
+
+export default async function LocaleLayout({
+  children,
+  params,
+}: {
+  children: React.ReactNode;
+  params: Promise<{ locale: string }>;
+}) {
+  const { locale } = await params;
+
+  // Ensure that the incoming `locale` is valid
+  if (!hasLocale(routing.locales, locale)) {
+    notFound();
+  }
+
+  setRequestLocale(locale);
+
+  // Providing all messages to the client
+  // side is the easiest way to get started
+  const messages = await getMessages();
+
+  return (
+    <html lang={locale || DEFAULT_LOCALE} suppressHydrationWarning>
+      <head />
+      <body
+        className={cn(
+          "min-h-screen bg-background flex flex-col font-sans antialiased"
+        )}
+      >
+        <NextIntlClientProvider messages={messages}>
+          <ThemeProvider
+            attribute="class"
+            defaultTheme={siteConfig.defaultNextTheme}
+            enableSystem
+          >
+            {messages.LanguageDetection && <LanguageDetectionAlert />}
+            {messages.Header && <Header />}
+
+            <main className="flex-1 flex flex-col items-center">
+              {children}
+            </main>
+
+            {messages.Footer && <Footer />}
+          </ThemeProvider>
+        </NextIntlClientProvider>
+        <TailwindIndicator />
+        {process.env.NODE_ENV === "development" ? (
+          <></>
+        ) : (
+          <>
+            <Analytics />
+            <BaiDuAnalytics />
+            <GoogleAnalytics />
+            <GoogleAdsense />
+            <PlausibleAnalytics />
+          </>
+        )}
+      </body>
+    </html>
+  );
+}
--- a/app/[locale]/line/[slug]/page.tsx
+++ b/app/[locale]/line/[slug]/page.tsx
@@ -0,0 +1,145 @@
+import { LOCALES } from "@/i18n/routing";
+import { getLine, getLines } from "@/lib/lines";
+import { constructMetadata } from "@/lib/metadata";
+import { Line } from "@/types/line";
+import { Metadata } from "next";
+import { Locale } from "next-intl";
+
+// 强制静态渲染
+export const dynamic = "force-static";
+
+// 固定 Params 类型为普通对象（Next.js 原生传参无异步）
+type Params = {
+  locale: string;
+  slug: string;
+};
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+  const line = await getLine(locale, slug);
+
+  if (!line) {
+    return constructMetadata({
+      title: "404 - 产线不存在",
+      description: "请求的产线页面未找到",
+      noIndex: true,
+      locale: locale as Locale,
+      path: `/line/${slug}`,
+      canonicalUrl: `/line/${slug}`,
+    });
+  }
+
+  return constructMetadata({
+    title: line.title,
+    description: line.desc,
+    locale: locale as Locale,
+    path: `/line/${slug}`,
+    canonicalUrl: `/line/${slug}`,
+  });
+}
+
+// 页面主组件 - 仅保留字段展示+修复 Hydration 错误
+export default async function ProductDetailPage({ params }: { params: Params }) {
+  // 🔴 修复：params 是同步对象，移除不必要的 await
+  const { locale, slug } = await params;
+  const line = await getLine(locale, slug);
+
+  if (!line) return <div className="p-6">404 - 产线不存在</div>;
+
+  return (
+    <div className="product-detail max-w-5xl mx-auto p-6 md:p-8">
+      {/* 标题 */}
+      <h1 className="text-3xl md:text-4xl font-bold text-gray-800 mb-4">
+        {line.title}
+      </h1>
+
+      {/* 产品描述 */}
+      <p className="text-gray-700 text-lg mb-8 leading-relaxed">
+        {line.desc}
+      </p>
+
+      {/* 封面图 */}
+      {line.cover && (
+        <div className="mb-8 rounded-lg overflow-hidden shadow-md">
+          <img
+            src={line.cover}
+            alt={`${line.title} - 封面`}
+            className="w-full h-auto object-cover"
+            loading="lazy"
+          />
+        </div>
+      )}
+
+      {/* 产品图片列表 */}
+      {line.images && line.images.length > 0 && (
+        <div className="mb-8">
+          <h2 className="text-2xl md:text-3xl font-semibold text-gray-800 mb-4">
+            产品图片
+          </h2>
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-6">
+            {line.images.map((imgUrl, index) => (
+              <div
+                key={index}
+                className="rounded-lg overflow-hidden shadow-sm"
+              >
+                <img
+                  src={imgUrl}
+                  alt={`${line.title} - 图片${index + 1}`}
+                  className="w-full h-auto object-cover"
+                  loading="lazy"
+                />
+              </div>
+            ))}
+          </div>
+        </div>
+      )}
+
+      {/* 产品特性/参数 */}
+      {line.properties && line.properties.length > 0 && (
+        <div className="mb-4">
+          <h2 className="text-2xl md:text-3xl font-semibold text-gray-800 mb-4">
+            产品参数
+          </h2>
+          <ul className="space-y-3">
+            {line.properties.map((prop, index) => (
+              <li
+                key={index}
+                className="p-4 bg-gray-50 rounded-lg text-gray-700"
+              >
+                {/* 处理参数中的换行符 \n */}
+                <span
+                  dangerouslySetInnerHTML={{
+                    __html: prop.replace(/\n/g, "<br />"),
+                  }}
+                />
+              </li>
+            ))}
+          </ul>
+        </div>
+      )}
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  try {
+    const defaultLocale = LOCALES[0];
+    const workShops: Line[] = await getLines(defaultLocale);
+
+    return LOCALES.flatMap((locale) =>
+      workShops.map((workShop) => ({
+        locale,
+        slug: workShop.slug as string,
+      }))
+    );
+  } catch (error) {
+    console.error("生成产品静态参数失败:", error);
+    return [];
+  }
+}
--- a/app/[locale]/line/page.tsx
+++ b/app/[locale]/line/page.tsx
@@ -0,0 +1,118 @@
+import { Link as I18nLink, LOCALES } from "@/i18n/routing";
+import { getLines } from "@/lib/lines";
+import { constructMetadata } from "@/lib/metadata";
+import { Line } from "@/types/line";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+
+// 强制静态生成
+export const dynamic = "force-static";
+
+// 明确 Params 类型（静态生成的参数）
+type Params = { locale: string };
+
+type MetadataProps = {
+  params: Params;
+};
+
+// 生成页面元数据（确保服务端/客户端翻译一致）
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = params;
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  return constructMetadata({
+    page: "Workshop",
+    title: t("pageTitle", { defaultValue: "车间展示" }), // 使用 next-intl 官方的 defaultValue
+    description: t("pageDesc", { defaultValue: "公司产品线展示" }),
+    locale: locale,
+    path: `/line`,
+    canonicalUrl: `/line`,
+  });
+}
+
+// 生成静态路由参数（多语言）
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
+
+// 空数据组件（纯静态，无动态属性）
+function EmptyState() {
+  return <div className="py-10 text-center text-gray-500">暂无产品线数据</div>;
+}
+
+// 单个车间卡片组件（Client Component 标记，避免 Hydration 冲突）
+// 'use client'; // 仅当需要添加交互时启用，当前纯展示可不用
+
+function ProductCard({ product }: { product: Line }) {
+  // 为 Image 组件添加默认值，避免属性缺失导致不匹配
+  const coverSrc = product.cover || "/default-workshop-cover.png"; // 兜底封面图
+  const coverAlt = product.title || "产品线封面";
+
+  return (
+    <I18nLink
+      href={`/line/${product.slug}`}
+      locale={product.locale}
+    >
+      <div className="border rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
+        {/* 封面图：优化属性，确保服务端/客户端渲染一致 */}
+        <div className="relative h-64 w-full">
+          <img
+            src={coverSrc}
+            alt={coverAlt}
+            sizes="100vw" // 简化 sizes，避免解析差异
+            className="object-cover"
+            // 显式设置属性，避免隐式差异
+            loading="lazy"
+          />
+        </div>
+
+        {/* 车间信息 */}
+        <div className="p-4">
+          <h2 className="text-xl font-bold mb-2">{product.title || "未命名产品线"}</h2>
+          <p className="text-gray-600 mb-4">{product.desc || "暂无描述"}</p>
+        </div>
+      </div>
+    </I18nLink>
+  );
+}
+
+// 页面主组件（Server Component）
+export default async function Page({
+  params,
+}: {
+  params: Params;
+}) {
+  const { locale } = await params;
+  // 获取翻译（确保服务端/客户端一致）
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  // 获取产品线数据（顶层 await，Server Component 原生支持）
+  const products: Line[] = await getLines(locale);
+
+  // 页面标题翻译兜底
+  const pageTitle = t("pageTitle", { defaultValue: "产品线展示" });
+
+  return (
+    <main className="container mx-auto py-8 px-4">
+      {/* 页面标题（纯静态渲染，无动态属性） */}
+      <h1 className="text-3xl font-bold mb-8 text-center">{pageTitle}</h1>
+
+      {/* 移除不必要的 Suspense：Server Component 顶层 await 无需 Suspense */}
+      {products.length > 0 ? (
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {products.map((product) => {
+            // 用稳定的 key（优先用唯一标识，如 id；无 id 则用 title+locale 避免 index 导致的问题）
+            const stableKey = `${product.title}-${product.locale}`;
+            return <ProductCard key={stableKey} product={product} />;
+          })}
+        </div>
+      ) : (
+        <EmptyState />
+      )}
+    </main>
+  );
+}
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -0,0 +1,16 @@
+import HomeComponent from "@/components/home";
+
+export const dynamic = "force-static";
+
+export default function Home() {
+  return <HomeComponent />;
+}
+
+export async function generateStaticParams() {
+  return [
+    { locale: 'en' },
+    { locale: 'zh' },
+    // { locale: 'vi' },
+    // { locale: 'ja' },
+  ]
+}
--- a/app/[locale]/privacy-policy/page.tsx
+++ b/app/[locale]/privacy-policy/page.tsx
@@ -0,0 +1,78 @@
+import MDXComponents from "@/components/mdx/MDXComponents";
+import { Locale, LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import fs from "fs/promises";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+import { MDXRemote } from "next-mdx-remote-client/rsc";
+import path from "path";
+import remarkGfm from "remark-gfm";
+
+const options = {
+  parseFrontmatter: true,
+  mdxOptions: {
+    remarkPlugins: [remarkGfm],
+    rehypePlugins: [],
+  },
+};
+
+async function getMDXContent(locale: string) {
+  const filePath = path.join(
+    process.cwd(),
+    "content",
+    "privacy-policy",
+    `${locale}.mdx`
+  );
+  try {
+    const content = await fs.readFile(filePath, "utf-8");
+    return content;
+  } catch (error) {
+    console.error(`Error reading MDX file: ${error}`);
+    return "";
+  }
+}
+
+type Params = Promise<{
+  locale: string;
+}>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "PrivacyPolicy" });
+
+  return constructMetadata({
+    page: "PrivacyPolicy",
+    title: t("title"),
+    description: t("description"),
+    locale: locale as Locale,
+    path: `/privacy-policy`,
+    canonicalUrl: `/privacy-policy`,
+  });
+}
+
+export default async function AboutPage({ params }: { params: Params }) {
+  const { locale } = await params;
+  const content = await getMDXContent(locale);
+
+  return (
+    <article className="w-full md:w-3/5 px-2 md:px-12">
+      <MDXRemote
+        source={content}
+        components={MDXComponents}
+        options={options}
+      />
+    </article>
+  );
+}
+
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
--- a/app/[locale]/product/[slug]/page.tsx
+++ b/app/[locale]/product/[slug]/page.tsx
@@ -0,0 +1,184 @@
+import ProductTabsClient from "@/components/ProductTabsClient";
+import { Locale, LOCALES } from "@/i18n/routing";
+import { getProducts } from "@/lib/getProducts";
+import { constructMetadata } from "@/lib/metadata";
+import { Product } from "@/types/product";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+import { notFound } from "next/navigation";
+
+type Params = {
+  locale: string;
+  slug: string;
+};
+
+type MetadataProps = {
+  params: Promise<Params>;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+
+  try {
+    const { products }: { products: Product[] } = await getProducts(locale);
+    const product = products.find((product) => product.slug === slug);
+
+    if (!product) {
+      return constructMetadata({
+        title: "404 - 产品不存在",
+        description: "请求的产品页面未找到",
+        noIndex: true,
+        locale: locale as Locale,
+        path: `/products/${slug}`,
+        canonicalUrl: `/products/${slug}`,
+      });
+    }
+
+    return constructMetadata({
+      page: "products",
+      title: product.title,
+      description: `${product.title} - ${product.model} - ${product.place}`,
+      images: product.images.length ? [product.images[0]] : [],
+      locale: locale as Locale,
+      path: `/products/${slug}`,
+      canonicalUrl: `/products/${slug}`,
+    });
+  } catch (error) {
+    console.error("生成产品元数据失败:", error);
+    return constructMetadata({
+      title: "产品详情",
+      description: "产品详情页面",
+      locale: (await params).locale as Locale,
+      path: `/products/${(await params).slug}`,
+    });
+  }
+}
+
+export default async function ProductPage({ params }: { params: Promise<Params> }) {
+  const { locale, slug } = await params;
+  const { products }: { products: Product[] } = await getProducts(locale);
+  const product = products.find((item) => item.slug == slug);
+  if (!product) return notFound();
+
+  const t = await getTranslations({ locale, namespace: "Product" });
+
+  // 获取所有产品图片
+  const allImages = product.images || [];
+
+  const formattedPublishTime = (() => {
+    if (!product.publishedTime) return "暂无";
+    const publishDate = typeof product.publishedTime === 'string'
+      ? new Date(product.publishedTime)
+      : product.publishedTime;
+
+    return isNaN(publishDate.getTime())
+      ? "暂无"
+      : publishDate.toLocaleDateString("zh-CN", {
+        year: "numeric",
+        month: "2-digit",
+        day: "2-digit",
+      });
+  })();
+
+  return (
+    <div>
+      <img src="http://kelunpuzhonggong.com/upload/img/20251015111553.jpg" className="w-screen h-auto" alt="" />
+      <div className="w-full max-w-6xl mx-auto px-4 md:px-8 py-8">
+        <div className="text-center mb-6">
+          <h1 className="text-purple-600 text-xl font-bold">{t("detailTitle")}</h1>
+        </div>
+
+        {/* 调整后：左侧大图+下方缩略图 + 右侧信息 */}
+        <div className="border rounded p-4 mb-6">
+          <div className="flex flex-col md:flex-row">
+            {/* 左侧图片区域（大图+缩略图） */}
+            <div className="md:w-1/3 mb-4 md:mb-0">
+              {/* 第一张大图 */}
+              {allImages.length > 0 ? (
+                <div className="relative w-full h-auto max-h-[500px]">
+                  <img
+                    src={allImages[0]}
+                    alt={`${product.title || "产品"}-主图`}
+                    sizes="(max-width: 768px) 100vw, (max-width: 1200px) 66vw, 66vw"
+                    className="object-contain"
+                  />
+                </div>
+              ) : (
+                <div className="w-full h-60 bg-gray-100 flex items-center justify-center text-gray-500">
+                  暂无产品图片
+                </div>
+              )}
+            </div>
+
+            {/* 右侧产品信息区域 */}
+            <div className="md:w-2/3 md:ml-4">
+              <h1 className="text-xl font-bold mb-3">{product.title || "未命名产品"}</h1>
+              <div className="space-y-2 mb-6">
+                <div>
+                  <span className="font-medium">{t("productModel")}：</span>
+                  <span>{product.model || "暂无"}</span>
+                </div>
+                <div>
+                  <span className="font-medium">{t("productPlace")}：</span>
+                  <span>{product.place || "暂无"}</span>
+                </div>
+                <div>
+                  <span className="font-medium">{t("productPublishedTime")}：</span>
+                  <span>{formattedPublishTime}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+
+
+          {/* 所有图片缩略图（横向滚动） */}
+          {allImages.length > 0 && (
+            <div className="flex flex-nowrap gap-2 mt-4 overflow-x-auto pb-2">
+              {allImages.map((img, index) => (
+                <div
+                  key={index}
+                  className="relative w-20 h-20 cursor-pointer border border-gray-200 rounded"
+                >
+                  <img
+                    src={img}
+                    alt={`${product.title || "产品"}-图${index + 1}`}
+                    className="object-cover"
+                    sizes="80px"
+                  />
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        <ProductTabsClient
+          locale={locale}
+          detail={product.detail}
+          spec={product.spec}
+          packaging={product.packaging}
+        />
+      </div>
+    </div>
+
+  );
+}
+
+export async function generateStaticParams() {
+  try {
+    const defaultLocale = LOCALES[0];
+    const { products }: { products: Product[] } = await getProducts(defaultLocale);
+    const validProducts = products.filter((product) => product.slug.toString() && product.title);
+
+    return LOCALES.flatMap((locale) =>
+      validProducts.map((product) => ({
+        locale,
+        slug: product.slug.toString(),
+      }))
+    );
+  } catch (error) {
+    console.error("生成产品静态参数失败:", error);
+    return [];
+  }
+}
--- a/app/[locale]/product/page.tsx
+++ b/app/[locale]/product/page.tsx
@@ -0,0 +1,157 @@
+import { Link as I18nLink, Locale, LOCALES } from "@/i18n/routing";
+import { getProducts } from "@/lib/getProducts";
+import { constructMetadata } from "@/lib/metadata";
+import { Product } from "@/types/product";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+
+type Params = Promise<{ locale: string }>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "Product" });
+
+  return constructMetadata({
+    page: "Product",
+    title: "产品中心",
+    description: "公司产品展示",
+    locale: locale as Locale,
+    path: `/product`,
+    canonicalUrl: `/product`,
+  });
+}
+
+// 每页产品数量
+const PRODUCTS_PER_PAGE = 8;
+
+export default async function Page({
+  params,
+  searchParams,
+}: {
+  params: Params;
+  searchParams: { page?: string };
+}) {
+  const { locale } = await params;
+  const t = await getTranslations("Product");
+
+  // 获取当前页码，默认第1页
+  let currentPage = parseInt(searchParams.page || "1");
+  if (isNaN(currentPage) || currentPage < 1) {
+    currentPage = 1;
+  }
+
+  // 获取产品数据
+  const { products }: { products: Product[] } = await getProducts(locale);
+
+  // 计算总页数
+  const totalProducts = products.length;
+  const totalPages = Math.ceil(totalProducts / PRODUCTS_PER_PAGE);
+
+  // 确保当前页码不超过总页数
+  const safeCurrentPage = Math.min(currentPage, totalPages);
+
+  // 计算当前页的产品数据
+  const startIndex = (safeCurrentPage - 1) * PRODUCTS_PER_PAGE;
+  const endIndex = startIndex + PRODUCTS_PER_PAGE;
+  const currentProducts = products.slice(startIndex, endIndex);
+
+  return (
+    <div className="w-full">
+      {/* 面包屑导航 */}
+      <div className="bg-gray-100 py-4">
+        <div className="container mx-auto px-4">
+          <div className="flex items-center gap-2 text-sm text-gray-500">
+            <I18nLink href="/" prefetch={false} className="hover:underline">
+              {t("breadcrumb.home")}
+            </I18nLink>
+            <span>/</span>
+            <span className="text-gray-700">{t("breadcrumb.product")}</span>
+          </div>
+        </div>
+      </div>
+
+      {/* 产品标题区域 */}
+      <div className="container mx-auto px-4 py-8">
+        <h1 className="text-3xl font-bold text-center text-gray-800 mb-8">{t("title")}</h1>
+
+        {/* 产品网格 */}
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
+          {currentProducts.map((product) => (
+            <I18nLink
+              key={product.slug}
+              href={`/product/${product.slug}`}
+              prefetch={false}
+              className="block bg-white border border-gray-100 rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-all duration-300"
+            >
+              <div className="aspect-square flex items-center justify-center p-6">
+                <img
+                  src={product.images?.[0] || "/placeholder.svg"}
+                  alt={product.title}
+                  className="max-w-full max-h-full object-contain hover:scale-105 transition-transform duration-300"
+                />
+              </div>
+              <div className="p-6 text-center">
+                <h3 className="text-lg font-medium text-gray-800 mb-4">{product.title}</h3>
+                <div className="inline-block text-red-600 font-medium hover:underline">
+                  {t("learnMore")} &gt;
+                </div>
+              </div>
+            </I18nLink>
+          ))}
+        </div>
+
+        {/* 分页组件 */}
+        {totalPages > 1 && (
+          <div className="mt-12 flex justify-center">
+            <nav className="inline-flex items-center -space-x-px">
+              {/* 上一页按钮 */}
+              <I18nLink
+                href={`/product?page=${safeCurrentPage - 1}`}
+                prefetch={false}
+                className={`px-3 py-2 rounded-l-lg border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50 ${safeCurrentPage === 1 ? 'cursor-not-allowed opacity-50' : ''}`}
+                aria-disabled={safeCurrentPage === 1}
+              >
+                {t("pagination.previous")}
+              </I18nLink>
+
+              {/* 页码按钮 */}
+              {Array.from({ length: totalPages }, (_, i) => i + 1).map((page) => (
+                <I18nLink
+                  key={page}
+                  href={`/product?page=${page}`}
+                  prefetch={false}
+                  className={`px-3 py-2 border-y border-gray-300 bg-white text-sm font-medium ${page === safeCurrentPage ? 'bg-red-50 text-red-600' : 'text-gray-500 hover:bg-gray-50'}`}
+                >
+                  {page}
+                </I18nLink>
+              ))}
+
+              {/* 下一页按钮 */}
+              <I18nLink
+                href={`/product?page=${safeCurrentPage + 1}`}
+                prefetch={false}
+                className={`px-3 py-2 rounded-r-lg border border-gray-300 bg-white text-sm font-medium text-gray-500 hover:bg-gray-50 ${safeCurrentPage === totalPages ? 'cursor-not-allowed opacity-50' : ''}`}
+                aria-disabled={safeCurrentPage === totalPages}
+              >
+                {t("pagination.next")}
+              </I18nLink>
+            </nav>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  // 为每个语言生成首页
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
--- a/app/[locale]/single/[slug]/page.tsx
+++ b/app/[locale]/single/[slug]/page.tsx
@@ -0,0 +1,135 @@
+import { LOCALES } from "@/i18n/routing";
+import { getLine, getLines } from "@/lib/lines";
+import { constructMetadata } from "@/lib/metadata";
+import { Line } from "@/types/line";
+import { Metadata } from "next";
+import { Locale } from "next-intl";
+
+// 强制静态渲染
+export const dynamic = "force-static";
+
+// 固定 Params 类型为普通对象（Next.js 原生传参无异步）
+type Params = {
+  locale: string;
+  slug: string;
+};
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+  const line = await getLine(locale, slug);
+  console.log(line);
+
+  console.log(line?.slug);
+
+  if (!line) {
+    return constructMetadata({
+      title: "404 - 产线不存在",
+      description: "请求的产线页面未找到",
+      noIndex: true,
+      locale: locale as Locale,
+      path: `/line/${slug}`,
+      canonicalUrl: `/line/${slug}`,
+    });
+  }
+
+  return constructMetadata({
+    title: line.title,
+    description: line.desc,
+    locale: locale as Locale,
+    path: `/line/${slug}`,
+    canonicalUrl: `/line/${slug}`,
+  });
+}
+
+// 页面主组件 - 仅保留字段展示+修复 Hydration 错误
+export default async function ProductDetailPage({ params }: { params: Params }) {
+  // 🔴 核心修复1：移除不必要的 await（params 是同步对象）
+  const { locale, slug } = await params;
+  const line = await getLine(locale, slug);
+
+  if (!line) return null;
+
+  // 兜底处理：避免字段为空导致属性不匹配
+  const coverSrc = line.cover || "";
+  const coverAlt = line.title || "产线封面";
+  const lineDesc = line.desc || "暂无产线描述";
+
+  return (
+    <div className="min-h-screen bg-gray-50 py-10 px-4 sm:px-6 lg:px-8">
+      <div className="max-w-6xl mx-auto">
+        {/* 封面图区域 - 🔴 修复布局属性不一致 */}
+        <div className="relative rounded-2xl overflow-hidden shadow-lg h-[400px] sm:h-[500px] mb-8">
+          <img
+            src={coverSrc}
+            alt={coverAlt}
+            className="absolute inset-0 w-full h-full object-cover transition-transform hover:scale-105 duration-700"
+            // 显式设置属性，确保服务端/客户端一致
+            loading="lazy"
+            decoding="async"
+          />
+        </div>
+
+        {/* 标题+描述区域 */}
+        <div className="bg-white rounded-xl p-8 shadow-sm mb-10">
+          <h1 className="text-3xl sm:text-4xl font-bold text-gray-900 mb-6">
+            {line.title}
+          </h1>
+          <p className="text-lg text-gray-700 leading-relaxed">
+            {lineDesc}
+          </p>
+        </div>
+
+        {line.images.length > 0 && (
+          <div className="bg-white rounded-xl p-8 shadow-sm">
+            <h2 className="text-2xl font-semibold text-gray-800 mb-6 border-b pb-3 border-gray-200">
+              车间图片
+            </h2>
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+              {line.images.map((img, index) => {
+                const stableKey = `line-${slug}-img-${index}-${img.slice(-8)}`;
+                const imgAlt = `${line.title}-图片${index + 1}`;
+                return (
+                  <div
+                    key={stableKey}
+                    className="relative rounded-lg overflow-hidden shadow-md h-64 hover:shadow-xl transition-all duration-300"
+                  >
+                    <img
+                      src={img}
+                      alt={imgAlt}
+                      className="absolute inset-0 w-full h-full object-cover transition-transform hover:scale-110 duration-500"
+                      loading="lazy"
+                      decoding="async"
+                    />
+                  </div>
+                );
+              })}
+            </div>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  try {
+    const defaultLocale = LOCALES[0];
+    const workShops: Line[] = await getLines(defaultLocale);
+
+    return LOCALES.flatMap((locale) =>
+      workShops.map((workShop) => ({
+        locale,
+        slug: workShop.slug as string,
+      }))
+    );
+  } catch (error) {
+    console.error("生成产品静态参数失败:", error);
+    return [];
+  }
+}
--- a/app/[locale]/single/page.tsx
+++ b/app/[locale]/single/page.tsx
@@ -0,0 +1,66 @@
+import { LOCALES } from "@/i18n/routing";
+import { getLines } from "@/lib/lines";
+import { constructMetadata } from "@/lib/metadata";
+import { Line } from "@/types/line";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+
+// 强制静态生成
+export const dynamic = "force-static";
+
+// 明确 Params 类型（静态生成的参数）
+type Params = { locale: string };
+
+type MetadataProps = {
+  params: Params;
+};
+
+// 生成页面元数据（确保服务端/客户端翻译一致）
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = params;
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  return constructMetadata({
+    page: "Workshop",
+    title: t("pageTitle", { defaultValue: "车间展示" }), // 使用 next-intl 官方的 defaultValue
+    description: t("pageDesc", { defaultValue: "公司产品线展示" }),
+    locale: locale,
+    path: `/line`,
+    canonicalUrl: `/line`,
+  });
+}
+
+// 生成静态路由参数（多语言）
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
+
+// 空数据组件（纯静态，无动态属性）
+function EmptyState() {
+  return <div className="py-10 text-center text-gray-500">暂无产品线数据</div>;
+}
+
+// 单个车间卡片组件（Client Component 标记，避免 Hydration 冲突）
+// 'use client'; // 仅当需要添加交互时启用，当前纯展示可不用
+
+function ProductCard({ product }: { product: Line }) {
+
+}
+
+// 页面主组件（Server Component）
+export default async function Page({
+  params,
+}: {
+  params: Params;
+}) {
+  const { locale } = await params;
+  // 获取翻译（确保服务端/客户端一致）
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  // 获取产品线数据（顶层 await，Server Component 原生支持）
+  const products: Line[] = await getLines(locale);
+}
--- a/app/[locale]/terms-of-service/page.tsx
+++ b/app/[locale]/terms-of-service/page.tsx
@@ -0,0 +1,78 @@
+import MDXComponents from "@/components/mdx/MDXComponents";
+import { Locale, LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import fs from "fs/promises";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+import { MDXRemote } from "next-mdx-remote-client/rsc";
+import path from "path";
+import remarkGfm from "remark-gfm";
+
+const options = {
+  parseFrontmatter: true,
+  mdxOptions: {
+    remarkPlugins: [remarkGfm],
+    rehypePlugins: [],
+  },
+};
+
+async function getMDXContent(locale: string) {
+  const filePath = path.join(
+    process.cwd(),
+    "content",
+    "terms-of-service",
+    `${locale}.mdx`
+  );
+  try {
+    const content = await fs.readFile(filePath, "utf-8");
+    return content;
+  } catch (error) {
+    console.error(`Error reading MDX file: ${error}`);
+    return "";
+  }
+}
+
+type Params = Promise<{
+  locale: string;
+}>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = await params;
+  const t = await getTranslations({ locale, namespace: "TermsOfService" });
+
+  return constructMetadata({
+    page: "TermsOfService",
+    title: t("title"),
+    description: t("description"),
+    locale: locale as Locale,
+    path: `/terms-of-service`,
+    canonicalUrl: `/terms-of-service`,
+  });
+}
+
+export default async function AboutPage({ params }: { params: Params }) {
+  const { locale } = await params;
+  const content = await getMDXContent(locale);
+
+  return (
+    <article className="w-full md:w-3/5 px-2 md:px-12">
+      <MDXRemote
+        source={content}
+        components={MDXComponents}
+        options={options}
+      />
+    </article>
+  );
+}
+
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
--- a/app/[locale]/workshop/[slug]/page.tsx
+++ b/app/[locale]/workshop/[slug]/page.tsx
@@ -0,0 +1,135 @@
+import { LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import { getWorkShop, getWorkShops } from "@/lib/workshop";
+import { WorkShop } from "@/types/workShop";
+import { Metadata } from "next";
+import { Locale } from "next-intl";
+
+// 强制静态渲染
+export const dynamic = "force-static";
+
+// 固定 Params 类型为普通对象（Next.js 原生传参无异步）
+type Params = {
+  locale: string;
+  slug: string;
+};
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+  const workShop = await getWorkShop(locale, slug);
+  console.log(workShop);
+
+  console.log(workShop?.slug);
+
+  if (!workShop) {
+    return constructMetadata({
+      title: "404 - 车间不存在",
+      description: "请求的车间页面未找到",
+      noIndex: true,
+      locale: locale as Locale,
+      path: `/workshop/${slug}`,
+      canonicalUrl: `/workshop/${slug}`,
+    });
+  }
+
+  return constructMetadata({
+    title: workShop.title,
+    description: workShop.desc,
+    locale: locale as Locale,
+    path: `/workshop/${slug}`,
+    canonicalUrl: `/workshop/${slug}`,
+  });
+}
+
+// 页面主组件 - 仅保留字段展示+修复 Hydration 错误
+export default async function WorkshopDetailPage({ params }: { params: Params }) {
+  // 🔴 核心修复1：移除不必要的 await（params 是同步对象）
+  const { locale, slug } = await params;
+  const workShop = await getWorkShop(locale, slug);
+
+  if (!workShop) return null;
+
+  // 兜底处理：避免字段为空导致属性不匹配
+  const coverSrc = workShop.cover || "";
+  const coverAlt = workShop.title || "车间封面";
+  const workshopDesc = workShop.desc || "暂无车间描述";
+
+  return (
+    <div className="min-h-screen bg-gray-50 py-10 px-4 sm:px-6 lg:px-8">
+      <div className="max-w-6xl mx-auto">
+        {/* 封面图区域 - 🔴 修复布局属性不一致 */}
+        <div className="relative rounded-2xl overflow-hidden shadow-lg h-[400px] sm:h-[500px] mb-8">
+          <img
+            src={coverSrc}
+            alt={coverAlt}
+            className="absolute inset-0 w-full h-full object-cover transition-transform hover:scale-105 duration-700"
+            // 显式设置属性，确保服务端/客户端一致
+            loading="lazy"
+            decoding="async"
+          />
+        </div>
+
+        {/* 标题+描述区域 */}
+        <div className="bg-white rounded-xl p-8 shadow-sm mb-10">
+          <h1 className="text-3xl sm:text-4xl font-bold text-gray-900 mb-6">
+            {workShop.title}
+          </h1>
+          <p className="text-lg text-gray-700 leading-relaxed">
+            {workshopDesc}
+          </p>
+        </div>
+
+        {workShop.images?.length > 0 && (
+          <div className="bg-white rounded-xl p-8 shadow-sm">
+            <h2 className="text-2xl font-semibold text-gray-800 mb-6 border-b pb-3 border-gray-200">
+              车间图片
+            </h2>
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+              {workShop.images.map((img, index) => {
+                const stableKey = `workshop-${slug}-img-${index}-${img.slice(-8)}`;
+                const imgAlt = `${workShop.title}-图片${index + 1}`;
+                return (
+                  <div
+                    key={stableKey}
+                    className="relative rounded-lg overflow-hidden shadow-md h-64 hover:shadow-xl transition-all duration-300"
+                  >
+                    <img
+                      src={img}
+                      alt={imgAlt}
+                      className="absolute inset-0 w-full h-full object-cover transition-transform hover:scale-110 duration-500"
+                      loading="lazy"
+                      decoding="async"
+                    />
+                  </div>
+                );
+              })}
+            </div>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  try {
+    const defaultLocale = LOCALES[0];
+    const workShops: WorkShop[] = await getWorkShops(defaultLocale);
+
+    return LOCALES.flatMap((locale) =>
+      workShops.map((workShop) => ({
+        locale,
+        slug: workShop.slug as string,
+      }))
+    );
+  } catch (error) {
+    console.error("生成产品静态参数失败:", error);
+    return [];
+  }
+}
--- a/app/[locale]/workshop/page.tsx
+++ b/app/[locale]/workshop/page.tsx
@@ -0,0 +1,118 @@
+import { Link as I18nLink, LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+import { getWorkShops } from "@/lib/workshop";
+import { WorkShop } from "@/types/workShop";
+import { Metadata } from "next";
+import { getTranslations } from "next-intl/server";
+
+// 强制静态生成
+export const dynamic = "force-static";
+
+// 明确 Params 类型（静态生成的参数）
+type Params = { locale: string };
+
+type MetadataProps = {
+  params: Params;
+};
+
+// 生成页面元数据（确保服务端/客户端翻译一致）
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale } = params;
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  return constructMetadata({
+    page: "Workshop",
+    title: t("pageTitle", { defaultValue: "车间展示" }), // 使用 next-intl 官方的 defaultValue
+    description: t("pageDesc", { defaultValue: "公司车间展示" }),
+    locale: locale,
+    path: `/workshop`,
+    canonicalUrl: `/workshop`,
+  });
+}
+
+// 生成静态路由参数（多语言）
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({
+    locale,
+  }));
+}
+
+// 空数据组件（纯静态，无动态属性）
+function EmptyState() {
+  return <div className="py-10 text-center text-gray-500">暂无车间数据</div>;
+}
+
+// 单个车间卡片组件（Client Component 标记，避免 Hydration 冲突）
+// 'use client'; // 仅当需要添加交互时启用，当前纯展示可不用
+
+function WorkshopCard({ workshop }: { workshop: WorkShop }) {
+  // 为 Image 组件添加默认值，避免属性缺失导致不匹配
+  const coverSrc = workshop.cover || "/default-workshop-cover.png"; // 兜底封面图
+  const coverAlt = workshop.title || "车间封面";
+
+  return (
+    <I18nLink
+      href={`/workshop/${workshop.slug}`}
+      locale={workshop.locale}
+    >
+      <div className="border rounded-lg overflow-hidden shadow-sm hover:shadow-md transition-shadow">
+        {/* 封面图：优化属性，确保服务端/客户端渲染一致 */}
+        <div className="relative h-64 w-full">
+          <img
+            src={coverSrc}
+            alt={coverAlt}
+            sizes="100vw" // 简化 sizes，避免解析差异
+            className="object-cover"
+            // 显式设置属性，避免隐式差异
+            loading="lazy"
+          />
+        </div>
+
+        {/* 车间信息 */}
+        <div className="p-4">
+          <h2 className="text-xl font-bold mb-2">{workshop.title || "未命名车间"}</h2>
+          <p className="text-gray-600 mb-4">{workshop.desc || "暂无描述"}</p>
+        </div>
+      </div>
+    </I18nLink>
+  );
+}
+
+// 页面主组件（Server Component）
+export default async function Page({
+  params,
+}: {
+  params: Params;
+}) {
+  const { locale } = await params;
+  // 获取翻译（确保服务端/客户端一致）
+  const t = await getTranslations({ locale, namespace: "Workshop" });
+
+  // 获取车间数据（顶层 await，Server Component 原生支持）
+  const workShops: WorkShop[] = await getWorkShops(locale);
+
+  // 页面标题翻译兜底
+  const pageTitle = t("pageTitle", { defaultValue: "车间展示" });
+
+  return (
+    <main className="container mx-auto py-8 px-4">
+      {/* 页面标题（纯静态渲染，无动态属性） */}
+      <h1 className="text-3xl font-bold mb-8 text-center">{pageTitle}</h1>
+
+      {/* 移除不必要的 Suspense：Server Component 顶层 await 无需 Suspense */}
+      {workShops.length > 0 ? (
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {workShops.map((workshop) => {
+            // 用稳定的 key（优先用唯一标识，如 id；无 id 则用 title+locale 避免 index 导致的问题）
+            const stableKey = `${workshop.title}-${workshop.locale}`;
+            return <WorkshopCard key={stableKey} workshop={workshop} />;
+          })}
+        </div>
+      ) : (
+        <EmptyState />
+      )}
+    </main>
+  );
+}
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -0,0 +1,6 @@
+// 默认跳转到中文版本
+import { redirect } from 'next/navigation';
+
+export default function HomePage() {
+  redirect('/zh');
+}
--- a/app/robots.ts
+++ b/app/robots.ts
@@ -0,0 +1,31 @@
+import { siteConfig } from '@/config/site'
+import type { MetadataRoute } from 'next'
+
+const siteUrl = siteConfig.url
+
+export const dynamic = "force-static"
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: {
+      userAgent: '*',
+      allow: '/',
+      disallow: [
+        '/private/',
+        '/api/',
+        '/auth/',
+        '/dashboard/',
+        '/_next/',
+        '/assets/',
+        '/error',
+        '/*/404',
+        '/*/500',
+        '/*/403',
+        '/*/401',
+        '/*/400',
+        '/cdn-cgi/',
+      ],
+    },
+    sitemap: `${siteUrl}/sitemap.xml`
+  }
+}
--- a/app/sitemap.ts
+++ b/app/sitemap.ts
@@ -0,0 +1,48 @@
+import { siteConfig } from '@/config/site'
+import { DEFAULT_LOCALE, LOCALES } from '@/i18n/routing'
+import { getPosts } from '@/lib/getBlogs'
+import { MetadataRoute } from 'next'
+
+const siteUrl = siteConfig.url
+
+type ChangeFrequency = 'always' | 'hourly' | 'daily' | 'weekly' | 'monthly' | 'yearly' | 'never' | undefined
+
+export const dynamic = "force-static"
+
+export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
+  // Static pages
+  const staticPages = [
+    '',
+    '/blog',
+    '/about',
+    '/privacy-policy',
+    '/terms-of-service',
+  ]
+
+  // Generate multilingual pages
+  const pages = LOCALES.flatMap(locale => {
+    return staticPages.map(page => ({
+      url: `${siteUrl}${locale === DEFAULT_LOCALE ? '' : `/${locale}`}${page}`,
+      lastModified: new Date(),
+      changeFrequency: 'daily' as ChangeFrequency,
+      priority: page === '' ? 1.0 : 0.8,
+    }))
+  })
+
+  const blogPosts = await Promise.all(
+    LOCALES.map(async (locale) => {
+      const { posts } = await getPosts(locale)
+      return posts.map(post => ({
+        url: `${siteUrl}${locale === DEFAULT_LOCALE ? '' : `/${locale}`}/blog${post.slug}`,
+        lastModified: post.metadata.updatedAt || post.date,
+        changeFrequency: 'daily' as const,
+        priority: 0.7,
+      }))
+    })
+  ).then(results => results.flat())
+
+  return [
+    ...pages,
+    ...blogPosts,
+  ]
+}