Add an accommodations reservations module #188

Merged
pierre merged 81 commits from accomodation_module into master 2024-06-22 21:30:26 +00:00
4 changed files with 66 additions and 19 deletions
Showing only changes of commit b4a360c492 - Show all commits

View File

@ -137,6 +137,7 @@ export function UpdateReservationDialog(p: {
}); });
}} }}
minDate={Math.floor(new Date().getTime() / 1000) - 3600 * 24 * 60} minDate={Math.floor(new Date().getTime() / 1000) - 3600 * 24 * 60}
canSetMiddleDay
/> />
<PropDateInput <PropDateInput
@ -150,6 +151,7 @@ export function UpdateReservationDialog(p: {
}); });
}} }}
minDate={reservation?.start} minDate={reservation?.start}
canSetMiddleDay
/> />
{conflicts && conflicts.length > 0 && ( {conflicts && conflicts.length > 0 && (

View File

@ -139,6 +139,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
<Checkbox <Checkbox
checked={showValidated} checked={showValidated}
onChange={(_ev, v) => setShowValidated(v)} onChange={(_ev, v) => setShowValidated(v)}
color="success"
/> />
} }
label="Validées" label="Validées"
@ -148,6 +149,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
<Checkbox <Checkbox
checked={showRejected} checked={showRejected}
onChange={(_ev, v) => setShowRejected(v)} onChange={(_ev, v) => setShowRejected(v)}
color="error"
/> />
} }
label="Rejetées" label="Rejetées"
@ -157,6 +159,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
<Checkbox <Checkbox
checked={showPending} checked={showPending}
onChange={(_ev, v) => setShowPending(v)} onChange={(_ev, v) => setShowPending(v)}
color="info"
/> />
} }
label="En attente de validation" label="En attente de validation"
@ -239,7 +242,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
headerToolbar={{ headerToolbar={{
left: "prev,next today", left: "prev,next today",
center: "title", center: "title",
right: "dayGridMonth,dayGridWeek,listWeek", right: "dayGridMonth,dayGridWeek,dayGridDay,listWeek",
}} }}
select={onSelect} select={onSelect}
events={visibleReservations?.map((r) => { events={visibleReservations?.map((r) => {
@ -251,7 +254,6 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
title: `${u?.user_name} - ${a.name}`, title: `${u?.user_name} - ${a.name}`,
start: fmtUnixDateFullCalendar(r.reservation_start), start: fmtUnixDateFullCalendar(r.reservation_start),
end: fmtUnixDateFullCalendar(r.reservation_end), end: fmtUnixDateFullCalendar(r.reservation_end),
allDay: true,
color: a.color ? "#" + a.color : undefined, color: a.color ? "#" + a.color : undefined,
borderColor: borderColor:
r.validated === true r.validated === true

View File

@ -21,6 +21,5 @@ export function fmtUnixDateFullCalendar(time: number): string {
.toString(10) .toString(10)
.padStart(2, "0")}`; .padStart(2, "0")}`;
console.info(d, s);
return s; return s;
} }

View File

@ -5,6 +5,7 @@ import dayjs from "dayjs";
import "dayjs/locale/fr"; import "dayjs/locale/fr";
import { fmtUnixDate } from "../../utils/time_utils"; import { fmtUnixDate } from "../../utils/time_utils";
import { PropEdit } from "./PropEdit"; import { PropEdit } from "./PropEdit";
import { Checkbox, FormControlLabel } from "@mui/material";
export function PropDateInput(p: { export function PropDateInput(p: {
editable: boolean; editable: boolean;
@ -14,7 +15,17 @@ export function PropDateInput(p: {
lastSecOfDay?: boolean; lastSecOfDay?: boolean;
minDate?: number; minDate?: number;
maxDate?: number; maxDate?: number;
canSetMiddleDay?: boolean;
}): React.ReactElement { }): React.ReactElement {
// Check for mid-day value
let isMidDay = false;
if (p.value) {
const d = new Date(p.value * 1000);
isMidDay =
d.getHours() === 12 && d.getMinutes() === 0 && d.getSeconds() === 0;
}
// Shift value
let shiftV = p.value; let shiftV = p.value;
if (shiftV && p.lastSecOfDay) { if (shiftV && p.lastSecOfDay) {
const d = new Date(shiftV * 1000); const d = new Date(shiftV * 1000);
@ -39,22 +50,55 @@ export function PropDateInput(p: {
const maxDate = p.maxDate ? dayjs(new Date(p.maxDate * 1000)) : undefined; const maxDate = p.maxDate ? dayjs(new Date(p.maxDate * 1000)) : undefined;
return ( return (
<>
<div style={{ height: "10px" }}></div>
<LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="fr"> <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="fr">
<DatePicker <DatePicker
label={p.label} label={p.label}
value={value} value={value}
onChange={(v) => { onChange={(v) => {
if (v && p.lastSecOfDay) { if (v && p.lastSecOfDay) {
v.set("hours", 23); v = v.set("hours", 23);
v.set("minutes", 59); v = v.set("minutes", 59);
v.set("seconds", 59); v = v.set("seconds", 59);
} }
p.onChange?.(v ? v.unix() : undefined); p.onChange?.(v ? v.unix() : undefined);
}} }}
minDate={minDate} minDate={minDate}
maxDate={maxDate} maxDate={maxDate}
/> />
<div style={{ height: "10px" }}></div>
</LocalizationProvider> </LocalizationProvider>
{p.canSetMiddleDay && (
<FormControlLabel
disabled={!p.value}
control={
<Checkbox
checked={isMidDay}
onChange={(_ev, midDay) => {
let v = value;
if (midDay) {
v = v.set("hours", 12);
v = v.set("minutes", 0);
v = v.set("seconds", 0);
} else if (p.lastSecOfDay) {
v = v.set("hours", 23);
v = v.set("minutes", 59);
v = v.set("seconds", 59);
} else {
v = v.set("hours", 0);
v = v.set("minutes", 0);
v = v.set("seconds", 0);
}
console.log(midDay, v, v.get("hours"));
p.onChange(v.unix());
}}
/>
}
label="Mi-journée"
/>
)}
<div style={{ height: "30px" }}></div>
</>
); );
} }