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

feat Schleifeund TDR in sepaterate Bereiche in KÜ

Browse Source
This commit is contained in:
ISA
2025-07-24 09:32:56 +02:00
parent 357fb6c816
commit 9bd69f7a07
7 changed files with 49 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
components/main/kabelueberwachung/kue705FO/Kue705FO.tsx
View File

@@ -168,7 +168,7 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
return (
<div
className="relative bg-gray-300 w-[7.25rem] h-[24.375rem] border border-gray-400 transform laptop:-translate-y-12 2xl:-translate-y-0
className="relative bg-gray-300 w-[7.25rem] h-[30.375rem] border border-gray-400 transform laptop:-translate-y-12 2xl:-translate-y-0
scale-100 sm:scale-95 md:scale-100 lg:scale-105 xl:scale-90 2xl:scale-125 top-3 qhd:scale-150 qhd:-translate-y-0"
>
{kueOnline === 1 ? (
@@ -295,96 +295,60 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
{kueVersion}
</div>
</div>
<div className="flex mt-3 space-x-[0.063rem] ">
<button
onClick={() =>
handleButtonClick(
"Schleife",
setActiveButton,
setloopTitleText,
(value) =>
setLoopDisplayValue(
typeof value === "number" ? value : Number(value)
), // Hier sicherstellen, dass nur number übergeben wird
Number(schleifenwiderstand), // <- Stelle sicher, dass es eine Zahl ist
tdrLocation,
dispatch,
slotIndex
)
}
className={`w-[50%] h-[1.563rem] text-white text-[0.625rem] flex items-center justify-center ${
activeButton === "Schleife" ? "bg-littwin-blue" : "bg-gray-400"
}`}
>
Schleife
</button>
<button
onClick={() => {
setActiveButton("TDR");
setloopTitleText("Entfernung [km]");
const latestTdrDistanceMeters =
Array.isArray(tdmChartData?.[slotIndex]) &&
tdmChartData[slotIndex].length > 0 &&
typeof tdmChartData[slotIndex][0].d === "number"
? tdmChartData[slotIndex][0].d
: 0;
const latestTdrDistance = Number(
(latestTdrDistanceMeters / 1000).toFixed(3)
);
setLoopDisplayValue(latestTdrDistance);
}}
className={`w-[50%] h-[1.563rem] text-white text-[0.625rem] flex items-center justify-center ${
Array.isArray(tdrActive) && tdrActive[slotIndex] === 0
? "bg-gray-200 cursor-not-allowed" // Deaktiviert: Hellgrau
: activeButton === "TDR"
? "bg-littwin-blue" // Aktiviert: Littwin Blau
: "bg-gray-400" // Nicht geklickt: Dunkelgrau
}`}
disabled={Array.isArray(tdrActive) && tdrActive[slotIndex] === 0} // Button deaktiviert, wenn TDR für diesen Slot nicht aktiv ist
>
TDR
</button>
</div>
{/* loopDisplay: Zeigt Schleifenwiderstand oder TDR-Distanz an, je nach Modus */}
<div className="absolute bottom-[0.063rem] left-[0.068rem] w-[7.074rem] h-[4.1rem] bg-gray-300 border-[0.094rem] border-gray-400 p-[0.063rem]">
{/* Schleifenwiderstand Bereich */}
<div className="absolute bottom-[5.963rem] left-[0.068rem] w-[7.074rem] h-[4.1rem] bg-gray-300 border-[0.094rem] border-gray-400 p-[0.063rem]">
<span className="text-black text-[0.438rem] absolute top-[0.125rem] left-[0.063rem] mt-1">
{loopTitleText}
Schleifenwiderstand [kOhm]
</span>
<div className="relative w-full h-[2.813rem] bg-gray-100 border border-gray-400 flex items-center justify-center mt-4">
<div className="relative w-full h-[2.813rem] bg-gray-100 border border-gray-400 flex items-center justify-center mt-4">
<button
onClick={refreshClick} // Dynamische Funktion basierend auf aktivem Button
onClick={() =>
handleRefreshClick("Schleife", slotIndex, setLoading)
}
className="absolute -top-[0.063rem] -right-[0.063rem] w-[1.25rem] h-[1.25rem] bg-gray-400 flex items-center justify-center"
disabled={loading} // Disable button while loading
disabled={loading}
>
<span className="text-white text-[1.125rem]">⟳</span>
</button>
<div className="absolute bottom-[0.313rem] left-1/2 transform -translate-x-1/2 w-[6.25rem] flex justify-center items-center">
<div className="text-center text-black text-[0.625rem]">
<p>
{loopDisplayValue +
(activeButton === "Schleife" ? " kOhm" : " km")}
{typeof schleifenwiderstand === "number"
? schleifenwiderstand
: Number(schleifenwiderstand)}{" "}
kOhm
</p>
</div>
</div>
</div>
{/* Messkurven-Button moved below the module */}
{/* Sensoren anzeigen */}
{
/* if Kabelüberwachungsmodul online (kue_online ) */
kueOnline === 1 && win_fallSensorsActive === 1 && false && (
<div className="mt-4 w-full flex justify-center">
<FallSensors />
</div>
)
}
</div>
{/* TDR Bereich */}
{Array.isArray(tdrActive) && tdrActive[slotIndex] === 1 && (
<div className="absolute bottom-[0.063rem] left-[0.068rem] w-[7.074rem] h-[4.1rem] bg-gray-300 border-[0.094rem] border-gray-400 p-[0.063rem]">
<span className="text-black text-[0.438rem] absolute top-[0.125rem] left-[0.063rem] mt-1">
TDR Entfernung [km]
</span>
<div className="relative w-full h-[2.813rem] bg-gray-100 border border-gray-400 flex items-center justify-center mt-4">
<button
onClick={() =>
handleRefreshClick("TDR", slotIndex, setLoading)
}
className="absolute -top-[0.063rem] -right-[0.063rem] w-[1.25rem] h-[1.25rem] bg-gray-400 flex items-center justify-center"
disabled={loading}
>
<span className="text-white text-[1.125rem]">⟳</span>
</button>
<div className="absolute bottom-[0.313rem] left-1/2 transform -translate-x-1/2 w-[6.25rem] flex justify-center items-center">
<div className="text-center text-black text-[0.625rem]">
<p>{latestTdrDistance} km</p>
</div>
</div>
</div>
</div>
)}
{/* Modal für Einstellungen */}
</>
) : (