uninstall redux-persist, weil nimmt viel Performance weg
This commit is contained in:
Ismail Ali
@@ -1,32 +1,31 @@
|
||||
"use client"; // /components/main/analogeEingaenge/AnalogInputsSettingsModal.tsx
|
||||
"use client";
|
||||
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { Listbox } from "@headlessui/react";
|
||||
interface AnalogInput {
|
||||
id: number;
|
||||
label?: string;
|
||||
offset?: number | string;
|
||||
factor?: number | string;
|
||||
loggerInterval: string;
|
||||
unit?: string;
|
||||
}
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { RootState } from "@/redux/store";
|
||||
import { setIsSettingsModalOpen } from "@/redux/slices/analogInputs/analogInputsUiSlice";
|
||||
|
||||
interface Props {
|
||||
selectedInput: AnalogInput;
|
||||
isOpen: boolean;
|
||||
onClose: () => void;
|
||||
}
|
||||
import type { AnalogInput } from "@/types/analogInput"; // 👈 Importiere den Typ (jetzt definiert und exportiert)
|
||||
|
||||
export default function AnalogInputsSettingsModal() {
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const isOpen = useSelector(
|
||||
(state: RootState) => state.analogInputsUi.isSettingsModalOpen
|
||||
);
|
||||
|
||||
const selectedInput = useSelector<RootState, AnalogInput | null>(
|
||||
(state) => state.selectedAnalogInput
|
||||
);
|
||||
|
||||
export default function AnalogInputSettingsModal({
|
||||
selectedInput,
|
||||
isOpen,
|
||||
onClose,
|
||||
}: Props) {
|
||||
const [label, setLabel] = useState("");
|
||||
const [offset, setOffset] = useState("0.000");
|
||||
const [factor, setFactor] = useState("1.000");
|
||||
const [loggerInterval, setLoggerInterval] = useState("9");
|
||||
const [unit, setUnit] = useState("V");
|
||||
const [isSaving, setIsSaving] = useState(false);
|
||||
|
||||
const unitOptions = ["V", "mA", "°C", "bar", "%"];
|
||||
|
||||
useEffect(() => {
|
||||
@@ -42,12 +41,8 @@ export default function AnalogInputSettingsModal({
|
||||
? selectedInput.factor.toFixed(3)
|
||||
: selectedInput.factor || "1.000"
|
||||
);
|
||||
setLoggerInterval(selectedInput.loggerInterval);
|
||||
setLoggerInterval(selectedInput.loggerInterval || "9");
|
||||
setUnit(selectedInput.unit || "V");
|
||||
console.log(
|
||||
"selectedInput in analoge Eingänge:",
|
||||
selectedInput.loggerInterval
|
||||
);
|
||||
}
|
||||
}, [selectedInput, isOpen]);
|
||||
|
||||
@@ -55,6 +50,7 @@ export default function AnalogInputSettingsModal({
|
||||
|
||||
const handleSave = async () => {
|
||||
setIsSaving(true);
|
||||
|
||||
const slot = selectedInput.id;
|
||||
const isDev = window.location.hostname === "localhost";
|
||||
|
||||
@@ -100,7 +96,7 @@ export default function AnalogInputSettingsModal({
|
||||
alert("Einstellungen gespeichert (Produktion).");
|
||||
}
|
||||
|
||||
onClose();
|
||||
dispatch(setIsSettingsModalOpen(false));
|
||||
location.reload();
|
||||
} catch (err) {
|
||||
alert("Fehler beim Speichern.");
|
||||
@@ -118,7 +114,7 @@ export default function AnalogInputSettingsModal({
|
||||
Einstellungen Messwerteingang {selectedInput.id}
|
||||
</h2>
|
||||
<button
|
||||
onClick={onClose}
|
||||
onClick={() => dispatch(setIsSettingsModalOpen(false))}
|
||||
className="text-2xl hover:text-gray-400"
|
||||
aria-label="Modal schließen"
|
||||
>
|
||||
@@ -128,97 +124,85 @@ export default function AnalogInputSettingsModal({
|
||||
|
||||
{/* Bezeichnung */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3">
|
||||
<div>
|
||||
<span className="font-normal">Bezeichnung:</span>
|
||||
</div>
|
||||
<div>
|
||||
<input
|
||||
type="text"
|
||||
className="w-full border rounded px-3 py-1 mb-4"
|
||||
value={label}
|
||||
onChange={(e) => setLabel(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<span className="font-normal">Bezeichnung:</span>
|
||||
<input
|
||||
type="text"
|
||||
className="w-full border rounded px-3 py-1 mb-4"
|
||||
value={label}
|
||||
onChange={(e) => setLabel(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Offset */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
|
||||
<div>
|
||||
<span className="font-normal">Offset:</span>
|
||||
</div>
|
||||
<div>
|
||||
<input
|
||||
type="number"
|
||||
step="0.001"
|
||||
className="border border-gray-300 rounded px-2 py-1 w-full text-right "
|
||||
value={offset}
|
||||
onChange={(e) => setOffset(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<span className="font-normal">Offset:</span>
|
||||
<input
|
||||
type="number"
|
||||
step="0.001"
|
||||
className="border border-gray-300 rounded px-2 py-1 w-full text-right"
|
||||
value={offset}
|
||||
onChange={(e) => setOffset(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Faktor */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
|
||||
<div>
|
||||
<span className="font-normal">Faktor:</span>
|
||||
</div>
|
||||
<div>
|
||||
<input
|
||||
type="number"
|
||||
step="0.001"
|
||||
className="border border-gray-300 rounded px-2 py-1 w-full text-right"
|
||||
value={factor}
|
||||
onChange={(e) => setFactor(e.target.value)}
|
||||
/>{" "}
|
||||
</div>
|
||||
<span className="font-normal">Faktor:</span>
|
||||
<input
|
||||
type="number"
|
||||
step="0.001"
|
||||
className="border border-gray-300 rounded px-2 py-1 w-full text-right"
|
||||
value={factor}
|
||||
onChange={(e) => setFactor(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
{/* Einheit */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3">
|
||||
<div>
|
||||
<span className="font-normal">Einheit:</span>
|
||||
</div>
|
||||
<div>
|
||||
<Listbox value={unit} onChange={setUnit}>
|
||||
<div className="relative w-full">
|
||||
<Listbox.Button className="w-full border px-3 py-1 rounded text-left bg-white flex justify-between items-center text-sm text-gray-900 font-sans">
|
||||
<span>{unit}</span>
|
||||
<svg
|
||||
className="w-5 h-5 text-gray-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
aria-hidden="true"
|
||||
|
||||
{/* Einheit */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 mb-4">
|
||||
<span className="font-normal">Einheit:</span>
|
||||
<Listbox value={unit} onChange={setUnit}>
|
||||
<div className="relative w-full">
|
||||
<Listbox.Button className="w-full border px-3 py-1 rounded text-left bg-white flex justify-between items-center text-sm text-gray-900 font-sans">
|
||||
<span>{unit}</span>
|
||||
<svg
|
||||
className="w-5 h-5 text-gray-400"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M5.23 7.21a.75.75 0 011.06.02L10 10.585l3.71-3.355a.75.75 0 111.02 1.1l-4.25 3.85a.75.75 0 01-1.02 0l-4.25-3.85a.75.75 0 01.02-1.06z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</Listbox.Button>
|
||||
<Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm text-gray-900 font-sans">
|
||||
{unitOptions.map((opt) => (
|
||||
<Listbox.Option
|
||||
key={opt}
|
||||
value={opt}
|
||||
className={({ selected, active }) =>
|
||||
`px-4 py-1 cursor-pointer ${
|
||||
selected
|
||||
? "bg-littwin-blue text-white font-medium"
|
||||
: active
|
||||
? "bg-gray-200"
|
||||
: "text-gray-900"
|
||||
}`
|
||||
}
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M5.23 7.21a.75.75 0 011.06.02L10 10.585l3.71-3.355a.75.75 0 111.02 1.1l-4.25 3.85a.75.75 0 01-1.02 0l-4.25-3.85a.75.75 0 01.02-1.06z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</Listbox.Button>
|
||||
<Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm text-gray-900 font-sans">
|
||||
{unitOptions.map((opt) => (
|
||||
<Listbox.Option
|
||||
key={opt}
|
||||
value={opt}
|
||||
className={({ selected, active }) =>
|
||||
`px-4 py-1 cursor-pointer ${
|
||||
selected
|
||||
? "bg-littwin-blue text-white font-medium"
|
||||
: active
|
||||
? "bg-gray-200"
|
||||
: "text-gray-900"
|
||||
}`
|
||||
}
|
||||
>
|
||||
{opt}
|
||||
</Listbox.Option>
|
||||
))}
|
||||
</Listbox.Options>
|
||||
</div>
|
||||
</Listbox>
|
||||
</div>
|
||||
{opt}
|
||||
</Listbox.Option>
|
||||
))}
|
||||
</Listbox.Options>
|
||||
</div>
|
||||
</Listbox>
|
||||
</div>
|
||||
{/* Loggerintervall/Speicherintervall */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3 ">
|
||||
|
||||
{/* Speicherintervall */}
|
||||
<div className="grid grid-cols-2 gap-x-4 gap-y-3">
|
||||
<span className="font-normal">Speicherintervall:</span>
|
||||
<div className="relative w-full">
|
||||
<input
|
||||
@@ -233,6 +217,7 @@ export default function AnalogInputSettingsModal({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Speichern-Button */}
|
||||
<div className="flex justify-end gap-2 mt-6">
|
||||
<button
|
||||
onClick={handleSave}
|
||||
|
||||
Reference in New Issue
Block a user