From d535f178d697b9f9eba1ebfbdbdc872e0ffee8ae Mon Sep 17 00:00:00 2001
From: Rogee <rogee@ipao.vip>
Date: Wed, 30 Sep 2026 12:55:41 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20=E5=BC=BA=E5=88=B6=E5=90=8C?=
 =?UTF-8?q?=E6=AD=A5=E8=BF=90=E8=A1=8C=E4=B8=AD=E7=A6=81=E7=94=A8=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E2=80=94=E2=80=94=E5=88=97=E8=A1=A8/=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85=E7=BB=9F=E4=B8=80=20sync=5Fstatus=3Drunning=20?=
 =?UTF-8?q?=E5=88=A4=E5=AE=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 列表行与监控详情页：sync_status=running 时按钮显示「同步中…」并禁用，
  防止与调度器并发触发导致 409；自有账号详情请求期间 loading 禁用
- conflictMessage：409/503 无 hint 时也透出后端分类 error 文案，
  兜住「请求失败」空白提示；回归见 TestCompetitorSyncClaimFailureClassification
---
 .../components/accounts/MonitoringAccountList.tsx    |  6 ++++--
 web/src/pages/accounts/$id/index.tsx                 |  1 +
 web/src/pages/accounts/monitoring/$id/index.tsx      | 12 ++++++++----
 web/src/utils/helpers.ts                             |  6 +++++-
 4 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/web/src/components/accounts/MonitoringAccountList.tsx b/web/src/components/accounts/MonitoringAccountList.tsx
index b01a0c0..2a26026 100644
--- a/web/src/components/accounts/MonitoringAccountList.tsx
+++ b/web/src/components/accounts/MonitoringAccountList.tsx
@@ -64,7 +64,7 @@ export default function MonitoringAccountList() {
     load();
   }, [load]);
 
-  // 强制同步：后端用临时匿名浏览器采集公开作品，无需自有账号身份。
+  // 强制同步：后端用临时匿名浏览器采集公开作品，无需自有账号身份；409/503 直接展示后端分类文案。
   async function syncCompetitor(competitor: CompetitorRow) {
     setActionBusy(competitor.id);
     try {
@@ -187,7 +187,9 @@ export default function MonitoringAccountList() {
       render: (_, account) => (
         <Space wrap>
           <Button type="text" size="small" onClick={() => openTags(account)}>编辑标签</Button>
-          <Button type="text" size="small" loading={actionBusy === account.id} disabled={actionBusy === account.id} onClick={() => syncCompetitor(account)}>强制同步</Button>
+          <Button type="text" size="small" loading={actionBusy === account.id} disabled={actionBusy === account.id || account.sync_status === 'running'} onClick={() => syncCompetitor(account)}>
+            {account.sync_status === 'running' ? '同步中…' : '强制同步'}
+          </Button>
           <Button type="text" size="small" disabled={actionBusy === account.id} onClick={() => toggleCompetitor(account)}>
             {account.enabled ? '暂停' : '恢复'}
           </Button>
diff --git a/web/src/pages/accounts/$id/index.tsx b/web/src/pages/accounts/$id/index.tsx
index 4ef130c..8751155 100644
--- a/web/src/pages/accounts/$id/index.tsx
+++ b/web/src/pages/accounts/$id/index.tsx
@@ -137,6 +137,7 @@ export default function Page() {
     <Space>
       <Button onClick={() => history.push('/accounts')}>返回社媒账号</Button>
       <Button
+        loading={actionBusy}
         disabled={actionBusy || !account}
         onClick={async () => {
           // 强制同步：后端复用账号自身运行环境采集，需已登录+环境就绪（否则 409/503 提示原因）。
diff --git a/web/src/pages/accounts/monitoring/$id/index.tsx b/web/src/pages/accounts/monitoring/$id/index.tsx
index d53269e..e690523 100644
--- a/web/src/pages/accounts/monitoring/$id/index.tsx
+++ b/web/src/pages/accounts/monitoring/$id/index.tsx
@@ -65,15 +65,19 @@ export default function Page() {
   }, [loadCompetitor]);
 
   const syncMeta = syncStatusMeta[competitor?.sync_status ?? ''] || { label: competitor?.sync_status || '—' };
+  // 同步进行中（调度器采集或手动同步）：按钮禁用防止重复触发，后端抢锁失败也会返回 409 分类提示兜底。
+  const syncRunning = competitor?.sync_status === 'running';
 
   // 页头 actions：返回/同步/暂停恢复，对齐账号详情页形态。
   usePageActions(
     <Space>
       <Button onClick={() => history.push('/accounts/monitoring')}>返回监控账号</Button>
       <Button
-        disabled={actionBusy || !competitor}
+        loading={actionBusy}
+        disabled={actionBusy || syncRunning || !competitor}
         onClick={async () => {
-          // 强制同步：后端用临时匿名浏览器采集公开作品，无需自有账号身份。
+          // 强制同步：后端用临时匿名浏览器采集公开作品，无需自有账号身份；
+          // 409/503 直接展示后端分类文案（同步中/已停用/网关不可用）。
           if (!competitor) return;
           setActionBusy(true);
           try {
@@ -87,7 +91,7 @@ export default function Page() {
           }
         }}
       >
-        强制同步
+        {syncRunning ? '同步中…' : '强制同步'}
       </Button>
       <Button
         type="primary"
@@ -111,7 +115,7 @@ export default function Page() {
         {competitor ? (competitor.enabled ? '暂停监控' : '恢复监控') : '暂停监控'}
       </Button>
     </Space>,
-    [competitor?.id, competitor?.enabled],
+    [competitor?.id, competitor?.enabled, competitor?.sync_status],
   );
 
   if (pending) return <Card loading />;
diff --git a/web/src/utils/helpers.ts b/web/src/utils/helpers.ts
index d62d943..4fff27e 100644
--- a/web/src/utils/helpers.ts
+++ b/web/src/utils/helpers.ts
@@ -5,11 +5,15 @@ export function dateTime(value?: string | number | null): string {
   return Number.isNaN(date.getTime()) ? String(value) : date.toLocaleString();
 }
 
-// 对齐归档版 conflictMessage：优先后端 error 字段，409 冲突时附加提示。
+// 对齐归档版 conflictMessage：优先后端 error 字段；409/503 冲突类错误即使无 hint 也直接透出后端
+// 分类文案（如「该竞品正在同步中」），避免接口报错时界面无任何反馈。
 export function conflictMessage(error: any, conflictHint?: string): string {
   const status = error?.status ?? error?.body?.status;
   const message = error?.message || error?.body?.error || '请求失败';
   if (status === 409 && conflictHint) return `${message}：${conflictHint}`;
+  if ((status === 409 || status === 503) && message === '请求失败') {
+    return conflictHint ? conflictHint : `请求失败（${status}），请稍后重试`;
+  }
   return message;
 }