"feat: Integrate new printer model functionality in backend/app/models.py and templates/printers.html"
This commit is contained in:
@@ -460,6 +460,171 @@
|
||||
modal.setAttribute('aria-hidden', 'true');
|
||||
}
|
||||
|
||||
// Der Rest des Codes bleibt unverändert
|
||||
// Render printers grid mit Filter-Unterstützung
|
||||
function renderPrinters() {
|
||||
const grid = document.getElementById('printers-grid');
|
||||
if (!grid) {
|
||||
console.error('printers-grid Element nicht gefunden');
|
||||
return;
|
||||
}
|
||||
|
||||
// Filter anwenden
|
||||
let filteredPrinters = printers;
|
||||
if (currentFilter === 'online') {
|
||||
filteredPrinters = printers.filter(p => p.status === 'available' || p.is_online);
|
||||
} else if (currentFilter === 'offline') {
|
||||
filteredPrinters = printers.filter(p => p.status === 'offline' || !p.is_online);
|
||||
}
|
||||
|
||||
// Status-Übersicht aktualisieren falls nicht bereits gesetzt
|
||||
if (!document.getElementById('online-count').textContent || document.getElementById('online-count').textContent === '-') {
|
||||
const onlineCount = printers.filter(p => p.status === 'available' || p.is_online).length;
|
||||
const offlineCount = printers.length - onlineCount;
|
||||
updateStatusOverview(onlineCount, offlineCount, printers.length);
|
||||
}
|
||||
|
||||
if (filteredPrinters.length === 0) {
|
||||
let emptyMessage = 'Keine Drucker vorhanden';
|
||||
if (currentFilter === 'online') {
|
||||
emptyMessage = 'Keine Online-Drucker gefunden';
|
||||
} else if (currentFilter === 'offline') {
|
||||
emptyMessage = 'Keine Offline-Drucker gefunden';
|
||||
}
|
||||
|
||||
grid.innerHTML = `
|
||||
<div class="col-span-full text-center py-8 sm:py-12">
|
||||
<svg class="h-14 w-14 sm:h-16 sm:w-16 text-slate-300 dark:text-slate-600 mx-auto mb-4 sm:mb-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
|
||||
</svg>
|
||||
<p class="text-slate-700 dark:text-slate-300 text-base sm:text-lg font-medium">${emptyMessage}</p>
|
||||
${currentFilter === 'all' && printers.length === 0 ? `
|
||||
{% if current_user.is_admin %}
|
||||
<button id="addFirstPrinterBtn" class="mt-4 sm:mt-5 action-btn-new success">
|
||||
<svg class="h-4 w-4 sm:h-5 sm:w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
|
||||
</svg>
|
||||
<span>Ersten Drucker hinzufügen</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
` : ''}
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Event-Listener für den "Ersten Drucker hinzufügen" Button
|
||||
const addFirstPrinterBtn = document.getElementById('addFirstPrinterBtn');
|
||||
if (addFirstPrinterBtn) {
|
||||
// Entferne vorherige Event-Listener, um doppelte Registrierung zu vermeiden
|
||||
const clonedBtn = addFirstPrinterBtn.cloneNode(true);
|
||||
addFirstPrinterBtn.parentNode.replaceChild(clonedBtn, addFirstPrinterBtn);
|
||||
|
||||
clonedBtn.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
showAddPrinterModal();
|
||||
});
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
grid.innerHTML = filteredPrinters.map(printer => {
|
||||
const isOnline = printer.status === 'available' || printer.is_online;
|
||||
const statusText = getPrinterStatusText(printer.status);
|
||||
|
||||
return `
|
||||
<div class="printer-card-new ${isOnline ? 'online' : ''}">
|
||||
${isOnline ? '<div class="online-indicator"></div>' : ''}
|
||||
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-base sm:text-lg font-bold ${isOnline ? 'text-green-800 dark:text-green-300' : 'text-slate-900 dark:text-white'}">${printer.name}</h3>
|
||||
<p class="text-xs sm:text-sm ${isOnline ? 'text-green-700 dark:text-green-400' : 'text-slate-600 dark:text-slate-400'}">${printer.model}</p>
|
||||
</div>
|
||||
<div class="flex flex-col items-end">
|
||||
<span class="status-badge-new ${isOnline ? 'online' : 'offline'}">
|
||||
${isOnline ? '🟢' : '🔴'} ${statusText}
|
||||
</span>
|
||||
${printer.last_checked ?
|
||||
`<span class="text-xs ${isOnline ? 'text-green-600 dark:text-green-400' : 'text-slate-500 dark:text-slate-400'} mt-1.5">
|
||||
Geprüft: ${formatTime(printer.last_checked)}
|
||||
</span>` : ''}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="space-y-2 mb-4">
|
||||
<div class="printer-info-row">
|
||||
<svg class="printer-info-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z" />
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z" />
|
||||
</svg>
|
||||
<span>${printer.location}</span>
|
||||
</div>
|
||||
|
||||
<div class="printer-info-row">
|
||||
<svg class="printer-info-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
|
||||
</svg>
|
||||
<span class="font-mono text-xs">${printer.mac_address}</span>
|
||||
</div>
|
||||
|
||||
<div class="printer-info-row">
|
||||
<svg class="printer-info-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9v-9m0-9v9" />
|
||||
</svg>
|
||||
<span class="font-mono text-xs">${printer.plug_ip}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2">
|
||||
<button class="printer-detail-btn flex-1 action-btn-new primary text-xs" data-printer-id="${printer.id}">
|
||||
Details
|
||||
</button>
|
||||
|
||||
{% if current_user.is_admin %}
|
||||
<button class="delete-printer-btn flex-1 action-btn-new danger text-xs" data-printer-id="${printer.id}">
|
||||
<svg class="h-3.5 w-3.5 sm:h-4 sm:w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
|
||||
</svg>
|
||||
Löschen
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}).join('');
|
||||
|
||||
// Sichere Ereignisbehandlung: Alte Event-Listener entfernen, indem wir neue Listener hinzufügen
|
||||
document.querySelectorAll('.printer-detail-btn').forEach(btn => {
|
||||
// Entferne alte Listener durch Klon-Ersetzung
|
||||
const clonedBtn = btn.cloneNode(true);
|
||||
btn.parentNode.replaceChild(clonedBtn, btn);
|
||||
|
||||
// Füge neuen Listener hinzu
|
||||
clonedBtn.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
const printerId = parseInt(this.getAttribute('data-printer-id'));
|
||||
if (printerId) {
|
||||
showPrinterDetail(printerId);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
document.querySelectorAll('.delete-printer-btn').forEach(btn => {
|
||||
// Entferne alte Listener durch Klon-Ersetzung
|
||||
const clonedBtn = btn.cloneNode(true);
|
||||
btn.parentNode.replaceChild(clonedBtn, btn);
|
||||
|
||||
// Füge neuen Listener hinzu
|
||||
clonedBtn.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
const printerId = parseInt(this.getAttribute('data-printer-id'));
|
||||
if (printerId) {
|
||||
deletePrinter(printerId);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user