tbfajri/aso
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

form exclusion specialities done

Browse Source
This commit is contained in:
pajri
2022-12-24 15:10:13 +07:00
parent e15dda0955
commit 9400145990
3 changed files with 373 additions and 248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
Modules/Internal/Http/Controllers/Api/CorporateServiceController.php
View File

@@ -359,6 +359,22 @@ class CorporateServiceController extends Controller
]); ]);
} }
if ($request->type == "plan") {
$value = $request->value;
foreach ($value as $key => $val) {
$item[] = $val['value'];
}
$plan = implode(",", $item);
$exclusion_rule = $exclusion->rules()->updateOrCreate([
'exclusion_id' => $exclusion->id,
'name' => 'plan',
], [
'name' => 'plan',
'values' => $plan,
]);
}
$selected_specialities = CorporateServiceSpeciality::query() $selected_specialities = CorporateServiceSpeciality::query()

18
Modules/Internal/Transformers/CorporateServiceConfigResource.php
View File

@@ -65,10 +65,26 @@ class CorporateServiceConfigResource extends JsonResource
return $speciality->exclusions->first()->rules->where('name', 'min_age')->first()->values ?? ''; return $speciality->exclusions->first()->rules->where('name', 'min_age')->first()->values ?? '';
}); });
$data['exclusions'] = $data['exclusions']->map(function ($item, $key) use ($list_msc, $list_gender, $min_age) { $max_age = $this->specialities->map(function ($speciality) {
return $speciality->exclusions->first()->rules->where('name', 'max_age')->first()->values ?? '';
});
$plan = $this->specialities->map(function ($speciality) {
return $speciality->exclusions->first()->rules->where('name', 'plan')->first()->values ?? null;
});
$data['exclusions'] = $data['exclusions']->map(function ($item, $key) use (
$list_msc,
$list_gender,
$min_age,
$max_age,
$plan,
) {
$item['msc'] = $list_msc[$key]; $item['msc'] = $list_msc[$key];
$item['gender'] = $list_gender[$key]; $item['gender'] = $list_gender[$key];
$item['min_age'] = $min_age[$key]; $item['min_age'] = $min_age[$key];
$item['max_age'] = $max_age[$key];
$item['plan'] = $plan[$key];
return $item; return $item;
}); });

587
frontend/dashboard/src/pages/Corporates/Services/Create.tsx
View File

