description: "设置里的按账户 token 用量：可按图例折叠的每日堆叠柱、缓存命中率面积图，以及按会话的明细表。" kind: "package-reference"

@qilin-agent/client-ui-usage

English | 中文

概述

设置里的「用量」一节回答用户关于自己账户的一个问题：花了多少。它从用户自己的运行时读回用量，把当月画成每天一根堆叠柱——未命中输入、输出、缓存读——并在柱后画出提示 token 中由缓存提供的比例。每个系列都能从图例里折叠掉，单根柱在悬停或获得焦点时读回当天的数字，下方表格把同一个月按会话拆开。全部时间的数据来自账本自身的合计。

目录

• 使用本页
• 理解实现
• 进一步探索
• 模型体验
• 已知限制与待办
• 开发备注

使用本页

打开设置，选择用量。本页不需要配置；它从服务浏览器的运行时读取 GET /api/usage/me，运行时会带上自己上报所用的凭据把请求转给部署的账本。

| 部分 | 展示内容 | |---|---| | 指标卡 | 今天、本月、全部时间，以及全部时间的轮次数与会话数，各带它所覆盖流量的缓存命中率 | | 图表 | 当月每天一根堆叠柱，柱后是命中率面积 | | 图例 | 每个柱系列一项，另加面积一项；点选某项即把该系列折叠出图 | | 表格 | 当月按会话：输入、输出、缓存读、命中率与合计 |

管理员的页面读到的是部署而不是单个账户：同一张图按全部账户求和，表格把当月按账户（而不是按会话）拆开。

图表可用键盘到达：每根柱可获得焦点，左右方向键在日期间移动，Escape 关闭读回。部署不可达时页面直说，而不是画一个空月份；当账本里的轮次超过单次应答容量时，页面说明只显示了最近的。

理解实现

src/client/chart.ts 用纯函数承载本页的算术：把记录按浏览器本地日分桶（包含没有用量的日子，因为把空缺填平的图会把安静的一周画成繁忙的一周）、缓存命中率、折叠状态，以及堆叠段、网格线与面积路径的布局。UsageSection.tsx 承载读者驱动的状态并渲染这些值；它不引入任何图表库，也不写任何字面色。

进一步探索

• Usage report 是运行时那一半：它把轮次上报给账本，并提供本页所用的读取。
• Settings general 拥有本页注册进去的设置外壳。
• Web styling 说明本页遵循的令牌与本地化规则。

模型体验

无：本页只读取账本并绘制它，不增加任何提示词、工具或模型可见输出。

KV 缓存影响

请求不被改动；本页只是把提供方已经计费的缓存流量报告出来。

已知限制与待办

• 月份是浏览器的月份。 日期按浏览器本地日历分桶，因此外出的读者看到的是自己时钟描述的月份，而不是部署的。
• 单次应答有上界。 读取只携带应答容量允许的最新记录；上报更多的月份会显示最新的日子并说明这一点。
• 只有管理员能看到其他账户。 其他人的页面只读自己的账户：部署的读取由运行时上报所用的凭据限定作用域，普通账户无法索取他人的用量。

开发备注

本节注册进 settings.section，而不是自建设置外壳；字典随包发布，因此本页没有自己需要维护的本地化层。