From 750204dd302542578e2c3240545d46ce424683b4 Mon Sep 17 00:00:00 2001 From: yeyang <746659424@qq.com> Date: Sat, 13 Apr 2024 20:21:36 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20=E5=A2=9E=E5=8A=A0=E4=B8=80?= =?UTF-8?q?=E7=82=B9=E7=82=B9=E7=8A=B6=E6=80=81=E6=A0=B7=E5=BC=8F=E9=85=8D?= =?UTF-8?q?=E7=BD=AE=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .eslintrc.cjs | 2 +- apps/state.js | 3 +- config/default_config/state.yaml | 19 ++++++++ model/State/CPU.js | 2 +- model/State/FsSize.js | 17 ++++++- model/State/GPU.js | 3 +- model/State/Monitor.js | 45 ++--------------- model/State/{NetworkLatency.js => Network.js} | 25 +++++++++- model/State/SWAP.js | 2 +- model/State/index.js | 48 +++++++++---------- .../state/{state_chart.js => js/chart.js} | 21 +------- resources/state/{ => js}/echarts.min.js | 0 resources/state/js/style.js | 35 ++++++++++++++ resources/state/monitor.html | 2 +- resources/state/state.html | 42 ++++++++-------- 15 files changed, 148 insertions(+), 118 deletions(-) rename model/State/{NetworkLatency.js => Network.js} (86%) rename resources/state/{state_chart.js => js/chart.js} (81%) rename resources/state/{ => js}/echarts.min.js (100%) create mode 100644 resources/state/js/style.js diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 65157f1..2d116d9 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -42,5 +42,5 @@ module.exports = { "jsdoc/require-param-type": 0, "import/extensions": [ "error", "ignorePackages" ] }, - ignorePatterns: [ "resources/state/echarts.min.js" ] + ignorePatterns: [ "echarts.min.js" ] } diff --git a/apps/state.js b/apps/state.js index 92a45b8..7582e86 100644 --- a/apps/state.js +++ b/apps/state.js @@ -1,7 +1,8 @@ import plugin from "../../../lib/plugins/plugin.js" import { Config } from "../components/index.js" import { puppeteer } from "../model/index.js" -import { getData, si } from "../model/State/index.js" +import { getData } from "../model/State/index.js" +import { si } from "../model/State/DependencyChecker.js" import Monitor from "../model/State/Monitor.js" let interval = false diff --git a/config/default_config/state.yaml b/config/default_config/state.yaml index 150eaf3..93f5701 100644 --- a/config/default_config/state.yaml +++ b/config/default_config/state.yaml @@ -19,6 +19,25 @@ statusPowerShellStart: false #背景图片api 默认 https://api.sretna.cn/layout/pe.php backdrop: 'https://api.sretna.cn/layout/pe.php' +# 当api请求失败时使用的默认背景图，请放置在resources/state/img目录下，修改为你的文件名 +backdropDefault: 'default_bg.jpg' # 关闭node的那个圈圈 closedNodeInfo: true + +# 关闭图表 +closedChart: false + +# Bot昵称的颜色 +BotNameColor: 'none' +# Bot昵称渐变色 设置了该值BotNameColor值将无效 如要使用BotNameColor请将该值设为none或false +# 该值请参考https://developer.mozilla.org/zh-CN/docs/Web/CSS/gradient/linear-gradient +# xxdeg 为渐变角度 后为渐变颜色 +BotNameColorGradient: '271.14deg,#001bff 0.98%,#00f0ff 25.79%,#fce84a 47.33%,#f34628 65.77%,#b275ff 91.4%' + +#以下为主硬件进度条和磁盘进度条的颜色 highColor - 严重 mediumColor - 警告 lowColor - 正常 +highColor: '#d73403' + +mediumColor: '#ffa500' + +lowColor: '#87CEEB' diff --git a/model/State/CPU.js b/model/State/CPU.js index 2ce13f1..8d100c1 100644 --- a/model/State/CPU.js +++ b/model/State/CPU.js @@ -1,5 +1,5 @@ import os from "os" -import { si, osInfo } from "./index.js" +import { si, osInfo } from "./DependencyChecker.js" import { Circle } from "./utils.js" /** 获取CPU占用 */ diff --git a/model/State/FsSize.js b/model/State/FsSize.js index 8cff2cd..46576cc 100644 --- a/model/State/FsSize.js +++ b/model/State/FsSize.js @@ -1,6 +1,7 @@ import _ from "lodash" import { getFileSize } from "./utils.js" -import { si } from "./index.js" +import { si } from "./DependencyChecker.js" +import Monitor from "./Monitor.js" /** * 获取硬盘 @@ -29,3 +30,17 @@ export default async function getFsSize() { return item }) } +/** + * 获取磁盘读写速度 + * @returns {object | boolean} 返回一个对象，包含读速度（rx_sec）和写速度（wx_sec），如果无法获取则返回false。 + */ +export function getDiskSpeed() { + let fsStats = Monitor.fsStats + if (!fsStats || fsStats.rx_sec == null || fsStats.wx_sec == null) { + return false + } + return { + rx_sec: getFileSize(fsStats.rx_sec, false, false), + wx_sec: getFileSize(fsStats.wx_sec, false, false) + } +} diff --git a/model/State/GPU.js b/model/State/GPU.js index 5499b96..4fd4b65 100644 --- a/model/State/GPU.js +++ b/model/State/GPU.js @@ -1,6 +1,5 @@ import { Circle } from "./utils.js" -import { si } from "./index.js" -import { initDependence } from "./DependencyChecker.js" +import { si, initDependence } from "./DependencyChecker.js" let isGPU = false; diff --git a/model/State/Monitor.js b/model/State/Monitor.js index 39d262b..5faaf16 100644 --- a/model/State/Monitor.js +++ b/model/State/Monitor.js @@ -1,8 +1,7 @@ import { Config, Data } from "../../components/index.js" import _ from "lodash" -import { si } from "./index.js" -import { initDependence } from "./DependencyChecker.js" -import { addData, getFileSize } from "./utils.js" +import { si, initDependence } from "./DependencyChecker.js" +import { addData } from "./utils.js" export default new class monitor { constructor() { @@ -29,8 +28,7 @@ export default new class monitor { // 内存 ram: [], // 主题 - echarts_theme: Data.readJSON("resources/state/theme_westeros.json"), - backdrop: Config.state.backdrop + echarts_theme: Data.readJSON("resources/state/theme_westeros.json") } this.valueObject = { networkStats: "rx_sec,tx_sec,iface", @@ -105,41 +103,4 @@ export default new class monitor { } return data } - - // 获取读取速率 - get DiskSpeed() { - if (!this.fsStats || - this.fsStats.rx_sec == null || - this.fsStats.wx_sec == null - ) { - return false - } - return { - rx_sec: getFileSize(this.fsStats.rx_sec, false, false), - wx_sec: getFileSize(this.fsStats.wx_sec, false, false) - } - } - - /** - * 获取网速 - * @returns {object} - */ - get getNetwork() { - let network = _.cloneDeep(this.network) - if (!network || network.length === 0) { - return false - } - let data = [] - for (let v of network) { - if (v.rx_sec != null && v.tx_sec != null) { - let _rx = getFileSize(v.rx_sec, false, false) - let _tx = getFileSize(v.tx_sec, false, false) - data.push({ - first: v.iface, - tail: `↑${_tx}/s | ↓${_rx}/s` - }) - } - } - return data.length === 0 ? false : data - } }() diff --git a/model/State/NetworkLatency.js b/model/State/Network.js similarity index 86% rename from model/State/NetworkLatency.js rename to model/State/Network.js index 0dfb678..08ef294 100644 --- a/model/State/NetworkLatency.js +++ b/model/State/Network.js @@ -1,5 +1,7 @@ -import request from "../../lib/request/request.js" import { Config } from "../../components/index.js" +import request from "../../lib/request/request.js" +import Monitor from "./Monitor.js" +import { getFileSize } from "./utils.js" const defList = [ { name: "Baidu", url: "https://baidu.com" }, @@ -12,7 +14,7 @@ const defList = [ * 获取网络测试列表。 * @returns {Promise} 返回一个Promise，该Promise解析为网络测试结果的数组。 */ -export default function getNetworkTestList() { +export function getNetworkTestList() { const { psTestSites, psTestTimeout } = Config.state if (!psTestSites) { return Promise.resolve([]) @@ -123,3 +125,22 @@ async function getNetworkLatency(url, timeoutTime = 5000) { clearTimeout(timeout) } } +/** 获取当前网速 */ +export function getNetwork() { + let network = Monitor.network + if (!network || network.length === 0) { + return false + } + let data = [] + for (let v of network) { + if (v.rx_sec != null && v.tx_sec != null) { + let _rx = getFileSize(v.rx_sec, false, false) + let _tx = getFileSize(v.tx_sec, false, false) + data.push({ + first: v.iface, + tail: `↑${_tx}/s | ↓${_rx}/s` + }) + } + } + return data.length === 0 ? false : data +} diff --git a/model/State/SWAP.js b/model/State/SWAP.js index faba68a..6c803e5 100644 --- a/model/State/SWAP.js +++ b/model/State/SWAP.js @@ -1,5 +1,5 @@ import { Circle, getFileSize } from "./utils.js" -import { si } from "./index.js" +import { si } from "./DependencyChecker.js" export default async function getSwapInfo() { const swapData = await si.get({ mem: "swaptotal,swapused,swapfree" diff --git a/model/State/index.js b/model/State/index.js index af3d3b5..cffe072 100644 --- a/model/State/index.js +++ b/model/State/index.js @@ -1,59 +1,55 @@ import _ from "lodash" +import { Config } from "../../components/index.js" import common from "../../lib/common/common.js" import getBotState from "./BotState.js" import getCPU from "./CPU.js" -import { osInfo, si } from "./DependencyChecker.js" import getFastFetch from "./FastFetch.js" -import getFsSize from "./FsSize.js" +import getFsSize, { getDiskSpeed } from "./FsSize.js" import getGPU from "./GPU.js" import Monitor from "./Monitor.js" -import getNetworTestList from "./NetworkLatency.js" +import { getNetworkTestList, getNetwork } from "./Network.js" import getNode from "./NodeInfo.js" +import getOtherInfo, { getCopyright } from "./OtherInfo.js" import getRAM from "./RAM.js" import getSWAP from "./SWAP.js" -import getOtherInfo, { getCopyright } from "./OtherInfo.js" - -export { osInfo, si } export async function getData(e) { // 可视化数据 - let visualData = _.compact(await Promise.all([ - // CPU板块 + const visualData = _.compact(await Promise.all([ getCPU(), - // 内存板块 getRAM(), - // GPU板块 getGPU(), - // Node板块 getNode(), - // SWAP getSWAP() ])) - let promiseTaskList = [ + + const promiseTaskList = [ getFastFetch(e), - getFsSize() + getFsSize(), + getNetworkTestList() ] - let NetworTestList = getNetworTestList() - promiseTaskList.push(NetworTestList) - - let [ FastFetch, HardDisk, psTest ] = await Promise.all(promiseTaskList) + const [ FastFetch, HardDisk, psTest ] = await Promise.all(promiseTaskList) /** bot列表 */ - let BotList = _getBotList(e) - let isBotIndex = /pro/.test(e.msg) && BotList.length > 1 + const BotList = _getBotList(e) + const isBotIndex = /pro/.test(e.msg) && BotList.length > 1 + const chartData = JSON.stringify(common.checkIfEmpty(Monitor.chartData, [ "echarts_theme", "cpu", "ram" ]) ? undefined : Monitor.chartData) + // 配置 + const { closedChart } = Config.state return { BotStatusList: await getBotState(BotList), - chartData: JSON.stringify(common.checkIfEmpty(Monitor.chartData, [ "echarts_theme", "cpu", "ram" ]) ? undefined : Monitor.chartData), + chartData: closedChart ? false : chartData, visualData: _.compact(visualData), otherInfo: getOtherInfo(), psTest: _.isEmpty(psTest) ? undefined : psTest, + fsStats: getDiskSpeed(), + copyright: getCopyright(), + network: getNetwork(), + Config: JSON.stringify(Config.state), + _Config: Config.state, FastFetch, HardDisk, - // 硬盘速率 - fsStats: Monitor.DiskSpeed, - copyright: getCopyright(), - isBotIndex, - network: Monitor.getNetwork + isBotIndex } } diff --git a/resources/state/state_chart.js b/resources/state/js/chart.js similarity index 81% rename from resources/state/state_chart.js rename to resources/state/js/chart.js index 7517f50..2fc8d0f 100644 --- a/resources/state/state_chart.js +++ b/resources/state/js/chart.js @@ -1,25 +1,6 @@ /* eslint-disable no-undef */ -const backdrop = chartData.backdrop -// 背景api -if (backdrop) { - let container = document.getElementById("container") - const img = new Image() - let timer = setTimeout(function() { - img.src = "" - console.log("图像加载超时") - }, 5000) - img.onload = function() { - clearTimeout(timer) - container.style.backgroundImage = "url(" + backdrop + ")" - } - img.onerror = function() { - clearTimeout(timer) - console.log("图像加载出错") - } - img.src = backdrop -} - +// 图表 echarts.registerTheme("westeros", chartData.echarts_theme) const chart = echarts.init(document.getElementById("Chart"), "westeros", { renderer: "svg" diff --git a/resources/state/echarts.min.js b/resources/state/js/echarts.min.js similarity index 100% rename from resources/state/echarts.min.js rename to resources/state/js/echarts.min.js diff --git a/resources/state/js/style.js b/resources/state/js/style.js new file mode 100644 index 0000000..f1d8f1a --- /dev/null +++ b/resources/state/js/style.js @@ -0,0 +1,35 @@ +/* eslint-disable no-undef */ + +const { + BotNameColor, highColor, mediumColor, + lowColor, backdrop, backdropDefault, BotNameColorGradient +} = Config +// 背景api +if (backdrop) { + let container = document.getElementById("container") + const img = new Image() + let timer = setTimeout(function() { + img.src = "" + }, 5000) + img.onload = function() { + clearTimeout(timer) + container.style.backgroundImage = "url(" + backdrop + ")" + } + img.onerror = function() { + container.style.backgroundImage = `url(${_res_path}/state/img/${backdropDefault})` + clearTimeout(timer) + } + img.src = backdrop +} +const BotNameElement = document.querySelector(".header h1") +// 修改BotNameColor +if (BotNameColorGradient && BotNameColorGradient !== "none") { + BotNameElement.style.backgroundImage = `linear-gradient(${BotNameColorGradient})` +} else if (BotNameColor && BotNameColor !== "none") { + BotNameElement.style.backgroundColor = BotNameColor + BotNameElement.style.backgroundImage = "none" +} +const documentElement = document.documentElement +documentElement.style.setProperty("--high-color", highColor) +documentElement.style.setProperty("--medium-color", mediumColor) +documentElement.style.setProperty("--low-color", lowColor) diff --git a/resources/state/monitor.html b/resources/state/monitor.html index cb56ea5..f392ab1 100644 --- a/resources/state/monitor.html +++ b/resources/state/monitor.html @@ -2,7 +2,7 @@ {{block 'css'}} - + {{/block}} {{block 'main'}} +
@@ -54,7 +62,6 @@
-
{{group.title}} {{each group.info info}} @@ -91,37 +98,30 @@ {{if chartData}}
-
- - - +
+ +
+{{/if}} -{{if network}} -
- {{each network}} +{{if network || psTest}} +
+ {{if network}} {{each network}}

{{$value.first}}

{{@$value.tail}}

- {{/each}} -
-{{/if}} - -{{if psTest}} -
- {{each psTest}} + {{/each}} {{/if}} {{if network && psTest}} +
+ {{/if}} {{if psTest}} {{each psTest}}

{{$value.first}}

{{@$value.tail}}

- {{/each}} + {{/each}} {{/if}}
{{/if}} -{{/if}} {{if otherInfo}}
{{each otherInfo}} @@ -135,4 +135,6 @@ {{@FastFetch}} + + {{/block}} \ No newline at end of file