@@ -3,15 +3,21 @@ import { yupResolver } from '@hookform/resolvers/yup';
import { import {
Autocomplete, Autocomplete,
Box, Box,
Button,
Card, Card,
Checkbox, Checkbox,
Collapse, Collapse,
Dialog,
DialogContent,
DialogTitle,
Divider, Divider,
FormControlLabel, FormControlLabel,
FormGroup, FormGroup,
Grid, Grid,
IconButton,
Modal, Modal,
Paper, Paper,
Popper,
Stack, Stack,
Table, Table,
TableBody, TableBody,
@@ -22,10 +28,24 @@ import {
TextField, TextField,
Typography, Typography,
} from '@mui/material'; } from '@mui/material';
// components
import {
FormProvider,
RHFTextField,
RHFRadioGroup,
RHFUploadAvatar,
RHFSwitch,
RHFSelect,
RHFEditor,
RHFDatepicker,
RHFMultiCheckbox,
RHFCheckbox,
RHFCustomMultiCheckbox,
} from '../../../components/hook-form';
import { useForm } from 'react-hook-form'; import { useForm } from 'react-hook-form';
import { useParams } from 'react-router-dom'; import { useParams } from 'react-router-dom';
import HeaderBreadcrumbs from '../../../components/HeaderBreadcrumbs'; import HeaderBreadcrumbs from '../../../components/HeaderBreadcrumbs';
import { FormProvider, RHFCheckbox, RHFSelect, RHFTextField } from '../../../components/hook-form';
import Page from '../../../components/Page'; import Page from '../../../components/Page';
import useSettings from '../../../hooks/useSettings'; import useSettings from '../../../hooks/useSettings';
import CorporateTabNavigations from '../CorporateTabNavigations'; import CorporateTabNavigations from '../CorporateTabNavigations';
@@ -34,6 +54,10 @@ import { ChangeEvent, useEffect, useMemo, useState } from 'react';
import axios from '../../../utils/axios'; import axios from '../../../utils/axios';
import { CorporateService } from '../../../@types/corporates'; import { CorporateService } from '../../../@types/corporates';
import { InfoIcon } from '../../../theme/overrides/CustomIcons'; import { InfoIcon } from '../../../theme/overrides/CustomIcons';
import { includes, set } from 'lodash';
import { array } from 'yup/lib/locale';
import CancelIcon from '@mui/icons-material/Cancel';
import { enqueueSnackbar, useSnackbar } from 'notistack';
export default function Divisions() { export default function Divisions() {
const { themeStretch } = useSettings(); const { themeStretch } = useSettings();
@@ -86,22 +110,8 @@ export default function Divisions() {
}); });
}; };
// const [configExclusions, setConfigExclusions] = useState([]);
// console.log('Config Exclusions', configExclusions);
// const handleConfigExclusion = (event: ChangeEvent<HTMLInputElement>, speciality: any) => {
// setConfigExclusions({
// ...configExclusions,
// [event.target.name]: event.target.checked,
// });
// };
const [exclusion, setExclusion] = useState([]); const [exclusion, setExclusion] = useState([]);
console.log('Exclusions', exclusion);
const handleConfigExclusion = ( const handleConfigExclusion = (
event: ChangeEvent<HTMLInputElement>, event: ChangeEvent<HTMLInputElement>,
service: any, service: any,
@@ -110,23 +120,33 @@ export default function Divisions() {
type: string type: string
) => { ) => {
console.log(event.target.checked, service, speciality, value, type); console.log(event.target.checked, service, speciality, value, type);
try {
axios axios
.post(`/corporates/${corporate_id}/services/${service_code}/specialities/exclusion`, { .post(`/corporates/${corporate_id}/services/${service_code}/specialities/exclusion`, {
// service_code: service.service_code, // service_code: service.service_code,
speciality_id: speciality.id, speciality_id: speciality.id,
checked: event.target.checked ? '1' : '0', checked: event.target.checked ? '1' : '0',
value: value, value: value,
type: type, type: type,
}) })
.then((res) => { .then((res) => {
console.log('update', res.data); console.log('update', res.data);
setService({ setService({
...service, ...service,
selected_specialities: res.data?.selected_specialities, selected_specialities: res.data?.selected_specialities,
exclusions: res.data?.service?.exclusions, exclusions: res.data?.service?.exclusions,
});
}); });
enqueueSnackbar('Exclusion Updated', {
variant: 'success',
}); });
} catch (error) {
console.log(error);
enqueueSnackbar('Exclusion Update Failed', {
variant: 'error',
});
}
}; };
const handleToggleSpeciality = ( const handleToggleSpeciality = (
@@ -135,25 +155,35 @@ export default function Divisions() {
speciality: any speciality: any
) => { ) => {
console.log('Changing Service ', service, 'and', speciality); console.log('Changing Service ', service, 'and', speciality);
axios try {
.post(`/corporates/${corporate_id}/services/${service_code}/specialities`, { axios
// service_code: service.service_code, .post(`/corporates/${corporate_id}/services/${service_code}/specialities`, {
speciality_id: speciality.id, // service_code: service.service_code,
active: event.target.checked ? '1' : '0', speciality_id: speciality.id,
}) active: event.target.checked ? '1' : '0',
.then((res) => { })
setService({ .then((res) => {
...service, setService({
selected_specialities: res.data, ...service,
}); selected_specialities: res.data,
// let newConfigurations = service.configurations });
// newConfigurations[res.data.name] = res.data.value == true // let newConfigurations = service.configurations
// newConfigurations[res.data.name] = res.data.value == true
// setService({ // setService({
// ...service, // ...service,
// configurations: { ...newConfigurations } // configurations: { ...newConfigurations }
// }) // })
enqueueSnackbar('Speciality Updated', {
variant: 'success',
});
});
} catch (error) {
console.log(error);
enqueueSnackbar('Speciality Update Failed', {
variant: 'error',
}); });
}
}; };
const specialityModalStyle = { const specialityModalStyle = {
@@ -161,8 +191,8 @@ export default function Divisions() {
top: '50%', top: '50%',
left: '50%', left: '50%',
transform: 'translate(-50%, -50%)', transform: 'translate(-50%, -50%)',
width: '80%', width: '90%',
maxHeight: '80%', maxHeight: '90%',
overflowY: 'scroll', overflowY: 'scroll',
bgcolor: 'background.paper', bgcolor: 'background.paper',
border: '2px solid gray', border: '2px solid gray',
@@ -194,6 +224,9 @@ export default function Divisions() {
const [minAge, setMinAge] = useState(''); const [minAge, setMinAge] = useState('');
const [maxAge, setMaxAge] = useState(''); const [maxAge, setMaxAge] = useState('');
const [valuePlan, setValuePlan] = useState([]);
console.log('plan', valuePlan);
const handleMinAge = (event: ChangeEvent<HTMLInputElement>) => { const handleMinAge = (event: ChangeEvent<HTMLInputElement>) => {
setMinAge(event.target.value); setMinAge(event.target.value);
@@ -203,23 +236,27 @@ export default function Divisions() {
setMaxAge(event.target.value); setMaxAge(event.target.value);
}; };
const getMinAge = (service: any, speciality: any) => { const handlePlanChange = (event: ChangeEvent<HTMLInputElement>, value: any) => {
let minAge = ''; setValuePlan(value);
if (service.exclusions) {
service.exclusions.map((exclusion: any) => {
if (exclusion.speciality_id == speciality.id) {
minAge = exclusion.min_age;
}
});
}
return minAge;
}; };
console.log('minAge', minAge); // const [currentValuePlan, setCurrentValuePlan] = useState([]);
console.log('maxAge', maxAge);
const converToArray = (value: any) => {
console.log('value', value);
if (value == null) {
return null;
}
const array = value.split(',') ?? [];
const currentValuePlan = array.map((item: any) => ({
value: item,
label: item,
}));
console.log('currentValuePlan', currentValuePlan);
return currentValuePlan;
};
console.log('Service _exclusions', service.exclusions);
return ( return (
<Page title="Create Benefit"> <Page title="Create Benefit">
<HeaderBreadcrumbs <HeaderBreadcrumbs
@@ -248,7 +285,7 @@ export default function Divisions() {
<Grid container spacing={2}> <Grid container spacing={2}>
<Grid item xs={12}> <Grid item xs={12}>
<Card sx={{ p: 2 }}> <Card sx={{ p: 2 }}>
{/* <FormProvider methods={methods} onSubmit={handleSubmit(onSubmit)}> */} {/* <FormProvider methods={methods}> */}
<Box sx={{ borderBottom: 1 }}> <Box sx={{ borderBottom: 1 }}>
<Stack> <Stack>
<TableContainer sx={{ mb: 4 }}> <TableContainer sx={{ mb: 4 }}>
@@ -423,213 +460,269 @@ export default function Divisions() {
</Table> </Table>
</TableContainer> </TableContainer>
<Modal <Dialog
open={specialityModal} open={specialityModal}
onClose={() => { onClose={() => {
setSpecialityModal(false); setSpecialityModal(false);
}} }}
sx={{
'& .MuiDialog-paper': {
width: '100%',
maxWidth: 1500,
maxHeight: 750,
bgcolor: 'background.paper',
boxShadow: 24,
},
}}
aria-labelledby="modal-modal-title" aria-labelledby="modal-modal-title"
aria-describedby="modal-modal-description" aria-describedby="modal-modal-description"
> >
<Box sx={specialityModalStyle}> <DialogTitle>
<Typography id="modal-modal-title" variant="h6" component="h2" sx={{ pb: 4 }}> <Stack
Specialities spacing={2}
</Typography> direction="row"
<TableContainer component={Paper}> justifyContent={'space-between'}
<Table aria-label="simple table"> sx={{ mb: 4, pb: 2, borderBottom: 1, borderColor: 'divider' }}
<TableHead> alignItems="center"
<TableRow> >
<TableCell>Covered</TableCell> <Typography id="modal-modal-title" variant="h6" component="h2">
Specialities
<TableCell sx={{ width: 10 }}>Nama Spesialisasi</TableCell> </Typography>
<TableCell align="center">MSC</TableCell> <Button
<TableCell align="center">Gender</TableCell> sx={{ color: 'red' }}
<TableCell align="center">Min Age</TableCell> aria-label="close"
<TableCell align="center">Max Age</TableCell> onClick={() => setSpecialityModal(false)}
<TableCell align="center">Plan</TableCell> >
</TableRow> <CancelIcon />
</TableHead> </Button>
<TableBody> </Stack>
{specialities.map((row) => ( </DialogTitle>
<TableRow <DialogContent>
key={row.name} <Box>
sx={{ '&:last-child td, &:last-child th': { border: 0 } }} <TableContainer component={Paper}>
> <Table aria-label="simple table">
<TableCell> <TableHead>
<Checkbox <TableRow>
checked={Object.keys(service.selected_specialities).includes( <TableCell>Covered</TableCell>
String(row.id) <TableCell sx={{ width: 10 }}>Nama Spesialisasi</TableCell>
)} <TableCell align="center">MSC</TableCell>
onChange={(event) => { <TableCell align="center">Gender</TableCell>
handleToggleSpeciality(event, service, row); <TableCell sx={{ width: 100 }} align="center">
}} Min Age
name="vitamins"
/>
</TableCell> </TableCell>
<TableCell component="th" scope="row"> <TableCell sx={{ width: 100 }} align="center">
{row.name} Max Age
</TableCell> </TableCell>
<TableCell align="center"> <TableCell align="center">Plan</TableCell>
<Stack direction="row" spacing={2} justifyContent="center"> </TableRow>
{/* {listMsc.map((list) => ( </TableHead>
<TableBody>
{specialities.map((row) => (
<TableRow
key={row.id}
sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
>
<TableCell>
<Checkbox
checked={Object.keys(service.selected_specialities).includes(
String(row.id)
)}
onChange={(event) => {
handleToggleSpeciality(event, service, row);
}}
/>
</TableCell>
<TableCell component="th" scope="row">
{row.name}
</TableCell>
<TableCell align="center">
<Stack direction="row" spacing={2} justifyContent="center">
<FormControlLabel <FormControlLabel
key={list.id}
control={ control={
<Checkbox <Checkbox
checked={service.exclusions checked={service.exclusions.find(
.map((item) => item.speciality_id == 2) (item) =>
.includes(row.id)} item.speciality_id == row.id && item.msc?.m == '1'
)}
onChange={(event) => { onChange={(event) => {
handleConfigExclusion(event, service, row, 'msc'); handleConfigExclusion(event, service, row, 'm', 'msc');
}} }}
/> />
} }
label={list.name} label="Member"
/> />
))} */} <FormControlLabel
control={
<Checkbox
checked={service.exclusions.find(
(item) =>
item.speciality_id == row.id && item.msc?.s == '1'
)}
onChange={(event) => {
handleConfigExclusion(event, service, row, 's', 'msc');
}}
/>
}
label="Spouse"
/>
<FormControlLabel
control={
<Checkbox
checked={service.exclusions.find(
(item) =>
item.speciality_id == row.id && item.msc?.c == '1'
)}
onChange={(event) => {
handleConfigExclusion(event, service, row, 'c', 'msc');
}}
/>
}
label="Child"
/>
</Stack>
</TableCell>
<TableCell align="center">
<Stack direction="row" spacing={2} justifyContent="center">
<FormControlLabel
control={
<Checkbox
checked={service.exclusions.find(
(item) =>
item.speciality_id == row.id &&
item.gender?.male == '1'
)}
onChange={(event) => {
handleConfigExclusion(
event,
service,
row,
'male',
'gender'
);
}}
/>
}
label="Male"
/>
<FormControlLabel
control={
<Checkbox
checked={service.exclusions.find(
(item) =>
item.speciality_id == row.id &&
item.gender?.female == '1'
)}
onChange={(event) => {
handleConfigExclusion(
event,
service,
row,
'female',
'gender'
);
}}
/>
}
label="Female"
/>
</Stack>
</TableCell>
<FormControlLabel <TableCell align="center">
control={ <TextField
<Checkbox id="outlined-number"
checked={service.exclusions.find( type="number"
(item) => defaultValue={
item.speciality_id == row.id && item.msc?.m == '1' service.exclusions.find(
)} (item) => item.speciality_id == row.id
onChange={(event) => { )?.min_age
handleConfigExclusion(event, service, row, 'm', 'msc');
}}
/>
} }
label="Member" onChange={(event) => {
handleMinAge(event);
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
handleConfigExclusion(
event,
service,
row,
minAge,
'min_age'
);
}
}}
/> />
<FormControlLabel </TableCell>
control={ <TableCell align="center">
<Checkbox <TextField
checked={service.exclusions.find( id="outlined-number"
(item) => type="number"
item.speciality_id == row.id && item.msc?.s == '1' defaultValue={
)} service.exclusions.find(
onChange={(event) => { (item) => item.speciality_id == row.id
handleConfigExclusion(event, service, row, 's', 'msc'); )?.max_age
}}
/>
} }
label="Spouse" onChange={(event) => {
handleMaxAge(event);
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
handleConfigExclusion(
event,
service,
row,
maxAge,
'max_age'
);
}
}}
/> />
<FormControlLabel </TableCell>
control={ <TableCell align="center">
<Checkbox <Autocomplete
checked={service.exclusions.find( id="combo-box-demo"
(item) => options={plans}
item.speciality_id == row.id && item.msc?.c == '1' multiple
)} limitTags={1}
onChange={(event) => { fullWidth
handleConfigExclusion(event, service, row, 'c', 'msc'); getOptionLabel={(option) => option.label}
}} defaultValue={
/> converToArray(
service.exclusions.find(
(item) => item.speciality_id == row.id
)?.plan
) || []
} }
label="Child" isOptionEqualToValue={(option, value) =>
option.value === value.value
}
onChange={(event, value) => {
handlePlanChange(event, value);
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
handleConfigExclusion(
event,
service,
row,
valuePlan,
'plan'
);
}
}}
renderInput={(params) => (
<TextField {...params} label="Plan" variant="outlined" />
)}
/> />
</Stack> </TableCell>
</TableCell> </TableRow>
<TableCell align="center"> ))}
<Stack direction="row" spacing={2} justifyContent="center"> </TableBody>
<FormControlLabel </Table>
control={ </TableContainer>
<Checkbox </Box>
checked={service.exclusions.find( </DialogContent>
(item) => </Dialog>
item.speciality_id == row.id && item.gender?.male == '1'
)}
onChange={(event) => {
handleConfigExclusion(
event,
service,
row,
'male',
'gender'
);
}}
/>
}
label="Male"
/>
<FormControlLabel
control={
<Checkbox
checked={service.exclusions.find(
(item) =>
item.speciality_id == row.id &&
item.gender?.female == '1'
)}
onChange={(event) => {
handleConfigExclusion(
event,
service,
row,
'female',
'gender'
);
}}
/>
}
label="Female"
/>
</Stack>
</TableCell>
<TableCell align="center">
<TextField
id="outlined-number"
type="number"
// value={
// service.exclusions.find((item) => item.speciality_id == row.id)
// ?.min_age
// }
onChange={(event) => {
handleMinAge(event);
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
handleConfigExclusion(event, service, row, minAge, 'min_age');
}
}}
/>
</TableCell>
<TableCell align="center">
<TextField
id="outlined-number"
type="number"
onChange={(event) => {
handleMaxAge(event);
}}
onKeyDown={(event) => {
if (event.key === 'Enter') {
handleConfigExclusion(event, service, row, maxAge, 'max_age');
}
}}
/>
</TableCell>
<TableCell align="center">
<Autocomplete
id="combo-box-demo"
options={plans}
multiple
getOptionLabel={(option) => option.label}
style={{ width: 200 }}
renderInput={(params) => (
<TextField {...params} label="Plan" variant="outlined" />
)}
/>
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</TableContainer>
</Box>
</Modal>
<TableContainer sx={{ mb: 4 }}> <TableContainer sx={{ mb: 4 }}>
<Table sx={{ minWidth: 650 }} size="small"> <Table sx={{ minWidth: 650 }} size="small">