@ds-hu/dsh-token-quota 2.4.1 → 2.6.0

package/lib/client.js

@@ -2,7 +2,7 @@
 // 展示控制器统一请求与会话订阅；面板草稿独立于展示缓存与本地偏好。
 (function () {
   window.__ModuleLoader__.load({
-    id: "dsh-token-quota",
+    id: "@ds-hu/dsh-token-quota",
     factory: (require) => {
       var module = { exports: {} };
       var exports = module.exports;
@@ -98,7 +98,17 @@
           tone: supplier.state === "err" || supplier.enabled === false || status === "unknown" ? "neutral" : status,
           warning: supplier.state !== "err" && supplier.enabled !== false && ["warn", "crit"].includes(status) ? tr(status === "crit" ? "stateCrit" : "stateWarn") : null };
       };
-      const selectPrimaryMetric = (supplier, tr = (key) => key) => {
+      /** 仅计量供应商：只有本地 token，没有任何可查询的额度。 */
+      const isMeteredSupplier = (supplier) => supplier?.queryable === false;
+      /** 仅计量行「近 N 天」的合计：与图表同一份 usageDays，不另算口径。 */
+      const weekTokensOf = (supplier) => (Array.isArray(supplier?.usageDays)
+        ? supplier.usageDays.reduce((sum, day) => sum + (Number(day?.total) || 0), 0) : 0);
+      const selectPrimaryMetric = (supplier, tr = (key) => key, windowDays = 7) => {
+        // 仅计量行没有指标可选：主指标就是它自己的量。今日在行尾另给一次是既有版式。
+        if (isMeteredSupplier(supplier)) {
+          const text = tr("windowTokens", { d: windowDays, n: fmtBig(weekTokensOf(supplier)) });
+          return { kind: "usage", value: text, label: "", name: "", reset: null, tone: "neutral", more: 0, text };
+        }
         const entries = supplier?.entries || [];
         const entry = tightestOf(entries) || entries.find(e => e.kind === "bal") || entries.find(e => e.kind === "cost") || entries[0];
         if (!entry) return { kind: "unknown", value: "—", label: "", name: "", reset: null, tone: "neutral", more: 0, text: "—" };
@@ -134,10 +144,12 @@
           columns: [{ key: "name", labelKey: "colMetric" }, ...METRIC_COLUMNS[kind]], rows,
         }));
       };
-      const supplierStatus = (s, tr) => s?.state === "err"
+      const supplierStatus = (s, tr) => isMeteredSupplier(s) ? tr("meteredOnly") : s?.state === "err"
         ? tr(s.entries?.length ? "staleFailure" : "unavailable")
         : s?.enabled === false ? tr("disabled") : !s?.entries?.length ? tr("notQueried") : tr(stateToken(s));
-      const todayTotal = (state) => (state?.suppliers || []).filter(s => s.current)
+      // 今日总量 = 列表里各行的和（口径可对账）：只要这一行有 token，它就在列表里、也在总量里。
+      // 旧口径只加 current 行，于是「未配置但在跑」的供应商 token 会既看不见也不算数。
+      const todayTotal = (state) => (state?.suppliers || []).filter(s => s.added !== false)
         .reduce((sum, s) => sum + (typeof s.todayTokens === "number" ? s.todayTokens : 0), 0);
 
       // ---------- 今日 Token 分布（数据来自宿主 todayUsage / usageDays，五分量互不相交） ----------
@@ -716,6 +728,8 @@
         enabled: !!sup.enabled, baseUrl: sup.baseUrl || sup.baseUrlDefault || "",
         warnPct: sup.warnPct ?? 80, critPct: sup.critPct ?? 95,
         apiKeyEnv: sup.apiKeyEnv || "",
+        // 仅计量行只有一个可改的东西：显示名（存进 config.meteredNames[route]）。
+        ...(isMeteredSupplier(sup) ? { name: sup.name || "" } : {}),
         // 关注限额：有序数组；空数组 = 未配置（卡片走默认规则）。草稿复制一份，避免直接改 state。
         displayKeys: Array.isArray(sup.displayKeys) ? [...sup.displayKeys] : [],
         ...Object.fromEntries((sup.meta?.needs || []).map((need) => [need.key, need.secret ? "" : (sup[need.key] ?? "")])),
@@ -751,9 +765,15 @@
         const compact = narrow || preference === "compact";
         const active = state?.active;
         const supplier = active && state?.suppliers?.find(s => s.id === active.supplierId);
-        const metric = selectPrimaryMetric(supplier, t);
+        // 「近 N 天」的 N 来自保留期（retentionDays < 7 时窗口确实更短），不是写死的 7。
+        const windowDays = state?.poll?.usageHistoryDays || 7;
+        const metric = selectPrimaryMetric(supplier, t, windowDays);
         const name = active?.name || t("noneActive");
         const todayCount = typeof supplier?.todayTokens === "number" ? supplier.todayTokens : 0;
+        // 仅计量行没有条也没有百分比：第 2 行直接给这个窗口里它自己的量（今日 chip 已在第 1 行）。
+        const metricText = isMeteredSupplier(supplier)
+          ? t("windowTokens", { d: windowDays, n: fmtBig(weekTokensOf(supplier)) })
+          : metric.text;
         const bars = selectBarMetrics(supplier, t);
         const resetText = bars.length ? bars.map(bar => bar.reset).filter(Boolean).join(" · ") : metric.reset;
         const failure = loadError ? t(state ? "staleFailure" : "unavailable") : supplier?.state === "err" ? supplierStatus(supplier, t) : "";
@@ -766,7 +786,7 @@
             seasonUsesBeijingNote() ? t("seasonBeijingOnly") : null].filter(Boolean).join(" · ")
           : "";
         // 卡片上的可见文字只留数据；完整状态（今日口径、连接、峰谷成因）进 aria/title。
