diff --git a/src/scheduling/appointments/AppointmentDetailForm.tsx b/src/scheduling/appointments/AppointmentDetailForm.tsx index 54cb34b4ee..f280612150 100644 --- a/src/scheduling/appointments/AppointmentDetailForm.tsx +++ b/src/scheduling/appointments/AppointmentDetailForm.tsx @@ -1,4 +1,5 @@ import { Select, Label, Alert } from '@hospitalrun/components' +import { addMinutes, roundToNearestMinutes } from 'date-fns' import moment from 'moment' import React, { useEffect, useState } from 'react' import { AsyncTypeahead } from 'react-bootstrap-typeahead' @@ -25,6 +26,25 @@ const AppointmentDetailForm = (props: Props) => { const [options, setOptions] = useState([]) const [isLoading, setIsLoading] = useState(false) + const startDateTime = roundToNearestMinutes(new Date(), { nearestTo: 15 }) + const endDateTime = addMinutes(startDateTime, 60) + + if (!appointment.start) { + appointment.start = String(new Date(Date.now())) + } + + if (!appointment.end) { + appointment.end = String(endDateTime) + } + + if (!appointment.minutesDuration) { + appointment.minutesDuration = Math.round( + Math.floor( + (new Date(appointment.end).getTime() - new Date(appointment.start).getTime()) / 60000 / 5, + ) * 5, + ) + } + // const selectedValues: any[] = [] // const patientName: string = String(patient) @@ -57,7 +77,7 @@ const AppointmentDetailForm = (props: Props) => { { appointment.patientId = p[0] && p[0].resource.id @@ -107,7 +127,7 @@ const AppointmentDetailForm = (props: Props) => { value={ appointment?.start && appointment.minutesDuration ? moment(appointment.start).add(appointment.minutesDuration, 'minute').toDate() - : new Date(Date.now()) + : endDateTime } isEditable={isEditable} onChange={(date: Date) => { diff --git a/src/scheduling/appointments/edit/EditAppointment.tsx b/src/scheduling/appointments/edit/EditAppointment.tsx index db80bdf2cf..93d193a270 100644 --- a/src/scheduling/appointments/edit/EditAppointment.tsx +++ b/src/scheduling/appointments/edit/EditAppointment.tsx @@ -3,6 +3,7 @@ import React, { useEffect, useState } from 'react' import { useHistory, useParams } from 'react-router-dom' import useAddBreadcrumbs from '../../../page-header/breadcrumbs/useAddBreadcrumbs' import { useUpdateTitle } from '../../../page-header/title/TitleContext' +import Loading from '../../../shared/components/Loading' import useTranslator from '../../../shared/hooks/useTranslator' import Appointment from '../../../shared/model/Appointment' import Patient from '../../../shared/model/Patient' @@ -23,9 +24,11 @@ const EditAppointment = () => { const [appointment, setAppointment] = useState({} as Appointment) const [patientName, setPatientName] = useState() + const [isLoading, setIsLoading] = useState(true) const appointmentFunc = async () => { setAppointment(await getAppointmentId(id)) + setIsLoading(false) } const patientFunc = async () => { @@ -90,6 +93,10 @@ const EditAppointment = () => { // return // } + if (isLoading || appointment === undefined) { + return + } + return ( <> {patientName && appointment ? ( diff --git a/src/scheduling/appointments/new/NewAppointment.tsx b/src/scheduling/appointments/new/NewAppointment.tsx index d15031bbcb..56faab2d5b 100644 --- a/src/scheduling/appointments/new/NewAppointment.tsx +++ b/src/scheduling/appointments/new/NewAppointment.tsx @@ -68,10 +68,10 @@ const NewAppointment = () => { const onSave = async () => { console.log(newAppointment) - let data = await createAppointment(newAppointment) - console.log('data', await data) - setAptId(await data) - setSaved(true) + let { id, status } = await createAppointment(newAppointment) + console.log('id: ' + id + ' ' + 'status: ' + status) + setAptId(id) + if (status === 'success') setSaved(true) setError(validateNewAppointment(newAppointment)) } diff --git a/src/scheduling/appointments/service/Appointments.tsx b/src/scheduling/appointments/service/Appointments.tsx index ece12663a6..0ebafc5c51 100644 --- a/src/scheduling/appointments/service/Appointments.tsx +++ b/src/scheduling/appointments/service/Appointments.tsx @@ -53,7 +53,7 @@ export const createAppointment = (appointment: Appointment) => { description: '', meta: {}, created: new Date(Date.now()), - status: appointment.status, + status: appointment.status ? appointment.status : 'Scheduled', participant: [ { actor: { @@ -99,16 +99,14 @@ export const createAppointment = (appointment: Appointment) => { { system: 'https://hl7.org/fhir/v2/ValueSet/appointment-type', code: `${ - appointment.appointmentType.text ? appointment.appointmentType.text : 'Routine visit' + appointment.appointmentType ? appointment.appointmentType.text : 'Routine Visit' }`, display: `${ - appointment.appointmentType.text ? appointment.appointmentType.text : 'Routine visit' + appointment.appointmentType ? appointment.appointmentType.text : 'Routine Visit' }`, }, ], - text: `${ - appointment.appointmentType.text ? appointment.appointmentType.text : 'Routine visit' - }`, + text: `${appointment.appointmentType ? appointment.appointmentType.text : 'Routine Visit'}`, }, patientInstruction: null, contained: [], @@ -122,8 +120,8 @@ export const createAppointment = (appointment: Appointment) => { .then(async (response) => { console.log(response) const data = response.data - console.log(data.data.id) - return data.data.id + console.log(data.data) + return data.data }) .catch((error) => { console.log(error) diff --git a/src/scheduling/appointments/view/ViewAppointment.tsx b/src/scheduling/appointments/view/ViewAppointment.tsx index d0b3d4d2a2..dd5e8b9134 100644 --- a/src/scheduling/appointments/view/ViewAppointment.tsx +++ b/src/scheduling/appointments/view/ViewAppointment.tsx @@ -2,10 +2,10 @@ import { Spinner, Button, Modal, Toast } from '@hospitalrun/components' import React, { useCallback, useEffect, useState } from 'react' import { useSelector } from 'react-redux' import { useHistory, useParams } from 'react-router-dom' - -// import useAddBreadcrumbs from '../../../page-header/breadcrumbs/useAddBreadcrumbs' +import useAddBreadcrumbs from '../../../page-header/breadcrumbs/useAddBreadcrumbs' import { useButtonToolbarSetter } from '../../../page-header/button-toolbar/ButtonBarProvider' import { useUpdateTitle } from '../../../page-header/title/TitleContext' +import Loading from '../../../shared/components/Loading' // import usePatient from '../../../patients/hooks/usePatient' import useTranslator from '../../../shared/hooks/useTranslator' import Appointment from '../../../shared/model/Appointment' @@ -17,6 +17,7 @@ import { RootState } from '../../../shared/store' import AppointmentDetailForm from '../AppointmentDetailForm' import { deleteAppointment, getAppointmentId } from '../service/Appointments' import { getPatientNameById } from '../service/Patients' +import { getAppointmentLabel } from '../util/scheduling-appointment.util' // import { getAppointmentLabel } from '../util/scheduling-appointment.util' // import { Appointment } from '../ViewAppointments' @@ -41,9 +42,11 @@ const ViewAppointment = () => { const [appointment, setAppointment] = useState() const [patientName, setPatientName] = useState() + const [isLoading, setIsLoading] = useState(true) const appointmentFunc = async () => { setAppointment(await getAppointmentId(id)) + setIsLoading(false) } const patientFunc = async () => { @@ -67,11 +70,11 @@ const ViewAppointment = () => { }, [appointment]) // const { data: patient } = usePatient(appointment ? appointment.patient : id) - // const breadcrumbs = [ - // { i18nKey: 'scheduling.appointments.label', location: '/appointments' }, - // { text: appointment ? getAppointmentLabel(appointment) : '', location: `/patients/${id}` }, - // ] - // useAddBreadcrumbs(breadcrumbs, true) + const breadcrumbs = [ + { i18nKey: 'scheduling.appointments.label', location: '/appointments' }, + { text: appointment ? getAppointmentLabel(appointment) : '', location: `/patients/${id}` }, + ] + useAddBreadcrumbs(breadcrumbs, true) const onAppointmentDeleteButtonClick = (event: React.MouseEvent) => { event.preventDefault() @@ -142,6 +145,10 @@ const ViewAppointment = () => { } }, [getButtons, setButtonToolBar]) + if (isLoading || appointment === undefined) { + return + } + return ( <> {patientName && appointment ? ( diff --git a/src/shared/components/input/DateTimePickerWithLabelFormGroup.tsx b/src/shared/components/input/DateTimePickerWithLabelFormGroup.tsx index 3b70fc9ef4..d21efbe930 100644 --- a/src/shared/components/input/DateTimePickerWithLabelFormGroup.tsx +++ b/src/shared/components/input/DateTimePickerWithLabelFormGroup.tsx @@ -40,6 +40,8 @@ const DateTimePickerWithLabelFormGroup = (props: Props) => { withPortal={false} minDate={moment().toDate()} maxDate={moment().add(3, 'months').toDate()} + minTime={moment().toDate()} + maxTime={new Date(new Date().setHours(19, 0, 0, 0))} /> )