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

NetworkInfo Kompoente von dashboard.tsx incomponents ausgelagert

Browse Source
This commit is contained in:
Ismail Ali
2025-02-13 20:31:56 +01:00
parent 58791271e7
commit dc589c35df
4 changed files with 77 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
components/main/uebersicht/last20MessagesTable/Last20MessagesTable.tsx → components/main/uebersicht/Last20MessagesTable.tsx
View File

73
components/main/uebersicht/NetworkInfo.tsx Normal file
View File

@@ -0,0 +1,73 @@
"use client";
import React from "react";
import { useSelector } from "react-redux";
import { RootState } from "../../../redux/store";
const NetworkInfo: React.FC = () => {
// Werte direkt aus Redux holen
const ip =
useSelector((state: RootState) => state.variables.ip) || "Unbekannt";
const subnet =
useSelector((state: RootState) => state.variables.subnet) || "Unbekannt";
const gateway =
useSelector((state: RootState) => state.variables.gateway) || "Unbekannt";
const opcUaZustand =
useSelector((state: RootState) => state.variables.opcUaZustand) ||
"Unbekannt";
const opcUaNodesetName =
useSelector((state: RootState) => state.variables.opcUaNodesetName) ||
"Unbekannt";
return (
<div className="flex items-center space-x-4">
<div className="flex-shrink-0 flex justify-between items-center mt-1 bg-white p-2 rounded-lg shadow-md border border-gray-200 laptop:m-0 laptop:scale-y-75">
<div className="flex items-center space-x-4">
<img src="/images/IP-icon.svg" alt="IP Address" className="w-6" />
<div>
<p className="text-xs text-gray-500">IP-Adresse</p>
<p className="text-sm font-medium text-gray-700">{ip}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<img
src="/images/subnet-mask.svg"
alt="subnet mask"
className="w-6"
/>
<div>
<p className="text-xs text-gray-500">Subnet-Maske</p>
<p className="text-sm font-medium text-gray-700">{subnet}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<img src="/images/gateway.svg" alt="gateway" className="w-6" />
<div>
<p className="text-xs text-gray-500">Gateway</p>
<p className="text-sm font-medium text-gray-700">{gateway}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<div className="text-xs font-bold text-blue-600">OPC-UA</div>
<div>
<p className="text-xs text-gray-500">Status</p>
<p className="text-sm font-medium text-gray-700">{opcUaZustand}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<div>
<p className="text-xs text-gray-500">Nodeset Name</p>
<p className="text-sm font-medium text-gray-700">
{opcUaNodesetName}
</p>
</div>
</div>
</div>
</div>
);
};
export default NetworkInfo;

2
config/webVersion.ts
View File

@@ -5,5 +5,5 @@
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
*/
const webVersion = "1.6.19";
const webVersion = "1.6.20";
export default webVersion;

50
pages/dashboard.tsx
View File

@@ -16,7 +16,8 @@ import {
setOpcUaNodesetName,
} from "../redux/slices/variablesSlice";
import webVersion from "../config/webVersion";
import Last20MessagesTable from "../components/main/uebersicht/last20MessagesTable/Last20MessagesTable";
import Last20MessagesTable from "../components/main/uebersicht/Last20MessagesTable";
import NetworkInfo from "../components/main/uebersicht/NetworkInfo";
function Dashboard() {
const router = useRouter();
@@ -197,52 +198,7 @@ function Dashboard() {
</div>
</div>
<div className="flex-shrink-0 flex justify-between items-center mt-1 bg-white p-2 rounded-lg shadow-md border border-gray-200 laptop:m-0 laptop:scale-y-75">
<div className="flex items-center space-x-4">
<img src="/images/IP-icon.svg" alt="IP Address" className="w-6 " />
<div>
<p className="text-xs text-gray-500">IP-Adresse</p>
<p className="text-sm font-medium text-gray-700">{ip}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<img
src="/images/subnet-mask.svg"
alt="subnet mask"
className="w-6 "
/>
<div>
<p className="text-xs text-gray-500">Subnet-Maske</p>
<p className="text-sm font-medium text-gray-700">{subnet}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<img src="/images/gateway.svg" alt="gateway" className="w-6 " />
<div>
<p className="text-xs text-gray-500">Gateway</p>
<p className="text-sm font-medium text-gray-700">{gateway}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<div className="text-xs font-bold text-blue-600">OPC-UA</div>
<div>
<p className="text-xs text-gray-500">Status</p>
<p className="text-sm font-medium text-gray-700">{opcUaZustand}</p>
</div>
</div>
<div className="flex items-center space-x-4">
<div>
<p className="text-xs text-gray-500">Nodeset Name</p>
<p className="text-sm font-medium text-gray-700">
{opcUaNodesetName}
</p>
</div>
</div>
</div>
<NetworkInfo />
</div>
);
}