Chỉnh sửa phần upload ảnh

frontend/js/main_map.js

@@ -1350,6 +1350,14 @@ async function loadMyScenes() {
             const card = document.createElement('div');
             card.className = 'scene-card';
             card.style.backgroundImage = `url('${thumbUrl}')`;
+
+            // Logic hiển thị badge trạng thái
+            let statusBadge = '';
+            if (scene.status === 'processing') {
+                statusBadge = '<span class="status-badge processing">⏳ Đang xử lý 8K...</span>';
+            } else if (scene.status === 'failed') {
+                statusBadge = '<span class="status-badge failed">❌ Lỗi xử lý</span>';
+            }
             
             card.innerHTML = `
                 <div class="scene-card-overlay">
@@ -1361,9 +1369,10 @@ async function loadMyScenes() {
                             <span>👤 ${scene.createdBy?.username || 'Bạn'}</span>
                             <span>📅 ${formatSystemDate(scene.createdAt)}</span>
                         </div>
+                        ${statusBadge}
                     </div>
                     <div class="media-actions" style="border: none; padding: 0;">
-                        <button class="edit-btn-small" id="edit-scene-${scene._id}">Sửa</button>
+                        <button class="edit-btn-small" id="edit-scene-${scene._id}" ${scene.status === 'processing' ? 'disabled style="opacity:0.5; cursor:not-allowed;"' : ''}>Sửa</button>
                         <button class="delete-btn-small" id="delete-scene-${scene._id}">Xóa</button>
                     </div>
                 </div>
@@ -1523,6 +1532,13 @@ async function loadMyAssets() {
             const card = document.createElement('div');
             card.className = `media-card ${isTrash ? 'trash-item' : ''}`;
             
+            let statusBadge = '';
+            if (scene?.status === 'processing') {
+                statusBadge = '<span class="status-badge processing" style="position:static; margin-top:5px; display:inline-block;">⏳ Đang nén 8K...</span>';
+            } else if (scene?.status === 'failed') {
+                statusBadge = '<span class="status-badge failed" style="position:static; margin-top:5px; display:inline-block;">❌ Lỗi</span>';
+            }
+
             // Build inner HTML without the onclick for edit/delete buttons
             let innerHtml = `
                 <div class="media-thumb">
@@ -1533,6 +1549,7 @@ async function loadMyAssets() {
                     <strong>${scene ? (scene.name || scene.title) : 'Chưa gắn Scene'}</strong>
                     <p class="desc">${scene?.description || 'Không có mô tả'}</p>
                     ${parentNames ? `<p class="parent-link">🔗 Liên kết từ: ${parentNames}</p>` : ''}
+                    ${statusBadge}
                     <span class="date">Tải lên: ${formatSystemDate(asset.createdAt)}</span>
                 </div>
                 <div class="media-actions">
@@ -1545,6 +1562,7 @@ async function loadMyAssets() {
                 const editButton = document.createElement('button');
                 editButton.className = 'edit-btn-small';
                 editButton.innerText = 'Sửa Scene';
+                if (scene.status === 'processing') editButton.disabled = true;
                 dashboardReturnTab = 'media-library';
                 const isChild = asset.parentScenes && asset.parentScenes.length > 0;
                 editButton.addEventListener('click', () => openEditFromMedia(scene, isChild)); 
@@ -1907,6 +1925,7 @@ async function submitEditScene(e) {
     formData.append('lat', document.getElementById('edit-modal-lat').value);
     formData.append('lng', document.getElementById('edit-modal-lng').value);
     formData.append('privacy', document.getElementById('edit-modal-privacy').value);
+    
     formData.append('shareExpireDays', document.getElementById('share-link-expire').value);
     // Đính kèm dữ liệu chia sẻ nâng cao
     formData.append('sharedWithUsers', JSON.stringify(sharedUsersData.map(u => u._id || u)));