Implementiere umfassendes Logging-System für WOL-Ereignisse

- Neue Log-Tabelle in der Datenbank
- Automatisches Logging bei WOL-Button-Klicks
- Dedizierte Logs-Seite mit Bootstrap-Design
- Tooltips mit letzten 5 WOL-Ereignissen pro PC
- API-Endpunkte für Log-Verwaltung
- Einheitliches Design zwischen Haupt- und Logs-Seite
- Vollständige Dokumentation des Logging-Systems

web/static/script.js

@@ -145,7 +145,7 @@ class PCManager {
         pcList.style.display = 'block';
 
         tableBody.innerHTML = this.filteredPCs.map(pc => `
-            <tr>
+            <tr data-pc-id="${pc.id}">
                 <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>
@@ -174,6 +174,9 @@ class PCManager {
                 </td>
             </tr>
         `).join('');
+
+        // Tooltips für alle PC-Zeilen laden
+        this.loadTooltipsForAllPCs();
     }
 
     async addPC() {
@@ -368,6 +371,68 @@ class PCManager {
         
         input.value = value.toUpperCase();
     }
+
+    // Tooltip für alle PCs laden
+    async loadTooltipsForAllPCs() {
+        for (const pc of this.filteredPCs) {
+            await this.loadTooltipForPC(pc.id);
+        }
+    }
+
+    // Tooltip für einen bestimmten PC laden
+    async loadTooltipForPC(pcId) {
+        try {
+            const response = await fetch(`/api/logs/pc/${pcId}/recent`);
+            const data = await response.json();
+            
+            if (data.success) {
+                const tooltipContent = this.createTooltipContent(data.logs);
+                const row = document.querySelector(`tr[data-pc-id="${pcId}"]`);
+                
+                if (row) {
+                    // Tooltip-Attribut setzen
+                    row.setAttribute('data-bs-toggle', 'tooltip');
+                    row.setAttribute('data-bs-html', 'true');
+                    row.setAttribute('title', tooltipContent);
+                    
+                    // Bootstrap Tooltip initialisieren
+                    new bootstrap.Tooltip(row, {
+                        placement: 'top',
+                        trigger: 'hover',
+                        html: true
+                    });
+                }
+            }
+        } catch (error) {
+            console.error(`Fehler beim Laden des Tooltips für PC ${pcId}:`, error);
+        }
+    }
+
+    // Tooltip-Inhalt erstellen
+    createTooltipContent(logs) {
+        if (!logs || logs.length === 0) {
+            return '<div class="text-muted">Keine WOL-Ereignisse</div>';
+        }
+
+        let content = '<div class="text-start"><strong>Letzte WOL-Ereignisse:</strong><br>';
+        
+        logs.forEach(log => {
+            const timestamp = new Date(log.timestamp).toLocaleString('de-DE', {
+                day: '2-digit',
+                month: '2-digit',
+                hour: '2-digit',
+                minute: '2-digit'
+            });
+            
+            const triggerText = log.trigger === 'button' ? 'Button' : 
+                               log.trigger === 'cron' ? 'Auto' : log.trigger;
+            
+            content += `• ${timestamp} (${triggerText})<br>`;
+        });
+        
+        content += '</div>';
+        return content;
+    }
 }
 
 // PC Manager initialisieren, wenn die Seite geladen ist