admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Table updates for new appointments fields. Schedule modal baseline functionality. Refactor schedule components to be more reusable.

Browse Source
This commit is contained in:
Patrick Fic
2020-02-06 13:39:39 -08:00
parent 1a14fb8da6
commit fae1e8cdeb
35 changed files with 785 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
client/src/components/schedule-calendar/schedule-calendar.component.jsx
View File

@@ -1,27 +1,13 @@
import moment from "moment";
import React from "react";
import { Calendar, momentLocalizer } from "react-big-calendar";
import "react-big-calendar/lib/css/react-big-calendar.css";
import DateCellWrapper from "../schedule-datecellwrapper/schedule-datecellwrapper.component";
import Event from "../schedule-event/schedule-event.component";
const localizer = momentLocalizer(moment);
import ScheduleCalendarWrapperComponent from "../schedule-calendar-wrapper/scheduler-calendar-wrapper.component";
export default function ScheduleCalendarComponent({ data }) {
export default function ScheduleCalendarComponent({ data, refetch }) {
return (
<Calendar
events={data}
<ScheduleCalendarWrapperComponent
data={data}
defaultView="week"
//views={allViews}
step={30}
showMultiDayTimes
localizer={localizer}
min={new Date("2020-01-01T06:00:00")} //TODO: Read from business settings.
max={new Date("2020-01-01T20:00:00")}
//onSelectEvent={event => console.log("event", event)}
components={{
event: Event,
dateCellWrapper: DateCellWrapper
}}
refetch={refetch}
/>
);
}

11
client/src/components/schedule-calendar/schedule-calendar.container.jsx
View File

@@ -1,14 +1,17 @@
import React from "react";
import { useQuery } from "react-apollo";
import ScheduleCalendarComponent from "./schedule-calendar.component";
import { QUERY_ALL_APPOINTMENTS } from "../../graphql/appointments.queries";
import { QUERY_ALL_ACTIVE_APPOINTMENTS } from "../../graphql/appointments.queries";
import LoadingSpinner from "../loading-spinner/loading-spinner.component";
import AlertComponent from "../alert/alert.component";
export default function ScheduleCalendarContainer() {
const { loading, error, data, refetch } = useQuery(QUERY_ALL_APPOINTMENTS, {
fetchPolicy: "network-only"
});
const { loading, error, data, refetch } = useQuery(
QUERY_ALL_ACTIVE_APPOINTMENTS,
{
fetchPolicy: "network-only"
}
);
if (loading) return <LoadingSpinner />;
if (error) return <AlertComponent message={error.message} type="error" />;