Loading nodes...
`;
+ }
+ const rows = await Promise.all(nodes.map(loadSingleServerStatus));
+ renderServersStatusCards(rows);
+ if (serversStatusPageStatus) {
+ const online = rows.filter(r => r.ok).length;
+ serversStatusPageStatus.textContent = `${online}/${rows.length} nodes online - Updated ${new Date().toLocaleTimeString()}`;
+ }
+ } catch (e) {
+ if (e.message === "auth") doAuthError();
+ else {
+ serversStatusPageStatus && (serversStatusPageStatus.textContent = "Error loading server status: " + e.message);
+ if (!silent) serversStatusGrid.innerHTML = `Error loading server status.
`;
+ }
+ }
+}
+
+async function fetchJSONForServer(path, serverID) {
+ const res = await api(withServerParam(path, serverID));
+ if (!res.ok) throw new Error((await res.text()).trim() || `HTTP ${res.status}`);
+ return await res.json();
+}
+
+async function loadSingleServerStatus(server) {
+ const id = String(server.id || "local");
+ const out = { server, ok: true, error: "", stats: null, users: [], inbounds: [], xray: null };
+ try {
+ out.stats = await fetchJSONForServer("/api/stats", id);
+ } catch (e) {
+ out.ok = false;
+ out.error = e.message || "stats failed";
+ }
+ if (server.enable_ssh || server.is_local) {
+ try { out.users = await fetchJSONForServer("/api/users", id) || []; }
+ catch (e) { out.usersError = e.message || "users failed"; }
+ }
+ if (server.enable_xray || server.is_local) {
+ try { out.xray = await fetchJSONForServer("/api/xray/status", id); }
+ catch (e) { out.xrayError = e.message || "xray status failed"; }
+ try { out.inbounds = await fetchJSONForServer("/api/xray/inbounds", id) || []; }
+ catch (e) { out.inboundsError = e.message || "xray clients failed"; }
+ }
+ return out;
+}
+
+function renderServersStatusCards(rows = []) {
+ if (!serversStatusGrid) return;
+ if (!rows.length) {
+ serversStatusGrid.innerHTML = `No active servers configured.
`;
+ return;
+ }
+ serversStatusGrid.innerHTML = rows.map(serverStatusCardHTML).join("");
+}
+
+function serverStatusCardHTML(row) {
+ const s = row.server || {};
+ const stats = row.stats || {};
+ const ifaces = Array.isArray(stats.interfaces) ? stats.interfaces : [];
+ let rx = 0, tx = 0, rxTotal = 0, txTotal = 0;
+ ifaces.forEach(it => {
+ rx += Number(it.rx_mbps || 0);
+ tx += Number(it.tx_mbps || 0);
+ rxTotal += Number(it.rx_bytes || 0);
+ txTotal += Number(it.tx_bytes || 0);
+ });
+ const cpu = Number(stats.cpu_percent || 0);
+ const mem = stats.mem_percent == null ? 0 : Number(stats.mem_percent || 0);
+ const users = Array.isArray(row.users) ? row.users : [];
+ const now = Date.now();
+ const sshActive = users.filter(u => !u.expires_at || new Date(u.expires_at).getTime() > now).length;
+ const sshExpired = Math.max(0, users.length - sshActive);
+ const sshConns = users.reduce((sum, u) => sum + Number(u.active_conns || 0), 0);
+ const clients = [];
+ (Array.isArray(row.inbounds) ? row.inbounds : []).forEach(ib => (ib.clients || []).forEach(c => clients.push(c)));
+ const xrayOnline = clients.filter(c => !!c.online).length;
+ const xrayActive = clients.filter(c => !c.expired && (!c.expires_at || new Date(c.expires_at).getTime() > now)).length;
+ const xrayExpired = Math.max(0, clients.length - xrayActive);
+ const netNow = rx + tx;
+ const running = row.xray ? !!row.xray.running : false;
+ const nodeStatus = row.ok ? `
+
+
+
${escapeHTML(s.name || "Server")}
+
${escapeHTML(s.base_url || "local")}
+
+
+ ${nodeStatus}
+ ${escapeHTML(options)}
+
+
+ ${miniMetricHTML("CPU", fmtPct(cpu), cpu, cpu >= 85 ? "High load" : cpu >= 60 ? "Moderate load" : "Normal load")}
+ ${miniMetricHTML("RAM", fmtPct(mem), mem, stats.mem_used_bytes && stats.mem_total_bytes ? `${fmtBytes(stats.mem_used_bytes)} / ${fmtBytes(stats.mem_total_bytes)}` : "Memory used")}
+ ${miniMetricHTML("Network", `${fmtMbps(netNow)} Mb/s`, Math.min(100, netNow / 20), `RX ${fmtMbps(rx)} - TX ${fmtMbps(tx)}`)}
+ ${miniMetricHTML("Accounts", String(users.length + clients.length), Math.min(100, (users.length + clients.length) * 3), `SSH ${users.length} - Xray ${clients.length}`)}
+
+
+ `;
+}
+
+function miniMetricHTML(label, value, pct, note) {
+ const width = Math.min(100, Math.max(0, Number(pct) || 0));
+ return `