69 lines
2.1 KiB
JavaScript
69 lines
2.1 KiB
JavaScript
"use client";
|
|
import React, { useEffect, useState } from "react";
|
|
import "tailwindcss/tailwind.css";
|
|
import "@fontsource/roboto";
|
|
import "bootstrap-icons/font/bootstrap-icons.css";
|
|
import DeviceData from "../../components/DeviceData";
|
|
|
|
function Dashboard() {
|
|
const [deviceData, setDeviceData] = useState(null);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState(null);
|
|
|
|
useEffect(() => {
|
|
// Funktion zum Abrufen der Gerätedaten von der Start.acp-Seite
|
|
const fetchDeviceData = async () => {
|
|
try {
|
|
// Relativer Pfad zur Start.acp-Datei
|
|
const response = await fetch("/CPL?Start.ACP", {
|
|
mode: "no-cors", // CORS-Einschränkungen vermeiden
|
|
});
|
|
|
|
// Überprüfen, ob die Anfrage erfolgreich war
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! Status: ${response.status}`);
|
|
}
|
|
|
|
// Die Antwort als Text verarbeiten (da es sich um HTML handelt)
|
|
const result = await response.text();
|
|
|
|
// Daten in den Zustand setzen
|
|
setDeviceData(result);
|
|
setLoading(false);
|
|
} catch (error) {
|
|
console.error("Fehler beim Abrufen der Gerätedaten:", error);
|
|
setError(error);
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
fetchDeviceData();
|
|
}, []);
|
|
|
|
return (
|
|
<div className="bg-gray-100 flex flex-col min-h-screen">
|
|
<div className="flex flex-grow w-full">
|
|
{/* Hauptinhalt */}
|
|
<main className="flex-1 bg-white p-8 ml-4 shadow rounded-lg overflow-hidden">
|
|
<h1 className="text-2xl font-bold mb-4">Letzten 20 Meldungen:</h1>
|
|
<div>
|
|
<h1>Gerätedaten</h1>
|
|
<DeviceData />
|
|
</div>
|
|
{loading && <p>Lade Gerätedaten...</p>}
|
|
{error && <p className="text-red-500">Fehler: {error.message}</p>}
|
|
{deviceData && (
|
|
<div>
|
|
<h2>Ersetzte Daten aus Start.acp:</h2>
|
|
{/* Die gerenderten Daten mit dangerouslySetInnerHTML anzeigen */}
|
|
<pre dangerouslySetInnerHTML={{ __html: deviceData }}></pre>
|
|
</div>
|
|
)}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Dashboard;
|