finishing slicing ui client benefit config

This commit is contained in:
korospace
2023-10-30 18:32:50 +07:00
parent e34ec97d27
commit de476ad3be
9 changed files with 497 additions and 29 deletions

View File

@@ -21,6 +21,7 @@ import FormControlLabel from '@mui/material/FormControlLabel';
import Checkbox from '@mui/material/Checkbox';
import { enqueueSnackbar } from 'notistack';
import BenefitConfigurationList from './components/BenefitConfigurationList';
// ----------------------------------------------------------------------
@@ -43,13 +44,13 @@ export default function Detail() {
.then((response) => {
setCustomerData(response.data.data.customer_data);
setDocumentData(response.data.data.documents);
setRequestDocumentData(response.data.data.request_documents);
setRequestDocumentData(response.data.data.request_documents);
})
.catch((error) => {
console.error(error);
});
}, []);
}, []);
function toTitleCase(str) {
return str.replace(/\w\S*/g, function(txt) {
@@ -114,7 +115,7 @@ export default function Detail() {
enqueueSnackbar('Something Went Wrong', { variant: 'error' });
})
}
return (
<Page title='Detail'>
<Container maxWidth={themeStretch ? false : 'xl'}>
@@ -163,7 +164,7 @@ export default function Detail() {
</Grid>
) : ''}
{documentData ? (
<Grid item xs={12} spacing={2}>
<Grid item xs={12}>
<Card sx={{padding: 2}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Additional Documents</Typography>
@@ -175,9 +176,9 @@ export default function Detail() {
{documentData?.map((documentType, index) => (
<Stack direction="column" spacing={2} key={index}>
<Typography variant="Subtitle2" gutterBottom>
{documentType.type === 'claim-diagnosis' ?
{documentType.type === 'claim-diagnosis' ?
'Diagnosis'
: documentType.type === 'claim-kondisi' ?
: documentType.type === 'claim-kondisi' ?
'Condition'
: documentType.type === 'claim-result' ?
'Supporting Result'
@@ -204,13 +205,13 @@ export default function Detail() {
<Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
{requestDocumentData?.map((documentType, index) => (
<Stack direction="column" spacing={2} key={index}>
<Stack direction="row" spacing={1} sx={{color: '#637381'}}>
<InsertDriveFileIcon />
<Typography variant="body2" gutterBottom>
{documentType.type === 'claim-diagnosis' ?
{documentType.type === 'claim-diagnosis' ?
'Diagnosis'
: documentType.type === 'claim-kondisi' ?
: documentType.type === 'claim-kondisi' ?
'Condition'
: documentType.type === 'claim-result' ?
'Supporting Result'
@@ -272,8 +273,8 @@ export default function Detail() {
</Card>
</Grid>
): ''}
<Grid item xs={12} spacing={2}>
<Card sx={{padding: 2}}>
<Grid item xs={12}>
<Card sx={{padding: 3}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>History of Hospital Care</Typography>
<Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}}>
@@ -284,8 +285,8 @@ export default function Detail() {
</Stack>
</Card>
</Grid>
<Grid item xs={12} spacing={2}>
<Card sx={{padding: 2}}>
<Grid item xs={12}>
<Card sx={{padding: 3}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Diagnostic History</Typography>
</Stack>
@@ -293,8 +294,8 @@ export default function Detail() {
</Stack>
</Card>
</Grid>
<Grid item xs={12} spacing={2}>
<Card sx={{padding: 2}}>
<Grid item xs={12}>
<Card sx={{padding: 3}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Diagnosis Summary</Typography>
<Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}}>
@@ -305,8 +306,8 @@ export default function Detail() {
</Stack>
</Card>
</Grid>
<Grid item xs={12} spacing={2}>
<Card sx={{padding: 2}}>
<Grid item xs={12}>
<Card sx={{padding: 3}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Service</Typography>
<Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}}>
@@ -317,13 +318,31 @@ export default function Detail() {
</Stack>
</Card>
</Grid>
<Grid item xs={12} spacing={2}>
<Card sx={{padding: 2}}>
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Client Benefit Configuration</Typography>
</Stack>
<Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
</Stack>
<Grid item xs={12}>
<Card sx={{padding: 3}}>
<Grid container spacing={4}>
{/* title */}
<Grid item xs={12}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}}>Client Benefit Configuration</Typography>
</Grid>
{/* no benefit selected */}
{
false
?
(
<Grid item xs={12}>
<Typography variant='body2' sx={{color: '#919EAB', paddingBottom: '14px', textAlign: 'center'}}>Tidak ada benefit yang dipilih</Typography>
</Grid>
)
:
(
<Grid item xs={12}>
<BenefitConfigurationList />
</Grid>
)
}
</Grid>
</Card>
</Grid>
<Grid item xs={12} md={12}>
@@ -338,4 +357,4 @@ export default function Detail() {
</Container>
</Page>
);
}
}