支持服务器详情24h流量统计

public/index.html

@@ -392,11 +392,12 @@
                   <th class="sortable" data-sort="disk">磁盘 <span class="sort-icon"></span></th>
                   <th class="sortable" data-sort="netRx">网络 ↓ <span class="sort-icon"></span></th>
                   <th class="sortable" data-sort="netTx">网络 ↑ <span class="sort-icon"></span></th>
+                  <th class="sortable" data-sort="traffic24h">24h 流量 <span class="sort-icon"></span></th>
                 </tr>
               </thead>
               <tbody id="serverTableBody">
                 <tr class="empty-row">
-                  <td colspan="8">暂无数据 - 请先配置 Prometheus 数据源</td>
+                  <td colspan="9">暂无数据 - 请先配置 Prometheus 数据源</td>
                 </tr>
               </tbody>
             </table>

public/js/app.js

@@ -1482,6 +1482,10 @@
           valA = a.netTx ?? 0;
           valB = b.netTx ?? 0;
           break;
+        case 'traffic24h':
+          valA = (a.traffic24hRx ?? 0) + (a.traffic24hTx ?? 0);
+          valB = (b.traffic24hRx ?? 0) + (b.traffic24hTx ?? 0);
+          break;
         default:
           valA = (a.job || '').toLowerCase();
           valB = (b.job || '').toLowerCase();
@@ -1607,7 +1611,7 @@
     if (!servers || servers.length === 0) {
       dom.serverTableBody.innerHTML = `
         <tr class="empty-row">
-          <td colspan="8">暂无数据 - 请先配置 Prometheus 数据源</td>
+          <td colspan="9">暂无数据 - 请先配置 Prometheus 数据源</td>
         </tr>
       `;
       return;
@@ -1652,6 +1656,10 @@
           </td>
           <td>${formatBandwidth(server.netRx)}</td>
           <td>${formatBandwidth(server.netTx)}</td>
+          <td>
+            <div style="font-size: 0.85rem; font-weight: 500; color: var(--text-primary);">${formatBytes((server.traffic24hRx || 0) + (server.traffic24hTx || 0))}</div>
+            <div style="font-size: 0.65rem; color: var(--text-muted); margin-top: 2px;">↓${formatBytes(server.traffic24hRx || 0)} / ↑${formatBytes(server.traffic24hTx || 0)}</div>
+          </td>
         </tr>
       `;
     }).join('');

server/prometheus-service.js

@@ -204,6 +204,8 @@ async function getOverviewMetrics(url, sourceName) {
     diskFreeResult,
     netRxResult,
     netTxResult,
+    netRx24hResult,
+    netTx24hResult,
     targetsResult
   ] = await Promise.all([
     // CPU usage per instance: 1 - avg idle
@@ -222,6 +224,10 @@ async function getOverviewMetrics(url, sourceName) {
     query(url, 'sum by (instance, job) (rate(node_network_receive_bytes_total{device!~"lo|veth.*|docker.*|br-.*"}[1m]))').catch(() => []),
     // Network transmit rate (bytes/sec)
     query(url, 'sum by (instance, job) (rate(node_network_transmit_bytes_total{device!~"lo|veth.*|docker.*|br-.*"}[1m]))').catch(() => []),
+    // 24h Network receive total (bytes)
+    query(url, 'sum by (instance, job) (increase(node_network_receive_bytes_total{device!~"lo|veth.*|docker.*|br-.*"}[24h]))').catch(() => []),
+    // 24h Network transmit total (bytes)
+    query(url, 'sum by (instance, job) (increase(node_network_transmit_bytes_total{device!~"lo|veth.*|docker.*|br-.*"}[24h]))').catch(() => []),
     // Targets status from /api/v1/targets
     getTargets(url).catch(() => [])
   ]);
@@ -254,6 +260,8 @@ async function getOverviewMetrics(url, sourceName) {
         diskUsed: 0,
         netRx: 0,
         netTx: 0,
+        traffic24hRx: 0,
+        traffic24hTx: 0,
         up: false,
         memPercent: 0,
         diskPercent: 0
@@ -322,6 +330,16 @@ async function getOverviewMetrics(url, sourceName) {
     inst.netTx = parseFloat(r.value[1]) || 0;
   }
 
+  // Parse 24h traffic
+  for (const r of netRx24hResult) {
+    const inst = getOrCreate(r.metric);
+    inst.traffic24hRx = parseFloat(r.value[1]) || 0;
+  }
+  for (const r of netTx24hResult) {
+    const inst = getOrCreate(r.metric);
+    inst.traffic24hTx = parseFloat(r.value[1]) || 0;
+  }
+
   for (const inst of instances.values()) {
     if (!inst.up && (inst.cpuPercent > 0 || inst.memTotal > 0)) {
       inst.up = true;