style: TDR

This commit is contained in:
ISA
2025-09-09 10:45:59 +02:00
parent f7d1a36e0f
commit 52551b3243
7 changed files with 35 additions and 15 deletions

View File

@@ -168,7 +168,9 @@ const TDRChartActionBar: React.FC = () => {
<div className="toolbar w-full flex items-center gap-3 flex-wrap">
{/* Slot Badge */}
<div className="flex items-center gap-2 pr-4">
<span className="font-semibold uppercase tracking-wide text-muted"></span>
<span className="font-semibold uppercase tracking-wide text-muted">
</span>
<span className="font-medium px-2 py-0.5 rounded bg-surface-alt border border-base min-w-[3rem] text-center">
{selectedSlot !== null ? selectedSlot + 1 : "-"}
</span>
@@ -214,7 +216,9 @@ const TDRChartActionBar: React.FC = () => {
<span className="dropdown-text-fix whitespace-nowrap overflow-hidden text-ellipsis pr-2">
{selectedId
? (() => {
const selected = idsForSlot.find((e) => e.id === selectedId);
const selected = idsForSlot.find(
(e) => e.id === selectedId
);
return selected
? `${new Date(selected.t).toLocaleString("de-DE", {
day: "2-digit",
@@ -247,11 +251,11 @@ const TDRChartActionBar: React.FC = () => {
value={entry.id}
title={fullText}
className={({ selected, active }) => {
const base = "px-3 h-8 cursor-pointer rounded-sm m-0.5 flex items-center justify-start transition-colors text-[13px]";
const base =
"px-3 h-8 cursor-pointer rounded-sm m-0.5 flex items-center justify-start transition-colors text-[13px]";
if (selected)
return `${base} dropdown-option-active font-medium`;
if (active)
return `${base} dropdown-option-hover`;
if (active) return `${base} dropdown-option-hover`;
return `${base}`; // neutral text color comes from parent/theme
}}
>
@@ -271,10 +275,12 @@ const TDRChartActionBar: React.FC = () => {
TDR Messung läuft... kann bis zu zwei Minuten dauern
</p>
<p className="text-sm text-white/80">
Bitte warten {Math.min(
Bitte warten{" "}
{Math.min(
100,
Math.round((tdrProgress / TDR_TOTAL_DURATION) * 100)
)}%
)}
%
</p>
</div>
<div className="w-2/3 max-w-xl h-3 bg-white/20 rounded overflow-hidden shadow-inner">

View File

@@ -16,7 +16,10 @@ import {
setChartTitle,
} from "@/redux/slices/kabelueberwachungChartSlice";
import { resetBrushRange } from "@/redux/slices/brushSlice";
import { setSelectedSlot, setActiveMode } from "@/redux/slices/kueChartModeSlice";
import {
setSelectedSlot,
setActiveMode,
} from "@/redux/slices/kueChartModeSlice";
import { Listbox } from "@headlessui/react";
import Report from "../IsoMeasurementChart/Report";
@@ -26,9 +29,15 @@ interface TDRChartViewProps {
slotIndex: number;
}
const TDRChartView: React.FC<TDRChartViewProps> = ({ isOpen, onClose, slotIndex }) => {
const TDRChartView: React.FC<TDRChartViewProps> = ({
isOpen,
onClose,
slotIndex,
}) => {
const dispatch = useDispatch<AppDispatch>();
const { isFullScreen, chartTitle } = useSelector((s: RootState) => s.kabelueberwachungChartSlice);
const { isFullScreen, chartTitle } = useSelector(
(s: RootState) => s.kabelueberwachungChartSlice
);
// Initialize defaults when opening
useEffect(() => {