修改结构

public/js/app.js

@@ -26,12 +26,6 @@
     traffic24hTx: document.getElementById('traffic24hTx'),
     traffic24hTotal: document.getElementById('traffic24hTotal'),
     networkCanvas: document.getElementById('networkCanvas'),
-    gaugeCpuFill: document.getElementById('gaugeCpuFill'),
-    gaugeRamFill: document.getElementById('gaugeRamFill'),
-    gaugeDiskFill: document.getElementById('gaugeDiskFill'),
-    gaugeCpuValue: document.getElementById('gaugeCpuValue'),
-    gaugeRamValue: document.getElementById('gaugeRamValue'),
-    gaugeDiskValue: document.getElementById('gaugeDiskValue'),
     serverTableBody: document.getElementById('serverTableBody'),
     btnSettings: document.getElementById('btnSettings'),
     settingsModal: document.getElementById('settingsModal'),
@@ -74,9 +68,6 @@
 
   // ---- Initialize ----
   function init() {
-    // Add SVG gradient definitions for gauges
-    addGaugeSvgDefs();
-
     // Resource Gauges Time
     updateGaugesTime();
     setInterval(updateGaugesTime, 1000);
@@ -260,36 +251,6 @@
     }
   }
 
-  // ---- Add SVG Gradient Defs ----
-  function addGaugeSvgDefs() {
-    const svgs = document.querySelectorAll('.gauge svg');
-    const gradients = [
-      { id: 'gaugeCpuGrad', colors: ['#6366f1', '#818cf8'] },
-      { id: 'gaugeRamGrad', colors: ['#06b6d4', '#22d3ee'] },
-      { id: 'gaugeDiskGrad', colors: ['#f59e0b', '#fbbf24'] }
-    ];
-
-    svgs.forEach((svg, i) => {
-      const defs = document.createElementNS('http://www.w3.org/2000/svg', 'defs');
-      const grad = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient');
-      grad.setAttribute('id', gradients[i].id);
-      grad.setAttribute('x1', '0%');
-      grad.setAttribute('y1', '0%');
-      grad.setAttribute('x1', '100%');
-      grad.setAttribute('y2', '100%');
-
-      gradients[i].colors.forEach((color, ci) => {
-        const stop = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
-        stop.setAttribute('offset', ci === 0 ? '0%' : '100%');
-        stop.setAttribute('stop-color', color);
-        grad.appendChild(stop);
-      });
-
-      defs.appendChild(grad);
-      svg.insertBefore(defs, svg.firstChild);
-    });
-  }
-
   // ---- Clock ----
   function updateClock() {
     if (dom.clock) {
@@ -344,11 +305,6 @@
     dom.traffic24hTx.textContent = formatBytes(data.traffic24h.tx);
     dom.traffic24hTotal.textContent = formatBytes(data.traffic24h.total || (data.traffic24h.rx + data.traffic24h.tx));
 
-    // Update gauges
-    updateGauge(dom.gaugeCpuFill, dom.gaugeCpuValue, cpuPct);
-    updateGauge(dom.gaugeRamFill, dom.gaugeRamValue, memPct);
-    updateGauge(dom.gaugeDiskFill, dom.gaugeDiskValue, diskPct);
-
     // Update server table
     updateServerTable(data.servers);
 
@@ -364,16 +320,6 @@
     previousMetrics = data;
   }
 
-  // ---- Gauge Update ----
-  const CIRCUMFERENCE = 2 * Math.PI * 52; // r=52
-
-  function updateGauge(fillEl, valueEl, percent) {
-    const clamped = Math.min(100, Math.max(0, percent));
-    const offset = CIRCUMFERENCE - (clamped / 100) * CIRCUMFERENCE;
-    fillEl.style.strokeDashoffset = offset;
-    valueEl.textContent = formatPercent(clamped);
-  }
-
   // ---- Server Table ----
   function updateServerTable(servers) {
     if (!servers || servers.length === 0) {