import { Button, ButtonGroup, Stack } from '@mui/material';
import Box from '@mui/material/Box';
import { useEffect, useState } from 'react';
import { AgGridReact } from 'ag-grid-react';
import useAxiosPrivate from '../../utils/useAxiosPrivate';
import EditNoteRoundedIcon from '@mui/icons-material/EditNoteRounded';
import DeleteSweepRoundedIcon from '@mui/icons-material/DeleteSweepRounded';
import AddCircleOutlineRoundedIcon from '@mui/icons-material/AddCircleOutlineRounded';
import Popup from './Popup';
import { useFormik } from "formik";
import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';
import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
import DownloadIcon from '@mui/icons-material/Download';
import ExcelJS from 'exceljs';
import jsPDF from 'jspdf';
import 'jspdf-autotable';
import PropTypes from "prop-types";
import VisibilityIcon from '@mui/icons-material/Visibility';
import * as Yup from 'yup';
import { Link } from 'react-router-dom';
import { useNavigate } from 'react-router-dom';
const PatientValidationForm = Yup.object({
// selectpatientcategory: Yup.string().required("Please choose patient category "),
patientName: Yup.string().required("Please enter patient name"),
// fhname: Yup.string().required("Please enter father anme "),
// date: Yup.string().required("Please enter birth date"),
// genderchoose: Yup.string().required("Please genderchoose"),
// blood: Yup.string().required("Please enter blood"),
// aadhar: Yup.string().required("Please enter aadhar"),
// phone: Yup.string().required("Please enter phone number"),
// village: Yup.string().required("Please enter village"),
// post: Yup.string().required("Please enter post"),
// ps: Yup.string().required("Please enter ps"),
// tehsil:Yup.string().required("Please enter tehsil "),
// district:Yup.string().required("Please enter district "),
// state:Yup.string().required("Please enter sat"),
// pin:Yup.string().required("Please enter pin"),
});
//exercise || diet || measurement icon
// import FitnessCenterIcon from '@mui/icons-material/FitnessCenter';
import SettingsAccessibilityIcon from '@mui/icons-material/SettingsAccessibility';
// import RestaurantIcon from '@mui/icons-material/Restaurant';
import ExerciseMinuteForm from './ExerciseMinuteForm';
import DailyMeasurementForm from './DailyMeasurementForm';
import PatientInfoForm from "./PatientProfileForm"
import PatientDietForm from './PatientDietForm';
import Tooltip, { tooltipClasses } from '@mui/material/Tooltip';
import { styled } from '@mui/material/styles';
import DirectionsRunIcon from '@mui/icons-material/DirectionsRun';
import DashboardIcon from '@mui/icons-material/Dashboard';
const formComponents = {
PatientInfoForm: PatientInfoForm,
ExerciseMinuteForm: ExerciseMinuteForm,
DailyMeasurementForm: DailyMeasurementForm,
PatientDietForm : PatientDietForm
};
const PatientList = () => {
const [rowData, setRowData] = useState([]);
const [colDefs, setColDefs] = useState([]);
const [openPopup, setOpenPopup] = useState(false);
const [viewMode, setViewMode] = useState(false);
const axiosClientPrivate = useAxiosPrivate();
const [id, setId] = useState(1);
const [showupdate, setShowupdate] = useState(false);
const [fetchTrigger, setFetchTrigger] = useState(0);
const navigate = useNavigate();
const [exercises,setExercise] = useState([]);
const [unit,setUnit] = useState([{}]);
const [bodyparams,setBodyparams] = useState([]);
const [nutrient,setNutrient] = useState([]);
const [patientid,setPatientid] = useState(null);
const [titlle,setTitle] = useState("Patient Master")
const [currentForm, setCurrentForm] = useState('PatientInfoForm');
const [bodyparameterpair,setBodyparameterpair] = useState({})
const [unitpair,setUnitpair] = useState({});
const [nutrientpair,setNutrientpair] = useState({});
const[bodyparaunit,setBodyparaunit] = useState({});
const [paraid,setParaid] = useState({});
const [paraunitid,setParaunitid] = useState({});
const [exerciseid, setExerciseid] = useState({});
const [nutrientidpair,setNutrientidpair] = useState({});
const patientInfoFormik = useFormik({
initialValues: {
selectpatientcategory: "",
patientName: "",
fatherName: "",
dob: "",
gender: "",
bloodGroup: "",
aadharNo: "",
primaryPhone: "",
village: "",
post: "",
ps: "",
tehsil: "",
district: "",
state: "",
pinCode: "",
lastModified: "",
modifiedBy: ""
},
validationSchema: PatientValidationForm,
onSubmit: async (values, { resetForm }) => {
try {
const response = await axiosClientPrivate.post('/patients', values);
toast.success("Saved Successfully!", {
position: "top-center"
});
setFetchTrigger(prev => prev + 1);
console.log('Response:', response.data);
resetForm();
// navigate(`/PatientAndContact/${rowData[rowData.length - 1].id + 1}`);
} catch (error) {
console.log(values);
console.error('Error:', error);
}
},
});
// console.log("to checkkk",exercises);
// const cehck = "chekk"
// const [exercisess] = useState([
// { name: 'Push-ups', id: 1 },
// { name: 'Sit-ups', id: 2 },
// { name: 'Squats', id: 3 },
// ]);
// const dd =
// console.log("dd",exercises);
// exercise plan
useEffect(() => {
const controller = new AbortController();
const getAllOhc = async () => {
try {
const response = await axiosClientPrivate.get('http://localhost:8080/exercise-masters', { signal: controller.signal });
const items = response.data.content;
setExercise(items);
const pair = {};
items.forEach(item => {
pair[item.exerciseName] = item.id;
});
setExerciseid(pair);
console.log("exercise and id pair",pair);
} catch (err) {
console.error("Failed to fetch exercise: ", err);
}
};
getAllOhc();
return () => {
controller.abort();
};
}, []);
// console.log("jhkhkjh",exercises);
const exerciseMinuteFormik = useFormik({
enableReinitialize: true,
initialValues: {
exercises: exercises.map(item => ({
exercisename: item.exerciseName,
minutes: '',
remark: ''
}))
},
// validationSchema: ExerciseMinuteValidationForm, // if you have a validation schema for this form
onSubmit: async (values, { resetForm }) => {
const filteredExercises = values.exercises.filter(exercise => exercise.minutes && exercise.remark);
console.log("filter",filteredExercises);
const exercisePlanValues = filteredExercises.reduce((acc, param) => {
acc[exerciseid[param.exercisename]] = {
value: parseFloat(param.minutes),
// unitId: paraunitid[param.measurementname],
remark: param.remark
};
return acc;
}, {});
const finalValues = {
date : getFormattedDate(),
empId: patientid,
exercisePlanValues: exercisePlanValues
};
console.log("exercise final json obj",finalValues);
try {
const response = await axiosClientPrivate.post('/patient-exercise-plans', finalValues);
toast.success("Saved Successfully!", {
position: "top-center"
});
console.log('Response:', response.data);
resetForm();
} catch (error) {
console.log(values);
console.error('Error:', error);
}
},
});
// body measurement parameter
useEffect(() => {
const controller = new AbortController();
const getAllOhc = async () => {
try {
const response = await axiosClientPrivate.get('http://localhost:8080/measurements', { signal: controller.signal });
const items = response.data.content;
console.log("body parameter :-",items);
const parameter = {};
const paraid = {};
const paraunitid = {};
items.forEach(item => {
parameter[item.bmName] = unitpair[item.id];
paraid[item.bmName] = item.id;
paraunitid[item.bmName] = item.unitId;
});
console.log("check key value parameter",parameter);
setBodyparameterpair(parameter);
setParaid(paraid);
setParaunitid(paraunitid);
console.log("parameter and id pair",paraid);
console.log("parameter and unit pair",paraunitid);
setBodyparams(items);
} catch (err) {
console.error("Failed to fetch data: ", err);
}
};
getAllOhc();
return () => {
controller.abort();
};
}, [axiosClientPrivate,unitpair]);
function getFormattedDate() {
const date = new Date();
const day = String(date.getDate()).padStart(2, '0');
const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-indexed
const year = date.getFullYear();
return `${year}-${month}-${day}`;
}
// console.log("date",getFormattedDate());
const bodyMeasurementFormik = useFormik({
enableReinitialize: true,
initialValues: {
// empId : patientid,
parameters: bodyparams.map(item => ({
measurementname: item.bmName,
measuremenvalue: '',
remark: ''
}))
},
// validationSchema: ExerciseMinuteValidationForm, // if you have a validation schema for this form
onSubmit: async (values, { resetForm }) => {
// console.log('not filter values:', values);
const filteredMeasurement = values.parameters.filter(item => item.measuremenvalue && item.remark);
const bodyMeasurementValues = filteredMeasurement.reduce((acc, param) => {
acc[paraid[param.measurementname]] = {
value: parseFloat(param.measuremenvalue),
// unitId: paraunitid[param.measurementname],
remark: param.remark
};
return acc;
}, {});
const finalValues = {
date : getFormattedDate(),
empId: patientid,
bodyMeasurementValues: bodyMeasurementValues
};
// console.log('format ---->:', bodyMeasurementValues);
console.log('filter values:', finalValues);
try {
const response = await axiosClientPrivate.post('/patient-measurements', finalValues);
toast.success("Saved Successfully!", {
position: "top-center"
});
console.log('Response:', response.data);
resetForm();
} catch (error) {
console.log(finalValues);
console.error('Error:', error);
}
},
});
// nutrient master
useEffect(() => {
const controller = new AbortController();
const fetchNutrientMasters = async () => {
try {
const response = await axiosClientPrivate.get('/nutrient-masters', { signal: controller.signal });
const items = response.data.content;
// console.log("Nutrient masters:", items);
// const nutrient = {};
// items.forEach(item => {
// nutrient[item.id] = item.nutrientName;
// });
setNutrient(items);
const nutrientpair = {};
items.forEach(item => {
nutrientpair[item.nutrientName] = unitpair[item.unitId];
});
setNutrientpair(nutrientpair);
const nutrient = {};
items.forEach(item => {
nutrient[item.nutrientName] = item.id;
});
// console.log("nutrietn and id pair",nutrient);
setNutrientidpair(nutrient)
} catch (err) {
console.error("Failed to fetch data: ", err);
}
};
fetchNutrientMasters();
return () => {
controller.abort();
};
}, [unitpair,axiosClientPrivate]);
const patientDietFormik = useFormik({
enableReinitialize: true,
initialValues: {
nutrients: nutrient.map(item => ({
nutrientname: item.nutrientName,
nutrientvalue: '',
remark: ''
}))
},
// validationSchema: ExerciseMinuteValidationForm, // if you have a validation schema for this form
onSubmit: async (values, { resetForm }) => {
console.log('not filter values:', values);
const filterednutrients = values.nutrients.filter(item => item.nutrientvalue && item.remark);
const dietPlanDetails = filterednutrients.reduce((acc, param) => {
acc[nutrientidpair[param.nutrientname]] = {
value: parseFloat(param.nutrientvalue),
// unitId: paraunitid[param.measurementname],
remark: param.remark
};
return acc;
}, {});
const finalValues = {
date : getFormattedDate(),
empId: patientid,
dietPlanDetails: dietPlanDetails
};
// console.log('format ---->:', bodyMeasurementValues);
console.log('filter values:', finalValues);
try {
const response = await axiosClientPrivate.post('/patient-diet-plans', finalValues);
toast.success("Saved Successfully!", {
position: "top-center"
});
console.log('Response:', response.data);
resetForm();
} catch (error) {
console.log(values);
console.error('Error:', error);
}
},
});
const switchForm = (formName,id) => {
// alert("patient id "+`${id}`);
// console.log("patient id ",id);
setCurrentForm(formName);
setPatientid(id)
setOpenPopup(true);
};
// const formikProps = currentForm === 'PatientInfoForm' ? patientInfoFormik : exerciseMinuteFormik;
useEffect(() => {
if (currentForm === 'ExerciseMinuteForm') {
setTitle("Patient Exercise Plan");
} else if(currentForm === 'DailyMeasurementForm'){
setTitle("Patient Measurement Plan");
} else if(currentForm === 'PatientDietForm'){
setTitle("Patient Diet Plan");
} else if(currentForm === 'PatientInfoForm'){
setTitle("Patient Master");
}
}, [currentForm]);
let formikProps;
switch (currentForm) {
case 'PatientInfoForm':
formikProps = patientInfoFormik
break;
case 'ExerciseMinuteForm':
formikProps = exerciseMinuteFormik
break;
case 'DailyMeasurementForm':
formikProps = bodyMeasurementFormik
break;
case 'PatientDietForm':
formikProps = patientDietFormik
break;
default:
break;
}
// console.log("fomik",exerciseMinuteFormik);
// console.log("fomik prop",formikProps);
const FormComponent = formComponents[currentForm];
// const handleEdit = async (id) => {
// alert(id);
// try {
// const response = await axiosClientPrivate.get(`/patients/${id}`);
// console.log(response.data);
// setFieldValue("id", response.data.id);
// setFieldValue("selectpatientcategory", response.data.selectpatientcategory);
// setFieldValue("patientName", response.data.patientName);
// setFieldValue("fatherName", response.data.fatherName);
// setFieldValue("dob", response.data.dob);
// setFieldValue("gender", response.data.gender);
// setFieldValue("bloodGroup", response.data.bloodGroup);
// setFieldValue("aadharNo", response.data.aadharNo);
// setFieldValue("primaryPhone", response.data.primaryPhone);
// setFieldValue("village", response.data.village);
// setFieldValue("post", response.data.post);
// setFieldValue("ps", response.data.ps);
// setFieldValue("tehsil", response.data.tehsil);
// setFieldValue("district", response.data.district);
// setFieldValue("state", response.data.state);
// setFieldValue("pinCode", response.data.pinCode);
// setFieldValue("lastModified", response.data.lastModified);
// setFieldValue("modifiedBy", response.data.modifiedBy);
// setId(id);
// setShowupdate(true);
// setOpenPopup(true);
// } catch (error) {
// console.error('Error fetching item for edit:', error);
// }
// };
const handleView = async (id) => {
// alert(id);
try {
const response = await axiosClientPrivate.get(`/patients/${id}`);
console.log(response.data);
patientInfoFormik.setFieldValue("id", response.data.id);
patientInfoFormik.setFieldValue("selectpatientcategory", response.data.selectpatientcategory);
patientInfoFormik.setFieldValue("patientName", response.data.patientName);
patientInfoFormik.setFieldValue("fatherName", response.data.fatherName);
patientInfoFormik.setFieldValue("dob", response.data.dob);
patientInfoFormik.setFieldValue("gender", response.data.gender);
patientInfoFormik.setFieldValue("bloodGroup", response.data.bloodGroup);
patientInfoFormik.setFieldValue("aadharNo", response.data.aadharNo);
patientInfoFormik.setFieldValue("primaryPhone", response.data.primaryPhone);
patientInfoFormik.setFieldValue("village", response.data.village);
patientInfoFormik.setFieldValue("post", response.data.post);
patientInfoFormik.setFieldValue("ps", response.data.ps);
patientInfoFormik.setFieldValue("tehsil", response.data.tehsil);
patientInfoFormik.setFieldValue("district", response.data.district);
patientInfoFormik.setFieldValue("state", response.data.state);
patientInfoFormik.setFieldValue("pinCode", response.data.pinCode);
patientInfoFormik.setFieldValue("lastModified", response.data.lastModified);
patientInfoFormik.setFieldValue("modifiedBy", response.data.modifiedBy);
setId(id);
setViewMode(true);
setOpenPopup(true);
} catch (error) {
console.error('Error fetching item for view:', error);
}
};
const handleUpdate = async (id) => {
// alert(id);
const update = patientInfoFormik.values;
try {
console.log(patientInfoFormik.values);
await axiosClientPrivate.put(`/patients/${id}`, update);
toast.success("Updated Successfully!", {
position: "top-center",
autoClose: 3000,
});
patientInfoFormik.resetForm();
setFetchTrigger(prev => prev + 1);
} catch (err) {
console.log(patientInfoFormik.values);
console.log(err);
}
}
const handleDeleteRow = async (id) => {
// alert(id)
if (window.confirm('Are you sure you want to delete this data?')) {
try {
await axiosClientPrivate.delete(`/patients/${id}`);
setFetchTrigger(prev => prev + 1);
} catch (error) {
console.error('Error deleting row:', error);
}
}
};
const LightTooltip = styled(({ className, ...props }) => (