refactor(pages): *Page.tsx-Dateien zurück in Standardnamen (z. B. dashboard.tsx) umbenannt, da der Next.js Pages Router keine Route für umbenannte Dateinamen wie /dashboardPage auflöst
This commit is contained in:
85
pages/einstellungen.tsx
Normal file
85
pages/einstellungen.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
// /pages/einstellungen.tsx
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { useAppDispatch } from "../redux/store";
|
||||
import { fetchSystemSettingsThunk } from "../redux/thunks/fetchSystemSettingsThunk";
|
||||
import GeneralSettings from "../components/main/settingsPageComponents/GeneralSettings";
|
||||
import OPCUAInterfaceSettings from "../components/main/settingsPageComponents/OPCUAInterfaceSettings";
|
||||
import DatabaseSettings from "../components/main/settingsPageComponents/DatabaseSettings";
|
||||
import NTPSettings from "../components/main/settingsPageComponents/NTPSettings";
|
||||
import UserManagementSettings from "../components/main/settingsPageComponents/UserManagementSettings";
|
||||
|
||||
export default function Settings() {
|
||||
const [activeTab, setActiveTab] = useState("tab1");
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchSystemSettingsThunk());
|
||||
}, [dispatch]);
|
||||
|
||||
return (
|
||||
<div className="p-4">
|
||||
{/* Tab-Navigation */}
|
||||
<div className="flex border-b border-gray-200">
|
||||
<button
|
||||
className={`px-4 py-2 ${
|
||||
activeTab === "tab1"
|
||||
? "border-b-2 border-blue-500 text-blue-500"
|
||||
: ""
|
||||
}`}
|
||||
onClick={() => setActiveTab("tab1")}
|
||||
>
|
||||
Allgemeine Einstellungen
|
||||
</button>
|
||||
<button
|
||||
className={`px-4 py-2 ${
|
||||
activeTab === "tab2"
|
||||
? "border-b-2 border-blue-500 text-blue-500"
|
||||
: ""
|
||||
}`}
|
||||
onClick={() => setActiveTab("tab2")}
|
||||
>
|
||||
OPCUA
|
||||
</button>
|
||||
<button
|
||||
className={`px-4 py-2 ${
|
||||
activeTab === "tab3"
|
||||
? "border-b-2 border-blue-500 text-blue-500"
|
||||
: ""
|
||||
}`}
|
||||
onClick={() => setActiveTab("tab3")}
|
||||
>
|
||||
Datenbank
|
||||
</button>
|
||||
<button
|
||||
className={`px-4 py-2 ${
|
||||
activeTab === "tab4"
|
||||
? "border-b-2 border-blue-500 text-blue-500"
|
||||
: ""
|
||||
}`}
|
||||
onClick={() => setActiveTab("tab4")}
|
||||
>
|
||||
NTP
|
||||
</button>
|
||||
<button
|
||||
className={`px-4 py-2 ${
|
||||
activeTab === "tab5"
|
||||
? "border-b-2 border-blue-500 text-blue-500"
|
||||
: ""
|
||||
}`}
|
||||
onClick={() => setActiveTab("tab5")}
|
||||
>
|
||||
Benutzerverwaltung
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Tab-Inhalt */}
|
||||
<div className="mt-4">
|
||||
{activeTab === "tab1" && <GeneralSettings />}
|
||||
{activeTab === "tab2" && <OPCUAInterfaceSettings />}
|
||||
{activeTab === "tab3" && <DatabaseSettings />}
|
||||
{activeTab === "tab4" && <NTPSettings />}
|
||||
{activeTab === "tab5" && <UserManagementSettings />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user