core/Projektarbeit-MYP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🐛 Backend Documentation Fix for Button Reservation Creation Issue & Undefined Jobs Problem 🖥️📚

Browse Source
This commit is contained in:
Till Tomczak
2025-06-20 12:16:21 +02:00
parent 533132002a
commit b29b38c8a4
22 changed files with 580 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

183
backend/templates/jobs.html
View File

@ -1059,15 +1059,16 @@ class JobManager {
const fileArea = document.getElementById('file-upload-area');
const fileInput = document.getElementById('stl_file');
fileArea.addEventListener('click', () => fileInput.click());
fileArea.addEventListener('dragover', this.handleDragOver.bind(this));
fileArea.addEventListener('dragleave', this.handleDragLeave.bind(this));
fileArea.addEventListener('drop', this.handleFileDrop.bind(this));
fileInput.addEventListener('change', this.handleFileSelect.bind(this));
if (fileArea && fileInput) {
fileArea.addEventListener('click', () => fileInput.click());
fileArea.addEventListener('dragover', this.handleDragOver.bind(this));
fileArea.addEventListener('dragleave', this.handleDragLeave.bind(this));
fileArea.addEventListener('drop', this.handleFileDrop.bind(this));
fileInput.addEventListener('change', this.handleFileSelect.bind(this));
}
// Form Submissions
document.getElementById('newJobForm').addEventListener('submit', this.handleJobSubmit.bind(this));
document.getElementById('quickReservationForm').addEventListener('submit', this.handleQuickReservation.bind(this));
// Form Submissions - Robuste Registrierung
this.setupFormSubmitListeners();
// Modal Close Events
document.addEventListener('keydown', (e) => {
@ -1077,6 +1078,80 @@ class JobManager {
});
}
setupFormSubmitListeners() {
// Main Job Form Handler - Robust mit Retry-Mechanismus
const setupMainFormListener = () => {
const mainForm = document.getElementById('newJobForm');
if (mainForm) {
console.log('✅ Hauptformular gefunden - Event Listener wird registriert');
// Entferne vorherige Listener um Duplikate zu vermeiden
mainForm.removeEventListener('submit', this.handleJobSubmit.bind(this));
mainForm.addEventListener('submit', this.handleJobSubmit.bind(this));
return true;
}
return false;
};
// Quick Reservation Form Handler
const setupQuickFormListener = () => {
const quickForm = document.getElementById('quickReservationForm');
if (quickForm) {
console.log('✅ Schnell-Reservierung Formular gefunden - Event Listener wird registriert');
quickForm.removeEventListener('submit', this.handleQuickReservation.bind(this));
quickForm.addEventListener('submit', this.handleQuickReservation.bind(this));
return true;
}
return false;
};
// Sofort versuchen
const mainFormReady = setupMainFormListener();
const quickFormReady = setupQuickFormListener();
// Falls Formulare nicht sofort verfügbar sind, mit Observer überwachen
if (!mainFormReady || !quickFormReady) {
console.log('⏳ Einige Formulare nicht sofort verfügbar - verwende MutationObserver');
const observer = new MutationObserver(() => {
if (!mainFormReady && setupMainFormListener()) {
console.log('✅ Hauptformular nachträglich gefunden und registriert');
}
if (!quickFormReady && setupQuickFormListener()) {
console.log('✅ Schnell-Formular nachträglich gefunden und registriert');
}
});
observer.observe(document.body, {
childList: true,
subtree: true
});
// Observer nach 10 Sekunden stoppen
setTimeout(() => observer.disconnect(), 10000);
}
// Default-Startzeiten setzen
this.setDefaultStartTimes();
}
setDefaultStartTimes() {
// Startzeit für Quick Reservation
const startTimeInput = document.getElementById('quick-start-time');
if (startTimeInput) {
const now = new Date();
now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
startTimeInput.value = now.toISOString().slice(0, 16);
}
// Startzeit für Hauptformular
const mainStartTimeInput = document.getElementById('start_time');
if (mainStartTimeInput) {
const now = new Date();
now.setMinutes(now.getMinutes() - now.getTimezoneOffset());
mainStartTimeInput.value = now.toISOString().slice(0, 16);
}
}
async loadJobs() {
try {
document.getElementById('jobs-loading').classList.remove('hidden');
@ -1893,6 +1968,10 @@ class JobManager {
async handleJobSubmit(e) {
e.preventDefault();
console.log('🚀 Job-Submit gestartet');
console.log('📋 Event:', e);
console.log('📋 Form:', e.target);
const formData = new FormData(e.target);
const jobData = {
printer_id: parseInt(formData.get('printer_id')),
@ -1901,23 +1980,54 @@ class JobManager {
name: formData.get('job_title') || 'Neuer Druckjob'
};
console.log('📋 Job-Daten:', jobData);
// Validierung
if (!jobData.printer_id) {
this.showError('Bitte wählen Sie einen Drucker aus');
return;
}
if (!jobData.start_iso) {
this.showError('Bitte geben Sie eine Startzeit an');
return;
}
if (!jobData.duration_minutes || jobData.duration_minutes <= 0) {
this.showError('Bitte geben Sie eine gültige Dauer ein');
return;
}
if (!jobData.name || jobData.name.trim() === '') {
this.showError('Bitte geben Sie einen Job-Titel ein');
return;
}
// Submit-Button deaktivieren um Doppel-Submits zu verhindern
const submitBtn = e.target.querySelector('button[type="submit"]');
if (submitBtn) {
submitBtn.disabled = true;
submitBtn.innerHTML = '<span class="loading-spinner"></span> Erstelle...';
}
// File upload handling (optional)
const fileInput = document.getElementById('stl_file');
let uploadedFilePath = null;
if (fileInput.files.length > 0) {
if (fileInput && fileInput.files.length > 0) {
try {
console.log('📁 Datei-Upload gestartet');
// Datei hochladen
const uploadResult = await this.uploadJobFile(fileInput.files[0]);
if (uploadResult.success) {
uploadedFilePath = uploadResult.path;
console.log('Datei erfolgreich hochgeladen:', uploadResult.filename);
console.log('✅ Datei erfolgreich hochgeladen:', uploadResult.filename);
} else {
this.showError(`Fehler beim Datei-Upload: ${uploadResult.error}`);
return;
}
} catch (error) {
console.error('Fehler beim Datei-Upload:', error);
console.error('❌ Fehler beim Datei-Upload:', error);
this.showError('Fehler beim Hochladen der Datei');
return;
}
@ -1929,6 +2039,7 @@ class JobManager {
}
try {
console.log('🌐 Sende API-Request');
const response = await fetch('/api/jobs', {
method: 'POST',
headers: {
@ -1938,7 +2049,9 @@ class JobManager {
body: JSON.stringify(jobData)
});
console.log('📡 API Response Status:', response.status);
const data = await response.json();
console.log('📡 API Response Data:', data);
if (data.success) {
this.showSuccess('Job erfolgreich erstellt!');
@ -1948,13 +2061,34 @@ class JobManager {
e.target.reset();
// Collapse form
toggleFormExpansion();
const expandedForm = document.getElementById('expanded-form');
if (expandedForm && !expandedForm.classList.contains('hidden')) {
toggleFormExpansion();
}
// Show additional info if immediate start
if (data.immediate_start) {
setTimeout(() => {
this.showSuccess('Job wurde sofort gestartet und Drucker eingeschaltet!');
}, 1000);
}
} else {
this.showError(`Fehler beim Erstellen: ${data.error}`);
}
} catch (error) {
console.error('Error creating job:', error);
console.error('❌ Fehler beim Job-Submit:', error);
this.showError('Fehler beim Erstellen des Jobs');
} finally {
// Submit-Button wieder aktivieren
if (submitBtn) {
submitBtn.disabled = false;
submitBtn.innerHTML = `
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
</svg>
<span>Reservierung erstellen</span>
`;
}
}
}
@ -2156,16 +2290,39 @@ function showQuickReservation() {
}
function toggleFormExpansion() {
console.log('🔄 toggleFormExpansion() aufgerufen');
const expandedForm = document.getElementById('expanded-form');
const toggleBtn = document.getElementById('form-toggle-btn');
const toggleText = toggleBtn.querySelector('span');
const toggleIcon = toggleBtn.querySelector('svg');
console.log('📋 Expandierte Form:', expandedForm);
console.log('🔘 Toggle-Button:', toggleBtn);
if (expandedForm.classList.contains('hidden')) {
console.log('👁️ Formular wird angezeigt');
expandedForm.classList.remove('hidden');
toggleText.textContent = 'Reduziert';
toggleIcon.style.transform = 'rotate(180deg)';
// Event-Listener für das Formular erneut registrieren falls nötig
setTimeout(() => {
const form = document.getElementById('newJobForm');
if (form && !form.hasAttribute('data-listener-added')) {
console.log('🔧 Registriere Event-Listener für erweiterte Form');
form.addEventListener('submit', (e) => {
console.log('📨 Formular-Submit über direkten Listener');
if (window.jobManager) {
window.jobManager.handleJobSubmit(e);
} else {
console.error('❌ JobManager nicht verfügbar');
}
});
form.setAttribute('data-listener-added', 'true');
}
}, 100);
} else {
console.log('👁️‍🗨️ Formular wird versteckt');
expandedForm.classList.add('hidden');
toggleText.textContent = 'Erweitert';
toggleIcon.style.transform = 'rotate(0deg)';