@dougen/dsh-deepseek-usage 0.8.0 → 0.9.1

package/README.md

@@ -14,6 +14,7 @@ DeepSeek **余额侧边栏插件**（DeepSeek Harness Web UI）：在 DSH **网
 - **Auto price sync**: prices are re-fetched from the official DeepSeek pricing page on first use each day and when you click the card; the result is merged back into the price table (official entries overwrite same-named ones, your own entries are kept). The page is parsed **structurally (HTML table cells)**, not by matching surrounding text, so official layout/rewording changes no longer break it; a plain-text strategy remains as a fallback
 - **Rename-proof model mapping**: when DeepSeek renames a model (e.g. `deepseek-v4-flash` → `deepseek-flash`) the old id is charged at the current model's price instead of silently showing an outdated price. (The card stays quiet about this — see *FAQ* below.)
 - **Peak indicator & countdown**: top-right dot — orange during peak hours (Mon–Fri 9:00–12:00, 14:00–18:00 Beijing Time), green otherwise. Beside the dot a countdown shows the time left until the next peak/off-peak switch, in English units (`2d 15h`, `5h 47m`, `23m`).
+- **Collapsed sidebar**: with the sidebar collapsed to the icon rail, this plugin shows the peak/off-peak dot alone (clicking it still refreshes); the full card returns when the sidebar expands.
 - **Auto refresh**: every 5 minutes; click the card to refresh instantly.
 - **i18n**: UI copy follows the DSH locale (Chinese / English)
 - Follows the app light/dark theme
@@ -24,6 +25,7 @@ DeepSeek **余额侧边栏插件**（DeepSeek Harness Web UI）：在 DSH **网
 - **单价自动同步**：每日首次使用或点击卡片时，自动从官方价格页拉取最新档单价，并把结果**合并回写**到价格表（官方条目覆盖同名项，你自己加的条目保留）。页面解析采用**结构化表格解析**（直接读 HTML 表格单元格），不再依赖"正文里某段文字长什么样"，官方改版/改文案不会失效；另保留纯文本兜底策略
 - **抗改名映射**：官方给模型改名（如 `deepseek-v4-flash` → `deepseek-flash`）时，旧名按现名价格计费，不会静默显示旧价（卡片不为此弹提示，见下方 FAQ）
 - **峰谷指示灯与倒计时**：卡片右上角圆点，高峰（周一至周五 9:00–12:00、14:00–18:00 北京时间）橙色，空闲绿色；圆点旁显示距下次峰谷切换的倒计时，统一英文单位（`2d 15h`、`5h 47m`、`23m`）
+- **侧边栏折叠**：折叠成图标栏时只显示峰谷指示灯（点击它同样可刷新），卡片在侧边栏展开时回来
 - **自动刷新**：每 5 分钟一次；点击卡片任意位置立即刷新
 - **多语言**：界面文案跟随 DSH 语言（中文 / English）
 - 跟随应用明暗主题
@@ -154,6 +156,15 @@ node lib/pricing-remote.js --check --html page.html --json
 > `node --test --test-isolation=none "test/*.test.mjs"`（Node ≥ 22.8），或逐个跑
 > `node test/parse.test.mjs`、`node test/pricing.test.mjs`、`node test/pricing-store.test.mjs`、
 > `node test/client-layout.test.mjs`、`node test/host-route.test.mjs`。
+>
+> 两种偶发失败都属于环境限制，不是插件行为，逐文件运行可稳定复现通过：
+> - `host-route` 的"合并写回"用例依赖点击时的 `FORCED_GAP_MS`（30s）节流门；多个测试文件
+>   共用同一进程（`--test-isolation=none`）时那条"强制同步"可能被门挡掉。
+> - Windows 上原子写（写 `.tmp` 后 `rename`）可能被安全软件短暂占用而报
+>   `EPERM ... rename`；重跑即过。
+>
+> 另：`test/host-route.test.mjs` 与 `test/pricing-store.test.mjs` 都只需要一个可写的临时目录
+> （`os.tmpdir()`），若该目录不可写（`mkdtemp ... EPERM`），把 `TEMP`/`TMP` 指到任意可写目录即可。
 
 ## Uninstall / 卸载
 

package/lib/client.js

@@ -4,9 +4,11 @@
 // Cordis 面板按钮下方）。轮询宿主路由 `/api/deepseek-usage`（见 lib/index.js）
 // 每 5 分钟一次，点击卡片任意位置可立即刷新；还没拿到余额（宿主刚重启/接口刚起来）
 // 时按 QUICK_RETRY_MS 阶梯快速补几次请求，卡片几秒内收敛。
