tt-help-cli-ycl 1.4.17 → 1.4.19

package/src/watch/public/app.js

@@ -21,6 +21,7 @@ let currentRawLocation = "";
 let currentSort = { key: null, asc: true };
 let prevStatValues = {};
 let prevUserMap = {};
+let prevTargetUsers = 0;
 
 async function fetchStats() {
   try {
@@ -164,6 +165,13 @@ function renderStats() {
     statJobsBase.textContent = `jobs_base: ${formatStatNum(d.jobsBaseTotal || 0)}`;
   flashEl("statError", d.errorUsers);
   flashEl("statTarget", d.targetUsers, { full: true });
+  // 检测目标商家新增，放烟花（仅首页）
+  const hash = window.location.hash.replace(/^#/, "");
+  if (!hash && prevTargetUsers > 0 && d.targetUsers > prevTargetUsers) {
+    const diff = d.targetUsers - prevTargetUsers;
+    triggerFirework(diff);
+  }
+  prevTargetUsers = d.targetUsers || 0;
   flashEl("statUserUpdateTasks", d.userUpdateTasks || 0, { full: true });
   flashEl("statRawJobs", d.rawJobs || 0);
   flashEl("statCommentTask", d.commentTaskCount || 0, { full: true });
@@ -256,13 +264,21 @@ function renderActiveClients(clients) {
   const tbody = document.getElementById("activeClientsBody");
   if (!section || !bar) return;
 
-  const types = ["explore", "refresh", "attach", "comments", "scoring"];
+  const types = [
+    "explore",
+    "refresh",
+    "attach",
+    "comments",
+    "scoring",
+    "tag-refresh",
+  ];
   const labels = {
     explore: "Explore",
     refresh: "Refresh",
     attach: "Attach",
     comments: "Comments",
     scoring: "Scoring",
+    "tag-refresh": "TagRefresh",
   };
   const grouped = {};
   for (const c of clients) {
@@ -352,7 +368,7 @@ function renderCountryChart(countries) {
       const isTarget = targetLocations.includes(c.country);
       const targetBadge =
         c.targetCount > 0
-          ? `<span class="target-badge">🎯 ${c.targetCount}</span>`
+          ? `<span class="target-badge${isTarget ? "" : " target-badge-other"}">🎯 ${c.targetCount}</span>`
           : `<span class="target-badge" style="visibility:hidden"> </span>`;
       return `
     <div class="bar-row${isTarget ? " is-target" : ""}">
@@ -796,6 +812,55 @@ async function confirmNonSeller(uniqueId) {
   }
 }
 
+async function moveToBase(uniqueId) {
+  if (
+    !confirm(
+      `确定要将 @${uniqueId} 移到 jobs_base 并重走流程吗？\n这会将用户从 jobs 表移到 jobs_base，完全从头开始采集。`,
+    )
+  ) {
+    return;
+  }
+  showLoading("正在移动...");
+  try {
+    const res = await fetch(
+      `/api/user-move-to-base/${encodeURIComponent(uniqueId)}`,
+      {
+        method: "PUT",
+        headers: { "Content-Type": "application/json" },
+      },
+    );
+    const data = await res.json();
+    if (data.error) {
+      showToast(data.error, true);
+      return;
+    }
+    showToast(`@${uniqueId} 已移到 jobs_base，将重走流程`);
+
+    // 从当前列表中移除该用户
+    currentTargetUsers = currentTargetUsers.filter(
+      (u) => u.uniqueId !== uniqueId,
+    );
+    currentTargetTotal = Math.max(0, currentTargetTotal - 1);
+    renderTargetTable();
+
+    // 更新统计
+    const statEl = document.getElementById("targetPageStatTotal");
+    if (statEl)
+      statEl.textContent = formatStatNum(currentTargetTotal, { full: true });
+    if (currentStats) {
+      currentStats.targetUsers = Math.max(
+        0,
+        (currentStats.targetUsers || 0) - 1,
+      );
+      flashEl("statTarget", currentStats.targetUsers, { full: true });
+    }
+  } catch (e) {
+    showToast("移动失败: " + e.message, true);
+  } finally {
+    hideLoading();
+  }
+}
+
 async function submitAddUsers() {
   const ta = document.getElementById("modalUserInput");
   const raw = ta.value.trim();
@@ -1051,6 +1116,121 @@ function scrollToTop() {
   window.scrollTo({ top: 0, behavior: "smooth" });
 }
 
+// ── 回顶部按钮拖拽 ──
+(function initBackToTopDrag() {
+  const btn = document.getElementById("backToTop");
+  if (!btn) return;
+
+  let startX,
+    startY,
+    startLeft,
+    startTop,
+    dragging = false,
+    moved = false;
+  const DRAG_THRESHOLD = 5;
+  const STORAGE_KEY = "backToTopPos";
+
+  // 恢复保存的位置
+  const saved = (function () {
+    try {
+      return JSON.parse(localStorage.getItem(STORAGE_KEY));
+    } catch (_) {
+      return null;
+    }
+  })();
+  if (
+    saved &&
+    typeof saved.left === "number" &&
+    typeof saved.top === "number"
+  ) {
+    btn.style.left = saved.left + "px";
+    btn.style.top = saved.top + "px";
+    btn.style.right = "auto";
+    btn.style.bottom = "auto";
+  }
+
+  function clamp(val, min, max) {
+    return Math.min(Math.max(val, min), max);
+  }
+
+  function getPos(e) {
+    if (e.touches) return { x: e.touches[0].clientX, y: e.touches[0].clientY };
+    return { x: e.clientX, y: e.clientY };
+  }
+
+  function onStart(e) {
+    if (e.button !== undefined && e.button !== 0) return; // 只响应左键
+    const pos = getPos(e);
+    startX = pos.x;
+    startY = pos.y;
+    const rect = btn.getBoundingClientRect();
+    startLeft = rect.left;
+    startTop = rect.top;
+    moved = false;
+    dragging = true;
+    btn.classList.add("dragging");
+    btn.style.right = "auto";
+    btn.style.bottom = "auto";
+    btn.style.left = startLeft + "px";
+    btn.style.top = startTop + "px";
+    e.preventDefault();
+  }
+
+  function onMove(e) {
+    if (!dragging) return;
+    const pos = getPos(e);
+    const dx = pos.x - startX;
+    const dy = pos.y - startY;
+    if (
+      !moved &&
+      Math.abs(dx) < DRAG_THRESHOLD &&
+      Math.abs(dy) < DRAG_THRESHOLD
+    )
+      return;
+    moved = true;
+    const newLeft = clamp(
+      startLeft + dx,
+      0,
+      window.innerWidth - btn.offsetWidth,
+    );
+    const newTop = clamp(
+      startTop + dy,
+      0,
+      window.innerHeight - btn.offsetHeight,
+    );
+    btn.style.left = newLeft + "px";
+    btn.style.top = newTop + "px";
+  }
+
+  function onEnd() {
+    if (!dragging) return;
+    dragging = false;
+    btn.classList.remove("dragging");
+    if (moved) {
+      // 保存位置
+      try {
+        localStorage.setItem(
+          STORAGE_KEY,
+          JSON.stringify({
+            left: parseInt(btn.style.left),
+            top: parseInt(btn.style.top),
+          }),
+        );
+      } catch (_) {}
+    } else {
+      // 未拖动则视为点击
+      scrollToTop();
+    }
+  }
+
+  btn.addEventListener("mousedown", onStart);
+  btn.addEventListener("touchstart", onStart, { passive: false });
+  window.addEventListener("mousemove", onMove);
+  window.addEventListener("touchmove", onMove, { passive: false });
+  window.addEventListener("mouseup", onEnd);
+  window.addEventListener("touchend", onEnd);
+})();
+
 function handleRoute() {
   const hash = window.location.hash;
   if (hash === "#pending") {
@@ -1291,6 +1471,8 @@ let currentTagsAllLoaded = false;
 let currentTagsSeq = 0;
 const TAGS_PAGE_SIZE = 200;
 let cachedTagCountries = [];
+let currentRefreshHours = 24;
+let currentTargetRefreshHours = 24;
 
 function showTagsPage() {
   document.getElementById("mainPage").classList.add("hidden");
@@ -1300,7 +1482,9 @@ function showTagsPage() {
   document.getElementById("targetPage").classList.remove("active");
   document.getElementById("tagsPage").classList.add("active");
   showLoading("正在加载关键词...");
-  Promise.all([loadTagStats(), loadTagsPage()]).finally(hideLoading);
+  Promise.all([loadTagStats(), loadTagsPage(), loadRefreshStats()]).finally(
+    hideLoading,
+  );
 }
 
 function setTagsFilter(filter) {
@@ -1325,13 +1509,94 @@ async function loadTagStats() {
     flashEl("tagsPageStatDead", stats.dead || 0);
     flashEl("tagsPageStatNew", (stats.new || 0) + (stats.scoring || 0));
     cachedTagCountries = stats.countries || [];
-    // 初始化国家下拉
     renderTagsCountryFilter();
   } catch (e) {
     console.error("获取关键词统计失败:", e);
   }
 }
 
+async function loadRefreshStats() {
+  try {
+    const res = await fetch(
+      `/api/tags/refresh-stats?hours=${currentRefreshHours}`,
+    );
+    const data = await res.json();
+    renderRefreshStats(data);
+  } catch (e) {
+    console.error("获取刷新统计失败:", e);
+  }
+}
+
+function renderRefreshStats(data) {
+  const el = document.getElementById("tagsRefreshStats");
+  if (!el || !data || !data.countries || data.countries.length === 0) {
+    if (el) el.innerHTML = "";
+    return;
+  }
+  const pct =
+    data.total > 0 ? Math.round((data.refreshed / data.total) * 100) : 0;
+  const barW = Math.min(pct, 100);
+
+  const HOUR_OPTIONS = [12, 24, 36, 48, 72];
+  let html = `<div style="background:#1a1a2e;border:1px solid #2a2a3a;border-radius:10px;padding:16px">
+    <div id="refreshStatsHeader" style="display:flex;align-items:center;gap:16px;cursor:pointer;user-select:none">
+      <span style="font-size:14px;font-weight:600;color:#e0e0e0;position:relative">
+        📊 最近 <span id="refreshHoursLabel" style="color:#60a5fa;cursor:pointer;text-decoration:underline dotted" onclick="event.stopPropagation();toggleHoursDropdown(event)">${currentRefreshHours}h</span> 刷新进度
+        <div id="refreshHoursDropdown" style="display:none;position:absolute;top:100%;left:0;margin-top:4px;background:#1e1e3a;border:1px solid #3b82f6;border-radius:8px;padding:4px 0;z-index:100;box-shadow:0 4px 16px rgba(0,0,0,0.5);min-width:60px">
+          ${HOUR_OPTIONS.map((h) => `<div class="hours-option" data-hours="${h}" style="padding:6px 14px;cursor:pointer;font-size:13px;color:${h === currentRefreshHours ? "#60a5fa" : "#ccc"};font-weight:${h === currentRefreshHours ? "600" : "400"};white-space:nowrap" onclick="event.stopPropagation();selectRefreshHours(${h})">${h}h</div>`).join("")}
+        </div>
+      </span>
+      <span style="font-size:13px;color:#9ca3af">${data.refreshed} / ${data.total}</span>
+      <div style="flex:1;max-width:200px;height:8px;background:#2a2a3a;border-radius:4px;overflow:hidden">
+        <div style="height:100%;width:${barW}%;background:${pct >= 50 ? "#22c55e" : "#facc15"};border-radius:4px;transition:width 0.3s"></div>
+      </div>
+      <span style="font-size:14px;font-weight:700;color:${pct >= 50 ? "#22c55e" : "#facc15"}">${pct}%</span>
+      <span id="refreshStatsArrow" style="color:#888;font-size:12px">▶</span>
+    </div>
+    <div id="refreshStatsBody" style="display:none;margin-top:12px">
+    <table style="width:100%;border-collapse:collapse;font-size:12px">
+      <thead><tr style="color:#888;text-align:left">
+        <th style="padding:4px 8px">国家</th>
+        <th style="padding:4px 8px;text-align:right">需刷新</th>
+        <th style="padding:4px 8px;text-align:right">${currentRefreshHours}h已刷</th>
+        <th style="padding:4px 8px;width:120px">进度</th>
+      </tr></thead>
+      <tbody>`;
+
+  for (const c of data.countries) {
+    const cpct = c.total > 0 ? Math.round((c.refreshed / c.total) * 100) : 0;
+    const cBarW = Math.min(cpct, 100);
+    html += `<tr style="color:#ccc;border-top:1px solid #222">
+      <td style="padding:4px 8px">${c.country}</td>
+      <td style="padding:4px 8px;text-align:right">${c.total}</td>
+      <td style="padding:4px 8px;text-align:right;color:${cpct >= 50 ? "#22c55e" : "#facc15"}">${c.refreshed}</td>
+      <td style="padding:4px 8px">
+        <div style="display:flex;align-items:center;gap:6px">
+          <div style="flex:1;height:6px;background:#2a2a3a;border-radius:3px;overflow:hidden">
+            <div style="height:100%;width:${cBarW}%;background:${cpct >= 50 ? "#22c55e" : "#facc15"};border-radius:3px"></div>
+          </div>
+          <span style="font-size:11px;color:#9ca3af;min-width:28px;text-align:right">${cpct}%</span>
+        </div>
+      </td>
+    </tr>`;
+  }
+
+  html += `</tbody></table></div></div>`;
+  el.innerHTML = html;
+
+  // 绑定展开/折叠
+  const header = document.getElementById("refreshStatsHeader");
+  const body = document.getElementById("refreshStatsBody");
+  const arrow = document.getElementById("refreshStatsArrow");
+  if (header && body && arrow) {
+    header.addEventListener("click", () => {
+      const open = body.style.display !== "none";
+      body.style.display = open ? "none" : "";
+      arrow.textContent = open ? "▶" : "▼";
+    });
+  }
+}
+
 function renderTagsCountryFilter() {
   const sel = document.getElementById("tagsCountryFilter");
   if (!sel) return;
@@ -1441,7 +1706,7 @@ function renderTagsTable() {
       const matchedAuthors = t.matched_authors ?? "-";
       const pushedUsers = t.pushed_users ?? "-";
       const refreshedAt = t.refreshed_at
-        ? t.refreshed_at.slice(0, 16).replace("T", " ")
+        ? formatTime(new Date(t.refreshed_at).getTime())
         : "-";
 
       return `<tr>
@@ -1486,7 +1751,7 @@ document
   .addEventListener("click", async () => {
     showLoading("正在刷新...");
     try {
-      await Promise.all([loadTagStats(), loadTagsPage()]);
+      await Promise.all([loadTagStats(), loadTagsPage(), loadRefreshStats()]);
       showToast("刷新完成");
     } catch (e) {
       showToast("刷新失败: " + e.message, true);
@@ -1519,6 +1784,151 @@ function loadMoreTags() {
   loadTagsPage(true);
 }
 
+// ====== 刷新统计时间切换 ======
+
+function toggleHoursDropdown(event) {
+  const dropdown = document.getElementById("refreshHoursDropdown");
+  if (!dropdown) return;
+  const isOpen = dropdown.style.display !== "none";
+  dropdown.style.display = isOpen ? "none" : "block";
+}
+
+async function selectRefreshHours(hours) {
+  const dropdown = document.getElementById("refreshHoursDropdown");
+  if (dropdown) dropdown.style.display = "none";
+  if (hours === currentRefreshHours) return;
+  currentRefreshHours = hours;
+  showLoading("正在加载...");
+  try {
+    await loadRefreshStats();
+    const label = document.getElementById("refreshHoursLabel");
+    if (label) label.textContent = hours + "h";
+  } catch (e) {
+    console.error("刷新统计失败:", e);
+  } finally {
+    hideLoading();
+  }
+}
+
+// ===== 目标商家刷新进度（复用 tags 页面的 UI 模式）=====
+
+async function loadTargetRefreshStats() {
+  try {
+    const res = await fetch(
+      `/api/targets/refresh-stats?hours=${currentTargetRefreshHours}`,
+    );
+    const data = await res.json();
+    renderTargetRefreshStats(data);
+  } catch (e) {
+    console.error("获取目标商家刷新统计失败:", e);
+  }
+}
+
+function renderTargetRefreshStats(data) {
+  const el = document.getElementById("targetRefreshStats");
+  if (!el || !data || !data.countries || data.countries.length === 0) {
+    if (el) el.innerHTML = "";
+    return;
+  }
+  const pct =
+    data.total > 0 ? Math.round((data.refreshed / data.total) * 100) : 0;
+  const barW = Math.min(pct, 100);
+
+  const HOUR_OPTIONS = [12, 24, 36, 48, 72];
+  let html = `<div style="background:#1a1a2e;border:1px solid #2a2a3a;border-radius:10px;padding:16px">
+    <div id="targetRefreshStatsHeader" style="display:flex;align-items:center;gap:16px;cursor:pointer;user-select:none">
+      <span style="font-size:14px;font-weight:600;color:#e0e0e0;position:relative">
+        📊 最近 <span id="targetRefreshHoursLabel" style="color:#60a5fa;cursor:pointer;text-decoration:underline dotted" onclick="event.stopPropagation();toggleTargetHoursDropdown(event)">${currentTargetRefreshHours}h</span> 刷新进度
+        <div id="targetRefreshHoursDropdown" style="display:none;position:absolute;top:100%;left:0;margin-top:4px;background:#1e1e3a;border:1px solid #3b82f6;border-radius:8px;padding:4px 0;z-index:100;box-shadow:0 4px 16px rgba(0,0,0,0.5);min-width:60px">
+          ${HOUR_OPTIONS.map((h) => `<div class="hours-option" data-hours="${h}" style="padding:6px 14px;cursor:pointer;font-size:13px;color:${h === currentTargetRefreshHours ? "#60a5fa" : "#ccc"};font-weight:${h === currentTargetRefreshHours ? "600" : "400"};white-space:nowrap" onclick="event.stopPropagation();selectTargetRefreshHours(${h})">${h}h</div>`).join("")}
+        </div>
+      </span>
+      <span style="font-size:13px;color:#9ca3af">${data.refreshed} / ${data.total}</span>
+      <div style="flex:1;max-width:200px;height:8px;background:#2a2a3a;border-radius:4px;overflow:hidden">
+        <div style="height:100%;width:${barW}%;background:${pct >= 50 ? "#22c55e" : "#facc15"};border-radius:4px;transition:width 0.3s"></div>
+      </div>
+      <span style="font-size:14px;font-weight:700;color:${pct >= 50 ? "#22c55e" : "#facc15"}">${pct}%</span>
+      <span id="targetRefreshStatsArrow" style="color:#888;font-size:12px">▶</span>
+    </div>
+    <div id="targetRefreshStatsBody" style="display:none;margin-top:12px">
+    <table style="width:100%;border-collapse:collapse;font-size:12px">
+      <thead><tr style="color:#888;text-align:left">
+        <th style="padding:4px 8px">国家</th>
+        <th style="padding:4px 8px;text-align:right">商家数</th>
+        <th style="padding:4px 8px;text-align:right">${currentTargetRefreshHours}h已刷</th>
+        <th style="padding:4px 8px;width:120px">进度</th>
+      </tr></thead>
+      <tbody>`;
+
+  for (const c of data.countries) {
+    const cpct = c.total > 0 ? Math.round((c.refreshed / c.total) * 100) : 0;
+    const cBarW = Math.min(cpct, 100);
+    html += `<tr style="color:#ccc;border-top:1px solid #222">
+      <td style="padding:4px 8px">${c.country}</td>
+      <td style="padding:4px 8px;text-align:right">${c.total}</td>
+      <td style="padding:4px 8px;text-align:right;color:${cpct >= 50 ? "#22c55e" : "#facc15"}">${c.refreshed}</td>
+      <td style="padding:4px 8px">
+        <div style="display:flex;align-items:center;gap:6px">
+          <div style="flex:1;height:6px;background:#2a2a3a;border-radius:3px;overflow:hidden">
+            <div style="height:100%;width:${cBarW}%;background:${cpct >= 50 ? "#22c55e" : "#facc15"};border-radius:3px"></div>
+          </div>
+          <span style="font-size:11px;color:#9ca3af;min-width:28px;text-align:right">${cpct}%</span>
+        </div>
+      </td>
+    </tr>`;
+  }
+
+  html += `</tbody></table></div></div>`;
+  el.innerHTML = html;
+
+  // 绑定展开/折叠
+  const header = document.getElementById("targetRefreshStatsHeader");
+  const body = document.getElementById("targetRefreshStatsBody");
+  const arrow = document.getElementById("targetRefreshStatsArrow");
+  if (header && body && arrow) {
+    header.addEventListener("click", () => {
+      const open = body.style.display !== "none";
+      body.style.display = open ? "none" : "";
+      arrow.textContent = open ? "▶" : "▼";
+    });
+  }
+}
+
+function toggleTargetHoursDropdown(event) {
+  const dropdown = document.getElementById("targetRefreshHoursDropdown");
+  if (!dropdown) return;
+  const isOpen = dropdown.style.display !== "none";
+  dropdown.style.display = isOpen ? "none" : "block";
+}
+
+async function selectTargetRefreshHours(hours) {
+  const dropdown = document.getElementById("targetRefreshHoursDropdown");
+  if (dropdown) dropdown.style.display = "none";
+  if (hours === currentTargetRefreshHours) return;
+  currentTargetRefreshHours = hours;
+  try {
+    await loadTargetRefreshStats();
+    const label = document.getElementById("targetRefreshHoursLabel");
+    if (label) label.textContent = hours + "h";
+  } catch (e) {
+    console.error("目标商家刷新统计失败:", e);
+  }
+}
+
+// 点击空白处关闭下拉
+document.addEventListener("click", (e) => {
+  const dropdown = document.getElementById("refreshHoursDropdown");
+  const label = document.getElementById("refreshHoursLabel");
+  if (
+    dropdown &&
+    dropdown.style.display !== "none" &&
+    !label?.contains(e.target) &&
+    !dropdown.contains(e.target)
+  ) {
+    dropdown.style.display = "none";
+  }
+});
+
 // 排序
 document.querySelectorAll(".sortable-tag").forEach((th) => {
   th.addEventListener("click", () => {
@@ -1548,6 +1958,7 @@ function showTargetPage() {
   showLoading("正在加载目标商家数据...");
   fetchTargetByCountry();
   fetchTargetOtherCountries();
+  loadTargetRefreshStats();
   // 同步统计
   if (currentStats) {
     document.getElementById("targetPageStatTotal").textContent = formatStatNum(
@@ -1564,7 +1975,7 @@ let currentTargetLoading = false;
 let currentTargetAllLoaded = false;
 let currentTargetSeq = 0;
 let currentTargetSort = { key: null, asc: true };
-const TARGET_PAGE_SIZE = 200;
+const TARGET_PAGE_SIZE = 500;
 
 async function fetchTargetOtherCountries() {
   try {
@@ -1816,7 +2227,7 @@ function renderTargetTable() {
       <td data-label="最近发布" style="font-size:11px;color:#888">${latestVideo}</td>
       <td data-label="最近刷新" style="font-size:11px;color:#888">${refreshTime}</td>
       <td data-label="操作">
-        <button class="btn-non-seller" onclick="confirmNonSeller('${escapeJsString(u.uniqueId)}')" title="将此用户标记为非商家">设为非商家</button>
+        <button class="btn-pending" onclick="moveToBase('${escapeJsString(u.uniqueId)}')" title="移到 jobs_base 重走流程">待确认</button>
       </td>
     </tr>`;
     })
@@ -1960,6 +2371,7 @@ document
       const btn = document.getElementById("targetReprocessBtn");
       if (btn) btn.style.display = "none";
       await fetchTargetByCountry();
+      await loadTargetRefreshStats();
       showToast("刷新完成");
     } catch (e) {
       showToast("刷新失败: " + e.message, true);
@@ -2580,6 +2992,136 @@ function initTargetTableSorting() {
   });
 }
 
+// ========== 烟花/鞭炮动画 ==========
+function triggerFirework(newCount) {
+  const canvas = document.getElementById("fireworkCanvas");
+  if (!canvas) return;
+  const ctx = canvas.getContext("2d");
+
+  canvas.width = window.innerWidth;
+  canvas.height = window.innerHeight;
+
+  const colors = [
+    "#fe2c55",
+    "#ff6b6b",
+    "#ffd93d",
+    "#6bcb77",
+    "#4d96ff",
+    "#a78bfa",
+    "#ff922b",
+    "#20c997",
+    "#f06595",
+    "#ffe066",
+    "#5c7cfa",
+    "#ff8787",
+  ];
+
+  const particles = [];
+  const burstCount = Math.min(newCount, 5) + 2; // 最多 7 朵烟花
+
+  // 创建多朵烟花
+  for (let b = 0; b < burstCount; b++) {
+    const cx = Math.random() * canvas.width * 0.8 + canvas.width * 0.1;
+    const cy = Math.random() * canvas.height * 0.5 + canvas.height * 0.1;
+    const hue = Math.random() * 360;
+    const count = 80 + Math.floor(Math.random() * 60);
+
+    for (let i = 0; i < count; i++) {
+      const angle = (Math.PI * 2 * i) / count + (Math.random() - 0.5) * 0.3;
+      const speed = 2 + Math.random() * 6;
+      const color = colors[Math.floor(Math.random() * colors.length)];
+      particles.push({
+        x: cx,
+        y: cy,
+        vx: Math.cos(angle) * speed,
+        vy: Math.sin(angle) * speed,
+        life: 1,
+        decay: 0.008 + Math.random() * 0.02,
+        size: 1.5 + Math.random() * 2.5,
+        color,
+        gravity: 0.04,
+      });
+    }
+  }
+
+  let animFrame;
+  function animate() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+    let alive = false;
+    for (const p of particles) {
+      p.x += p.vx;
+      p.y += p.vy;
+      p.vy += p.gravity;
+      p.life -= p.decay;
+
+      if (p.life > 0) {
+        alive = true;
+        ctx.save();
+        ctx.globalAlpha = p.life;
+        ctx.fillStyle = p.color;
+        ctx.shadowColor = p.color;
+        ctx.shadowBlur = 6;
+        ctx.beginPath();
+        ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2);
+        ctx.fill();
+        ctx.restore();
+      }
+    }
+
+    if (alive) {
+      animFrame = requestAnimationFrame(animate);
+    } else {
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+    }
+  }
+
+  if (animFrame) cancelAnimationFrame(animFrame);
+  animate();
+
+  // 显示提示文字
+  showFireworkToast(newCount);
+}
+
+function showFireworkToast(count) {
+  let toast = document.getElementById("firework-toast");
+  if (!toast) {
+    toast = document.createElement("div");
+    toast.id = "firework-toast";
+    toast.style.cssText = `
+      position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
+      font-size:48px;font-weight:900;z-index:10000;pointer-events:none;
+      color:#ffd93d;text-shadow:0 0 30px #fe2c55,0 0 60px #fe2c55,0 0 90px #ff6b6b;
+      animation:fireworkToast 2.5s ease-out forwards;
+      white-space:nowrap;
+    `;
+    document.body.appendChild(toast);
+    // 注入动画 keyframes
+    if (!document.getElementById("fw-style")) {
+      const style = document.createElement("style");
+      style.id = "fw-style";
+      style.textContent = `
+        @keyframes fireworkToast {
+          0% { opacity:0; transform:translate(-50%,-50%) scale(0.3); }
+          15% { opacity:1; transform:translate(-50%,-50%) scale(1.2); }
+          25% { opacity:1; transform:translate(-50%,-50%) scale(1); }
+          80% { opacity:1; transform:translate(-50%,-50%) scale(1); }
+          100% { opacity:0; transform:translate(-50%,-60%) scale(1.5); }
+        }
+      `;
+      document.head.appendChild(style);
+    }
+  }
+  toast.textContent = `🎆 +${count} 目标商家！`;
+  toast.style.animation = "none";
+  void toast.offsetWidth;
+  toast.style.animation = "fireworkToast 2.5s ease-out forwards";
+
+  setTimeout(() => {
+    if (toast.parentNode) toast.remove();
+  }, 2600);
+}
+
 // 初始化
 fetchStats();
 fetchUsers();
@@ -2587,7 +3129,8 @@ fetchClientErrors();
 initTableSorting();
 initTargetTableSorting();
 
+// 错峰轮询，避免同时发 4 个请求阻塞服务端
 setInterval(fetchStats, 10000);
-setInterval(fetchUsers, 10000);
-setInterval(fetchClientErrors, 10000);
-setInterval(refreshUserUpdateIfActive, 10000);
+setTimeout(() => setInterval(fetchUsers, 10000), 2500);
+setTimeout(() => setInterval(fetchClientErrors, 10000), 5000);
+setTimeout(() => setInterval(refreshUserUpdateIfActive, 10000), 7500);