支持查看CPU Busy Others

public/js/app.js

@@ -22,6 +22,7 @@
     totalBandwidthTx: document.getElementById('totalBandwidthTx'),
     totalBandwidthRx: document.getElementById('totalBandwidthRx'),
     traffic24hRx: document.getElementById('traffic24hRx'),
+    serverSearchInput: document.getElementById('serverSearchInput'),
     traffic24hTx: document.getElementById('traffic24hTx'),
     traffic24hTotal: document.getElementById('traffic24hTotal'),
     trafficP95: document.getElementById('trafficP95'),
@@ -65,6 +66,7 @@
     legendTx: document.getElementById('legendTx'),
     p95LabelText: document.getElementById('p95LabelText'),
     p95TypeSelect: document.getElementById('p95TypeSelect'),
+    detailDiskTotal: document.getElementById('detailDiskTotal'),
     // Server Details Modal
     serverDetailModal: document.getElementById('serverDetailModal'),
     serverDetailClose: document.getElementById('serverDetailClose'),
@@ -268,6 +270,14 @@
       dom.btnResetSort.addEventListener('click', resetSort);
     }
 
+    // Server list search
+    if (dom.serverSearchInput) {
+      dom.serverSearchInput.addEventListener('input', () => {
+        currentPage = 1; // Reset page on search
+        renderFilteredServers();
+      });
+    }
+
     // Check auth status
     checkAuthStatus();
 
@@ -624,6 +634,15 @@
       filtered = allServersData.filter(s => s.source === currentSourceFilter);
     }
 
+    // Apply search filter
+    const searchTerm = (dom.serverSearchInput?.value || '').toLowerCase().trim();
+    if (searchTerm) {
+      filtered = filtered.filter(s => 
+        (s.job || '').toLowerCase().includes(searchTerm) || 
+        (s.instance || '').toLowerCase().includes(searchTerm)
+      );
+    }
+
     // Sort servers: online first, then by currentSort
     filtered.sort((a, b) => {
       // Primary sort: Always put online servers first unless sorting by 'up' explicitly
@@ -889,11 +908,17 @@
     const mins = Math.floor((uptimeSec % 3600) / 60);
     dom.detailUptime.textContent = `${days}天 ${hours}小时 ${mins}分`;
 
+    // Disk Total
+    const totalDiskSize = (data.partitions || []).reduce((sum, p) => sum + (p.size || 0), 0);
+    if (dom.detailDiskTotal) {
+        dom.detailDiskTotal.textContent = formatBytes(totalDiskSize);
+    }
+
     // Define metrics to show
     const cpuValueHtml = `
         <div style="display: flex; align-items: baseline; gap: 8px;">
             <span style="font-weight: 700; font-size: 1.1rem;">${formatPercent(data.cpuBusy)}</span>
-            <span style="font-size: 0.7rem; color: var(--text-secondary); font-weight: normal;">(IO Wait: ${data.cpuIowait.toFixed(1)}%)</span>
+            <span style="font-size: 0.7rem; color: var(--text-secondary); font-weight: normal;">(IO Wait: ${data.cpuIowait.toFixed(1)}%, Busy Others: ${data.cpuOther.toFixed(1)}%)</span>
         </div>
     `;
     // Define metrics to show
@@ -904,6 +929,7 @@
       { key: 'rootFsUsedPct', label: '根分区使用率 (/)', value: formatPercent(data.rootFsUsedPct) },
       { key: 'netRx', label: '网络接收速率 (RX)', value: formatBandwidth(data.netRx) },
       { key: 'netTx', label: '网络发送速率 (TX)', value: formatBandwidth(data.netTx) },
+      { key: 'networkTrend', label: '网络流量趋势 (24h)', value: '<span style="font-size: 0.75rem; color: var(--accent-indigo);">查看实时趋势线</span>' },
       { key: 'sockstatTcp', label: 'TCP 链接数 (Sockstat)', value: data.sockstatTcp.toFixed(0) },
       { key: 'sockstatTcpMem', label: 'TCP 内存占用', value: formatBytes(data.sockstatTcpMem) }
     ];
@@ -1015,7 +1041,12 @@
       if (metricKey.startsWith('net')) unit = 'B/s';
       if (metricKey === 'sockstatTcpMem') unit = 'B';
 
-      chart = new MetricChart(canvas, unit);
+      if (metricKey === 'networkTrend') {
+        chart = new AreaChart(canvas);
+        chart.padding = { top: 15, right: 15, bottom: 35, left: 65 };
+      } else {
+        chart = new MetricChart(canvas, unit);
+      }
       currentServerDetail.charts[metricKey] = chart;
     }