Update improvement client portal daily monitoring
This commit is contained in:
@@ -175,6 +175,10 @@ export default function List() {
|
||||
<VisibilityOutlinedIcon />
|
||||
View
|
||||
</MenuItem>
|
||||
{/* <MenuItem onClick={() => navigate('service-monitoring/' + obj.id)}>
|
||||
<Download />
|
||||
Document Member
|
||||
</MenuItem> */}
|
||||
</>
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -179,6 +179,12 @@ type ServiceMonitoringProps = {
|
||||
type: number;
|
||||
plan: string;
|
||||
}[];
|
||||
files: {
|
||||
type: string;
|
||||
name: string;
|
||||
original_name: string;
|
||||
path: string;
|
||||
}[];
|
||||
}>
|
||||
>;
|
||||
laboratoriumResults: Record<
|
||||
@@ -188,6 +194,12 @@ type ServiceMonitoringProps = {
|
||||
date: string;
|
||||
examination: string;
|
||||
location: string;
|
||||
files: {
|
||||
type: string;
|
||||
name: string;
|
||||
original_name: string;
|
||||
path: string;
|
||||
}[];
|
||||
}>
|
||||
>;
|
||||
};
|
||||
@@ -387,7 +399,7 @@ export default function ServiceMonitoring() {
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} container spacing={3}>
|
||||
<Grid item container xs={12} spacing={1.5}>
|
||||
{/* <Grid item container xs={12} spacing={1.5}>
|
||||
<Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? <Skeleton animation={'wave'} width={200} /> : 'Symptoms'}
|
||||
@@ -404,8 +416,8 @@ export default function ServiceMonitoring() {
|
||||
)}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item container xs={12} spacing={1.5}>
|
||||
</Grid> */}
|
||||
{/* <Grid item container xs={12} spacing={1.5}>
|
||||
<Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? <Skeleton animation={'wave'} width={200} /> : 'Sign'}
|
||||
@@ -422,7 +434,7 @@ export default function ServiceMonitoring() {
|
||||
)}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid> */}
|
||||
<Grid item container xs={12} spacing={1.5}>
|
||||
<Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
@@ -441,7 +453,7 @@ export default function ServiceMonitoring() {
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item container xs={12} spacing={1.5}>
|
||||
{/* <Grid item container xs={12} spacing={1.5}>
|
||||
<Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? (
|
||||
@@ -462,14 +474,14 @@ export default function ServiceMonitoring() {
|
||||
)}
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid> */}
|
||||
<Grid item container xs={12} spacing={1.5}>
|
||||
<Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? (
|
||||
<Skeleton animation={'wave'} width={200} />
|
||||
) : (
|
||||
'Files Result'
|
||||
'Files Document'
|
||||
)}
|
||||
</Typography>
|
||||
</Grid>
|
||||
@@ -502,7 +514,7 @@ export default function ServiceMonitoring() {
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
{/* <Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? (
|
||||
<Skeleton animation={'wave'} width={200} />
|
||||
@@ -539,8 +551,8 @@ export default function ServiceMonitoring() {
|
||||
-
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
<Grid item xs={12}>
|
||||
</Grid> */}
|
||||
{/* <Grid item xs={12}>
|
||||
<Typography variant="subtitle2" color={'grey.600'}>
|
||||
{loading ? (
|
||||
<Skeleton animation={'wave'} width={200} />
|
||||
@@ -548,8 +560,8 @@ export default function ServiceMonitoring() {
|
||||
'Files Kondisi'
|
||||
)}
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
</Grid> */}
|
||||
{/* <Grid item>
|
||||
{loading ? (
|
||||
<Skeleton animation="wave" width={300} />
|
||||
) : data && data.files && data.files.kondisi.length > 0 ?
|
||||
@@ -576,7 +588,7 @@ export default function ServiceMonitoring() {
|
||||
-
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</Grid> */}
|
||||
</Grid>
|
||||
|
||||
</Grid>
|
||||
@@ -833,338 +845,393 @@ export default function ServiceMonitoring() {
|
||||
</Card>
|
||||
|
||||
</Grid> */}
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
{loading ? (
|
||||
<Card sx={{ borderRadius: '16px', padding: '24px' }}>
|
||||
<Grid container>
|
||||
<Grid item xs={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
{data?.serviceCode === 'IP' ? (
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
{loading ? (
|
||||
<Card sx={{ borderRadius: '16px', padding: '24px' }}>
|
||||
<Grid container>
|
||||
<Grid item xs={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
</Grid>
|
||||
<Grid item xs={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
</Grid>
|
||||
<Grid item xs={12} paddingTop={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item xs={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
</Grid>
|
||||
<Grid item xs={12} paddingTop={2}>
|
||||
<Skeleton animation="wave" sx={{ width: 'calc(100% - 24px)' }} />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Card>
|
||||
) : (
|
||||
<Card sx={{ borderRadius: '16px', padding: '24px' }}>
|
||||
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
|
||||
<StyledTabs value={value} onChange={handleChange} aria-label="basic tabs example">
|
||||
<StyledTab label="Daily Monitoring" {...a11yProps(0)} />
|
||||
<StyledTab label="Laboratorium Result" {...a11yProps(1)} />
|
||||
</StyledTabs>
|
||||
</Box>
|
||||
<TabPanel value={value} index={0}>
|
||||
<Grid item xs={12} md={12} padding={data && data.dailyMonitorings ? 0 : 3}>
|
||||
{data && data.dailyMonitorings ? (
|
||||
<Timeline
|
||||
sx={{
|
||||
gap: 2,
|
||||
paddingY: 2,
|
||||
paddingX: 1.5,
|
||||
[`& .${timelineItemClasses.root}:before`]: {
|
||||
flex: 0,
|
||||
padding: 0,
|
||||
},
|
||||
}}
|
||||
>
|
||||
{data &&
|
||||
data.dailyMonitorings &&
|
||||
Object.keys(data.dailyMonitorings).length > 0 &&
|
||||
Object.keys(data.dailyMonitorings).map((date, dateIndex) => (
|
||||
<TimelineItem key={dateIndex}>
|
||||
<TimelineSeparator>
|
||||
<TimelineDot />
|
||||
<TimelineConnector />
|
||||
</TimelineSeparator>
|
||||
<TimelineContent
|
||||
sx={{
|
||||
'&.MuiTimelineContent-root': {
|
||||
paddingX: 2,
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Typography variant="subtitle1" marginBottom={2}>
|
||||
{date ? date : '-'}
|
||||
</Typography>
|
||||
{data.dailyMonitorings[date].map(
|
||||
(dailyMonitoring, dailyMonitoringIndex) => (
|
||||
<Card
|
||||
key={dailyMonitoringIndex}
|
||||
sx={{
|
||||
padding: 3,
|
||||
marginBottom:
|
||||
dailyMonitoringIndex !==
|
||||
data.dailyMonitorings[date].length - 1
|
||||
? 2
|
||||
: 0,
|
||||
}}
|
||||
>
|
||||
<Stack
|
||||
direction={'row'}
|
||||
</Card>
|
||||
) : (
|
||||
<Card sx={{ borderRadius: '16px', padding: '24px' }}>
|
||||
<Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
|
||||
<StyledTabs value={value} onChange={handleChange} aria-label="basic tabs example">
|
||||
<StyledTab label="Daily Monitoring" {...a11yProps(0)} />
|
||||
<StyledTab label="Laboratorium Result" {...a11yProps(1)} />
|
||||
</StyledTabs>
|
||||
</Box>
|
||||
<TabPanel value={value} index={0}>
|
||||
<Grid item xs={12} md={12} padding={data && data.dailyMonitorings ? 0 : 3}>
|
||||
{data && data.dailyMonitorings ? (
|
||||
<Timeline
|
||||
sx={{
|
||||
gap: 2,
|
||||
paddingY: 2,
|
||||
paddingX: 1.5,
|
||||
[`& .${timelineItemClasses.root}:before`]: {
|
||||
flex: 0,
|
||||
padding: 0,
|
||||
},
|
||||
}}
|
||||
>
|
||||
{data &&
|
||||
data.dailyMonitorings &&
|
||||
Object.keys(data.dailyMonitorings).length > 0 &&
|
||||
Object.keys(data.dailyMonitorings).map((date, dateIndex) => (
|
||||
<TimelineItem key={dateIndex}>
|
||||
<TimelineSeparator>
|
||||
<TimelineDot />
|
||||
<TimelineConnector />
|
||||
</TimelineSeparator>
|
||||
<TimelineContent
|
||||
sx={{
|
||||
'&.MuiTimelineContent-root': {
|
||||
paddingX: 2,
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Typography variant="subtitle1" marginBottom={2}>
|
||||
{date ? date : '-'}
|
||||
</Typography>
|
||||
{data.dailyMonitorings[date].map(
|
||||
(dailyMonitoring, dailyMonitoringIndex) => (
|
||||
<Card
|
||||
key={dailyMonitoringIndex}
|
||||
sx={{
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
padding: 3,
|
||||
marginBottom:
|
||||
dailyMonitoringIndex !==
|
||||
data.dailyMonitorings[date].length - 1
|
||||
? 2
|
||||
: 0,
|
||||
}}
|
||||
>
|
||||
<Label>
|
||||
{dailyMonitoring.time ? dailyMonitoring.time : '-'}
|
||||
</Label>
|
||||
<Label color="success" sx={{ marginRight: 0 }}>
|
||||
{dailyMonitoring.status ? dailyMonitoring.status : '-'}
|
||||
</Label>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack spacing={3} sx={{ paddingY: 1, paddingX: 3 }}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6">Subject</Typography>
|
||||
<Typography variant="inherit">
|
||||
{dailyMonitoring.subject
|
||||
? dailyMonitoring.subject
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingBottom: 2 }}>
|
||||
Objektif
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
Body Temperature
|
||||
</Typography>
|
||||
<Stack
|
||||
direction={'row'}
|
||||
sx={{
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
}}
|
||||
>
|
||||
<Label>
|
||||
{dailyMonitoring.time ? dailyMonitoring.time : '-'}
|
||||
</Label>
|
||||
<Label color="success" sx={{ marginRight: 0 }}>
|
||||
{dailyMonitoring.status ? dailyMonitoring.status : '-'}
|
||||
</Label>
|
||||
</Stack>
|
||||
<Divider sx={{ marginY: 2 }} />
|
||||
<Stack spacing={3} sx={{ paddingY: 1, paddingX: 3 }}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6">Subject</Typography>
|
||||
<Typography variant="inherit">
|
||||
{dailyMonitoring.subject
|
||||
? dailyMonitoring.subject
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingBottom: 2 }}>
|
||||
Objektif
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
Body Temperature
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.bodyTemperature
|
||||
? dailyMonitoring.bodyTemperature
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Sistole</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.sistole
|
||||
? dailyMonitoring.sistole
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Diastole</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.diastole
|
||||
? dailyMonitoring.diastole
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
Respiration Rate
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.respirationRate
|
||||
? dailyMonitoring.respirationRate
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Complaints</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.complaints
|
||||
? dailyMonitoring.complaints
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Analysis
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 2 }} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
{dailyMonitoring.analysis
|
||||
? dailyMonitoring.analysis
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Medical Plan :
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack marginLeft={5}>
|
||||
{data.dailyMonitorings ? (
|
||||
<ul style={{ listStyleType: 'disc' }}>
|
||||
{dailyMonitoring.plans.length > 0 ? (
|
||||
dailyMonitoring.plans.map((plan, planIndex) =>
|
||||
plan.type === 1 ? (
|
||||
<li key={planIndex}>{plan.plan}</li>
|
||||
) : null
|
||||
)
|
||||
) : (
|
||||
<li>No plans available</li>
|
||||
)}
|
||||
</ul>
|
||||
) : (
|
||||
'-'
|
||||
)}
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.bodyTemperature
|
||||
? dailyMonitoring.bodyTemperature
|
||||
: '-'}
|
||||
</Typography>
|
||||
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Non Medikamentosa Plan :
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack marginLeft={5}>
|
||||
{data.dailyMonitorings ? (
|
||||
<ul style={{ listStyleType: 'disc' }}>
|
||||
{dailyMonitoring.plans.length > 0 ? (
|
||||
dailyMonitoring.plans.map((plan, planIndex) =>
|
||||
plan.type === 2 ? (
|
||||
<li key={planIndex}>{plan.plan}</li>
|
||||
) : null
|
||||
)
|
||||
) : (
|
||||
<li>No plans available</li>
|
||||
)}
|
||||
</ul>
|
||||
) : (
|
||||
'-'
|
||||
)}
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Sistole</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.sistole
|
||||
? dailyMonitoring.sistole
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Diastole</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.diastole
|
||||
? dailyMonitoring.diastole
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
Respiration Rate
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.respirationRate
|
||||
? dailyMonitoring.respirationRate
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 1 }} spacing={2}>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">Complaints</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
<Grid item xs={6} lg={6} md={6}>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">
|
||||
{dailyMonitoring.complaints
|
||||
? dailyMonitoring.complaints
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Analysis
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} sx={{ paddingY: 2 }} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack>
|
||||
<Typography variant="inherit">
|
||||
{dailyMonitoring.analysis
|
||||
? dailyMonitoring.analysis
|
||||
: '-'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Medical Plan :
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
|
||||
</Grid>
|
||||
</Stack>
|
||||
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
File Document :
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} spacing={2}>
|
||||
<Stack marginLeft={5}>
|
||||
{data.dailyMonitorings ? (
|
||||
<ul style={{ listStyleType: 'disc' }}>
|
||||
{dailyMonitoring.plans.length > 0 ? (
|
||||
dailyMonitoring.plans.map((plan, planIndex) =>
|
||||
plan.type === 1 ? (
|
||||
<li key={planIndex}>{plan.plan}</li>
|
||||
) : null
|
||||
{dailyMonitoring.files.length > 0 ? (
|
||||
dailyMonitoring.files.map((file, fileIndex) =>
|
||||
(
|
||||
<li key={fileIndex}>
|
||||
<a
|
||||
href={file.path}
|
||||
download={file.original_name ? file.original_name : 'test'}
|
||||
style={{ cursor: 'pointer', textDecoration: 'none', color: '#19BBBB' }}
|
||||
target="_blank"
|
||||
>
|
||||
{file.original_name}
|
||||
</a>
|
||||
</li>
|
||||
)
|
||||
)
|
||||
) : (
|
||||
<li>No plans available</li>
|
||||
<li>-</li>
|
||||
)}
|
||||
</ul>
|
||||
) : (
|
||||
'-'
|
||||
<span>-</span>
|
||||
)}
|
||||
</Stack>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Card>
|
||||
)
|
||||
)}
|
||||
</TimelineContent>
|
||||
</TimelineItem>
|
||||
))}
|
||||
</Timeline>
|
||||
) : (
|
||||
<Typography variant="subtitle1" textAlign={'center'}>
|
||||
No Data Found
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</TabPanel>
|
||||
|
||||
</Grid>
|
||||
</Stack>
|
||||
<Stack spacing={1}>
|
||||
<Typography variant="h6" sx={{ paddingTop: 2 }}>
|
||||
Non Medikamentosa Plan :
|
||||
</Typography>
|
||||
</Stack>
|
||||
<Stack direction={'row'} spacing={2}>
|
||||
<Grid item xs={12} lg={12} md={12}>
|
||||
<Stack marginLeft={5}>
|
||||
{data.dailyMonitorings ? (
|
||||
<ul style={{ listStyleType: 'disc' }}>
|
||||
{dailyMonitoring.plans.length > 0 ? (
|
||||
dailyMonitoring.plans.map((plan, planIndex) =>
|
||||
plan.type === 2 ? (
|
||||
<li key={planIndex}>{plan.plan}</li>
|
||||
) : null
|
||||
)
|
||||
<TabPanel value={value} index={1}>
|
||||
<Grid item xs={12} padding={data && data.laboratoriumResults ? 0 : 3}>
|
||||
{data &&
|
||||
data.laboratoriumResults &&
|
||||
Object.keys(data.laboratoriumResults).length > 0 ? (
|
||||
Object.keys(data.laboratoriumResults).map((date, dateIndex) => (
|
||||
<Card
|
||||
sx={{
|
||||
padding: 3,
|
||||
border: '1px solid #919EAB52',
|
||||
boxShadow: 'none',
|
||||
marginTop: 5,
|
||||
}}
|
||||
key={dateIndex}
|
||||
>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">{date ? date : '-'}</Typography>
|
||||
{data.laboratoriumResults[date]?.map((laboratoriumResult, laboratoriumResultIndex) => (
|
||||
<Card key={laboratoriumResultIndex} sx={{ marginTop: 3, paddingX: 2.5, paddingY: 2 }}>
|
||||
<Label>{laboratoriumResult.code || '-'}</Label>
|
||||
<Table sx={{ marginY: 2 }}>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell>Date</TableCell>
|
||||
<TableCell>Examination</TableCell>
|
||||
<TableCell>Location</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
<TableRow>
|
||||
<TableCell><Label>{laboratoriumResult.date || '-'}</Label></TableCell>
|
||||
<TableCell>{laboratoriumResult.examination || '-'}</TableCell>
|
||||
<TableCell>{laboratoriumResult.location || '-'}</TableCell>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableCell>
|
||||
{data.dailyMonitorings ? (
|
||||
<ul style={{ listStyleType: 'disc' }}>
|
||||
{laboratoriumResult.files.length > 0 ? (
|
||||
laboratoriumResult.files.map((file, fileIndex) =>
|
||||
(
|
||||
<li key={fileIndex}>
|
||||
<a
|
||||
href={file.path}
|
||||
download={file.original_name ? file.original_name : 'test'}
|
||||
style={{ cursor: 'pointer', textDecoration: 'none', color: '#19BBBB' }}
|
||||
target="_blank"
|
||||
>
|
||||
{file.original_name}
|
||||
</a>
|
||||
</li>
|
||||
)
|
||||
)
|
||||
) : (
|
||||
<li>-</li>
|
||||
)}
|
||||
</ul>
|
||||
) : (
|
||||
<li>No plans available</li>
|
||||
<span>-</span>
|
||||
)}
|
||||
</ul>
|
||||
) : (
|
||||
'-'
|
||||
)}
|
||||
</Stack>
|
||||
|
||||
</Grid>
|
||||
</Stack>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
</TableBody>
|
||||
</Table>
|
||||
</Card>
|
||||
)
|
||||
)}
|
||||
</TimelineContent>
|
||||
</TimelineItem>
|
||||
))}
|
||||
</Timeline>
|
||||
) : (
|
||||
<Typography variant="subtitle1" textAlign={'center'}>
|
||||
No Data Found
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</TabPanel>
|
||||
|
||||
<TabPanel value={value} index={1}>
|
||||
<Grid item xs={12} padding={data && data.laboratoriumResults ? 0 : 3}>
|
||||
{data &&
|
||||
data.laboratoriumResults &&
|
||||
Object.keys(data.laboratoriumResults).length > 0 ? (
|
||||
Object.keys(data.laboratoriumResults).map((date, dateIndex) => (
|
||||
<Card
|
||||
sx={{
|
||||
padding: 3,
|
||||
border: '1px solid #919EAB52',
|
||||
boxShadow: 'none',
|
||||
marginTop: 5,
|
||||
}}
|
||||
key={dateIndex}
|
||||
>
|
||||
<Stack>
|
||||
<Typography variant="subtitle1">{date ? date : '-'}</Typography>
|
||||
{data.laboratoriumResults[date]?.map((laboratoriumResult, laboratoriumResultIndex) => (
|
||||
<Card key={laboratoriumResultIndex} sx={{ marginTop: 3, paddingX: 2.5, paddingY: 2 }}>
|
||||
<Label>{laboratoriumResult.code || '-'}</Label>
|
||||
<Table sx={{ marginY: 2 }}>
|
||||
<TableHead>
|
||||
<TableRow>
|
||||
<TableCell>Date</TableCell>
|
||||
<TableCell>Examination</TableCell>
|
||||
<TableCell>Location</TableCell>
|
||||
</TableRow>
|
||||
</TableHead>
|
||||
<TableBody>
|
||||
<TableRow>
|
||||
<TableCell><Label>{laboratoriumResult.date || '-'}</Label></TableCell>
|
||||
<TableCell>{laboratoriumResult.examination || '-'}</TableCell>
|
||||
<TableCell>{laboratoriumResult.location || '-'}</TableCell>
|
||||
{/* <TableMoreMenu
|
||||
actions={
|
||||
<>
|
||||
<MenuItem onClick={() => handleDownloadClick(laboratoriumResult.file)}>
|
||||
<DownloadIcon /> Download
|
||||
</MenuItem>
|
||||
</>
|
||||
}
|
||||
/> */}
|
||||
</TableRow>
|
||||
</TableBody>
|
||||
</Table>
|
||||
</Card>
|
||||
))}
|
||||
</Stack>
|
||||
</Card>
|
||||
))
|
||||
) : (
|
||||
<Typography padding={3} variant="subtitle1" textAlign={'center'}>
|
||||
No Data Found
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</TabPanel>
|
||||
</Card>
|
||||
)}
|
||||
</Grid>
|
||||
))}
|
||||
</Stack>
|
||||
</Card>
|
||||
))
|
||||
) : (
|
||||
<Typography padding={3} variant="subtitle1" textAlign={'center'}>
|
||||
No Data Found
|
||||
</Typography>
|
||||
)}
|
||||
</Grid>
|
||||
</TabPanel>
|
||||
</Card>
|
||||
)}
|
||||
</Grid>
|
||||
) : null}
|
||||
</Grid>
|
||||
</Page>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user