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

fix: Anzeige der analogen Eingänge auf 8 Einträge beschränkt und Chart korrigiert

Browse Source 
- Tabelle filtert nun korrekt auf echte analoge Eingänge (ID vorhanden)
- Diagramm zeigt nur echte analoge Eingänge (ID vorhanden)
- Leere oder ungültige Einträge werden nicht mehr angezeigt
- Konsistente Darstellung in Tabelle und Chart
This commit is contained in:
ISA
2025-04-28 11:39:53 +02:00
parent db3ccf06c8
commit 7fead4cc39
8 changed files with 106 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
apiMockData/SERVICE/analogeEingaengeMockData.js
View File

@@ -1,12 +1,23 @@
// /apiMockData/SERVICE/analogeEingaengeMockData.js
var win_analogeEingaenge1 = [1, 0, "Sensor2", 1, 1, 0, 1]; // Eingang 1
var win_analogeEingaenge2 = [2, 22.91, "Feuchtigkeit", 1, 1, 1, 0]; // Eingang 2
var win_analogeEingaenge3 = [3, 0, "Test", 1, 1, 0, 1]; // Eingang 3
var win_analogeEingaenge4 = [4, 0, "test2", 1, 1, 0, 1]; // Eingang 4
var win_analogeEingaenge5 = [5, 0, "----", 1, 1, 0, 1]; // Eingang 5
var win_analogeEingaenge6 = [6, 21, "Temperatur", 1, 1, 0, 1]; // Eingang 6
var win_analogeEingaenge7 = [7, 0, "----", 1, 1, 1, 0]; // Eingang 7
var win_analogeEingaenge8 = [8, 0, "Test", 1, 1, 0, 1]; // Eingang 8
var win_analogInputsValues = [
4.771072, 5.665244, 0.005467, -0.007468, 0.000002, 0.000001, 0.000001,
0.000007,
];
var win_analogInputsNames = [
"AE 1",
"AE 2",
"AE 3",
"AE 4",
"AE 5",
"AE 6",
"AE 7",
"AE 8",
];
var win_analogInputsUnits = ["V", "V", "V", "V", "mA", "mA", "mA", "mA"];
var win_analogInputsFactor = [1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0];
var win_analogInputsOffset = [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0];
var win_analogInputsWeighting = [0, 0, 0, 0, 0, 0, 0, 0];
var win_analogInputsloggerIntervall = [10, 10, 10, 10, 10, 10, 10, 10];
/*
ID (z. B. 1, 2, ... 8) → Identifikation des Eingangs

19
components/main/analogeEingaenge/AnalogInputsChart.tsx
View File

@@ -1,4 +1,5 @@
"use client"; // components/main/analogeEingaenge/AnalogInputsChart.tsx
"use client";
// components/main/analogeEingaenge/AnalogInputsChart.tsx
import React from "react";
import { useSelector } from "react-redux";
import { RootState } from "../../../redux/store";
@@ -17,17 +18,15 @@ export default function AnalogInputsChart() {
(state: RootState) => state.analogeEingaengeSlice
);
// Daten für das Diagramm vorbereiten
const chartData = Object.values(analogInputs).map((input) => ({
name: `Input ${input.id}`,
value: input.value ?? 0, // Falls kein Wert vorhanden ist, wird 0 gesetzt
}));
const chartData = Object.values(analogInputs)
.filter((input) => input?.id !== null && input?.id !== undefined)
.map((input) => ({
name: `Eingang ${input.id}`,
Wert: input.value ?? 0,
}));
return (
<div className="w-full h-[350px] bg-white shadow-md rounded-lg p-4 border border-gray-200">
<h3 className="text-sm font-semibold mb-2 text-gray-700">
Analog Inputs Chart
</h3>
<ResponsiveContainer width="100%" height="100%">
<LineChart
data={chartData}
@@ -39,7 +38,7 @@ export default function AnalogInputsChart() {
<Tooltip />
<Line
type="monotone"
dataKey="value"
dataKey="Wert"
stroke="#4A90E2"
strokeWidth={2}
/>

78
components/main/analogeEingaenge/AnalogeEingaengeTable.tsx
View File

@@ -1,4 +1,5 @@
"use client"; // components/main/analogeEingaenge/AnalogeEingaengeTable.tsx
"use client";
// components/main/analogeEingaenge/AnalogeEingaengeTable.tsx
import React, { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { RootState, AppDispatch } from "../../../redux/store";
@@ -8,14 +9,14 @@ export default function AnalogeEingaengeTable() {
const dispatch = useDispatch<AppDispatch>();
useEffect(() => {
dispatch(fetchAnalogeEingaengeThunk()); // ✅ Holt die API-Daten nur im Client
dispatch(fetchAnalogeEingaengeThunk());
}, [dispatch]);
const analogeEingaenge = useSelector(
(state: RootState) => state.analogeEingaengeSlice
);
const [selectedEingang, setSelectedEingang] = useState(null);
const [selectedEingang, setSelectedEingang] = useState<any>(null);
const openSettingsModal = (eingang: any) => {
setSelectedEingang(eingang);
@@ -35,49 +36,32 @@ export default function AnalogeEingaengeTable() {
<th className="border p-1 text-left">Eingang</th>
<th className="border p-3 text-left">Wert</th>
<th className="border p-3 text-left">Bezeichnung</th>
{/*
<th className="border p-3 text-center">uW</th>
<th className="border p-3 text-center">uG</th>
<th className="border p-3 text-center">oW</th>
<th className="border p-3 text-center">oG</th>
*/}
<th className="border p-3 text-center">Einstellung</th>
</tr>
</thead>
<tbody>
{Object.values(analogeEingaenge).map((eingang, index) => (
<tr
key={index}
className="text-gray-700 hover:bg-gray-50 transition"
>
<td className="border p-3">{eingang.id ?? "-"}</td>
<td className="border p-3">{eingang.value ?? "-"}</td>
<td className="border p-3">{eingang.name || "----"}</td>
{/*
<td className="border p-3 text-center">
{eingang.uW ? "🟢" : "⚪"}
</td>
<td className="border p-3 text-center">
{eingang.uG ? "🟢" : "⚪"}
</td>
<td className="border p-3 text-center">
{eingang.oW ? "🟠" : "⚪"}
</td>
<td className="border p-3 text-center">
{eingang.oG ? "🟢" : "⚪"}
</td>
*/}
<td className="border p-3 text-center">
<button
onClick={() => openSettingsModal(eingang)}
className=" text-white text-xs px-2 py-1 rounded hover:bg-blue-500 transition"
>
⚙️
</button>
</td>
</tr>
))}
{Object.values(analogeEingaenge)
.filter(
(eingang) => eingang?.id !== null && eingang?.id !== undefined
)
.map((eingang, index) => (
<tr
key={index}
className="text-gray-700 hover:bg-gray-50 transition"
>
<td className="border p-3">{eingang.id ?? "-"}</td>
<td className="border p-3">{eingang.value ?? "-"}</td>
<td className="border p-3">{eingang.name || "----"}</td>
<td className="border p-3 text-center">
<button
onClick={() => openSettingsModal(eingang)}
className="text-white bg-blue-500 hover:bg-blue-600 text-xs px-2 py-1 rounded transition"
>
⚙️
</button>
</td>
</tr>
))}
</tbody>
</table>
</div>
@@ -102,12 +86,12 @@ export default function AnalogeEingaengeTable() {
<div>
<strong>Einheit:</strong>
</div>
<div>{selectedEingang.einheit}</div>
<div>{selectedEingang.unit}</div>
<div>
<strong>Faktor:</strong>
</div>
<div>{selectedEingang.faktor}</div>
<div>{selectedEingang.factor}</div>
<div>
<strong>Offset:</strong>
@@ -117,12 +101,12 @@ export default function AnalogeEingaengeTable() {
<div>
<strong>Gewichtung:</strong>
</div>
<div>{selectedEingang.gewichtung}</div>
<div>{selectedEingang.weighting}</div>
<div>
<strong>Loggerinterval:</strong>
<strong>Logger-Intervall:</strong>
</div>
<div>{selectedEingang.loggerinterval} Minuten</div>
<div>{selectedEingang.loggerInterval} Minuten</div>
</div>
<div className="flex justify-end mt-6">

2
config/webVersion.ts
View File

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

2
pages/analogeEingaenge.tsx
View File

@@ -36,7 +36,7 @@ function AnalogeEingaenge() {
{/* Diagramm als Card */}
<div className="bg-white shadow-lg rounded-lg p-4 border border-gray-200">
<h2 className="text-xl font-semibold mb-4 text-gray-700">
Analog Inputs Chart
Analoge Eingäne Messkurve
</h2>
<AnalogInputsChart />
</div>

28
public/CPL/SERVICE/ae.js
View File

@@ -1,11 +1,22 @@
var win_analogeEingaenge1 = "<%AAV01%>";
var win_analogeEingaenge2 = "<%AAV02%>";
var win_analogeEingaenge3 = "<%AAV03%>";
var win_analogeEingaenge4 = "<%AAV04%>";
var win_analogeEingaenge5 = "<%AAV05%>";
var win_analogeEingaenge6 = "<%AAV06%>";
var win_analogeEingaenge7 = "<%AAV07%>";
var win_analogeEingaenge8 = "<%AAV08%>";
// /public/CPL/SERVICE/ae.js
//CGI-Variablen
var win_analogInputsValues = [<%=AAV01%>,<%=AAV02%>,<%=AAV03%>,<%=AAV04%>,<%=AAV05%>,<%=AAV06%>,<%=AAV07%>,<%=AAV08%>];
var win_analogInputsNames=[<%=ACN01%>,<%=ACN02%>,<%=ACN03%>,<%=ACN04%>,<%=ACN05%>,<%=ACN06%>,<%=ACN07%>,<%=ACN08%>];
var win_analogInputsUnits=[<%=ACU01%>,<%=ACU02%>,<%=ACU03%>,<%=ACU04%>,<%=ACU05%>,<%=ACU06%>,<%=ACU07%>,<%=ACU08%>];
var win_analogInputsFactor=[<%=ACF01%>,<%=ACF02%>,<%=ACF03%>,<%=ACF04%>,<%=ACF05%>,<%=ACF06%>,<%=ACF07%>,<%=ACF08%>];
var win_analogInputsOffset=[<%=ACO01%>,<%=ACO02%>,<%=ACO03%>,<%=ACO04%>,<%=ACO05%>,<%=ACO06%>,<%=ACO07%>,<%=ACO08%>];
var win_analogInputsWeighting=[<%=ACS01%>,<%=ACS02%>,<%=ACS03%>,<%=ACS04%>,<%=ACS05%>,<%=ACS06%>,<%=ACS07%>,<%=ACS08%>];
var win_analogInputsloggerIntervall =[<%=ACL01%>,<%=ACL02%>,<%=ACL03%>,<%=ACL04%>,<%=ACL05%>,<%=ACL06%>,<%=ACL07%>,<%=ACL08%>];
// CGI responsive Variablen
/*
var win_analogInputsValues = [4.771072,5.665244,0.005467,-0.007468,0.000002,0.000001,0.000001,0.000007];
var win_analogInputsNames=['AE 1','AE 2','AE 3','AE 4','AE 5','AE 6','AE 7','AE 8'];
var win_analogInputsUnits=['V','V','V','V','mA','mA','mA','mA'];
var win_analogInputsFactor=[1.000,1.000,1.000,1.000,1.000,1.000,1.000,1.000];
var win_analogInputsOffset=[0.000,0.000,0.000,0.000,0.000,0.000,0.000,0.000];
var win_analogInputsWeighting=[0,0,0,0,0,0,0,0];
var win_analogInputsloggerIntervall =[10,10,10,10,10,10,10,10];
/*
Kontext:
Messwert
@@ -22,3 +33,4 @@ Systemspannungen
Ausgabeformat:
%0.6f
*/
// var system=[<%=AAV09%>,<%=AAV11%>,<%=AAV15%>,<%=AAV16%>,<%=AAV17%>,<%=AAV18%>];

1
public/CPL/SERVICE/systemVoltTemp.js Normal file
View File

@@ -0,0 +1 @@
var win_systemVoltTemp=[<%=AAV09%>,<%=AAV11%>,<%=AAV15%>,<%=AAV16%>,<%=AAV17%>,<%=AAV18%>];

45
services/fetchAnalogeEingaengeService.ts
View File

@@ -7,46 +7,49 @@ export const fetchAnalogeEingaengeService = async (): Promise<Record<
try {
if (typeof window === "undefined") return null;
// Umgebungserkennung: localhost = Entwicklung, alles andere = Produktion
const isDevelopment = process.env.NEXT_PUBLIC_NODE_ENV === "development";
// Skriptpfad abhängig von der Umgebung
const scriptSrc = isDevelopment
? "/api/cpl/analogeEingaengeAPIHandler"
: "/CPL?/CPL/SERVICE/ae.js";
// Skript dynamisch laden
await new Promise<void>((resolve, reject) => {
const script = document.createElement("script");
script.src = scriptSrc;
script.async = true;
script.onload = () => resolve();
script.onerror = () => reject(`❌ Fehler beim Laden von ${scriptSrc}`);
script.onerror = () => reject(`❌ Error loading ${scriptSrc}`);
document.body.appendChild(script);
});
// Analoge Eingänge parsen (1 bis 8)
const result: Record<string, any> = {};
for (let i = 1; i <= 8; i++) {
const varName = `win_analogeEingaenge${i}`;
const data = (window as any)[varName];
// Now read the real variables
const values = (window as any).win_analogInputsValues || [];
const names = (window as any).win_analogInputsNames || [];
const units = (window as any).win_analogInputsUnits || [];
const factor = (window as any).win_analogInputsFactor || [];
const offset = (window as any).win_analogInputsOffset || [];
const weighting = (window as any).win_analogInputsWeighting || [];
const loggerInterval =
(window as any).win_analogInputsloggerIntervall || [];
if (Array.isArray(data)) {
result[varName] = {
id: data[0],
value: data[1],
name: data[2],
untererWarnwert: data[3] === 1,
untererGrenzwert: data[4] === 1,
obererWarnwert: data[5] === 1,
obererGrenzwert: data[6] === 1,
};
}
const result: Record<string, any> = {};
for (let i = 0; i < values.length; i++) {
result[`analogInput${i + 1}`] = {
id: i + 1,
value: values[i],
name: names[i],
unit: units[i],
factor: factor[i],
offset: offset[i],
weighting: weighting[i],
loggerInterval: loggerInterval[i],
};
}
return result;
} catch (error) {
console.error("❌ Fehler beim Laden der analogen Eingänge:", error);
console.error("❌ Error loading analog inputs:", error);
return null;
}
};