Einstellungen von Header nach Einstellungsseite ausgelagert

This commit is contained in:
ISA
2025-03-14 11:41:31 +01:00
parent 8c638acfc7
commit 0139ef656b
11 changed files with 541 additions and 91 deletions

View File

@@ -0,0 +1,27 @@
// components/main/settingsPageComponents/GeneralSettings.tsx
import bcrypt from "bcryptjs";
import { generateToken } from "../utils/cryptoUtils";
import USERS from "../config/users";
const handleAdminLogin = (
username: string,
password: string,
onSuccess: () => void,
onError: (errorMsg: string) => void
) => {
const user = USERS.Admin;
bcrypt.compare(password, user.password, (err, isMatch) => {
if (isMatch) {
const token = generateToken(user);
sessionStorage.setItem("token", token);
localStorage.setItem("isAdminLoggedIn", "true");
onSuccess();
} else {
onError(
"Login fehlgeschlagen. Bitte überprüfen Sie Benutzername und Passwort."
);
}
});
};
export default handleAdminLogin;

View File

@@ -0,0 +1,34 @@
// components/main/settingsPageComponents/handlers/handleClearDatabase.ts
const handleClearDatabase = async () => {
const confirmClear = window.confirm(
"Sind Sie sicher, dass Sie die Datenbank leeren möchten?"
);
if (!confirmClear) return;
// Get the current path and ensure it ends with ".html"
let currentPath = window.location.pathname;
if (!currentPath.endsWith(".html")) {
currentPath += ".html";
}
// Full URL with host, current path, and clear database command
const url = `${window.location.origin}/CPL?${currentPath}&DEDB=1`;
// Log the full URL to the console for debugging
console.log(url);
// Send the clear database command to the server using fetch and GET method
try {
const response = await fetch(url, { method: "GET" });
if (response.ok) {
alert("Datenbank erfolgreich geleert!");
} else {
alert("Fehler beim Leeren der Datenbank!");
}
} catch (error) {
console.error("Fehler:", error);
alert("Fehler beim Leeren der Datenbank!");
}
};
export default handleClearDatabase;

View File

@@ -0,0 +1,93 @@
// components/main/settingsPageComponents/handlers/handleReboot.ts
const handleReboot = async (newIp: string | null = null): Promise<void> => {
const showWaitPage = () => {
const waitHTML = `
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bitte warten...</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
background-color: #f4f4f9;
color: #333;
}
.message {
text-align: center;
}
.progress-container {
width: 100%;
background-color: #ddd;
border-radius: 10px;
overflow: hidden;
margin-top: 20px;
}
.progress-bar {
height: 20px;
width: 0;
background-color: #3498db;
transition: width 0.3s;
}
</style>
</head>
<body>
<div class="message">
<p>Bitte warten, CPL wird neu gestartet...</p>
<div class="progress-container">
<div class="progress-bar" id="progress-bar"></div>
</div>
</div>
</body>
</html>
`;
document.documentElement.innerHTML = waitHTML;
let progress = 0;
const progressBar = document.getElementById("progress-bar");
if (progressBar) {
const interval = setInterval(() => {
progress += 1;
progressBar.style.width = progress + "%";
if (progress >= 100) {
clearInterval(interval);
}
}, 300);
} else {
console.error("Progress-Bar-Element nicht gefunden.");
}
};
if (
window.confirm("Sind Sie sicher, dass Sie den CPL neu starten möchten?")
) {
showWaitPage();
const baseRedirectURL = newIp ? `https://${newIp}` : window.location.origin;
const redirectPath =
process.env.NODE_ENV === "production" ? "/dashboard.html" : "/dashboard";
setTimeout(() => {
window.location.href = `${baseRedirectURL}${redirectPath}`;
}, 33000);
const url = `${window.location.origin}/CPL?wait2reboot.html&BOOT=1`;
console.log(url);
fetch(url, { method: "GET" })
.then(() => {
console.log("Neustart-Anfrage erfolgreich gesendet.");
})
.catch((error) => {
console.error("Fehler beim Senden der Neustartanfrage:", error);
});
}
};
export default handleReboot;

View File

