From c7fc67626e9899a82f0f6e3a3ee7de8b780c6bca Mon Sep 17 00:00:00 2001
From: Rogee <rogee@ipao.vip>
Date: Mon, 28 Sep 2026 11:47:16 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20=E8=B6=8B=E5=8A=BF=E5=9B=BE?=
 =?UTF-8?q?=E6=94=B9=E7=94=A8=20colorField=EF=BC=8C=E6=8A=98=E7=BA=BF?=
 =?UTF-8?q?=E5=88=86=E8=89=B2=E5=B9=B6=E6=98=BE=E7=A4=BA=E6=8C=87=E6=A0=87?=
 =?UTF-8?q?=E5=9B=BE=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/creator/WorksGallery.tsx | 20 ++++++++++----------
 web/src/pages/accounts/$id/index.tsx        |  2 +-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/web/src/components/creator/WorksGallery.tsx b/web/src/components/creator/WorksGallery.tsx
index dceb41c..e2a704b 100644
--- a/web/src/components/creator/WorksGallery.tsx
+++ b/web/src/components/creator/WorksGallery.tsx
@@ -44,7 +44,7 @@ export function WorkCover({ workID, title }: { workID: string; title?: string })
   );
 }
 
-// 观看/点赞/评论/分享全宽四列 GRID，贴在封面下方（body padding 置 0，本行自带上下边框）。
+// 观看/点赞/评论/分享全宽四列 GRID，紧贴封面（卡片 body 顶部，本行自带上下边框）。
 function WorkStatsGrid({ work }: { work: any }) {
   const items = [
     { key: 'play_count', label: '观看', icon: EyeOutlined },
@@ -53,15 +53,15 @@ function WorkStatsGrid({ work }: { work: any }) {
     { key: 'shares', label: '分享', icon: ShareAltOutlined },
   ];
   return (
-    <Flex style={{ margin: '10px 0 0', padding: '8px 0', borderTop: '1px solid #f0f0f0', borderBottom: '1px solid #f0f0f0' }}>
+    <Flex style={{ padding: '6px 0', borderTop: '1px solid #f0f0f0', borderBottom: '1px solid #f0f0f0' }}>
       {items.map(({ key, label, icon: Icon }) => (
-        <Flex key={key} vertical align="center" gap={2} style={{ flex: 1, minWidth: 0 }}>
-          <Typography.Text type="secondary" style={{ fontSize: 12 }}>
-            <Icon /> {label}
-          </Typography.Text>
-          <Typography.Text strong style={{ fontSize: 12 }}>
+        <Flex key={key} vertical align="center" gap={0} style={{ flex: 1, minWidth: 0 }}>
+          <Typography.Text strong style={{ fontSize: 14, lineHeight: '20px' }}>
             {work[key] ?? '—'}
           </Typography.Text>
+          <Typography.Text type="secondary" style={{ fontSize: 11, lineHeight: '16px' }}>
+            <Icon /> {label}
+          </Typography.Text>
         </Flex>
       ))}
     </Flex>
@@ -96,7 +96,7 @@ function GrowthChart({ metrics }: { metrics: any[] }) {
       data={data}
       xField="time"
       yField="value"
-      seriesField="metric"
+      colorField="metric"
       height={240}
       yAxis={{ labelFormatter: (v: number) => (v >= 10000 ? `${(v / 10000).toFixed(1)}w` : `${v}`) }}
       legend={{ position: 'top' }}
@@ -231,7 +231,8 @@ export default function WorksGallery({ sourceId, sourceType, emptyHint }: WorksG
                     onClick={() => openWorkDetail(work)}
                     cover={<WorkCover workID={work.id} title={work.title} />}
                   >
-                    <div style={{ padding: '12px 16px 0' }}>
+                    <WorkStatsGrid work={work} />
+                    <div style={{ padding: '10px 16px 0' }}>
                       <Flex vertical gap={8} style={{ minWidth: 0 }}>
                         <Typography.Paragraph strong ellipsis={{ rows: 2 }} style={{ marginBottom: 0 }}>
                           {work.title || '无标题'}
@@ -246,7 +247,6 @@ export default function WorksGallery({ sourceId, sourceType, emptyHint }: WorksG
                         </Typography.Text>
                       </Flex>
                     </div>
-                    <WorkStatsGrid work={work} />
                     {work.likes_growth != null && work.likes_growth > 0 ? (
                       <Typography.Text type="warning" style={{ display: 'block', padding: '8px 16px 0', fontSize: 12 }}>
                         <FireOutlined /> 24h +{work.likes_growth}
diff --git a/web/src/pages/accounts/$id/index.tsx b/web/src/pages/accounts/$id/index.tsx
index afd01a9..bd2e9fd 100644
--- a/web/src/pages/accounts/$id/index.tsx
+++ b/web/src/pages/accounts/$id/index.tsx
@@ -52,7 +52,7 @@ function AccountTrendChart({ metrics }: { metrics: any[] }) {
       data={data}
       xField="time"
       yField="value"
-      seriesField="metric"
+      colorField="metric"
       height={240}
       yAxis={{ labelFormatter: (v: number) => (v >= 10000 ? `${(v / 10000).toFixed(1)}w` : `${v}`) }}
       legend={{ position: 'top' }}