bot/app
3
6.9k
Fork 1
mirror of https://github.com/LiteyukiStudio/LiteyukiBot.git synced 2024-11-26 12:55:06 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/main'

Browse Source
This commit is contained in:
远野千束 2024-08-16 21:38:34 +08:00
commit dd00e6ecec
2 changed files with 72 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/resources/vanilla_resource/templates/css/status.css
View File

@ -100,6 +100,7 @@
z-index: 1; z-index: 1;
} }
/*
.disk-title { .disk-title {
position: absolute; position: absolute;
color: var(--main-text-color); color: var(--main-text-color);
@ -113,6 +114,29 @@
max-width: calc(100% - 40px); max-width: calc(100% - 40px);
z-index: 2; z-index: 2;
} }
*/
.disk-name {
position: absolute;
color: var(--main-text-color);
font-size: 24px;
margin-left: 20px;
text-align: left;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
z-index: 2;
}
.disk-details {
position: absolute;
right: 20px;
/* 调整位置以确保有足够的空间显示 */
color: var(--main-text-color);
font-size: 24px;
text-align: right;
white-space: nowrap;
z-index: 2;
}
#motto-text { #motto-text {
font-size: 36px; font-size: 36px;

74
src/resources/vanilla_resource/templates/js/status.js
View File

@ -91,17 +91,31 @@ function convertSize(size, precision = 2, addUnit = true, suffix = " XiB") {
* @param title * @param title
* @param percent 数据 * @param percent 数据
*/ */
function createBarChart(title, percent) { function createBarChart(title, percent, name) {
// percent为百分比，最大值为100 // percent为百分比，最大值为100
let diskDiv = document.createElement('div') let diskDiv = document.createElement('div');
diskDiv.setAttribute('class', 'disk-info') diskDiv.setAttribute('class', 'disk-info');
diskDiv.style.marginBottom = '20px' diskDiv.style.marginBottom = '20px';
diskDiv.innerHTML = ` diskDiv.innerHTML = `
<div class="disk-title">${title}</div> <div class="disk-name">${name}</div>
<div class="disk-details">${title}</div>
<div class="disk-usage" style="width: ${percent}%"></div> <div class="disk-usage" style="width: ${percent}%"></div>
` `;
return diskDiv updateDiskNameWidth(diskDiv);
return diskDiv;
}
// 更新 .disk-name 宽度
function updateDiskNameWidth(diskInfoElement) {
let diskDetails = diskInfoElement.querySelector('.disk-details');
let diskName = diskInfoElement.querySelector('.disk-name');
let detailsWidth = diskDetails.offsetWidth;
let parentWidth = diskInfoElement.offsetWidth;
let nameMaxWidth = parentWidth - detailsWidth - 20 - 40;
diskName.style.maxWidth = `${nameMaxWidth}px`;
} }
function secondsToTextTime(seconds) { function secondsToTextTime(seconds) {
@ -254,35 +268,34 @@ function main() {
cpuChart.setOption(createPieChartOption(`${localData['cpu']}\n${cpuData['percent'].toFixed(1)}%`, [ cpuChart.setOption(createPieChartOption(`${localData['cpu']}\n${cpuData['percent'].toFixed(1)}%`, [
{name: 'used', value: cpuData['percent']}, { name: 'used', value: cpuData['percent'] },
{name: 'free', value: 100 - cpuData['percent']} { name: 'free', value: 100 - cpuData['percent'] }
])) ]))
memChart.setOption(createPieChartOption(`${localData['memory']}\n${memData['percent'].toFixed(1)}%`, [ memChart.setOption(createPieChartOption(`${localData['memory']}\n${memData['percent'].toFixed(1)}%`, [
{name: 'process', value: memData['usedProcess']}, { name: 'process', value: memData['usedProcess'] },
{name: 'used', value: memData['used'] - memData['usedProcess']}, { name: 'used', value: memData['used'] - memData['usedProcess'] },
{name: 'free', value: memData['free']} { name: 'free', value: memData['free'] }
])) ]))
swapChart.setOption(createPieChartOption(`${localData['swap']}\n${swapData['percent'].toFixed(1)}%`, [ swapChart.setOption(createPieChartOption(`${localData['swap']}\n${swapData['percent'].toFixed(1)}%`, [
{name: 'used', value: swapData['used']}, { name: 'used', value: swapData['used'] },
{name: 'free', value: swapData['free']} { name: 'free', value: swapData['free'] }
])) ]))
// 磁盘信息 // 磁盘信息
const diskData = hardwareData['disk'] const diskData = hardwareData['disk'];
diskData.forEach( diskData.forEach((disk) => {
(disk) => { let diskTitle = `${localData['free']} ${convertSize(disk['free'])} ${localData['total']} ${convertSize(disk['total'])}`;
let diskTitle = `${disk['name']} ${localData['free']} ${convertSize(disk['free'])} ${localData['total']} ${convertSize(disk['total'])}` let diskDiv = createBarChart(diskTitle, disk['percent'], disk['name']);
// 最后一个把margin-bottom去掉
let diskDiv = createBarChart(diskTitle, disk['percent']) if (disk === diskData[diskData.length - 1]) {
if (disk === diskData[diskData.length - 1]) { diskDiv.style.marginBottom = '0';
diskDiv.style.marginBottom = '0' }
} document.getElementById('disk-info').appendChild(diskDiv);
document.getElementById('disk-info').appendChild(createBarChart(diskTitle, disk['percent'])) });
})
// 随机一言 // 随机一言
let motto = mottos[Math.floor(Math.random() * mottos.length)] let motto = mottos[Math.floor(Math.random() * mottos.length)]
let mottoText = motto['text'] let mottoText = motto['text']
@ -293,4 +306,13 @@ function main() {
} }
main() main()
/*
// 窗口大小改变监听器 -- Debug
window.addEventListener('resize', () => {
const diskInfos = document.querySelectorAll('.disk-info');
diskInfos.forEach(diskInfo => {
updateDiskNameWidth(diskInfo);
});
});
*/