Slight fix of the displaying of the detailed view, for the bibliothek

Web/templates/library_table.html

@@ -1331,40 +1331,34 @@
         detailContent.innerHTML = '<p>Lade Details...</p>';
         detailModal.style.display = 'flex';
 
-        // Sicherer Zugriff auf das Item mit Fallback
+        fetch(`/api/item_detail/${itemId}`)
-        const item = libraryItems.find(i => i._id === itemId);
+            .then(response => {
+                if (!response.ok) {
+                    throw new Error('Fehler beim Laden der Artikeldetails');
+                }
+                return response.json();
+            })
+            .then(data => {
                 let mediaHtml = '';
-
+                const imageArray = data.images || [];
-        if (item) {
-            // Prüfe gängige Array-Namen aus dem Backend
-            const imageArray = item.Images || item.Bilder || item.images;
 
                 if (Array.isArray(imageArray) && imageArray.length > 0) {
                     const imagesHtml = imageArray.map(image => {
-                    // Direkter, robuster Pfad zur Upload-Route
                         const imageSrc = image.startsWith('/uploads/') || image.startsWith('http')
                             ? image
                             : `/uploads/${image}`;
 
-                    return `<img src="${imageSrc}" alt="${escapeHtml(item.Name || 'Medium')}" class="item-image" style="width: 120px; height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid #ddd; margin-right: 15px; margin-bottom: 15px;">`;
+                        return `<img src="${imageSrc}" alt="Buchcover / Bild" class="item-image" style="width: 120px; height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid #ddd; margin-right: 15px; margin-bottom: 15px;">`;
                     }).join('');
 
                     mediaHtml = `<div class="detail-gallery-container" style="margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid #eee; display: flex; flex-wrap: wrap;">${imagesHtml}</div>`;
                 }
-        }
 
-        // Zusätzliche Details vom Backend laden
+                detailContent.innerHTML = mediaHtml + data.html;
-        fetch(`/api/item_detail/${itemId}`)
-            .then(response => {
-                if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
-                return response.text();
             })
-            .then(html => {
+            .catch(error => {
-                detailContent.innerHTML = mediaHtml + DOMPurify.sanitize(html);
+                console.error('Error fetching item detail:', error);
-            })
+                detailContent.innerHTML = '<p style="color: red;">Fehler beim Laden der Artikeldetails.</p>';
-            .catch(err => {
-                console.error('Error loading detail:', err);
-                detailContent.innerHTML = '<p style="color: red;">Entschuldigung, die Details konnten nicht geladen werden.</p>';
             });
     }