[WIP] A
This commit is contained in:
@@ -22,6 +22,7 @@ import { fDate } from '@/utils/formatTime';
|
||||
import { addMinutes, format } from 'date-fns';
|
||||
import { LoadingButton } from '@mui/lab';
|
||||
import { enqueueSnackbar } from 'notistack';
|
||||
import Iconify from '../Iconify';
|
||||
|
||||
type DataContent = {
|
||||
claim: object;
|
||||
@@ -63,22 +64,25 @@ const DialogDetailClaim = ({ title, openDialog, setOpenDialog, data }: MuiDialog
|
||||
[data]
|
||||
);
|
||||
|
||||
// ----------------------------------------------------
|
||||
// Date Stamp
|
||||
let currentDate = null;
|
||||
|
||||
// ----------------------------------------------------
|
||||
// Download LOG
|
||||
const [loadingDownloadLog, setLoadingDownloadLog] = useState(false)
|
||||
const [loadingDownloadLog, setLoadingDownloadLog] = useState(false);
|
||||
const handleDownloadLog = async (claimRequest) => {
|
||||
setLoadingDownloadLog(true)
|
||||
setLoadingDownloadLog(true);
|
||||
await data.handleDownloadLog(claimRequest).then(() => {
|
||||
setLoadingDownloadLog(false)
|
||||
})
|
||||
}
|
||||
setLoadingDownloadLog(false);
|
||||
});
|
||||
};
|
||||
|
||||
// ----------------------------------------------------
|
||||
// Handle Upload Invoice
|
||||
const handleUploadInvoice = () => {
|
||||
enqueueSnackbar('Something went wrong, please contact Link Medis Sehat', {variant: 'error'})
|
||||
}
|
||||
enqueueSnackbar('Something went wrong, please contact Link Medis Sehat', { variant: 'error' });
|
||||
};
|
||||
|
||||
const getContent = () => (
|
||||
<>
|
||||
@@ -102,9 +106,13 @@ const DialogDetailClaim = ({ title, openDialog, setOpenDialog, data }: MuiDialog
|
||||
<Stack>
|
||||
<Typography variant="caption">Submission date</Typography>
|
||||
{/* {JSON.stringify(data)} */}
|
||||
<Typography variant="caption">{claim && fDate(claim.created_at)}</Typography>
|
||||
<Typography variant="caption">
|
||||
{claim.created_at && fDate(claim.created_at)}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
{/* ----------------STEP---------------- */}
|
||||
<Box sx={{ width: '100%', marginTop: 2 }}>
|
||||
<Stepper alternativeLabel activeStep={currentStep ?? 0}>
|
||||
{steps.map((label) => (
|
||||
@@ -115,129 +123,117 @@ const DialogDetailClaim = ({ title, openDialog, setOpenDialog, data }: MuiDialog
|
||||
</Stepper>
|
||||
</Box>
|
||||
|
||||
{ claim.status == 'approved' && (
|
||||
<Stack sx={{ marginTop: 4}}>
|
||||
<LoadingButton loading={false}
|
||||
variant="contained"
|
||||
startIcon={<Add />}
|
||||
fullWidth
|
||||
// sx={{ typography: 'subtitle2', borderColor: '#F5F5F5' }}
|
||||
onClick={() => {handleUploadInvoice()}}
|
||||
>
|
||||
Upload Invoice
|
||||
</LoadingButton>
|
||||
</Stack>)}
|
||||
|
||||
<Stack marginTop={2}>
|
||||
<Typography variant="subtitle1" paddingY={2}>
|
||||
{fDate(claim.created_at)}
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction="row" spacing={2}>
|
||||
{/* { claim.status == 'approved' && (
|
||||
<Stack sx={{ marginTop: 4}}>
|
||||
<LoadingButton loading={false}
|
||||
variant="contained"
|
||||
startIcon={<Add />}
|
||||
fullWidth
|
||||
// sx={{ typography: 'subtitle2', borderColor: '#F5F5F5' }}
|
||||
onClick={() => {handleUploadInvoice()}}
|
||||
>
|
||||
Upload Invoice
|
||||
</LoadingButton>
|
||||
</Stack>
|
||||
)} */}
|
||||
|
||||
<Stack direction="row" spacing={2} sx={{ marginTop: 2 }}>
|
||||
<Divider orientation="vertical" flexItem sx={{ borderStyle: 'dashed' }} />
|
||||
<Stack spacing={2} sx={{ flex: 1, maxWidth: '100%' }}>
|
||||
|
||||
{/* Download LOG */}
|
||||
{claim.status == 'approved' && (
|
||||
<Card sx={{ paddingY: 2, paddingX: 3 }}>
|
||||
<Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
<Typography variant="body1">
|
||||
{format(
|
||||
addMinutes(
|
||||
new Date(claim.created_at),
|
||||
15 //Math.floor(Math.random() * (20 - 15 + 1)) + 15
|
||||
),
|
||||
'HH:mm'
|
||||
)}{' '}
|
||||
WIB</Typography>
|
||||
<Typography
|
||||
sx={{
|
||||
backgroundColor: palette.light.warning.lighter,
|
||||
color: palette.light.warning.dark,
|
||||
borderColor: palette.light.warning.dark,
|
||||
border: '1px solid',
|
||||
borderRadius: '6px',
|
||||
padding: 1,
|
||||
}}
|
||||
variant="caption"
|
||||
>
|
||||
Approved
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack>
|
||||
<LoadingButton loading={loadingDownloadLog}
|
||||
variant="outlined"
|
||||
startIcon={<Add />}
|
||||
fullWidth
|
||||
// sx={{ typography: 'subtitle2', borderColor: '#F5F5F5' }}
|
||||
onClick={() => {handleDownloadLog(claim)}}
|
||||
>
|
||||
Download Guarantee Letter
|
||||
</LoadingButton>
|
||||
</Stack>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
|
||||
{/* Item 1 */}
|
||||
{claim.status == 'requested' && (
|
||||
<Card sx={{ paddingY: 2, paddingX: 3 }}>
|
||||
<Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
<Typography variant="body1">09:10 WIB</Typography>
|
||||
<Typography
|
||||
sx={{
|
||||
backgroundColor: palette.light.warning.lighter,
|
||||
color: palette.light.warning.dark,
|
||||
borderColor: palette.light.warning.dark,
|
||||
border: '1px solid',
|
||||
borderRadius: '6px',
|
||||
padding: 1,
|
||||
}}
|
||||
variant="caption"
|
||||
>
|
||||
Approval
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack>
|
||||
<Typography variant="subtitle2" color="#404040">
|
||||
Details : mohon melengkapi kekurangan dokumen
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="caption"
|
||||
color="#757575"
|
||||
sx={{ marginTop: 2, marginBottom: 1 }}
|
||||
>
|
||||
Lab pemeriksaan darah
|
||||
</Typography>
|
||||
<Button
|
||||
variant="outlined"
|
||||
startIcon={<Add />}
|
||||
fullWidth
|
||||
sx={{ typography: 'subtitle2', borderColor: '#F5F5F5' }}
|
||||
>
|
||||
Hasil Pemeriksaan Laboratorium
|
||||
</Button>
|
||||
</Stack>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Item 2 */}
|
||||
<Card sx={{ flex: 1, maxWidth: '100%', paddingY: 2, paddingX: 3 }}>
|
||||
{/* ---------------------------------TYPE INFO------------------------------------ */}
|
||||
<Card sx={{ paddingY: 2, paddingX: 3 }}>
|
||||
<Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
{/* // TODO sementara tanggal random */}
|
||||
<Typography variant="body1">
|
||||
{format(
|
||||
addMinutes(
|
||||
new Date(claim.created_at),
|
||||
10// Math.floor(Math.random() * (15 - 5 + 1)) + 5
|
||||
),
|
||||
'HH:mm'
|
||||
)}{' '}
|
||||
WIB
|
||||
<Typography variant="body1" fontWeight={600}>
|
||||
<Iconify icon="eva:file-text-fill"></Iconify> Pengajuan Penjaminan
|
||||
</Typography>
|
||||
<Typography
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
|
||||
<Stack>
|
||||
<LoadingButton loading={false}
|
||||
variant="contained"
|
||||
startIcon={<Add />}
|
||||
fullWidth
|
||||
// sx={{ typography: 'subtitle2', borderColor: '#F5F5F5' }}
|
||||
onClick={() => {}}
|
||||
>
|
||||
Upload Invoice
|
||||
</LoadingButton>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
</Stack>
|
||||
|
||||
{claim.histories_by_date &&
|
||||
claim.histories_by_date.map((historiesByDate) => (
|
||||
<Stack key={historiesByDate.date}>
|
||||
<Stack marginTop={2}>
|
||||
<Typography variant="subtitle1" paddingY={2}>
|
||||
{fDate(historiesByDate.date)}
|
||||
</Typography>
|
||||
</Stack>
|
||||
|
||||
<Stack direction="row" spacing={2}>
|
||||
<Divider orientation="vertical" flexItem sx={{ borderStyle: 'dashed' }} />
|
||||
<Stack spacing={2} sx={{ flex: 1, maxWidth: '100%' }}>
|
||||
{historiesByDate.histories &&
|
||||
historiesByDate.histories.map((history) => (
|
||||
<Stack key={history.id}>
|
||||
{/* ---------------------------------TYPE INFO------------------------------------ */}
|
||||
<Card sx={{ paddingY: 2, paddingX: 3 }}>
|
||||
<Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
>
|
||||
<Typography variant="body1">
|
||||
{fDate(history.created_at, 'HH:mm')} WIB
|
||||
</Typography>
|
||||
<Typography
|
||||
sx={{
|
||||
backgroundColor: palette.light.warning.lighter,
|
||||
color: palette.light.warning.dark,
|
||||
borderColor: palette.light.warning.dark,
|
||||
border: '1px solid',
|
||||
borderRadius: '6px',
|
||||
padding: 1,
|
||||
}}
|
||||
variant="caption"
|
||||
>
|
||||
Request
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack>
|
||||
<Typography variant="subtitle2" color="#404040">
|
||||
{history.title}
|
||||
</Typography>
|
||||
<Typography
|
||||
variant="caption"
|
||||
color="#757575"
|
||||
sx={{ marginTop: 2, marginBottom: 1 }}
|
||||
>
|
||||
{history.description}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
))}
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Stack>
|
||||
))}
|
||||
|
||||
<Stack direction="row" spacing={2} sx={{ marginTop: 2 }}>
|
||||
<Divider orientation="vertical" flexItem sx={{ borderStyle: 'dashed' }} />
|
||||
<Stack spacing={2} sx={{ flex: 1, maxWidth: '100%' }}>
|
||||
{/* ---------------------------------TYPE INFO------------------------------------ */}
|
||||
<Card sx={{ paddingY: 2, paddingX: 3 }}>
|
||||
<Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
<Typography variant="body1" fontWeight={600}>
|
||||
<Iconify icon="eva:file-text-fill"></Iconify> Dokumen Kelengkapan
|
||||
</Typography>
|
||||
{/* <Typography
|
||||
sx={{
|
||||
backgroundColor: palette.light.warning.lighter,
|
||||
color: palette.light.warning.dark,
|
||||
@@ -248,39 +244,65 @@ const DialogDetailClaim = ({ title, openDialog, setOpenDialog, data }: MuiDialog
|
||||
}}
|
||||
variant="caption"
|
||||
>
|
||||
Approval
|
||||
</Typography>
|
||||
Dokumen
|
||||
</Typography> */}
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
|
||||
<Typography fontWeight="600">Kondisi</Typography>
|
||||
<Stack>
|
||||
<Typography variant="subtitle2" color="#404040">
|
||||
Details : Penilaian Dokter
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
{/* Item 3 */}
|
||||
<Card sx={{ flex: 1, maxWidth: '100%', paddingY: 2, paddingX: 3 }}>
|
||||
<Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
<Typography variant="body1">{fDate(claim.created_at, 'HH:mm')} WIB</Typography>
|
||||
<Typography
|
||||
sx={{
|
||||
backgroundColor: '#F5F5F5',
|
||||
color: '#757575',
|
||||
borderColor: '#757575',
|
||||
border: '1px solid',
|
||||
borderRadius: '6px',
|
||||
padding: 1,
|
||||
}}
|
||||
variant="caption"
|
||||
<Stack
|
||||
// divider={<Divider orientation="horizontal" flexItem />}
|
||||
spacing={1}
|
||||
sx={{ marginY: 2 }}
|
||||
>
|
||||
Review
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack>
|
||||
<Typography variant="subtitle2" color="#404040">
|
||||
Details : Klaim Diajukan
|
||||
</Typography>
|
||||
{claim.files_by_type?.claim_kondisi &&
|
||||
claim.files_by_type.claim_kondisi.map((file, index) => (
|
||||
<Stack direction="row" justifyContent={'space-between'} key={index}>
|
||||
<a href={file.url} target="_blank" style={{ textDecoration: 'none' }}>
|
||||
<Typography sx={{ color: 'text.secondary' }} variant="subtitle2">
|
||||
- {file.name}
|
||||
</Typography>
|
||||
</a>
|
||||
</Stack>
|
||||
))}
|
||||
</Stack>
|
||||
|
||||
<Typography fontWeight="600">Diagnosa</Typography>
|
||||
<Stack
|
||||
// divider={<Divider orientation="horizontal" flexItem />}
|
||||
spacing={1}
|
||||
sx={{ marginY: 2 }}
|
||||
>
|
||||
{claim.files_by_type?.claim_diagnosis &&
|
||||
claim.files_by_type.claim_diagnosis.map((file, index) => (
|
||||
<Stack direction="row" justifyContent={'space-between'} key={index}>
|
||||
<a href={file.url} target="_blank" style={{ textDecoration: 'none' }}>
|
||||
<Typography sx={{ color: 'text.secondary' }} variant="subtitle2">
|
||||
- {file.name}
|
||||
</Typography>
|
||||
</a>
|
||||
</Stack>
|
||||
))}
|
||||
</Stack>
|
||||
|
||||
<Typography fontWeight="600">Hasil</Typography>
|
||||
<Stack
|
||||
divider={<Divider orientation="horizontal" flexItem />}
|
||||
spacing={1}
|
||||
sx={{ marginY: 2 }}
|
||||
>
|
||||
{claim.files_by_type?.result &&
|
||||
claim.files_by_type.result.map((file, index) => (
|
||||
<Stack direction="row" justifyContent={'space-between'} key={index}>
|
||||
<a href={file.url} target="_blank" style={{ textDecoration: 'none' }}>
|
||||
<Typography sx={{ color: 'text.secondary' }} variant="subtitle2">
|
||||
- {file.name}
|
||||
</Typography>
|
||||
</a>
|
||||
</Stack>
|
||||
))}
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Card>
|
||||
</Stack>
|
||||
|
||||
Reference in New Issue
Block a user