WIP: von bis Zeitraum in ISO und TDR, aber TDR ist WIP
This commit is contained in:
@@ -271,7 +271,7 @@ const IsoChartActionBar = forwardRef((_props, ref) => {
|
||||
|
||||
useImperativeHandle(ref, () => ({ handleFetchData }));
|
||||
|
||||
const hiddenWhenMeldungen = chartTitle !== "Messkurve";
|
||||
const isMeldungen = chartTitle === "Meldungen";
|
||||
|
||||
return (
|
||||
<div className="toolbar w-full justify-between flex-wrap">
|
||||
@@ -283,80 +283,76 @@ const IsoChartActionBar = forwardRef((_props, ref) => {
|
||||
{slotNumber !== null ? slotNumber + 1 : "-"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2 flex-1 justify-end">
|
||||
<div
|
||||
className={
|
||||
hiddenWhenMeldungen
|
||||
? "opacity-0 pointer-events-none"
|
||||
: "opacity-100"
|
||||
}
|
||||
>
|
||||
<DateRangePicker />
|
||||
</div>
|
||||
<div
|
||||
className={`transition-opacity ${
|
||||
hiddenWhenMeldungen
|
||||
? "opacity-0 pointer-events-none"
|
||||
: "opacity-100"
|
||||
}`}
|
||||
>
|
||||
<Listbox
|
||||
value={selectedMode}
|
||||
onChange={(value) => {
|
||||
dispatch(setSelectedMode(value));
|
||||
dispatch(setBrushRange({ startIndex: 0, endIndex: 0 }));
|
||||
}}
|
||||
>
|
||||
<div className="relative w-48">
|
||||
<Listbox.Button className="dropdown-surface w-full flex items-center justify-between">
|
||||
<span className="dropdown-text-fix">
|
||||
{
|
||||
{
|
||||
DIA0: "Alle Messwerte",
|
||||
DIA1: "Stündlich",
|
||||
DIA2: "Täglich",
|
||||
}[selectedMode]
|
||||
}
|
||||
</span>
|
||||
<i className="bi bi-chevron-down opacity-70" />
|
||||
</Listbox.Button>
|
||||
<Listbox.Options className="dropdown-options absolute z-50 mt-1 w-full max-h-60 overflow-auto ">
|
||||
{["DIA0", "DIA1", "DIA2"].map((mode) => (
|
||||
<Listbox.Option
|
||||
key={mode}
|
||||
value={mode}
|
||||
className={({ selected, active }) =>
|
||||
`px-3 py-1.5 cursor-pointer rounded-sm m-0.5 ${
|
||||
selected
|
||||
? "dropdown-option-active"
|
||||
: active
|
||||
? "dropdown-option-hover"
|
||||
: ""
|
||||
}`
|
||||
}
|
||||
>
|
||||
<div className="flex items-center gap-3 flex-1 justify-end">
|
||||
{/* Always show date range; requirement: in Meldungen only Von/Bis + Anzeigen */}
|
||||
<DateRangePicker />
|
||||
{!isMeldungen && (
|
||||
<>
|
||||
<Listbox
|
||||
value={selectedMode}
|
||||
onChange={(value) => {
|
||||
dispatch(setSelectedMode(value));
|
||||
dispatch(setBrushRange({ startIndex: 0, endIndex: 0 }));
|
||||
}}
|
||||
>
|
||||
<div className="relative w-48">
|
||||
<Listbox.Button className="dropdown-surface w-full flex items-center justify-between">
|
||||
<span className="dropdown-text-fix">
|
||||
{
|
||||
{
|
||||
DIA0: "Alle Messwerte",
|
||||
DIA1: "Stündlich",
|
||||
DIA2: "Täglich",
|
||||
}[mode as "DIA0" | "DIA1" | "DIA2"]
|
||||
}[selectedMode]
|
||||
}
|
||||
</Listbox.Option>
|
||||
))}
|
||||
</Listbox.Options>
|
||||
</div>
|
||||
</Listbox>
|
||||
</div>
|
||||
<button
|
||||
onClick={handleFetchData}
|
||||
className={`btn-primary h-8 font-medium px-3 ${
|
||||
hiddenWhenMeldungen ? "invisible" : "visible"
|
||||
}`}
|
||||
type="button"
|
||||
>
|
||||
Daten laden
|
||||
</button>
|
||||
</span>
|
||||
<i className="bi bi-chevron-down opacity-70" />
|
||||
</Listbox.Button>
|
||||
<Listbox.Options className="dropdown-options absolute z-50 mt-1 w-full max-h-60 overflow-auto">
|
||||
{["DIA0", "DIA1", "DIA2"].map((mode) => (
|
||||
<Listbox.Option
|
||||
key={mode}
|
||||
value={mode}
|
||||
className={({ selected, active }) =>
|
||||
`px-3 py-1.5 cursor-pointer rounded-sm m-0.5 ${
|
||||
selected
|
||||
? "dropdown-option-active"
|
||||
: active
|
||||
? "dropdown-option-hover"
|
||||
: ""
|
||||
}`
|
||||
}
|
||||
>
|
||||
{
|
||||
{
|
||||
DIA0: "Alle Messwerte",
|
||||
DIA1: "Stündlich",
|
||||
DIA2: "Täglich",
|
||||
}[mode as "DIA0" | "DIA1" | "DIA2"]
|
||||
}
|
||||
</Listbox.Option>
|
||||
))}
|
||||
</Listbox.Options>
|
||||
</div>
|
||||
</Listbox>
|
||||
<button
|
||||
onClick={handleFetchData}
|
||||
className="btn-primary h-8 font-medium px-3"
|
||||
type="button"
|
||||
>
|
||||
Daten laden
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
{isMeldungen && (
|
||||
<button
|
||||
onClick={handleFetchData}
|
||||
className="btn-primary h-8 font-medium px-4"
|
||||
type="button"
|
||||
>
|
||||
Anzeigen
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user