-        const title = [name, metric.text, resetText, seasonTitle, failure, t("todayScope"), t("today", { n: state ? fmtBig(todayTotal(state)) : "—" }), connText].filter(Boolean).join(" · ");
+        const title = [name, metricText, resetText, seasonTitle, failure, t("todayScope"), t("today", { n: state ? fmtBig(todayTotal(state)) : "—" }), connText].filter(Boolean).join(" · ");
         return h(React.Fragment, null,
           !wide ? h("button", { type: "button", ref: entryRef, "data-qm-entry": "", className: "qm-rail", "aria-label": t("title"), "aria-haspopup": "dialog", "aria-expanded": !!panel.host, title, onClick: activateEntry }, "◉") :
           h("div", { "data-qm-linerow": "", "data-qm-density": compact ? "compact" : "expanded", ref: widthRef, className: "qm-footer" },
@@ -791,7 +811,7 @@
                     h("i", { className: `qm-bar-fill ${bar.tone}`, style: { width: `${Math.max(0, Math.min(100, bar.entry.pct))}%` } })),
                   h("span", { key: `p${i}`, className: "qm-bar-pct" }, pctText(bar.entry.pct)),
                   bar.reset ? h("span", { key: `r${i}`, className: "qm-bar-reset" }, bar.reset) : null,
-                ])) : h("div", { className: "qm-l2" }, h("span", { className: "qm-primary", title: metric.text }, metric.text)),
+                ])) : h("div", { className: "qm-l2" }, h("span", { className: "qm-primary", title: metricText }, metricText)),
                 season ? h("div", { className: `qm-season ${season.peak ? "peak" : "valley"}`, "data-qm-season": season.tier, title: seasonTitle },
                   h("span", { className: `qm-season-dot ${season.peak ? "peak" : "valley"}` }),
                   h("b", null, seasonTierOf(season, t)),
@@ -825,9 +845,10 @@
         const { state, loadError, refresh, refreshing, sessionKey } = useQuotaState();
         const snap = useSurface();
         const [expandedId, setExpandedId] = React.useState(null);
-        // 没有本地用量行的供应商不画图，也就不必为它取额度历史。
+        // 没有本地用量行的供应商不画图，也就不必为它取额度历史；仅计量行从不查询，同样不必取。
         const expandedSupplier = (state?.suppliers || []).find((sup) => sup.id === expandedId);
-        const quota = useQuotaHistory(sessionKey, Array.isArray(expandedSupplier?.usageDays) && expandedSupplier.usageDays.length > 0);
+        const quota = useQuotaHistory(sessionKey, expandedSupplier?.queryable !== false
+          && Array.isArray(expandedSupplier?.usageDays) && expandedSupplier.usageDays.length > 0);
         const dialog = host === "dialog";
         // Escape / 外部点击必须走 controller 的未保存确认；useDialog 只拿到这个稳定转发器。
         const closeRef = React.useRef(() => {});
@@ -1039,7 +1060,8 @@
           const sup = (state?.suppliers || []).find((s) => s.id === supplierId);
           if (!sup) return;
           const warn = Number(form.warnPct), crit = Number(form.critPct);
-          if (!Number.isFinite(warn) || !Number.isFinite(crit) || warn < 1 || warn >= crit || crit > 100) {
+          if (!isMeteredSupplier(sup)
+            && (!Number.isFinite(warn) || !Number.isFinite(crit) || warn < 1 || warn >= crit || crit > 100)) {
             setSaveError(t("invalidThreshold")); setAdvanced(true);
             requestAnimationFrame(() => advancedRef.current?.querySelector('input[type="number"]')?.focus()); return;
           }
@@ -1051,8 +1073,10 @@
           opBusyRef.current = true;
           setOpBusy(true);
           try {
-            const p = supplierPatch(sup, form);
-            await post(`${API}/settings`, { suppliers: { [supplierId]: p } });
+            // 仅计量行不改任何查询参数：只有名字，写进 config.meteredNames[route]。
+            await post(`${API}/settings`, isMeteredSupplier(sup)
+              ? { meteredNames: { [sup.route]: String(form.name || "").trim() } }
+              : { suppliers: { [supplierId]: supplierPatch(sup, form) } });
             await reload();
             outcome = { ok: true };
             if (!latest()) return;
@@ -1164,21 +1188,34 @@
           shown.length
             ? h("div", { className: "qm-rows" }, shown.map(sup => h(SupplierRow, {
               key: sup.id, sup, t, season: state.season, quota: quotaOf(sup.id),
+              windowDays: state.poll?.usageHistoryDays || 7,
               expanded: expandedId === sup.id, onToggle: () => onExpand(expandedId === sup.id ? null : sup.id), onEdit })))
             : h(Empty, { text: t(filter === "attention" ? "noAttention" : "overviewEmpty"), action: filter === "all" ? t("manageSuppliers") : null, onAction: onManage }),
           h(HistoryTable, { rows: (state.history || []).slice(0, 50), t }));
       }
 
-      function SupplierRow({ sup, t, season, quota, expanded, onToggle, onEdit }) {
-        const metric = selectPrimaryMetric(sup, t);
+      function SupplierRow({ sup, t, season, quota, windowDays, expanded, onToggle, onEdit }) {
+        const metric = selectPrimaryMetric(sup, t, windowDays);
         const todayNumber = typeof sup.todayTokens === "number" ? sup.todayTokens : 0;
         const error = String(sup.error?.message || sup.error?.code || "");
         const detailId = `qm-detail-${sup.id}`;
+        // 今日行与五分量分布条共用一份口径：切到「近 7 天」时两处一起换，图表固定 7 天不跟着变。
+        // 估算口径（剩余/总量）只影响读数本身，不重新取数。
+        const [range, setRange] = React.useState("today");
+        const [estMode, setEstMode] = React.useState("left");
+        const days = Array.isArray(sup.usageDays) ? sup.usageDays : [];
+        const week = range === "7d";
+        const scopedUsage = week ? sumUsageOf(days) : sup.todayUsage;
+        const scopedTokens = week
+          ? days.reduce((sum, day) => sum + (Number(day?.total) || 0), 0)
+          : todayNumber;
         return h("article", { className: `qm-row${expanded ? " open" : ""}`, "data-supplier": sup.id },
           h("button", { type: "button", className: "qm-row-head", "data-qm-row": "", "aria-expanded": expanded, "aria-controls": detailId, onClick: onToggle },
             h("span", { className: `qm-dot ${stateClass(sup)}` }),
             h("b", { className: "qm-row-name" }, sup.name),
-            sup.current ? h("span", { className: "qm-cur" }, t("current")) : null,
+            // 「当前」= 在用/计入今日总量的那个；仅计量行恒计入总量，但不是一个「当前供应商」，
+            // 给它打这个标会让每一行都读作当前，所以只对注册表行显示。
+            sup.current && !isMeteredSupplier(sup) ? h("span", { className: "qm-cur" }, t("current")) : null,
             h("span", { className: `qm-pill ${stateClass(sup)}` }, supplierStatus(sup, t)),
             h("span", { className: "qm-row-metric" }, metric.value),
             h("span", { className: "qm-row-today" }, `${t("todayLabel")} ${fmtBig(todayNumber)}`),
@@ -1186,12 +1223,16 @@
           expanded ? h("div", { id: detailId, className: "qm-row-detail", role: "region", "aria-label": `${sup.name} ${t("detailTitle")}` },
             sup.state === "err" ? h("div", { className: "ci-err", role: "status" }, supplierStatus(sup, t), error ? `：${error.slice(0, 180)}` : "",
               error.length > 180 ? h("details", null, h("summary", null, t("errorDetails")), h("p", null, error)) : null) : null,
+            // 仅计量行不查询，所以没有「最后成功」也可能没有指标表——空白不是失败态，是这类行的常态。
             sup.lastSuccessAt ? h("div", { className: "qm-data-time" }, `${t("lastSuccess")} ${new Date(sup.lastSuccessAt).toLocaleString()}`) : null,
-            h(MetricTable, { supplier: sup, t }),
-            h(TodayLine, { sup, t }),
-            h(UsageSplit, { usage: sup.todayUsage, t }),
+            isMeteredSupplier(sup) ? null : h(MetricTable, { supplier: sup, t }),
+            h(TodayLine, {
+              sup, t, tokens: scopedTokens, usage: scopedUsage,
+              range, onRange: setRange, mode: estMode, onMode: setEstMode, windowDays,
+            }),
+            h(UsageSplit, { usage: scopedUsage, t }),
             h(SeasonBlock, { season, split: sup.seasonSplit, t }),
-            h("div", { className: "qm-row-actions" }, h("button", { type: "button", onClick: () => onEdit(sup.id) }, t("openPage"))),
+            h("div", { className: "qm-row-actions" }, h("button", { type: "button", onClick: () => onEdit(sup.id) }, t(isMeteredSupplier(sup) ? "rename" : "openPage"))),
             Array.isArray(sup.usageDays) && sup.usageDays.length
               ? h(UsageChart, { sup, days: sup.usageDays, quota, windowTotal: sup.usageDays.reduce((sum, day) => sum + (Number(day?.total) || 0), 0), t })
               : null) : null);
@@ -1210,14 +1251,77 @@
                   h("td", { key: column.key, className: column.key === "used" ? `qm-tone ${row.tone}` : column.key === "value" ? "qm-num" : "" }, row[column.key] ?? "—"))))))));
       }
 
