dsh-opencode-usage-dashboard 1.0.1 → 1.2.0

package/README.md

@@ -1,5 +1,5 @@
 <div align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/icon.svg" width="88" alt="OpenCode 用量面板 logo">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/icon.svg" width="88" alt="OpenCode 用量面板 logo">
 </div>
 
 <h1 align="center">OpenCode 用量面板</h1>
@@ -26,7 +26,7 @@
 > 这是 DeepSeek Harness 的第三方插件，数据来自 OpenCode 官方。
 
 <div align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/screenshot-card.png" alt="侧栏用量卡片：用量、额度、预测、趋势、模型五个分块" width="320">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/screenshot-card.png" alt="侧栏用量卡片：用量、额度、预测、趋势、模型五个分块" width="320">
   <br>
   <sub>侧栏卡片（浅色主题，示意数据）：用量 · 额度 · 预测 · 趋势 · 模型</sub>
 </div>
@@ -50,12 +50,16 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 
 ### 侧栏卡片
 
-卡片放在侧栏设置按钮上方；侧栏收起时退化为一个百分比/金额小方块，展开后按偏好顺序显示五个分块。卡片顶部是账户入口：点账户名可切换组织和服务账号，右侧是刷新与设置按钮。
+卡片放在侧栏设置按钮上方；侧栏收起时退化为一个百分比/金额小方块，展开后按偏好顺序显示分块，默认只开「用量」和「额度重置时间」，其余在设置里随时打开。每个分块标题右侧有个箭头，点一下就把这一块收成一行（只留标题和它的关键数据，例如用量显示当日花费、额度显示本月已用、趋势显示最近一根、模型显示第一名），再点展开。卡片右上角还有收起按钮，收起后只剩一行「OpenCode + 本月剩余（没有月度额度时显示总花费）」，再点一下展开。卡片顶部有一条拖拽热区（悬停露出一小条横线），上下拖动直接调卡片限高，拖到内容放满、不再需要滚动时会自动关掉限高。卡片顶部是账户入口：点账户名可切换组织和服务账号，右侧是刷新、设置与收起按钮。
+
+<p align="center">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-resize.png" alt="卡片顶部拖拽条：悬停出现「上下拖动调整卡片限高」提示" width="420">
+</p>
 
 #### 用量
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/card-today.png" alt="用量分块：本月剩余油表，以及今日、本周、本月的花费与请求数" width="300">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-today.png" alt="用量分块：本月剩余油表，以及今日、本周、本月的花费与请求数" width="300">
 </p>
 
 - 今日花费、请求数、tokens；
@@ -66,7 +70,7 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 额度
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/card-quota.png" alt="额度分块：滚动、每周、每月三个窗口与重置倒计时" width="300">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-quota.png" alt="额度分块：滚动、每周、每月三个窗口与重置倒计时" width="300">
 </p>
 
 - 滚动 5 小时、本周、本月三个窗口；
@@ -76,7 +80,7 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 预测
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/card-forecast.png" alt="预测分块：实测花费曲线、预测虚线与 50%/100% 预计日期" width="300">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-forecast.png" alt="预测分块：实测花费曲线、预测虚线与 50%/100% 预计日期" width="300">
 </p>
 
 - 按当前计费周期的花费速度做线性外推；
@@ -86,7 +90,7 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 趋势
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/card-trend.png" alt="趋势分块：7 天或 24 小时的花费、tokens、请求数柱状图" width="300">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-trend.png" alt="趋势分块：7 天或 24 小时的花费、tokens、请求数柱状图" width="300">
 </p>
 
 - 7 天 / 24 小时切换；
@@ -96,13 +100,29 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 模型
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/card-models.png" alt="模型分块：按花费排序的模型条形图" width="300">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-models.png" alt="模型分块：按花费排序的模型条形图" width="300">
 </p>
 
 - 按花费排序，条形长度按最高花费归一化；
 - 最多显示四行；
 - 没有按模型计费记录时整块隐藏。
 
+#### 分块收起
+
+<p align="center">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/card-part-collapsed.png" alt="分块收起：趋势和模型只留一行标题，右侧显示关键数据" width="300">
+</p>
+
+- 每个分块标题右侧有一个箭头，点一下收成一行，再点一下展开；
+- 收起时标题右侧显示这一块的关键数据：
+  - 用量 → `当日 · $0.55`
+  - 额度重置时间 → `本月 · 23% 已用`
+  - 月度预测 → `11/27 · 163%`（重置日期 + 按当前速度的预测值）
+  - 趋势 → `11/01 · $0.55`（24 小时时是 `18:00 · $0.12`）
+  - 模型 → 只放第一名的模型名
+- 卡片窄的时候这些文字会自动省略成 `…`，标题和箭头位置不动；
+- 最后一个分块的提示气泡朝上弹，不会被卡片底边裁掉。
+
 ### 设置页
 
 设置 → OpenCode 套餐。Key 仍在 DSH 的 provider 设置里管理，这一页只读。
@@ -110,7 +130,7 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 账户
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/settings-account.png" alt="设置页账户面板：按组织分组的账户、服务账号、刷新间隔" width="640">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/settings-account.png" alt="设置页账户面板：按组织分组的账户、服务账号、刷新间隔" width="640">
 </p>
 
 - 账户按组织分组，同一组织的 Key 合成一张卡；
