GRAB X APOTEK X Hospital PORTAL
This commit is contained in:
ivan-sim
@@ -25,5 +25,5 @@ export default function Logo({ disabledLink = false, sx }: Props) {
|
||||
return <>{logo}</>;
|
||||
}
|
||||
|
||||
return <RouterLink to="/">{logo}</RouterLink>;
|
||||
return <RouterLink to="#">{logo}</RouterLink>;
|
||||
}
|
||||
|
||||
@@ -24,12 +24,21 @@ import {
|
||||
Typography,
|
||||
LinearProgress,
|
||||
linearProgressClasses,
|
||||
Collapse,
|
||||
Divider,
|
||||
IconButton,
|
||||
Modal,
|
||||
CircularProgress
|
||||
} from '@mui/material';
|
||||
|
||||
import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
|
||||
import { visuallyHidden } from '@mui/utils';
|
||||
|
||||
import { DatePicker, LocalizationProvider, MobileDatePicker } from '@mui/x-date-pickers';
|
||||
|
||||
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
||||
|
||||
import { fDate, fDateSuffix, fDateTime, fDateTimeWithAge } from '../utils/formatTime';
|
||||
/* ---------------------------------- axios --------------------------------- */
|
||||
import axios from '../utils/axios';
|
||||
/* ---------------------------------- react --------------------------------- */
|
||||
@@ -50,6 +59,10 @@ import GetAppIcon from '@mui/icons-material/GetApp';
|
||||
import { LanguageContext } from '@/contexts/LanguageContext';
|
||||
import CancelIcon from '@mui/icons-material/Cancel';
|
||||
import CheckCircleIcon from '@mui/icons-material/CheckCircle';
|
||||
import CloseIcon from '@mui/icons-material/Close';
|
||||
import InfoIcon from '@mui/icons-material/Info';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import useAuth from '@/hooks/useAuth';
|
||||
|
||||
/* --------------------------------- styled --------------------------------- */
|
||||
const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({
|
||||
@@ -79,6 +92,9 @@ export default function Table<T>({
|
||||
searchs,
|
||||
exportReport,
|
||||
selected,
|
||||
openRowId, // Receive the currently opened row ID
|
||||
setOpenRowId, // Receive the function to set the opened row ID
|
||||
reloadData,
|
||||
}: TableListProps<T>) {
|
||||
/* ------------------------------- handle sort ------------------------------ */
|
||||
const handleRequestSort = async (event: React.MouseEvent<unknown>, property: string) => {
|
||||
@@ -209,6 +225,114 @@ export default function Table<T>({
|
||||
params.setAppliedParams(parameters);
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
//============================== APOTEK =======================================//
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.role.name;
|
||||
// List of statuses for 'apotek'
|
||||
const allowedStatusesForApotek = ['waiting_pharmacy', 'order_prepared'];
|
||||
const allowedStatusesForCSLMS = ['ready', 'waiting_for_courir', 'package_picked_up', 'package_on_delivery'];
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const handleClick = () => {
|
||||
// handleClickKonfirmasi(row); // Call the function passed from parent
|
||||
setOpen(true); // Show modal
|
||||
setLoading(true); // Show loading animation
|
||||
|
||||
// Simulate finding driver (3 seconds delay)
|
||||
setTimeout(() => {
|
||||
setLoading(false); // Hide loading after 3 seconds
|
||||
}, 3000);
|
||||
};
|
||||
|
||||
|
||||
|
||||
const [openDialogStatus, setOpenDialogStatus] = useState(false);
|
||||
const [dialogIDRow, setDialogIDRow] = useState<number | null>(null);
|
||||
const [dialogIDRowDriver, setDialogIDRowDriver] = useState<number | null>(null);
|
||||
const [txtStatusDriver, setTxtStatusDriver] = useState('');
|
||||
const [txtIDDriver, setTxtIDDriver] = useState('');
|
||||
const handleClose = (row:any) => {
|
||||
setDialogIDRowDriver(row.id === dialogIDRowDriver ? null : row.id);
|
||||
if (reloadData) {
|
||||
reloadData();
|
||||
}
|
||||
};
|
||||
const handleCloseDialogUpdate = () => {
|
||||
setOpenDialogStatus(false);
|
||||
}
|
||||
const handleEditDataStatus = (data: any) => {
|
||||
setOpenDialogStatus(true);
|
||||
}
|
||||
const [isDisabled, setIsDisabled] = useState(false);
|
||||
const handleClickKonfirmasi = (row: any) => {
|
||||
setTxtStatusDriver('');
|
||||
setTxtIDDriver('');
|
||||
if(row.sStatus === 'ready')
|
||||
{
|
||||
//close
|
||||
setDialogIDRow(row.id === dialogIDRow ? null : row.id);
|
||||
//get driver
|
||||
setDialogIDRowDriver(row.id === dialogIDRowDriver ? null : row.id);
|
||||
// setOpen(true); // Show modal
|
||||
setLoading(true); // Show loading animation
|
||||
|
||||
// Simulate finding driver (3 seconds delay)
|
||||
// setTimeout(() => {
|
||||
// setLoading(false); // Hide loading after 3 seconds
|
||||
// }, 3000);
|
||||
|
||||
const updateData = {
|
||||
sStatus: row.sStatus
|
||||
};
|
||||
|
||||
axios
|
||||
.put(`/put-driver-prescription-orders/${row.nID_orders}`, updateData)
|
||||
.then((response) => {
|
||||
setTxtStatusDriver(response?.data?.data?.status);
|
||||
setTxtIDDriver(response?.data?.data?.deliveryID);
|
||||
setLoading(false);
|
||||
// enqueueSnackbar(response?.data?.meta?.message, { variant: 'success' });
|
||||
|
||||
// Call reloadData to refresh the table
|
||||
|
||||
})
|
||||
.catch((error) => {
|
||||
const errorMessage = error.response?.data?.meta?.message || 'Failed to update status';
|
||||
enqueueSnackbar(errorMessage, { variant: 'error' });
|
||||
setLoading(false);
|
||||
setIsDisabled(false); // Re-enable the button after success
|
||||
});
|
||||
}
|
||||
else
|
||||
{
|
||||
putPrescriptionOrders(row);
|
||||
}
|
||||
}
|
||||
const putPrescriptionOrders = (row: any) => {
|
||||
setIsDisabled(true); // Disable button after clicking
|
||||
const updateData = {
|
||||
sStatus: row.sStatus
|
||||
};
|
||||
axios
|
||||
.put(`/put-prescription-orders/${row.nID_orders}`, updateData)
|
||||
.then((response) => {
|
||||
enqueueSnackbar(response?.data?.meta?.message, { variant: 'success' });
|
||||
setDialogIDRow(row.id === dialogIDRow ? null : row.id);
|
||||
setIsDisabled(false); // Re-enable the button after success
|
||||
|
||||
// Call reloadData to refresh the table
|
||||
if (reloadData) {
|
||||
reloadData();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
const errorMessage = error.response?.data?.meta?.message || 'Failed to update status';
|
||||
enqueueSnackbar(errorMessage, { variant: 'error' });
|
||||
setIsDisabled(false); // Re-enable the button after success
|
||||
});
|
||||
}
|
||||
return (
|
||||
// <Card>
|
||||
<Grid container>
|
||||
@@ -416,6 +540,7 @@ export default function Table<T>({
|
||||
</TableRow>
|
||||
) : rows && rows.length >= 1 ? (
|
||||
rows.map((row, rowIndex) => (
|
||||
<>
|
||||
<TableRow key={rowIndex}>
|
||||
{!selected.useSelected ? (
|
||||
''
|
||||
@@ -440,6 +565,378 @@ export default function Table<T>({
|
||||
</TableCell>
|
||||
))}
|
||||
</TableRow>
|
||||
{/* COLLAPSIBLE ROW */}
|
||||
<TableRow
|
||||
sx={{ cursor: 'pointer' }} // Use pointer cursor always, or conditionally based on your preference
|
||||
>
|
||||
<TableCell colSpan={6}>
|
||||
<Collapse in={openRowId === row.id} timeout="auto" unmountOnExit>
|
||||
<Card sx={{padding:2}}>
|
||||
{/* Icon inside a Box for spacing and alignment */}
|
||||
<Stack direction="row" padding={2} justifyContent="space-between" alignItems="center">
|
||||
<Stack direction="row">
|
||||
<Box sx={{ display: 'flex', alignItems: 'center', marginRight: 1 }}>
|
||||
<InfoIcon sx={{ color: row.sStatus == 'waiting_pharmacy' ? '#D3D3D3' : '#00E676', fontSize: 24 }} /> {/* Adjust size and color */}
|
||||
</Box>
|
||||
<Typography variant='subtitle2' sx={{ color: '#00E676' }}>
|
||||
{row.status}
|
||||
</Typography>
|
||||
</Stack>
|
||||
|
||||
{row.nDeliveryID && (
|
||||
<Box sx={{ ml: 'auto' }}>
|
||||
<Typography variant='subtitle2'>
|
||||
Grab Delivery ID: {row.nDeliveryID}
|
||||
</Typography>
|
||||
</Box>
|
||||
)}
|
||||
</Stack>
|
||||
|
||||
<Box onClick={() => {setOpenRowId(openRowId === row.id ? null : row.id);}} sx={{ padding: '20px', maxWidth: '1200px', margin: '0 auto', backgroundColor: '#ffffff', borderRadius: '8px' }}>
|
||||
<Grid container spacing={2}>
|
||||
|
||||
{/* Row 1 */}
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtProviderDoctorInformation}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNamaDokter} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.nama_dokter}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtSpesialisasiDokter} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.spesialis}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">SIP :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.sip}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNoPonsel} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.no_ponsel_dokter}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtInformasiPasien}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNamaPasien} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.pasien}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTanggalLahirUmur} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.tgl_lahir_pasien ? fDateTimeWithAge(row.tgl_lahir_pasien) : ''}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtJenisKelamin} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.jenis_kelamin_pasien}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTinggi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.tinggi_berat}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
{/* Divider */}
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtInformasiAsuransi}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNomorKartu} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.no_polis}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtAsuransi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.perusahaan_asuransi}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtPerusahaan} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.nama_perusahaan}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTipeAsuransi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.kode_produk}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtKelasAsuransi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.kelas_asuransi}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTipeMember} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.tipe_member}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtInformasiOrder}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNamaPenerima} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.pasien}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtAlamatPenerima} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.alamat_penerima}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtPengiriman} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.pengiriman}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTotal} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.total_kirim}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
{/* Divider */}
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
|
||||
{/* Row 2 */}
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtInformasiResep}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNomorResep} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.no_resep}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNomorRefDokter} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.noref_dokter}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTanggalTerbitResep} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.tanggal}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTanggalKedaluwarsa} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.valid_tanggal}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
<Grid item xs={12} md={6}>
|
||||
<Typography variant="h6" fontWeight="bold">{localeData.txtInformasiKonsultasi}</Typography>
|
||||
<Grid container>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtNomorPenjamin} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.nomor_penjamin}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtTanggalKonsultasi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.tgl_livechat}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtAlergi} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.alergi_desc}</strong></Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2">{localeData.txtDiagnosis} :</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant="body2"><strong>{row.diagnosa}</strong></Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
</Grid>
|
||||
</Box>
|
||||
|
||||
<Box onClick={() => {setOpenRowId(openRowId === row.id ? null : row.id);}} sx={{ padding: '20px', maxWidth: '1200px', margin: '20px auto', backgroundColor: '#ffffff', borderRadius: '8px' }}>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell>{localeData.txtObat}</TableCell>
|
||||
<TableCell align="left">{localeData.txtSigna}</TableCell>
|
||||
<TableCell align="left">{localeData.txtWaktu}</TableCell>
|
||||
<TableCell align="left">{localeData.txtDurasi}</TableCell>
|
||||
<TableCell align="left">{localeData.txtJumlah}</TableCell>
|
||||
<TableCell align="left">{localeData.txtCatatanObat}</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
{row.prescription_items ?
|
||||
(
|
||||
row.prescription_items.map((row : any, rowIndex: any) => (
|
||||
<TableRow key={rowIndex}>
|
||||
<TableCell>{row.sItemName}</TableCell>
|
||||
<TableCell align="left">{row.sSigna}</TableCell>
|
||||
<TableCell align="left">{row.sTiming}</TableCell>
|
||||
<TableCell align="left">{row.sDuration}</TableCell>
|
||||
<TableCell align="left">{row.nQty}</TableCell>
|
||||
<TableCell align="left">{row.sNote}</TableCell>
|
||||
</TableRow>
|
||||
))
|
||||
) : (
|
||||
<TableRow>
|
||||
<TableCell colSpan={headCells?.length} align="center">
|
||||
{localeData.txtDataNotFound}
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)}
|
||||
</TableBody>
|
||||
</Box>
|
||||
|
||||
<Box sx={{ display: 'flex', justifyContent: 'space-between', padding: '20px', maxWidth: '1200px', margin: '0 auto' }}>
|
||||
{/* Close Button on the Left */}
|
||||
<Button variant="outlined" color="inherit" onClick={() => setOpenRowId(null)}>
|
||||
{localeData.txtButtonClose}
|
||||
</Button>
|
||||
{/* Accept Button on the Right */}
|
||||
{row.button_accept && formattedRoleName === 'admin-apotek' && allowedStatusesForApotek.includes(row.sStatus) ? (
|
||||
<Button variant="contained" color="primary" onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
{row.button_accept}
|
||||
</Button>
|
||||
) : ''}
|
||||
{row.button_accept && formattedRoleName === 'cs-lms' && allowedStatusesForCSLMS.includes(row.sStatus) ? (
|
||||
<Button variant="contained" color="primary" onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
{row.button_accept}
|
||||
</Button>
|
||||
) : ''}
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
{/* Dialog Update Status */}
|
||||
<Dialog open={dialogIDRow === row.id} fullWidth={true}>
|
||||
<DialogTitle sx={{ backgroundColor: '#19BBBB', color: '#FFF', padding: 2 }}>
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between">
|
||||
<Stack direction="row" alignItems='center' spacing={1}>
|
||||
<Typography variant="h6">{localeData.txtConfirmation}</Typography>
|
||||
</Stack>
|
||||
<IconButton sx={{ color: '#FFF' }} onClick={() => setDialogIDRow(row.id === dialogIDRow ? null : row.id)}>
|
||||
<CloseIcon />
|
||||
</IconButton>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
<Stack spacing={2} padding={2}>
|
||||
<Typography variant='body1'>{localeData.txtDialogConfirmation}</Typography>
|
||||
<Card sx={{padding:2}} >
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtNomorResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.no_resep}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '50%'}}>{localeData.txtTanggalTerbitResep}</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '50%'}}>{row.tanggal}</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button sx={{backgroundColor: '#19BBBB'}} variant="contained" onClick={() => handleClickKonfirmasi(row)} disabled={isDisabled}>{localeData.txtOK}</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
{/* Modal for fullscreen display */}
|
||||
<Modal open={dialogIDRowDriver === row.id} onClose={() => handleClose(row)}>
|
||||
<Box
|
||||
sx={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh',
|
||||
// backgroundColor: 'rgba(0, 0, 0, 0.8)', // semi-transparent background
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
}}
|
||||
>
|
||||
{loading ? (
|
||||
<>
|
||||
<CircularProgress color="inherit" />
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{localeData.txtFindingDriver}
|
||||
</Typography>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Typography variant="h4">Info!</Typography>
|
||||
<Typography variant="h6" sx={{ mt: 2 }}>
|
||||
{txtIDDriver ? (
|
||||
`${localeData.txtDriverFound} ${txtIDDriver} status ${txtStatusDriver}.`
|
||||
) : (
|
||||
// You can add an alternative UI or message here, or leave it empty
|
||||
`Failed to get driver, please check the message info.`
|
||||
)}
|
||||
|
||||
|
||||
</Typography>
|
||||
<Button
|
||||
sx={{ mt: 4, backgroundColor: '#19BBBB' }}
|
||||
variant="contained"
|
||||
onClick={() => handleClose(row)}
|
||||
>
|
||||
{localeData.txtOK}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Box>
|
||||
</Modal>
|
||||
</Card>
|
||||
</Collapse>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</>
|
||||
))
|
||||
) : (
|
||||
<TableRow>
|
||||
|
||||
@@ -28,26 +28,42 @@ export default function NavSectionVertical({
|
||||
isCollapse = false,
|
||||
...other
|
||||
}: NavSectionProps) {
|
||||
return (
|
||||
<Box {...other}>
|
||||
{navConfig.map((group, index) => (
|
||||
<List key={index} disablePadding sx={{ px: 2 }}>
|
||||
<ListSubheaderStyle
|
||||
key={index}
|
||||
sx={{
|
||||
...(isCollapse && {
|
||||
opacity: 0,
|
||||
}),
|
||||
}}
|
||||
>
|
||||
{group.subheader}
|
||||
</ListSubheaderStyle>
|
||||
return (
|
||||
<Box {...other}>
|
||||
{navConfig.length === 0 ? ( // Check if navConfig is empty
|
||||
<List disablePadding sx={{ px: 2, display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>
|
||||
<ListSubheaderStyle
|
||||
sx={{
|
||||
...(isCollapse && {
|
||||
opacity: 0,
|
||||
}),
|
||||
}}
|
||||
>
|
||||
{/* Optional: You can put a title or leave it empty */}
|
||||
</ListSubheaderStyle>
|
||||
|
||||
<div style={{ textAlign: 'center', marginTop: '50px' }}>Loading...</div> {/* Adjust marginTop as needed */}
|
||||
</List>
|
||||
) : (
|
||||
navConfig.map((group, index) => (
|
||||
<List key={index} disablePadding sx={{ px: 2 }}>
|
||||
<ListSubheaderStyle
|
||||
sx={{
|
||||
...(isCollapse && {
|
||||
opacity: 0,
|
||||
}),
|
||||
}}
|
||||
>
|
||||
{group.subheader}
|
||||
</ListSubheaderStyle>
|
||||
|
||||
{group.items.map((list) => (
|
||||
<NavListRoot key={list.title} list={list} isCollapse={isCollapse} />
|
||||
))}
|
||||
</List>
|
||||
))
|
||||
)}
|
||||
</Box>
|
||||
);
|
||||
|
||||
{group.items.map((list) => (
|
||||
<NavListRoot key={list.title} list={list} isCollapse={isCollapse} />
|
||||
))}
|
||||
</List>
|
||||
))}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -13,8 +13,14 @@ type GuestGuardProps = {
|
||||
|
||||
export default function GuestGuard({ children }: GuestGuardProps) {
|
||||
const { isAuthenticated } = useAuth();
|
||||
|
||||
if (isAuthenticated) {
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.role.name;
|
||||
if((formattedRoleName === 'admin-apotek' || formattedRoleName === 'cs-lms') && isAuthenticated)
|
||||
{
|
||||
return <Navigate to={'/prescription-orders'} replace={true}/>;
|
||||
}
|
||||
if(formattedRoleName === 'hospital-admin)
|
||||
{
|
||||
return <Navigate to={'/dashboard'} replace={true}/>;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
import { ReactNode } from 'react';
|
||||
import { Container, Alert, AlertTitle } from '@mui/material';
|
||||
import useAuth from '@/hooks/useAuth';
|
||||
import Page404 from '@/pages/Page404';
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
@@ -9,9 +11,10 @@ type RoleBasedGuardProp = {
|
||||
};
|
||||
|
||||
const useCurrentRole = () => {
|
||||
// Logic here to get current user role
|
||||
const role = 'admin';
|
||||
return role;
|
||||
// Fetch the role from useAuth
|
||||
const { user } = useAuth();
|
||||
const formattedRoleName = user?.role.name || ''; // Default to empty string if role is undefined
|
||||
return formattedRoleName;
|
||||
};
|
||||
|
||||
export default function RoleBasedGuard({ accessibleRoles, children }: RoleBasedGuardProp) {
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"greeting": "Hello",
|
||||
"buttonText": "Click Me",
|
||||
"infoLogin": "Enter the registered account",
|
||||
"txtLogin1" : "Sign in to Hospital Portal",
|
||||
"txtLogin1" : "Sign in",
|
||||
"txtLogin2" : "Enter your details below",
|
||||
"txtCardSearchMember1" : "Membership Query",
|
||||
"txtCardSearchMember2" : "Search Member",
|
||||
@@ -28,7 +28,7 @@
|
||||
"txtRequestCode" : "Request Code",
|
||||
"txtName" : "Name",
|
||||
"txtStatus" : "Status",
|
||||
"txtSearch" : "Search Name or Member ID...",
|
||||
"txtSearch" : "Search...",
|
||||
"txtAll" : "All",
|
||||
"txtSubmissionDate" : "Admission Date",
|
||||
"txtDataNotFound" : "Data Not Found",
|
||||
@@ -77,6 +77,62 @@
|
||||
"txtSecond": "Second",
|
||||
"txtPleaseInput": "Please enter your new password.",
|
||||
"txtNewPassword": "New Password",
|
||||
"txtConfPassword": "Confirm Kata Sandi"
|
||||
"txtConfPassword": "Confirm Kata Sandi",
|
||||
"txtPrescriptionNumber" : "Prescription Number",
|
||||
"txtPrescriptionDate" : "Date",
|
||||
"txtPrescriptionPatient" : "Patient",
|
||||
"txtPrescriptionPharmacy" : "Pharmacy",
|
||||
"txtPrescriptionDetail" : "Detail",
|
||||
"txtPrescriptionDownload" : "Download Prescription",
|
||||
"txtProviderDoctorInformation" : "Provider & Doctor Information",
|
||||
"txtInformasiPasien" : "Patient Information",
|
||||
"txtNamaDokter" : "Doctor's Name",
|
||||
"txtSpesialisasiDokter" : "Doctor's Specialization",
|
||||
"txtNoPonsel" : "Mobile No.",
|
||||
"txtInformasiAsuransi": "Insurance Information",
|
||||
"txtNomorKartu": "Card Number",
|
||||
"txtAsuransi": "Insurance",
|
||||
"txtPerusahaan": "Company",
|
||||
"txtTipeAsuransi": "Insurance Type",
|
||||
"txtKelasAsuransi": "Insurance Class",
|
||||
"txtTipeMember": "Member Type",
|
||||
"txtInformasiOrder": "Order Information",
|
||||
"txtNamaPenerima": "Recipient Name",
|
||||
"txtAlamatPenerima": "Recipient Address",
|
||||
"txtPengiriman": "Delivery",
|
||||
"txtTotal": "Total",
|
||||
"txtInformasiResep": "Prescription Information",
|
||||
"txtNomorResep": "Prescription Number",
|
||||
"txtNomorRefDokter": "Doctor's Reference Number",
|
||||
"txtTanggalTerbitResep": "Prescription Issue Date",
|
||||
"txtTanggalKedaluwarsa": "Expiration Date",
|
||||
"txtInformasiKonsultasi": "Consultation Information",
|
||||
"txtNomorPenjamin": "Guarantor Number",
|
||||
"txtTanggalKonsultasi": "Consultation Date",
|
||||
"txtAlergi": "Allergy",
|
||||
"txtDiagnosis": "Diagnosis",
|
||||
"txtObat": "Medicine",
|
||||
"txtSigna": "Signa",
|
||||
"txtWaktu": "Time",
|
||||
"txtDurasi": "Duration",
|
||||
"txtJumlah": "Quantity",
|
||||
"txtCatatanObat": "Medicine Notes",
|
||||
"txtDiterima": "Received",
|
||||
"txtNamaPasien": "Patient Name",
|
||||
"txtTanggalLahirUmur": "Date of Birth / Age",
|
||||
"txtJenisKelamin": "Gender",
|
||||
"txtTinggi" : "Height / Weight",
|
||||
"txtLabelNew": "New",
|
||||
"txtLabelAccepted": "Accepted",
|
||||
"txtLabelReady": "Ready",
|
||||
"txtLabelWaitingCourir": "Waiting Courir",
|
||||
"txtLabelPackagePickedUp": "Package Picked Up",
|
||||
"txtLabelPackageOnDelivery": "Package On Delivery",
|
||||
"txtLabelPackageDelivered": "Package Delivered",
|
||||
"txtLabelWaitingForPayment": "Waiting For Payment",
|
||||
"txtOK": "Yes",
|
||||
"txtFindingDriver": "Finding a driver...",
|
||||
"txtDriverFound": "The driver’s been grabbed with the ID",
|
||||
"txtButtonClose": "Close"
|
||||
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"greeting": "Halo",
|
||||
"buttonText": "Klik Saya",
|
||||
"infoLogin": "Masukan akun yang telah terdaftar",
|
||||
"txtLogin1" : "Masuk ke Hospital Portal",
|
||||
"txtLogin1" : "Sign in",
|
||||
"txtLogin2" : "Masukkan detail Anda di bawah ini",
|
||||
"txtCardSearchMember1" : "Pengajuan Jaminan",
|
||||
"txtCardSearchMember2" : "Cari Anggota",
|
||||
@@ -28,7 +28,7 @@
|
||||
"txtRequestCode" : "Kode Pengajuan",
|
||||
"txtName" : "Nama",
|
||||
"txtStatus" : "Status",
|
||||
"txtSearch" : "Cari Nama atau ID Anggota...",
|
||||
"txtSearch" : "Cari...",
|
||||
"txtAll" : "Semua",
|
||||
"txtSubmissionDate" : "Tanggal Masuk",
|
||||
"txtDataNotFound" : "Data Tidak Ditemukan",
|
||||
@@ -77,5 +77,61 @@
|
||||
"txtSecond": "Detik",
|
||||
"txtPleaseInput": "Mohon masukan kata sandi baru Anda.",
|
||||
"txtNewPassword": "Kata Sandi Baru",
|
||||
"txtConfPassword": "Konfirmasi Kata Sandi"
|
||||
"txtConfPassword": "Konfirmasi Kata Sandi",
|
||||
"txtPrescriptionNumber" : "No Resep",
|
||||
"txtPrescriptionDate" : "Tanggal",
|
||||
"txtPrescriptionPatient" : "Pasien",
|
||||
"txtPrescriptionPharmacy" : "Apotek",
|
||||
"txtPrescriptionDetail" : "Detail",
|
||||
"txtPrescriptionDownload" : "Download Resep",
|
||||
"txtProviderDoctorInformation" : "Informasi Provider & Dokter",
|
||||
"txtInformasiPasien" : "Informasi Pasien",
|
||||
"txtNamaDokter" : "Nama Dokter",
|
||||
"txtSpesialisasiDokter" : "Spesialisasi Dokter",
|
||||
"txtNoPonsel" : "No Ponsel",
|
||||
"txtInformasiAsuransi": "Informasi Asuransi",
|
||||
"txtNomorKartu": "Nomor Kartu",
|
||||
"txtAsuransi": "Asuransi",
|
||||
"txtPerusahaan": "Perusahaan",
|
||||
"txtTipeAsuransi": "Tipe Asuransi",
|
||||
"txtKelasAsuransi": "Kelas Asuransi",
|
||||
"txtTipeMember": "Tipe Member",
|
||||
"txtInformasiOrder": "Informasi Order",
|
||||
"txtNamaPenerima": "Nama Penerima",
|
||||
"txtAlamatPenerima": "Alamat Penerima",
|
||||
"txtPengiriman": "Pengiriman",
|
||||
"txtTotal": "Total",
|
||||
"txtInformasiResep": "Informasi Resep",
|
||||
"txtNomorResep": "Nomor Resep",
|
||||
"txtNomorRefDokter": "Nomor Ref Dokter",
|
||||
"txtTanggalTerbitResep": "Tanggal Terbit Resep",
|
||||
"txtTanggalKedaluwarsa": "Tanggal Kedaluwarsa",
|
||||
"txtInformasiKonsultasi": "Informasi Konsultasi",
|
||||
"txtNomorPenjamin": "Nomor Penjamin",
|
||||
"txtTanggalKonsultasi": "Tanggal Konsultasi",
|
||||
"txtAlergi": "Alergi",
|
||||
"txtDiagnosis": "Diagnosis",
|
||||
"txtObat": "Obat",
|
||||
"txtSigna": "Signa",
|
||||
"txtWaktu": "Waktu",
|
||||
"txtDurasi": "Durasi",
|
||||
"txtJumlah": "Jumlah",
|
||||
"txtCatatanObat": "Catatan Obat",
|
||||
"txtDiterima": "Diterima",
|
||||
"txtNamaPasien": "Nama Pasien",
|
||||
"txtTanggalLahirUmur": "Tanggal Lahir / Umur",
|
||||
"txtJenisKelamin": "Jenis Kelamin",
|
||||
"txtTinggi" : "Tinggi / Berat",
|
||||
"txtLabelNew": "Baru",
|
||||
"txtLabelAccepted": "Diterima Apotek",
|
||||
"txtLabelReady": "Pesanan Siap Diambil",
|
||||
"txtLabelWaitingCourir": "Menunggu Kurir",
|
||||
"txtLabelPackagePickedUp": "Paket Sudah Diambil",
|
||||
"txtLabelPackageOnDelivery": "Sedang Diantar ke Alamat Tujuan",
|
||||
"txtLabelPackageDelivered": "Sudah diterima Pasien",
|
||||
"txtLabelWaitingForPayment": "Menunggu Pembayaran",
|
||||
"txtOK": "Ya",
|
||||
"txtFindingDriver" : "Sedang mencari driver...",
|
||||
"txtDriverFound" : "Driver sudah didapat dengan ID",
|
||||
"txtButtonClose": "Tutup"
|
||||
}
|
||||
|
||||
@@ -10,6 +10,8 @@ import useAuth from '@/hooks/useAuth';
|
||||
|
||||
import { getUser } from '@/utils/token';
|
||||
|
||||
// Join the words with a space
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
const MENU_OPTIONS = [
|
||||
@@ -34,6 +36,12 @@ export default function AccountPopover() {
|
||||
const navigate = useNavigate();
|
||||
const { logout } = useAuth();
|
||||
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.role.name
|
||||
.split('-') // Split the string by '-'
|
||||
.map(word => word.charAt(0).toUpperCase() + word.slice(1)) // Capitalize the first letter of each word
|
||||
.join(' ');
|
||||
|
||||
const handleOpen = (event: React.MouseEvent<HTMLElement>) => {
|
||||
setOpen(event.currentTarget);
|
||||
};
|
||||
@@ -70,7 +78,7 @@ export default function AccountPopover() {
|
||||
>
|
||||
<Avatar
|
||||
src=""
|
||||
alt="Hospital Portal"
|
||||
alt="Portal"
|
||||
/>
|
||||
</IconButtonAnimate>
|
||||
|
||||
@@ -90,7 +98,7 @@ export default function AccountPopover() {
|
||||
>
|
||||
<Box sx={{ my: 1.5, px: 2.5 }}>
|
||||
<Typography variant="subtitle2" noWrap>
|
||||
Hospital Admin
|
||||
{formattedRoleName}
|
||||
</Typography>
|
||||
<Typography variant="body2" sx={{ color: 'text.secondary' }} noWrap>
|
||||
{storedUser?.email}
|
||||
@@ -99,7 +107,7 @@ export default function AccountPopover() {
|
||||
|
||||
<Divider sx={{ borderStyle: 'dashed' }} />
|
||||
|
||||
<Stack sx={{ p: 1 }}>
|
||||
{/* <Stack sx={{ p: 1 }}>
|
||||
{MENU_OPTIONS.map((option) => (
|
||||
<MenuItem
|
||||
key={option.label}
|
||||
@@ -111,7 +119,7 @@ export default function AccountPopover() {
|
||||
{option.label}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Stack>
|
||||
</Stack> */}
|
||||
|
||||
<Divider sx={{ borderStyle: 'dashed' }} />
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { useEffect } from 'react';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
// @mui
|
||||
import { styled, useTheme } from '@mui/material/styles';
|
||||
@@ -15,10 +15,26 @@ import Logo from '@/components/Logo';
|
||||
import Scrollbar from '@/components/Scrollbar';
|
||||
import { NavSectionVertical } from '@/components/nav-section';
|
||||
//
|
||||
import navConfig from './NavConfig';
|
||||
// import navConfig from './NavConfig';
|
||||
import NavbarDocs from './NavbarDocs';
|
||||
import useAuth from '@/hooks/useAuth';
|
||||
import NavbarAccount from './NavbarAccount';
|
||||
import CollapseButton from './CollapseButton';
|
||||
import axios from '@/utils/axios';
|
||||
import SvgIconStyle from '@/components/SvgIconStyle';
|
||||
|
||||
|
||||
const getIcon = (name: string) => (
|
||||
<SvgIconStyle src={`/image/${name}.svg`} sx={{ width: 1, height: 1 }} />
|
||||
);
|
||||
|
||||
const ICONS = {
|
||||
user: getIcon('ic_user'),
|
||||
ecommerce: getIcon('ic_ecommerce'),
|
||||
analytics: getIcon('ic_analytics'),
|
||||
dashboard: getIcon('ic_dashboard'),
|
||||
ic_booking: getIcon('ic_booking'),
|
||||
};
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
@@ -43,11 +59,76 @@ export default function NavbarVertical({ isOpenSidebar, onCloseSidebar }: Props)
|
||||
|
||||
const { pathname } = useLocation();
|
||||
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.full_name
|
||||
.split('-') // Split the string by '-'
|
||||
.map(word => word.charAt(0).toUpperCase() + word.slice(1)) // Capitalize the first letter of each word
|
||||
.join(' '); // Join the words with a space
|
||||
|
||||
const isDesktop = useResponsive('up', 'lg');
|
||||
|
||||
const { isCollapse, collapseClick, collapseHover, onToggleCollapse, onHoverEnter, onHoverLeave } =
|
||||
useCollapseDrawer();
|
||||
|
||||
const [navConfig, setNavConfig] = useState([]);
|
||||
// console.log(navConfig);
|
||||
useEffect(() => {
|
||||
const fetchNavConfig = async () => {
|
||||
try {
|
||||
const response = await axios.get('/navigations');
|
||||
const data = response.data.items;
|
||||
// console.log(data);
|
||||
|
||||
// Pastikan user dan user.permissions terdefinisi dan merupakan array
|
||||
const userPermissions = user?.permissions?.map(permission => permission.name) || [];
|
||||
|
||||
// Fungsi untuk memeriksa apakah pengguna memiliki izin untuk item tertentu
|
||||
const hasPermission = (permission) => {
|
||||
return userPermissions.includes(permission);
|
||||
};
|
||||
|
||||
// Filter data berdasarkan izin pengguna
|
||||
const filteredNavConfig = data.map(section => {
|
||||
if (section.children && section.children.length > 0) {
|
||||
// Cek apakah ada satu atau lebih children yang memiliki izin
|
||||
const filteredChildren = section.children.filter(child => hasPermission(child.permission));
|
||||
|
||||
if (filteredChildren.length > 0) {
|
||||
return {
|
||||
...section,
|
||||
children: filteredChildren
|
||||
};
|
||||
} else {
|
||||
return null; // Lewati bagian yang tidak memiliki children dengan izin
|
||||
}
|
||||
}
|
||||
// Jika tidak ada children, cek izin untuk section itu sendiri
|
||||
// console.log(section.permission);
|
||||
return hasPermission(section.permission) ? section : null;
|
||||
}).filter(section => section !== null);
|
||||
|
||||
// console.log(filteredNavConfig);
|
||||
|
||||
const formattedNavConfig = filteredNavConfig.map(item => ({
|
||||
|
||||
items: [{
|
||||
title: item.title,
|
||||
path: item.path,
|
||||
icon: ICONS[item.icon]
|
||||
}]
|
||||
}));
|
||||
|
||||
setNavConfig(formattedNavConfig);
|
||||
|
||||
} catch (error) {
|
||||
console.error('Gagal mengambil konfigurasi navigasi:', error);
|
||||
}
|
||||
};
|
||||
|
||||
fetchNavConfig();
|
||||
}, [user]);
|
||||
console.log(navConfig);
|
||||
|
||||
useEffect(() => {
|
||||
if (isOpenSidebar) {
|
||||
onCloseSidebar();
|
||||
@@ -76,10 +157,10 @@ export default function NavbarVertical({ isOpenSidebar, onCloseSidebar }: Props)
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between">
|
||||
<Stack direction="row" alignItems="center">
|
||||
<Logo />
|
||||
<Typography ml={3}>Hospital Portal</Typography>
|
||||
<Typography ml={3}>{formattedRoleName}</Typography>
|
||||
</Stack>
|
||||
<CollapseButton onToggleCollapse={onToggleCollapse} collapseClick={collapseClick} />
|
||||
</Stack>)
|
||||
</Stack>)
|
||||
: (
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between">
|
||||
<Logo />
|
||||
|
||||
119
frontend/hospital-portal/src/pages/DashboardApotek.tsx
Normal file
119
frontend/hospital-portal/src/pages/DashboardApotek.tsx
Normal file
@@ -0,0 +1,119 @@
|
||||
// @mui
|
||||
import { Typography, Container, Grid, Card } from '@mui/material';
|
||||
// hooks
|
||||
import useSettings from '@/hooks/useSettings';
|
||||
// components
|
||||
import Page from '@/components/Page';
|
||||
// theme
|
||||
import CardNotification from '@/sections/dashboard/CardNotification';
|
||||
import CardSearchMember from '@/sections/dashboard/CardSearchMember'
|
||||
import { useContext, useEffect, useState } from 'react';
|
||||
import axios from '@/utils/axios';
|
||||
import { Stack } from '@mui/system';
|
||||
import { Input } from '@mui/material';
|
||||
//sections
|
||||
import TableList from '@/sections/dashboardApotek/TableList';
|
||||
import { fDate } from '@/utils/formatTime';
|
||||
import DialogDetailClaim from '@/components/dialogs/DialogDetailClaim';
|
||||
import HeaderBreadcrumbs from "@/components/HeaderBreadcrumbs";
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
// const [notifications, setNotifications] = useState([])
|
||||
|
||||
const itemList = [
|
||||
{ info: 'Mohon lengkapi dokumen Mahen sadarsa', date: 'Selasa, 20 April 22', time: '08:00 WIB' },
|
||||
{ info: 'Mohon lengkapi dokumen Mahen sadarsa', date: 'Selasa, 20 April 22', time: '09:00 WIB' },
|
||||
{ info: 'Mohon lengkapi dokumen Mahen sadarsa', date: 'Selasa, 20 April 22', time: '10:00 WIB' },
|
||||
{ info: 'Mohon lengkapi dokumen Mahen sadarsa', date: 'Selasa, 20 April 22', time: '11:00 WIB' },
|
||||
];
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
/* ---------------------------------- types --------------------------------- */
|
||||
|
||||
type PolicyProps = {
|
||||
myLimit: {
|
||||
balance: number;
|
||||
total: number;
|
||||
percentage: number;
|
||||
};
|
||||
lockLimit: {
|
||||
balance: number;
|
||||
percentage: number;
|
||||
};
|
||||
};
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ------------------------------ default data ------------------------------ */
|
||||
const defaultPolicyData = {
|
||||
myLimit: {
|
||||
balance: 0,
|
||||
total: 0,
|
||||
percentage: 0,
|
||||
},
|
||||
lockLimit: {
|
||||
balance: 0,
|
||||
percentage: 0,
|
||||
},
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
export default function Claim() {
|
||||
const { themeStretch } = useSettings();
|
||||
|
||||
// const [tableData, setTableData] = useState([]);
|
||||
const [policyData, setPolicyData] = useState<PolicyProps>(defaultPolicyData);
|
||||
|
||||
// TODO Remove This
|
||||
//const [itemList, setItemList] = useState([]);
|
||||
function handleDataLoaded(dataTable:any) {
|
||||
let dummyData = [];
|
||||
dataTable.map(function(data:any) {
|
||||
if (data.status == 'approved') {
|
||||
dummyData.push({
|
||||
info: `LOG Approved for member ${data.member.full_name}`,
|
||||
date: fDate(data.created_at, "dd MMMM"),
|
||||
time: fDate(data.created_at, "HH:mm")
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
//setItemList(dummyData);
|
||||
}
|
||||
|
||||
return (
|
||||
<Page title="Dashboard">
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<Grid container spacing={2}>
|
||||
{/* <Grid item xs={12} lg={12} md={12}>
|
||||
<CardSearchMember/>
|
||||
</Grid> */}
|
||||
{/*<Grid item xs={12} lg={6} md={6}>
|
||||
<CardNotification data={itemList} />
|
||||
</Grid>*/}
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
{/* <HeaderBreadcrumbs
|
||||
heading={'Dashboard'}
|
||||
links={[
|
||||
{
|
||||
name: 'Dashboard',
|
||||
href: '/dashboard-apotek',
|
||||
},
|
||||
{
|
||||
name: 'Dashboard',
|
||||
href: '/list',
|
||||
},
|
||||
]}
|
||||
/> */}
|
||||
<Card>
|
||||
<TableList/>
|
||||
</Card>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Container>
|
||||
|
||||
</Page>
|
||||
);
|
||||
}
|
||||
@@ -11,12 +11,16 @@ import Register from '@/pages/auth/Register';
|
||||
import VerifyCode from '@/pages/auth/VerifyCode';
|
||||
import { AuthProvider } from '@/contexts/LaravelAuthContext';
|
||||
import AuthGuard from '@/guards/AuthGuard';
|
||||
import useAuth from '@/hooks/useAuth';
|
||||
import RoleBasedGuard from '@/guards/RoleBasedGuard';
|
||||
|
||||
// ----------------------------------------------------------------------
|
||||
|
||||
const Loadable = (Component: ElementType) => (props: any) => {
|
||||
// eslint-disable-next-line react-hooks/rules-of-hooks
|
||||
const { pathname } = useLocation();
|
||||
const {user} = useAuth();
|
||||
const formattedRoleName = user?.role.name;
|
||||
|
||||
return (
|
||||
<Suspense fallback={<LoadingScreen isDashboard={pathname.includes('/dashboard')} />}>
|
||||
@@ -74,11 +78,19 @@ export default function Router() {
|
||||
{ element: <Navigate to="/dashboard" replace />, index: true },
|
||||
{
|
||||
path: 'dashboard',
|
||||
element: <Dashboard />,
|
||||
element: (
|
||||
<RoleBasedGuard accessibleRoles={['hospital-admin']}>
|
||||
<Dashboard />
|
||||
</RoleBasedGuard>
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/detail/:id',
|
||||
element: <DetailClaimReport />,
|
||||
element: (
|
||||
<RoleBasedGuard accessibleRoles={['hospital-admin']}>
|
||||
<DetailClaimReport />
|
||||
</RoleBasedGuard>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -95,18 +107,54 @@ export default function Router() {
|
||||
{ element: <Navigate to="/claim" replace />, index: true },
|
||||
{
|
||||
path: 'claim',
|
||||
element: <Claim />,
|
||||
element: (
|
||||
<RoleBasedGuard accessibleRoles={['hospital-admin']}>
|
||||
<Claim />
|
||||
</RoleBasedGuard>
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/claim/detail/:id',
|
||||
element: <DetailClaim />,
|
||||
element: (
|
||||
<RoleBasedGuard accessibleRoles={['hospital-admin']}>
|
||||
<DetailClaim />
|
||||
</RoleBasedGuard>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
path: '/',
|
||||
element: (
|
||||
<AuthProvider>
|
||||
<AuthGuard>
|
||||
<DashboardLayout />
|
||||
</AuthGuard>
|
||||
</AuthProvider>
|
||||
),
|
||||
children: [
|
||||
{ element: <Navigate to="/prescription-orders" replace />, index: true },
|
||||
{
|
||||
path: 'prescription-orders',
|
||||
element: (
|
||||
<RoleBasedGuard accessibleRoles={['admin-apotek', 'cs-lms']}>
|
||||
<DashboardApotek />
|
||||
</RoleBasedGuard>
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
{
|
||||
path: '*',
|
||||
element: <LogoOnlyLayout />,
|
||||
element: (
|
||||
<AuthProvider>
|
||||
<AuthGuard>
|
||||
<LogoOnlyLayout />
|
||||
</AuthGuard>
|
||||
</AuthProvider>
|
||||
),
|
||||
children: [
|
||||
{ path: '404', element: <NotFound /> },
|
||||
{ path: '*', element: <Navigate to="/404" replace /> },
|
||||
@@ -123,6 +171,7 @@ const ForgetPassword = Loadable(lazy(() => import('@/pages/auth/ForgetPassword')
|
||||
// Dashboard
|
||||
const Dashboard = Loadable(lazy(() => import('@/pages/Dashboard')));
|
||||
const Claim = Loadable(lazy(() => import('@/pages/Claim')));
|
||||
const DashboardApotek = Loadable(lazy(() => import('@/pages/DashboardApotek')));
|
||||
const NotFound = Loadable(lazy(() => import('@/pages/Page404')));
|
||||
|
||||
const DetailClaimReport = Loadable(lazy(()=> import('@/sections/dashboard/Detail')));
|
||||
|
||||
@@ -0,0 +1,450 @@
|
||||
/* ---------------------------------- @mui ---------------------------------- */
|
||||
import { Stack, Button, MenuItem, SelectChangeEvent, Tab, Tabs, Card, Box } from '@mui/material';
|
||||
/* ---------------------------------- axios --------------------------------- */
|
||||
// import axios from 'axios';
|
||||
import axios from '../../utils/axios';
|
||||
import { styled } from '@mui/material/styles';
|
||||
/* ---------------------------------- react --------------------------------- */
|
||||
import { useContext, useEffect, useState } from 'react';
|
||||
|
||||
/* -------------------------------- component ------------------------------- */
|
||||
import Iconify from '../../components/Iconify';
|
||||
import TableComponent from '../../components/Table';
|
||||
/* ---------------------------------- theme --------------------------------- */
|
||||
import palette from '../../theme/palette';
|
||||
//import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate';
|
||||
import { HeadCell, Order, PaginationTableProps } from '../../@types/table';
|
||||
import { useSearchParams, useNavigate } from 'react-router-dom';
|
||||
import { fDate, fDateSuffix, fDateTime } from '../../utils/formatTime';
|
||||
import Typography from '@mui/material/Typography';
|
||||
import { format } from 'date-fns';
|
||||
import TableMoreMenu from '../../components/table/TableMoreMenu';
|
||||
import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined';
|
||||
import HistoryIcon from '@mui/icons-material/History';
|
||||
import SearchIcon from '@mui/icons-material/Search';
|
||||
import Label from '../../components/Label';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import { LoadingButton, TabPanel } from "@mui/lab";
|
||||
import { LanguageContext } from '@/contexts/LanguageContext';
|
||||
import MuiDialog from '@/components/MuiDialog';
|
||||
import DialogMember from '@/sections/dashboard/DialogMember';
|
||||
import DialogClaimSubmit from '@/sections/dashboard/DialogClaimSubmit';
|
||||
import { fPostFormat } from '@/utils/formatTime';
|
||||
|
||||
export default function TableList() {
|
||||
const navigate = useNavigate();
|
||||
const { localeData }: any = useContext(LanguageContext);
|
||||
|
||||
const [data, setData] = useState([]);
|
||||
|
||||
// Download LOG
|
||||
async function handleDownloadLog(claimRequest:any) {
|
||||
return axios
|
||||
.get(`claim-requests/${claimRequest}/log`, {
|
||||
responseType: 'blob',
|
||||
})
|
||||
.then((response) => {
|
||||
window.open(URL.createObjectURL(response.data));
|
||||
// setLoadingLog(false);
|
||||
})
|
||||
// .then((blobFile) => {
|
||||
// new File([blobFile], 'asdads.pdf', { type: blobFile.type })
|
||||
// setLoadingLog(false);
|
||||
// })
|
||||
.catch((response) => {
|
||||
enqueueSnackbar(response.message, { variant: 'error' });
|
||||
// setLoadingLog(false);
|
||||
});
|
||||
}
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
/* setting up for the table */
|
||||
/* -------------------------------------------------------------------------- */
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
const loadings = {
|
||||
isLoading: isLoading,
|
||||
setIsLoading: setIsLoading,
|
||||
};
|
||||
|
||||
/* ------------------------------ handle params ----------------------------- */
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
const [appliedParams, setAppliedParams] = useState({});
|
||||
|
||||
const params = {
|
||||
searchParams: searchParams,
|
||||
setSearchParams: setSearchParams,
|
||||
appliedParams: appliedParams,
|
||||
setAppliedParams: setAppliedParams,
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ------------------------------ handle order ------------------------------ */
|
||||
const [order, setOrder] = useState<Order>('desc');
|
||||
const [orderBy, setOrderBy] = useState('dTanggalresep');
|
||||
|
||||
const orders = {
|
||||
order: order,
|
||||
setOrder: setOrder,
|
||||
orderBy: orderBy,
|
||||
setOrderBy: setOrderBy,
|
||||
};
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
/* ---------------------------- handle pagination --------------------------- */
|
||||
const [page, setPage] = useState(0);
|
||||
const [rowsPerPage, setRowsPerPage] = useState(10);
|
||||
|
||||
const [paginationTable, setPaginationTable] = useState<PaginationTableProps>({
|
||||
current_page: 0,
|
||||
from: 0,
|
||||
last_page: 0,
|
||||
links: [],
|
||||
path: '',
|
||||
per_page: 0,
|
||||
to: 0,
|
||||
total: 0,
|
||||
});
|
||||
|
||||
const paginations = {
|
||||
page: page,
|
||||
setPage: setPage,
|
||||
rowsPerPage: rowsPerPage,
|
||||
setRowsPerPage: setRowsPerPage,
|
||||
paginationTable: paginationTable,
|
||||
setPaginationTable: setPaginationTable,
|
||||
};
|
||||
|
||||
/* -------------------------------------------------------------------------- */
|
||||
|
||||
// ----------------------------------------- handle selected ---------------------
|
||||
const [selectAll, setSelectAll] = useState(false);
|
||||
const [selectedRows, setSelectedRows] = useState([]);
|
||||
const [dataTableData, setDataTableData] = useState<any>();
|
||||
const handleSelectAll = () => {
|
||||
setSelectAll(!selectAll);
|
||||
if (!selectAll) {
|
||||
const requestedIds = dataTableData?.data
|
||||
.filter((row: { status: string, check_claim:any }) => row.status === 'approved' && !row.check_claim)
|
||||
.map((row: { id: any }) => row.id);
|
||||
setSelectedRows(requestedIds);
|
||||
} else {
|
||||
setSelectedRows([]);
|
||||
}
|
||||
};
|
||||
|
||||
const handleCheckboxChange = (id: any) => {
|
||||
setSelectedRows(prevSelectedRows => {
|
||||
const isSelected = prevSelectedRows.includes(id);
|
||||
if (isSelected) {
|
||||
return prevSelectedRows.filter(rowId => rowId !== id);
|
||||
} else {
|
||||
return [...prevSelectedRows, id];
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const [openDialogSubmit, setOpenDialogSubmit] = useState(false);
|
||||
const handleCloseDialogSubmit = () => {
|
||||
setOpenDialogSubmit(false);
|
||||
}
|
||||
const [valDialog, setValDialog] = useState('');
|
||||
const [reasonDecline, setReasonDecline] = useState('');
|
||||
const handleReasonDeclineChange = (event: { target: { value: SetStateAction<string>; }; }) => {
|
||||
setReasonDecline(event.target.value);
|
||||
};
|
||||
|
||||
const selected = {
|
||||
useSelected: false,
|
||||
selectAll: selectAll,
|
||||
handleSelectAll: handleSelectAll,
|
||||
selectedRows: selectedRows,
|
||||
handleCheckboxChange : handleCheckboxChange,
|
||||
totRows: 9,
|
||||
useDecline: false,
|
||||
txtDecline: 'Decline',
|
||||
useApprove:true,
|
||||
txtApprove: 'Submit Claim',
|
||||
setOpenDialogSubmit: setOpenDialogSubmit,
|
||||
setValDialog: setValDialog
|
||||
};
|
||||
|
||||
/* ------------------------------ handle search ----------------------------- */
|
||||
const [searchText, setSearchText] = useState('');
|
||||
|
||||
const handleSearchSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
|
||||
event.preventDefault();
|
||||
|
||||
if (searchText === '') {
|
||||
searchParams.delete('search');
|
||||
const params = Object.fromEntries([...searchParams.entries()]);
|
||||
setAppliedParams(params);
|
||||
} else {
|
||||
const params = Object.fromEntries([...searchParams.entries(), ['search', searchText]]);
|
||||
setAppliedParams(params);
|
||||
}
|
||||
};
|
||||
|
||||
const searchs = {
|
||||
useSearchs: true,
|
||||
searchText: searchText,
|
||||
setSearchText: setSearchText,
|
||||
handleSearchSubmit: handleSearchSubmit,
|
||||
};
|
||||
|
||||
/* ------------------------------ handle filter ----------------------------- */
|
||||
const [statusValue, setStatusValue] = useState('all');
|
||||
const [filterData, setStatusData] = useState([]);
|
||||
|
||||
// handle status
|
||||
const handleStatusChanges = (event: SelectChangeEvent) => {
|
||||
setStatusValue(event.target.value as string);
|
||||
|
||||
if (event.target.value === 'all') {
|
||||
searchParams.delete('status');
|
||||
const params = Object.fromEntries([...searchParams.entries()]);
|
||||
setAppliedParams(params);
|
||||
} else {
|
||||
const params = Object.fromEntries([
|
||||
...searchParams.entries(),
|
||||
['status', event.target.value as string],
|
||||
]);
|
||||
setAppliedParams(params);
|
||||
}
|
||||
};
|
||||
|
||||
const filterStatus = {
|
||||
useFilter: true,
|
||||
config: {
|
||||
label: 'Status',
|
||||
statusValue: statusValue,
|
||||
filterData: filterData,
|
||||
handleStatusChange: handleStatusChanges,
|
||||
},
|
||||
};
|
||||
|
||||
// handle start date
|
||||
const [startDateValue, setStartDateValue] = useState('');
|
||||
|
||||
const handleStartDateChanges = async (event: React.FormEvent<HTMLFormElement>) => {
|
||||
event.preventDefault();
|
||||
const newStartDateValue = event.currentTarget.elements['date-input'].value;
|
||||
setStartDateValue(newStartDateValue);
|
||||
if (newStartDateValue === '') {
|
||||
searchParams.delete('start_date');
|
||||
const params = Object.fromEntries([...searchParams.entries()]);
|
||||
setAppliedParams(params);
|
||||
} else {
|
||||
const params = Object.fromEntries([...searchParams.entries(), ['start_date', newStartDateValue]]);
|
||||
setAppliedParams(params);
|
||||
}
|
||||
};
|
||||
|
||||
const filterStartDate = {
|
||||
useFilter: true,
|
||||
startDate: startDateValue,
|
||||
setStartDate: setStartDateValue,
|
||||
handleStartDateChange: handleStartDateChanges,
|
||||
};
|
||||
|
||||
// handle end date
|
||||
const [endDateValue, setEndDateValue] = useState('');
|
||||
|
||||
const handleEndDateChanges = async (event: React.FormEvent<HTMLFormElement>) => {
|
||||
event.preventDefault();
|
||||
const newEndDateValue = event.currentTarget.elements['date-input'].value;
|
||||
setEndDateValue(newEndDateValue);
|
||||
if (newEndDateValue === '') {
|
||||
searchParams.delete('end_date');
|
||||
const params = Object.fromEntries([...searchParams.entries()]);
|
||||
setAppliedParams(params);
|
||||
} else {
|
||||
const params = Object.fromEntries([...searchParams.entries(), ['end_date', newEndDateValue]]);
|
||||
setAppliedParams(params);
|
||||
}
|
||||
};
|
||||
|
||||
const filterEndDate = {
|
||||
useFilter: true,
|
||||
endDate: endDateValue,
|
||||
setEndDate: setEndDateValue,
|
||||
handleEndDateChange: handleEndDateChanges,
|
||||
};
|
||||
|
||||
/* -------------------------------- headCell Claim -------------------------------- */
|
||||
const headCells: HeadCell<never>[] = [
|
||||
{
|
||||
id: 'no_resep',
|
||||
align: 'left',
|
||||
label: localeData.txtPrescriptionNumber,
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'tanggal',
|
||||
align: 'left',
|
||||
label: localeData.txtPrescriptionDate,
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'pasien',
|
||||
align: 'center',
|
||||
label: localeData.txtPrescriptionPatient,
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'apotek',
|
||||
align: 'center',
|
||||
label: localeData.txtPrescriptionPharmacy,
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'status',
|
||||
align: 'center',
|
||||
label: localeData.txtStatus,
|
||||
isSort: true,
|
||||
},
|
||||
{
|
||||
id: 'action',
|
||||
align: 'right',
|
||||
label: '',
|
||||
isSort: false,
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [appliedParams, searchParams, order, orderBy, setSearchParams]);
|
||||
const [openRowId, setOpenRowId] = useState<number | null>(null);
|
||||
function getData()
|
||||
{
|
||||
(async () => {
|
||||
setIsLoading(true);
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 250));
|
||||
|
||||
const parameters =
|
||||
Object.keys(appliedParams).length !== 0
|
||||
? appliedParams
|
||||
: Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]);
|
||||
|
||||
const response = await axios.get(`/get-prescription-orders`, {
|
||||
params: { ...parameters, type: 'prescription-orders' },
|
||||
});
|
||||
setDataTableData(response.data);
|
||||
setData(
|
||||
response.data.data.map((obj: any) => ({
|
||||
...obj,
|
||||
status:
|
||||
obj.status === 'waiting_pharmacy' ? (
|
||||
<Label color='default'>
|
||||
{localeData.txtLabelNew}
|
||||
</Label>
|
||||
) : obj.status === 'order_prepared' ? (
|
||||
<Label color='primary' >
|
||||
{localeData.txtLabelAccepted}
|
||||
</Label>
|
||||
) : obj.status === 'ready' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelReady}
|
||||
</Label>
|
||||
) : obj.status === 'waiting_for_courir' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelWaitingCourir}
|
||||
</Label>
|
||||
) : obj.status === 'package_picked_up' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelPackagePickedUp}
|
||||
</Label>
|
||||
) : obj.status === 'package_on_delivery' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelPackageOnDelivery}
|
||||
</Label>
|
||||
) : obj.status === 'package_delivered' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelPackageDelivered}
|
||||
</Label>
|
||||
) : obj.status === 'waiting_for_payment' ? (
|
||||
<Label color='primary'>
|
||||
{localeData.txtLabelWaitingForPayment}
|
||||
</Label>
|
||||
) : (
|
||||
<Label color='primary'>
|
||||
Pending
|
||||
</Label>
|
||||
),
|
||||
tanggal:
|
||||
<Label>
|
||||
{obj.tanggal ? fDateTime(obj.tanggal) : ''}
|
||||
</Label>
|
||||
,
|
||||
valid_tanggal:
|
||||
<Label>
|
||||
{obj.valid_tanggal ? fDateTime(obj.valid_tanggal) : ''}
|
||||
</Label>
|
||||
,
|
||||
action:
|
||||
<TableMoreMenu actions={
|
||||
<>
|
||||
<MenuItem onClick={() => setOpenRowId(obj.id === openRowId ? null : obj.id)}>
|
||||
<Iconify icon="eva:eye-fill" />
|
||||
{localeData.txtPrescriptionDetail}
|
||||
</MenuItem>
|
||||
{/* <MenuItem onClick={() => handleDownloadLog(obj.id, obj.service_code, obj.no_polis, obj.full_name, obj.provider, obj.approved_at)}>
|
||||
<Iconify icon="eva:download-fill" />
|
||||
{localeData.txtPrescriptionDownload}
|
||||
</MenuItem> */}
|
||||
</>
|
||||
} />
|
||||
}))
|
||||
);
|
||||
|
||||
setPaginationTable(response.data);
|
||||
setRowsPerPage(response.data.per_page);
|
||||
|
||||
if (searchParams.get('page')) {
|
||||
//@ts-ignore
|
||||
const currentPage = parseInt(searchParams.get('page')) - 1;
|
||||
|
||||
paginationTable.current_page = currentPage;
|
||||
setPage(currentPage);
|
||||
}
|
||||
|
||||
const status:any = [
|
||||
{"id": "waiting_for_payment", "name": localeData.txtLabelWaitingForPayment },
|
||||
{"id": "waiting_pharmacy", "name": localeData.txtLabelNew },
|
||||
{"id": "order_prepared", "name": localeData.txtLabelAccepted },
|
||||
{"id": "ready", "name": localeData.txtLabelReady },
|
||||
{"id": "waiting_for_courir", "name": localeData.txtLabelWaitingCourir },
|
||||
{"id": "package_picked_up", "name": localeData.txtLabelPackagePickedUp },
|
||||
{"id": "package_on_delivery", "name": localeData.txtLabelPackageOnDelivery },
|
||||
{"id": "package_delivered", "name": localeData.txtLabelPackageDelivered },
|
||||
];
|
||||
setStatusData(status)
|
||||
|
||||
setIsLoading(false);
|
||||
})();
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<TableComponent
|
||||
headCells={headCells}
|
||||
rows={data}
|
||||
orders={orders}
|
||||
paginations={paginations}
|
||||
loadings={loadings}
|
||||
params={params}
|
||||
searchs={searchs}
|
||||
filterStatus={filterStatus}
|
||||
selected={selected}
|
||||
// filterStartDate={filterStartDate}
|
||||
// filterEndDate={filterEndDate}
|
||||
openRowId={openRowId} // Pass the currently opened row ID
|
||||
setOpenRowId={setOpenRowId} // Pass the function to set the opened row ID
|
||||
reloadData={getData}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -11,6 +11,40 @@ export function fDateTime(date: Date | string | number) {
|
||||
return format(new Date(date), 'dd MMM yyyy HH:mm');
|
||||
}
|
||||
|
||||
// Function to calculate the age from the birthdate
|
||||
function calculateAge(birthDate: Date): number {
|
||||
const today = new Date();
|
||||
const age = today.getFullYear() - birthDate.getFullYear();
|
||||
const monthDifference = today.getMonth() - birthDate.getMonth();
|
||||
const dayDifference = today.getDate() - birthDate.getDate();
|
||||
|
||||
// Adjust age if birthday hasn't occurred yet this year
|
||||
if (monthDifference < 0 || (monthDifference === 0 && dayDifference < 0)) {
|
||||
return age - 1;
|
||||
}
|
||||
|
||||
return age;
|
||||
}
|
||||
|
||||
// Extended function to format the date and include the age if it's a birthdate
|
||||
export function fDateTimeWithAge(date: Date | string | number): string {
|
||||
const birthDate = new Date(date);
|
||||
const formattedDate = format(birthDate, 'dd MMM yyyy');
|
||||
const age = calculateAge(birthDate);
|
||||
|
||||
// If the age is 0, the output should be months instead of years
|
||||
let ageText = age > 0 ? `${age} years old` : '';
|
||||
|
||||
if (age === 0) {
|
||||
const monthsOld = new Date().getMonth() - birthDate.getMonth() +
|
||||
(12 * (new Date().getFullYear() - birthDate.getFullYear()));
|
||||
ageText = `${monthsOld} months old`;
|
||||
}
|
||||
|
||||
return `${formattedDate} / ${ageText}`;
|
||||
}
|
||||
|
||||
|
||||
export function fTimestamp(date: Date | string | number) {
|
||||
return getTime(new Date(date));
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user