stromlinien_passau_magnetfeld/data_visualization_web_ui/js/app.js

67 lines
No EOL
1.7 KiB
JavaScript

import { fetchData, fetchAnalysis } from './api.js';
import { renderCharts, updateCharts } from './charts.js';
import { renderStats } from './stats.js';
/**
* @function initApp
* @description Initialisiert Eventlistener, ruft Datenladen und Rendering auf.
*/
export async function initApp() {
try {
const [data, analysis] = await Promise.all([
fetchData({}),
fetchAnalysis()
]);
renderCharts(data);
renderStats(analysis);
setupEventListeners();
} catch (error) {
console.error('Fehler bei der Initialisierung:', error);
}
}
/**
* @function setupEventListeners
* @description Verknüpft UI-Filterelemente mit der Filterlogik.
*/
function setupEventListeners() {
const filterForm = document.getElementById('filter-form');
if (filterForm) {
filterForm.addEventListener('change', handleFilterChange);
}
}
/**
* @function handleFilterChange
* @description Erfasst Nutzerinteraktionen mit Filterpanel und aktualisiert Diagramme.
* @param {Event} e - Change-Event vom Filterformular
*/
export async function handleFilterChange(e) {
e.preventDefault();
const form = e.target.closest('form');
if (!form) return;
const formData = new FormData(form);
const params = {
time_range: formData.get('time_range') || '24h',
sensor_id: formData.get('sensor_id') || 'all'
};
try {
const [newData, newAnalysis] = await Promise.all([
fetchData(params),
fetchAnalysis()
]);
updateCharts(newData);
renderStats(newAnalysis);
} catch (error) {
console.error('Fehler beim Aktualisieren der Filterdaten:', error);
}
}
// Initialisierung bei Seitenladeereignis
document.addEventListener('DOMContentLoaded', () => {
initApp();
});