189 lines
3.3 KiB
TypeScript
189 lines
3.3 KiB
TypeScript
"use client"; // pages/analogeEingaenge.js
|
|
import React, { useState } from "react";
|
|
import AnalogeEingaengeComponent from "../components/modules/AnalogeEingaengeComponent";
|
|
import XioPM from "../components/modules/XioPM";
|
|
|
|
function AnalogeEingaenge() {
|
|
const [activeConfig, setActiveConfig] = useState<number | null>(null);
|
|
|
|
// Mock-Daten für XIO-PM 1
|
|
const xioPm1Inputs = [
|
|
{
|
|
id: 1,
|
|
value: 1.34,
|
|
name: "Test1",
|
|
uW: true,
|
|
uG: true,
|
|
oW: false,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 2,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 3,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: false,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 4,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 5,
|
|
value: 6.13,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 6,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 7,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 8,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
];
|
|
|
|
// Mock-Daten für XIO-PM 2
|
|
const xioPm2Inputs = [
|
|
{
|
|
id: 1,
|
|
value: 2.78,
|
|
name: "Test2",
|
|
uW: true,
|
|
uG: false,
|
|
oW: true,
|
|
oG: false,
|
|
},
|
|
{
|
|
id: 2,
|
|
value: 4.33,
|
|
name: "----",
|
|
uW: false,
|
|
uG: true,
|
|
oW: false,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 3,
|
|
value: 8.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: false,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 4,
|
|
value: 9.44,
|
|
name: "----",
|
|
uW: true,
|
|
uG: false,
|
|
oW: true,
|
|
oG: false,
|
|
},
|
|
{
|
|
id: 5,
|
|
value: 6.13,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 6,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 7,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
{
|
|
id: 8,
|
|
value: 7.94,
|
|
name: "----",
|
|
uW: true,
|
|
uG: true,
|
|
oW: true,
|
|
oG: true,
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="flex flex-col h-[calc(100vh-13vh-8vh)] laptop:h-[calc(100vh-10vh-6vh)] xl:h-[calc(100vh-10vh-6vh)] bg-gray-100">
|
|
<div className="flex-grow grid grid-cols-2 gap-4 p-4">
|
|
<AnalogeEingaengeComponent />
|
|
|
|
{/* Zweite Box */}
|
|
<div className="border rounded-lg shadow-md p-2 bg-white">
|
|
<h3 className="text-sm font-semibold mb-1">Diagramm</h3>
|
|
<p>Diagramm wird hier eingefügt</p>
|
|
</div>
|
|
|
|
<XioPM
|
|
title="XIO-PM 1"
|
|
data={xioPm1Inputs}
|
|
onConfigClick={(id) => setActiveConfig(id)}
|
|
/>
|
|
|
|
<XioPM
|
|
title="XIO-PM 2"
|
|
data={xioPm2Inputs}
|
|
onConfigClick={(id) => setActiveConfig(id)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default AnalogeEingaenge;
|