gateway/backend/webparts/part-data.js
2025-03-15 19:53:40 +01:00

111 lines
4.2 KiB
JavaScript

// data-module.js
(function() {
// DOM-Elemente
let dataFileInput, uploadBtn, myFilesList;
// Initialisierungsfunktion für das Daten-Modul
function initDataModule(globalState) {
// DOM-Elemente referenzieren
dataFileInput = document.getElementById('data-file-input');
uploadBtn = document.getElementById('data-upload-btn');
myFilesList = document.getElementById('my-files-list');
// Event-Listener hinzufügen
setupEventListeners(globalState);
// Initialdaten rendern
renderMyFiles(globalState);
}
// Event-Listener einrichten
function setupEventListeners(globalState) {
// Datei-Upload
uploadBtn.addEventListener('click', () => dataFileInput.click());
dataFileInput.addEventListener('change',
window.globalUtils.handleFileUpload(dataFileInput, (newFile) => {
// Nach erfolgreichem Upload
globalState.availableFiles.push(newFile);
renderMyFiles(globalState);
})
);
}
// Meine Dateien rendern
function renderMyFiles(globalState) {
if (!myFilesList) return;
myFilesList.innerHTML = '';
if (globalState.availableFiles.length === 0) {
myFilesList.innerHTML = '<div class="empty-state">Keine Dateien vorhanden.</div>';
return;
}
globalState.availableFiles.forEach(file => {
const li = document.createElement('li');
li.className = 'file-item';
li.innerHTML = `
<div class="file-item-name">
<i class="fas ${file.type === 'document' ? 'fa-file-alt' : 'fa-file-image'}"></i>
<span>${file.name}</span>
</div>
<div class="file-item-info">
<span>${file.size || ''}</span>
<span>${new Date(file.upload_date || Date.now()).toLocaleString()}</span>
</div>
<div class="file-actions">
<button class="view-file-btn" data-id="${file.id}">
<i class="fas fa-eye"></i>
</button>
<button class="delete-file-btn" data-id="${file.id}">
<i class="fas fa-trash"></i>
</button>
</div>
`;
myFilesList.appendChild(li);
});
// Event-Listener für Datei-Aktionen
setupFileActionListeners(globalState);
}
// Event-Listener für Datei-Aktionen
function setupFileActionListeners(globalState) {
// Datei anzeigen
document.querySelectorAll('.view-file-btn').forEach(btn => {
btn.addEventListener('click', () => {
const fileId = btn.getAttribute('data-id');
const file = globalState.availableFiles.find(f => f.id === fileId);
if (file && file.path) {
window.open(file.path, '_blank');
} else {
alert('Datei nicht verfügbar');
}
});
});
// Datei löschen
document.querySelectorAll('.delete-file-btn').forEach(btn => {
btn.addEventListener('click', async () => {
const fileId = btn.getAttribute('data-id');
if (confirm('Möchten Sie diese Datei wirklich löschen?')) {
try {
// TODO: API-Endpunkt zum Löschen implementieren
// await fetch(`/files/${fileId}`, { method: 'DELETE' });
// Aus dem globalen State entfernen
globalState.availableFiles = globalState.availableFiles.filter(f => f.id !== fileId);
// UI aktualisieren
renderMyFiles(globalState);
} catch (error) {
console.error("Fehler beim Löschen der Datei:", error);
}
}
});
});
}
// Modul-Initialisierung exportieren
window.initDataModule = initDataModule;
})();