-// 卡片显示：余额（放大显示，符号随币种 ¥/$）+ 当前模型档单价（输入/输入缓存/
-// 输出，图标 + 数字，位于卡片右下角）+ 峰谷指示灯（右上角，只有颜色）+ 距下次
-// 峰谷切换的倒计时（`2d 15h` / `5h 47m` / `23m`，与指示灯同行、位于其左侧）。
+// 两种形态：
+//   · 侧边栏展开——完整卡片：余额（放大显示，符号随币种 ¥/$）+ 当前模型档单价
+//     （输入/输入缓存/输出，图标 + 数字，位于卡片右下角）+ 峰谷指示灯（右上角，
+//     只有颜色）+ 距下次峰谷切换的倒计时（`2d 15h` / `5h 47m` / `23m`，与指示灯同行、位于其左侧）。
+//   · 侧边栏折叠——36px 图标栏里只有峰谷指示灯（见下方 `if (!wide)` 分支）。
 //
 // 设计约束（用户只关心"我还能花多少、这会儿什么价"）：
 //   · 插件的内部信息——计价来源、同步状态、价格表文件名与路径、模型改名——一律
@@ -27,9 +29,11 @@ window.__ModuleLoader__.load({
 		// ---- constants -------------------------------------------------
 		const POLL_MS = 5 * 60 * 1000;
 		const USAGE_PATH = "/api/deepseek-usage";
-		// 常态卡片高度：上下 padding 8+8 + 余额行 lineHeight 28 + 边框 2 = 46。
-		// 异常态把卡片置空时用它兜住高度，侧边栏高度不跳动。
-		const CARD_MIN_HEIGHT = 46;
+		// 常态卡片高度：上下 padding 8+16 + 金额行 minHeight 28 + 边框 2 = 54。
+		// 底部多留的 8px 是为了让倒计时那一行与下方单价行之间有呼吸感。
+		// 倒计时与圆点都在金额行内定位，不额外增高（无头 Chromium 实测 cardH=54）。
+		// 异常态把卡片置空时用它兜住同一个高度，侧边栏高度不跳动。
+		const CARD_MIN_HEIGHT = 54;
 		// 卡片还没拿到余额时的快速重试节奏（宿主刚重启、接口刚起来、或本次请求失败）：
 		// 否则要等满 5 分钟轮询才会从空卡片变成真实数字。
 		const QUICK_RETRY_MS = [4000, 8000, 15000, 30000];
@@ -312,6 +316,8 @@ window.__ModuleLoader__.load({
 				load(true);
 			};
 
+			// 折叠态（图标栏）：内容宽 36px（侧边栏 56px − 折叠态左右各 10px 内边距），
+			// 只容得下峰谷指示灯。指示灯仍是"点击刷新"的落点。
 			if (!wide) {
 				return h("div", {
 					style: {
@@ -326,15 +332,10 @@ window.__ModuleLoader__.load({
 						display: "flex",
 						flexDirection: "row",
 						alignItems: "center",
-						gap: 5,
 						userSelect: "none",
 					},
 					onClick: () => load(true),
-				},
-					h("span", { style: { display: "inline-flex", alignItems: "baseline", gap: 3 } },
-						h("span", { style: { fontWeight: 700, fontSize: 13, color: C.label } }, symbol),
-						h("span", { style: { fontWeight: 700, fontSize: 13, color: C.label } }, money(balance && balance.total))),
-					h("span", { style: dot }));
+				}, h("span", { style: dot }));
 			}
 
 			// 只有"余额类错误"（未配置 Key / 余额接口或网络失败）才走到这里：卡片置空、
@@ -342,7 +343,7 @@ window.__ModuleLoader__.load({
 			// （CARD_MIN_HEIGHT），侧边栏不跳动；文字多行时卡片自然变高。
 			// 注意：这里不显示任何插件内部信息（来源、同步时间、价格表路径），历史上那批
 			// 良性提示已随"去技术化"一起删除。
-			// 窄卡片（!wide）没有文字空间：仍显示余额与圆点，错误只写进日志。
+			// 折叠态（!wide）早在上面就返回了：它只有峰谷指示灯，没有文字空间。
 			if (blanked) {
 				return h("div", {
 					style: {
@@ -382,7 +383,9 @@ window.__ModuleLoader__.load({
 					boxSizing: "border-box",
 					flex: "1 1 100%",
 					minWidth: 0,
-					padding: "8px 10px",
+					// 上 8 下 10（配合单价行 bottom:2，这组是用户看过后选定的观感）。
+					// 顶部保持 8px 不动，圆点才能继续紧贴右上角。
+					padding: "8px 10px 12px",
 					borderRadius: 10,
 					border: "1px solid " + C.border,
 					background: C.bg,
@@ -399,35 +402,44 @@ window.__ModuleLoader__.load({
 				},
 				onClick: onCardClick,
 			},
-				// 第一行：余额（24px，符号与数字 3px 间距）。右侧留出"圆点 + 倒计时"的位置：
-				// 倒计时贴右，圆点再靠右，所以余额右侧 padding 是 100（约 3 个倒计时字符宽）。
-				h("div", { style: { display: "flex", alignItems: "baseline", minWidth: 0, paddingRight: 100, gap: 6 } },
+				// 金额行：余额 + 右侧「倒计时 + 峰谷圆点」。
+				// 倒计时与圆点放在同一个 flex 行里、alignItems:center，两者圆心必然重合；
+				// 整组 alignSelf:flex-start + 负 margin，让圆点距卡片顶/右各 8px。
+				// 两个反面做法都试过并实测过：
+				//   · alignSelf:center → 圆点被压到卡片中线，不再是"右上角"；
+				//   · paddingTop:6    → 金额行被撑高，卡片被撑大，圆点反而更靠下。
+				// 倒计时 minWidth:0 + overflow:hidden：窄侧边栏下先省略号截断，不挤压余额
+				// （实测 "2d 23h" 在 170px 宽的卡片里仍放得下）。
+				h("div", { style: { display: "flex", alignItems: "baseline", minHeight: 28, minWidth: 0, gap: 6 } },
 					h("span", { style: { fontWeight: 700, fontSize: 24, color: C.label, lineHeight: "28px", marginRight: 3 } }, symbol),
-					h("span", { style: { fontWeight: 700, fontSize: 24, color: C.label, lineHeight: "28px" } }, money(balance && balance.total))),
-				// 倒计时：距下次峰谷切换的剩余时间（`2d 15h` / `5h 47m` / `23m` / `switching`）。
-				// 与圆点同一行、位于圆点左侧；英文单位且无前缀，中英界面一致。
-				h("span", {
-					style: {
-						position: "absolute",
-						top: 9,
-						right: 27,
-						left: 9,
-						textAlign: "right",
-						fontSize: 12,
-						lineHeight: "14px",
-						color: C.sub,
-						overflow: "hidden",
-						textOverflow: "ellipsis",
-						whiteSpace: "nowrap",
-					},
-				}, countdown),
-				// 峰谷指示灯：只有颜色（橙=高峰 / 绿=空闲），没有 title、没有其他文字。
-				h("span", { style: { position: "absolute", top: 8, right: 9, ...dot } }),
+					h("span", { style: { fontWeight: 700, fontSize: 24, color: C.label, lineHeight: "28px" } }, money(balance && balance.total)),
+					// 负 margin 只挪动整组，不改变金额行高度（卡片高度由内边距决定）。
+					// 实测：marginTop -4 与 marginRight -3 时，圆点距卡片顶、右各 8px
+					// （右侧不能按"内边距 10 − 8"去推，内边距本就含在行宽里）。
+					h("span", { style: { display: "flex", alignItems: "center", gap: 6, minWidth: 0, marginLeft: "auto", flex: "0 1 auto", alignSelf: "flex-start", marginTop: -4, marginRight: -3 } },
+						// 倒计时：距下次峰谷切换的剩余时间（`2d 15h` / `5h 47m` / `23m` / `switching`）。
+						// 纯英文单位、无前缀，中英界面一致。
+						// 字号/字重刻意与右下角单价数字对齐（继承卡片正文 12px、fontWeight 600），
+						// 让右上角这行和右下角单价行是同一套文字样式。
+						h("span", {
+							style: {
+								fontWeight: 600,
+								color: C.sub,
+								minWidth: 0,
+								overflow: "hidden",
+								textOverflow: "ellipsis",
+								whiteSpace: "nowrap",
+							},
+						}, countdown),
+						// 峰谷指示灯：只有颜色（橙=高峰 / 绿=空闲），没有 title、没有其他文字。
+						h("span", { style: dot }))),
 				// 底部行：只剩当前档单价，恒靠右下角。
+				// 这组 bottom:2 + 卡片下内边距 10 是用户看过多组对比后选定的观感（价格略微下移、
+				// 下方不再空一大块）。注意绝对定位的行不参与卡片高度计算，改内边距时两者要一起看。
 				// 用 flex-end 而不是 space-between：容器只有一个子元素时 space-between 会把它
 				// 推到最左侧（0.6.0 的回归点）。
 				h("span", {
-					style: { position: "absolute", left: 9, right: 9, bottom: 4, display: "flex", alignItems: "center", justifyContent: "flex-end", gap: 6 },
+					style: { position: "absolute", left: 9, right: 9, bottom: 2, display: "flex", alignItems: "center", justifyContent: "flex-end", gap: 6 },
 				},
 					h("span", { style: { display: "inline-flex", alignItems: "center", gap: 5, flex: "none" } },
 						Price(h(IconIn, null), t("price.input"), tier && tier.input),

package/package.json

@@ -1,9 +1,17 @@
 {
   "name": "@dougen/dsh-deepseek-usage",
-  "version": "0.8.0",
+  "version": "0.9.1",
   "description": "DeepSeek 余额侧边栏插件：余额（官方 API）、当前档单价与峰谷时段指示灯，支持中/英文界面。",
   "type": "module",
   "main": "lib/index.js",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/dougen/dsh-deepseek-usage.git"
+  },
+  "homepage": "https://github.com/dougen/dsh-deepseek-usage",
+  "bugs": {
+    "url": "https://github.com/dougen/dsh-deepseek-usage/issues"
+  },
   "scripts": {
     "test": "node --test test/",
     "check:pricing": "node lib/pricing-remote.js --check"