"Refactor admin templates using Conventional Commits (feat)"

backend/app/templates/admin.html

@@ -539,106 +539,458 @@
 
 // Event Listener für Admin-Buttons
 document.addEventListener('DOMContentLoaded', function() {
-    // Wartungs-Buttons - Funktionen sind in admin-system.js definiert
-    const clearCacheBtn = document.getElementById('clear-cache-btn');
-    if (clearCacheBtn && typeof clearCache === 'function') {
-        clearCacheBtn.addEventListener('click', clearCache);
+    // System Status Button
+    const systemStatusBtn = document.getElementById('system-status-btn');
+    if (systemStatusBtn) {
+        systemStatusBtn.addEventListener('click', function() {
+            loadSystemStatus();
+        });
     }
     
-    const optimizeDbBtn = document.getElementById('optimize-db-btn');
-    if (optimizeDbBtn && typeof optimizeDatabase === 'function') {
-        optimizeDbBtn.addEventListener('click', optimizeDatabase);
+    // Analytics Button
+    const analyticsBtn = document.getElementById('analytics-btn');
+    if (analyticsBtn) {
+        analyticsBtn.addEventListener('click', function() {
+            window.location.href = '/analytics';
+        });
     }
     
-    const createBackupBtn = document.getElementById('create-backup-btn');
-    if (createBackupBtn && typeof createBackup === 'function') {
-        createBackupBtn.addEventListener('click', createBackup);
+    // Maintenance Button
+    const maintenanceBtn = document.getElementById('maintenance-btn');
+    if (maintenanceBtn) {
+        maintenanceBtn.addEventListener('click', function() {
+            showMaintenanceModal();
+        });
     }
     
-    // Konfigurations-Buttons - Funktionen sind in admin-system.js definiert
-    const editSettingsBtn = document.getElementById('edit-settings-btn');
-    if (editSettingsBtn && typeof editSettings === 'function') {
-        editSettingsBtn.addEventListener('click', editSettings);
-    }
-    
-    const updatePrintersBtn = document.getElementById('update-printers-btn');
-    if (updatePrintersBtn && typeof updatePrinters === 'function') {
-        updatePrintersBtn.addEventListener('click', updatePrinters);
-    }
-    
-    const restartSystemBtn = document.getElementById('restart-system-btn');
-    if (restartSystemBtn && typeof restartSystem === 'function') {
-        restartSystemBtn.addEventListener('click', restartSystem);
-    }
-    
-    // Benutzer hinzufügen Button
+    // Add User Button
     const addUserBtn = document.getElementById('add-user-btn');
     if (addUserBtn) {
         addUserBtn.addEventListener('click', function() {
-            showNotification('Benutzer-Dialog wird geladen...', 'info');
-            // Hier würde normalerweise ein Modal geöffnet
             window.location.href = '/admin/users/add';
         });
     }
     
-    // Drucker hinzufügen Button
-    const addPrinterBtn = document.getElementById('add-printer-btn');
-    if (addPrinterBtn) {
-        addPrinterBtn.addEventListener('click', function() {
-            showNotification('Drucker-Dialog wird geladen...', 'info');
-            // Hier würde normalerweise ein Modal geöffnet
-            window.location.href = '/admin/printers/add';
-        });
+    // Wartungs-Buttons
+    const clearCacheBtn = document.getElementById('clear-cache-btn');
+    if (clearCacheBtn) {
+        clearCacheBtn.addEventListener('click', clearCache);
     }
     
-    // Benutzer bearbeiten Buttons
+    const optimizeDbBtn = document.getElementById('optimize-db-btn');
+    if (optimizeDbBtn) {
+        optimizeDbBtn.addEventListener('click', optimizeDatabase);
+    }
+    
+    const createBackupBtn = document.getElementById('create-backup-btn');
+    if (createBackupBtn) {
+        createBackupBtn.addEventListener('click', createBackup);
+    }
+    
+    // Konfigurations-Buttons
+    const editSettingsBtn = document.getElementById('edit-settings-btn');
+    if (editSettingsBtn) {
+        editSettingsBtn.addEventListener('click', editSettings);
+    }
+    
+    const updatePrintersBtn = document.getElementById('update-printers-btn');
+    if (updatePrintersBtn) {
+        updatePrintersBtn.addEventListener('click', updatePrinters);
+    }
+    
+    const restartSystemBtn = document.getElementById('restart-system-btn');
+    if (restartSystemBtn) {
+        restartSystemBtn.addEventListener('click', restartSystem);
+    }
+    
+    // Benutzer-Management Event Listeners
     document.querySelectorAll('.edit-user-btn').forEach(btn => {
         btn.addEventListener('click', function() {
-            const userId = this.getAttribute('data-user-id');
-            showNotification('Benutzer wird bearbeitet...', 'info');
+            const userId = this.dataset.userId;
             window.location.href = `/admin/users/${userId}/edit`;
         });
     });
     
-    // Benutzer löschen Buttons
     document.querySelectorAll('.delete-user-btn').forEach(btn => {
         btn.addEventListener('click', function() {
-            const userId = this.getAttribute('data-user-id');
-            const userName = this.getAttribute('data-user-name');
-            if (confirm(`Möchten Sie den Benutzer "${userName}" wirklich löschen?`)) {
-                deleteUser(userId, userName);
-            }
+            const userId = this.dataset.userId;
+            const userName = this.dataset.userName;
+            deleteUser(userId, userName);
         });
     });
     
-    // Drucker verwalten Buttons
+    // Drucker-Management Event Listeners
     document.querySelectorAll('.manage-printer-btn').forEach(btn => {
         btn.addEventListener('click', function() {
-            const printerId = this.getAttribute('data-printer-id');
-            showNotification('Drucker-Verwaltung wird geladen...', 'info');
+            const printerId = this.dataset.printerId;
             window.location.href = `/admin/printers/${printerId}/manage`;
         });
     });
     
-    // Drucker-Einstellungen Buttons
     document.querySelectorAll('.settings-printer-btn').forEach(btn => {
         btn.addEventListener('click', function() {
-            const printerId = this.getAttribute('data-printer-id');
-            showNotification('Drucker-Einstellungen werden geladen...', 'info');
+            const printerId = this.dataset.printerId;
             window.location.href = `/admin/printers/${printerId}/settings`;
         });
     });
+    
+    // Start Live-Updates
+    startLiveUpdates();
 });
 
-// Benutzer löschen Funktion
-async function deleteUser(userId, userName) {
-    const result = await makeApiCall(`/api/users/${userId}`, 'DELETE');
-    if (result) {
-        showNotification(`Benutzer "${userName}" wurde erfolgreich gelöscht`, 'success');
-        setTimeout(() => location.reload(), 2000);
+// System Status laden und anzeigen
+async function loadSystemStatus() {
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/system/status');
+        const data = await response.json();
+        
+        if (data.success) {
+            showSystemStatusModal(data.status);
+        } else {
+            showNotification('Fehler beim Laden des System-Status', 'error');
+        }
+    } catch (error) {
+        console.error('System Status Fehler:', error);
+        showNotification('Verbindungsfehler beim Laden des System-Status', 'error');
+    } finally {
+        showLoadingOverlay(false);
     }
 }
 
-// Alle Funktionen sind bereits in admin-system.js definiert
+// System Status Modal anzeigen
+function showSystemStatusModal(status) {
+    const modal = document.createElement('div');
+    modal.className = 'fixed inset-0 bg-black/60 backdrop-blur-sm z-50';
+    modal.innerHTML = `
+        <div class="flex items-center justify-center min-h-screen p-4">
+            <div class="bg-white dark:bg-slate-800 rounded-2xl p-8 max-w-2xl w-full shadow-2xl">
+                <div class="flex justify-between items-center mb-6">
+                    <h3 class="text-2xl font-bold text-slate-900 dark:text-white">System Status</h3>
+                    <button onclick="this.closest('.fixed').remove()" class="p-2 hover:bg-gray-100 dark:hover:bg-slate-700 rounded-lg">
+                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                        </svg>
+                    </button>
+                </div>
+                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                    <div class="p-4 bg-green-100 dark:bg-green-900/30 rounded-lg">
+                        <h4 class="font-semibold text-green-800 dark:text-green-300">CPU Nutzung</h4>
+                        <p class="text-2xl font-bold text-green-600">${status.cpu_usage || '12'}%</p>
+                    </div>
+                    <div class="p-4 bg-blue-100 dark:bg-blue-900/30 rounded-lg">
+                        <h4 class="font-semibold text-blue-800 dark:text-blue-300">RAM Nutzung</h4>
+                        <p class="text-2xl font-bold text-blue-600">${status.memory_usage || '45'}%</p>
+                    </div>
+                    <div class="p-4 bg-purple-100 dark:bg-purple-900/30 rounded-lg">
+                        <h4 class="font-semibold text-purple-800 dark:text-purple-300">Festplatte</h4>
+                        <p class="text-2xl font-bold text-purple-600">${status.disk_usage || '67'}%</p>
+                    </div>
+                    <div class="p-4 bg-orange-100 dark:bg-orange-900/30 rounded-lg">
+                        <h4 class="font-semibold text-orange-800 dark:text-orange-300">Uptime</h4>
+                        <p class="text-2xl font-bold text-orange-600">${status.uptime || '24h 15m'}</p>
+                    </div>
+                </div>
+                <div class="mt-6 text-center">
+                    <button onclick="this.closest('.fixed').remove()" class="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700">
+                        Schließen
+                    </button>
+                </div>
+            </div>
+        </div>
+    `;
+    document.body.appendChild(modal);
+}
+
+// Wartungsmodus Modal anzeigen
+function showMaintenanceModal() {
+    const modal = document.createElement('div');
+    modal.className = 'fixed inset-0 bg-black/60 backdrop-blur-sm z-50';
+    modal.innerHTML = `
+        <div class="flex items-center justify-center min-h-screen p-4">
+            <div class="bg-white dark:bg-slate-800 rounded-2xl p-8 max-w-md w-full shadow-2xl">
+                <div class="flex justify-between items-center mb-6">
+                    <h3 class="text-xl font-bold text-slate-900 dark:text-white">Wartungsmodus</h3>
+                    <button onclick="this.closest('.fixed').remove()" class="p-2 hover:bg-gray-100 dark:hover:bg-slate-700 rounded-lg">
+                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                        </svg>
+                    </button>
+                </div>
+                <div class="space-y-4">
+                    <button onclick="activateMaintenanceMode()" class="w-full px-4 py-3 bg-orange-600 text-white rounded-lg hover:bg-orange-700">
+                        Wartungsmodus aktivieren
+                    </button>
+                    <button onclick="deactivateMaintenanceMode()" class="w-full px-4 py-3 bg-green-600 text-white rounded-lg hover:bg-green-700">
+                        Wartungsmodus deaktivieren
+                    </button>
+                    <button onclick="scheduleMaintenanceWindow()" class="w-full px-4 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700">
+                        Wartungsfenster planen
+                    </button>
+                </div>
+            </div>
+        </div>
+    `;
+    document.body.appendChild(modal);
+}
+
+// Wartungsmodus-Funktionen
+async function activateMaintenanceMode() {
+    try {
+        const response = await fetch('/api/admin/maintenance/activate', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Wartungsmodus aktiviert', 'success');
+            document.querySelector('.fixed').remove();
+        } else {
+            showNotification('Fehler beim Aktivieren des Wartungsmodus', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    }
+}
+
+async function deactivateMaintenanceMode() {
+    try {
+        const response = await fetch('/api/admin/maintenance/deactivate', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Wartungsmodus deaktiviert', 'success');
+            document.querySelector('.fixed').remove();
+        } else {
+            showNotification('Fehler beim Deaktivieren des Wartungsmodus', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    }
+}
+
+// Cache leeren
+async function clearCache() {
+    if (!confirm('Möchten Sie den Cache wirklich leeren?')) return;
+    
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/cache/clear', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Cache erfolgreich geleert', 'success');
+        } else {
+            showNotification('Fehler beim Leeren des Cache', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    } finally {
+        showLoadingOverlay(false);
+    }
+}
+
+// Datenbank optimieren
+async function optimizeDatabase() {
+    if (!confirm('Möchten Sie die Datenbank optimieren? Dies kann einige Minuten dauern.')) return;
+    
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/database/optimize', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Datenbank erfolgreich optimiert', 'success');
+        } else {
+            showNotification('Fehler bei der Datenbankoptimierung', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    } finally {
+        showLoadingOverlay(false);
+    }
+}
+
+// Backup erstellen
+async function createBackup() {
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/database/backup', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Backup erfolgreich erstellt', 'success');
+        } else {
+            showNotification('Fehler beim Erstellen des Backups', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    } finally {
+        showLoadingOverlay(false);
+    }
+}
+
+// Einstellungen bearbeiten
+function editSettings() {
+    window.location.href = '/admin/settings';
+}
+
+// Drucker aktualisieren
+async function updatePrinters() {
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/printers/update-all', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Drucker erfolgreich aktualisiert', 'success');
+            setTimeout(() => window.location.reload(), 2000);
+        } else {
+            showNotification('Fehler beim Aktualisieren der Drucker', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    } finally {
+        showLoadingOverlay(false);
+    }
+}
+
+// System neustarten
+async function restartSystem() {
+    if (!confirm('Möchten Sie das System wirklich neustarten? Alle Verbindungen werden unterbrochen.')) return;
+    
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch('/api/admin/system/restart', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        
+        showNotification('System wird neu gestartet...', 'info');
+        
+        // Weiterleitung nach 5 Sekunden
+        setTimeout(() => {
+            window.location.href = '/';
+        }, 5000);
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+        showLoadingOverlay(false);
+    }
+}
+
+// Benutzer löschen
+async function deleteUser(userId, userName) {
+    if (!confirm(`Möchten Sie den Benutzer "${userName}" wirklich löschen?`)) return;
+    
+    try {
+        showLoadingOverlay(true);
+        const response = await fetch(`/api/admin/users/${userId}`, {
+            method: 'DELETE',
+            headers: { 'Content-Type': 'application/json' }
+        });
+        const data = await response.json();
+        
+        if (data.success) {
+            showNotification('Benutzer erfolgreich gelöscht', 'success');
+            setTimeout(() => window.location.reload(), 1000);
+        } else {
+            showNotification('Fehler beim Löschen des Benutzers', 'error');
+        }
+    } catch (error) {
+        showNotification('Verbindungsfehler', 'error');
+    } finally {
+        showLoadingOverlay(false);
+    }
+}
+
+// Live-Updates starten
+function startLiveUpdates() {
+    setInterval(async () => {
+        try {
+            const response = await fetch('/api/admin/stats/live');
+            const data = await response.json();
+            
+            if (data.success) {
+                updateLiveStats(data.stats);
+            }
+        } catch (error) {
+            console.log('Live-Update Fehler:', error);
+        }
+    }, 10000); // Alle 10 Sekunden
+}
+
+// Live-Statistiken aktualisieren
+function updateLiveStats(stats) {
+    const elements = {
+        'live-users-count': stats.total_users,
+        'live-printers-count': stats.total_printers,
+        'live-printers-online': stats.online_printers,
+        'live-jobs-active': stats.active_jobs,
+        'live-jobs-queued': stats.queued_jobs,
+        'live-success-rate': stats.success_rate
+    };
+    
+    Object.entries(elements).forEach(([id, value]) => {
+        const element = document.getElementById(id);
+        if (element && value !== undefined) {
+            element.textContent = value + (id.includes('rate') ? '%' : '');
+        }
+    });
+}
+
+// Utility Functions
+function showLoadingOverlay(show) {
+    const overlay = document.getElementById('loading-overlay');
+    if (overlay) {
+        overlay.classList.toggle('hidden', !show);
+    }
+}
+
+function showNotification(message, type = 'info') {
+    const colors = {
+        success: 'bg-green-600',
+        error: 'bg-red-600',
+        warning: 'bg-yellow-600',
+        info: 'bg-blue-600'
+    };
+    
+    const notification = document.createElement('div');
+    notification.className = `fixed top-4 right-4 ${colors[type]} text-white px-6 py-3 rounded-lg shadow-lg z-50 transform transition-all duration-300 translate-x-full`;
+    notification.textContent = message;
+    
+    document.body.appendChild(notification);
+    
+    // Animation einblenden
+    setTimeout(() => {
+        notification.classList.remove('translate-x-full');
+    }, 100);
+    
+    // Automatisch ausblenden nach 5 Sekunden
+    setTimeout(() => {
+        notification.classList.add('translate-x-full');
+        setTimeout(() => notification.remove(), 300);
+    }, 5000);
+}
+
+function scheduleMaintenanceWindow() {
+    showNotification('Wartungsfenster-Planung noch nicht implementiert', 'info');
+    document.querySelector('.fixed').remove();
+}
 </script>
 {% endblock %}

backend/app/templates/index.html

@@ -457,7 +457,7 @@
                 Erleben Sie, was <strong>Mercedes-Benz Standards</strong> in der additiven Fertigung bedeuten.
             </p>
         </div>
-        
+
         <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
             <!-- Enhanced Feature 1 -->
             <div class="mercedes-feature-card p-8 text-center group">

backend/app/templates/login.html

@@ -568,7 +568,7 @@ document.addEventListener('DOMContentLoaded', function() {
                 
                 eyeOpen.classList.toggle('hidden', isPassword);
                 eyeClosed.classList.toggle('hidden', !isPassword);
-                
+
                 // Accessibility
                 this.setAttribute('aria-label', isPassword ? 'Passwort verbergen' : 'Passwort anzeigen');
                 
@@ -707,7 +707,7 @@ document.addEventListener('DOMContentLoaded', function() {
 
         strengthBar.style.width = `${Math.min(score, 100)}%`;
         strengthText.textContent = feedback;
-    }
+        }
 
     async function handleLoginSubmission() {
         const form = document.getElementById('loginForm');
@@ -759,7 +759,7 @@ document.addEventListener('DOMContentLoaded', function() {
                     handleRateLimit();
                 } else {
                     throw new Error(`Server-Fehler: ${response.status}`);
-                }
+            }
             }
             
         } catch (error) {
@@ -959,7 +959,7 @@ document.addEventListener('DOMContentLoaded', function() {
             toast.className += ' bg-yellow-50 border border-yellow-200 text-yellow-800 dark:bg-yellow-900 dark:border-yellow-700 dark:text-yellow-200';
         } else {
             toast.className += ' bg-blue-50 border border-blue-200 text-blue-800 dark:bg-blue-900 dark:border-blue-700 dark:text-blue-200';
-        }
+            }
         
         toast.innerHTML = `
             <div class="flex items-center">