Ismail/CPLv4.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

✅ Logik für Farbe abhängig von Status + Invertierung:

Browse Source 
Anzeige ist rot wenn Status=1 ist. Die Farbe ist nicht abhängig von der Invertierung.
Status	Invertierung	Anzeige
1                1	            🔴 rot
1	             0	            🔴 rot
0	             1	           ✅ grün
0	             0             ✅ grün
This commit is contained in:
ISA
2025-04-03 11:04:49 +02:00
parent 2f631e80be
commit 75759791cd
7 changed files with 129 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/main/einausgaenge/DigitalInputs.tsx
View File

@@ -43,11 +43,12 @@ export default function DigitalInputs({ openInputModal, inputRange }: Props) {
</td>
<td className="px-1 py-1">
{input.status ? (
<span className="text-green-500 text-xs">●</span>
) : (
<span className="text-red-500 text-xs">✕</span>
) : (
<span className="text-green-500 text-xs">●</span>
)}
</td>
<td className="px-1 py-1">{input.label}</td>
<td className="px-1 py-1">
<Icon

97
components/main/einausgaenge/modals/InputModal.tsx
View File

@@ -1,20 +1,98 @@
"use client";
import React from "react";
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { RootState } from "../../../../redux/store";
import { useAppDispatch } from "../../../../redux/store";
import { updateInvertierung } from "../../../../redux/slices/digitalInputsSlice";
export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
const dispatch = useAppDispatch();
const reduxInput = useSelector((state: RootState) =>
state.digitalInputsSlice.inputs.find(
(input) => input.id === Number(selectedInput.id)
)
);
const [invertiert, setInvertiert] = useState<boolean>(false);
const isDev = process.env.NODE_ENV === "development";
useEffect(() => {
if (selectedInput) {
if (isDev) {
const saved = localStorage.getItem(`invertierung_${selectedInput.id}`);
if (saved !== null) {
setInvertiert(parseInt(saved) === 1);
} else {
setInvertiert(selectedInput.invertierung);
}
} else {
setInvertiert(selectedInput.invertierung);
}
}
}, [selectedInput, isDev]);
if (!isOpen || !selectedInput) return null;
const handleInvertierungToggle = async () => {
const neueInvertierung = !invertiert;
if (process.env.NODE_ENV === "development") {
dispatch(
updateInvertierung({
id: Number(selectedInput.id),
invertierung: neueInvertierung,
})
);
setInvertiert(neueInvertierung);
} else {
const url = `/CPL?/CPL/SERVICE/empty.acp&DEI${selectedInput.id}=${
neueInvertierung ? 1 : 0
}`;
try {
const response = await fetch(url);
if (!response.ok) throw new Error("Fehler beim Senden der Anfrage");
dispatch(
updateInvertierung({
id: Number(selectedInput.id),
invertierung: neueInvertierung,
})
);
setInvertiert(neueInvertierung);
} catch (error) {
console.error("Invertierung fehlgeschlagen:", error);
alert("Invertierung konnte nicht geändert werden.");
}
}
};
//---------------------------------
useEffect(() => {
if (reduxInput) {
setInvertiert(reduxInput.invertierung);
}
}, [reduxInput]);
//---------------------------------
return (
<div className="fixed top-0 left-0 w-full h-full bg-black bg-opacity-50 flex justify-center items-center z-50">
<div className="bg-white rounded-lg shadow-lg p-6 w-1/2 max-w-lg">
<h2 className="text-xl font-semibold text-blue-500 mb-4 border-b pb-2">
<h2 className="text-xl font-semibold text-littwin-blue mb-4 border-b pb-2">
Details für Eingang {selectedInput.id}
</h2>
<div className="grid grid-cols-2 gap-x-4 gap-y-2">
<div>
<strong>Status:</strong>
</div>
<div>{selectedInput.status === "active" ? "Aktiv" : "Inaktiv"}</div>
<div>
<strong>Status:</strong>
</div>
<div
className={reduxInput?.status ? "text-red-600" : "text-green-600"}
>
{reduxInput?.status ? "Inaktiv" : "Aktiv"}
</div>
<div>
<strong>Beschreibung:</strong>
@@ -26,10 +104,16 @@ export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
</div>
<div>{selectedInput.name}</div>
<div>
<div className="flex items-center gap-2 col-span-2">
<strong>Invertierung:</strong>
<span>{invertiert ? "Ein" : "Aus"}</span>
<button
onClick={handleInvertierungToggle}
className="ml-auto px-3 py-1 text-sm bg-gray-200 hover:bg-gray-300 rounded"
>
Umschalten
</button>
</div>
<div>{selectedInput.invertierung ? "Ein" : "Aus"}</div>
<div>
<strong>Filterzeit:</strong>
@@ -56,9 +140,10 @@ export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
</div>
<div>{selectedInput.eingangOffline ? "Offline" : "Online"}</div>
</div>
<button
onClick={closeInputModal}
className="mt-6 px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-lg transition"
className="mt-6 px-4 py-2 bg-littwin-blue hover:bg-blue-600 text-white rounded-lg transition"
>
Schließen
</button>

2
config/webVersion.ts
View File

@@ -6,5 +6,5 @@
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
*/
const webVersion = "1.6.208";
const webVersion = "1.6.209";
export default webVersion;

5
public/CPL/SERVICE/de.js
View File

@@ -32,4 +32,9 @@ var de=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
var counter=[0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000];
var flutter=[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
var de=[1,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0];
var counter=[0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000];
var flutter=[0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000,0.000000];
*/

15
public/CPLmockData/SERVICE/de.js
View File

@@ -1,8 +1,23 @@
// public/CPLmockData/SERVICE/de.js
var win_de_state = [
1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0,
];
// Invertierung -> DEIxx xx = Nr Eingang 1-32
var win_de_invert = [
1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0,
];
/*
✅ Logik für Farbe abhängig von Status + Invertierung:
Anzeige ist rot wenn Status=1 ist. Die Farbe ist nicht abhängig von der Invertierung.
Status Invertierung Anzeige
1 1 🔴 rot
1 0 🔴 rot
0 1 ✅ grün
0 0 ✅ grün
*/
var win_de_label = [
"DE1",
"DE2",

14
redux/slices/digitalInputsSlice.ts
View File

@@ -7,6 +7,7 @@ interface DigitalInput {
status: boolean;
counter: number;
flutter: number;
invertierung: boolean;
}
interface DigitalInputsState {
@@ -34,8 +35,19 @@ const digitalInputsSlice = createSlice({
input.status = status;
}
},
updateInvertierung: (
state,
action: PayloadAction<{ id: number; invertierung: boolean }>
) => {
const { id, invertierung } = action.payload;
const input = state.inputs.find((input) => input.id === id);
if (input) {
input.invertierung = invertierung;
}
},
},
});
export const { setInputs, updateInputStatus } = digitalInputsSlice.actions;
export const { setInputs, updateInputStatus, updateInvertierung } =
digitalInputsSlice.actions;
export default digitalInputsSlice.reducer;

1
services/fetchDigitaleEingaenge.ts
View File

@@ -33,6 +33,7 @@ export const fetchDigitaleEingaenge = async () => {
status: status === 1,
counter: win.win_counter?.[index] || 0,
flutter: win.win_flutter?.[index] || 0,
invertierung: win.win_de_invert?.[index] === 1,
})
);