-      function TodayLine({ sup, t }) {
-        const total = fmtBig(typeof sup.todayTokens === "number" ? sup.todayTokens : 0);
-        const ratio = usageRatioOf(sup.todayUsage);
+      /**
+       * 今日行：区间选择器 + 数量 + 归一比例 + 窗口估算。
+       * 「Today」两个字换成选择器后，同一行读作「哪个区间、多少 token、什么比例、各窗口还能用多少」。
+       */
+      function TodayLine({ sup, t, tokens, usage, range, onRange, mode, onMode, windowDays = 7 }) {
+        const total = fmtBig(tokens || 0);
+        const ratio = usageRatioOf(usage);
         const detailText = ratio ? t("ratioAria", { hit: fmtBig(ratio.hitValue), miss: fmtBig(ratio.missValue), out: fmtBig(ratio.outValue) }) : "";
+        // 区间已经由左边的选择器说清楚了，这里不再重复「Today / 近 7 天」，只留数量。
+        const text = `${total} tokens`;
         return h("div", { className: "qm-today-line" },
-          h("span", { className: "qm-today-text" }, t("today", { n: total })),
+          h("span", { className: "qm-range" },
+            h("select", {
+              value: range, "aria-label": t("rangeLabel"),
+              onChange: (ev) => onRange(ev.target.value === "7d" ? "7d" : "today"),
+            },
+              h("option", { value: "today" }, t("todayLabel")),
+              h("option", { value: "7d" }, t("statsWindow", { n: windowDays })))),
+          h("span", { className: "qm-today-text" }, text),
           ratio ? h("span", { className: "qm-ratio", title: detailText },
-            h("b", { className: "r-hit" }, ratio.hit), " : ", h("b", { className: "r-miss" }, ratio.miss), " : ", h("b", { className: "r-out" }, ratio.out)) : null);
+            h("b", { className: "r-hit" }, ratio.hit), " : ", h("b", { className: "r-miss" }, ratio.miss), " : ", h("b", { className: "r-out" }, ratio.out)) : null,
+          h(EstimateGroup, { sup, t, mode, onMode }));
+      }
+
+      /**
+       * 窗口估算：同一段折线里「本地 token ÷ Δpp」得到每 1 个百分点值多少 token，
+       * 再按当前电平换算成剩余（Left）或窗口总量（Total）。
+       * 分母是 Δpp 而不是已用% —— 窗口比本地留存长时，分子只覆盖最近几天，
+       * 除以累计百分比会把总量算成一半（3B 降 50pp 应得 6B，不是 3B ÷ 90%）。
+       * title 里给出取样区间、分子分母与 ±1pp 的区间，好让人对着图核账。
+       */
+      function EstimateGroup({ sup, t, mode, onMode }) {
+        const entries = (Array.isArray(sup.entries) ? sup.entries : [])
+          .filter((entry) => entry && entry.kind === "win" && Number.isFinite(Number(entry.pct)));
+        if (!entries.length) return null;
+        const kind = mode === "left" ? t("estLeft") : t("estTotal");
+        const chips = [];
+        let estimable = 0;
+        for (const entry of entries) {
+          const label = entry.short || entry.name || entry.key;
+          const pct = Math.min(100, Math.max(0, Number(entry.pct)));
+          const est = entry.estimate;
+          const tokens = Number(est?.tokens);
+          const dPct = Number(est?.dPct);
+          // 不到两个百分点（整数上报）就是噪声，宁可给「—」
+          if (!(tokens > 0) || !(dPct >= 2)) {
+            chips.push(h("span", { key: entry.key, className: "qm-est-q is-off", title: t("estNoData") }, `${label} —`));
+            continue;
+          }
+          estimable++;
+          // 剩余看还占多少个百分点，总量看满 100 个百分点
+          const level = mode === "left" ? Math.max(0, 100 - pct) : 100;
+          const at = (delta) => (tokens / delta) * level;
+          const main = at(dPct);
+          const spanMs = Math.max(0, Number(est.to) - Number(est.from));
+          const span = spanMs >= 48 * 3600_000
+            ? `${Math.round(spanMs / 86400_000)}d`
+            : `${Math.max(1, Math.round(spanMs / 3600_000))}h`;
+          const title = `${label} ${kind} ≈${fmtBig(Math.round(main))}\n`
+            + `${span}: ${fmtBig(tokens)} ÷ Δ${dPct}pp\n`
+            + `Δ${dPct}pp ±1pp → ${fmtBig(Math.round(at(dPct + 1)))}–${fmtBig(Math.round(at(dPct - 1)))}`;
+          chips.push(h("span", { key: entry.key, className: "qm-est-q", title },
+            `${label} `, h("b", null, `≈${fmtBig(Math.round(main))}`)));
+        }
+        // 一个窗口都算不出来时整组不出现：不拿一排「—」占掉今日行
+        if (!estimable) return null;
+        return h("span", { className: "qm-est" },
+          h("span", { className: "qm-est-seg", role: "group" },
+            h("button", { type: "button", "aria-pressed": mode === "left", onClick: () => onMode("left") }, t("estLeft")),
+            h("button", { type: "button", "aria-pressed": mode === "total", onClick: () => onMode("total") }, t("estTotal"))),
+          chips);
       }
 
       /** 五分量分布：条与图例一一对应；今日比例只取前三项，写缓存与未细分在这里出现。 */
