feat: Detailansicht auf dynamische Redux-Datenquellen umgestellt

- DetailModal.tsx überarbeitet, um Redux-Daten je nach ausgewähltem Key (+5V, +15V, -15V, -98V, ADC Temp, CPU Temp) anzuzeigen
- Zeitraum-Auswahl (DIA0, DIA1, DIA2) wird berücksichtigt und löst passenden Thunk aus
- Redux-State-Struktur vollständig integriert für Systemspannungen und Temperaturen
- Chart-Anzeige jetzt dynamisch und erweiterbar
This commit is contained in:
ISA
2025-07-03 12:24:53 +02:00
parent a0e8e47fae
commit b1eb3c46a8
7 changed files with 49 additions and 22 deletions

View File

@@ -6,6 +6,6 @@ NEXT_PUBLIC_USE_MOCK_BACKEND_LOOP_START=false
NEXT_PUBLIC_EXPORT_STATIC=false NEXT_PUBLIC_EXPORT_STATIC=false
NEXT_PUBLIC_USE_CGI=false NEXT_PUBLIC_USE_CGI=false
# App-Versionsnummer # App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.535 NEXT_PUBLIC_APP_VERSION=1.6.537
NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter) NEXT_PUBLIC_CPL_MODE=json # json (Entwicklungsumgebung) oder jsSimulatedProd (CPL ->CGI-Interface-Simulator) oder production (CPL-> CGI-Interface Platzhalter)

View File

@@ -5,5 +5,5 @@ NEXT_PUBLIC_CPL_API_PATH=/CPL
NEXT_PUBLIC_EXPORT_STATIC=true NEXT_PUBLIC_EXPORT_STATIC=true
NEXT_PUBLIC_USE_CGI=true NEXT_PUBLIC_USE_CGI=true
# App-Versionsnummer # App-Versionsnummer
NEXT_PUBLIC_APP_VERSION=1.6.535 NEXT_PUBLIC_APP_VERSION=1.6.537
NEXT_PUBLIC_CPL_MODE=production NEXT_PUBLIC_CPL_MODE=production

View File

@@ -1,3 +1,13 @@
## [1.6.537] 2025-07-03
- feat: APIs erstellt für Systemspannungen
---
## [1.6.536] 2025-07-03
- feat: APIs erstellt für Systemspannungen
---
## [1.6.535] 2025-07-03 ## [1.6.535] 2025-07-03
- feat: in System 5 Volt DIA0, DIA1 und DIA2 in dropdown anzeigen - feat: in System 5 Volt DIA0, DIA1 und DIA2 in dropdown anzeigen

View File

