feat(web): show cumulative fan range and limit recent records

reaction_board/web/static/views/fans.js

@@ -2,7 +2,7 @@ import { api } from "../api.js";
 import { centerActiveChips, emptyState, sectionHeader } from "../components.js";
 import { lineChart, themeColor } from "../charts.js";
 import {
-  escapeAttr, escapeHtml, formatCount, formatDate, formatDelta,
+  escapeHtml, formatCount, formatDelta, formatNumber,
 } from "../format.js";
 import { replaceQuery } from "../router.js";
 
@@ -36,8 +36,7 @@ export async function renderFans(root, { query }) {
       <div class="mini-stats">
         <div><span>日增</span><strong class="${Number(fans.delta_1d) >= 0 ? "up" : "down"}">${fans.delta_1d === null ? "—" : formatDelta(fans.delta_1d)}</strong></div>
         <div><span>7 日净增</span><strong class="${Number(fans.delta_7d) >= 0 ? "up" : "down"}">${fans.delta_7d === null ? "—" : formatDelta(fans.delta_7d)}</strong></div>
-        <div><span>累计增长</span><strong class="${Number(fans.delta_cum) >= 0 ? "up" : "down"}">${formatDelta(fans.delta_cum)}</strong></div>
-        <div><span>关注数</span><strong>${formatCount(fans.following)}</strong></div>
+        <div><span>累计增长（${escapeHtml(fans.first_date || "—")} 以来）</span><strong class="${Number(fans.delta_cum) >= 0 ? "up" : "down"}">${formatDelta(fans.delta_cum)}</strong></div>
       </div>
 
       <section class="panel chart-panel">
@@ -52,15 +51,15 @@ export async function renderFans(root, { query }) {
 
       <section class="panel">
         ${sectionHeader("最近记录")}
+        <p class="section-note">默认展示最近 ${fans.recent_days || 14} 天；更早的数据只在曲线中显示。</p>
         <div class="table-wrap">
           <table class="data-table">
-            <thead><tr><th>日期</th><th>粉丝</th><th>关注</th><th>状态</th></tr></thead>
+            <thead><tr><th>日期</th><th>粉丝</th><th>状态</th></tr></thead>
             <tbody>
-              ${(fans.points || []).slice().reverse().map((point) => `
+              ${(fans.recent_points || []).slice().reverse().map((point) => `
                 <tr class="${point.ok ? "" : "failed-row"}">
                   <td>${escapeHtml(point.stat_date)}</td>
-                  <td>${point.ok ? formatCount(point.follower) : "—"}</td>
-                  <td>${point.ok ? formatCount(point.following) : "—"}</td>
+                  <td>${point.ok ? formatNumber(point.follower) : "—"}</td>
                   <td>${point.ok ? "成功" : "失败"}</td>
                 </tr>`).join("")}
             </tbody>