@@ -1276,7 +1380,7 @@
               h("span", { className: "chip" }, t("connectedChip", { n: added.length })),
               h("button", { type: "button", className: `qm-rescan-btn${ctl.scanBusy ? " busy" : ""}`, disabled: ctl.scanBusy, onClick: ctl.runRescan }, `⟳ ${t("rescan")}`))),
           h("div", { className: "qm-scanline" }, scanLine()),
-          added.length ? orderedRows(added, t, ctl) : h(Empty, { text: t("emptyAdded"), action: t("rescan"), onAction: ctl.runRescan }),
+          added.length ? orderedRows(added, t, ctl, state.poll?.usageHistoryDays || 7) : h(Empty, { text: t("emptyAdded"), action: t("rescan"), onAction: ctl.runRescan }),
           addable.length ? h("details", { className: "qm-addable", open: addableOpen, onToggle: (e) => setAddableOpen(e.currentTarget.open) },
             h("summary", null, h("span", null, t("addableTitle")), h("span", { className: "cnt" }, addable.length)),
             h("div", { className: "addable-list" }, addable.map((a) => h("div", { key: a.id, className: `qm-add-row${ctl.freshIds.includes(a.id) ? " fresh" : ""}` },
@@ -1304,20 +1408,24 @@
               h("option", { value: "expanded" }, t("expanded")), h("option", { value: "compact" }, t("compact")))));
       }
 