@@ -121,23 +141,25 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 #### 显示
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/settings-display.png" alt="设置页显示面板：卡片色条开关、色条颜色与四档进度条" width="640">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/settings-display.png" alt="设置页显示面板：卡片色条开关、色条颜色与四档进度条" width="640">
 </p>
 
 - 卡片样式：开关控制是否显示左侧色条，旁边选色条颜色；
+- 卡片限高：默认关闭；打开后分块区最高到设定像素，超出在卡片内滚动（卡片头和账户菜单不会被裁）。上限永远等于「内容自然高度 - 1px」，跟着内容实时变化，输入框只做范围保护；也可以直接拖卡片顶部的把手上下调，拖到顶（已经没有东西可滚）时会自动关掉限高一次；
 - 进度条分级：四档的名称、区间、颜色都可以改，区间首尾相接；
 - 「恢复默认」回到 0–50 绿、50–75 黄、75–90 橙、90–100 红。
 
 #### 卡片展示
 
 <p align="center">
-  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/a701fe3/docs/shots/settings-preview.png" alt="设置页卡片展示面板：五个分块的预览、勾选显示与拖拽排序" width="640">
+  <img src="https://raw.githubusercontent.com/zhxmt-xm/dsh-opencode-usage-dashboard/ed33013/docs/shots/settings-preview.png" alt="设置页卡片展示面板：一行一个分块，左边是开关，右边是侧栏里的实时渲染" width="640">
 </p>
 
-- 直接预览五个分块，勾选框控制侧栏显示 / 隐藏；
-- 拖拽分块标题调整顺序；
-- 趋势的 7 天 / 24 小时、花费 / tokens / 请求数切换也在这里；
-- 右上角 `?` 有操作提示。
+- 一行一个分块：左边是该块的开关，右边就是它在侧栏里的真实渲染；
+- 「在侧栏显示」控制整块；「收起」让这一块在侧栏里只留一行标题（收起时标题右侧显示它的关键数据，见上面的「分块收起」）；用量块另有「本周」「本月」控制表格行，以及「简化版本」——只保留今日，油表缩到左侧、花费 / 请求数 / Tokens 各占一行，块高度从约 230px 降到约 75px；简化版打开时「本周 / 本月」置灰（选择保留）；
+- 悬停行标题时右侧浮出拖拽点，按住标题上下拖即可调整顺序；
+- 趋势的 7 天 / 24 小时、花费 / tokens / 请求数切换直接在右侧预览里点；24 小时轴会按卡片实际宽度自动抽稀标签；
+- 「简化版本」后面的 `?` 是这一项的说明，面板标题旁的 `?` 是操作提示。
 
 > 这里没有单独的「趋势图」设置面板：趋势的显示范围与指标就在卡片展示的预览里切换。
 
@@ -161,7 +183,17 @@ OpenCode 的额度、花费和用量分散在几个接口里：Go 订阅的滚
 - 一个 OpenCode Go 订阅，或仅有 Console 用量的 OpenCode 账户；
 - 能访问 `opencode.ai`。
 
-### 从 GitHub 安装（推荐）
+### 从 DSH Market 安装（推荐）
+
+插件已经上架 DSH 插件市场：
+
+1. 打开 DSH → 设置 → **插件**（或插件市场）；
+2. 搜索 `dsh-opencode-usage-dashboard` 或「OpenCode 用量看板」；
+3. 点 **安装**，装完在侧栏就能看到卡片，无需重启。
+
+市场里的版本号跟随 npm 发布；`1.2.0` 之后的功能（分块收起、统一提示气泡等）需要市场里的版本 ≥ 1.2.0。
+
+### 从 GitHub 安装
 
 ```sh
 dsh plugin --profile desktop add github:zhxmt-xm/dsh-opencode-usage-dashboard
@@ -194,7 +226,7 @@ npm start
 
 脚本固定执行“卸载 → 清理 `node_modules` 里的旧 junction/临时目录 → 安装所选来源”。DSH 卸载 `link:` 安装时不会删除 junction，直接切换会 `EPERM`，所以从 link 切到 GitHub 不要只靠 DSH 的卸载按钮。
 
-运行前先完全退出 DSH（Windows 下脚本会检查），并确保 `dsh` 命令在 PATH 上。默认操作 `desktop` profile；需要指定其他 profile 或代理时：
+运行前不需要退出 DSH：`dsh plugin` 只是把参数转发给 profile 目录里的 pnpm，安装动作和运行中的 DSH 不冲突。profile 默认带 `@deepseek-ai/dsh-hmr`（`root` 为空，只盯 profile manifest 与 patch 文件），profile 一变 DSH 就会重新组合插件；只有它提示「请重启 DSH 使更改生效」（`package-moved`、`host-module` 这类情况）时才需要重启。真被文件占用（`EBUSY` / `EPERM`）时，脚本会提示你先退出 DSH 重跑。`dsh` 命令需要在 PATH 上。默认操作 `desktop` profile；需要指定其他 profile 或代理时：
 
 ```powershell
 $env:DSH_PROFILE = 'web'