From aeacb9dcf9b38a7c3f55296363c3243d8ab5505c Mon Sep 17 00:00:00 2001
From: lanrtop <lanrtop@gmail.com>
Date: Sat, 4 Jul 2026 10:34:44 +0900
Subject: [PATCH] =?UTF-8?q?feat(manage):=20=E4=BA=A7=E5=93=81=E7=BB=84?=
 =?UTF-8?q?=E6=A6=82=E8=A7=88=E3=80=8C=E9=A1=B9=E7=9B=AE=E6=95=B0=E9=87=8F?=
 =?UTF-8?q?=E3=80=8D=E6=94=B9=E4=B8=BA=E7=BD=97=E5=88=97=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/manage/ManagePage.tsx | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/components/manage/ManagePage.tsx b/src/components/manage/ManagePage.tsx
index 9e89f09..4b943e8 100644
--- a/src/components/manage/ManagePage.tsx
+++ b/src/components/manage/ManagePage.tsx
@@ -454,7 +454,7 @@ function GroupsTab({ spaceId }: { spaceId?: string }) {
           <table className="w-full text-sm">
             <thead>
               <tr className="bg-gray-50 border-b border-gray-200">
-                {["产品组名称", "项目数量", "描述", "操作"].map((h) => (
+                {["产品组名称", "项目", "描述", "操作"].map((h) => (
                   <th key={h} className="px-5 py-3.5 text-left text-xs font-semibold text-gray-500 uppercase tracking-wide whitespace-nowrap">
                     {h}
                   </th>
@@ -463,17 +463,26 @@ function GroupsTab({ spaceId }: { spaceId?: string }) {
             </thead>
             <tbody className="divide-y divide-gray-100">
               {groups.map((g) => {
-                const count = maps.filter((m) => m.group_id === g.id).length;
+                const groupProjectNames = maps
+                  .filter((m) => m.group_id === g.id)
+                  .map((m) => projects.find((p) => p.id === m.project_id)?.name)
+                  .filter((n): n is string => !!n);
                 return (
                   <tr key={g.id} className="bg-white hover:bg-gray-50/60 transition-colors group">
                     <td className="px-5 py-4">
                       <div className="font-semibold text-gray-900">{g.name}</div>
                       <div className="text-xs font-mono text-gray-400 mt-0.5">{g.id}</div>
                     </td>
-                    <td className="px-5 py-4">
-                      <span className="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-50 text-blue-700 text-sm font-semibold border border-blue-100">
-                        {count}
-                      </span>
+                    <td className="px-5 py-4 max-w-[320px]">
+                      <div className="flex flex-wrap gap-1">
+                        {groupProjectNames.length > 0 ? groupProjectNames.map((name) => (
+                          <span key={name} className="px-2 py-0.5 rounded-md bg-blue-50 text-blue-700 text-xs font-medium border border-blue-100">
+                            {name}
+                          </span>
+                        )) : (
+                          <span className="text-xs text-gray-300">—</span>
+                        )}
+                      </div>
                     </td>
                     <td className="px-5 py-4 max-w-[280px]">
                       <span className="text-sm text-gray-500 truncate block">{g.description ?? "—"}</span>