import { Box, Button, ButtonGroup, Stack } from '@mui/material'; 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 ImportExportRoundedIcon from '@mui/icons-material/ImportExportRounded'; import AddCircleOutlineRoundedIcon from '@mui/icons-material/AddCircleOutlineRounded'; import Popup from './Popup'; import MedFreqForm from './MedFreqForm'; // import { MedValidationForm } from './Validationform'; import { useFormik } from "formik"; // import axios from 'axios'; import PropTypes from "prop-types"; 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 * as Yup from 'yup'; const MedValidationForm = Yup.object({ medicineFrequency: Yup.string().required("Please enter medicine frequency"), frequencyDescription: Yup.string().required("Please enter description"), qty: Yup.string().required("Please enter calculated city"), displayOrder: Yup.string().required("Please enter display order"), }); // new import 'ag-grid-community/styles/ag-grid.css'; import 'ag-grid-community/styles/ag-theme-alpine.css'; // public record MedicineFrequencyDto(Long id, String medicineFrequency, String frequencyDescription, Float qty, String displayOrder, Integer active, Integer isDefault) { const MedFreqList = () => { const [rowData, setRowData] = useState([]); const [colDefs, setColDefs] = useState([]); const [openPopup, setOpenPopup] = useState(false); const axiosClientPrivate = useAxiosPrivate(); const [id,setId] = useState(1); const [showupdate,setShowupdate] = useState(false); const [fetchTrigger, setFetchTrigger] = useState(0); const [paginationPageSize, setPaginationPageSize] = useState(50); const pagination = true; // const paginationPageSize = 50; const paginationPageSizeSelector = [50, 100, 200, 500]; const initialValues = { medicineFrequency:"", frequencyDescription: "", qty:"", displayOrder: "", active:"", isDefault: "" }; const { values, touched, errors, handleBlur, handleChange, setFieldValue, handleSubmit, resetForm } = useFormik({ initialValues: initialValues, validationSchema: MedValidationForm, // onSubmit: (values, action) => { // console.log(values); // action.resetForm(); // }, onSubmit: async (values, {resetForm}) => { try { const response = await axiosClientPrivate.post('/medicine-frequencies', values); toast.success("Saved Successfully!",{ position:"top-center" }); // getting id(key,value) of last index // const id = rowData[rowData.length-1].buId; // const obj = { // buId : id+1, // ...values // } // console.log(obj); // setRowData(rowData => [...rowData, obj]); setFetchTrigger(prev => prev+1); console.log('Response:', response.data); resetForm(); } catch (error) { console.log(values); console.error('Error:', error); } }, }); // const handleDelete = (id)=>{ // // alert("Delete item!") // alert(id); // } // to delete a row const handleDeleteRow = async (id) => { alert(id) if(window.confirm('Are you sure you want to delete this data?')){ try { await axiosClientPrivate.delete(`/medicine-frequencies/${id}`); // setRowData(prevData => prevData.filter(row => row.buId !== id)); setFetchTrigger(prev => prev+1); } catch (error) { console.error('Error deleting row:', error); } } }; const handleEdit = async (id) => { alert(id); try { const response = await axiosClientPrivate.get(`/medicine-frequencies/${id}`); console.log(response.data); setFieldValue("id",response.data.id); setFieldValue("medicineFrequency",response.data.medicineFrequency); setFieldValue("frequencyDescription",response.data.frequencyDescription); setFieldValue("qty",response.data.qty); setFieldValue("displayOrder",response.data.displayOrder); setFieldValue("active",response.data.active); setFieldValue("isDefault",response.data.isDefault); 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 handleUpdate = async (id)=> { alert(id); const update = values; try{ console.log(values); await axiosClientPrivate.put(`/medicine-frequencies/${id}`,update); toast.success("Updated Successfully!",{ position:"top-center", autoClose: 3000, }); resetForm(); // setRowData(rowData => [...rowData,values]); setFetchTrigger(prev => prev+1); } catch(err){ console.log(values); console.log(err); } } const CustomActionComponent = ({id}) => { CustomActionComponent.propTypes = { id: PropTypes.number.isRequired, }; return