@@ -0,0 +1,45 @@
//components/main/settingsPageComponents/handlers/handleSetDateTime.ts
const handleSetDateTime = () => {
const currentDate = new Date();
// Format date and time as required by the system without leading zeros:
const year = currentDate.getFullYear().toString().slice(-2); // Last two digits of the year
const month = Number(currentDate.getMonth() + 1); // Convert to Number to remove leading zero
const day = Number(currentDate.getDate()); // Convert to Number to remove leading zero
const hours = Number(currentDate.getHours()); // Convert to Number to remove leading zero
const minutes = Number(currentDate.getMinutes()); // Convert to Number to remove leading zero
const seconds = Number(currentDate.getSeconds()); // Convert to Number to remove leading zero
// Date and Time commands
const dateCommand = `CLK00=${year}-${month}-${day}`;
const timeCommand = `CLK01=${hours}-${minutes}-${seconds}`;
// Get the current path and ensure it ends with ".html"
let currentPath = window.location.pathname;
if (!currentPath.endsWith(".html")) {
currentPath += ".html";
}
// Full URL with host, current path, date, and time commands
const url = `${window.location.origin}/CPL?${currentPath}&${dateCommand}&${timeCommand}`;
// Log the full URL to the console
console.log(url);
// Send the commands to the server using fetch and GET method
fetch(url, { method: "GET" })
.then((response) => {
if (response.ok) {
alert("Datum und Uhrzeit erfolgreich gesetzt!");
} else {
alert("Fehler beim Setzen von Datum und Uhrzeit!");
}
})
.catch((error) => {
console.error("Fehler:", error);
alert("Fehler beim Setzen von Datum und Uhrzeit!");
});
};
export default handleSetDateTime;

View File

@@ -0,0 +1,98 @@
// components/main/settingsPageComponents/handlers/handleSubmit.ts
import handleReboot from "./handleReboot";
interface OriginalValues {
name: string;
ip: string;
subnet: string;
gateway: string;
ntp1: string;
ntp2: string;
ntp3: string;
ntpTimezone: string;
active: boolean;
}
interface CurrentValues {
name: string;
ip: string;
subnet: string;
gateway: string;
ntp1: string;
ntp2: string;
ntp3: string;
ntpTimezone: string;
active: boolean;
}
const handleSubmit = (
originalValues: OriginalValues,
currentValues: CurrentValues
): void => {
const changes: { [key: string]: string | boolean } = {};
let networkChanges = false;
let newIp: string | null = null;
// Überprüfe, welche Werte sich geändert haben
if (currentValues.name !== originalValues.name) {
changes.SNNA = currentValues.name;
networkChanges = true;
}
if (currentValues.ip !== originalValues.ip) {
changes.SEI01 = currentValues.ip;
newIp = currentValues.ip; // Neue IP speichern
networkChanges = true;
}
if (currentValues.subnet !== originalValues.subnet) {
changes.SEI02 = currentValues.subnet;
networkChanges = true;
}
if (currentValues.gateway !== originalValues.gateway) {
changes.SEI03 = currentValues.gateway;
networkChanges = true;
}
if (currentValues.ntp1 !== originalValues.ntp1) {
changes.SNIP1 = currentValues.ntp1;
}
if (currentValues.ntp2 !== originalValues.ntp2) {
changes.SNIP2 = currentValues.ntp2;
}
if (currentValues.ntp3 !== originalValues.ntp3) {
changes.SNIP3 = currentValues.ntp3;
}
if (currentValues.ntpTimezone !== originalValues.ntpTimezone) {
changes.SNTZ = currentValues.ntpTimezone;
}
if (currentValues.active !== originalValues.active) {
changes.SNAC = currentValues.active;
}
if (Object.keys(changes).length > 0) {
// URL für die Änderungen erstellen
let url = `${window.location.origin}/CPL?${window.location.pathname}`;
Object.keys(changes).forEach((paramKey) => {
url += `&${paramKey}=${encodeURIComponent(String(changes[paramKey]))}`;
});
console.log(url);
fetch(url, { method: "GET" })
.then(() => {
alert("Daten erfolgreich gesendet!");
if (networkChanges) {
alert(
"Hinweis: Die Änderungen in CPL-Name und den Netzwerkeinstellungen werden erst nach einem Neustart des CPL wirksam."
);
handleReboot(newIp); // handleReboot mit neuer IP aufrufen
}
})
.catch((error) => {
console.error("Fehler beim Senden der Daten:", error);
alert("Fehler beim Senden der Daten.");
});
} else {
alert("Keine Änderungen vorgenommen.");
}
};
export default handleSubmit;