✔❤大更新!

This commit is contained in:
2024-07-18 03:22:33 +08:00
parent 93ced26e07
commit 1116d033d0
35 changed files with 953 additions and 443 deletions

View File

@ -125,3 +125,10 @@
text-align: right;
}
#addition-info {
font-size: 36px;
word-wrap: break-word;
color: var(--main-text-color);
text-align: center;
margin: 30px 0 10px 0;
}

View File

@ -3,7 +3,7 @@ body {
background-size: cover;
background-position: center;
color: white;
/ / 10px10px0px / / margin: 24 px;
/* // 上10px左右10px下0px // margin: 24 px; */
margin: 20px;
}
@ -55,7 +55,8 @@ body {
background-color: white;
}
.bot-name, .bot-tag {
.bot-name,
.bot-tag {
margin-left: 20px;
}
@ -98,4 +99,9 @@ body {
font-size: 30px;
font-style: italic;
color: #ccc;
}
.addition-info {
font-size: 36px;
color: #fff;
}

View File

@ -3,6 +3,7 @@ const bot_data = data['bot']; // 机器人数据
const hardwareData = data['hardware']; // 硬件数据
const liteyukiData = data['liteyuki']; // LiteYuki数据
const localData = data['localization']; // 本地化语言数据
const motto_ = data['motto']; // 言论数据
/**
* 创建CPU/内存/交换饼图
@ -61,10 +62,10 @@ function createPieChartOption(title, data) {
}
function convertSize(size, precision = 2, addUnit = true, suffix = " XiB") {
function convertSize(size, precision = 2, addUnit = true, suffix = " X字节") {
let isNegative = size < 0;
size = Math.abs(size);
let units = ["", "K", "M", "G", "T", "P", "E", "Z"];
let units = ["", "", "", "", "", "", "", ""];
let unit = "";
for (let i = 0; i < units.length; i++) {
@ -254,20 +255,20 @@ function main() {
cpuChart.setOption(createPieChartOption(`${localData['cpu']}\n${cpuData['percent'].toFixed(1)}%`, [
{name: 'used', value: cpuData['percent']},
{name: 'free', value: 100 - cpuData['percent']}
{ 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']}
{ 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']}
{ name: 'used', value: swapData['used'] },
{ name: 'free', value: swapData['free'] }
]))
@ -284,12 +285,12 @@ function main() {
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']}`
let mottoText = motto_['text']
let mottoFrom = motto_['source']
document.getElementById('motto-text').innerText = mottoText
document.getElementById('motto-from').innerText = mottoFrom
// 致谢
document.getElementById('addition-info').innerText = '感谢 锅炉 云裳工作室 提供服务器支持'
}

View File

@ -103,7 +103,7 @@
)
// 从/js/motto.js中读取mottos{},随机选择一句
let motto = mottos[Math.floor(Math.random() * mottos.length)];
// let motto = mottos[Math.floor(Math.random() * mottos.length)];
// 正文在中间,作者和来源格式为--作者 来源,在右下方
let mottoDiv = document.getElementById('motto-info');
let mottoText = document.createElement('div');
@ -113,13 +113,13 @@
let mottoAuthor = document.createElement('div');
mottoAuthor.className = 'motto-author';
// motto.author和motto.source可能不存在为空所以要判断
if (!motto.author) {
motto.author = '';
}
// if (!motto.author) {
// motto.author = '';
// }
if (!motto.source) {
motto.source = '';
}
mottoAuthor.innerText = `\n--${motto.author} ${motto.source}`;
mottoAuthor.innerText = `\n${motto.source}`;
mottoAuthor.style.textAlign = 'right';
mottoDiv.appendChild(mottoAuthor);

View File

@ -10,31 +10,33 @@
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.3.0/echarts.min.js"></script>
</head>
<body>
<div class="info-box" id="hardware-info">
<div class="pie-info" id="cpu-info">
<div class="pie-chart" id="cpu-chart"></div>
<div class="info-box" id="hardware-info">
<div class="pie-info" id="cpu-info">
<div class="pie-chart" id="cpu-chart"></div>
</div>
<div class="pie-info" id="mem-info">
<div class="pie-chart" id="mem-chart"></div>
</div>
<div class="pie-info" id="swap-info">
<div class="pie-chart" id="swap-chart"></div>
</div>
</div>
<div class="pie-info" id="mem-info">
<div class="pie-chart" id="mem-chart"></div>
<div class="info-box" id="disks-info">
</div>
<div class="pie-info" id="swap-info">
<div class="pie-chart" id="swap-chart"></div>
<div class="info-box" id="motto-info">
</div>
</div>
<div class="info-box" id="disks-info">
</div>
<div class="info-box" id="motto-info">
</div>
<!--储存数据div不显示-->
<div id="data" style="display: none">{{ data | tojson }}</div>
<script src="js/bg.js"></script>
<script src="js/motto.js"></script>
<script src="js/style.js"></script>
<!--储存数据div不显示-->
<div id="data" style="display: none">{{ data | tojson }}</div>
<script src="js/bg.js"></script>
<!-- <script src="js/motto.js"></script> -->
<script src="js/style.js"></script>
</body>
</html>
</html>

View File

@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Liteyuki Status</title>
@ -8,43 +9,46 @@
<link rel="stylesheet" href="./css/fonts.css">
</head>
<body>
<template id="bot-template">
<div class="info-box bot-info">
<div class="bot-icon">
<img class="bot-icon-img" src="" alt="bot-icon">
</div>
<div class="bot-detail">
<div class="bot-name">
Liteyuki
<template id="bot-template">
<div class="info-box bot-info">
<div class="bot-icon">
<img class="bot-icon-img" src="" alt="bot-icon">
</div>
<hr>
<div class="bot-tags">
<!-- tag span-->
<div class="bot-detail">
<div class="bot-name">
TriM-Liteyuki
</div>
<hr>
<div class="bot-tags">
<!-- tag span-->
</div>
</div>
</div>
</div>
</template>
</template>
<template id="device-info">
<div class="device-info">
<div class="device-chart">
<template id="device-info">
<div class="device-info">
<div class="device-chart">
</div>
<div class="device-tags">
</div>
</div>
<div class="device-tags">
</div>
</div>
</template>
</template>
<div class="data-storage" id="data">{{ data | tojson }}</div>
<div class="info-box" id="hardware-info"></div>
<div class="info-box" id="disk-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/5.5.0/echarts.min.js"></script>
<script src="./js/motto.js"></script>
<script src="./js/card.js"></script>
<script src="./js/status.js"></script>
<div class="data-storage" id="data">{{ data | tojson }}</div>
<div class="info-box" id="hardware-info"></div>
<div class="info-box" id="disk-info"></div>
<div class="info-box" id="motto-info">
<div id="motto-text"></div>
<div id="motto-from"></div>
</div>
<div class="info-box" id="addition-info"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.5.0/echarts.min.js"></script>
<!-- <script src="./js/motto.js"></script> -->
<script src="./js/card.js"></script>
<script src="./js/status.js"></script>
</body>
</html>

View File

@ -49,7 +49,8 @@
background-color: white;
}
.bot-name, .bot-tag {
.bot-name,
.bot-tag {
margin-left: 20px;
}
@ -93,35 +94,36 @@
font-style: italic;
color: #ccc;
}
</style>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@4.3.0/dist/echarts.min.js"></script>
</head>
<body>
<div class="info-box" id="hardware-info">
<div class="pie-info" id="cpu-info">
<div class="pie-chart" id="cpu-chart"></div>
<div class="info-box" id="hardware-info">
<div class="pie-info" id="cpu-info">
<div class="pie-chart" id="cpu-chart"></div>
</div>
<div class="pie-info" id="mem-info">
<div class="pie-chart" id="mem-chart"></div>
</div>
<div class="pie-info" id="swap-info">
<div class="pie-chart" id="swap-chart"></div>
</div>
</div>
<div class="pie-info" id="mem-info">
<div class="pie-chart" id="mem-chart"></div>
<div class="info-box" id="disks-info">
</div>
<div class="pie-info" id="swap-info">
<div class="pie-chart" id="swap-chart"></div>
<div class="info-box" id="motto-info">
</div>
</div>
<div class="info-box" id="disks-info">
</div>
<div class="info-box" id="motto-info">
</div>
<!--储存数据div不显示-->
<div id="data" style="display: none">{{ data | tojson }}</div>
<script src="js/motto.js"></script>
<script src="js/style.js"></script>
<!--储存数据div不显示-->
<div id="data" style="display: none">{{ data | tojson }}</div>
<!-- <script src="js/motto.js"></script> -->
<script src="js/style.js"></script>
</body>
</html>
</html>