Cập nhật chế độ quản lí scene trong dashboard của người dùng
This commit is contained in:
+96
-47
@@ -10,6 +10,8 @@ let miniMapMarker = null;
|
||||
let systemSettings = { timezone: 'Asia/Ho_Chi_Minh', language: 'vi' };
|
||||
let returnToDashboardAfterEdit = false;
|
||||
let assetIdToDelete = null;
|
||||
let sceneIdToDelete = null;
|
||||
let dashboardReturnTab = 'media-library';
|
||||
let editMiniMap = null;
|
||||
let editMiniMapMarker = null;
|
||||
let currentEditingScene = null; // Lưu object scene đang sửa để quản lý chia sẻ
|
||||
@@ -139,23 +141,15 @@ function updateProfileTabContent() {
|
||||
const role = localStorage.getItem('role');
|
||||
|
||||
if (username) {
|
||||
document.getElementById('profile-avatar-initials').innerText = username.charAt(0).toUpperCase();
|
||||
document.getElementById('profile-username-display').innerText = username;
|
||||
document.getElementById('profile-status-display').innerText = role || 'Thành viên'; // Hiển thị vai trò làm trạng thái
|
||||
}
|
||||
}
|
||||
const avatar = document.getElementById('profile-avatar-initials');
|
||||
const userDisplay = document.getElementById('profile-username-display');
|
||||
const statusDisplay = document.getElementById('profile-status-display');
|
||||
const userInput = document.getElementById('profile-username');
|
||||
|
||||
/**
|
||||
* Cập nhật nội dung tab Hồ sơ với thông tin người dùng
|
||||
*/
|
||||
function updateProfileTabContent() {
|
||||
const username = localStorage.getItem('username');
|
||||
const role = localStorage.getItem('role');
|
||||
|
||||
if (username) {
|
||||
document.getElementById('profile-avatar-initials').innerText = username.charAt(0).toUpperCase();
|
||||
document.getElementById('profile-username-display').innerText = username;
|
||||
document.getElementById('profile-status-display').innerText = role || 'Thành viên'; // Hiển thị vai trò làm trạng thái
|
||||
if (avatar) avatar.innerText = username.charAt(0).toUpperCase();
|
||||
if (userDisplay) userDisplay.innerText = username;
|
||||
if (statusDisplay) statusDisplay.innerText = role || 'Thành viên';
|
||||
if (userInput) userInput.value = username;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -458,9 +452,10 @@ function closeModal() {
|
||||
document.getElementById('shared-with-group').style.display = 'none';
|
||||
|
||||
if (returnToDashboardAfterEdit) {
|
||||
const targetTab = dashboardReturnTab;
|
||||
returnToDashboardAfterEdit = false;
|
||||
openDashboard();
|
||||
openDashboardTab('media-library');
|
||||
openDashboardTab(targetTab);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -700,11 +695,10 @@ async function handleEditDeleteScene(scene) {
|
||||
};
|
||||
|
||||
// Gán sự kiện cho nút Xóa
|
||||
deleteBtn.onclick = async () => {
|
||||
if (confirm(`Cảnh báo: Thao tác này sẽ xóa vĩnh viễn scene "${scene.title}" và tệp tin ảnh 360 liên quan. Bạn có chắc chắn?`)) {
|
||||
closeActionModal();
|
||||
await deleteScene(scene._id);
|
||||
}
|
||||
deleteBtn.onclick = () => {
|
||||
returnToDashboardAfterEdit = false; // Đảm bảo không mở dashboard nếu xóa từ map
|
||||
closeActionModal();
|
||||
deleteScene(scene._id);
|
||||
};
|
||||
}
|
||||
|
||||
@@ -737,24 +731,49 @@ function openEditSceneModal(scene) {
|
||||
}
|
||||
|
||||
/**
|
||||
* Deletes a scene via API
|
||||
* Mở modal xác nhận xóa scene
|
||||
*/
|
||||
async function deleteScene(sceneId) {
|
||||
if (!confirm('Bạn có chắc chắn muốn xóa scene này?')) return;
|
||||
window.deleteScene = function(sceneId) {
|
||||
sceneIdToDelete = sceneId;
|
||||
document.getElementById('delete-scene-confirm-modal').style.display = 'flex';
|
||||
};
|
||||
|
||||
window.closeDeleteSceneModal = function() {
|
||||
document.getElementById('delete-scene-confirm-modal').style.display = 'none';
|
||||
sceneIdToDelete = null;
|
||||
|
||||
if (returnToDashboardAfterEdit) {
|
||||
const targetTab = dashboardReturnTab;
|
||||
returnToDashboardAfterEdit = false;
|
||||
openDashboard();
|
||||
openDashboardTab(targetTab);
|
||||
}
|
||||
};
|
||||
|
||||
window.confirmDeleteScene = async function() {
|
||||
if (!sceneIdToDelete) return;
|
||||
|
||||
const token = localStorage.getItem('jwt');
|
||||
try {
|
||||
const response = await fetch(`${API_BASE_URL}/scenes/${sceneId}`, {
|
||||
const response = await fetch(`${API_BASE_URL}/scenes/${sceneIdToDelete}`, {
|
||||
method: 'DELETE',
|
||||
headers: { 'Authorization': `Bearer ${token}` }
|
||||
});
|
||||
if (!response.ok) throw new Error('Failed to delete scene');
|
||||
alert('Scene deleted successfully');
|
||||
const data = await response.json();
|
||||
|
||||
if (!response.ok) throw new Error(data.message || 'Failed to delete scene');
|
||||
|
||||
closeDeleteSceneModal();
|
||||
showSuccessModal(data.message || 'Scene đã được xóa vĩnh viễn');
|
||||
|
||||
loadScenes();
|
||||
if (document.getElementById('tab-my-scenes').classList.contains('active')) loadMyScenes();
|
||||
if (document.getElementById('tab-my-scenes').classList.contains('active')) {
|
||||
loadMyScenes();
|
||||
}
|
||||
} catch (error) {
|
||||
alert(error.message);
|
||||
alert("Lỗi khi xóa: " + error.message);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Fetches secure scene details and triggers the Panorama viewer
|
||||
@@ -1219,6 +1238,8 @@ function closeDashboard() {
|
||||
async function loadMyScenes() {
|
||||
const token = localStorage.getItem('jwt');
|
||||
const listContainer = document.getElementById('my-scenes-list');
|
||||
// Chuyển sang grid để đồng bộ với media library
|
||||
listContainer.className = 'dashboard-grid';
|
||||
listContainer.innerHTML = '<p>Đang tải danh sách...</p>';
|
||||
|
||||
try {
|
||||
@@ -1235,23 +1256,48 @@ async function loadMyScenes() {
|
||||
}
|
||||
|
||||
scenes.forEach(scene => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'dashboard-item';
|
||||
item.innerHTML = `
|
||||
<div class="item-info">
|
||||
<strong>${scene.name || scene.title}</strong>
|
||||
<span>Quyền: ${scene.privacy} - Ngày tạo: ${formatSystemDate(scene.createdAt)}</span>
|
||||
</div>
|
||||
<div class="item-actions">
|
||||
<button class="edit-btn" id="edit-${scene._id}">Sửa</button>
|
||||
<button class="delete-btn" onclick="deleteScene('${scene._id}')">Xóa</button>
|
||||
const assetId = scene.assetId?._id || scene.assetId;
|
||||
let thumbUrl = `${API_BASE_URL}/assets/view/${assetId}`;
|
||||
if (token) thumbUrl += `?token=${token}`;
|
||||
|
||||
const card = document.createElement('div');
|
||||
card.className = 'scene-card';
|
||||
card.style.backgroundImage = `url('${thumbUrl}')`;
|
||||
|
||||
card.innerHTML = `
|
||||
<div class="scene-card-overlay">
|
||||
<div class="scene-card-info">
|
||||
<strong>${scene.name || scene.title}</strong>
|
||||
<p class="scene-desc">${scene.description || 'Không có mô tả'}</p>
|
||||
<div class="scene-card-meta">
|
||||
<span>🔒 ${scene.privacy}</span>
|
||||
<span>👤 ${scene.createdBy?.username || 'Bạn'}</span>
|
||||
<span>📅 ${formatSystemDate(scene.createdAt)}</span>
|
||||
</div>
|
||||
</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="delete-btn-small" id="delete-scene-${scene._id}">Xóa</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
listContainer.appendChild(item);
|
||||
// Gán sự kiện sửa bằng code để truyền object scene an toàn
|
||||
document.getElementById(`edit-${scene._id}`).onclick = () => {
|
||||
returnToDashboardAfterEdit = false;
|
||||
openEditSceneModal(scene);
|
||||
listContainer.appendChild(card);
|
||||
|
||||
// Xử lý nút Sửa: Logic đóng dashboard -> mở modal -> quay lại dashboard
|
||||
document.getElementById(`edit-scene-${scene._id}`).onclick = () => {
|
||||
dashboardReturnTab = 'my-scenes';
|
||||
returnToDashboardAfterEdit = true;
|
||||
closeDashboard();
|
||||
// Mặc định truyền false cho isChild, logic backend sẽ xử lý cascade privacy sau
|
||||
openEditMetadataModal(scene, false);
|
||||
};
|
||||
|
||||
// Xử lý nút Xóa (Sẽ được hoàn thiện ở Bước 4)
|
||||
document.getElementById(`delete-scene-${scene._id}`).onclick = () => {
|
||||
dashboardReturnTab = 'my-scenes';
|
||||
returnToDashboardAfterEdit = true;
|
||||
closeDashboard();
|
||||
deleteScene(scene._id);
|
||||
};
|
||||
});
|
||||
} catch (e) {
|
||||
@@ -1313,6 +1359,7 @@ async function loadMyAssets() {
|
||||
const editButton = document.createElement('button');
|
||||
editButton.className = 'edit-btn-small';
|
||||
editButton.innerText = 'Sửa Scene';
|
||||
dashboardReturnTab = 'media-library';
|
||||
const isChild = asset.parentScenes && asset.parentScenes.length > 0;
|
||||
editButton.addEventListener('click', () => openEditFromMedia(scene, isChild));
|
||||
card.querySelector('.media-actions').appendChild(editButton);
|
||||
@@ -1406,6 +1453,7 @@ window.openEditFromMedia = function(scene, isChild = false) {
|
||||
alert("Không thể chỉnh sửa: Ảnh này không được gắn với một Scene hợp lệ.");
|
||||
return;
|
||||
}
|
||||
dashboardReturnTab = 'media-library';
|
||||
returnToDashboardAfterEdit = true;
|
||||
closeDashboard();
|
||||
openEditMetadataModal(scene, isChild);
|
||||
@@ -1454,9 +1502,10 @@ window.openEditMetadataModal = function(scene, isChild = false) {
|
||||
function closeEditMetadataModal() {
|
||||
document.getElementById('edit-scene-metadata-modal').style.display = 'none';
|
||||
if (returnToDashboardAfterEdit) {
|
||||
const targetTab = dashboardReturnTab;
|
||||
returnToDashboardAfterEdit = false;
|
||||
openDashboard();
|
||||
openDashboardTab('media-library');
|
||||
openDashboardTab(targetTab);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user