From 6844c3cfab08f0986ef3c315b1d246444d32228a Mon Sep 17 00:00:00 2001 From: ISA Date: Mon, 23 Sep 2024 13:46:44 +0200 Subject: [PATCH] erste Test ohne Fehler --- app/access/page.jsx | 245 +++++++++++++++--------------- app/analogeEingaenge/page.jsx | 262 ++++++++++++++++----------------- app/dashboard/page.jsx | 21 ++- app/einausgaenge/page.jsx | 177 +++++++++++----------- app/kabelueberwachung/page.jsx | 141 +++++++++--------- app/layout.js | 18 ++- app/meldungen/page.jsx | 203 +++++++++++++------------ app/page.js | 17 ++- components/Footer.jsx | 2 +- components/Header.jsx | 2 +- 10 files changed, 538 insertions(+), 550 deletions(-) diff --git a/app/access/page.jsx b/app/access/page.jsx index d7c1b25..a619568 100644 --- a/app/access/page.jsx +++ b/app/access/page.jsx @@ -1,135 +1,132 @@ -// pages/Zutrittskontrolle.jsx +"use client"; import React from "react"; -import Layout from "../components/Layout"; function Access() { return ( - -
-
-

- Zutrittskontrolle 1 -

-
-
- - - - - - - - - - - - - - - - - - - - - - - -
- Betrieb - Status: ...
- Status - ...
Letzte Chip-ID...
Zeitstempel...
Access Typ...
-
-
- - - - - - - - - - - - - - - - - - - - -
EingangZustandBezeichnung
1......
2......
-
+
+
+

+ Zutrittskontrolle 1 +

+
+
+ + + + + + + + + + + + + + + + + + + + + + + +
+ Betrieb + Status: ...
+ Status + ...
Letzte Chip-ID...
Zeitstempel...
Access Typ...
-
- - {/* Zutrittskontrolle 2 */} -
-

- Zutrittskontrolle 2 -

-
-
- - - - - - - - - - - - - - - - - - - - - - - -
- Betrieb - Status: ...
- Status - ...
Letzte Chip-ID...
Zeitstempel...
Access Typ...
-
-
- - - - - - - - - - - - - - - - - - - - -
EingangZustandBezeichnung
1......
2......
-
+
+ + + + + + + + + + + + + + + + + + + + +
EingangZustandBezeichnung
1......
2......
- + + {/* Zutrittskontrolle 2 */} +
+

+ Zutrittskontrolle 2 +

+
+
+ + + + + + + + + + + + + + + + + + + + + + + +
+ Betrieb + Status: ...
+ Status + ...
Letzte Chip-ID...
Zeitstempel...
Access Typ...
+
+
+ + + + + + + + + + + + + + + + + + + + +
EingangZustandBezeichnung
1......
2......
+
+
+
+
); } diff --git a/app/analogeEingaenge/page.jsx b/app/analogeEingaenge/page.jsx index 2977ef9..176ae5c 100644 --- a/app/analogeEingaenge/page.jsx +++ b/app/analogeEingaenge/page.jsx @@ -1,5 +1,5 @@ +"use client"; import React, { useState } from "react"; -import Layout from "../components/Layout"; function AnalogeEingaenge() { const [activeConfig, setActiveConfig] = useState(null); @@ -81,143 +81,141 @@ function AnalogeEingaenge() { ]; return ( - -
-

Analoge Eingänge

-
- {inputs.map((input) => ( -
-
-

XIO-PM {input.id}

- -
-
- - - - - - - - - - - - - - - - - - - - - - - - - -
EingangWertBezeichnunguGuWoWoGKonfig
{input.id}{input.value}{input.name} - - - - - - - - - -
-
-
- ))} -
- - {/* Modal für Konfiguration */} - {activeConfig && ( -
-
-

- Konfiguration - XIO-PM {activeConfig} -

+
+

Analoge Eingänge

+
+ {inputs.map((input) => ( +
+
+

XIO-PM {input.id}

- {/* Konfigurationsformular hier einfügen */} -
-
- - -
-
- - -
- {/* Weitere Felder hier hinzufügen */} - -
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + +
EingangWertBezeichnunguGuWoWoGKonfig
{input.id}{input.value}{input.name} + + + + + + + + + +
- )} + ))}
- + + {/* Modal für Konfiguration */} + {activeConfig && ( +
+
+

+ Konfiguration - XIO-PM {activeConfig} +

+ + {/* Konfigurationsformular hier einfügen */} +
+
+ + +
+
+ + +
+ {/* Weitere Felder hier hinzufügen */} + +
+
+
+ )} +
); } diff --git a/app/dashboard/page.jsx b/app/dashboard/page.jsx index 8a5ac1c..6131b8f 100644 --- a/app/dashboard/page.jsx +++ b/app/dashboard/page.jsx @@ -1,5 +1,6 @@ +"use client"; import React, { useEffect } from "react"; -import Layout from "../components/Layout"; + import Image from "next/image"; import "tailwindcss/tailwind.css"; // Stelle sicher, dass Tailwind CSS korrekt importiert wird import "@fontsource/roboto"; // Standardimport für alle Schriftstärken @@ -7,17 +8,15 @@ import "bootstrap-icons/font/bootstrap-icons.css"; function Dashboard() { return ( - -
-
- {/* Main Section */} -
- {/* Hauptinhalt */} -