-      function orderedRows(added, t, ctl) {
-        return h("div", { className: "qm-page-list" }, added.map((sup) =>
-          h("div", { key: sup.id, "data-supplier": sup.id, className: "qm-page-row" },
+      function orderedRows(added, t, ctl, days = 7) {
+        return h("div", { className: "qm-page-list" }, added.map((sup) => {
+          const metered = isMeteredSupplier(sup);
+          return h("div", { key: sup.id, "data-supplier": sup.id, className: "qm-page-row" },
             h("div", { className: "qm-page-main" },
               h("span", { className: `qm-dot ${stateClass(sup)}` }),
-              h("span", { className: "qm-page-name", title: sup.meta?.compat ? t("compatSource") : undefined }, sup.name),
-              h("span", { className: "qm-row-metric" }, selectPrimaryMetric(sup, t).value),
+              h("span", { className: "qm-page-name", title: sup.meta?.compat ? t("compatSource") : metered ? sup.route : undefined }, sup.name),
+              h("span", { className: "qm-row-metric" }, selectPrimaryMetric(sup, t, days).value),
               h("span", { className: `qm-pill ${stateClass(sup)}` }, supplierStatus(sup, t)),
-              h("span", { className: "qm-page-pill" }, t(sup.meta?.credentialLabelKey || "apiKey"))),
+              // 仅计量行没有凭据类别可标：它的凭据就是宿主自己的路由，插件不持有任何密钥。
+              metered ? null : h("span", { className: "qm-page-pill" }, t(sup.meta?.credentialLabelKey || "apiKey"))),
             h("div", { className: "qm-page-actions" },
-              h("label", { className: "qm-page-toggle" },
+              // 没有可启用/停用的东西：行是流量的产物，不是一个可以关掉的采集器。
+              metered ? null : h("label", { className: "qm-page-toggle" },
                 h("input", { type: "checkbox", checked: !!sup.enabled, disabled: !!ctl.toggling[sup.id] || [...settingsWrites].some(operation => operation.supplierId === sup.id), onChange: () => ctl.toggleEnabled(sup) }),
                 h("span", null, t("enable"))),
-              h("button", { type: "button", className: "s-test qm-pri-soft", onClick: () => ctl.openSupplier(sup.id) }, t("openPage"))))));
+              h("button", { type: "button", className: "s-test qm-pri-soft", onClick: () => ctl.openSupplier(sup.id) }, t(metered ? "rename" : "openPage"))));
+        }));
       }
 
       // ---------- 供应商配置子页 ----------
