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

improvement add/edit dialog

Browse Source
This commit is contained in:
Tb Fajri
2024-07-22 10:54:39 +07:00
parent 195265deee
commit 9c396d1b36
6 changed files with 162 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
Modules/Internal/Http/Controllers/Api/RequestLogController.php
View File

@@ -201,9 +201,13 @@ class RequestLogController extends Controller
return Helper::responseJson(data: RequestLogShowResource::make($claimRequest)); return Helper::responseJson(data: RequestLogShowResource::make($claimRequest));
} }
public function diagnosis(){ public function diagnosis(Request $request){
$icds = Icd::query() $icds = Icd::query()
->get(); ->when($request->search, function ($q, $search) {
$q->where('code', 'LIKE', "%".$search."%");
$q->orWhere('name', 'LIKE', "%".$search."%");
})
->paginate();
$manipulatedIcds = $icds->map(function ($icd) { $manipulatedIcds = $icds->map(function ($icd) {
// Contoh manipulasi, tambahkan atau ubah properti sesuai kebutuhan // Contoh manipulasi, tambahkan atau ubah properti sesuai kebutuhan
@@ -445,9 +449,17 @@ class RequestLogController extends Controller
$requestLog->discharge_date = $request->discharge_date; $requestLog->discharge_date = $request->discharge_date;
} }
if (!empty($request->icdCodes)) { if (!empty($request->icdCodes)) {
$diagnosis = implode(',', $request->icdCodes); $data = [];
if (count($request->icdCodes)>0){
foreach($request->icdCodes as $code){
array_push($data, $code['value']);
}
}
$diagnosis = implode(',', $data);
$requestLog->diagnosis = $diagnosis; $requestLog->diagnosis = $diagnosis;
} else {
$requestLog->diagnosis = '';
} }
if (!empty($request->status)) { if (!empty($request->status)) {
$requestLog->status_final_log = $status; $requestLog->status_final_log = $status;

2
Modules/Internal/Transformers/RequestLogShowResource.php
View File

@@ -112,7 +112,7 @@ class RequestLogShowResource extends JsonResource
$diagnosis = explode(',', $requestLog['diagnosis']); $diagnosis = explode(',', $requestLog['diagnosis']);
$icd = Icd::query() $icd = Icd::query()
->whereIn('code', $diagnosis) ->whereIn('code', $diagnosis)
->select('code', 'name') ->select('code as value', 'name as label')
->get(); ->get();
} }
$memberUsage = Helper::getUsageMember($corporateId, $requestLog['member']['id'], $benefitData); $memberUsage = Helper::getUsageMember($corporateId, $requestLog['member']['id'], $benefitData);

219
frontend/dashboard/src/pages/CustomerService/FinalLog/Components/DialogConfirmation.tsx
View File

@@ -1,6 +1,5 @@
import MuiDialog from "@/components/MuiDialog"; import MuiDialog from "@/components/MuiDialog";
import { Autocomplete, Button, Card, Checkbox, DialogActions, Grid, TextField, Typography } from "@mui/material"; import { Autocomplete, Button, Card, DialogActions, Grid, TextField, Typography } from "@mui/material";
import { Paper } from "@mui/material";
import { Stack } from '@mui/material'; import { Stack } from '@mui/material';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { DetailFinalLogType } from "../Model/Types"; import { DetailFinalLogType } from "../Model/Types";
@@ -33,18 +32,8 @@ export default function DialogConfirmation({requestLog, setOpenDialog, openDialo
{ value: '-', label: '-' } { value: '-', label: '-' }
]); ]);
useEffect(() => { const [searchIcd, setSearchIcd] = useState('');
// Ambil data dari API dan atur opsi ICD
axios.get('diagnosis')
.then((response) => {
setIcdOptions(response.data.data);
})
.catch((error) => {
console.error('Error fetching ICD options:', error);
});
}, []); // useEffect dijalankan hanya sekali saat komponen dimount
useEffect(() => { useEffect(() => {
// Update formData setiap kali approve berubah // Update formData setiap kali approve berubah
setFormData(prevData => ({ setFormData(prevData => ({
@@ -58,7 +47,6 @@ export default function DialogConfirmation({requestLog, setOpenDialog, openDialo
...prevData, ...prevData,
[field]: value, [field]: value,
})); }));
}; };
const handleApprove = () => { const handleApprove = () => {
@@ -68,7 +56,17 @@ export default function DialogConfirmation({requestLog, setOpenDialog, openDialo
})); }));
handleSubmit(); handleSubmit();
}; };
const handleSearch = (search) => {
setSearchIcd(search);
axios.get('diagnosis?search=' + search)
.then((response) => {
setIcdOptions(response.data.data);
})
.catch((error) => {
console.error('Error fetching ICD options:', error);
});
}
const handleSubmit = () => { const handleSubmit = () => {
axios axios
@@ -76,7 +74,7 @@ export default function DialogConfirmation({requestLog, setOpenDialog, openDialo
.then((response) => { .then((response) => {
enqueueSnackbar('Verification Request LOG Success', { variant: 'success' }); enqueueSnackbar('Verification Request LOG Success', { variant: 'success' });
setOpenDialog(false); setOpenDialog(false);
if (requestLog?.service_type == 'Inpatient'){ if (requestLog?.service_type === 'Inpatient') {
navigate('/case_management/inpatient_monitoring'); navigate('/case_management/inpatient_monitoring');
} else { } else {
navigate('/custormer-service/final-log'); navigate('/custormer-service/final-log');
@@ -87,120 +85,117 @@ export default function DialogConfirmation({requestLog, setOpenDialog, openDialo
}); });
} }
const style1 = { const style1 = {
color: '#919EAB', color: '#919EAB',
width: '30%' width: '30%'
} };
const style2 = { const style2 = {
width: '70%' width: '70%'
} };
const marginBottom1 = { const marginBottom1 = {
marginBottom: 1, marginBottom: 1,
} };
const marginBottom2 = { const marginBottom2 = {
marginBottom: 2, marginBottom: 2,
} };
const handleCloseDialog = () => { const handleCloseDialog = () => {
setOpenDialog(false); setOpenDialog(false);
} };
const getContent = () => ( const getContent = () => (
<Stack spacing={1} marginTop={2}> <Stack spacing={1} marginTop={2}>
<Typography variant="subtitle2">Are you sure to {approve == 'approved' ? 'approve' : 'deciline'} this final log ?</Typography> <Typography variant="subtitle2">Are you sure to {approve === 'approved' ? 'approve' : 'decline'} this final log?</Typography>
<Grid item xs={12} md={12} marginTop={4}> <Grid item xs={12} md={12} marginTop={4}>
<Card sx={{padding:2, marginTop:2}} > <Card sx={{ padding: 2, marginTop: 2 }}>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Member ID</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Member ID</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.member_id}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.member_id}</Typography>
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Policy Number</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Policy Number</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.policy_number}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.policy_number}</Typography>
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Name</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Name</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.name}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.name}</Typography>
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Submission Date</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Submission Date</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.submission_date ? fDateTimesecond(requestLog?.submission_date) : '-'}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.submission_date ? fDateTimesecond(requestLog?.submission_date) : '-'}</Typography>
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Claim Method</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Claim Method</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.claim_method ? toTitleCase(requestLog?.claim_method) : '-'}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.claim_method ? toTitleCase(requestLog?.claim_method) : '-'}</Typography>
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Service Type</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Service Type</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.service_type}</Typography> <Typography variant='subtitle2' sx={style2} gutterBottom>{requestLog?.service_type}</Typography>
</Stack> </Stack>
</Card> </Card>
<Card sx={{padding:2, marginTop:2}} > <Card sx={{ padding: 2, marginTop: 2 }}>
<Stack direction='row' spacing={2} sx={marginBottom2}> <Stack direction='row' spacing={2} sx={marginBottom2}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Discharge Date</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Discharge Date</Typography>
<TextField <TextField
label="Discharge Date" label="Discharge Date"
variant="outlined" variant="outlined"
fullWidth fullWidth
type="date" type="date"
value={formData.discharge_date ? fDateOnly(formData.discharge_date) : ''} value={formData.discharge_date ? fDateOnly(formData.discharge_date) : ''}
onChange={(e) => handleChange('discharge_date', e.target.value)} onChange={(e) => handleChange('discharge_date', e.target.value)}
/> />
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom2}> <Stack direction='row' spacing={2} sx={marginBottom2}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Catatan</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Catatan</Typography>
<TextField <TextField
label="Catatan" label="Catatan"
variant="outlined" variant="outlined"
fullWidth fullWidth
value={formData.catatan} value={formData.catatan}
onChange={(e) => handleChange('catatan', e.target.value)} onChange={(e) => handleChange('catatan', e.target.value)}
/> />
</Stack> </Stack>
<Stack direction='row' spacing={2} sx={marginBottom2}> <Stack direction='row' spacing={2} sx={marginBottom2}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Diagnosis ICD - X</Typography> <Typography variant='subtitle2' sx={style1} gutterBottom>Diagnosis ICD - X</Typography>
<Autocomplete <Autocomplete
multiple multiple
options={icdOptions} options={icdOptions}
getOptionLabel={(option) => option.label} getOptionLabel={(option) => option.label}
fullWidth fullWidth
value={icdOptions.filter((icd) => formData.icdCodes.includes(icd.value))} value={formData.icdCodes}
onChange={(e, newValues) => handleChange('icdCodes', newValues.map((value) => value.value))} onChange={(e, newValues) => handleChange('icdCodes', newValues)}
renderInput={(params) => ( inputValue={searchIcd}
<TextField onInputChange={(e, newInputValue) => handleSearch(newInputValue)}
{...params} renderInput={(params) => (
label="Diagnosis ICD - X" <TextField
variant="outlined" {...params}
/> label="Diagnosis ICD - X"
)} variant="outlined"
/> />
</Stack> )}
</Card> />
</Grid> </Stack>
<DialogActions> </Card>
<Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialog}>Cancel</Button> </Grid>
<DialogActions>
<Button variant="outlined" sx={{ color: '#212B36', borderColor: '#919EAB52' }} onClick={handleCloseDialog}>Cancel</Button>
{approve == 'approved' ? ( {approve === 'approved' ? (
<Button color="primary" variant="contained" onClick={() => handleApprove()}>Approve</Button> <Button color="primary" variant="contained" onClick={handleApprove}>Approve</Button>
) : ( ) : (
<Button color="error" variant="contained" onClick={() => handleApprove()}>Decline</Button> <Button color="error" variant="contained" onClick={handleApprove}>Decline</Button>
) } )}
</DialogActions>
</DialogActions>
</Stack> </Stack>
); );
return ( return (
<MuiDialog <MuiDialog
title={{name: "Confirmation"}} title={{ name: "Confirmation" }}
openDialog={openDialog} openDialog={openDialog}
setOpenDialog={setOpenDialog} setOpenDialog={setOpenDialog}
content={getContent()} content={getContent()}
maxWidth="xl" maxWidth="xl"
/> />
); );
} }

