From 23953facc8744759dc8a81b323d983a6e823ecd0 Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 25 Apr 2025 10:09:04 +0200 Subject: [PATCH] NTP Reiter/Tab erstellt --- .../GeneralSettings.tsx | 79 ++---------- .../settingsPageComponents/NTPSettings.tsx | 112 ++++++++++++++++++ .../handlers/handleGeneralSubmit.ts | 67 +++++++++++ .../handlers/handleNtpSubmit.ts | 59 +++++++++ config/webVersion.ts | 2 +- pages/einstellungen.tsx | 12 ++ 6 files changed, 259 insertions(+), 72 deletions(-) create mode 100644 components/main/settingsPageComponents/NTPSettings.tsx create mode 100644 components/main/settingsPageComponents/handlers/handleGeneralSubmit.ts create mode 100644 components/main/settingsPageComponents/handlers/handleNtpSubmit.ts diff --git a/components/main/settingsPageComponents/GeneralSettings.tsx b/components/main/settingsPageComponents/GeneralSettings.tsx index 0bc35fe..881f959 100644 --- a/components/main/settingsPageComponents/GeneralSettings.tsx +++ b/components/main/settingsPageComponents/GeneralSettings.tsx @@ -5,12 +5,12 @@ import { useSelector } from "react-redux"; import handleClearDatabase from "./handlers/dbHandlers/handleClearDatabase"; import handleReboot from "./handlers/handleReboot"; import handleSetDateTime from "./handlers/handleSetDateTime"; -import handleSubmit from "./handlers/handleSubmit"; import { useAdminAuth } from "./hooks/useAdminAuth"; import handleAdminLogin from "./handlers/handleAdminLogin"; import { useDispatch } from "react-redux"; import { AppDispatch } from "../../../redux/store"; import { fetchSystemSettingsThunk } from "../../../redux/thunks/fetchSystemSettingsThunk"; +import handleGeneralSubmit from "./handlers/handleGeneralSubmit"; const GeneralSettings: React.FC = () => { const dispatch = useDispatch(); @@ -33,13 +33,6 @@ const GeneralSettings: React.FC = () => { const [systemUhr, setSystemUhr] = useState( systemSettings.cplInternalTimestamp || "" ); - const [ntp1, setNtp1] = useState(systemSettings.ntp1 || ""); - const [ntp2, setNtp2] = useState(systemSettings.ntp2 || ""); - const [ntp3, setNtp3] = useState(systemSettings.ntp3 || ""); - const [ntpTimezone, setNtpTimezone] = useState( - systemSettings.ntpTimezone || "" - ); - const [active, setActive] = useState(systemSettings.ntpActive || false); const handleLogin = async () => { handleAdminLogin( @@ -148,62 +141,6 @@ const GeneralSettings: React.FC = () => { /> - {/* NTP */} -
-
- - setNtp1(e.target.value)} - /> -
-
- - setNtp2(e.target.value)} - /> -
-
- - setNtp3(e.target.value)} - /> -
-
- - setNtpTimezone(e.target.value)} - /> -
-
-
- - setActive(e.target.checked)} - /> -
- {/* Admin Login */}
{isAdminLoggedIn ? ( @@ -263,19 +200,19 @@ const GeneralSettings: React.FC = () => { type="button" className="bg-littwin-blue text-white px-2 py-1 rounded text-xs w-full md:w-auto" onClick={() => - handleSubmit( + handleGeneralSubmit( { name, ip, subnet, gateway, - ntp1, - ntp2, - ntp3, - ntpTimezone, - active, }, - systemSettings + { + name: systemSettings.deviceName ?? "", + ip: systemSettings.ip ?? "", + subnet: systemSettings.subnet ?? "", + gateway: systemSettings.gateway ?? "", + } ) } > diff --git a/components/main/settingsPageComponents/NTPSettings.tsx b/components/main/settingsPageComponents/NTPSettings.tsx new file mode 100644 index 0000000..6c4b3ac --- /dev/null +++ b/components/main/settingsPageComponents/NTPSettings.tsx @@ -0,0 +1,112 @@ +"use client"; +import React from "react"; +import { useSelector, useDispatch } from "react-redux"; +import { RootState } from "../../../redux/store"; + +import handleNtpSubmit from "./handlers/handleNtpSubmit"; + +const NTPSettings: React.FC = () => { + const dispatch = useDispatch(); + const systemSettings = useSelector( + (state: RootState) => state.systemSettingsSlice + ); + + // Wenn Daten noch nicht geladen sind, Ladeanzeige anzeigen + if (!systemSettings || systemSettings.ntp1 === undefined) { + return

Lade NTP-Daten...

; + } + + // Lokale States mit Fallback-Werten absichern + const [ntp1, setNtp1] = React.useState(systemSettings.ntp1 ?? ""); + const [ntp2, setNtp2] = React.useState(systemSettings.ntp2 ?? ""); + const [ntp3, setNtp3] = React.useState(systemSettings.ntp3 ?? ""); + const [ntpTimezone, setNtpTimezone] = React.useState( + systemSettings.ntpTimezone ?? "" + ); + const [active, setActive] = React.useState(systemSettings.ntpActive ?? false); + + return ( +
+

NTP Einstellungen

+ +
+
+ + setNtp1(e.target.value)} + /> +
+ +
+ + setNtp2(e.target.value)} + /> +
+ +
+ + setNtp3(e.target.value)} + /> +
+ +
+ + setNtpTimezone(e.target.value)} + /> +
+ +
+ + setActive(e.target.checked)} + /> +
+ +
+ +
+
+
+ ); +}; + +export default NTPSettings; diff --git a/components/main/settingsPageComponents/handlers/handleGeneralSubmit.ts b/components/main/settingsPageComponents/handlers/handleGeneralSubmit.ts new file mode 100644 index 0000000..607e9b9 --- /dev/null +++ b/components/main/settingsPageComponents/handlers/handleGeneralSubmit.ts @@ -0,0 +1,67 @@ +// /components/main/settingsPageComponents/handlers/handleGeneralSubmit.ts + +const handleGeneralSubmit = ( + original: { + name: string; + ip: string; + subnet: string; + gateway: string; + }, + current: { + name: string; + ip: string; + subnet: string; + gateway: string; + } +) => { + const changes: { [key: string]: string } = {}; + let networkChanges = false; + let newIp: string | null = null; + + if (current.name !== original.name) { + changes.SNNA = current.name; + networkChanges = true; + } + if (current.ip !== original.ip) { + changes.SEI01 = current.ip; + newIp = current.ip; + networkChanges = true; + } + if (current.subnet !== original.subnet) { + changes.SEI02 = current.subnet; + networkChanges = true; + } + if (current.gateway !== original.gateway) { + changes.SEI03 = current.gateway; + networkChanges = true; + } + + if (Object.keys(changes).length === 0) { + alert("Keine Änderungen vorgenommen."); + return; + } + + let url = `${window.location.origin}/CPL?${window.location.pathname}`; + Object.entries(changes).forEach(([key, value]) => { + url += `&${key}=${encodeURIComponent(value)}`; + }); + + console.log(url); + + fetch(url, { method: "GET" }) + .then(() => { + alert("Netzwerkdaten erfolgreich gesendet!"); + if (networkChanges) { + alert( + "Ein Neustart ist erforderlich, um die Netzwerkeinstellungen zu übernehmen." + ); + // Optional: handleReboot(newIp); + } + }) + .catch((err) => { + console.error("Fehler:", err); + alert("Fehler beim Senden der Netzwerkdaten."); + }); +}; + +export default handleGeneralSubmit; diff --git a/components/main/settingsPageComponents/handlers/handleNtpSubmit.ts b/components/main/settingsPageComponents/handlers/handleNtpSubmit.ts new file mode 100644 index 0000000..b970afa --- /dev/null +++ b/components/main/settingsPageComponents/handlers/handleNtpSubmit.ts @@ -0,0 +1,59 @@ +// /components/main/settingsPageComponents/handlers/handleNtpSubmit.ts + +const handleNtpSubmit = ( + original: { + ntp1: string; + ntp2: string; + ntp3: string; + ntpTimezone: string; + active: boolean; + }, + current: { + ntp1: string; + ntp2: string; + ntp3: string; + ntpTimezone: string; + active: boolean; + } +) => { + const changes: { [key: string]: string | boolean } = {}; + + if (current.ntp1 !== original.ntp1) { + changes.SNIP1 = current.ntp1; + } + if (current.ntp2 !== original.ntp2) { + changes.SNIP2 = current.ntp2; + } + if (current.ntp3 !== original.ntp3) { + changes.SNIP3 = current.ntp3; + } + if (current.ntpTimezone !== original.ntpTimezone) { + changes.SNTZ = current.ntpTimezone; + } + if (current.active !== original.active) { + changes.SNAC = current.active ? "1" : "0"; + } + + if (Object.keys(changes).length === 0) { + alert("Keine Änderungen vorgenommen."); + return; + } + + let url = `${window.location.origin}/CPL?${window.location.pathname}`; + Object.entries(changes).forEach(([key, value]) => { + url += `&${key}=${encodeURIComponent(value)}`; + }); + + console.log(url); + + fetch(url, { method: "GET" }) + .then(() => { + alert("NTP-Daten erfolgreich gesendet!"); + }) + .catch((err) => { + console.error("Fehler:", err); + alert("Fehler beim Senden der NTP-Daten."); + }); +}; + +export default handleNtpSubmit; diff --git a/config/webVersion.ts b/config/webVersion.ts index e7b9b18..56c0564 100644 --- a/config/webVersion.ts +++ b/config/webVersion.ts @@ -6,5 +6,5 @@ 2: Patch oder Hotfix (Bugfixes oder kleine Änderungen). */ -const webVersion = "1.6.276"; +const webVersion = "1.6.277"; export default webVersion; diff --git a/pages/einstellungen.tsx b/pages/einstellungen.tsx index 7405750..2d67fc2 100644 --- a/pages/einstellungen.tsx +++ b/pages/einstellungen.tsx @@ -5,6 +5,7 @@ import { fetchSystemSettingsThunk } from "../redux/thunks/fetchSystemSettingsThu import GeneralSettings from "../components/main/settingsPageComponents/GeneralSettings"; import OPCUAInterfaceSettings from "../components/main/settingsPageComponents/OPCUAInterfaceSettings"; import DatabaseSettings from "../components/main/settingsPageComponents/DatabaseSettings"; +import NTPSettings from "../components/main/settingsPageComponents/NTPSettings"; export default function Settings() { const [activeTab, setActiveTab] = useState("tab1"); @@ -48,6 +49,16 @@ export default function Settings() { > Datenbank +
{/* Tab-Inhalt */} @@ -55,6 +66,7 @@ export default function Settings() { {activeTab === "tab1" && } {activeTab === "tab2" && } {activeTab === "tab3" && } + {activeTab === "tab4" && } );