50 lines
No EOL
1.4 KiB
JavaScript
50 lines
No EOL
1.4 KiB
JavaScript
import { fetchAlertData, fetchOutlierReport } from './api.js';
|
|
import { renderAlertTable, renderOutlierSummary, setLoadingState, clearLoadingState } from './ui.js';
|
|
|
|
/**
|
|
* Initialisiert die Anwendung, lädt Daten über API und rendert die UI.
|
|
*/
|
|
export async function initApp() {
|
|
const refreshButton = document.getElementById('refresh-btn');
|
|
if (refreshButton) {
|
|
refreshButton.addEventListener('click', handleRefresh);
|
|
}
|
|
|
|
await loadAndRenderData();
|
|
}
|
|
|
|
/**
|
|
* Lädt Daten von API-Endpunkten und aktualisiert die Oberfläche.
|
|
*/
|
|
async function loadAndRenderData() {
|
|
try {
|
|
setLoadingState();
|
|
const [alertData, outlierData] = await Promise.all([
|
|
fetchAlertData(),
|
|
fetchOutlierReport()
|
|
]);
|
|
|
|
renderAlertTable(alertData);
|
|
renderOutlierSummary(outlierData);
|
|
} catch (error) {
|
|
console.error('Fehler beim Laden der Daten:', error);
|
|
const messageElem = document.getElementById('status-msg');
|
|
if (messageElem) {
|
|
messageElem.textContent = 'Fehler beim Laden der Daten. Bitte versuchen Sie es erneut.';
|
|
messageElem.setAttribute('role', 'alert');
|
|
}
|
|
} finally {
|
|
clearLoadingState();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Behandelt Klick auf den Refresh-Button: Lädt Daten neu und aktualisiert DOM.
|
|
* @param {Event} event
|
|
*/
|
|
async function handleRefresh(event) {
|
|
event.preventDefault();
|
|
await loadAndRenderData();
|
|
}
|
|
|
|
window.addEventListener('load', initApp); |