mirror of
https://github.com/Dvorinka/PPve.git
synced 2026-06-05 04:52:58 +00:00
d
This commit is contained in:
+76
-131
@@ -374,13 +374,14 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
let calendar;
|
// Get form reference
|
||||||
const reservationForm = document.getElementById('reservationForm');
|
const form = document.getElementById('reservationForm');
|
||||||
const statusMessage = document.getElementById('statusMessage');
|
const message = document.getElementById('statusMessage');
|
||||||
|
const messageText = document.getElementById('messageText');
|
||||||
|
|
||||||
// Initialize FullCalendar
|
// Initialize full calendar
|
||||||
const calendarEl = document.getElementById('calendar');
|
const calendarEl = document.getElementById('calendar');
|
||||||
calendar = new FullCalendar.Calendar(calendarEl, {
|
const calendar = new FullCalendar.Calendar(calendarEl, {
|
||||||
initialView: 'timeGridWeek',
|
initialView: 'timeGridWeek',
|
||||||
headerToolbar: {
|
headerToolbar: {
|
||||||
left: 'prev,next today',
|
left: 'prev,next today',
|
||||||
@@ -409,151 +410,95 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
calendar.render();
|
// Show status message function
|
||||||
|
function showMessage(text, type) {
|
||||||
// Form submission
|
const statusContainer = document.getElementById('statusMessage');
|
||||||
reservationForm.addEventListener('submit', async function(e) {
|
if (!statusContainer) {
|
||||||
e.preventDefault();
|
console.error('Status message container not found');
|
||||||
|
|
||||||
// Validate dates
|
|
||||||
const startDate = new Date(document.getElementById('startDateTime').value);
|
|
||||||
const endDate = new Date(document.getElementById('endDateTime').value);
|
|
||||||
|
|
||||||
if (endDate <= startDate) {
|
|
||||||
showStatus('Čas ukončení musí být později než čas začátku', 'error');
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Check vehicle availability
|
statusContainer.className = 'mt-4 p-4 rounded-md';
|
||||||
const vehicle = document.getElementById('vehicle').value;
|
statusContainer.classList.remove('hidden');
|
||||||
const isAvailable = await checkVehicleAvailability(vehicle, startDate, endDate);
|
|
||||||
|
|
||||||
if (!isAvailable) {
|
switch (type) {
|
||||||
showStatus('Vozidlo není v tomto čase dostupné', 'error');
|
case 'success':
|
||||||
return;
|
statusContainer.classList.add('bg-green-100', 'text-green-700');
|
||||||
|
break;
|
||||||
|
case 'error':
|
||||||
|
statusContainer.classList.add('bg-red-100', 'text-red-700');
|
||||||
|
break;
|
||||||
|
case 'info':
|
||||||
|
statusContainer.classList.add('bg-blue-100', 'text-blue-700');
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Prepare reservation data
|
statusContainer.textContent = text;
|
||||||
const reservationData = {
|
|
||||||
driverName: document.getElementById('driverName').value,
|
|
||||||
vehicle: vehicle,
|
|
||||||
startDateTime: startDate.toISOString(),
|
|
||||||
endDateTime: endDate.toISOString(),
|
|
||||||
purpose: document.getElementById('purpose').value
|
|
||||||
};
|
|
||||||
|
|
||||||
try {
|
|
||||||
const response = await fetch('/api/reservations', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify(reservationData)
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!response.ok) {
|
|
||||||
throw new Error('Chyba při vytváření rezervace');
|
|
||||||
}
|
|
||||||
|
|
||||||
showStatus('Rezervace byla úspěšně vytvořena', 'success');
|
|
||||||
calendar.refetchEvents();
|
|
||||||
reservationForm.reset();
|
|
||||||
} catch (error) {
|
|
||||||
showStatus(error.message, 'error');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
async function checkVehicleAvailability(vehicle, startDate, endDate) {
|
|
||||||
try {
|
|
||||||
const response = await fetch(`/api/check-availability?vehicle=${encodeURIComponent(vehicle)}&start=${startDate.toISOString()}&end=${endDate.toISOString()}`);
|
|
||||||
const data = await response.json();
|
|
||||||
return data.available;
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Error checking availability:', error);
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function showStatus(message, type) {
|
|
||||||
statusMessage.textContent = message;
|
|
||||||
statusMessage.className = 'mt-4 p-4 rounded-md';
|
|
||||||
statusMessage.classList.remove('hidden');
|
|
||||||
|
|
||||||
if (type === 'success') {
|
|
||||||
statusMessage.classList.add('bg-green-100', 'text-green-700');
|
|
||||||
} else {
|
|
||||||
statusMessage.classList.add('bg-red-100', 'text-red-700');
|
|
||||||
}
|
|
||||||
|
|
||||||
|
// Auto hide after 5 seconds
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
statusMessage.classList.add('hidden');
|
statusContainer.classList.add('hidden');
|
||||||
}, 5000);
|
}, 5000);
|
||||||
}
|
}
|
||||||
});
|
|
||||||
|
|
||||||
function showMessage(text, type) {
|
// Handle form submission
|
||||||
const message = document.getElementById('message');
|
if (form) {
|
||||||
const messageText = document.getElementById('messageText');
|
form.addEventListener('submit', async function(e) {
|
||||||
const messageIcon = document.getElementById('messageIcon');
|
e.preventDefault();
|
||||||
|
|
||||||
if (!message || !messageText || !messageIcon) {
|
// Validate dates
|
||||||
console.error('Message elements not found');
|
const startDate = new Date(document.getElementById('startDateTime').value);
|
||||||
return;
|
const endDate = new Date(document.getElementById('endDateTime').value);
|
||||||
}
|
|
||||||
|
|
||||||
message.classList.remove('hidden', 'bg-green-50', 'bg-red-50', 'bg-blue-50', 'text-green-800', 'text-red-800', 'text-blue-800');
|
if (endDate <= startDate) {
|
||||||
messageText.textContent = text;
|
showMessage('Čas ukončení musí být později než čas začátku', 'error');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
switch(type) {
|
// Check vehicle availability
|
||||||
case 'success':
|
const vehicle = document.getElementById('vehicle').value;
|
||||||
message.classList.add('bg-green-50', 'text-green-800');
|
const isAvailable = await checkVehicleAvailability(vehicle, startDate, endDate);
|
||||||
messageIcon.className = 'fas fa-check-circle text-green-600 mr-2';
|
|
||||||
break;
|
|
||||||
case 'error':
|
|
||||||
message.classList.add('bg-red-50', 'text-red-800');
|
|
||||||
messageIcon.className = 'fas fa-exclamation-circle text-red-600 mr-2';
|
|
||||||
break;
|
|
||||||
case 'info':
|
|
||||||
message.classList.add('bg-blue-50', 'text-blue-800');
|
|
||||||
messageIcon.className = 'fas fa-info-circle text-blue-600 mr-2';
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
|
|
||||||
message.classList.remove('hidden');
|
if (!isAvailable) {
|
||||||
}
|
showMessage('Vozidlo není v tomto čase dostupné', 'error');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
// Update form submission to handle API errors better
|
// Prepare reservation data
|
||||||
form.addEventListener('submit', async (e) => {
|
const reservationData = {
|
||||||
e.preventDefault();
|
|
||||||
|
|
||||||
try {
|
|
||||||
showMessage('Odesílání rezervace...', 'info');
|
|
||||||
|
|
||||||
const response = await fetch('/api/reservations', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: { 'Content-Type': 'application/json' },
|
|
||||||
body: JSON.stringify({
|
|
||||||
driverName: document.getElementById('driverName').value,
|
driverName: document.getElementById('driverName').value,
|
||||||
vehicle: document.getElementById('vehicle').value,
|
vehicle: vehicle,
|
||||||
startDateTime: new Date(dateStart.value + 'T' + timeStart.value).toISOString(),
|
startDateTime: startDate.toISOString(),
|
||||||
endDateTime: new Date(dateEnd.value + 'T' + timeEnd.value).toISOString(),
|
endDateTime: endDate.toISOString(),
|
||||||
purpose: document.getElementById('purpose').value || undefined // Make purpose optional
|
purpose: document.getElementById('purpose').value
|
||||||
})
|
};
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch('/api/reservations', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify(reservationData)
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error('Chyba při vytváření rezervace');
|
||||||
|
}
|
||||||
|
|
||||||
|
showMessage('Rezervace byla úspěšně vytvořena', 'success');
|
||||||
|
calendar.refetchEvents();
|
||||||
|
form.reset();
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error:', error);
|
||||||
|
showMessage(error.message || 'Nepodařilo se vytvořit rezervaci', 'error');
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
} else {
|
||||||
if (!response.ok) {
|
console.error('Reservation form not found');
|
||||||
throw new Error(response.statusText || 'Došlo k chybě při vytváření rezervace');
|
|
||||||
}
|
|
||||||
|
|
||||||
showMessage('Rezervace byla úspěšně vytvořena', 'success');
|
|
||||||
form.reset();
|
|
||||||
dateStart.value = todayStr;
|
|
||||||
dateEnd.value = todayStr;
|
|
||||||
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Error:', error);
|
|
||||||
showMessage(error.message || 'Nepodařilo se vytvořit rezervaci', 'error');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
calendar.render();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
Reference in New Issue
Block a user