ohctechv3/.svn/pristine/36/361c519f950ca1db6ddf9c05eb05546f8c16e14c.svn-base
2024-10-28 15:03:36 +05:30

995 lines
37 KiB
Plaintext

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 }) => (
<Tooltip {...props} classes={{ popper: className }} />
))(({ theme }) => ({
[`& .${tooltipClasses.tooltip}`]: {
backgroundColor: theme.palette.common.white,
color: 'rgba(0, 0, 0, 0.87)',
boxShadow: theme.shadows[1],
fontSize: 11,
},
}));
const CustomActionComponent = ({ id }) => {
const encodedId = btoa(id);
CustomActionComponent.propTypes = {
id: PropTypes.number.isRequired,
};
return <div>
<LightTooltip title="View" placement="top">
<Button onClick={() => handleView(id)}><VisibilityIcon /></Button>
</LightTooltip>
<LightTooltip title="Edit" placement="top">
<Link to={`/PatientAndContact/${id}`}>
<Button ><EditNoteRoundedIcon /></Button>
</Link>
</LightTooltip>
<LightTooltip title="Delete" placement="top">
<Button color="error" onClick={() => handleDeleteRow(id)}><DeleteSweepRoundedIcon /></Button>
</LightTooltip>
<LightTooltip title="Patient Consultation" placement="top">
<Link to={`/DoctorDashboard/${encodedId}`}>
<Button><DashboardIcon/></Button>
</Link>
</LightTooltip>
{/*<LightTooltip title="Patient Measurement plan" placement="top">
<Button onClick={() => switchForm('BodyMeasurementForm',id)} ><SettingsAccessibilityIcon /></Button>
</LightTooltip>
<LightTooltip title="Patient Exercise Plan" placement="top">
<Button onClick={() => switchForm('ExerciseMinuteForm',id)} ><DirectionsRunIcon /></Button>
</LightTooltip>
<LightTooltip title="Patient Diet Plan" placement="top">
<Button onClick={() => switchForm('PatientDietForm',id)} ><RestaurantIcon /></Button>
</LightTooltip>*/}
</div>
};
const pagination = true;
const paginationPageSize = 50;
const paginationPageSizeSelector = [50, 100, 200, 500];
useEffect(() => {
const controller = new AbortController();
const getAllOhc = async () => {
try {
const response = await axiosClientPrivate.get(`/patients?page=0&size=${paginationPageSize}`, { signal: controller.signal });
const items = response.data.content;
console.log("patient info : ",items);
setRowData(items);
if (items.length > 0) {
const headerMappings = {
selectpatientcategory: "Patient Category",
patientName : "Patient Name",
fatherName : "Father Name",
dob : "DOB",
genderchoose : "Gender Choose",
bloodGroup : "Blood Group",
aadharNo : "Aadhar Number",
primaryPhone : "Primary Phone",
village : "Village",
post : "Post",
ps : "PS",
tehsil : "Tehsil",
district : "District",
pinCode : "Pin Code",
emailId : "Email Id",
lastModified : "Last Modified",
modifiedBy : "Modified By",
};
const columns = Object.keys(items[0]).map(key => ({
field: key,
headerName: headerMappings[key] || key.charAt(0).toUpperCase() + key.slice(1),
filter: true,
floatingFilter: true,
sortable: true,
width: key === 'id' ? 100 : undefined,
valueGetter: (params) => {
if (key === 'dob' && params.data.dob) {
const [year, month, day] = params.data.dob.split('-');
return `${day}-${month}-${year}`;
}
return params.data[key];
}
}));
columns.unshift({
field: "Actions", cellRenderer: (params) => {
const id = params.data.id;
return <CustomActionComponent id={id} />
},
width: 300,
});
setColDefs(columns);
}
} catch (err) {
console.error("Failed to fetch data: ", err);
setRowData([]);
}
};
getAllOhc();
return () => {
controller.abort();
};
}, [fetchTrigger,axiosClientPrivate]);
useEffect(() => {
const controller = new AbortController();
const getAllOhc = async () => {
try {
const response = await axiosClientPrivate.get('http://localhost:8080/units', { signal: controller.signal });
const items = response.data.content;
// console.log("units :-",items);
const options = items.map((item)=>{
return {label:item.unitName,value:item.id};
});
setUnit(options);
const unitobj = {};
items.map((item)=>{
unitobj[item.id] = item.unitName;
});
setUnitpair(unitobj);
console.log(unitpair);
} catch (err) {
console.error("Failed to fetch data: ", err);
}
};
getAllOhc();
return () => {
controller.abort();
};
}, []);
// measurements
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("measurment name :-",items);
// const newDiagnosisMap = new Map();
// items.forEach(item => newDiagnosisMap.set(item.ailmentSysName, item.id));
// setBodysystem(newDiagnosisMap);
// console.log(diagnosisMap.size);
// const ailment = items.map((item)=>{
// // diagnosisMap.set(item.id,item.ailmentSysName);
// return item.ailmentSysName;
// });
// const options = items.map((item)=>{
// return {label:item.unitName,value:item.id};
// });
// setUnit(options);
const para = {};
items.map((item)=>{
para[item.bmName] = unitpair[item.unitId];
});
setBodyparameterpair(para);
console.log("main pppppp",para);
} catch (err) {
console.error("Failed to fetch data: ", err);
}
};
getAllOhc();
return () => {
controller.abort();
};
}, [unitpair,axiosClientPrivate]);
const exportpdf = async () => {
const doc = new jsPDF();
const header = [['id', 'pname', "fhname", "date", "genderchoose", "blood", "aadhar", "phone", "village", "post", "ps", "tehsil", "district", "state", "pin"]];
const tableData = rowData.map(item => [
item.id,
// item.selectpatientcategory,
item.patientName,
item.fatherName,
item.dob,
item.gender,
item.bloodGroup,
item.aadharNo,
item.primaryPhone,
item.village,
item.post,
item.ps,
item.tehsil,
item.district,
item.state,
item.pinCode,
]);
doc.autoTable({
head: header,
body: tableData,
startY: 20,
theme: 'grid',
margin: { top: 30 },
styles: { fontSize: 5 },
columnStyles: { 0: { cellWidth: 'auto' }, 1: { cellWidth: 'auto' } }
// columnStyles: {
// 0: { cellWidth: 5 }, // id
// 2: { cellWidth: 20 }, // pname
// 3: { cellWidth: 20 }, // fhname
// 4: { cellWidth: 15 }, // date
// 5: { cellWidth: 20 }, // genderchoose
// 6: { cellWidth: 5 }, // blood
// 7: { cellWidth: 25 }, // aadhar
// 8: { cellWidth: 15 }, // phone
// 9: { cellWidth: 15 }, // village
// 10: { cellWidth: 25 }, // post
// 11: { cellWidth: 25 }, // ps
// 12: { cellWidth: 15 }, // tehsil
// 13: { cellWidth: 15 }, // district
// 14: { cellWidth: 25 }, // state
// // 15: { cellWidth: 15 } // pin
// }
});
doc.save("PatientList.pdf");
};
const exportExcelfile = async () => {
const workbook = new ExcelJS.Workbook();
const sheet = workbook.addWorksheet('My Sheet');
const headerStyle = {
alignment: { horizontal: 'center' }
};
sheet.getRow(1).font = { bold: true };
const columnWidths = {
id: 10,
// selectpatientcategory: 20,
patientName: 20,
fatherName: 20,
dob: 20,
gender: 20,
bloodGroup: 20,
aadharNo: 20,
primaryPhone: 20,
village: 20,
post: 20,
ps: 20,
tehsil: 20,
district: 20,
state: 20,
pinCode: 20,
};
sheet.columns = [
{ header: "id", key: 'id', width: columnWidths.id, style: headerStyle },
// { header: "selectpatientcategory", key: 'cpname', width: columnWidths.cpname, style: headerStyle },
{ header: "pname", key: 'patientName', width: columnWidths.patientName, style: headerStyle },
{ header: "fhname", key: 'fatherName', width: columnWidths.fatherName, style: headerStyle },
{ header: "date", key: 'dob', width: columnWidths.dob, style: headerStyle },
{ header: "genderchoose", key: 'gender', width: columnWidths.gender, style: headerStyle },
{ header: "blood", key: 'bloodGroup', width: columnWidths.bloodGroup, style: headerStyle },
{ header: "aadhar", key: 'aadharNo', width: columnWidths.aadharNo, style: headerStyle },
{ header: "phone", key: 'primaryPhone', width: columnWidths.primaryPhone, style: headerStyle },
{ header: "village", key: 'village', width: columnWidths.village, style: headerStyle },
{ header: "post", key: 'post', width: columnWidths.post, style: headerStyle },
{ header: "ps", key: 'ps', width: columnWidths.ps, style: headerStyle },
{ header: "tehsil", key: 'tehsil', width: columnWidths.tehsil, style: headerStyle },
{ header: "district", key: 'district', width: columnWidths.district, style: headerStyle },
{ header: "state", key: 'state', width: columnWidths.state, style: headerStyle },
{ header: "pin", key: 'pinCode', width: columnWidths.pinCode, style: headerStyle },
];
rowData.map(product => {
sheet.addRow({
id: product.id,
// selectpatientcategory: product.selectpatientcategory,
patientName: product.patientName,
fatherName: product.fatherName,
dob: product.dob,
gender: product.gender,
bloodGroup: product.bloodGroup,
aadharNo: product.aadharNo,
primaryPhone: product.primaryPhone,
village: product.village,
post: product.post,
ps: product.ps,
tehsil: product.tehsil,
district: product.district,
state: product.state,
pinCode: product.pinCode,
})
});
workbook.xlsx.writeBuffer().then(data => {
const blob = new Blob([data], {
type: "application/vnd.openxmlformats-officedocument.spreadsheet.sheet",
});
const url = window.URL.createObjectURL(blob);
const anchor = document.createElement('a');
anchor.href = url;
anchor.download = 'PatientList.xlsx';
anchor.click();
})
}
return (
<>
<ToastContainer />
<Box
className="ag-theme-quartz"
// style={{ height: 500 }}
style={{ height: "78vh" }}
>
<Stack sx={{ display: 'flex', flexDirection: 'row' }} marginY={1} paddingX={1}>
<ButtonGroup variant="contained" aria-label="Basic button group">
<Button variant="contained" endIcon={<AddCircleOutlineRoundedIcon />} onClick={() => switchForm('PatientInfoForm')} >Add New</Button>
<Button variant="contained" onClick={exportpdf} color="success" endIcon={<PictureAsPdfIcon />}>PDF</Button>
<Button variant="contained" onClick={() => exportExcelfile()} color="success" endIcon={<DownloadIcon />}>Excel</Button>
</ButtonGroup>
</Stack>
<Box
// className="ag-theme-alpine"
style={{
height: '100%', // Set the height
width: '100%' // Set the width
}}
>
<AgGridReact
rowData={rowData}
columnDefs={colDefs}
animateRows={true}
pagination={pagination}
paginationPageSize={paginationPageSize}
paginationPageSizeSelector={paginationPageSizeSelector}
/>
</Box>
</Box>
<Popup showupdate={showupdate} id={id} handleUpdate={handleUpdate} setShowupdate={setShowupdate} resetForm={formikProps.resetForm} handleSubmit={formikProps.handleSubmit} openPopup={openPopup} setOpenPopup={setOpenPopup} title={titlle} viewMode={viewMode} setViewMode={setViewMode}>
<FormComponent unit={unit} nutrientpair={nutrientpair} bodyparameterpair={bodyparameterpair} exerciseMinuteFormik={exerciseMinuteFormik} nutrient={nutrient} bodyparams={bodyparams} exercises={exercises} values={formikProps.values} touched={formikProps.touched} errors={formikProps.errors} handleBlur={formikProps.handleBlur} handleChange={formikProps.handleChange} setFieldValue={formikProps.setFieldValue} handleSubmit={formikProps.handleSubmit} viewMode={viewMode} />
{/*{currentForm === 'patientInfo' && (
<PatientInfoForm PatientInfoForm
values={values}
touched={touched}
errors={errors}
handleBlur={handleBlur}
handleChange={handleChange}
setFieldValue={setFieldValue}
handleSubmit={handleSubmit}
viewMode={viewMode}
/>
)}
{currentForm === 'exerciseplan' && (
<ExerciseMinuteList
values={values}
touched={touched}
errors={errors}
handleBlur={handleBlur}
handleChange={handleChange}
setFieldValue={setFieldValue}
handleSubmit={handleSubmit}
viewMode={viewMode}
/>
)}
{currentForm === 'measurementplan' && (
<BodyMeasurementList
values={values}
touched={touched}
errors={errors}
handleBlur={handleBlur}
handleChange={handleChange}
setFieldValue={setFieldValue}
handleSubmit={handleSubmit}
viewMode={viewMode}
/>
)}*/}
</Popup>
</>
);
};
export default PatientList;