@@ -1345,6 +1453,23 @@
         const editor = ctl.editor;
         if (!sup || !editor) return h("div", { className: "qm-sub", role: "status" }, t("loading"));
         const f = editor.form;
+        // 仅计量子页：没有凭据、没有阈值、没有关注限额——只有名字与它挂在哪条路由上。
+        if (isMeteredSupplier(sup)) {
+          return h(React.Fragment, null,
+            h("div", { className: "qm-page-head" },
+              h("button", { type: "button", className: "s-test", onClick: ctl.closeEditor }, `← ${t("back")}`),
+              h("b", null, sup.name),
+              h("span", { className: "qm-pill" }, t("meteredOnly"))),
+            h("div", { className: "s-group" },
+              h("label", null, h("span", null, t("meteredName")),
+                h("input", { type: "text", value: f.name || "", maxLength: 60, placeholder: sup.route, disabled: ctl.opBusy,
+                  onChange: (e) => ctl.setEditorField("name", e.target.value) })),
+              h("p", { className: "qm-empty-line" }, `${t("meteredRoute")} · ${sup.route}`)),
+            h("div", { className: "s-actions" },
+              ctl.saved === sup.id ? h("span", { className: "s-saved" }, t("saved")) : null,
+              h("button", { type: "button", onClick: ctl.closeEditor, disabled: ctl.opBusy }, t("cancel")),
+              h("button", { type: "button", className: "qm-pri", onClick: ctl.saveSupplier, disabled: ctl.opBusy }, t("save"))));
+        }
         const needsInputs = (sup.meta?.needs || []).map((need) =>
           h("label", { key: need.key }, needsLabel(sup, need, t),
             h("input", {
@@ -1635,7 +1760,7 @@
           disabled: "未启用",
           notQueried: "尚未查询",
           lastSuccess: "数据时间",
-          todayScope: "当前供应商的今日 Token 用量，按宿主本地日统计",
+          todayScope: "已添加供应商的今日 Token 用量合计，按宿主本地日统计",
           eventsObserved: "已观测到调用事件",
           previewSaved: "已保存配置的最近查询结果；编辑草稿不会改变此预览。",
           advanced: "高级选项",
@@ -1695,6 +1820,10 @@
           todayShort: "今日 {n}",
           statsWindow: "近 {n} 天",
           remainLabel: "剩余 {n}%",
+          rangeLabel: "统计区间",
+          estLeft: "剩余",
+          estTotal: "套餐总量",
+          estNoData: "本地样本不足",
           ratioAria: "缓存命中 {hit} · 缓存未命中 {miss} · 输出 {out}",
           cacheHit: "缓存命中",
           cacheMiss: "缓存未命中",
@@ -1712,6 +1841,12 @@
           stateCrit: "临界",
           stateErr: "取数失败",
           stateOff: "未配置",
+          // 仅计量供应商：只有经过 Harness 的 token，没有可查询的额度与百分比
+          meteredOnly: "仅计量",
+          windowTokens: "近 {d} 天 {n}",
+          rename: "改名",
+          meteredName: "名称",
+          meteredRoute: "DSH 路由",
           quota: "限额",
           usedShort: "已用",
           detailTitle: "明细",
@@ -1768,7 +1903,7 @@
           critPct: "临界阈值 %",
           interval: "轮询间隔（秒，10–3600）",
           retention: "用量保留期（天，1–90）",
-          unmapped: "另探测到 DSH 内已添加但本插件暂不支持的供应商",
+          unmapped: "另探测到 DSH 内已添加、但没有额度查询的供应商",
         },
         en: {
           current: "Current",
@@ -1802,7 +1937,7 @@
           disabled: "Disabled",
           notQueried: "Not queried yet",
           lastSuccess: "Data updated",
-          todayScope: "Today's Token usage for current suppliers, measured by the host local day",
+          todayScope: "Today's Token usage across every listed supplier, measured by the host local day",
           eventsObserved: "Call events observed",
           previewSaved: "Latest query for the saved configuration. Draft edits do not change this preview.",
           advanced: "Advanced options",
@@ -1861,6 +1996,10 @@
           todayShort: "Today {n}",
           statsWindow: "Last {n} days",
           remainLabel: "{n}% left",
+          rangeLabel: "Range",
+          estLeft: "Left",
+          estTotal: "Total",
+          estNoData: "Not enough local samples",
           ratioAria: "Cache hits {hit} · cache misses {miss} · output {out}",
           cacheHit: "Cache hits",
           cacheMiss: "Cache misses",
@@ -1878,6 +2017,11 @@
           stateCrit: "Critical",
           stateErr: "Fetch failed",
           stateOff: "Not configured",
+          meteredOnly: "Usage only",
+          windowTokens: "{d}d {n}",
+          rename: "Rename",
+          meteredName: "Name",
+          meteredRoute: "DSH route",
           quota: "Limit",
           usedShort: "Used",
           detailTitle: "Details",
@@ -1934,7 +2078,7 @@
           critPct: "Critical threshold %",
           interval: "Poll interval (s, 10–3600)",
           retention: "Usage retention (days, 1–90)",
-          unmapped: "Detected DSH suppliers this plugin does not support yet",
+          unmapped: "Detected DSH suppliers with no quota query",
         },
       };
 
@@ -1978,6 +2122,26 @@ div:has(> div[data-slot="sidebar.footer.action"] > [data-qm-linerow]){flex-wrap:
 .qm-today-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;margin:8px 10px 6px;
   color:var(--dsw-alias-label-secondary,#a9b2c5);font-size:11px;font-variant-numeric:tabular-nums;}
 .qm-today-text{flex:none;}
+/* 区间选择器（今天 / 近 7 天）：替代原来的「今日」二字，一次点击换口径 */
+.qm-card .qm-range{position:relative;display:inline-flex;align-items:center;flex:none;}
+.qm-card .qm-range select{font:inherit;font-size:11px;line-height:15px;padding:1px 16px 1px 6px;appearance:none;
+  color:var(--dsw-alias-label-primary,#dbe2ee);background:var(--dsw-alias-bg-base,#0b0e13);
+  border:1px solid var(--dsw-alias-border-l2,#363d4d);border-radius:6px;cursor:pointer;}
+.qm-range::after{content:"▾";position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:8px;
+  color:var(--dsw-alias-label-tertiary,#8b94a8);pointer-events:none;}
+/* 窗口估算：Left/Total 两段式 + 三个读数；窄栏自己折行，不去挤比例数字 */
+.qm-est{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin-left:auto;
+  font-size:11px;color:var(--dsw-alias-label-secondary,#a9b2c5);min-width:0;}
+.qm-est-seg{display:inline-flex;flex:none;border:1px solid var(--dsw-alias-border-l2,#363d4d);
+  border-radius:6px;overflow:hidden;}
+.qm-card .qm-est-seg button{font:inherit;font-size:10px;line-height:15px;padding:1px 6px;border:0;border-radius:0;
+  background:none;color:var(--dsw-alias-label-tertiary,#8b94a8);cursor:pointer;}
+.qm-card .qm-est-seg button+button{border-left:1px solid var(--dsw-alias-border-l2,#363d4d);}
+.qm-card .qm-est-seg button[aria-pressed=true]{background:var(--dsw-alias-interactive-bg-hover,#20283a);
+  color:var(--dsw-alias-label-primary,#dbe2ee);}
+.qm-est-q{white-space:nowrap;color:var(--dsw-alias-label-secondary,#a9b2c5);}
+.qm-est-q b{font-weight:600;color:var(--dsw-alias-label-primary,#dbe2ee);font-variant-numeric:tabular-nums;}
+.qm-est-q.is-off{color:var(--dsw-alias-label-tertiary,#5c6577);}
 /* 分布条：详情行只有一条五段条（命中/未命中/输出/写缓存/未细分）；段宽 = 分量占比 */
 .qm-split-bar{display:inline-flex;flex:1 1 64px;min-width:48px;height:5px;border-radius:2.5px;overflow:hidden;
   background:var(--dsw-alias-border-l1,#1d2330);}
@@ -2005,8 +2169,11 @@ div:has(> div[data-slot="sidebar.footer.action"] > [data-qm-linerow]){flex-wrap:
 .qm-chart-plot svg{display:block;width:100%;height:100%;overflow:visible;}
 /* 柱值标签：按绘图区百分比定位，文字本身不参与 svg 的横向拉伸 */
 .qm-chart-labels{position:absolute;inset:0;pointer-events:none;}
+/* 柱值标签：按绘图区百分比定位，文字本身不参与 svg 的横向拉伸。
+   标签不可透明：底下一层卡片底色把折线挡开，数字才不会被线压花（标签层在 SVG 之上）。 */
 .qm-chart-value{position:absolute;transform:translateX(-50%);font-size:10px;line-height:1;white-space:nowrap;
-  font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-secondary,#a9b2c5);pointer-events:none;}
+  font-variant-numeric:tabular-nums;color:var(--dsw-alias-label-secondary,#a9b2c5);pointer-events:none;
+  padding:1px 3px;border-radius:3px;background:var(--dsw-alias-bg-layer-2,#151922);}
 .qm-chart-bar{fill:var(--dsw-alias-state-business-primary,#4f8cff);fill-opacity:.32;}
 .qm-chart-grid{stroke:var(--dsw-alias-border-l2,#363d4d);stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke;}
 .qm-chart-axis{stroke:var(--dsw-alias-border-l2,#363d4d);stroke-width:1;vector-effect:non-scaling-stroke;}