75 lines
2.2 KiB
TypeScript
75 lines
2.2 KiB
TypeScript
"use client";
|
|
import React from "react";
|
|
import KabelModulStatus from "./modulesStatus/KabelModulStatus";
|
|
|
|
interface BaugruppentraegerProps {
|
|
kueOnline: number[];
|
|
kueVersion: (number | string)[];
|
|
kueCableBreak: number[];
|
|
kueAlarm1: number[];
|
|
kueAlarm2: number[];
|
|
kueGroundFault: number[];
|
|
handleModuleClick: (rackNumber: number) => void;
|
|
}
|
|
|
|
const Baugruppentraeger: React.FC<BaugruppentraegerProps> = ({
|
|
kueOnline,
|
|
kueVersion,
|
|
kueCableBreak,
|
|
kueAlarm1,
|
|
kueAlarm2,
|
|
kueGroundFault,
|
|
handleModuleClick,
|
|
}) => {
|
|
const baugruppen: JSX.Element[] = [];
|
|
const numBaugruppen = Math.ceil(kueOnline.length / 8);
|
|
|
|
for (let i = 0; i < numBaugruppen; i++) {
|
|
const slots = kueOnline.slice(i * 8, (i + 1) * 8);
|
|
|
|
baugruppen.push(
|
|
<div
|
|
key={i}
|
|
className="flex bg-white shadow-md rounded-lg mb-4 xl:mb-0 lg:mb-0 border border-gray-200 w-full laptop:scale-y-75 xl:scale-y-90"
|
|
>
|
|
<div className="flex gap-1">
|
|
{slots.map((version, index) => {
|
|
const slotNumber = i * 8 + index + 1;
|
|
const isSlotOnline = kueOnline[slotNumber - 1] === 1;
|
|
const rawModuleVersion = kueVersion[slotNumber - 1] || version;
|
|
|
|
// Sicherstellen, dass moduleVersion eine Zahl ist
|
|
const moduleVersion =
|
|
typeof rawModuleVersion === "number"
|
|
? rawModuleVersion
|
|
: parseFloat(rawModuleVersion) || 0;
|
|
|
|
const rackNumber = Math.ceil(slotNumber / 8);
|
|
|
|
return (
|
|
<div
|
|
key={slotNumber}
|
|
className="cursor-pointer"
|
|
onClick={() => handleModuleClick(rackNumber)}
|
|
>
|
|
<KabelModulStatus
|
|
slot={slotNumber}
|
|
isOnline={isSlotOnline}
|
|
moduleVersion={moduleVersion}
|
|
kueCableBreak={kueCableBreak}
|
|
kueAlarm1={kueAlarm1}
|
|
kueAlarm2={kueAlarm2}
|
|
kueGroundFault={kueGroundFault}
|
|
/>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
return <>{baugruppen}</>;
|
|
};
|
|
|
|
export default Baugruppentraeger;
|