From 129b7ac7c79766cb0f397b1714ae4dc2c2b7374f Mon Sep 17 00:00:00 2001
From: mackt <1033530438@qq.com>
Date: Mon, 15 Apr 2024 23:47:11 +0800
Subject: [PATCH] =?UTF-8?q?fix(Category):=20url=20=E7=A9=BA=E6=A0=BC?=
 =?UTF-8?q?=E5=BC=95=E8=B5=B7=E7=9A=84=20bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../vol/list/[category]/[[...page]]/page.tsx  | 20 ++++++++++++++--
 src/components/Category.tsx                   | 24 +++----------------
 2 files changed, 21 insertions(+), 23 deletions(-)

diff --git a/src/app/vol/list/[category]/[[...page]]/page.tsx b/src/app/vol/list/[category]/[[...page]]/page.tsx
index cccb148..bd7554b 100644
--- a/src/app/vol/list/[category]/[[...page]]/page.tsx
+++ b/src/app/vol/list/[category]/[[...page]]/page.tsx
@@ -13,7 +13,23 @@ export const metadata: Metadata = {
 const getCategoryList = async () => {
   const result = await apiSearchCategoryList();
   if (result.code !== 200) return notFound();
-  return result.data;
+
+  // 去除空格
+  const list: Category[] = result.data.map((item) => {
+    return { ...item, nameEn: item.nameEn.replace(/ /g, '') };
+  });
+
+  // 添加“全部”tag
+  list.unshift({
+    id: '0',
+    nameCh: '全部',
+    nameEn: 'all',
+    image: '',
+    thumbnail: '',
+    description: '',
+  });
+
+  return list;
 };
 
 const getRecommendList = async () => {
@@ -45,7 +61,7 @@ export default async function Journal({ params }: { params: { category?: string;
       {/* 左侧 */}
       <div className="w-[712px] mt-[50px]">
         {/* category */}
-        <Category current={categoryInfo?.nameEn ?? 'all'} />
+        <Category list={categoryList} current={categoryInfo?.id ?? '0'} />
         {/*  */}
         <div className="flex flex-row items-center justify-between  mt-[33px]">
           <div className="text-[17px] leading-[23.8px]">{categoryInfo?.nameCh ?? '全部'}</div>
diff --git a/src/components/Category.tsx b/src/components/Category.tsx
index 86e888a..73d0757 100644
--- a/src/components/Category.tsx
+++ b/src/components/Category.tsx
@@ -1,31 +1,13 @@
 import Link from 'next/link';
 
-import { apiSearchCategoryList } from '@/services/server/journal';
-
-const getCategoryList = async () => {
-  const result = await apiSearchCategoryList();
-  return result.code === 200 ? result.data : [];
-};
-
-const Category = async ({ current = '' }: { current?: string }) => {
-  const categoryList = await getCategoryList();
-
-  categoryList.unshift({
-    id: '0',
-    nameCh: '全部',
-    nameEn: 'all',
-    image: '',
-    thumbnail: '',
-    description: '',
-  });
-
+const Category = async ({ list, current }: { list: Category[]; current: string }) => {
   return (
     <div className={`grid grid-cols-8`}>
-      {categoryList.map((item: Category) => (
+      {list.map((item: Category) => (
         <Link
           href={`/vol/list/${item.nameEn}`}
           key={item.id}
-          className={`w-[80px] h-[35px] mt-[10px] rounded-[120px] text-[13px] leading-[18px] text-center leading-[35px] cursor-pointer ${current === item.nameEn ? 'bg-brand text-[#fff]' : 'bg-[#F2F3F7] text-[#000]'}`}
+          className={`w-[80px] h-[35px] mt-[10px] rounded-[120px] text-[13px] leading-[18px] text-center leading-[35px] cursor-pointer ${current === item.id ? 'bg-brand text-[#fff]' : 'bg-[#F2F3F7] text-[#000]'} hover:bg-brand hover:text-[#fff]`}
         >
           {item.nameCh}
         </Link>