feat: Messwerteingänge light und dark mode

This commit is contained in:
ISA
2025-08-18 16:09:14 +02:00
parent 7e41e5131f
commit 6036c48332
6 changed files with 41 additions and 24 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.743 NEXT_PUBLIC_APP_VERSION=1.6.744
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.743 NEXT_PUBLIC_APP_VERSION=1.6.744
NEXT_PUBLIC_CPL_MODE=production NEXT_PUBLIC_CPL_MODE=production

View File

@@ -1,3 +1,8 @@
## [1.6.744] 2025-08-18
- feat: Berichte light und dark mode
---
## [1.6.743] 2025-08-18 ## [1.6.743] 2025-08-18
- feat: einstellungen dark und light mode - feat: einstellungen dark und light mode

View File

@@ -37,7 +37,7 @@ export default function AnalogInputsTable({ loading }: { loading: boolean }) {
return ( return (
<div <div
className={`bg-white shadow-md border border-gray-200 p-3 rounded-lg laptop:p-1 xl:p-1 ${ className={`bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 shadow-md border border-gray-200 dark:border-gray-700 p-3 rounded-lg laptop:p-1 xl:p-1 ${
loading ? "cursor-wait" : "" loading ? "cursor-wait" : ""
}`} }`}
> >
@@ -50,18 +50,30 @@ export default function AnalogInputsTable({ loading }: { loading: boolean }) {
</h2> </h2>
<div className="overflow-x-auto"> <div className="overflow-x-auto">
<table <table
className={` text-xs laptop:text-[10px] xl:text-xs 2xl:text-sm border-collapse ${ className={`text-xs laptop:text-[10px] xl:text-xs 2xl:text-sm border-collapse w-full ${
loading ? "cursor-wait" : "" loading ? "cursor-wait" : ""
}`} }`}
> >
<thead className="bg-gray-100 border-b items-center "> <thead className="bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100 border-b items-center">
<tr> <tr>
<th className="border p-1 text-left">Eingang</th> <th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
<th className="border p-1 text-left">Messwert</th> Eingang
<th className="border p-1 text-left">Einheit</th> </th>
<th className="border p-1 text-left">Bezeichnung</th> <th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
<th className="border p-1 text-left">Einstellungen</th> Messwert
<th className="border p-1 text-left">Messkurve</th> </th>
<th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Einheit
</th>
<th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Bezeichnung
</th>
<th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Einstellungen
</th>
<th className="border p-1 text-left bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
Messkurve
</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@@ -80,12 +92,12 @@ export default function AnalogInputsTable({ loading }: { loading: boolean }) {
loading loading
? "cursor-wait" ? "cursor-wait"
: analogInput.id === activeId : analogInput.id === activeId
? "bg-blue-100" ? "bg-blue-100 dark:bg-gray-700 dark:text-white"
: "hover:bg-gray-100" : "hover:bg-gray-100 dark:hover:bg-gray-800"
}`} }`}
> >
<td <td
className="border p-2" className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"
onClick={() => handleSelect(analogInput.id!, analogInput)} onClick={() => handleSelect(analogInput.id!, analogInput)}
> >
<div className="flex items-center gap-1 "> <div className="flex items-center gap-1 ">
@@ -97,7 +109,7 @@ export default function AnalogInputsTable({ loading }: { loading: boolean }) {
</div> </div>
</td> </td>
<td <td
className="border p-2 text-right" className="border p-2 text-right bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"
onClick={() => handleSelect(analogInput.id!, analogInput)} onClick={() => handleSelect(analogInput.id!, analogInput)}
> >
{typeof analogInput.value === "number" {typeof analogInput.value === "number"
@@ -106,36 +118,36 @@ export default function AnalogInputsTable({ loading }: { loading: boolean }) {
</td> </td>
<td <td
className="border p-2" className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"
onClick={() => handleSelect(analogInput.id!, analogInput)} onClick={() => handleSelect(analogInput.id!, analogInput)}
> >
{analogInput.unit || "-"} {analogInput.unit || "-"}
</td> </td>
<td <td
className="border p-2" className="border p-2 bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100"
onClick={() => handleSelect(analogInput.id!, analogInput)} onClick={() => handleSelect(analogInput.id!, analogInput)}
> >
{analogInput.label || "----"} {analogInput.label || "----"}
</td> </td>
<td className="border p-2 text-center"> <td className="border p-2 text-center bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
<button <button
onClick={() => { onClick={() => {
handleSelect(analogInput.id!, analogInput); handleSelect(analogInput.id!, analogInput);
dispatch(setIsSettingsModalOpen(true)); dispatch(setIsSettingsModalOpen(true));
}} }}
className="text-gray-400 hover:text-gray-500" className="text-gray-400 hover:text-gray-500 dark:text-gray-300 dark:hover:text-white"
> >
<Icon icon={settingsIcon} className="text-xl" /> <Icon icon={settingsIcon} className="text-xl" />
</button> </button>
</td> </td>
<td className="border p-2 text-center"> <td className="border p-2 text-center bg-white text-gray-900 dark:bg-gray-900 dark:text-gray-100">
<button <button
onClick={() => { onClick={() => {
handleSelect(analogInput.id!, analogInput); handleSelect(analogInput.id!, analogInput);
dispatch(setIsChartModalOpen(true)); dispatch(setIsChartModalOpen(true));
}} }}
className="text-gray-500 hover:text-gray-700" className="text-gray-500 hover:text-gray-700 dark:text-gray-300 dark:hover:text-white"
title="Messkurve anzeigen" title="Messkurve anzeigen"
aria-label="Messkurve anzeigen" aria-label="Messkurve anzeigen"
> >

4
package-lock.json generated
View File

@@ -1,12 +1,12 @@
{ {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.743", "version": "1.6.744",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "cpl-v4", "name": "cpl-v4",
"version": "1.6.743", "version": "1.6.744",
"dependencies": { "dependencies": {
"@fontsource/roboto": "^5.1.0", "@fontsource/roboto": "^5.1.0",
"@headlessui/react": "^2.2.4", "@headlessui/react": "^2.2.4",

View File

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