import React, { useEffect } from 'react';
import { Box, Button, TextField } from '@mui/material';
import Head from 'next/head';
import { ChevronLeftOutlined } from '@mui/icons-material';
import Loading from 'components/Loading';
import { useFormik } from 'formik';
import { useRouter } from 'next/dist/client/router';
import * as yup from 'yup';
const validationSchema = yup.object({
patient_name: yup
.string('Enter your name')
.min(2, 'Name should be of minimum 2 characters length')
.required('Name is required'),
patient_hkid: yup
.string('Enter your HKID')
.matches(/^[A-Z]{1,2}[0-9]{6}\([0-9]\)$/, 'HKID should be in format of XX123456(1-9)')
.required('HKID is required'),
patient_age: yup
.number('Enter your age')
.min(1, 'Age should be greater than 0')
.max(90, 'Age should be less than 90')
.required('Age is required'),
patient_mobile: yup
.string('Enter your mobile number')
.matches(/^[0-9]{8}$/, 'Mobile number should be 8 numbers')
.required('Mobile number is required'),
});
export default () => {
const router = useRouter();
const { id } = router.query;
const [changing_page, setChangingPage] = React.useState(false);
const [loading, setLoading] = React.useState(true);
const formik = useFormik({
enableReinitialize: true,
initialValues: {
patient_name: '',
patient_hkid: '',
patient_age: 0,
patient_mobile: '',
//
bruisesScratchesMinorBurns: false,
chestPain: false,
headache: false,
myMuiCheck: false,
nauseaAndVomiting: false,
runnyOrStuffyNose: false,
soreThroat: false,
},
validationSchema,
onSubmit: values => {
fetch('/api/patient_queue/update_queue_item', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ id, queue_type: 'semi-urgent', values }),
})
.then(response => response.json())
.then(data => {
if (data.status) {
alert('saved !');
router.reload();
} else {
// alert(data.message);
alert('sorry there are something wrong, please try again');
}
})
.catch(err => {
console.error(err);
alert('server error');
});
},
});
useEffect(() => {
console.log({ t: `/api/patient_queue/read_queue_item?queue_type=semi-urgent&id=${id}` });
if (id) {
fetch(`/api/patient_queue/read_queue_item?queue_type=semi-urgent&id=${id}`, {
method: 'GET',
})
.then(response => response.json())
.then(data => {
if (data.status) {
console.log(data);
const {
name,
hkid,
mobile,
age,
bruisesScratchesMinorBurns,
chestPain,
headache,
myMuiCheck,
nauseaAndVomiting,
runnyOrStuffyNose,
soreThroat,
} = data.queueItem;
formik.setValues({
patient_name: name,
patient_hkid: hkid,
patient_mobile: mobile,
patient_age: age,
bruisesScratchesMinorBurns,
chestPain,
headache,
myMuiCheck,
nauseaAndVomiting,
runnyOrStuffyNose,
soreThroat,
});
} else {
alert(data.message);
}
setLoading(false);
})
.catch(err => {
console.error(err);
alert('server error');
})
.finally(() => {
setLoading(false);
});
}
}, [id]);
if (loading) {
return