Add Date selection constraints
All checks were successful
continuous-integration/drone/push Build is passing
continuous-integration/drone/pr Build is passing

This commit is contained in:
Pierre HUBERT 2024-06-19 19:10:18 +02:00
parent 1ce7fcb90d
commit b66a8a8ac9
2 changed files with 9 additions and 2 deletions

View File

@ -78,6 +78,7 @@ export function UpdateReservationDialog(p: {
return { ...r!, start: s ?? -1 }; return { ...r!, start: s ?? -1 };
}); });
}} }}
minDate={Math.floor(new Date().getTime() / 1000) - 3600 * 24 * 60}
/> />
<PropDateInput <PropDateInput
@ -90,10 +91,9 @@ export function UpdateReservationDialog(p: {
return { ...r!, end: s ?? -1 }; return { ...r!, end: s ?? -1 };
}); });
}} }}
minDate={reservation?.start}
/> />
{/* Constraint start and end */}
{/* TODO : la suite */} {/* TODO : la suite */}
</DialogContent> </DialogContent>
<DialogActions> <DialogActions>

View File

@ -12,6 +12,8 @@ export function PropDateInput(p: {
value: number | undefined; value: number | undefined;
onChange: (v: number | undefined) => void; onChange: (v: number | undefined) => void;
lastSecOfDay?: boolean; lastSecOfDay?: boolean;
minDate?: number;
maxDate?: number;
}): React.ReactElement { }): React.ReactElement {
let shiftV = p.value; let shiftV = p.value;
if (shiftV && p.lastSecOfDay) { if (shiftV && p.lastSecOfDay) {
@ -33,6 +35,9 @@ export function PropDateInput(p: {
shiftV && p.value! > 0 ? new Date(shiftV * 1000) : undefined shiftV && p.value! > 0 ? new Date(shiftV * 1000) : undefined
); );
const minDate = p.minDate ? dayjs(new Date(p.minDate * 1000)) : undefined;
const maxDate = p.maxDate ? dayjs(new Date(p.maxDate * 1000)) : undefined;
return ( return (
<div style={{ margin: "10px auto" }}> <div style={{ margin: "10px auto" }}>
<LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="fr"> <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="fr">
@ -47,6 +52,8 @@ export function PropDateInput(p: {
} }
p.onChange?.(v ? v.unix() : undefined); p.onChange?.(v ? v.unix() : undefined);
}} }}
minDate={minDate}
maxDate={maxDate}
/> />
</LocalizationProvider> </LocalizationProvider>
</div> </div>