Markus/medi-wol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Add IP field, ping service, status endpoint and UI; update README

Browse Source
This commit is contained in:
Markus Busche
2025-08-21 14:37:07 +02:00
parent 4a56cbd310
commit 504ca23442
8 changed files with 248 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
web/static/script.js
View File

@ -39,6 +39,11 @@ class PCManager {
document.getElementById('clearSearchBtn').addEventListener('click', () => {
this.clearSearch();
});
// Status aktualisieren Button
document.getElementById('refreshStatusBtn').addEventListener('click', () => {
this.refreshStatus();
});
}
async loadPCs() {
@ -129,6 +134,13 @@ class PCManager {
<tr>
<td><strong>${this.escapeHtml(pc.name)}</strong></td>
<td><code>${this.escapeHtml(pc.mac)}</code></td>
<td><code>${this.escapeHtml(pc.ip || 'N/A')}</code></td>
<td>
<span class="badge ${pc.online ? 'bg-success' : 'bg-danger'}" id="status-${pc.id}">
<i class="fas fa-${pc.online ? 'wifi' : 'times'}"></i>
${pc.online ? 'Online' : 'Offline'}
</span>
</td>
<td>${new Date(pc.created_at).toLocaleDateString('de-DE')}</td>
<td>
<div class="btn-group" role="group">
@ -136,7 +148,7 @@ class PCManager {
title="PC aufwecken">
<i class="fas fa-power-off"></i> Aufwecken
</button>
<button class="btn btn-warning btn-sm" onclick="pcManager.editPC(${pc.id}, '${this.escapeHtml(pc.name)}', '${this.escapeHtml(pc.mac)}')"
<button class="btn btn-warning btn-sm" onclick="pcManager.editPC(${pc.id}, '${this.escapeHtml(pc.name)}', '${this.escapeHtml(pc.mac)}', '${this.escapeHtml(pc.ip || '')}')"
title="PC bearbeiten">
<i class="fas fa-edit"></i> Bearbeiten
</button>
@ -153,8 +165,9 @@ class PCManager {
async addPC() {
const name = document.getElementById('pcName').value.trim();
const mac = document.getElementById('macAddress').value.trim();
const ip = document.getElementById('ipAddress').value.trim();
if (!name || !mac) {
if (!name || !mac || !ip) {
this.showNotification('Warnung', 'Bitte füllen Sie alle Felder aus', 'warning');
return;
}
@ -165,7 +178,7 @@ class PCManager {
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ name, mac })
body: JSON.stringify({ name, mac, ip })
});
const data = await response.json();
@ -182,11 +195,12 @@ class PCManager {
}
}
editPC(id, name, mac) {
editPC(id, name, mac, ip) {
// Modal mit PC-Daten füllen
document.getElementById('editPCId').value = id;
document.getElementById('editPCName').value = name;
document.getElementById('editMACAddress').value = mac;
document.getElementById('editIPAddress').value = ip;
// Modal öffnen
const editModal = new bootstrap.Modal(document.getElementById('editPCModal'));
@ -197,8 +211,9 @@ class PCManager {
const id = document.getElementById('editPCId').value;
const name = document.getElementById('editPCName').value.trim();
const mac = document.getElementById('editMACAddress').value.trim();
const ip = document.getElementById('editIPAddress').value.trim();
if (!name || !mac) {
if (!name || !mac || !ip) {
this.showNotification('Warnung', 'Bitte füllen Sie alle Felder aus', 'warning');
return;
}
@ -209,7 +224,7 @@ class PCManager {
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ name, mac })
body: JSON.stringify({ name, mac, ip })
});
const data = await response.json();
@ -288,6 +303,33 @@ class PCManager {
bsToast.show();
}
async refreshStatus() {
try {
const response = await fetch('/api/pcs/status');
const data = await response.json();
if (data.success) {
// Status für jeden PC aktualisieren
data.status.forEach(pcStatus => {
const statusElement = document.getElementById(`status-${pcStatus.id}`);
if (statusElement) {
statusElement.className = `badge ${pcStatus.online ? 'bg-success' : 'bg-danger'}`;
statusElement.innerHTML = `
<i class="fas fa-${pcStatus.online ? 'wifi' : 'times'}"></i>
${pcStatus.online ? 'Online' : 'Offline'}
`;
}
});
this.showNotification('Info', 'Online-Status aktualisiert', 'info');
} else {
this.showNotification('Fehler', data.message, 'danger');
}
} catch (error) {
this.showNotification('Fehler', 'Fehler beim Aktualisieren des Online-Status', 'danger');
}
}
escapeHtml(text) {
const div = document.createElement('div');
div.textContent = text;

21
web/templates/index.html
View File

@ -31,19 +31,26 @@
<div class="card-body">
<form id="addPCForm">
<div class="row">
<div class="col-md-6">
<div class="col-md-4">
<div class="mb-3">
<label for="pcName" class="form-label">PC-Name</label>
<input type="text" class="form-control" id="pcName" required>
</div>
</div>
<div class="col-md-6">
<div class="col-md-4">
<div class="mb-3">
<label for="macAddress" class="form-label">MAC-Adresse</label>
<input type="text" class="form-control" id="macAddress"
placeholder="XX:XX:XX:XX:XX:XX" required>
</div>
</div>
<div class="col-md-4">
<div class="mb-3">
<label for="ipAddress" class="form-label">IP-Adresse</label>
<input type="text" class="form-control" id="ipAddress"
placeholder="192.168.1.100" required>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary">
<i class="fas fa-save"></i> PC hinzufügen
@ -81,6 +88,9 @@
</div>
</div>
<div class="col-md-6 text-end">
<button class="btn btn-outline-info me-2" id="refreshStatusBtn" title="Online-Status aktualisieren">
<i class="fas fa-sync-alt"></i> Status aktualisieren
</button>
<span class="badge bg-primary" id="resultCount">0 PCs gefunden</span>
</div>
</div>
@ -91,6 +101,8 @@
<tr>
<th>Name</th>
<th>MAC-Adresse</th>
<th>IP-Adresse</th>
<th>Status</th>
<th>Erstellt am</th>
<th>Aktionen</th>
</tr>
@ -136,6 +148,11 @@
<input type="text" class="form-control" id="editMACAddress"
placeholder="XX:XX:XX:XX:XX:XX" required>
</div>
<div class="mb-3">
<label for="editIPAddress" class="form-label">IP-Adresse</label>
<input type="text" class="form-control" id="editIPAddress"
placeholder="192.168.1.100" required>
</div>
</form>
</div>
<div class="modal-footer">