Digitale Eingänge Einstellung-Modal in Arbeit

This commit is contained in:
Ismail Ali
2025-03-23 16:03:44 +01:00
parent 8e482813f8
commit e88233302b
3 changed files with 50 additions and 19 deletions

View File

@@ -6,20 +6,59 @@ export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
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/3">
<h2 className="text-lg font-bold mb-4">
<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">
Details für Eingang {selectedInput.id}
</h2>
<p>
<strong>Status:</strong>{" "}
{selectedInput.status === "active" ? "Aktiv" : "Inaktiv"}
</p>
<p>
<strong>Beschreibung:</strong> {selectedInput.description}
</p>
<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>Beschreibung:</strong>
</div>
<div>{selectedInput.description}</div>
<div>
<strong>Name:</strong>
</div>
<div>{selectedInput.name}</div>
<div>
<strong>Invertierung:</strong>
</div>
<div>{selectedInput.invertierung ? "Ein" : "Aus"}</div>
<div>
<strong>Filterzeit:</strong>
</div>
<div>{selectedInput.filterzeit} ms</div>
<div>
<strong>Gewichtung:</strong>
</div>
<div>{selectedInput.gewichtung}</div>
<div>
<strong>Zählerstand:</strong>
</div>
<div>{selectedInput.zaehlerstand}</div>
<div>
<strong>Zähler aktiv:</strong>
</div>
<div>{selectedInput.zaehlerAktiv ? "Ja" : "Nein"}</div>
<div>
<strong>Eingang offline:</strong>
</div>
<div>{selectedInput.eingangOffline ? "Offline" : "Online"}</div>
</div>
<button
onClick={closeInputModal}
className="mt-4 px-4 py-2 bg-blue-500 text-white rounded-lg"
className="mt-6 px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-lg transition"
>
Schließen
</button>