From 2caaf2d60666190cf80c68616be14e117c5bd695 Mon Sep 17 00:00:00 2001
From: Rogee <rogee@ipao.vip>
Date: Wed, 30 Sep 2026 16:38:01 +0800
Subject: [PATCH] =?UTF-8?q?feat(web):=20=E7=9B=91=E6=8E=A7=E8=B4=A6?=
 =?UTF-8?q?=E5=8F=B7=E8=AF=A6=E6=83=85=E5=B1=95=E7=A4=BA=E8=8E=B7=E8=B5=9E?=
 =?UTF-8?q?=E4=B8=8E=E4=BD=9C=E8=80=85=E4=BB=8B=E7=BB=8D=E2=80=94=E2=80=94?=
 =?UTF-8?q?=E4=BB=8B=E7=BB=8D=E5=8D=95=E8=A1=8C=E7=9C=81=E7=95=A5=EF=BC=8C?=
 =?UTF-8?q?=E3=80=8C=E6=9B=B4=E5=A4=9A=E3=80=8Dhover=20=E5=BC=B9=E5=87=BA?=
 =?UTF-8?q?=E5=85=A8=E6=96=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/accounts/monitoring/$id/index.tsx   | 28 +++++++++++++++-
 web/tests/monitoring-account-detail.test.cjs  | 32 +++++++++++++++++++
 2 files changed, 59 insertions(+), 1 deletion(-)
 create mode 100644 web/tests/monitoring-account-detail.test.cjs

diff --git a/web/src/pages/accounts/monitoring/$id/index.tsx b/web/src/pages/accounts/monitoring/$id/index.tsx
index e690523..e9f4c84 100644
--- a/web/src/pages/accounts/monitoring/$id/index.tsx
+++ b/web/src/pages/accounts/monitoring/$id/index.tsx
@@ -3,7 +3,7 @@
 // 作品列表走 GET /creator/works?source_id=<competitor_id>&source_type=competitor，定时采集由后端调度器维护。
 import { useCallback, useEffect, useState } from 'react';
 import { history, useParams } from '@umijs/max';
-import { Alert, App, Avatar, Button, Card, Descriptions, Flex, Space, Tag, Typography } from 'antd';
+import { Alert, App, Avatar, Button, Card, Descriptions, Flex, Popover, Space, Tag, Typography } from 'antd';
 import { creatorAction, getOne } from '@/services/api';
 import { conflictMessage, dateTime } from '@/utils/helpers';
 import { usePageActions } from '@/components/PageActions';
@@ -18,9 +18,11 @@ interface CompetitorDetail {
   avatar_url: string;
   homepage_url?: string;
   tags?: string[];
+  signature?: string;
   enabled: boolean;
   follower_count?: number | null;
   following_count?: number | null;
+  total_favorited?: number | null;
   aweme_count?: number | null;
   sync_status?: string;
   sync_error?: string;
@@ -144,8 +146,32 @@ export default function Page() {
                 { key: 'uid', label: '抖音号', children: competitor.unique_id || '—' },
                 { key: 'follower', label: '粉丝', children: formatCount(competitor.follower_count) },
                 { key: 'following', label: '关注', children: formatCount(competitor.following_count) },
+                { key: 'favorited', label: '获赞', children: formatCount(competitor.total_favorited) },
                 { key: 'aweme', label: '作品总数', children: formatCount(competitor.aweme_count) },
                 { key: 'tags', label: '标签', children: competitor.tags?.length ? competitor.tags.join('、') : '无' },
+                {
+                  key: 'signature',
+                  label: '作者介绍',
+                  // 对齐抖音主页形态：单行省略，结尾「更多」，hover 弹出全文（保留换行）。
+                  children: competitor.signature ? (
+                    <Flex align="center" gap={8} style={{ minWidth: 0 }}>
+                      <Typography.Text type="secondary" ellipsis style={{ flex: 1, minWidth: 0 }}>
+                        {competitor.signature}
+                      </Typography.Text>
+                      <Popover
+                        title="作者介绍"
+                        content={
+                          <Typography.Paragraph style={{ maxWidth: 420, whiteSpace: 'pre-wrap', marginBottom: 0 }}>
+                            {competitor.signature}
+                          </Typography.Paragraph>
+                        }
+                      >
+                        <Typography.Link>更多</Typography.Link>
+                      </Popover>
+                    </Flex>
+                  ) : (
+                    '—'
+                  ) },
                 { key: 'lastSync', label: '上次同步', children: competitor.last_sync_at ? dateTime(competitor.last_sync_at) : '—' },
                 { key: 'nextSync', label: '下次自动同步', children: competitor.next_sync_at ? dateTime(competitor.next_sync_at) : '—' },
                 {
diff --git a/web/tests/monitoring-account-detail.test.cjs b/web/tests/monitoring-account-detail.test.cjs
new file mode 100644
index 0000000..9c17f0e
--- /dev/null
+++ b/web/tests/monitoring-account-detail.test.cjs
@@ -0,0 +1,32 @@
+const assert = require('node:assert/strict');
+const { readFileSync } = require('node:fs');
+const { test } = require('node:test');
+const ts = require('typescript');
+
+const source = ts.createSourceFile(
+  'index.tsx',
+  readFileSync(`${__dirname}/../src/pages/accounts/monitoring/$id/index.tsx`, 'utf8'),
+  ts.ScriptTarget.Latest,
+  true,
+  ts.ScriptKind.TSX,
+);
+const code = source.getFullText();
+
+test('监控账号详情展示获赞与作者介绍', () => {
+  assert.ok(code.includes('total_favorited'), '接口类型应包含 total_favorited');
+  assert.ok(code.includes("competitor.signature"), '接口类型应包含 signature');
+  assert.ok(code.includes("label: '获赞'"), 'Descriptions 应有获赞项');
+  assert.ok(code.includes("label: '作者介绍'"), 'Descriptions 应有作者介绍项');
+  assert.ok(code.includes('formatCount(competitor.total_favorited)'), '获赞应走 formatCount');
+});
+
+test('作者介绍单行展示，结尾「更多」hover 弹出全文', () => {
+  // 单行省略：Typography.Text ellipsis
+  assert.match(code, /<Typography\.Text[^>]*ellipsis/, '作者介绍应为单行省略文本');
+  // 更多触发器 + Popover 展示全文，保留换行
+  assert.match(code, /<Popover\b/, '应使用 Popover 承载全文');
+  assert.match(code, />更多</, '结尾应有「更多」触发器');
+  assert.match(code, /pre-wrap/, '全文应保留换行');
+  // 无签名时展示占位符，不渲染更多入口
+  assert.match(code, /competitor\.signature \?/, '签名应判空');
+});