fix: col-disk独立列 默认隐藏 有分区时显示
This commit is contained in:
@@ -56,14 +56,34 @@
|
|||||||
.node-notes { font-size:.75rem; color:var(--text-dim); font-style:italic; margin-bottom:8px }
|
.node-notes { font-size:.75rem; color:var(--text-dim); font-style:italic; margin-bottom:8px }
|
||||||
/* 横版布局 — 左设备信息 | 右数据+图表同行 */
|
/* 横版布局 — 左设备信息 | 右数据+图表同行 */
|
||||||
#sentinel-grid.layout-row { display:flex;flex-direction:column;gap:12px }
|
#sentinel-grid.layout-row { display:flex;flex-direction:column;gap:12px }
|
||||||
#sentinel-grid.layout-row .node-card { display:grid;grid-template-columns:160px 1fr 0.8fr 0.8fr 1fr;gap:12px 16px;align-items:start }
|
#sentinel-grid.layout-row .node-card { display:grid;grid-template-columns:160px 1fr 0.6fr 0.6fr 0.8fr 1fr;gap:12px 16px;align-items:start }
|
||||||
#sentinel-grid.layout-row .col-left { min-width:0 }
|
#sentinel-grid.layout-row .col-left { min-width:0 }
|
||||||
#sentinel-grid.layout-row .col-right-stack { display:flex;flex-direction:column;gap:12px;min-width:0 }
|
#sentinel-grid.layout-row .col-right-stack { display:flex;flex-direction:column;gap:12px;min-width:0 }
|
||||||
|
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 4px }
|
||||||
|
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
|
||||||
|
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
||||||
|
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }
|
||||||
|
#sentinel-grid.layout-row .part-name { font-weight:500;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
|
||||||
|
#sentinel-grid.layout-row .part-mount { color:var(--text-dim);font-size:.65rem }
|
||||||
|
#sentinel-grid.layout-row .part-bar { height:3px;border-radius:1px;background:var(--md-sys-color-surface-container-lowest);margin:2px 0 }
|
||||||
|
#sentinel-grid.layout-row .part-bar-fill { height:100%;border-radius:1px;background:var(--primary) }
|
||||||
|
#sentinel-grid.layout-row .part-detail { display:flex;justify-content:space-between;font-size:.6rem;color:var(--text-dim) }
|
||||||
|
#sentinel-grid.layout-row .part-pct { text-align:right }
|
||||||
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:6px;padding:0 8px }
|
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:6px;padding:0 8px }
|
||||||
#sentinel-grid.layout-row .extra-row { font-size:.8rem;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
#sentinel-grid.layout-row .extra-row { font-size:.8rem;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
||||||
#sentinel-grid.layout-row .extra-row .elabel { font-size:.65rem;color:var(--text-dim);text-transform:uppercase;margin-right:4px }
|
#sentinel-grid.layout-row .extra-row .elabel { font-size:.65rem;color:var(--text-dim);text-transform:uppercase;margin-right:4px }
|
||||||
#sentinel-grid.layout-row .extra-row .eval { font-weight:500 }
|
#sentinel-grid.layout-row .extra-row .eval { font-weight:500 }
|
||||||
#sentinel-grid.layout-row .col-disk { overflow-y:auto;max-height:200px;padding:0 4px }
|
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 4px }
|
||||||
|
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
|
||||||
|
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
||||||
|
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }
|
||||||
|
#sentinel-grid.layout-row .part-name { font-weight:500;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap }
|
||||||
|
#sentinel-grid.layout-row .part-mount { color:var(--text-dim);font-size:.65rem }
|
||||||
|
#sentinel-grid.layout-row .part-bar { height:3px;border-radius:1px;background:var(--md-sys-color-surface-container-lowest);margin:2px 0 }
|
||||||
|
#sentinel-grid.layout-row .part-bar-fill { height:100%;border-radius:1px;background:var(--primary) }
|
||||||
|
#sentinel-grid.layout-row .part-detail { display:flex;justify-content:space-between;font-size:.6rem;color:var(--text-dim) }
|
||||||
|
#sentinel-grid.layout-row .part-pct { text-align:right }
|
||||||
|
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 4px }
|
||||||
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
|
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
|
||||||
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
|
||||||
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }
|
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }
|
||||||
@@ -230,6 +250,7 @@
|
|||||||
'<div class="mtr" id="mtr-'+id+'-net"><div class="mtr-data"><span class="rlabel">NET</span> <span class="rval net-down" style="font-size:.85rem">0</span> <span class="rval net-up" style="font-size:.85rem">0</span></div><canvas id="'+id+'-net" width="200" height="48"></canvas></div>'+
|
'<div class="mtr" id="mtr-'+id+'-net"><div class="mtr-data"><span class="rlabel">NET</span> <span class="rval net-down" style="font-size:.85rem">0</span> <span class="rval net-up" style="font-size:.85rem">0</span></div><canvas id="'+id+'-net" width="200" height="48"></canvas></div>'+
|
||||||
'<div class="col-info" style="text-align:right;font-size:.7rem;color:var(--text-dim);margin-top:4px"></div>'+
|
'<div class="col-info" style="text-align:right;font-size:.7rem;color:var(--text-dim);margin-top:4px"></div>'+
|
||||||
'</div>'+
|
'</div>'+
|
||||||
|
'<div class="col-disk"><div class="disk-list"></div></div>'+
|
||||||
'<div class="col-extra">'+
|
'<div class="col-extra">'+
|
||||||
'<div class="disk-list" style="max-height:150px;overflow-y:auto;margin-bottom:6px"></div>'+
|
'<div class="disk-list" style="max-height:150px;overflow-y:auto;margin-bottom:6px"></div>'+
|
||||||
'<div class="extra-row"><span class="elabel">负载</span> <span class="eval load-val">—</span></div>'+
|
'<div class="extra-row"><span class="elabel">负载</span> <span class="eval load-val">—</span></div>'+
|
||||||
@@ -320,7 +341,15 @@
|
|||||||
if (swapEl && sysData.swap) { var st = sysData.swap.total_gb||0; swapEl.textContent = st > 0 ? (sysData.swap.percent||0).toFixed(1)+'% ('+(sysData.swap.used_gb||0).toFixed(1)+'G)' : '—'; }
|
if (swapEl && sysData.swap) { var st = sysData.swap.total_gb||0; swapEl.textContent = st > 0 ? (sysData.swap.percent||0).toFixed(1)+'% ('+(sysData.swap.used_gb||0).toFixed(1)+'G)' : '—'; }
|
||||||
// 磁盘分区列表
|
// 磁盘分区列表
|
||||||
// 磁盘分区 (在col-extra中显示)
|
// 磁盘分区 (在col-extra中显示)
|
||||||
|
var colDisk = card.querySelector('.col-disk');
|
||||||
var diskList = card.querySelector('.disk-list');
|
var diskList = card.querySelector('.disk-list');
|
||||||
|
if (colDisk) {
|
||||||
|
if (sysData.partitions && sysData.partitions.length) {
|
||||||
|
colDisk.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
colDisk.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
if (diskList && sysData.partitions) {
|
if (diskList && sysData.partitions) {
|
||||||
var parts = sysData.partitions || [];
|
var parts = sysData.partitions || [];
|
||||||
if (!diskList.querySelector('.part-row') || diskList.children.length !== parts.length) {
|
if (!diskList.querySelector('.part-row') || diskList.children.length !== parts.length) {
|
||||||
@@ -358,7 +387,15 @@
|
|||||||
|
|
||||||
// 磁盘分区
|
// 磁盘分区
|
||||||
// 磁盘分区 (在col-extra中显示)
|
// 磁盘分区 (在col-extra中显示)
|
||||||
|
var colDisk = card.querySelector('.col-disk');
|
||||||
var diskList = card.querySelector('.disk-list');
|
var diskList = card.querySelector('.disk-list');
|
||||||
|
if (colDisk) {
|
||||||
|
if (sysData.partitions && sysData.partitions.length) {
|
||||||
|
colDisk.style.display = 'block';
|
||||||
|
} else {
|
||||||
|
colDisk.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
if (diskList && sysData.partitions) {
|
if (diskList && sysData.partitions) {
|
||||||
var parts = sysData.partitions || [];
|
var parts = sysData.partitions || [];
|
||||||
if (!diskList.querySelector('.part-row') || diskList.children.length !== parts.length) {
|
if (!diskList.querySelector('.part-row') || diskList.children.length !== parts.length) {
|
||||||
|
|||||||
Reference in New Issue
Block a user