spark-store-project/ServerStatus
15
0
Fork 0
mirror of https://github.com//cppla/ServerStatus synced 2025-09-05 01:12:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
cppla 2025-08-31 22:38:03 +08:00
parent ae648fbe66
commit c089ac7834
2 changed files with 38 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web/css/app.css
View File

@ -242,6 +242,9 @@ table.data tbody tr.high-load:hover{background:rgba(239,68,68,.26) !important;}
table.data tbody tr[class*="os-"]{box-shadow:inset 4px 0 0 0 var(--os-color, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--os-color, transparent) 10%, transparent), transparent 60%);}
table.data tbody tr[class*="os-"]:hover{background:linear-gradient(180deg, color-mix(in srgb, var(--os-color, transparent) 16%, transparent), transparent 65%);}
.cards .card[class*="os-"]{border-color:color-mix(in srgb, var(--os-color, var(--accent)) 60%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--os-color, var(--accent)) 40%, transparent),0 4px 16px -6px color-mix(in srgb, var(--os-color, #000) 35%, transparent);}
/* 弹窗 OS 着色：左侧彩条 + 渐变与卡片一致 */
/* 取消弹窗背景着色，改为仅在标题展示系统胶囊 */
.os-chip{display:inline-flex;align-items:center;padding:2px 8px;margin-left:.5rem;border-radius:999px;font-size:12px;font-weight:600;line-height:1.2;background:var(--os-color, var(--border));color:#fff;border:0;white-space:nowrap;}
/* 为常见系统赋色 */
.os-linux{--os-color: rgba(16,185,129,.85);} /* emerald */

36
web/js/app.js
View File

@ -53,6 +53,32 @@ function osClass(os){
return pick(v.replace(/[^a-z0-9_-]+/g,'-').slice(0,20));
}
// 将服务端 os 字段转为友好的显示名称
function osLabel(os){
if(!os) return '';
const v = String(os).toLowerCase();
const is = (k)=>v.includes(k);
if(is('ubuntu')) return 'Ubuntu';
if(is('debian')) return 'Debian';
if(is('centos')) return 'CentOS';
if(is('rocky')) return 'Rocky Linux';
if(is('alma')) return 'AlmaLinux';
if(is('rhel') || is('redhat')) return 'Red Hat Enterprise Linux';
if(is('arch')) return 'Arch Linux';
if(is('alpine')) return 'Alpine Linux';
if(is('fedora')) return 'Fedora';
if(is('amazon')) return 'Amazon Linux';
if(is('suse')) return 'SUSE Linux';
if(is('freebsd')) return 'FreeBSD';
if(is('openbsd')) return 'OpenBSD';
if(is('netbsd') || is('bsd')) return 'BSD';
if(is('darwin') || is('macos') || is('os x') || is('osx') || is('apple') || is('mac')) return 'macOS';
if(is('win')) return 'Windows';
if(is('linux')) return 'Linux';
// 默认：首字母大写
return String(os).charAt(0).toUpperCase() + String(os).slice(1);
}
async function fetchData(){
try {
const r = await fetch('json/stats.json?_='+Date.now());
@ -336,7 +362,15 @@ function openDetail(i){
const s = S.servers[i]; if(!s) return;
const box = document.getElementById('detailContent');
const modal = document.getElementById('detailModal');
document.getElementById('detailTitle').textContent = s.name + ' 详情';
const osText = osLabel(s.os);
const titleEl = document.getElementById('detailTitle');
titleEl.textContent = s.name + ' 详情';
if(osText){
const chip = document.createElement('span');
chip.className = 'os-chip' + osClass(s.os);
chip.textContent = osText;
titleEl.appendChild(chip);
}
const offline = !(s.online4||s.online6);
const memPct = s.memory_total? (s.memory_used/s.memory_total*100):0;
const swapPct = s.swap_total? (s.swap_used/s.swap_total*100):0;