refactor: LoopChartActionBar Dropdowns auf Listbox mit Littwin-Design umgestellt

- selectedMode (DIA0/DIA1/DIA2) ersetzt durch Headless UI Listbox
- selectedSlotType (Schleifen-/Isolationswiderstand) ebenfalls als Listbox
- Einheitliches Dropdown-Design mit MeldungenView und TDRChartActionBar
- Littwin-blue Stil für ausgewählte Optionen integriert
This commit is contained in:
ISA
2025-07-08 07:01:38 +02:00
parent 92eb28e495
commit 3d37388173
8 changed files with 42 additions and 18 deletions

View File

@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
NEXT_PUBLIC_EXPORT_STATIC=false
NEXT_PUBLIC_USE_CGI=false
# App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.551
NEXT_PUBLIC_APP_VERSION=1.6.554
NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

View File

@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
NEXT_PUBLIC_EXPORT_STATIC=true
NEXT_PUBLIC_USE_CGI=true
# App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.551
NEXT_PUBLIC_APP_VERSION=1.6.554
NEXT_PUBLIC_CPL_MODE=production

View File

@@ -1,3 +1,18 @@
## [1.6.554] 2025-07-08
- fix: TDR select List mouseover gray 200
---
## [1.6.553] 2025-07-08
- fix: TDR select List mouseover gray 200
---
## [1.6.552] 2025-07-07
- fix: TDR select List mouseover gray 200
---
## [1.6.551] 2025-07-07
- fix: TDR select List mouseover gray 200

View File

@@ -1,8 +1,8 @@
{
"win_da_state": [
1,
0,
0,
1,
1,
1
],
"win_da_bezeichnung": [

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{
"name": "cpl-v4",
"version": "1.6.551",
"version": "1.6.554",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "cpl-v4",
"version": "1.6.551",
"version": "1.6.554",
"dependencies": {
"@fontsource/roboto": "^5.1.0",
"@headlessui/react": "^2.2.4",

View File

@@ -1,6 +1,6 @@
{
"name": "cpl-v4",
"version": "1.6.551",
"version": "1.6.554",
"private": true,
"scripts": {
"dev": "next dev",

View File

@@ -14,7 +14,6 @@ import Footer from "@/components/footer/Footer";
// Thunks importieren
import { getKueDataThunk } from "@/redux/thunks/getKueDataThunk";
import { getDigitalOutputsThunk } from "@/redux/thunks/getDigitalOutputsThunk";
import { getAnalogInputsThunk } from "@/redux/thunks/getAnalogInputsThunk";
import { getAnalogInputsHistoryThunk } from "@/redux/thunks/getAnalogInputsHistoryThunk";
import { getLast20MessagesThunk } from "@/redux/thunks/getLast20MessagesThunk";
@@ -57,18 +56,31 @@ function AppContent({
const [sessionExpired] = useState(false);
const mode = "DIA0"; // oder aus Router oder Session
const type = 0; // Beispiel: 0 für "loop", 1 für "iso" (bitte ggf. anpassen)
const [pathname, setPathname] = useState(
typeof window !== "undefined" ? window.location.pathname : ""
);
useEffect(() => {
const handleRouteChange = () => {
setPathname(window.location.pathname);
};
window.addEventListener("popstate", handleRouteChange);
window.addEventListener("pushstate", handleRouteChange);
return () => {
window.removeEventListener("popstate", handleRouteChange);
window.removeEventListener("pushstate", handleRouteChange);
};
}, []);
useEffect(() => {
let intervalId: NodeJS.Timeout;
const pathname = window.location.pathname;
const loadAndDispatch = () => {
dispatch(getAuthThunks());
if (pathname.includes("kabelueberwachung")) {
dispatch(getKueDataThunk());
} else if (pathname.includes("digitalOutputs")) {
dispatch(getDigitalOutputsThunk());
} else if (pathname.includes("digitalInputs")) {
dispatch(getDigitalOutputsThunk()); // 🟠 evtl. anpassen
} else if (pathname.includes("analogInputs")) {
dispatch(getAnalogInputsThunk());
} else if (pathname.includes("analogHistory")) {
@@ -105,7 +117,7 @@ function AppContent({
intervalId = setInterval(loadAndDispatch, 10000);
return () => clearInterval(intervalId);
}
}, [dispatch]);
}, [pathname, dispatch]);
return (
<div className="flex flex-col h-screen overflow-hidden">

View File

@@ -20,12 +20,9 @@ const DigitalOutputs: React.FC = () => {
const [isOutputModalOpen, setIsOutputModalOpen] = useState(false);
useEffect(() => {
dispatch(getDigitalOutputsThunk());
const interval = setInterval(() => {
dispatch(getDigitalInputsThunk());
dispatch(getDigitalOutputsThunk());
}, 500);
}, 3000); // z.B. alle 3 Sekunden statt 0.5s
return () => clearInterval(interval);
}, [dispatch]);