Header,Footer und dashboard bekommen Daten von IndexedDB statt von Window Objekt

This commit is contained in:
ISA
2024-10-31 14:01:09 +01:00
parent 2fd61c7f7c
commit f2143daa51
5 changed files with 90 additions and 137 deletions

View File

@@ -1,9 +1,9 @@
"use client"; // components/header.jsx
"use client"; // components/Header.jsx
import React, { useEffect, useState } from "react";
import Image from "next/image";
import "bootstrap-icons/font/bootstrap-icons.css";
import SettingsModal from "./modales/SettingsModal";
//import { getFromIndexedDB } from "../utils/indexedDB";
import { getFromIndexedDB, initializeDatabase } from "../utils/indexedDB"; // Importiere initializeDatabase
function Header() {
const [stationsname, setStationsname] = useState("Lädt...");
@@ -13,43 +13,26 @@ function Header() {
const handleSettingsClick = () => setShowSettingsModal(true);
const handleCloseSettingsModal = () => setShowSettingsModal(false);
const handleLogout = () => (window.location.href = "/offline.html");
//------------------------------------------------------------------
//--------- Direkte Implementierung von `getFromIndexedDB` , um Importprobleme zu vermeiden in Produktionsumgebung -----
async function getFromIndexedDB(key) {
return new Promise((resolve, reject) => {
const request = indexedDB.open("CPLDatabase", 1);
request.onsuccess = () => {
const db = request.result;
const transaction = db.transaction("cplVariables", "readonly");
const store = transaction.objectStore("cplVariables");
const getRequest = store.get(key);
getRequest.onsuccess = () => resolve(getRequest.result);
getRequest.onerror = () => reject(getRequest.error);
};
request.onerror = () => reject(request.error);
});
}
//------------------------------------------------------------------
useEffect(() => {
const loadData = async () => {
try {
//console.log("Lade Daten aus IndexedDB...");
// Versuche die Daten zu laden
const deviceName = await getFromIndexedDB("deviceName");
//console.log("DeviceName geladen:", deviceName); // Sollte den geladenen Wert zeigen
const hardwareVersion = await getFromIndexedDB("kueVersion");
//console.log("HardwareVersion geladen:", hardwareVersion); // Sollte den geladenen Wert zeigen
setStationsname(deviceName || "Unbekannt");
setCplStatus(hardwareVersion || "Unbekannt");
} catch (error) {
console.error("Fehler beim Laden der Daten aus IndexedDB:", error);
// Initialisiere die Datenbankstruktur, falls sie fehlt
await initializeDatabase();
}
};
loadData();
const interval = setInterval(() => {
loadData();
}, 5000);