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

erste Test ohne Fehler

Browse Source
This commit is contained in:
ISA
2024-09-23 13:46:44 +02:00
parent 067d2e0200
commit 6844c3cfab
10 changed files with 538 additions and 550 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/access/page.jsx
View File

@@ -1,10 +1,8 @@
// pages/Zutrittskontrolle.jsx "use client";
import React from "react"; import React from "react";
import Layout from "../components/Layout";
function Access() { function Access() {
return ( return (
<Layout>
<div className="bg-gray-100 min-h-screen p-8"> <div className="bg-gray-100 min-h-screen p-8">
<div className="bg-white rounded-lg shadow p-6 mb-8"> <div className="bg-white rounded-lg shadow p-6 mb-8">
<h2 className="text-xl font-bold text-blue-500 mb-4"> <h2 className="text-xl font-bold text-blue-500 mb-4">
@@ -129,7 +127,6 @@ function Access() {
</div> </div>
</div> </div>
</div> </div>
</Layout>
); );
} }

4
app/analogeEingaenge/page.jsx
View File

@@ -1,5 +1,5 @@
"use client";
import React, { useState } from "react"; import React, { useState } from "react";
import Layout from "../components/Layout";
function AnalogeEingaenge() { function AnalogeEingaenge() {
const [activeConfig, setActiveConfig] = useState(null); const [activeConfig, setActiveConfig] = useState(null);
@@ -81,7 +81,6 @@ function AnalogeEingaenge() {
]; ];
return ( return (
<Layout>
<div className="bg-gray-100 min-h-screen p-8"> <div className="bg-gray-100 min-h-screen p-8">
<h1 className="text-2xl font-bold mb-4">Analoge Eingänge</h1> <h1 className="text-2xl font-bold mb-4">Analoge Eingänge</h1>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
@@ -217,7 +216,6 @@ function AnalogeEingaenge() {
</div> </div>
)} )}
</div> </div>
</Layout>
); );
} }

5
app/dashboard/page.jsx
View File

@@ -1,5 +1,6 @@
"use client";
import React, { useEffect } from "react"; import React, { useEffect } from "react";
import Layout from "../components/Layout";
import Image from "next/image"; import Image from "next/image";
import "tailwindcss/tailwind.css"; // Stelle sicher, dass Tailwind CSS korrekt importiert wird import "tailwindcss/tailwind.css"; // Stelle sicher, dass Tailwind CSS korrekt importiert wird
import "@fontsource/roboto"; // Standardimport für alle Schriftstärken import "@fontsource/roboto"; // Standardimport für alle Schriftstärken
@@ -7,7 +8,6 @@ import "bootstrap-icons/font/bootstrap-icons.css";
function Dashboard() { function Dashboard() {
return ( return (
<Layout>
<div className="bg-gray-100 flex flex-col min-h-screen"> <div className="bg-gray-100 flex flex-col min-h-screen">
<div className="flex flex-grow w-full"> <div className="flex flex-grow w-full">
{/* Main Section */} {/* Main Section */}
@@ -17,7 +17,6 @@ function Dashboard() {
</main> </main>
</div> </div>
</div> </div>
</Layout>
); );
} }

9
app/einausgaenge/page.jsx
View File

@@ -1,6 +1,5 @@
// pages/Einausgaenge.jsx "use client";
import React, { useState } from "react"; import React, { useState } from "react";
import Layout from "../components/Layout";
function Einausgaenge() { function Einausgaenge() {
// Beispiel-Daten für Ein- und Ausgänge (kannst du durch deine Daten ersetzen) // Beispiel-Daten für Ein- und Ausgänge (kannst du durch deine Daten ersetzen)
@@ -62,7 +61,6 @@ function Einausgaenge() {
const [activeTab, setActiveTab] = useState("inputs"); const [activeTab, setActiveTab] = useState("inputs");
return ( return (
<Layout>
<div className="bg-gray-100 min-h-screen p-8"> <div className="bg-gray-100 min-h-screen p-8">
{/* Tabs für Ein- und Ausgänge */} {/* Tabs für Ein- und Ausgänge */}
<ul className="flex border-b border-gray-200"> <ul className="flex border-b border-gray-200">
@@ -120,9 +118,7 @@ function Einausgaenge() {
<td className="py-3 px-4 text-left">{input.id}</td> <td className="py-3 px-4 text-left">{input.id}</td>
<td className="py-3 px-4 text-left">{input.name}</td> <td className="py-3 px-4 text-left">{input.name}</td>
<td className="py-3 px-4 text-left">{input.status}</td> <td className="py-3 px-4 text-left">{input.status}</td>
<td className="py-3 px-4 text-left"> <td className="py-3 px-4 text-left">{input.description}</td>
{input.description}
</td>
</tr> </tr>
))} ))}
</tbody> </tbody>
@@ -159,7 +155,6 @@ function Einausgaenge() {
)} )}
</div> </div>
</div> </div>
</Layout>
); );
} }

9
app/kabelueberwachung/page.jsx
View File

