mirror of
https://github.com/TriM-Organization/LiteyukiBot-TriM.git
synced 2024-11-11 01:27:29 +08:00
✨ 新版状态页面
This commit is contained in:
parent
857e58d635
commit
5100ca6c77
@ -94,6 +94,9 @@ def get_local_data(lang_code) -> dict:
|
|||||||
"minutes" : lang.get("status.minutes"),
|
"minutes" : lang.get("status.minutes"),
|
||||||
"seconds" : lang.get("status.seconds"),
|
"seconds" : lang.get("status.seconds"),
|
||||||
"runtime" : lang.get("status.runtime"),
|
"runtime" : lang.get("status.runtime"),
|
||||||
|
"threads" : lang.get("status.threads"),
|
||||||
|
"cores" : lang.get("status.cores"),
|
||||||
|
"process" : lang.get("status.process"),
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -149,7 +152,7 @@ async def get_hardware_data() -> dict:
|
|||||||
all_processes = psutil.Process().children(recursive=True)
|
all_processes = psutil.Process().children(recursive=True)
|
||||||
all_processes.append(psutil.Process())
|
all_processes.append(psutil.Process())
|
||||||
|
|
||||||
mem_used_bot = 0
|
mem_used_process = 0
|
||||||
process_mem = {}
|
process_mem = {}
|
||||||
for process in all_processes:
|
for process in all_processes:
|
||||||
try:
|
try:
|
||||||
@ -157,7 +160,7 @@ async def get_hardware_data() -> dict:
|
|||||||
if ps_name not in process_mem:
|
if ps_name not in process_mem:
|
||||||
process_mem[ps_name] = 0
|
process_mem[ps_name] = 0
|
||||||
process_mem[ps_name] += process.memory_info().rss
|
process_mem[ps_name] += process.memory_info().rss
|
||||||
mem_used_bot += process.memory_info().rss
|
mem_used_process += process.memory_info().rss
|
||||||
except Exception:
|
except Exception:
|
||||||
pass
|
pass
|
||||||
swap = psutil.swap_memory()
|
swap = psutil.swap_memory()
|
||||||
@ -169,31 +172,34 @@ async def get_hardware_data() -> dict:
|
|||||||
else:
|
else:
|
||||||
brand = "Unknown"
|
brand = "Unknown"
|
||||||
result = {
|
result = {
|
||||||
"cpu" : {
|
"cpu" : {
|
||||||
"percent": psutil.cpu_percent(),
|
"percent": psutil.cpu_percent(),
|
||||||
"name" : f"{brand} {cpuinfo.get_cpu_info().get('arch', 'Unknown')}",
|
"name" : f"{brand} {cpuinfo.get_cpu_info().get('arch', 'Unknown')}",
|
||||||
"cores" : psutil.cpu_count(logical=False),
|
"cores" : psutil.cpu_count(logical=False),
|
||||||
"threads": psutil.cpu_count(logical=True),
|
"threads": psutil.cpu_count(logical=True),
|
||||||
"freq" : psutil.cpu_freq().current # MHz
|
"freq" : psutil.cpu_freq().current # MHz
|
||||||
},
|
},
|
||||||
"memory" : {
|
"memory": {
|
||||||
"percent": mem.percent,
|
"percent" : mem.percent,
|
||||||
"total" : mem.total,
|
"total" : mem.total,
|
||||||
"used" : mem.used,
|
"used" : mem.used,
|
||||||
"free" : mem.free,
|
"free" : mem.free,
|
||||||
|
"usedProcess": mem_used_process,
|
||||||
},
|
},
|
||||||
"swap": {
|
"swap" : {
|
||||||
"percent": swap.percent,
|
"percent": swap.percent,
|
||||||
"total" : swap.total,
|
"total" : swap.total,
|
||||||
"used" : swap.used,
|
"used" : swap.used,
|
||||||
"free" : swap.free
|
"free" : swap.free
|
||||||
},
|
},
|
||||||
"disk": [],
|
"disk" : [],
|
||||||
}
|
}
|
||||||
|
|
||||||
for disk in psutil.disk_partitions(all=True):
|
for disk in psutil.disk_partitions(all=True):
|
||||||
try:
|
try:
|
||||||
disk_usage = psutil.disk_usage(disk.mountpoint)
|
disk_usage = psutil.disk_usage(disk.mountpoint)
|
||||||
|
if disk_usage.total == 0:
|
||||||
|
continue # 虚拟磁盘
|
||||||
result["disk"].append({
|
result["disk"].append({
|
||||||
"name" : disk.mountpoint,
|
"name" : disk.mountpoint,
|
||||||
"percent": disk_usage.percent,
|
"percent": disk_usage.percent,
|
||||||
|
@ -10,9 +10,9 @@ require("nonebot_plugin_alconna")
|
|||||||
from nonebot_plugin_alconna import on_alconna, Alconna, Args, Subcommand, Arparma, UniMessage
|
from nonebot_plugin_alconna import on_alconna, Alconna, Args, Subcommand, Arparma, UniMessage
|
||||||
|
|
||||||
status_alc = on_alconna(
|
status_alc = on_alconna(
|
||||||
aliases={"#状态"},
|
aliases={"状态"},
|
||||||
command=Alconna(
|
command=Alconna(
|
||||||
"#status",
|
"status",
|
||||||
Subcommand(
|
Subcommand(
|
||||||
"memory",
|
"memory",
|
||||||
alias={"mem", "m", "内存"},
|
alias={"mem", "m", "内存"},
|
||||||
|
@ -152,4 +152,7 @@ status.runtime=运行时间
|
|||||||
status.days=天
|
status.days=天
|
||||||
status.hours=时
|
status.hours=时
|
||||||
status.minutes=分
|
status.minutes=分
|
||||||
status.seconds=秒
|
status.seconds=秒
|
||||||
|
status.cores=核心
|
||||||
|
status.threads=线程
|
||||||
|
status.process=进程
|
@ -2,6 +2,8 @@
|
|||||||
--main-text-color: #fff;
|
--main-text-color: #fff;
|
||||||
--sub-text-color: #bbb;
|
--sub-text-color: #bbb;
|
||||||
--tip-text-color: #888;
|
--tip-text-color: #888;
|
||||||
|
|
||||||
|
--device-info-width: 240px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bot-info {
|
.bot-info {
|
||||||
@ -57,4 +59,72 @@
|
|||||||
background: var(--tip-text-color);
|
background: var(--tip-text-color);
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#hardware-info {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-info {
|
||||||
|
max-width: 30%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-chart {
|
||||||
|
display: flex;
|
||||||
|
height: var(--device-info-width);
|
||||||
|
width: var(--device-info-width);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-tags {
|
||||||
|
text-align: center;
|
||||||
|
color: var(--sub-text-color);
|
||||||
|
font-size: 24px;
|
||||||
|
max-width: var(--device-info-width);
|
||||||
|
word-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
.disk-info {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
background-color: #ffffff44;
|
||||||
|
border-radius: 30px;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.disk-usage {
|
||||||
|
background-color: #a2d8f4;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 30px;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.disk-title {
|
||||||
|
position: absolute;
|
||||||
|
color: var(--main-text-color);
|
||||||
|
font-size: 24px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-left: 20px;
|
||||||
|
text-align: left;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
#motto-text {
|
||||||
|
font-size: 36px;
|
||||||
|
word-wrap: break-word;
|
||||||
|
color: var(--main-text-color);
|
||||||
|
text-align: center;
|
||||||
|
margin: 30px 0 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#motto-from {
|
||||||
|
font-size: 24px;
|
||||||
|
font-style: italic;
|
||||||
|
color: var(--sub-text-color);
|
||||||
|
text-align: right;
|
||||||
}
|
}
|
Binary file not shown.
Before Width: | Height: | Size: 2.6 MiB |
Binary file not shown.
Before Width: | Height: | Size: 6.1 MiB |
Binary file not shown.
Before Width: | Height: | Size: 2.6 MiB |
@ -1,14 +0,0 @@
|
|||||||
const bgs = [
|
|
||||||
"bg1.png",
|
|
||||||
"bg2.png",
|
|
||||||
"bg3.png",
|
|
||||||
"bg4.png",
|
|
||||||
"bg5.png",
|
|
||||||
"bg6.png",
|
|
||||||
"bg7.png",
|
|
||||||
"bg8.png",
|
|
||||||
"bg9.png",
|
|
||||||
"bg10.png",
|
|
||||||
]
|
|
||||||
// 随机选择背景图片
|
|
||||||
document.body.style.backgroundImage = `url(./img/${bgs[Math.floor(Math.random() * bgs.length)]})`;
|
|
@ -1,14 +1,11 @@
|
|||||||
const bgs = [
|
const bgs = [
|
||||||
"bg1.png",
|
"bg1.png",
|
||||||
"bg2.png",
|
|
||||||
"bg3.png",
|
"bg3.png",
|
||||||
"bg4.png",
|
"bg4.png",
|
||||||
"bg5.png",
|
"bg5.png",
|
||||||
"bg6.png",
|
"bg6.png",
|
||||||
"bg7.png",
|
"bg7.png",
|
||||||
"bg8.png",
|
|
||||||
"bg9.png",
|
"bg9.png",
|
||||||
"bg10.png",
|
|
||||||
]
|
]
|
||||||
// 随机选择背景图片
|
// 随机选择背景图片
|
||||||
document.body.style.backgroundImage = `url(./img/${bgs[Math.floor(Math.random() * bgs.length)]})`;
|
document.body.style.backgroundImage = `url(./img/${bgs[Math.floor(Math.random() * bgs.length)]})`;
|
||||||
|
@ -6,7 +6,7 @@ const mottos = [
|
|||||||
"source": "《琵琶行》"
|
"source": "《琵琶行》"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"text": "海Memory知己,天涯若比邻。",
|
"text": "海内存知己,天涯若比邻。",
|
||||||
"author": "王勃",
|
"author": "王勃",
|
||||||
"source": "《送杜少府之任蜀州》"
|
"source": "《送杜少府之任蜀州》"
|
||||||
},
|
},
|
||||||
@ -20,6 +20,16 @@ const mottos = [
|
|||||||
"author": "苏轼",
|
"author": "苏轼",
|
||||||
"source": "《水调歌头》"
|
"source": "《水调歌头》"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"text": "人生自古谁无死,留取丹心照汗青。",
|
||||||
|
"author": "文天祥",
|
||||||
|
"source": "《过零丁洋》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "山重水复疑无路,柳暗花明又一村。",
|
||||||
|
"author": "陆游",
|
||||||
|
"source": "《游山西村》"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"text": "逸一时,误一世,逸久逸久罢已龄",
|
"text": "逸一时,误一世,逸久逸久罢已龄",
|
||||||
"author": "田所浩二",
|
"author": "田所浩二",
|
||||||
@ -46,8 +56,58 @@ const mottos = [
|
|||||||
"source": "轻雪文档"
|
"source": "轻雪文档"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"text": "你知道吗,轻雪的主题是基于Vue.js开发的",
|
"text": "你知道吗,轻雪的主题是基于HTML5开发的",
|
||||||
"author": "SnowyKami",
|
"author": "SnowyKami",
|
||||||
"source": "轻雪文档"
|
"source": "轻雪文档"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "路漫漫其修远兮,吾将上下而求索。",
|
||||||
|
"author": "屈原",
|
||||||
|
"source": "《离骚》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "千里之行,始于足下。",
|
||||||
|
"author": "老子",
|
||||||
|
"source": "《道德经》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "读书破万卷,下笔如有神。",
|
||||||
|
"author": "杜甫",
|
||||||
|
"source": "《奉赠韦左丞丈二十韵》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "不登高山,不知天之高也;不临深溪,不知地之厚也。",
|
||||||
|
"author": "荀子",
|
||||||
|
"source": "《劝学》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "知之者不如好之者,好之者不如乐之者。",
|
||||||
|
"author": "孔子",
|
||||||
|
"source": "《论语》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "天行健,君子以自强不息;地势坤,君子以厚德载物。",
|
||||||
|
"source": "《易经》",
|
||||||
|
"author": ""
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "书山有路勤为径,学海无涯苦作舟。",
|
||||||
|
"author": "韩愈",
|
||||||
|
"source": "《读书有感》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "前事不忘,后事之师。",
|
||||||
|
"author": "孔子",
|
||||||
|
"source": "《论语》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "志当存高远,若樽俎断绝。",
|
||||||
|
"author": "陶渊明",
|
||||||
|
"source": "《饮酒》"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"text": "不以物喜,不以己悲。",
|
||||||
|
"author": "傅子",
|
||||||
|
"source": "《傅子》"
|
||||||
}
|
}
|
||||||
]
|
]
|
@ -19,7 +19,8 @@ function createPieChartOption(title, data) {
|
|||||||
top: 'center',
|
top: 'center',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
fontSize: 30
|
fontSize: 30,
|
||||||
|
lineHeight: 36
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
@ -90,8 +91,17 @@ function convertSize(size, precision = 2, addUnit = true, suffix = " XiB") {
|
|||||||
* @param title
|
* @param title
|
||||||
* @param percent 数据
|
* @param percent 数据
|
||||||
*/
|
*/
|
||||||
function createBarChartOption(title, percent) {
|
function createBarChart(title, percent) {
|
||||||
// percent为百分比,最大值为100
|
// percent为百分比,最大值为100
|
||||||
|
let diskDiv = document.createElement('div')
|
||||||
|
diskDiv.setAttribute('class', 'disk-info')
|
||||||
|
diskDiv.style.marginBottom = '20px'
|
||||||
|
diskDiv.innerHTML = `
|
||||||
|
<div class="disk-title">${title}</div>
|
||||||
|
<div class="disk-usage" style="width: ${percent}%"></div>
|
||||||
|
`
|
||||||
|
|
||||||
|
return diskDiv
|
||||||
}
|
}
|
||||||
|
|
||||||
function secondsToTextTime(seconds) {
|
function secondsToTextTime(seconds) {
|
||||||
@ -112,7 +122,7 @@ function main() {
|
|||||||
|
|
||||||
// 设置机器人信息
|
// 设置机器人信息
|
||||||
botInfoDiv.className = 'info-box bot-info'
|
botInfoDiv.className = 'info-box bot-info'
|
||||||
console.log(botInfoDiv.querySelector('.bot-icon-img'))
|
|
||||||
botInfoDiv.querySelector('.bot-icon-img').setAttribute('src', bot['icon'])
|
botInfoDiv.querySelector('.bot-icon-img').setAttribute('src', bot['icon'])
|
||||||
botInfoDiv.querySelector('.bot-name').innerText = bot['name']
|
botInfoDiv.querySelector('.bot-name').innerText = bot['name']
|
||||||
let tagArray = [
|
let tagArray = [
|
||||||
@ -144,7 +154,7 @@ function main() {
|
|||||||
liteyukiInfoDiv.className = 'info-box bot-info'
|
liteyukiInfoDiv.className = 'info-box bot-info'
|
||||||
liteyukiInfoDiv.querySelector('.bot-icon-img').setAttribute('src', './img/liteyuki.png')
|
liteyukiInfoDiv.querySelector('.bot-icon-img').setAttribute('src', './img/liteyuki.png')
|
||||||
liteyukiInfoDiv.querySelector('.bot-name').innerText = liteyukiData['name']
|
liteyukiInfoDiv.querySelector('.bot-name').innerText = liteyukiData['name']
|
||||||
console.log(liteyukiData)
|
|
||||||
let tagArray = [
|
let tagArray = [
|
||||||
`Liteyuki ${liteyukiData['version']}`,
|
`Liteyuki ${liteyukiData['version']}`,
|
||||||
`Nonebot ${liteyukiData['nonebot']}`,
|
`Nonebot ${liteyukiData['nonebot']}`,
|
||||||
@ -173,12 +183,12 @@ function main() {
|
|||||||
|
|
||||||
const cpuTagArray = [
|
const cpuTagArray = [
|
||||||
cpuData['name'],
|
cpuData['name'],
|
||||||
`${cpuData['cores']}C ${cpuData['threads']}T`,
|
`${cpuData['cores']}${localData['cores']} ${cpuData['threads']}${localData['threads']}`,
|
||||||
`${(cpuData['freq'] / 1000).toFixed(2)}GHz`
|
`${(cpuData['freq'] / 1000).toFixed(2)}GHz`
|
||||||
]
|
]
|
||||||
|
|
||||||
const memTagArray = [
|
const memTagArray = [
|
||||||
`Bot ${convertSize(memData['bot'])}`,
|
`${localData['process']} ${convertSize(memData['usedProcess'])}`,
|
||||||
`${localData['used']} ${convertSize(memData['used'])}`,
|
`${localData['used']} ${convertSize(memData['used'])}`,
|
||||||
`${localData['free']} ${convertSize(memData['free'])}`,
|
`${localData['free']} ${convertSize(memData['free'])}`,
|
||||||
`${localData['total']} ${convertSize(memData['total'])}`
|
`${localData['total']} ${convertSize(memData['total'])}`
|
||||||
@ -189,7 +199,96 @@ function main() {
|
|||||||
`${localData['free']} ${convertSize(swapData['free'])}`,
|
`${localData['free']} ${convertSize(swapData['free'])}`,
|
||||||
`${localData['total']} ${convertSize(swapData['total'])}`
|
`${localData['total']} ${convertSize(swapData['total'])}`
|
||||||
]
|
]
|
||||||
console.log(cpuTagArray, memTagArray, swapTagArray)
|
let cpuDeviceInfoDiv = document.importNode(document.getElementById('device-info').content, true)
|
||||||
|
let memDeviceInfoDiv = document.importNode(document.getElementById('device-info').content, true)
|
||||||
|
let swapDeviceInfoDiv = document.importNode(document.getElementById('device-info').content, true)
|
||||||
|
|
||||||
|
cpuDeviceInfoDiv.querySelector('.device-info').setAttribute('id', 'cpu-info')
|
||||||
|
memDeviceInfoDiv.querySelector('.device-info').setAttribute('id', 'mem-info')
|
||||||
|
swapDeviceInfoDiv.querySelector('.device-info').setAttribute('id', 'swap-info')
|
||||||
|
cpuDeviceInfoDiv.querySelector('.device-chart').setAttribute('id', 'cpu-chart')
|
||||||
|
memDeviceInfoDiv.querySelector('.device-chart').setAttribute('id', 'mem-chart')
|
||||||
|
swapDeviceInfoDiv.querySelector('.device-chart').setAttribute('id', 'swap-chart')
|
||||||
|
|
||||||
|
let devices = {
|
||||||
|
'cpu': cpuDeviceInfoDiv,
|
||||||
|
'mem': memDeviceInfoDiv,
|
||||||
|
'swap': swapDeviceInfoDiv
|
||||||
|
}
|
||||||
|
// 遍历添加标签
|
||||||
|
for (let device in devices) {
|
||||||
|
let tagArray = []
|
||||||
|
switch (device) {
|
||||||
|
case 'cpu':
|
||||||
|
tagArray = cpuTagArray
|
||||||
|
break
|
||||||
|
case 'mem':
|
||||||
|
tagArray = memTagArray
|
||||||
|
break
|
||||||
|
case 'swap':
|
||||||
|
tagArray = swapTagArray
|
||||||
|
break
|
||||||
|
}
|
||||||
|
tagArray.forEach(
|
||||||
|
(tag, index) => {
|
||||||
|
let tagDiv = document.createElement('div')
|
||||||
|
tagDiv.className = 'device-tag'
|
||||||
|
tagDiv.innerText = tag
|
||||||
|
// 给最后一个标签不添加后缀
|
||||||
|
tagDiv.setAttribute('suffix', index === tagArray.length - 1 ? '0' : '1')
|
||||||
|
devices[device].querySelector('.device-tags').appendChild(tagDiv)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 插入
|
||||||
|
document.getElementById('hardware-info').appendChild(cpuDeviceInfoDiv)
|
||||||
|
document.getElementById('hardware-info').appendChild(memDeviceInfoDiv)
|
||||||
|
document.getElementById('hardware-info').appendChild(swapDeviceInfoDiv)
|
||||||
|
|
||||||
|
let cpuChart = echarts.init(document.getElementById('cpu-chart'))
|
||||||
|
let memChart = echarts.init(document.getElementById('mem-chart'))
|
||||||
|
let swapChart = echarts.init(document.getElementById('swap-chart'))
|
||||||
|
|
||||||
|
|
||||||
|
cpuChart.setOption(createPieChartOption(`${localData['cpu']}\n${cpuData['percent'].toFixed(1)}%`, [
|
||||||
|
{name: 'used', value: cpuData['percent']},
|
||||||
|
{name: 'free', value: 100 - cpuData['percent']}
|
||||||
|
]))
|
||||||
|
|
||||||
|
memChart.setOption(createPieChartOption(`${localData['memory']}\n${memData['percent'].toFixed(1)}%`, [
|
||||||
|
{name: 'process', value: memData['usedProcess']},
|
||||||
|
{name: 'used', value: memData['used'] - memData['usedProcess']},
|
||||||
|
{name: 'free', value: memData['free']}
|
||||||
|
]))
|
||||||
|
|
||||||
|
|
||||||
|
swapChart.setOption(createPieChartOption(`${localData['swap']}\n${swapData['percent'].toFixed(1)}%`, [
|
||||||
|
{name: 'used', value: swapData['used']},
|
||||||
|
{name: 'free', value: swapData['free']}
|
||||||
|
]))
|
||||||
|
|
||||||
|
|
||||||
|
// 磁盘信息
|
||||||
|
const diskData = hardwareData['disk']
|
||||||
|
diskData.forEach(
|
||||||
|
(disk) => {
|
||||||
|
let diskTitle = `${disk['name']} ${localData['free']} ${convertSize(disk['free'])} ${localData['total']} ${convertSize(disk['total'])}`
|
||||||
|
// 最后一个把margin-bottom去掉
|
||||||
|
let diskDiv = createBarChart(diskTitle, disk['percent'])
|
||||||
|
if (disk === diskData[diskData.length - 1]) {
|
||||||
|
diskDiv.style.marginBottom = '0'
|
||||||
|
}
|
||||||
|
document.getElementById('disk-info').appendChild(createBarChart(diskTitle, disk['percent']))
|
||||||
|
})
|
||||||
|
// 随机一言
|
||||||
|
let motto = mottos[Math.floor(Math.random() * mottos.length)]
|
||||||
|
let mottoText = motto['text']
|
||||||
|
let mottoFrom = `${motto['author']} ${motto['source']}`
|
||||||
|
document.getElementById('motto-text').innerText = mottoText
|
||||||
|
document.getElementById('motto-from').innerText = mottoFrom
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -6,6 +6,7 @@
|
|||||||
<link rel="stylesheet" href="./css/card.css">
|
<link rel="stylesheet" href="./css/card.css">
|
||||||
<link rel="stylesheet" href="./css/status.css">
|
<link rel="stylesheet" href="./css/status.css">
|
||||||
<link rel="stylesheet" href="./css/fonts.css">
|
<link rel="stylesheet" href="./css/fonts.css">
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<template id="bot-template">
|
<template id="bot-template">
|
||||||
@ -25,11 +26,24 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<template id="device-info">
|
||||||
|
<div class="device-info">
|
||||||
|
<div class="device-chart">
|
||||||
|
</div>
|
||||||
|
<div class="device-tags">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<div class="data-storage" id="data">{{ data | tojson }}</div>
|
<div class="data-storage" id="data">{{ data | tojson }}</div>
|
||||||
<div class="info-box" id="hardware-info"></div>
|
<div class="info-box" id="hardware-info"></div>
|
||||||
<div class="info-box" id="disk-info"></div>
|
<div class="info-box" id="disk-info"></div>
|
||||||
<div class="info-box" id="motto-info"></div>
|
<div class="info-box" id="motto-info">
|
||||||
|
<div id="motto-text"></div>
|
||||||
|
<div id="motto-from"></div>
|
||||||
|
</div>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.3.0/echarts.min.js"></script>
|
||||||
|
<script src="./js/motto.js"></script>
|
||||||
<script src="./js/card.js"></script>
|
<script src="./js/card.js"></script>
|
||||||
<script src="./js/status.js"></script>
|
<script src="./js/status.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
Loading…
Reference in New Issue
Block a user