目录移出内容区不再遮挡数据；固定成本支持多笔付费叠加 (v1.8.0)

- 「我的站点」页内容区右侧让出专属通道（padding-right 122px），
  目录立在通道内不压任何数据；窄屏隐藏时通道自动收回
- 固定成本改为付费记录数组 fixedPurchases：每笔 {金额, 天数, 购买日期}，
  弹窗内可增删多笔（在现有套餐上加购/续费就追加一笔）
- 成本 = 各笔在窗口内的摊销之和：每笔独立按生效区间计算、到期归零、
  多笔重叠期间叠加；利润明细标注「M/N 笔生效中 / 已全部到期」
- 站点卡片汇总展示：当前日均摊销合计、生效/待生效笔数、最近一笔到期时间
- 历代字段（fixedMonthlyCny / fixedCostCny+fixedDays+fixedStartDate）自动迁移

Author: lettimepassby

lib/providers.js

@@ -640,10 +640,7 @@ export const STATION_TYPES = [
   { value: "fixed", label: "固定成本（包月/包年，不访问）", needs: [] },
 ];
 
-// 固定成本渠道的日均摊销（¥/天）= 每次付费金额 ÷ 覆盖天数；未配置返回 null
-export function dailyFixedCny(station) {
-  const amt = station?.fixedCostCny;
-  const days = station?.fixedDays;
-  if (amt == null || amt <= 0 || days == null || days <= 0) return null;
-  return amt / days;
+// 固定成本付费记录列表；每笔 {amount, days, startDate|null}
+export function fixedPurchases(station) {
+  return Array.isArray(station?.fixedPurchases) ? station.fixedPurchases : [];
 }

lib/store.js

@@ -20,6 +20,22 @@ function numOrNull(v) {
   return Number.isFinite(n) ? n : null;
 }
 
+// 固定成本付费记录：[{amount(¥), days, startDate|null}]，无效行直接丢弃
+function sanitizePurchases(input) {
+  if (!Array.isArray(input)) return null;
+  const out = [];
+  for (const p of input) {
+    const amount = numOrNull(p?.amount);
+    const days = numOrNull(p?.days);
+    if (amount == null || amount <= 0 || days == null || days <= 0) continue;
+    out.push({
+      amount, days,
+      startDate: /^\d{4}-\d{2}-\d{2}$/.test(p?.startDate || "") ? p.startDate : null,
+    });
+  }
+  return out;
+}
+
 export class Store {
   constructor(file) {
     this.file = file;
@@ -47,14 +63,22 @@ export class Store {
     } catch {
       // 文件不存在或损坏：使用默认值并写入
     }
-    // 迁移：v1.5.0 的 fixedMonthlyCny（月费）→ 金额 + 30 天
+    // 迁移：历代固定成本字段（fixedMonthlyCny / fixedCostCny+fixedDays+fixedStartDate）
+    // 统一为付费记录数组 fixedPurchases
     for (const s of this.data.stations) {
-      if (s.fixedMonthlyCny != null && s.fixedCostCny == null) {
-        s.fixedCostCny = s.fixedMonthlyCny;
-        s.fixedDays = 30;
+      if (!Array.isArray(s.fixedPurchases)) {
+        s.fixedPurchases = [];
+        const amount = s.fixedCostCny ?? s.fixedMonthlyCny;
+        if (amount > 0) {
+          s.fixedPurchases.push({
+            amount,
+            days: s.fixedDays > 0 ? s.fixedDays : 30,
+            startDate: /^\d{4}-\d{2}-\d{2}$/.test(s.fixedStartDate || "") ? s.fixedStartDate : null,
+          });
+        }
       }
-      delete s.fixedMonthlyCny;
-      delete s.fixedPeriod;
+      delete s.fixedMonthlyCny; delete s.fixedPeriod;
+      delete s.fixedCostCny; delete s.fixedDays; delete s.fixedStartDate;
     }
     // 初始化面板账号（默认 admin / admin123，登录后请在设置里修改）
     if (!this.data.auth) {
@@ -190,11 +214,8 @@ export class Store {
       cnyPerUsd: numOrNull(input.cnyPerUsd),
       // 我自己的中转站：启用「我的站点」下游用量分析（需管理员令牌）
       isOwn: !!input.isOwn,
-      // 固定成本：每次付费金额（¥）+ 覆盖天数 + 购买日期，日均摊销 = 金额 ÷ 天数，
-      // 只在 [购买日, 购买日+天数] 区间内计成本，到期归零
-      fixedCostCny: numOrNull(input.fixedCostCny),
-      fixedDays: numOrNull(input.fixedDays),
-      fixedStartDate: /^\d{4}-\d{2}-\d{2}$/.test(input.fixedStartDate || "") ? input.fixedStartDate : null,
+      // 固定成本付费记录（可多笔叠加）：每笔按 金额÷天数 在生效区间内摊销
+      fixedPurchases: sanitizePurchases(input.fixedPurchases) || [],
       demo: !!input.demo,
       createdAt: new Date().toISOString(),
       s2Tokens: null, // Sub2API 密码模式的令牌缓存 {accessToken, refreshToken, expiresAt}
@@ -219,11 +240,7 @@ export class Store {
     if ("lowBalanceUsd" in patch) s.lowBalanceUsd = numOrNull(patch.lowBalanceUsd);
     if ("cnyPerUsd" in patch) s.cnyPerUsd = numOrNull(patch.cnyPerUsd);
     if ("isOwn" in patch) s.isOwn = !!patch.isOwn;
-    if ("fixedCostCny" in patch) s.fixedCostCny = numOrNull(patch.fixedCostCny);
-    if ("fixedDays" in patch) s.fixedDays = numOrNull(patch.fixedDays);
-    if ("fixedStartDate" in patch) {
-      s.fixedStartDate = /^\d{4}-\d{2}-\d{2}$/.test(patch.fixedStartDate || "") ? patch.fixedStartDate : null;
-    }
+    if ("fixedPurchases" in patch) s.fixedPurchases = sanitizePurchases(patch.fixedPurchases) || [];
     // 凭证或站点实际变化才作废令牌缓存（前端编辑总会带上 type/email 原值，
     // 无脑作废会导致每次改名都触发一次完整重登录）
     const credsChanged =

package.json

@@ -1,6 +1,6 @@
 {
   "name": "relay-monitor",
-  "version": "1.7.3",
+  "version": "1.8.0",
   "private": true,
   "description": "监控 sub2api / new-api 中转站余额的网页面板",
   "type": "module",

public/app.js

@@ -187,20 +187,30 @@ function sparkSvg(pts) {
 }
 
 function stationRow(s) {
-  // 固定成本渠道：不访问接口，只展示摊销信息
+  // 固定成本渠道：不访问接口，展示当前生效各笔的摊销汇总
   if (s.type === "fixed") {
-    const daily = s.fixedCostCny > 0 && s.fixedDays > 0 ? s.fixedCostCny / s.fixedDays : 0;
-    const pieces = [`<span>日均摊销 ${cny(daily)}</span>`, `<span>每次 ${cny(s.fixedCostCny || 0)} 管 ${s.fixedDays || 0} 天</span>`];
-    let expired = false;
-    if (s.fixedStartDate && s.fixedDays > 0) {
-      const start = new Date(s.fixedStartDate + "T00:00:00");
-      const end = start.getTime() + s.fixedDays * 86400000;
-      const remain = Math.ceil((end - Date.now()) / 86400000);
-      expired = remain <= 0;
-      pieces.push(expired
-        ? `<span class="danger">已于 ${fmtClock(end).split(" ")[0]} 到期，续费请更新日期</span>`
-        : `<span${remain <= 3 ? ' class="warn"' : ""}>${esc(s.fixedStartDate)} 起 · 剩 ${remain} 天</span>`);
+    const ps = Array.isArray(s.fixedPurchases) ? s.fixedPurchases : [];
+    const nowMs = Date.now();
+    let daily = 0, active = 0, pendingStart = 0, nextEnd = null;
+    for (const p of ps) {
+      const d = p.amount > 0 && p.days > 0 ? p.amount / p.days : 0;
+      if (!p.startDate) { daily += d; active++; continue; }
+      const st = Date.parse(p.startDate + "T00:00:00");
+      const end = st + p.days * 86400000;
+      if (st > nowMs) { pendingStart++; continue; }
+      if (end > nowMs) {
+        daily += d; active++;
+        if (nextEnd == null || end < nextEnd) nextEnd = end;
+      }
+    }
+    const expiredAll = ps.length > 0 && active === 0 && pendingStart === 0;
+    const pieces = [`<span>日均摊销 ${cny(daily)}</span>`, `<span>生效 ${active}/${ps.length} 笔</span>`];
+    if (pendingStart) pieces.push(`<span>待生效 ${pendingStart} 笔</span>`);
+    if (nextEnd != null) {
+      const remain = Math.ceil((nextEnd - nowMs) / 86400000);
+      pieces.push(`<span${remain <= 3 ? ' class="warn"' : ""}>最近一笔 ${fmtClock(nextEnd).split(" ")[0]} 到期（剩 ${remain} 天）</span>`);
     }
+    if (expiredAll) pieces.push('<span class="danger">已全部到期，续费请追加付费记录</span>');
     return `
   <div class="st-row" data-id="${s.id}">
     <div class="st-plate">¥</div>
@@ -210,8 +220,8 @@ function stationRow(s) {
       <div class="st-predict">${pieces.join("<span>·</span>")}</div>
     </div>
     <div class="st-balance">
-      <div class="amt${expired ? " danger" : ""}">${cny(expired ? 0 : daily)}</div>
-      <div class="sub">${expired ? "已到期" : "每天"}</div>
+      <div class="amt${expiredAll ? " danger" : ""}">${cny(daily)}</div>
+      <div class="sub">${expiredAll ? "已到期" : "每天"}</div>
     </div>
     <div class="st-actions">
       <button class="icon-btn" data-act="edit" title="编辑"><svg viewBox="0 0 24 24"><path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z"/></svg></button>
@@ -1277,6 +1287,7 @@ function render() {
   $("#pageTitle").textContent = titles[state.view][0];
   $("#pageSub").textContent = titles[state.view][1];
   if (state.view !== "own") document.querySelector(".own-toc")?.remove();
+  $("#content").classList.toggle("has-toc", state.view === "own");
   document.querySelectorAll(".nav-item").forEach((n) => n.classList.toggle("active", n.dataset.view === state.view));
   if (state.view === "dashboard") renderDashboard();
   else if (state.view === "stations") renderStations();
@@ -1305,10 +1316,7 @@ function openModal(station) {
   $("#f-password").value = "";
   $("#f-lowBalance").value = station?.lowBalanceUsd ?? "";
   $("#f-cnyRate").value = station?.cnyPerUsd ?? "";
-  $("#f-fixedCost").value = station?.fixedCostCny ?? "";
-  $("#f-fixedDays").value = station?.fixedDays ?? "";
-  // 新建默认今天；编辑回显已存日期（本地时区的 YYYY-MM-DD）
-  $("#f-fixedStart").value = station ? (station.fixedStartDate || "") : new Date().toLocaleDateString("en-CA");
+  seedPurchaseRows(station?.fixedPurchases);
   $("#f-own").checked = !!station?.isOwn;
   if (station) {
     $("#f-accessToken").placeholder = station.hasAccessToken ? "已配置，留空保持不变" : "令牌 / JWT";
@@ -1349,6 +1357,34 @@ function syncCredFields() {
 }
 $("#f-type").onchange = syncCredFields;
 
+// ---- 固定成本付费记录编辑器 ---------------------------------------------------
+function purchaseRowEl(p = {}) {
+  const row = document.createElement("div");
+  row.className = "purchase-row";
+  row.innerHTML = `
+    <input class="input" data-p="amount" placeholder="金额（¥）" value="${p.amount ?? ""}" />
+    <input class="input" data-p="days" placeholder="天数" value="${p.days ?? ""}" style="width:76px" />
+    <input class="input" type="date" data-p="startDate" value="${p.startDate ?? ""}" style="width:148px" />
+    <button type="button" class="icon-btn" data-p="del" title="删除这笔"><svg viewBox="0 0 24 24"><path d="M18 6L6 18M6 6l12 12"/></svg></button>`;
+  row.querySelector('[data-p="del"]').onclick = () => row.remove();
+  return row;
+}
+function seedPurchaseRows(list) {
+  const box = $("#f-purchases");
+  box.innerHTML = "";
+  const rows = list && list.length ? list : [{ startDate: new Date().toLocaleDateString("en-CA") }];
+  rows.forEach((p) => box.appendChild(purchaseRowEl(p)));
+}
+$("#f-addPurchase").onclick = () =>
+  $("#f-purchases").appendChild(purchaseRowEl({ startDate: new Date().toLocaleDateString("en-CA") }));
+function collectPurchases() {
+  return [...document.querySelectorAll("#f-purchases .purchase-row")].map((r) => ({
+    amount: r.querySelector('[data-p="amount"]').value.trim(),
+    days: r.querySelector('[data-p="days"]').value.trim(),
+    startDate: r.querySelector('[data-p="startDate"]').value,
+  })).filter((p) => p.amount !== "" || p.days !== "");
+}
+
 $("#modalSave").onclick = async () => {
   const payload = {
     name: $("#f-name").value.trim(),
@@ -1358,9 +1394,7 @@ $("#modalSave").onclick = async () => {
     email: $("#f-email").value.trim(),
     lowBalanceUsd: $("#f-lowBalance").value.trim(),
     cnyPerUsd: $("#f-cnyRate").value.trim(),
-    fixedCostCny: $("#f-fixedCost").value.trim(),
-    fixedDays: $("#f-fixedDays").value.trim(),
-    fixedStartDate: $("#f-fixedStart").value,
+    fixedPurchases: collectPurchases(),
     isOwn: $("#f-type").value === "newapi" && $("#f-own").checked,
   };
   const at = $("#f-accessToken").value.trim();
@@ -1370,8 +1404,9 @@ $("#modalSave").onclick = async () => {
   if (ak) payload.apiKey = ak;
   if (pw) payload.password = pw;
   if (payload.type === "fixed") {
-    if (!(Number(payload.fixedCostCny) > 0)) return toast("请填写每次付费金额", "err");
-    if (!(Number(payload.fixedDays) > 0)) return toast("请填写覆盖天数", "err");
+    const bad = payload.fixedPurchases.find((p) => !(Number(p.amount) > 0) || !(Number(p.days) > 0));
+    if (bad) return toast("每笔付费需填写金额与天数（均大于 0）", "err");
+    if (!payload.fixedPurchases.length) return toast("请至少填写一笔付费记录", "err");
   } else if (!payload.baseUrl) {
     return toast("请填写站点地址", "err");
   }

public/index.html

@@ -154,15 +154,12 @@ <h2 id="modalTitle">添加中转站</h2>
           <div class="hint">面板金额将按此汇率折算成人民币展示；余额告警仍按站点余额判断。</div>
         </div>
         <div class="form-field" id="f-fixedWrap">
-          <label>固定成本（每次付费金额 + 覆盖天数 + 购买日期）</label>
-          <div class="field-inline">
-            <input class="input" id="f-fixedCost" placeholder="每次付多少（¥）" style="flex:1" />
-            <input class="input" id="f-fixedDays" placeholder="管多少天" style="width:96px" />
-            <input class="input" type="date" id="f-fixedStart" style="width:150px" />
-          </div>
-          <div class="hint">日均成本 = 金额 ÷ 天数，从购买日起摊销，到期后不再计成本（续费改日期即可）。
-            不访问任何接口；站点地址可留空。填上游地址可与「我的站点」渠道自动匹配——
-            只填主机（如 1.2.3.4，不带端口）可匹配该主机所有端口的渠道。</div>
+          <label>固定成本付费记录（可叠加多笔）</label>
+          <div id="f-purchases"></div>
+          <button type="button" class="btn btn-ghost" id="f-addPurchase" style="margin-top:2px">＋ 追加一笔</button>
+          <div class="hint">每笔 = 金额 ÷ 天数 按天摊销，从购买日起生效、到期归零；多笔重叠期间成本叠加
+            （在现有套餐上加购/续费就追加一笔）。不访问任何接口；站点地址可留空，
+            填主机（不带端口）可匹配该主机所有端口的渠道。</div>
         </div>
         <div class="form-field" id="f-own-wrap">
           <label class="chk-line"><input type="checkbox" id="f-own" /> 这是我自己的中转站</label>

public/styles.css

@@ -89,21 +89,25 @@ button { font-family: inherit; cursor: pointer; }
 
 .main { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; position: relative; }
 
-/* 我的站点页右侧悬浮目录 */
+/* 我的站点页右侧目录：内容区让出右侧通道，目录不遮挡数据 */
+.content.has-toc { padding-right: 122px; }
 .own-toc {
-  position: absolute; right: 12px; top: 116px; z-index: 12;
+  position: absolute; right: 12px; top: 116px; z-index: 12; width: 98px;
   display: flex; flex-direction: column; gap: 2px; padding: 6px;
-  background: color-mix(in srgb, var(--bg-surface) 86%, transparent);
-  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
+  background: var(--bg-surface);
   border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow-card);
 }
 .own-toc a {
   font-size: 11.5px; color: var(--text-tertiary); padding: 4px 10px;
   border-radius: 6px; cursor: pointer; white-space: nowrap;
+  overflow: hidden; text-overflow: ellipsis;
 }
 .own-toc a:hover { background: var(--bg-hover); color: var(--text-primary); }
 .own-toc a.active { background: var(--bg-selected); color: var(--primary); font-weight: 500; }
-@media (max-width: 1080px) { .own-toc { display: none; } }
+@media (max-width: 1080px) {
+  .own-toc { display: none; }
+  .content.has-toc { padding-right: var(--content-padding); }
+}
 .page-header {
   padding: 18px var(--content-padding) 0; display: flex; align-items: flex-start;
   justify-content: space-between; gap: 12px; flex-shrink: 0;
@@ -335,6 +339,12 @@ button { font-family: inherit; cursor: pointer; }
 .u-table td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
 .u-table td.u-empty { text-align: center; color: var(--text-tertiary); padding: 28px; }
 
+/* ---- 固定成本付费记录编辑器 ---- */
+.purchase-row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
+.purchase-row .input { height: 32px; }
+.purchase-row [data-p="amount"] { flex: 1; }
+.purchase-row .icon-btn { flex-shrink: 0; }
+
 /* ---- 我的站点：预测图与勾选框 ---- */
 .chk-line { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-primary); cursor: pointer; }
 .chk-line input { width: 15px; height: 15px; accent-color: var(--primary); }

server.js

@@ -6,7 +6,7 @@ import { readFile } from "node:fs/promises";
 import { Store } from "./lib/store.js";
 import {
   queryStation, queryStationUsage, queryOwnData, queryOwnChannels, queryOwnUsers,
-  dateStrInTz, parseDateLabel, dailyFixedCny, STATION_TYPES,
+  dateStrInTz, parseDateLabel, fixedPurchases, STATION_TYPES,
 } from "./lib/providers.js";
 import { forecastDaily } from "./lib/forecast.js";
 import { SessionManager, verifyPassword } from "./lib/auth.js";
@@ -649,32 +649,43 @@ async function computeProfit(own, incomeUsd, adminUsageUsd, { startMs, now, tz,
     const rateOf = (s) => (s.cnyPerUsd != null && s.cnyPerUsd > 0 ? s.cnyPerUsd : 1);
 
     // 固定成本：无论是否匹配到渠道都计入（服务器租金这类可以完全不填地址）。
-    // 配置了购买日期的，只对 [购买日, 购买日+天数] 与展示窗口的重叠部分摊销，到期归零
+    // 每笔付费按 [购买日, 购买日+天数] 与展示窗口的重叠部分摊销，多笔叠加求和；
+    // 没填日期的按全窗口摊销（自动续费的常驻成本）
     const costs = [];
     for (const s of upstreams) {
-      const df = dailyFixedCny(s);
-      if (df == null) continue;
-      let activeDays = windowDays;
-      let note = null;
-      if (s.fixedStartDate) {
-        const st = parseDateLabel(s.fixedStartDate, tz);
-        if (st != null) {
-          const end = st + s.fixedDays * 86400000;
-          activeDays = Math.max(0, Math.min(now, end) - Math.max(startMs, st)) / 86400000;
-          if (end <= now) note = "已到期";
-          else if (st > startMs) note = `${s.fixedStartDate} 起`;
+      const purchases = fixedPurchases(s);
+      if (!purchases.length) continue;
+      let cnySum = 0, active = 0, expired = 0;
+      for (const p of purchases) {
+        const daily = p.amount / p.days;
+        const st = p.startDate ? parseDateLabel(p.startDate, tz) : null;
+        if (st == null) {
+          cnySum += daily * windowDays;
+          active++;
+          continue;
         }
+        const end = st + p.days * 86400000;
+        cnySum += daily * (Math.max(0, Math.min(now, end) - Math.max(startMs, st)) / 86400000);
+        if (end <= now) expired++;
+        else if (st <= now) active++;
+      }
+      let note = null;
+      if (expired === purchases.length) note = purchases.length > 1 ? "已全部到期" : "已到期";
+      else if (purchases.length > 1) note = `${active}/${purchases.length} 笔生效中`;
+      else if (purchases[0].startDate) {
+        const st0 = parseDateLabel(purchases[0].startDate, tz);
+        if (st0 != null && st0 > startMs) note = `${purchases[0].startDate} 起`;
       }
       costs.push({
         stationId: s.id, name: s.name, mode: "fixed", note,
         channels: matched.get(s.id)?.channels || ["未匹配渠道 · 通用成本"],
-        cny: r2(df * activeDays),
+        cny: r2(cnySum),
       });
     }
     // 按用量：匹配到渠道且未配置固定成本的上游
     const usageCosts = await Promise.all(
       [...matched.values()]
-        .filter(({ station }) => dailyFixedCny(station) == null && station.type !== "fixed")
+        .filter(({ station }) => fixedPurchases(station).length === 0 && station.type !== "fixed")
         .map(async ({ station, channels: chNames }) => {
           const item = { stationId: station.id, name: station.name, channels: chNames };
           try {