@@ -1,6 +1,5 @@
"use client"; // Ganz oben hinzufügen "use client";
import React, { useState } from "react"; import React, { useState } from "react";
import Layout from "../layout"; // Korrigierter Pfad zu Layout
function Kabelueberwachung() { function Kabelueberwachung() {
const [activeTab, setActiveTab] = useState(1); const [activeTab, setActiveTab] = useState(1);
@@ -13,7 +12,6 @@ function Kabelueberwachung() {
]; ];
return ( return (
<Layout>
<div className="bg-gray-100 flex-1 p-4 overflow-hidden"> <div className="bg-gray-100 flex-1 p-4 overflow-hidden">
{/* Tabs */} {/* Tabs */}
<ul className="flex border-b border-gray-200"> <ul className="flex border-b border-gray-200">
@@ -43,9 +41,7 @@ function Kabelueberwachung() {
(rack) => (rack) =>
activeTab === rack.id && ( activeTab === rack.id && (
<div key={rack.id}> <div key={rack.id}>
<h2 className="text-lg font-bold mb-4"> <h2 className="text-lg font-bold mb-4">{rack.name} Inhalte</h2>
{rack.name} Inhalte
</h2>
<table className="min-w-full bg-white border border-gray-300"> <table className="min-w-full bg-white border border-gray-300">
<thead> <thead>
<tr className="w-full bg-gray-200 text-gray-600 uppercase text-sm leading-normal"> <tr className="w-full bg-gray-200 text-gray-600 uppercase text-sm leading-normal">
@@ -87,7 +83,6 @@ function Kabelueberwachung() {
)} )}
</div> </div>
</div> </div>
</Layout>
); );
} }

8
app/layout.js
View File

@@ -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 React from "react";
import Header from "../components/Header"; import Header from "../components/Header";
import Navigation from "../components/Navigation"; import Navigation from "../components/Navigation";
import Footer from "../components/Footer"; import Footer from "../components/Footer";
import "../app/globals.css"; 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 }) { export default function RootLayout({ children }) {
return ( return (
<html lang="de"> <html lang="de">
<head> <head>
{/* Hier können Meta-Tags oder Links für CSS hinzugefügt werden */} {/* Hier können Meta-Tags oder Links für CSS hinzugefügt werden */}
</head> </head>
<body className="bg-gray-100 flex flex-col min-h-screen"> <body>
{/* Hier das Layout mit Header, Navigation und Footer */} {/* Hier das Layout mit Header, Navigation und Footer */}
<div className="bg-gray-100 flex flex-col min-h-screen">
<Header className="bg-gray-300 p-4 flex-shrink-0" /> <Header className="bg-gray-300 p-4 flex-shrink-0" />
<div className="flex flex-grow w-full"> <div className="flex flex-grow w-full">
<Navigation /> <Navigation />
<main className="flex-1 p-8">{children}</main> <main className="flex-1 p-8">{children}</main>
</div> </div>
<Footer className="bg-gray-300 p-4 flex-shrink-0" /> <Footer className="bg-gray-300 p-4 flex-shrink-0" />
</div>
</body> </body>
</html> </html>
); );

5
app/meldungen/page.jsx
View File

@@ -1,6 +1,5 @@
// pages/Meldungen.jsx "use client";
import React, { useState } from "react"; import React, { useState } from "react";
import Layout from "../components/Layout";
function Meldungen() { function Meldungen() {
const [rowsPerPage, setRowsPerPage] = useState(25); const [rowsPerPage, setRowsPerPage] = useState(25);
@@ -28,7 +27,6 @@ function Meldungen() {
}); });
return ( return (
<Layout>
<div className="flex flex-col h-full"> <div className="flex flex-col h-full">
{/* Filterleiste */} {/* Filterleiste */}
<div className="flex justify-between items-center bg-blue-500 p-4 text-white rounded-t"> <div className="flex justify-between items-center bg-blue-500 p-4 text-white rounded-t">
@@ -131,7 +129,6 @@ function Meldungen() {
</ul> </ul>
</div> </div>
</div> </div>
</Layout>
); );
} }

17
app/page.js
View File

@@ -1,9 +1,14 @@
import Image from "next/image"; "use client";
import { useEffect } from "react";
import { useRouter } from "next/navigation"; // App-Router Hook für Navigation
export default function Home() { export default function Home() {
return ( const router = useRouter();
<div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
<h1>Next.js startseite</h1> useEffect(() => {
</div> // Umleitung zur Dashboard-Seite bei der Initialisierung
); router.push("/dashboard");
}, [router]);
return <div>Wird geladen...</div>; // Temporärer Ladezustand
} }

2
components/Footer.jsx
View File

@@ -1,4 +1,4 @@
// components/Footer.jsx "use client";
import React from "react"; import React from "react";
function Footer() { function Footer() {

2
components/Header.jsx
View File

@@ -1,4 +1,4 @@
// components/Header.jsx "use client";
import React from "react"; import React from "react";
import Image from "next/image"; import Image from "next/image";
import "bootstrap-icons/font/bootstrap-icons.css"; import "bootstrap-icons/font/bootstrap-icons.css";