66
frontend/dashboard/src/pages/CustomerService/FinalLog/Components/DialogEditFinalLOG.tsx
View File

@@ -26,9 +26,7 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
discharge_date: requestLog?.discharge_date, discharge_date: requestLog?.discharge_date,
id: requestLog?.id, id: requestLog?.id,
catatan: requestLog?.catatan, catatan: requestLog?.catatan,
icdCodes: requestLog?.diagnosis icdCodes: requestLog?.diagnosis,
? requestLog?.diagnosis.map(diagnosis => diagnosis.code)
: [],
reason: requestLog?.reason reason: requestLog?.reason
}); });
@@ -36,8 +34,10 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
{ value: '-', label: '-' } { value: '-', label: '-' }
]); ]);
const [searchIcd, setSearchIcd] = useState('');
useEffect(() => { useEffect(() => {
// Ambil data dari API dan atur opsi ICD // Ambil data dari API dan atur opsi ICD
axios.get('diagnosis') axios.get('diagnosis')
.then((response) => { .then((response) => {
setIcdOptions(response.data.data); setIcdOptions(response.data.data);
@@ -45,23 +45,23 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
.catch((error) => { .catch((error) => {
console.error('Error fetching ICD options:', error); console.error('Error fetching ICD options:', error);
}); });
}, []); // useEffect dijalankan hanya sekali saat komponen dimount }, []); // useEffect dijalankan hanya sekali saat komponen dimount
useEffect(() => { useEffect(() => {
if (requestLog) { if (requestLog) {
setFormData({ setFormData({
discharge_date: requestLog.discharge_date, discharge_date: requestLog.discharge_date,
billing_no: requestLog.billing_no, billing_no: requestLog.billing_no,
invoice_no: requestLog.invoice_no, invoice_no: requestLog.invoice_no,
id: requestLog.id, id: requestLog.id,
catatan: requestLog.catatan, catatan: requestLog.catatan,
icdCodes: requestLog.diagnosis icdCodes: requestLog.diagnosis,
? requestLog.diagnosis.map(diagnosis => diagnosis.code) reason: requestLog.reason
: [], });
reason: requestLog.reason }
}); }, [requestLog]);
}
}, [requestLog]);
const handleChange = (field, value) => { const handleChange = (field, value) => {
setFormData((prevData) => ({ setFormData((prevData) => ({
@@ -80,6 +80,17 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
})); }));
handleSubmit(); handleSubmit();
}; };
const handleSearch = (search) => {
setSearchIcd(search);
axios.get('diagnosis?search=' + search)
.then((response) => {
setIcdOptions(response.data.data);
})
.catch((error) => {
console.error('Error fetching ICD options:', error);
});
}
const handleSubmit = () => { const handleSubmit = () => {
@@ -100,8 +111,7 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
alert('Silakan pilih alasan sebelum mengirimkan data.'); alert('Silakan pilih alasan sebelum mengirimkan data.');
} }
} }
const style1 = { const style1 = {
color: '#919EAB', color: '#919EAB',
width: '30%' width: '30%'
@@ -123,13 +133,10 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
billing_no: requestLog?.billing_no, billing_no: requestLog?.billing_no,
invoice_no: requestLog?.invoice_no, invoice_no: requestLog?.invoice_no,
catatan: requestLog?.catatan, catatan: requestLog?.catatan,
icdCodes: requestLog?.diagnosis icdCodes: requestLog?.diagnosis,
? requestLog?.diagnosis.map(diagnosis => diagnosis.code)
: [],
reason: requestLog?.reason reason: requestLog?.reason
}); });
}; };
const [isReasonSelected, setIsReasonSelected] = useState(true); const [isReasonSelected, setIsReasonSelected] = useState(true);
const handleCloseDialog = () => { const handleCloseDialog = () => {
@@ -227,11 +234,10 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
options={icdOptions} options={icdOptions}
getOptionLabel={(option) => option.label} getOptionLabel={(option) => option.label}
fullWidth fullWidth
value={icdOptions.filter((icd) => formData.icdCodes.includes(icd.value))} value={formData.icdCodes}
onChange={(e, newValues) => { onChange={(e, newValues) => handleChange('icdCodes', newValues)}
const selectedCodes = newValues.map((value) => value.value); inputValue={searchIcd}
setFormData({ ...formData, icdCodes: selectedCodes }); onInputChange={(e, newInputValue) => handleSearch(newInputValue)}
}}
renderInput={(params) => ( renderInput={(params) => (
<TextField <TextField
{...params} {...params}
@@ -247,7 +253,7 @@ export default function DialogEditFinalLOG({requestLog, setOpenDialog, openDialo
options={reasons} options={reasons}
getOptionLabel={(option) => option.label} getOptionLabel={(option) => option.label}
fullWidth fullWidth
value={reasons.find((r) => r.value === formData.reason) || null} // Use find to match the default value value={reasons.find((r) => r.value == formData.reason) || null} // Use find to match the default value
onChange={(e, newValue) => handleChange('reason', newValue?.value)} onChange={(e, newValue) => handleChange('reason', newValue?.value)}
renderInput={(params) => ( renderInput={(params) => (
<TextField <TextField

2
frontend/dashboard/src/pages/CustomerService/FinalLog/Detail.tsx
View File

@@ -256,7 +256,7 @@ export default function Detail() {
{requestLog?.diagnosis?.length > 0 ? ( {requestLog?.diagnosis?.length > 0 ? (
<ul> <ul>
{requestLog.diagnosis.map((diagnosisItem, index) => ( {requestLog.diagnosis.map((diagnosisItem, index) => (
<li key={index}>{diagnosisItem.code} - {diagnosisItem.name}</li> <li key={index}>{diagnosisItem.value} - {diagnosisItem.label}</li>
// Replace 'name' with the property you want to display // Replace 'name' with the property you want to display
))} ))}
</ul> </ul>

4
frontend/dashboard/src/pages/CustomerService/FinalLog/Model/Types.tsx
View File

@@ -65,8 +65,8 @@ export type DetailFinalLogType = {
export type Diagnosis = { export type Diagnosis = {
id : number, id : number,
name : string, value : string,
code : string label : string
} }
export type BenefitData = { export type BenefitData = {