Merge branch 'master' of http://49.232.154.205:10100/DeXun/fad-trade-next

app/[locale]/about/page.tsx

@@ -16,11 +16,12 @@ const options = {
   },
 };
 
-async function getMDXContent(locale: string) {
+async function getMDXContent(locale: string, section: string) {
   const filePath = path.join(
     process.cwd(),
     "content",
     "about",
+    section,
     `${locale}.mdx`
   );
   try {
@@ -56,9 +57,18 @@ export async function generateMetadata({
   });
 }
 
-export default async function AboutPage({ params }: { params: Params }) {
+export default async function AboutPage({
+  params,
+  searchParams
+}: {
+  params: Params;
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+}) {
   const { locale } = await params;
-  const content = await getMDXContent(locale);
+  const resolvedSearchParams = await searchParams;
+  const section = (resolvedSearchParams.section as string) || "company";
+
+  const content = await getMDXContent(locale, section);
 
   return (
     <article className="w-full md:w-3/5 px-2 md:px-12">
@@ -75,4 +85,4 @@ export async function generateStaticParams() {
   return LOCALES.map((locale) => ({
     locale,
   }));
-}
+}

app/[locale]/product/[slug]/page.tsx

@@ -0,0 +1,103 @@
+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 { Metadata } from "next";
+import { MDXRemote } from "next-mdx-remote-client/rsc";
+import { notFound } from "next/navigation";
+
+type Params = Promise<{
+  locale: string;
+  slug: string;
+}>;
+
+type MetadataProps = {
+  params: Params;
+};
+
+export async function generateMetadata({
+  params,
+}: MetadataProps): Promise<Metadata> {
+  const { locale, slug } = await params;
+  let { posts }: { posts: BlogPost[] } = await getPosts(locale);
+  const post = posts.find((post) => post.slug === "/" + 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: post.image ? [post.image] : [],
+    locale: locale as Locale,
+    path: `/blog/${slug}`,
+    canonicalUrl: `/blog/${slug}`,
+  });
+}
+
+export default async function BlogPage({ params }: { params: Params }) {
+  const { locale, slug } = await params;
+  let { posts }: { posts: BlogPost[] } = await getPosts(locale);
+
+  const post = posts.find((item) => item.slug === "/" + 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,
+      };
+    })
+  );
+}

app/[locale]/product/page.tsx

@@ -0,0 +1,139 @@
+import { Link as I18nLink, Locale, LOCALES } from "@/i18n/routing";
+import { constructMetadata } from "@/lib/metadata";
+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 productData = [
+  {
+    id: 1,
+    name: "直线高频焊接圆管(含热浸镀锌)",
+    image: "/placeholder.svg",
+    url: "/product/114",
+  },
+  {
+    id: 2,
+    name: "方矩形焊接钢管(含热浸镀锌)",
+    image: "/placeholder.svg",
+    url: "/product/115",
+  },
+  {
+    id: 3,
+    name: "钢塑复合管",
+    image: "/placeholder.svg",
+    url: "/product/116",
+  },
+  {
+    id: 4,
+    name: "管路连接件",
+    image: "/placeholder.svg",
+    url: "/product/117",
+  },
+  {
+    id: 5,
+    name: "其他产品1",
+    image: "/placeholder.svg",
+    url: "/product/118",
+  },
+  {
+    id: 6,
+    name: "其他产品2",
+    image: "/placeholder.svg",
+    url: "/product/119",
+  },
+  {
+    id: 7,
+    name: "其他产品3",
+    image: "/placeholder.svg",
+    url: "/product/120",
+  },
+  {
+    id: 8,
+    name: "其他产品4",
+    image: "/placeholder.svg",
+    url: "/product/121",
+  },
+];
+
+export default async function Page({
+  params,
+}: {
+  params: Params;
+}) {
+  const { locale } = await params;
+  const t = await getTranslations("Product");
+
+  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">
+              首页
+            </I18nLink>
+            <span>/</span>
+            <span className="text-gray-700">产品中心</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">产品中心</h1>
+        
+        {/* 产品网格 */}
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-8">
+          {productData.map((product) => (
+            <I18nLink
+              key={product.id}
+              href={product.url}
+              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.image} 
+                  alt={product.name} 
+                  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.name}</h3>
+                <div className="inline-block text-red-600 font-medium hover:underline">
+                  了解更多 &gt;
+                </div>
+              </div>
+            </I18nLink>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export async function generateStaticParams() {
+  return LOCALES.map((locale) => ({ locale }));
+}