Dashboard Übersicht

-
-
+
+
+ {/* Main Section */} +
+ {/* Hauptinhalt */} +

Dashboard Übersicht

+
- +
); } diff --git a/app/einausgaenge/page.jsx b/app/einausgaenge/page.jsx index 8d1a72e..72caea2 100644 --- a/app/einausgaenge/page.jsx +++ b/app/einausgaenge/page.jsx @@ -1,6 +1,5 @@ -// pages/Einausgaenge.jsx +"use client"; import React, { useState } from "react"; -import Layout from "../components/Layout"; function Einausgaenge() { // Beispiel-Daten für Ein- und Ausgänge (kannst du durch deine Daten ersetzen) @@ -62,104 +61,100 @@ function Einausgaenge() { const [activeTab, setActiveTab] = useState("inputs"); return ( - -
- {/* Tabs für Ein- und Ausgänge */} -
    -
  • + {/* Tabs für Ein- und Ausgänge */} +
      +
    • + -
      • -
    • +
      • +
    • + -
      • -
    + Ausgänge + +
    • +
- {/* Inhalt für die aktiven Tabs */} -
- {activeTab === "inputs" && ( -
-

Eingänge

- - - - - - - + {/* Inhalt für die aktiven Tabs */} +
+ {activeTab === "inputs" && ( +
+

Eingänge

+
IDNameStatusBeschreibung
+ + + + + + + + + + {inputs.map((input) => ( + + + + + - - - {inputs.map((input) => ( - - - - - - - ))} - -
IDNameStatusBeschreibung
{input.id}{input.name}{input.status}{input.description}
{input.id}{input.name}{input.status} - {input.description} -
-
- )} + ))} + + +
+ )} - {activeTab === "outputs" && ( -
-

Ausgänge

- - - - - - - + {activeTab === "outputs" && ( +
+

Ausgänge

+
IDNameStatusBeschreibung
+ + + + + + + + + + {outputs.map((output) => ( + + + + + - - - {outputs.map((output) => ( - - - - - - - ))} - -
IDNameStatusBeschreibung
{output.id}{output.name}{output.status} + {output.description} +
{output.id}{output.name}{output.status} - {output.description} -
-
- )} -
+ ))} + + +
+ )}
- +
); } diff --git a/app/kabelueberwachung/page.jsx b/app/kabelueberwachung/page.jsx index 53a0144..1a98252 100644 --- a/app/kabelueberwachung/page.jsx +++ b/app/kabelueberwachung/page.jsx @@ -1,6 +1,5 @@ -"use client"; // Ganz oben hinzufügen +"use client"; import React, { useState } from "react"; -import Layout from "../layout"; // Korrigierter Pfad zu Layout function Kabelueberwachung() { const [activeTab, setActiveTab] = useState(1); @@ -13,81 +12,77 @@ function Kabelueberwachung() { ]; return ( - -
- {/* Tabs */} -
    - {racks.map((rack) => ( -
  • + {/* Tabs */} +
      + {racks.map((rack) => ( +
    • + -
      • - ))} -
    - {/* Rack-Inhalte */} -
    - {racks.map( - (rack) => - activeTab === rack.id && ( -
    -

    - {rack.name} Inhalte -

    - - - - - - - - - + {rack.name} + + + ))} + + {/* Rack-Inhalte */} +
    + {racks.map( + (rack) => + activeTab === rack.id && ( +
    +

    {rack.name} Inhalte

    +
    SlotBezeichnung - Isolationsgrenzwert - - Schleifengrenzwert - FilterzeitAktionen
    + + + + + + + + + + + + {Array.from({ length: 8 }, (_, index) => ( + + + + + + + - - - {Array.from({ length: 8 }, (_, index) => ( - - - - - - - - - ))} - -
    SlotBezeichnung + Isolationsgrenzwert + + Schleifengrenzwert + FilterzeitAktionen
    + Slot {index + 1} + + Beispielbezeichnung + 0.5 MOhm10 kOhm5 sek. + +
    - Slot {index + 1} - - Beispielbezeichnung - 0.5 MOhm10 kOhm5 sek. - -
    -
    - ) - )} -
    + ))} + + +
+ ) + )}
- +
); } diff --git a/app/layout.js b/app/layout.js index 4b2ad95..8341698 100644 --- a/app/layout.js +++ b/app/layout.js @@ -1,25 +1,27 @@ -"use client"; // Ganz oben hinzufügen +"use client"; // Nur in Client-Komponenten verwenden, nicht in Layout-Dateien import React from "react"; import Header from "../components/Header"; import Navigation from "../components/Navigation"; import Footer from "../components/Footer"; import "../app/globals.css"; -// Diese Datei befindet sich in /app/layout.jsx +// Diese Datei befindet sich in /app/layout.js export default function RootLayout({ children }) { return ( {/* Hier können Meta-Tags oder Links für CSS hinzugefügt werden */} - + {/* Hier das Layout mit Header, Navigation und Footer */} -
-
- -
{children}
+
+
+
+ +
{children}
+
+
-