im0o
eec5b791c8
采集从仪表盘组件挪进模块级单例（web/telemetry.ts），流量曲线和每路 吞吐的历史跨页面留存——跟着组件走的话切一次页面就清零一次。每路吞吐 从 /connections 快照按连接逐条求差再按 inboundName 聚合：先求和再求差 会在连接关闭时算出负数。 图表换 ECharts（按需注册）：手写 SVG 折线做不出平滑曲线和时间轴， 颜色在运行时从 CSS 变量取，跟随主题切换重取。 路由列表每行带走势、速率和可选的公网 IP 检测，点击跳路由页并选中 那一路（外壳传 focus 给 RouterPage 消费）。
26 lines
831 B
TypeScript
26 lines
831 B
TypeScript
/**
|
|
* 图表取色。
|
|
*
|
|
* Canvas 里画的东西不认 CSS 变量，颜色要在 JS 里解析出来传给 ECharts。
|
|
* themeTick 在主题变化（设置页显式切换写 data-theme，或系统偏好翻转）时走一格，
|
|
* 图表的 option 把它算进依赖，主题一变整个重新取色。
|
|
*/
|
|
import { ref } from 'vue'
|
|
|
|
export const themeTick = ref(0)
|
|
|
|
const bump = () => {
|
|
themeTick.value += 1
|
|
}
|
|
|
|
new MutationObserver(bump).observe(document.documentElement, {
|
|
attributes: true,
|
|
attributeFilter: ['data-theme'],
|
|
})
|
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', bump)
|
|
|
|
/** 当前生效的某个 CSS 变量的值，如 cssColor('--c-accent')。 */
|
|
export function cssColor(name: string): string {
|
|
return getComputedStyle(document.documentElement).getPropertyValue(name).trim()
|
|
}
|