From 10cb2bcba81a208fa9ebae3d535e1ffe60f7ec2d Mon Sep 17 00:00:00 2001
From: "www.zerocode.net.cn" <www.zerocode.net.cn@gmail.com>
Date: Tue, 17 Sep 2024 12:59:56 +0800
Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=A8=A1=E5=9E=8B=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E5=B8=83=E5=B1=80=E8=B0=83=E6=95=B4=E5=92=8C=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=E6=94=B9=E8=BF=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 扩展项目列表每页显示数量至8项。
- 移除项目描述字段，统一使用更新时间作为列表内容展示。
- 为项目卡片添加垂直布局和固定列数的网格系统。
- 修改actions列渲染逻辑，优化个人和团队项目的操作展示。
- 修复项目操作组件的参数传递问题，确保各操作功能正确执行。
---
 src/pages/dataModels/index.tsx | 90 ++++++++++++++++------------------
 1 file changed, 41 insertions(+), 49 deletions(-)

diff --git a/src/pages/dataModels/index.tsx b/src/pages/dataModels/index.tsx
index 9a83aaa..c577e9e 100644
--- a/src/pages/dataModels/index.tsx
+++ b/src/pages/dataModels/index.tsx
@@ -40,7 +40,7 @@ type ProjectItem = {
 export default () => {
   const [state, setState] = useState<ProjectListProps>({
     page: 1,
-    limit: 6,
+    limit: 8,
     total: 0,
     projects: [],
     order: "updateTime",
@@ -67,7 +67,7 @@ export default () => {
           total: res.data.total,
           projects: res.data.records?.map((m: any) => ({
             ...m,
-            avatar: '/logo.svg'
+            avatar: '/logo.svg',
           }))
         });
       } else {
@@ -135,8 +135,10 @@ export default () => {
           ),
         ],
       }}
+      grid={{ gutter: 2, column: 4 }}
+      itemLayout="vertical"
       rowKey="id"
-      onRow={(record) => ({
+      onItem={(record) => ({
         onClick: () => openProject(record),
         style: { cursor: 'pointer' },
       })}
@@ -162,19 +164,6 @@ export default () => {
           dataIndex: 'avatar',
           search: false,
         },
-        description: {
-          dataIndex: 'description',
-          search: false,
-          render: (text) => (
-            <Paragraph
-              type="secondary"
-              ellipsis={{ tooltip: true }}
-              style={{ marginBottom: 0, maxWidth: '350px' }}
-            >
-              {text}
-            </Paragraph>
-          ),
-        },
         subTitle: {
           render: (_, row) => (
             <Space size={0}>
@@ -190,42 +179,45 @@ export default () => {
           search: false,
         },
         content: {
-          dataIndex: 'updateTime',
-          render: (text) => (
-            <div key="updateTime" style={{color: '#00000073'}}>{text}</div>
+          render: (_, record) => (
+            <Space direction="vertical" size="small" style={{ width: '100%' }}>
+              <Paragraph
+                type="secondary"
+                ellipsis={{ rows: 1, tooltip: true }}
+                style={{ marginBottom: 0 }}
+              >
+                {record.description}
+              </Paragraph>
+              <div style={{color: '#00000073'}}>更新时间：{record.updateTime}</div>
+            </Space>
           ),
         },
         actions: {
-          render: (text, row) => {
-            const actions = [];
-
-            if (row.type === '1') { // Personal project
-              actions.push(
-                <RenameProject 
-                  fetchProjects={() => fetchProjects(null)} 
-                  trigger={'ant'} 
-                  project={row} 
-                  key={'RenameProject' + row.id}
-                />,
-                <RemoveProject 
-                  fetchProjects={() => fetchProjects(null)} 
-                  project={row} 
-                  key={'RemoveProject' + row.id}
-                />
-              );
-            } else if (row.type === '2') { // Team project
-              actions.push(
-                <ConfigProject 
-                  project={row} 
-                  type={2} 
-                  key={'ConfigProject' + row.id}
-                />
-              );
-            }
-
-            return actions;
-          },
-          search: false,
+          cardActionProps: 'actions',
+          render: (_, record) => [
+            record.type === '1' && (
+              <RenameProject 
+                fetchProjects={() => fetchProjects(null)} 
+                trigger={'ant'} 
+                project={record} 
+                key={'RenameProject' + record.id}
+              />
+            ),
+            record.type === '1' && (
+              <RemoveProject 
+                fetchProjects={() => fetchProjects(null)} 
+                project={record} 
+                key={'RemoveProject' + record.id}
+              />
+            ),
+            record.type === '2' && (
+              <ConfigProject 
+                project={record} 
+                type={2} 
+                key={'ConfigProject' + record.id}
+              />
+            ),
+          ],
         },
       }}
     />