feat: Initialwerte und Grenzen für DatePicker angepasst

- vonDatum wird beim ersten Laden auf 30 Tage zurück gesetzt
- bisDatum ist standardmäßig auf das heutige Datum gesetzt
- Auswahlbereich begrenzt auf maximal 6 Monate zurück
- Heutiger Tag ist das maximale auswählbare Datum
- Datum wird im Format YYYY-MM-DD im Redux gespeichert
This commit is contained in:
Ismail Ali
2025-04-08 19:45:30 +02:00
parent 76ffc1f498
commit cb995911ab
2 changed files with 10 additions and 9 deletions

View File

@@ -19,23 +19,24 @@ const DateRangePicker: React.FC = () => {
);
const today = new Date();
const thirtyDaysAgo = new Date();
thirtyDaysAgo.setDate(today.getDate() - 30);
const sixMonthsAgo = new Date();
sixMonthsAgo.setMonth(today.getMonth() - 6);
// Redux speichert ISO ("YYYY-MM-DD") → Für DatePicker geeignet
const parseISODate = (isoDate: string) => {
const [year, month, day] = isoDate.split("-").map(Number);
return new Date(year, month - 1, day);
};
const formatISO = (date: Date) => date.toLocaleDateString("sv-SE"); // = "YYYY-MM-DD"
// Nur beim ersten Rendern initiale Werte setzen
useEffect(() => {
if (!reduxVonDatum)
dispatch(setVonDatum(thirtyDaysAgo.toISOString().split("T")[0]));
if (!reduxBisDatum)
dispatch(setBisDatum(today.toISOString().split("T")[0]));
if (!reduxVonDatum) dispatch(setVonDatum(formatISO(thirtyDaysAgo)));
if (!reduxBisDatum) dispatch(setBisDatum(formatISO(today)));
}, [dispatch, reduxVonDatum, reduxBisDatum]);
return (
@@ -46,7 +47,7 @@ const DateRangePicker: React.FC = () => {
selected={reduxVonDatum ? parseISODate(reduxVonDatum) : thirtyDaysAgo}
onChange={(date) => {
if (date) {
dispatch(setVonDatum(date.toLocaleDateString("sv-SE")));
dispatch(setVonDatum(formatISO(date)));
}
}}
selectsStart
@@ -54,7 +55,7 @@ const DateRangePicker: React.FC = () => {
reduxVonDatum ? parseISODate(reduxVonDatum) : thirtyDaysAgo
}
endDate={reduxBisDatum ? parseISODate(reduxBisDatum) : today}
minDate={sixMonthsAgo} // ⬅️ 6 Monate zurück erlaubt
minDate={sixMonthsAgo}
maxDate={today}
dateFormat="dd.MM.yyyy"
className="border px-2 py-1 rounded"
@@ -67,7 +68,7 @@ const DateRangePicker: React.FC = () => {
selected={reduxBisDatum ? parseISODate(reduxBisDatum) : today}
onChange={(date) => {
if (date) {
dispatch(setBisDatum(date.toLocaleDateString("sv-SE")));
dispatch(setBisDatum(formatISO(date)));
}
}}
selectsEnd