index.html aktualisiert
This commit is contained in:
+42
-16
@@ -246,31 +246,59 @@
|
|||||||
|
|
||||||
const isSearching = document.getElementById('searchInput').value.trim() !== '';
|
const isSearching = document.getElementById('searchInput').value.trim() !== '';
|
||||||
|
|
||||||
|
// 1. Daten nach Servern gruppieren
|
||||||
const servers = {};
|
const servers = {};
|
||||||
data.forEach(node => {
|
data.forEach(node => {
|
||||||
if (!servers[node.server]) servers[node.server] = [];
|
if (!servers[node.server]) servers[node.server] = [];
|
||||||
servers[node.server].push(node);
|
servers[node.server].push(node);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const now = new Date();
|
||||||
|
const serverArray = [];
|
||||||
|
|
||||||
|
// 2. Gateway-Status vorab berechnen und in ein Array packen
|
||||||
|
for (const [serverName, nodes] of Object.entries(servers)) {
|
||||||
|
let minDiffMinutes = Infinity;
|
||||||
|
|
||||||
|
nodes.forEach(node => {
|
||||||
|
const safeDateString = node.last_seen.replace(' ', 'T') + 'Z';
|
||||||
|
const lastSeen = new Date(safeDateString);
|
||||||
|
const diffMinutes = (now - lastSeen) / 1000 / 60;
|
||||||
|
if (diffMinutes < minDiffMinutes) {
|
||||||
|
minDiffMinutes = diffMinutes;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const isGatewayOffline = (minDiffMinutes >= 5);
|
||||||
|
|
||||||
|
serverArray.push({
|
||||||
|
serverName: serverName,
|
||||||
|
nodes: nodes,
|
||||||
|
isGatewayOffline: isGatewayOffline
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 3. Array sortieren: Offline Gateways zuerst, danach alphabetisch
|
||||||
|
serverArray.sort((a, b) => {
|
||||||
|
if (a.isGatewayOffline === b.isGatewayOffline) {
|
||||||
|
return a.serverName.localeCompare(b.serverName); // Alphabetisch
|
||||||
|
}
|
||||||
|
return a.isGatewayOffline ? -1 : 1; // Offline nach oben
|
||||||
|
});
|
||||||
|
|
||||||
|
// 4. Dashboard zeichnen
|
||||||
const dashboard = document.getElementById('dashboard');
|
const dashboard = document.getElementById('dashboard');
|
||||||
dashboard.innerHTML = '';
|
dashboard.innerHTML = '';
|
||||||
|
|
||||||
for (const [serverName, nodes] of Object.entries(servers)) {
|
serverArray.forEach(serverGroup => {
|
||||||
let onlineCount = 0;
|
let onlineCount = 0;
|
||||||
let minDiffMinutes = Infinity;
|
|
||||||
const now = new Date();
|
|
||||||
|
|
||||||
const rowElements = nodes.map(node => {
|
const rowElements = serverGroup.nodes.map(node => {
|
||||||
const safeDateString = node.last_seen.replace(' ', 'T') + 'Z';
|
const safeDateString = node.last_seen.replace(' ', 'T') + 'Z';
|
||||||
const lastSeen = new Date(safeDateString);
|
const lastSeen = new Date(safeDateString);
|
||||||
const diffMinutes = (now - lastSeen) / 1000 / 60;
|
const diffMinutes = (now - lastSeen) / 1000 / 60;
|
||||||
|
|
||||||
if (diffMinutes < minDiffMinutes) {
|
|
||||||
minDiffMinutes = diffMinutes;
|
|
||||||
}
|
|
||||||
|
|
||||||
const isOnline = (node.status === 'true' && diffMinutes < 5);
|
const isOnline = (node.status === 'true' && diffMinutes < 5);
|
||||||
|
|
||||||
if (isOnline) onlineCount++;
|
if (isOnline) onlineCount++;
|
||||||
|
|
||||||
let timeText = Math.round(diffMinutes) + ' Min.';
|
let timeText = Math.round(diffMinutes) + ' Min.';
|
||||||
@@ -287,21 +315,19 @@
|
|||||||
return row;
|
return row;
|
||||||
});
|
});
|
||||||
|
|
||||||
const isGatewayOffline = (minDiffMinutes >= 5);
|
|
||||||
|
|
||||||
const header = document.createElement('div');
|
const header = document.createElement('div');
|
||||||
header.className = `server-group-title ${isGatewayOffline ? 'gateway-offline' : ''}`;
|
header.className = `server-group-title ${serverGroup.isGatewayOffline ? 'gateway-offline' : ''}`;
|
||||||
|
|
||||||
let badgeHTML = '';
|
let badgeHTML = '';
|
||||||
if (isGatewayOffline) {
|
if (serverGroup.isGatewayOffline) {
|
||||||
badgeHTML = `<div class="gateway-offline-badge">Gateway Offline</div>`;
|
badgeHTML = `<div class="gateway-offline-badge">Gateway Offline</div>`;
|
||||||
} else {
|
} else {
|
||||||
badgeHTML = `<div class="summary-badge">${onlineCount} / ${nodes.length} online</div>`;
|
badgeHTML = `<div class="summary-badge">${onlineCount} / ${serverGroup.nodes.length} online</div>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
header.innerHTML = `
|
header.innerHTML = `
|
||||||
<div class="server-group-left">
|
<div class="server-group-left">
|
||||||
<span>🖥️ ${serverName}</span>
|
<span>🖥️ ${serverGroup.serverName}</span>
|
||||||
</div>
|
</div>
|
||||||
${badgeHTML}
|
${badgeHTML}
|
||||||
`;
|
`;
|
||||||
@@ -312,7 +338,7 @@
|
|||||||
|
|
||||||
rowElements.forEach(row => listContainer.appendChild(row));
|
rowElements.forEach(row => listContainer.appendChild(row));
|
||||||
dashboard.appendChild(listContainer);
|
dashboard.appendChild(listContainer);
|
||||||
}
|
});
|
||||||
|
|
||||||
if (isSearching) applySearchFilter();
|
if (isSearching) applySearchFilter();
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user