b85c8c67e2
- Neuen Redux Slice `systemSettingsSlice` erstellt, um Systemdaten zentral zu verwalten. - Header-Icon für Systemeinstellungen holt jetzt Daten aus `systemSettingsSlice` statt `variablesSlice`. - Die Einstellungen-Seite (`Allgemeine Einstellungen`) wurde umgestellt und liest nun ebenfalls aus `systemSettingsSlice`. - UI-Optimierungen für die Einstellungen-Seite, um alle Eingabefelder kompakter darzustellen.
104 lines
3.1 KiB
TypeScript
104 lines
3.1 KiB
TypeScript
"use client";
|
|
// pages/_app.tsx
|
|
import { useEffect, useState } from "react";
|
|
import { loadWindowVariables } from "../utils/loadWindowVariables";
|
|
import Header from "../components/header/Header";
|
|
import Navigation from "../components/navigation/Navigation";
|
|
import Footer from "../components/footer/Footer";
|
|
import "../styles/globals.css";
|
|
import { Provider } from "react-redux";
|
|
import { setVariables } from "../redux/slices/variablesSlice";
|
|
import { setSystemSettings } from "../redux/slices/systemSettingsSlice"; // ✅ Für System-Settings
|
|
import store from "../redux/store";
|
|
import { AppProps } from "next/app";
|
|
import WindowVariablesInitializer from "../components/WindowVariablesInitializer";
|
|
|
|
function MyApp({ Component, pageProps }: AppProps) {
|
|
const [sessionExpired, setSessionExpired] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const loadAndStoreVariables = async () => {
|
|
try {
|
|
const variables = await loadWindowVariables();
|
|
if (!variables) throw new Error("Sitzungsfehler");
|
|
|
|
// ✅ System-Settings und last20Messages separat speichern
|
|
const {
|
|
last20Messages, // Entfernen für eigenes Redux-Slice
|
|
deviceName,
|
|
mac1,
|
|
ip,
|
|
subnet,
|
|
gateway,
|
|
cplInternalTimestamp,
|
|
ntp1,
|
|
ntp2,
|
|
ntp3,
|
|
ntpTimezone,
|
|
ntpActive,
|
|
...restVariables
|
|
} = variables;
|
|
|
|
// ✅ Speichere System-Settings in systemSettingsSlice
|
|
store.dispatch(
|
|
setSystemSettings({
|
|
deviceName,
|
|
mac1,
|
|
ip,
|
|
subnet,
|
|
gateway,
|
|
cplInternalTimestamp,
|
|
ntp1,
|
|
ntp2,
|
|
ntp3,
|
|
ntpTimezone,
|
|
ntpActive,
|
|
})
|
|
);
|
|
|
|
// ✅ Speichere alle anderen Variablen in variablesSlice
|
|
store.dispatch(setVariables(restVariables));
|
|
|
|
setSessionExpired(false);
|
|
} catch (error) {
|
|
console.error("Fehler beim Laden der Sitzung:", error);
|
|
setSessionExpired(true);
|
|
}
|
|
};
|
|
|
|
if (typeof window !== "undefined") {
|
|
loadAndStoreVariables(); // Initiales Laden
|
|
|
|
// Intervall zum Aktualisieren des Redux-Stores alle 10 Sekunden
|
|
const intervalId = setInterval(loadAndStoreVariables, 10000);
|
|
|
|
// Bereinigen des Intervalls, wenn die Komponente unmountet wird
|
|
return () => clearInterval(intervalId);
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<Provider store={store}>
|
|
<WindowVariablesInitializer />
|
|
<div className="flex flex-col h-screen overflow-hidden">
|
|
<Header />
|
|
<div className="flex flex-grow w-full">
|
|
<Navigation className="w-1/5" />
|
|
<main className="w-full flex-grow">
|
|
{sessionExpired && (
|
|
<div className="bg-red-500 text-white p-4 text-center">
|
|
Ihre Sitzung ist abgelaufen oder die Verbindung ist
|
|
unterbrochen. Bitte laden Sie die Seite neu.
|
|
</div>
|
|
)}
|
|
<Component {...pageProps} />
|
|
</main>
|
|
</div>
|
|
<Footer />
|
|
</div>
|
|
</Provider>
|
|
);
|
|
}
|
|
|
|
export default MyApp;
|