diff --git a/rezervace-aut.html b/rezervace-aut.html index ea50bf9..f1ecaf5 100644 --- a/rezervace-aut.html +++ b/rezervace-aut.html @@ -684,12 +684,11 @@ Vytvořit novou rezervaci - - - +
-
-

Nadcházející rezervace

+
+

Aktuální a budoucí rezervace

+
@@ -956,8 +955,13 @@ ` }; } + // Calendar configuration const calendarConfig = { - initialView: 'timeGridWeek', + eventDidMount: function(info) { + // Add vehicle-specific class for styling + const vehicleClass = 'event-' + info.event.extendedProps.vehicle.toLowerCase().replace(/[^a-z0-9]+/g, '-'); + info.el.classList.add(vehicleClass); + }, initialView: 'dayGridMonth', headerToolbar: { left: 'prev,next today', center: 'title', @@ -979,17 +983,16 @@ }, eventClassNames: function(arg) { return ['event-' + arg.event.extendedProps.vehicle.toLowerCase().replace(/\s+/g, '-')]; - }, - eventContent: { - html: function(arg) { - return ` + }, eventContent: function(arg) { + return { + html: `
-
${arg.timeText}
${arg.event.extendedProps.driverName}
-
${arg.event.extendedProps.vehicle}
+
${arg.timeText}
+
${arg.event.extendedProps.vehicle}
- `; - } + ` + }; }, dateClick: function(info) { const now = Date.now(); @@ -1094,30 +1097,53 @@ // Function to update reservations list function updateReservationsList() { const reservationsList = document.getElementById('reservationsList'); + const reservationsCount = document.getElementById('reservationsCount'); const events = calendar.getEvents(); - // Sort events by start date + // Get current date at start of day const now = new Date(); - const futureEvents = events - .filter(event => event.start >= now) + now.setHours(0, 0, 0, 0); + + // Filter and sort events + const currentAndFutureEvents = events + .filter(event => { + const eventDate = new Date(event.start); + eventDate.setHours(0, 0, 0, 0); + return eventDate >= now; + }) .sort((a, b) => a.start.getTime() - b.start.getTime()); - if (futureEvents.length === 0) { - reservationsList.innerHTML = '
Žádné nadcházející rezervace
'; + // Update count + reservationsCount.textContent = currentAndFutureEvents.length > 0 + ? `Celkem: ${currentAndFutureEvents.length} rezervací` + : ''; + + if (currentAndFutureEvents.length === 0) { + reservationsList.innerHTML = '
Žádné aktuální ani budoucí rezervace
'; return; } - const html = futureEvents.map(event => { - const vehicleClass = 'event-' + event.extendedProps.vehicle.toLowerCase().replace(/\s+/g, '-'); + const html = currentAndFutureEvents.map(event => { + const vehicleClass = 'event-' + event.extendedProps.vehicle.toLowerCase().replace(/[^a-z0-9]+/g, '-'); const startDate = formatDateTime(event.start); const endDate = formatDateTime(event.end); + // Check if the reservation is for today + const today = new Date(); + const eventDate = new Date(event.start); + const isToday = eventDate.getDate() === today.getDate() && + eventDate.getMonth() === today.getMonth() && + eventDate.getFullYear() === today.getFullYear(); + return ` -
-
+
+
-
${event.extendedProps.driverName}
+
+ ${event.extendedProps.driverName} + ${isToday ? 'Dnes' : ''} +
${event.extendedProps.vehicle}
@@ -1197,6 +1223,68 @@ // Update initial state updateReservationsList(); + + // Event modal functions + function showEventModal(event) { + const modal = document.getElementById('eventModal'); + const modalContent = modal.querySelector('.modal-body .info-grid'); + + const startDate = formatDateTime(event.start); + const endDate = formatDateTime(event.end); + + modalContent.innerHTML = ` +
Řidič:
+
${event.extendedProps.driverName}
+ +
Vozidlo:
+
${event.extendedProps.vehicle}
+ +
Začátek:
+
${startDate}
+ +
Konec:
+
${endDate}
+ +
Účel:
+
${event.extendedProps.purpose || '(není uvedeno)'}
+ `; + + // Show delete button only for user's own reservations + const deleteBtn = document.getElementById('deleteReservation'); + if (deleteBtn) { + deleteBtn.classList.remove('hidden'); + deleteBtn.onclick = async function() { + if (confirm('Opravdu chcete zrušit tuto rezervaci?')) { + try { + const response = await fetch(`/api/reservations/${event.id}`, { + method: 'DELETE' + }); + if (response.ok) { + event.remove(); + modal.style.display = 'none'; + updateReservationsList(); + } + } catch (error) { + console.error('Error deleting reservation:', error); + } + } + }; + } + + modal.style.display = 'block'; + } + + // Close modal when clicking the close button or outside + document.querySelector('.modal-close').onclick = function() { + document.getElementById('eventModal').style.display = 'none'; + } + + window.onclick = function(event) { + const modal = document.getElementById('eventModal'); + if (event.target == modal) { + modal.style.display = 'none'; + } + } });