Token 用量悬浮仪表盘 EACTzsr/dsh-token-dashboard

dsh-token-dashboard

DeepSeek Harness 常驻客户端插件:右侧悬浮仪表盘,实时显示当前会话的 Token 用量、缓存命中率与预计金额。
一个用于 DeepSeek Harness 的常驻客户端插件:一个可拖拽的右侧仪表盘,实时显示 Token 用量、缓存命中率与预计费用。

License
Version
dsh-plugin

纯客户端实现,无宿主 RPC、无任何外部依赖,只依赖 dsh 客户端运行时(react + @deepseek-ai/dsh-client-runtime)。

功能 / Features

- Token 用量:输入(未命中缓存)/ 输出 / 缓存命中 三卡片,每秒自动刷新
- 缓存命中率:命中 ÷ 完整输入,带渐变进度条(DeepSeek 官方口径)
- 预计金额:按官方价逐请求计价,☀ 高峰 / ☾ 空闲 两档切换;缓存命中部分按命中价计
- 柱形图:最近 8 次请求的堆叠柱(缓存绿 / 输入琥珀 / 输出蓝),悬停查看单次明细与费用
- 交互:拖拽标题栏移动、松手吸附左右边缘、⚑ 固定锁定、可收起;面板高度随位置自适应
- 主题:亮 / 暗色模式均正确(跟随 dsh 主题 token --dsw-alias-)

支持的模型与计价 / Models & Pricing

按模型名自动识别计价档位(名称含 pro → pro 档,含 flash → flash 档,其余默认 flash):

| 模型 | 档位 | 缓存命中 ¥/M | 输入(未命中) ¥/M | 输出 ¥/M |
| deepseek-v4-flash | ☀ 高峰 | 0.10 | 3.00 | 9.00 |
| deepseek-v4-flash | ☾ 空闲 | 0.05 | 1.50 | 4.50 |
| deepseek-v4-pro | ☀ 高峰 | 0.30 | 9.00 | 27.00 |
| deepseek-v4-pro | ☾ 空闲 | 0.15 | 4.50 | 13.50 |

本项目为 DeepSeek Harness 社区插件,与 DeepSeek 官方无关联,价格数据请以官方最新公布为准。*

每条请求按 输入×未命中价 + 输出×输出价 + 缓存×命中价 逐项累加;金额卡片右上角可随时切换 ☀高峰 / ☾空闲。价格表位于 client.js 顶部 PRICES 常量,可按需增改。

安装 / Install

方式 A:一键安装脚本(推荐)

克隆本仓库后执行(Windows PowerShell):

git clone https://github.com/EACTzsr/dsh-token-dashboard.git
cd dsh-token-dashboard
.\install.ps1 # 自动识别 profile(优先 web);可加 -Profile web / -Source zip

脚本会:① 把插件下载到 ~/.dsh/profiles//node_modules/dsh-token-dashboard/; ② 备份并写入 cordis.patch.yml 的 - insert: 行;③ 提示重启。重启 DSH 后仪表盘出现在右上角。

不装 git 可用 .\install.ps1 -Source zip;卸载见脚本结尾提示(删包目录 + 移除 insert 段)。

方式 B:插件市场(GitHub dsh-plugin topic)

确保仓库带有 dsh-plugin topic(在 GitHub 仓库 Settings → Topics 添加),然后:

dsh plugin --profile web add github:EACTzsr/dsh-token-dashboard

重启 dsh 生效。

方式 C:手动(profile 补丁)

1. 把本仓库克隆/解压后放入 profile 的 node_modules(示例路径 ~/.dsh/profiles/web/node_modules/dsh-token-dashboard/)
2. 在 profile 的 cordis.patch.yml 追加:

- insert:
- id: token-dashboard
name: dsh-token-dashboard

3. 重启 dsh。

安装前建议先备份 cordis.patch.yml(通常为 []),便于回滚。

使用 / Usage

面板默认出现在右上角,统计从会话打开起累计、按会话隔离(切换到子代理会话会显示子代理自己的用量):

| 操作 | 方法 |
| 查看用量 / 命中率 / 金额 | 三卡片 + 命中率进度条 + 金额卡片,每秒刷新 |
| 切换计价档位 | 金额卡片右上角 ☀高峰 / ☾空闲 |
| 柱形图明细 | 悬停任意柱子,下方显示模型、时间、三段 token 与费用 |
| 移动 / 固定 | 拖标题栏移动(松手吸附边缘),点 ⚑/⚐ 固定锁定 |
| 收起 | 点标题栏右侧 ▾/▸ |

底部状态栏实时显示:请求总数、● 正在生成指示灯、最近一次请求时间。

数据来源与口径 / Data source

- 纯客户端实现:数据取自客户端会话快照(ctx.sessions.binding(id).session.getSnapshot())。每条助手消息节点自带 usage(inputTokens / outputTokens / cacheReadTokens,其中 inputTokens 已剔除缓存命中,因此「输入(未命中) + 缓存命中 = 完整输入」),snapshot.running 即"正在生成"指示灯。
- 统计口径：仅统计 kind === 'assistant' 且三段 token 之和大于 0 的节点；命中率 = 缓存命中 ÷ 完整输入 × 100。
- 刷新频率：ctx.interval(refresh, 1000)，每秒取一次快照。
- 无需宿主 RPC、无任何外部依赖，只依赖 dsh 客户端运行时（react + @deepseek-ai/dsh-client-runtime）。

架构 / Architecture

┌────────────────────────────── 浏览器（web）半身 ──────────────────────────────┐ │ client.js —— 经 exports["./client"] 交付，dsh.client 声明由 web 平台名册发现 │ │ · 通过 window.__ModuleLoader__.load({ id, factory }) 注册模块 │ │ · factory 以 return module.exports 结尾（materialize 取 factory 返回值） │ │ · 组件定义在 apply(ctx) 内部，闭包捕获 ctx.sessions / ctx.interval / ctx.slots│ │ · 向 shell.overlay 槽注册仪表盘（纯增量，不替换任何现有 UI） │ │ · CSS 以 注入 │ ├────────────────────────────── 宿主半身 ─────────────────────────────────────┤ │ index.js —— 空实现（apply(){}）。纯 UI 插件，宿主侧无需任何逻辑 │ │ cordis.patch.yml —— 把 token-dashboard 行插入宿主 Loader │ └──────────────────────────────────────────────────────────────────────────────┘

开发与调试 / Development

- 组件使用 无 JSX 的 React.createElement 手写，零构建步骤，浏览器直接运行。
- 修改 client.js 后重启 dsh 或刷新客户端即可生效（无需打包）。
- 图标为 Unicode 字符（≡ ⚑ ⚐ ▾ ▸ ☀ ☾），不依赖任何图标库。
- 主题全部使用 dsh alias token（--dsw-alias-bg-overlay、--dsw-alias-state-success-primary 等），亮/暗模式自动适配。

License

MIT