@@ -13,6 +13,8 @@ type Props = {
setZeitraum: (typ: "DIA0" | "DIA1" | "DIA2") => void; setZeitraum: (typ: "DIA0" | "DIA1" | "DIA2") => void;
}; };
type ReduxDataEntry = { t: string; i: number };
export const DetailModal = ({ export const DetailModal = ({
isOpen, isOpen,
selectedKey, selectedKey,
@@ -20,22 +22,27 @@ export const DetailModal = ({
zeitraum, zeitraum,
setZeitraum, setZeitraum,
}: Props) => { }: Props) => {
const typMap: Record<string, "DIA0" | "DIA1" | "DIA2"> = { const reduxData: ReduxDataEntry[] = useSelector((state: RootState) => {
"+5V": zeitraum, switch (selectedKey) {
"+15V": zeitraum, case "+5V":
"-15V": zeitraum, return state.systemspannung5Vplus[zeitraum] as ReduxDataEntry[];
"-98V": zeitraum, case "+15V":
}; return state.systemspannung15Vplus[zeitraum] as ReduxDataEntry[];
case "-15V":
return state.systemspannung15Vminus[zeitraum] as ReduxDataEntry[];
case "-98V":
return state.systemspannung98Vminus[zeitraum] as ReduxDataEntry[];
case "ADC Temp":
return state.temperaturAdWandler[zeitraum] as ReduxDataEntry[];
case "CPU Temp":
return state.temperaturProzessor[zeitraum] as ReduxDataEntry[];
default:
return [] as ReduxDataEntry[];
}
});
const typ = selectedKey ? typMap[selectedKey] : null; const labels = reduxData.map((e: ReduxDataEntry) => e.t);
type ReduxDataItem = { t: string; i: number }; const values = reduxData.map((e: ReduxDataEntry) => e.i);
const reduxData = useSelector((state: RootState) =>
typ ? (state.systemspannung5Vplus[typ] as ReduxDataItem[]) : []
);
const labels = reduxData.map((e: ReduxDataItem) => e.t);
const values = reduxData.map((e: ReduxDataItem) => e.i);
const baseOptions = { const baseOptions = {
responsive: true, responsive: true,
@@ -61,7 +68,7 @@ export const DetailModal = ({
return ( return (
<div className="fixed inset-0 bg-black bg-opacity-40 flex items-center justify-center z-50"> <div className="fixed inset-0 bg-black bg-opacity-40 flex items-center justify-center z-50">
<div className="bg-white p-6 rounded-xl w-[90%] max-w-[1200px] h-[80vh] overflow-auto shadow-2xl"> <div className="bg-white p-6 rounded-xl w-[50%] h-[60%] overflow-auto shadow-2xl">
<div className="flex justify-between items-center mb-4"> <div className="flex justify-between items-center mb-4">
<h2 className="text-xl font-semibold"> <h2 className="text-xl font-semibold">
Detailansicht: {selectedKey} Detailansicht: {selectedKey}
@@ -86,7 +93,7 @@ export const DetailModal = ({
</select> </select>
</div> </div>
<div className="h-[500px]"> <div className="h-[85%]">
<Line <Line
data={{ data={{
labels, labels,

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.535", "version": "1.6.537",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.535", "version": "1.6.537",
"dependencies": { "dependencies": {
"@fontsource/roboto": "^5.1.0", "@fontsource/roboto": "^5.1.0",
"@iconify-icons/ri": "^1.2.10", "@iconify-icons/ri": "^1.2.10",

View File

@@ -1,6 +1,6 @@
{ {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.535", "version": "1.6.537",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "next dev", "dev": "next dev",

View File

@@ -9,6 +9,11 @@ import { SystemCharts } from "@/components/main/system/SystemCharts";
import { DetailModal } from "@/components/main/system/DetailModal"; import { DetailModal } from "@/components/main/system/DetailModal";
import type { HistoryEntry } from "@/components/main/system/SystemCharts"; import type { HistoryEntry } from "@/components/main/system/SystemCharts";
import { getSystemspannung5VplusThunk } from "@/redux/thunks/getSystemspannung5VplusThunk"; import { getSystemspannung5VplusThunk } from "@/redux/thunks/getSystemspannung5VplusThunk";
import { getSystemspannung15VplusThunk } from "@/redux/thunks/getSystemspannung15VplusThunk";
import { getSystemspannung15VminusThunk } from "@/redux/thunks/getSystemspannung15VminusThunk";
import { getSystemspannung98VminusThunk } from "@/redux/thunks/getSystemspannung98VminusThunk";
import { getTemperaturAdWandlerThunk } from "@/redux/thunks/getTemperaturAdWandlerThunk";
import { getTemperaturProzessorThunk } from "@/redux/thunks/getTemperaturProzessorThunk";
const SystemPage = () => { const SystemPage = () => {
const dispatch = useDispatch<AppDispatch>(); const dispatch = useDispatch<AppDispatch>();
@@ -35,6 +40,11 @@ const SystemPage = () => {
useEffect(() => { useEffect(() => {
dispatch(getSystemspannung5VplusThunk(zeitraum)); dispatch(getSystemspannung5VplusThunk(zeitraum));
dispatch(getSystemspannung15VplusThunk(zeitraum));
dispatch(getSystemspannung15VminusThunk(zeitraum));
dispatch(getSystemspannung98VminusThunk(zeitraum));
dispatch(getTemperaturAdWandlerThunk(zeitraum));
dispatch(getTemperaturProzessorThunk(zeitraum));
}, [dispatch, zeitraum]); }, [dispatch, zeitraum]);
const handleOpenDetail = (key: string) => { const handleOpenDetail = (key: string) => {