"Refactor frontend templates and styles"

This commit is contained in:
2025-05-29 17:41:30 +02:00
parent b7062887b9
commit 06119be88b
8 changed files with 1752 additions and 1442 deletions

View File

@@ -860,7 +860,7 @@
<p class="text-mercedes-gray dark:text-slate-400 mb-8 leading-relaxed">
Es wurden keine 3D-Drucker gefunden, die den aktuellen Filterkriterien entsprechen.
Versuchen Sie, die Filter zu ändern oder fügen Sie Ihren ersten Drucker hinzu.
</p>
</p>
<div class="flex flex-col sm:flex-row gap-3 justify-center">
<button onclick="clearAllFilters()" class="btn-secondary">
Filter zurücksetzen
@@ -1252,7 +1252,7 @@ class PrinterManager {
document.getElementById('show-offline').addEventListener('change', this.applyFilters.bind(this));
document.getElementById('show-maintenance').addEventListener('change', this.applyFilters.bind(this));
document.getElementById('only-available').addEventListener('change', this.applyFilters.bind(this));
// Modal Event Listeners
document.getElementById('printerModel').addEventListener('change', this.handleModelChange.bind(this));
document.getElementById('printerForm').addEventListener('submit', this.handleFormSubmit.bind(this));
@@ -1270,7 +1270,7 @@ class PrinterManager {
}
async loadPrinters() {
try {
try {
this.showLoadingState();
const response = await fetch('/api/printers');
@@ -1634,8 +1634,8 @@ class PrinterManager {
online: allPrinters.filter(p => ['online', 'idle'].includes(p.status)).length,
offline: allPrinters.filter(p => p.status === 'offline').length,
printing: allPrinters.filter(p => p.status === 'printing').length
};
};
// Animate counter updates
this.animateCounter('total-count', stats.total);
this.animateCounter('online-count', stats.online);
@@ -1694,7 +1694,7 @@ class PrinterManager {
const locations = [...new Set(allPrinters.map(p => p.location).filter(Boolean))];
locationFilter.innerHTML = '<option value="">Alle Standorte</option>' +
locations.map(location => `<option value="${location}">${location}</option>`).join('');
// Populate model filter
const modelFilter = document.getElementById('filterModel');
const models = [...new Set(allPrinters.map(p => p.model).filter(Boolean))];
@@ -1711,8 +1711,8 @@ class PrinterManager {
const now = new Date();
document.getElementById('last-update-time').textContent = now.toLocaleTimeString('de-DE');
document.getElementById('last-update').textContent = `Letzte Aktualisierung: ${now.toLocaleTimeString('de-DE')}`;
}
}
// Utility functions
formatDuration(minutes) {
const hours = Math.floor(minutes / 60);
@@ -1778,13 +1778,13 @@ class PrinterManager {
closeModal(modalId) {
const modal = document.getElementById(modalId);
const content = modal.querySelector('.mercedes-modal, .dashboard-card');
content.classList.remove('scale-100', 'opacity-100');
content.classList.add('scale-95', 'opacity-0');
setTimeout(() => {
modal.classList.add('hidden');
}, 200);
}
}
}
// Initialize Printer Manager
@@ -1839,7 +1839,7 @@ function toggleGridView(view) {
currentGridView = view;
const gridBtn = document.getElementById('grid-view-btn');
const listBtn = document.getElementById('list-view-btn');
if (view === 'grid') {
gridBtn.classList.add('bg-mercedes-blue', 'text-white');
gridBtn.classList.remove('text-mercedes-gray', 'hover:bg-mercedes-silver');
@@ -1850,7 +1850,7 @@ function toggleGridView(view) {
listBtn.classList.remove('text-mercedes-gray', 'hover:bg-mercedes-silver');
gridBtn.classList.remove('bg-mercedes-blue', 'text-white');
gridBtn.classList.add('text-mercedes-gray', 'hover:bg-mercedes-silver');
}
}
printerManager.displayPrinters();
}
@@ -1878,6 +1878,6 @@ function closePrinterModal() {
function closePrinterDetailsModal() {
printerManager.closeModal('printerDetailsModal');
}
}
</script>
{% endblock %}