Display the reservations
This commit is contained in:
parent
3cdfc4d3c7
commit
a7016f4782
@ -11,7 +11,6 @@ import {
|
||||
FormControlLabel,
|
||||
FormGroup,
|
||||
FormLabel,
|
||||
Typography,
|
||||
} from "@mui/material";
|
||||
import React from "react";
|
||||
import { FamilyApi, FamilyUser } from "../../../api/FamilyApi";
|
||||
@ -23,6 +22,7 @@ import { useAlert } from "../../../hooks/context_providers/AlertDialogProvider";
|
||||
import { useLoadingMessage } from "../../../hooks/context_providers/LoadingMessageProvider";
|
||||
import { useSnackbar } from "../../../hooks/context_providers/SnackbarProvider";
|
||||
import { useUpdateAccommodationReservation } from "../../../hooks/context_providers/accommodations/UpdateReservationDialogProvider";
|
||||
import { fmtUnixDateFullCalendar } from "../../../utils/time_utils";
|
||||
import { AsyncWidget } from "../../../widgets/AsyncWidget";
|
||||
import { useFamily } from "../../../widgets/BaseFamilyRoute";
|
||||
import { FamilyPageTitle } from "../../../widgets/FamilyPageTitle";
|
||||
@ -67,6 +67,24 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
|
||||
setUsers(null);
|
||||
};
|
||||
|
||||
const visibleReservations = React.useMemo(() => {
|
||||
return reservations?.filter((r) => {
|
||||
if (!showValidated && r.validated === true) return false;
|
||||
if (!showPending && r.validated === null) return false;
|
||||
if (!showRejected && r.validated === false) return false;
|
||||
if (hiddenPeople.has(r.user_id)) return false;
|
||||
if (hiddenAccommodations.has(r.accommodation_id)) return false;
|
||||
return true;
|
||||
});
|
||||
}, [
|
||||
showValidated,
|
||||
showRejected,
|
||||
showPending,
|
||||
hiddenPeople,
|
||||
hiddenAccommodations,
|
||||
reservations,
|
||||
]);
|
||||
|
||||
const onSelect = async (d: DateSelectArg) => {
|
||||
try {
|
||||
const resa = await updateReservation(
|
||||
@ -123,7 +141,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
|
||||
onChange={(_ev, v) => setShowValidated(v)}
|
||||
/>
|
||||
}
|
||||
label="Validé"
|
||||
label="Validées"
|
||||
/>
|
||||
<FormControlLabel
|
||||
control={
|
||||
@ -132,7 +150,7 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
|
||||
onChange={(_ev, v) => setShowRejected(v)}
|
||||
/>
|
||||
}
|
||||
label="Rejetés"
|
||||
label="Rejetées"
|
||||
/>
|
||||
<FormControlLabel
|
||||
control={
|
||||
@ -224,6 +242,25 @@ export function AccommodationsReservationsRoute(): React.ReactElement {
|
||||
right: "dayGridMonth,dayGridWeek,listWeek",
|
||||
}}
|
||||
select={onSelect}
|
||||
events={visibleReservations?.map((r) => {
|
||||
const a = accommodations.accommodations.get(
|
||||
r.accommodation_id
|
||||
)!;
|
||||
const u = users?.find((u) => u.user_id === r.user_id);
|
||||
return {
|
||||
title: `${u?.user_name} - ${a.name}`,
|
||||
start: fmtUnixDateFullCalendar(r.reservation_start),
|
||||
end: fmtUnixDateFullCalendar(r.reservation_end),
|
||||
allDay: true,
|
||||
color: a.color ? "#" + a.color : undefined,
|
||||
borderColor:
|
||||
r.validated === true
|
||||
? "green"
|
||||
: r.validated === false
|
||||
? "red dotted"
|
||||
: "grey dotted",
|
||||
};
|
||||
})}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -4,3 +4,23 @@
|
||||
export function fmtUnixDate(time: number): string {
|
||||
return new Date(time * 1000).toLocaleString("fr-FR");
|
||||
}
|
||||
|
||||
/**
|
||||
* Get formatted UNIX date for Full Calendar
|
||||
*/
|
||||
export function fmtUnixDateFullCalendar(time: number): string {
|
||||
const d = new Date(time * 1000);
|
||||
|
||||
const s = `${d.getFullYear()}-${(d.getMonth() + 1)
|
||||
.toString(10)
|
||||
.padStart(2, "0")}-${d.getDate().toString(10).padStart(2, "0")}T${d
|
||||
.getHours()
|
||||
.toString(10)
|
||||
.padStart(2, "0")}:${d.getMinutes().toString(10).padStart(2, "0")}:${d
|
||||
.getSeconds()
|
||||
.toString(10)
|
||||
.padStart(2, "0")}`;
|
||||
|
||||
console.info(d, s);
|
||||
return s;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user