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

detail dan add document dan hapus di claim request

Browse Source
This commit is contained in:
Tb Fajri
2024-02-21 11:25:37 +07:00
parent 806e6d2749
commit 2b38a904d0
9 changed files with 1065 additions and 343 deletions
Download Patch File Download Diff File Expand all files Collapse all files

177
Modules/Internal/Http/Controllers/Api/ClaimRequestController.php
View File

@@ -516,89 +516,102 @@ class ClaimRequestController extends Controller
public function claimRequestDetail($claimRequestId) public function claimRequestDetail($claimRequestId)
{ {
$status = DB::table('claim_requests') // $status = DB::table('claim_requests')
->leftJoin('claims', 'claim_requests.id', '=', 'claims.claim_request_id') // ->leftJoin('claims', 'claim_requests.id', '=', 'claims.claim_request_id')
->leftJoin('members', 'claim_requests.member_id', '=', 'members.id') // ->leftJoin('members', 'claim_requests.member_id', '=', 'members.id')
->leftJoin('corporate_employees', 'members.id', '=', 'corporate_employees.member_id') // ->leftJoin('corporate_employees', 'members.id', '=', 'corporate_employees.member_id')
->leftJoin('corporate_divisions', 'corporate_employees.division_id', '=', 'corporate_divisions.id') // ->leftJoin('corporate_divisions', 'corporate_employees.division_id', '=', 'corporate_divisions.id')
->where('claim_requests.id', '=', $claimRequestId) // ->where('claim_requests.id', '=', $claimRequestId)
->select( // ->select(
'claim_requests.submission_date', // 'claim_requests.submission_date',
'claim_requests.code', // 'claim_requests.code',
DB::raw(' // DB::raw('
CASE // CASE
WHEN claim_requests.status = "requested" THEN "requested" // WHEN claim_requests.status = "requested" THEN "requested"
WHEN claim_requests.status = "approved" AND claims.status = "approved" THEN "approved" // WHEN claim_requests.status = "approved" AND claims.status = "approved" THEN "approved"
WHEN claim_requests.status = "approved" AND claims.status = "declined" THEN "declined" // WHEN claim_requests.status = "approved" AND claims.status = "declined" THEN "declined"
WHEN claim_requests.status = "approved" AND claims.status = "disbrusmented" THEN "disbrusmented" // WHEN claim_requests.status = "approved" AND claims.status = "disbrusmented" THEN "disbrusmented"
/*WHEN claim_requests.status = "approved" AND claims.status = "received" THEN "pending"*/ // /*WHEN claim_requests.status = "approved" AND claims.status = "received" THEN "pending"*/
WHEN claim_requests.status = "approved" AND claims.status = "received" THEN "reviewed" // WHEN claim_requests.status = "approved" AND claims.status = "received" THEN "reviewed"
ELSE "" // ELSE ""
END AS status // END AS status
') // ')
) // )
->first(); // ->first();
$results['status'] = $status; // $results['status'] = $status;
$timeline = DB::table('claim_logs') // $timeline = DB::table('claim_logs')
->where('claim_logs.claim_request_id', '=', $claimRequestId) // ->where('claim_logs.claim_request_id', '=', $claimRequestId)
->select( // ->select(
DB::raw(' // DB::raw('
CASE // CASE
WHEN claim_logs.status = "requested" THEN "Request" // WHEN claim_logs.status = "requested" THEN "Request"
WHEN claim_logs.status = "reviewed" THEN "Review" // WHEN claim_logs.status = "reviewed" THEN "Review"
WHEN claim_logs.status = "approved" THEN "Approval" // WHEN claim_logs.status = "approved" THEN "Approval"
WHEN claim_logs.status = "declined" THEN "Decline" // WHEN claim_logs.status = "declined" THEN "Decline"
ELSE "-" // ELSE "-"
END AS txt_status // END AS txt_status
'), // '),
DB::raw(' // DB::raw('
CASE // CASE
WHEN claim_logs.status = "requested" THEN "#159C9C" // WHEN claim_logs.status = "requested" THEN "#159C9C"
WHEN claim_logs.status = "reviewed" THEN "#0C53B7" // WHEN claim_logs.status = "reviewed" THEN "#0C53B7"
WHEN claim_logs.status = "approved" THEN "#229A16" // WHEN claim_logs.status = "approved" THEN "#229A16"
WHEN claim_logs.status = "declined" THEN "#FF4842" // WHEN claim_logs.status = "declined" THEN "#FF4842"
ELSE "-" // ELSE "-"
END AS txt_status_color // END AS txt_status_color
'), // '),
DB::raw(' // DB::raw('
CASE // CASE
WHEN claim_logs.status = "requested" THEN "#00AB5529" // WHEN claim_logs.status = "requested" THEN "#00AB5529"
WHEN claim_logs.status = "reviewed" THEN "#1890FF29" // WHEN claim_logs.status = "reviewed" THEN "#1890FF29"
WHEN claim_logs.status = "approved" THEN "#54D62C29" // WHEN claim_logs.status = "approved" THEN "#54D62C29"
WHEN claim_logs.status = "declined" THEN "#FF48427A" // WHEN claim_logs.status = "declined" THEN "#FF48427A"
ELSE "-" // ELSE "-"
END AS txt_status_backgroundColor // END AS txt_status_backgroundColor
'), // '),
'claim_logs.date', // 'claim_logs.date',
'claim_logs.description', // 'claim_logs.description',
'claim_logs.status' // 'claim_logs.status'
) // )
->orderBy('claim_logs.id', 'desc') // ->orderBy('claim_logs.id', 'desc')
->get(); // ->get();
$results['timeline'] = $timeline; // $results['timeline'] = $timeline;
$request_files = DB::table('claim_request_files') // $request_files = DB::table('claim_request_files')
->where('claim_request_files.claim_request_id', '=', $claimRequestId) // ->where('claim_request_files.claim_request_id', '=', $claimRequestId)
->select( // ->select(
'claim_request_files.*', // 'claim_request_files.*',
DB::raw('(SELECT files.fileable_id FROM files WHERE files.fileable_id = claim_request_files.claim_request_id AND files.type = claim_request_files.type LIMIT 1) AS check_files'), // DB::raw('(SELECT files.fileable_id FROM files WHERE files.fileable_id = claim_request_files.claim_request_id AND files.type = claim_request_files.type LIMIT 1) AS check_files'),
) // )
->get(); // ->get();
$results['request_files'] = $request_files; // $results['request_files'] = $request_files;
$documents = DB::table('files') // $documents = DB::table('files')
->where('fileable_type', 'App\Models\ClaimRequest') // ->where('fileable_type', 'App\Models\ClaimRequest')
->where('fileable_id', $claimRequestId) // ->where('fileable_id', $claimRequestId)
->select('original_name', \DB::raw("CONCAT('" . env('APP_URL') . "/storage/', path) as path"), 'type') // ->select('original_name', \DB::raw("CONCAT('" . env('APP_URL') . "/storage/', path) as path"), 'type')
->orderBy('id', 'desc') // ->orderBy('id', 'desc')
->get(); // ->get();
$results['documents'] = $documents; // $results['documents'] = $documents;
$dialog_submits = DB::table('claim_requests') // $dialog_submits = DB::table('claim_requests')
->leftJoin('members', 'claim_requests.member_id','=', 'members.id') // ->leftJoin('members', 'claim_requests.member_id','=', 'members.id')
->where('claim_requests.id', $claimRequestId) // ->where('claim_requests.id', $claimRequestId)
->select('claim_requests.code', 'members.name', 'claim_requests.submission_date', 'claim_requests.service_code','claim_requests.status') // ->select('claim_requests.code', 'members.name', 'claim_requests.submission_date', 'claim_requests.service_code','claim_requests.status')
->first(); // ->first();
$results['dialog_submits'] = $dialog_submits; // $results['dialog_submits'] = $dialog_submits;
return Helper::responseJson($results); // return Helper::responseJson($results);
$claimRequest = ClaimRequest::findOrFail($claimRequestId);
$claimRequest->load([
'requestLog',
'requestLog.organization',
'requestLog.member',
'member.currentPlan' => function($memberPlan) {
$memberPlan->join('claim_requests', 'claim_requests.service_code', '=', 'plans.service_code');
},
'requestLog.files',
]);
return Helper::responseJson(data: ClaimRequestShowResource::make($claimRequest));
} }
public function invoiceFiles(Request $request, $claim_id) public function invoiceFiles(Request $request, $claim_id)

6
Modules/Internal/Http/Controllers/Api/ReportLogController.php
View File

@@ -104,8 +104,8 @@ class ReportLogController extends Controller
*/ */
public function show($id) public function show($id)
{ {
$claimRequest = RequestLog::findOrFail($id); $requestLog = RequestLog::findOrFail($id);
$claimRequest->load([ $requestLog->load([
'histories' => function ($history) { 'histories' => function ($history) {
$history->latest(); $history->latest();
}, },
@@ -120,7 +120,7 @@ class ReportLogController extends Controller
]); ]);
return Helper::responseJson(data: RequestLogShowResource::make($claimRequest)); return Helper::responseJson(data: RequestLogShowResource::make($requestLog));
} }
/** /**

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

@@ -439,6 +439,7 @@ class RequestLogController extends Controller
'path' => $pathFile, 'path' => $pathFile,
'created_by' => auth()->user()->id, 'created_by' => auth()->user()->id,
'updated_by' => auth()->user()->id, 'updated_by' => auth()->user()->id,
'reason' => $request->reason,
]); ]);
} }
} }
@@ -876,6 +877,7 @@ class RequestLogController extends Controller
'path' => $pathFile, 'path' => $pathFile,
'created_by' => auth()->user()->id, 'created_by' => auth()->user()->id,
'updated_by' => auth()->user()->id, 'updated_by' => auth()->user()->id,
'reason' => $request->reason,
]); ]);
} }
} }
@@ -891,6 +893,7 @@ class RequestLogController extends Controller
'path' => $pathFile, 'path' => $pathFile,
'created_by' => auth()->user()->id, 'created_by' => auth()->user()->id,
'updated_by' => auth()->user()->id, 'updated_by' => auth()->user()->id,
'reason' => $request->reason,
]); ]);
} }
} }
@@ -906,6 +909,7 @@ class RequestLogController extends Controller
'path' => $pathFile, 'path' => $pathFile,
'created_by' => auth()->user()->id, 'created_by' => auth()->user()->id,
'updated_by' => auth()->user()->id, 'updated_by' => auth()->user()->id,
'reason' => $request->reason,
]); ]);
} }
} }

77
Modules/Internal/Transformers/ClaimRequestShowResource.php
View File

@@ -5,6 +5,14 @@ namespace Modules\Internal\Transformers;
use Illuminate\Http\Resources\Json\JsonResource; use Illuminate\Http\Resources\Json\JsonResource;
use Illuminate\Support\Str; use Illuminate\Support\Str;
use App\Models\Service; use App\Models\Service;
use App\Models\MemberPlan;
use App\Models\Plan;
use App\Models\CorporateBenefit;
use App\Models\RequestLogBenefit;
use App\Models\CorporatePolicy;
use App\Models\RequestLogMedicine;
use App\Models\Organization;
use App\Helpers\Helper;
class ClaimRequestShowResource extends JsonResource class ClaimRequestShowResource extends JsonResource
{ {
@@ -17,34 +25,57 @@ class ClaimRequestShowResource extends JsonResource
public function toArray($request) public function toArray($request)
{ {
$data = parent::toArray($request); $data = parent::toArray($request);
$corporateId = $data['member']['current_plan']['corporate_id'] ?? 0;
$planMember = MemberPlan::where('member_id', $data['member_id'])->get('plan_id');
$service = Service::where('code',$data['service_code'])->first(); $planId = Plan::whereIn('id', $planMember)->where('service_code', $data['service_code'])->first();
if($service){ $benefit = CorporateBenefit::with('benefit')->where('plan_id', $planId->id)->get()->toArray();
$serviceName = $service->name; $benefitDetailLog = RequestLogBenefit::with('benefit')->where('request_log_id', $data['request_log_id'])->get()->toArray();
} else { $medicineDetailLog = RequestLogMedicine::where('request_log_id', $data['request_log_id'])->get()->toArray();
$serviceName = '-';
$benefitData = [];
if (count($benefit)){
foreach($benefit as $row){
array_push($benefitData, $row['benefit']);
}
} }
$data['service_name'] = $serviceName; // Policy Number
$policyNumber = CorporatePolicy::query()
->where('corporate_id', $corporateId)
->first();
// Map Histories to Group by Dates
$historiesGroupByDate = $this->histories->mapToGroups(function($history) { $response = [
return [$history->created_at->format('Y-m-d') => $history]; 'id' => $data['id'],
}); 'code' => $data['code'],
$data['histories_by_date'] = []; 'request_log_id' => $data['request_log_id'],
foreach ($historiesGroupByDate as $date => $histories) { 'provider' => $data['request_log']['organization']['name'],
$data['histories_by_date'][] = [ 'member_id' => $data['request_log']['member']['member_id'],
'date' => $date, 'policy_number' => $policyNumber->code ? $policyNumber->code : '-',
'histories' => $histories 'name' => $data['request_log']['member']['name'],
]; 'date_of_birth' => $data['request_log']['member']['birth_date'],
} 'gender' => $data['request_log']['member']['gender'],
'marital_status' => $data['request_log']['member']['status_marital'],
'member_type' => Helper::memberType($data['request_log']['member']['record_type']),
'principal_id' => $data['request_log']['member']['principal_id'] ? $data['request_log']['member']['principal_id'] : '-',
'principal_name' => $data['request_log']['member']['principal_id'] ? Helper::principalName($data['request_log']['member']['principal_id']) : '-',
'relation_with_principal' => Helper::relationWithPrincipal($data['request_log']['member']['relation_with_principal']),
'submission_date' => $data['submission_date'],
'no_identitas' => $data['request_log']['member']['nric'],
'keterangan' => $data['request_log']['keterangan'],
'hak_kamar_pasien' => $data['request_log']['hak_kamar_pasien'],
'penempatan_kamar' => $data['request_log']['penempatan_kamar'],
'catatan' => $data['request_log']['catatan'],
'service_type' => Helper::serviceName( $data['request_log']['service_code']),
'claim_method' => $data['request_log']['payment_type'],
'files' => $data['request_log']['files'],
'benefit' => $benefitData,
'benefit_data' => $benefitDetailLog,
];
// Map Files by type
$filesGroupByType = $this->files->mapToGroups(function($file) {
return [Str::slug($file->type, '_') => $file];
});
$data['files_by_type'] = $filesGroupByType;
return $data; return $response;
} }
} }

5
app/Models/ClaimRequest.php
View File

@@ -209,6 +209,11 @@ class ClaimRequest extends Model
return $this->hasMany(Claim::class, 'claim_request_id'); return $this->hasMany(Claim::class, 'claim_request_id');
} }
public function requestLog()
{
return $this->hasOne(RequestLog::class, 'id', 'request_log_id');
}
public function files() public function files()
{ {
return $this->morphMany(File::class, 'fileable'); return $this->morphMany(File::class, 'fileable');

140
frontend/dashboard/src/pages/ClaimRequests/Components/DialogDeleteFileLog.tsx Normal file
View File

@@ -0,0 +1,140 @@
import MuiDialog from "@/components/MuiDialog";
import { Autocomplete, Button, Card, Checkbox, DialogActions, Grid, Typography } from "@mui/material";
import { Paper } from "@mui/material";
import { Stack } from '@mui/material';
import React, { useEffect, useState } from 'react';
import { fDateTimesecond, toTitleCase } from "@/utils/formatTime";
import axios from "@/utils/axios";
import { enqueueSnackbar } from "notistack";
import { useNavigate } from "react-router";
import { TextField } from "@mui/material";
type DialogDeleteType = {
openDialog: boolean;
setOpenDialog: any;
onSubmit?: void;
id: number|undefined;
path: string;
}
export default function DialogDeleteFileLog({id, path, setOpenDialog, openDialog,onSubmit} : DialogDeleteType ) {
const style1 = {
color: '#919EAB',
width: '30%'
}
const style2 = {
width: '70%'
}
const marginBottom2 = {
marginBottom: 2,
}
const handleCloseDialog = () => {
setOpenDialog(false);
resetForm();
}
const [isReasonSelected, setIsReasonSelected] = useState(false);
const reasons = [
{ value: 'Wrong Setting', label: 'Wrong Setting' },
{ value: 'Hospital Request', label: 'Hospital Request' }
];
const [formData, setFormData] = useState({
path: path,
reason: null
});
const resetForm = () => {
setFormData({
reason: null,
path: path
});
};
useEffect(() => {
// Update formData setiap kali approve berubah
setFormData(prevData => ({
...prevData,
path: path || '',
}));
}, [path]);
const handleChange = (field, value) => {
setFormData((prevData) => ({
...prevData,
[field]: value,
}));
if (field === 'reason') {
setIsReasonSelected(!!value);
}
};
const handleSubmit = () => {
if (isReasonSelected && formData.reason !== '') {
console.log(formData)
axios
.post(`customer-service/request/${id}/delete_file`, formData)
.then((response) => {
enqueueSnackbar('File LOG has Deleted', { variant: 'success' });
setOpenDialog(false);
window.location.reload()
})
.catch(({ response }) => {
enqueueSnackbar(response.data.message ?? 'Something went wrong!', { variant: 'error' });
});
} else {
setIsReasonSelected(false);
alert('Silakan pilih alasan sebelum menghapus data.');
}
}
const getContent = () => (
<Stack spacing={1} marginTop={2}>
<Typography variant="subtitle2" marginBottom={4}>Are you sure to delete this file Final LOG ?</Typography>
<br/>
<Grid item xs={12} md={12} marginTop={2}>
<Stack direction='row' spacing={2} sx={marginBottom2}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Reason*</Typography>
<Autocomplete
options={reasons}
getOptionLabel={(option) => option.label}
fullWidth
value={reasons.find((r) => r.value === formData.reason) || null} // Use find to match the default value
onChange={(e, newValue) => handleChange('reason', newValue?.value)}
renderInput={(params) => (
<TextField
{...params}
label="Reason"
variant="outlined"
required
error={!isReasonSelected} // Menandai input sebagai salah jika opsi tidak dipilih
helperText={!isReasonSelected ? 'Alasan harus dipilih' : ''}
/>
)}
/>
</Stack>
</Grid>
<DialogActions>
<Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialog}>Cancel</Button>
<Button color="error" variant="contained" onClick={handleSubmit}>Delete</Button>
</DialogActions>
</Stack>
);
return (
<MuiDialog
title={{name: "Delete File Final LOG"}}
openDialog={openDialog}
setOpenDialog={setOpenDialog}
content={getContent()}
maxWidth="xs"
/>
);
}

241
frontend/dashboard/src/pages/ClaimRequests/Components/DialogUploadFileFinalLog.tsx Normal file
View File

@@ -0,0 +1,241 @@
import { styled } from '@mui/material/styles';
import Iconify from '@/components/Iconify';
import { fCurrency } from '@/utils/formatNumber';
import { LoadingButton } from '@mui/lab';
import { Avatar, Button, Divider, LinearProgress, linearProgressClasses, ButtonBase, Box } from '@mui/material';
import { Card, Autocomplete } from '@mui/material';
import { Stack, Typography } from '@mui/material';
import { fPostFormat } from '@/utils/formatTime';
import axios from '@/utils/axios';
import { enqueueSnackbar } from 'notistack';
import { useRef, useState, useContext, useEffect } from 'react';
import { makeFormData } from '@/utils/jsonToFormData';
import { format } from 'date-fns';
// import { LanguageContext } from '@/contexts/LanguageContext';
import { DatePicker, LocalizationProvider, MobileDatePicker } from '@mui/x-date-pickers';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import TextField from '@mui/material/TextField';
import MuiDialog from '@/components/MuiDialog';
type DialogUploadType = {
openDialog: boolean;
setOpenDialog: any;
onSubmit?: void;
id: number|undefined;
}
export default function DialogUploadFileFinalLog({ id, openDialog, setOpenDialog }: DialogUploadType) {
// ----------------------------------------------------------------------
// Files Diagnosa
const fileDiagnosaInput = useRef<HTMLInputElement>(null);
const [fileDiagnosas, setFileDiagnosas] = useState<any>([]);
const marginBottom2 = {
marginBottom: 2,
}
const reason = [
{ value: 'Wrong Setting', label: 'Wrong Setting' },
{ value: 'Hospital Request', label: 'Hospital Request' }
];
const [selectedReason, setSelectedReason] = useState({value:'-', label:''});
const [error, setError] = useState('');
const handleDiagnosaInputChange = (event:any) => {
if (event.target.files[0]) {
setFileDiagnosas([...fileDiagnosas, ...event.target.files]);
} else {
console.log('NO FILE');
}
};
const removeDiagnosaFiles = (filesState:any, index:any) => {
setFileDiagnosas(
filesState.filter((file:any, fileIndex:any) => {
return fileIndex != index;
})
);
};
// ----------------------------------------------------------------------
// Files Result Kondisi
const fileKondisiInput = useRef<HTMLInputElement>(null);
const [fileKondisis, setFileKondisis] = useState<any>([]);
const handleKondisiInputChange = (event:any) => {
if (event.target.files[0]) {
setFileKondisis([...fileKondisis, ...event.target.files]);
} else {
console.log('NO FILE');
}
};
const removeKondisiFiles = (filesState:any, index:any) => {
setFileKondisis(
filesState.filter((file:any, fileIndex:any) => {
return fileIndex != index;
})
);
};
// ----------------------------------------------------------------------
// Files Result Hasil Penunjang
const fileHasilPenunjangInput = useRef<HTMLInputElement>(null);
const [fileHasilPenunjangs, setFileHasilPenunjangs] = useState<any>([]);
const handleResultInputChange = (event:any) => {
if (event.target.files[0]) {
setFileHasilPenunjangs([...fileHasilPenunjangs, ...event.target.files]);
} else {
console.log('NO FILE');
}
};
const removeFiles = (filesState:any, index:any) => {
setFileHasilPenunjangs(
filesState.filter((file:any, fileIndex:any) => {
return fileIndex != index;
})
);
};
// --------------------------------------------------------------
// Submit Form
const [submitLoading, setSubmitLoading] = useState(false);
function submitRequestFinalLog() {
if(selectedReason.value != '-'){
setSubmitLoading(true);
const formData = makeFormData({
request_logs_id: id,
result_files: fileHasilPenunjangs,
diagnosa_files: fileDiagnosas,
kondisi_files: fileKondisis,
reason: selectedReason.value
});
axios
.post(`/customer-service/request/${id}/add_file`, formData)
.then((response) => {
enqueueSnackbar('Berhasil membuat data', { variant: 'success' });
setOpenDialog(false);
window.location.reload()
})
.catch(({ response }) => {
enqueueSnackbar('Something Went Wrong', { variant: 'error' });
})
.then(() => {
setSubmitLoading(false);
});
} else {
setError('Please select a reason')
}
}
const getContent = () => (
<Stack>
<Stack
divider={<Divider orientation="horizontal" flexItem />}
spacing={4}
sx={{ marginY: 2, marginBottom: 6 }}
>
{/* -------------------------------Upload Dokumen Hasil Penunjang------------------------------- */}
<Stack sx={{ marginTop: 2 }}>
{/* <Typography variant="body2">Hasil Lab, </Typography> */}
<Stack
divider={<Divider orientation="horizontal" flexItem />}
spacing={1}
sx={{ marginY: 2 }}
>
{fileHasilPenunjangs &&
fileHasilPenunjangs.map((file:any, index:any) => (
<Stack direction="row" justifyContent={'space-between'} key={index}>
<Typography sx={{ color: "text.secondary" }}>{file.name}</Typography>
<Iconify
icon="eva:trash-2-outline"
color={'darkred'}
onClick={() => {
removeFiles(fileHasilPenunjangs, index);
}}
style={{ cursor: 'pointer' }}
></Iconify>
</Stack>
))}
</Stack>
{/* { JSON.stringify(filesResult) } */}
<ButtonBase sx={{ p: 4, border: '2px dashed #F9FAFB',
bgcolor: '#919EAB52',
borderRadius: '8px',
width: '100%', height: '60px'}} onClick={() => fileHasilPenunjangInput.current?.click()}>
<Box
sx={{
display: 'flex',
placeItems: 'center',
gap: 1,
placeContent: 'center',
}}
>
<Iconify icon="icon-park-outline:upload-one" fontSize="3em" />
<Typography variant="body1" fontWeight="bold">
Add Files
</Typography>
</Box>
<input
type="file"
id="file"
ref={fileHasilPenunjangInput}
style={{ display: 'none' }}
multiple
onChange={handleResultInputChange}
accept="application/pdf,image/*"
/>
</ButtonBase>
<Typography variant="subtitle1" marginY={2}>Reason for Update*</Typography>
<Stack direction='row' spacing={2} sx={marginBottom2}>
<Autocomplete
options={reason}
getOptionLabel={(option) => option.label}
fullWidth
value={selectedReason}
onChange={(event, newValue) => {
setSelectedReason(newValue);
// Validasi jika newValue adalah null
if (!newValue) {
setError('Please select a reason');
} else {
setError('');
}
}}
renderInput={(params) => (
<TextField
{...params}
label="Reason for updates"
variant="outlined"
name='reason'
error={Boolean(error)} // Menampilkan error jika ada
helperText={error} // Menampilkan pesan kesalahan
/>
)}
/>
</Stack>
</Stack>
</Stack>
<LoadingButton
variant="contained"
sx={{ marginTop: 2, p: 2, backgroundColor: '#19BBBB' }}
onClick={() => {
submitRequestFinalLog();
}}
loading={submitLoading}
>
Add
</LoadingButton>
</Stack>
)
return (
<MuiDialog
title={{name: "Add Files"}}
openDialog={openDialog}
setOpenDialog={setOpenDialog}
content={getContent()}
maxWidth="md"
/>
);
}

700
frontend/dashboard/src/pages/ClaimRequests/Detail.tsx
View File

@@ -1,5 +1,5 @@
// mui // mui
import { Container, Grid, Stack, Typography, Card, TextField, Divider, ButtonBase, Box, IconButton } from '@mui/material'; import { Container, Grid, Stack, Typography, Card, TextField, Divider, ButtonBase, Box, IconButton, MenuItem } from '@mui/material';
// components // components
import Page from '../../components/Page'; import Page from '../../components/Page';
// utils // utils
@@ -8,7 +8,7 @@ import useSettings from '../../hooks/useSettings';
import { useNavigate, useParams, useLocation } from 'react-router-dom'; import { useNavigate, useParams, useLocation } from 'react-router-dom';
import { useEffect, useState, useRef } from 'react'; import { useEffect, useState, useRef } from 'react';
import axios from '../../utils/axios'; import axios from '../../utils/axios';
// pages // pages
import DetailTimeline from '../../pages/ClaimRequests/DetailTimeline'; import DetailTimeline from '../../pages/ClaimRequests/DetailTimeline';
import DetailStepper from '../../pages/ClaimRequests/DetailStepper'; import DetailStepper from '../../pages/ClaimRequests/DetailStepper';
import { format } from 'date-fns'; import { format } from 'date-fns';
@@ -19,7 +19,7 @@ import RemoveIcon from '@mui/icons-material/Remove';
import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers'; import { DatePicker, LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import Iconify from '@/components/Iconify'; import Iconify from '@/components/Iconify';
import { fPostFormat } from '@/utils/formatTime'; import { fDate, fPostFormat } from '@/utils/formatTime';
import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile'; import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
import DownloadIcon from '@mui/icons-material/Download'; import DownloadIcon from '@mui/icons-material/Download';
import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material'; import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
@@ -28,279 +28,509 @@ import { fDateTimesecond } from '@/utils/formatTime';
import { makeFormData } from '@/utils/jsonToFormData'; import { makeFormData } from '@/utils/jsonToFormData';
import { enqueueSnackbar } from 'notistack'; import { enqueueSnackbar } from 'notistack';
import { DetailClaimRequest } from './Model/Types';
import { Delete, EditOutlined } from '@mui/icons-material';
import { fNumber } from '@/utils/formatNumber';
import palette from '@/theme/palette';
import MoreMenu from '@/components/MoreMenu';
import DialogUploadFileFinalLog from './Components/DialogUploadFileFinalLog';
import DialogDeleteFileLog from './Components/DialogDeleteFileLog';
// ---------------------------------------------------------------------- // ----------------------------------------------------------------------
export default function Detail() { export default function Detail() {
const location = useLocation(); const location = useLocation();
const queryParams = new URLSearchParams(location.search); const queryParams = new URLSearchParams(location.search);
const code = queryParams.get('code');
const navigate = useNavigate(); const navigate = useNavigate();
const { themeStretch } = useSettings(); const { themeStretch } = useSettings();
const [data, setData] = useState(); const [claimRequests, setClaimRequest] = useState<DetailClaimRequest>();
const [dataDialog, setDataDialog] = useState();
const [document, setDocument] = useState(null);
const { id } = useParams(); const { id } = useParams();
useEffect(() => { useEffect(() => {
axios axios
.get('/claim-requests/detail/'+id) .get('claim-requests/detail/'+id)
.then((response) => { .then((response) => {
setData(response.data); setClaimRequest(response.data.data)
setDataDialog(response.data.data.dialog_submits);
setDocument(response.data.data.documents);
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
});
}, []);
const [isInvoiceVisible, setInvoiceVisibility] = useState(false);
const handleInvoice = () => {
setInvoiceVisibility(!isInvoiceVisible);
}
const currentDate = new Date();
const formattedCurrentDate = format(currentDate, 'dd MMM yyyy');
const [dateInvoice, setDateInvoice] = useState(currentDate);
const fileInvoiceInput = useRef<HTMLInputElement>(null);
const [fileInvoices, setFileInvoices] = useState([]);
const handleInvoiceInputChange = (event) => {
if (event.target.files[0]) {
setFileInvoices([...fileInvoices, ...event.target.files]);
} else {
console.log('NO FILE');
}
};
const removeInvoiceFiles = (filesState, index) => {
setFileInvoices(
filesState.filter((file, fileIndex) => {
return fileIndex != index;
}) })
); }, [id]);
};
const date = dateInvoice ? fPostFormat(dateInvoice, 'yyyy-MM-dd') : null; function toTitleCase(str: string | null) {
return str.replace(/\w\S*/g, function(txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
}
const style1 = {
color: '#919EAB',
width: '30%'
}
const style2 = {
width: '70%'
}
const style3 = {
color: '#919EAB',
width: '35%'
}
const marginBottom1 = {
marginBottom: 1,
}
const [openDialogSubmit, setOpenDialogSubmit] = useState(false); const [openDialogSubmit, setOpenDialogSubmit] = useState(false);
const handleCloseDialogSubmit = () => { const handleCloseDialogSubmit = () => {
setOpenDialogSubmit(false); setOpenDialogSubmit(false);
} }
const handleSubmitData = () => { const [approve, setApprove] = useState('');
// if(fileInvoices.length > 0)
// {
//submit data
axios
.post('claim-requests/'+id+'/approve')
.then((response) => {
enqueueSnackbar('Success Submit Claim Request', { variant: 'success' });
setOpenDialogSubmit(false);
})
.catch(({ response }) => {
enqueueSnackbar(response.data.message ?? 'Something went wrong!', { variant: 'error' });
});
//Upload file invoices
const formData = makeFormData({
date:date,
invoice_files: fileInvoices,
});
axios
.post('claim-requests/'+id+'/invoice-files', formData)
.then((response) => {
enqueueSnackbar(response.data.message ?? 'Success upload invoice', { variant: 'success' });
})
.catch(({ response }) => {
enqueueSnackbar(response.data.message ?? 'Something Went Wrong', { variant: 'error' });
});
// }
// else
// {
// enqueueSnackbar('Please upload file invoice, before submit', { variant: 'warning' });
// }
setTimeout(() => // Handle Delete File LOG
{ const [pathFile, setPathFile] = useState('')
window.location.reload(); const [dialogDeleteFIleLog, setDialogDeleteFileLog] = useState(false)
}, 5000);
}; // Handle Upload File LOG
const [dialogUploadFileLog, setDialogUploadFileLog] = useState(false)
const check_invoice = document?.find((dataInvoice) => dataInvoice.type === 'claim-invoice');
// Buat total data
const totalAmountIncurred = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_incurred || 0);
}, 0);
const totalAmountApprove = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_approved || 0);
}, 0);
const totalAmountNotApprove = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.amount_not_approved || 0);
}, 0);
const totalExcessPaid = (claimRequests?.benefit_data || []).reduce((accumulator, item) => {
return accumulator + (item.excess_paid || 0);
}, 0);
return ( return (
<Page title='Detail'> <Page title='Detail'>
<Container maxWidth={themeStretch ? false : 'xl'}> <Container maxWidth={themeStretch ? false : 'xl'}>
<Stack direction="row" alignItems="center" sx={{ marginBottom: 3 }}> <Stack direction="row" alignItems="center" sx={{ marginBottom: 3 }}>
<ArrowBackIosIcon onClick={() => navigate(-1)} sx={{cursor:'pointer'}}/> <ArrowBackIosIcon onClick={() => navigate(-1)} sx={{cursor:'pointer'}}/>
<Typography variant="h5" sx={{marginLeft:2}}>{(data && data.data) ? data.data.status.code : ''}</Typography> <Typography variant="h5" sx={{marginLeft:2}}>{(claimRequests && claimRequests.code ? claimRequests.code : '')}</Typography>
{data ? (
<Stack direction="row" spacing={2} ml="auto">
<Typography variant="body2" sx={{color: '#757575'}}>Submission Date</Typography>
<Typography variant="body2" fontWeight="bold">{(data && data.data) ? format(new Date(data.data.status.submission_date), "d MMM yyyy") : ''}</Typography>
</Stack> </Stack>
) : ''}
</Stack>
{data ? (
<Grid container spacing={2}> <Grid container spacing={2}>
{/* Detail */}
<Grid item xs={12} md={12}> <Grid item xs={12} md={12}>
<DetailStepper data={data}/> <Card sx={{padding:2}} >
</Grid> <Grid container spacing={2}>
<Grid item xs={12} md={12}> <Grid item xs={6}>
<Stack direction="row" alignItems="center"> <Typography variant='subtitle1' sx={{ color: '#19BBBB', marginBottom: 4 }} gutterBottom>
<Typography variant="subtitle1">Format Claim</Typography> Details
<Button variant="outlined" color="primary" startIcon={< DownloadIcon/>} sx={{marginLeft: 'auto'}}>
<Typography variant="button" display="block">Import</Typography>
</Button>
</Stack>
</Grid>
{check_invoice ? (
<Grid item xs={12} md={12}>
<Stack direction="row" alignItems="center">
<Typography variant="subtitle1">Request Claim</Typography>
<Button variant="outlined" color="primary" startIcon={ isInvoiceVisible ? < RemoveIcon/> : < AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => handleInvoice()}>
<Typography variant="button" display="block">Invoice</Typography>
</Button>
</Stack>
</Grid>
) : ''}
<Grid item xs={12} md={12} sx={{display : isInvoiceVisible ? '' : 'none',}}>
<Card sx={{padding: 2}}>
<Stack direction="column" spacing={2}>
<LocalizationProvider dateAdapter={AdapterDateFns}>
<DatePicker
label="Invoice Date"
value={dateInvoice}
onChange={(newValue) => {
setDateInvoice(newValue);
}}
inputFormat="dd MMM yyyy"
renderInput={(params) => <TextField sx={{width:'40%'}} {...params} defaultValue={formattedCurrentDate} required/>}
/>
</LocalizationProvider>
<Stack
divider={<Divider orientation="horizontal" flexItem />}
spacing={1}
sx={{ marginY: 2 }}
>
{fileInvoices &&
fileInvoices.map((file, index) => (
<Stack direction="row" justifyContent={'space-between'} key={index}>
<Stack direction="row" spacing={1} sx={{color: '#19BBBB'}}>
<InsertDriveFileIcon />
<Typography variant="body2" gutterBottom>{file.name ? file.name : '-'}</Typography>
</Stack>
<Iconify
icon="eva:trash-2-outline"
color={'darkred'}
onClick={() => {
removeInvoiceFiles(fileInvoices, index);
}}
sx={{cursor: 'pointer'}}
></Iconify>
</Stack>
))}
</Stack>
<ButtonBase sx={{ p: 4, border: '2px dashed #F9FAFB',
bgcolor: '#919EAB52',
borderRadius: '8px',
width: '100%', height: '60px'}} onClick={() => fileInvoiceInput.current?.click()}>
<Box
sx={{
display: 'flex',
placeItems: 'center',
gap: 1,
placeContent: 'center',
}}
>
<Iconify icon="icon-park-outline:upload-one" fontSize="3em" />
<Typography variant="body1" fontWeight="bold">
Upload Invoice
</Typography> </Typography>
</Box> </Grid>
<input </Grid>
type="file" <Stack direction='row' spacing={2} sx={marginBottom1}>
id="file" <Typography variant='subtitle2' sx={style1} gutterBottom>Provider Name</Typography>
ref={fileInvoiceInput} <Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.provider}</Typography>
style={{ display: 'none' }} </Stack>
multiple <Stack direction='row' spacing={2} sx={marginBottom1}>
onChange={handleInvoiceInputChange} <Typography variant='subtitle2' sx={style1} gutterBottom>Member ID</Typography>
accept="application/pdf" <Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.member_id}</Typography>
/> </Stack>
</ButtonBase> <Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Policy Number</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.policy_number}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Name</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.name}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Date Of Birth</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.date_of_birth ? fDate(claimRequests?.date_of_birth) : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Marital Status</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.marital_status}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Submission Date</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.submission_date ? fDateTimesecond(claimRequests?.submission_date) : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>No KTP</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.no_identitas ? claimRequests?.no_identitas : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Keterangan</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.keterangan ? claimRequests?.keterangan : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Hak Kamar Pasien</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.hak_kamar_pasien ? claimRequests?.hak_kamar_pasien : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Penempatan Kamar</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.penempatan_kamar ? claimRequests?.penempatan_kamar : '-'}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style3} gutterBottom>Diagnosis</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>
{claimRequests?.diagnosis?.length > 0 ? (
<ul>
{claimRequests?.diagnosis.map((diagnosisItem, index) => (
<li key={index}>{diagnosisItem.code} - {diagnosisItem.name}</li>
// Replace 'name' with the property you want to display
))}
</ul>
) : (
<p>No diagnosis available.</p>
)}
</Typography>
</Stack> </Stack>
</Card> </Card>
</Grid> </Grid>
<Grid item xs={12} md={12}>
<DetailTimeline data={data}/> {/* Service */}
<Grid item xs={12} md={12} marginTop={2}>
<Card sx={{padding:2}} >
<Typography variant='subtitle1' sx={{color: '#19BBBB', marginBottom: 4}} gutterBottom>Service</Typography>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Service Type</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.service_type}</Typography>
</Stack>
<Stack direction='row' spacing={2} sx={marginBottom1}>
<Typography variant='subtitle2' sx={style1} gutterBottom>Claim Method</Typography>
<Typography variant='subtitle2' sx={style2} gutterBottom>{toTitleCase(claimRequests?.claim_method ?? '-')}</Typography>
</Stack>
</Card>
</Grid> </Grid>
{/* Document */}
<Grid item xs={12} md={12}> <Grid item xs={12} md={12}>
<Stack direction="row" padding={4}> <Card sx={{padding:2}} >
{dataDialog && dataDialog.status === 'requested' ? ( <Stack direction="row" alignItems="center" justifyContent="space-between" sx={{marginBottom: 4}}>
<> <Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
<Button variant="outlined" sx={{color: '#212B36', marginLeft: 'auto', borderColor: '#919EAB52'}} >Cancel</Button> <Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Document </Typography>
<Button sx={{backgroundColor: '#19BBBB', marginLeft: 1}} variant="contained" onClick={()=> setOpenDialogSubmit(true)}>Submit</Button>
</>
) : ''}
{/* Dialog Submits */}
<Dialog open={openDialogSubmit} onClose={handleCloseDialogSubmit} fullWidth={true}>
<DialogTitle sx={{ backgroundColor: '#19BBBB', color: '#FFF', padding: 2 }}>
<Stack direction="row" alignItems="center" justifyContent="space-between">
<Stack direction="row" alignItems='center' spacing={1}>
<Typography variant="h6">Confirmation</Typography>
</Stack>
<IconButton sx={{ color: '#FFF' }} onClick={handleCloseDialogSubmit}>
<CloseIcon />
</IconButton>
</Stack> </Stack>
</DialogTitle> <Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
<DialogContent> <Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => {
{dataDialog ? ( setDialogUploadFileLog(true)
<Stack spacing={2} padding={2}> }} >
<Typography variant='body1'>Are you sure to submit this claim ?</Typography> <Typography variant="button" display="block">File</Typography>
<Card sx={{padding:2}} > </Button>
<Stack direction='row' spacing={2}> </Stack>
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Code</Typography> </Stack>
<Typography variant='subtitle2' sx={{width: '70%'}}>{dataDialog.code}</Typography> {claimRequests?.files?.map((documentType, index) => (
</Stack> <Stack direction="row" alignItems="center" justifyContent="space-between" sx={{marginBottom: 2}} key={index}>
<Stack direction='row' spacing={2}> <Stack direction="column" spacing={2} >
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Name</Typography>
<Typography variant='subtitle2' sx={{width: '70%'}}>{dataDialog.name}</Typography> <a
</Stack> href={documentType.url}
<Stack direction='row' spacing={2}> style={{
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Date Submission</Typography> cursor: 'pointer',
<Typography variant='subtitle2' sx={{width: '70%'}}>{fDateTimesecond(dataDialog.submission_date)}</Typography> textDecoration: 'none',
</Stack> color: '#19BBBB',
<Stack direction='row' spacing={2}> display: 'flex',
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Claim Method</Typography> alignItems: 'center' // Menjadikan konten dalam satu garis vertikal
<Typography variant='subtitle2' sx={{width: '70%'}}>Service Type</Typography> }}
</Stack> target="_blank"
<Stack direction='row' spacing={2}> >
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Service Type</Typography> <InsertDriveFileIcon style={{ marginRight: '5px' }} />
<Typography variant='subtitle2' sx={{width: '70%'}}> <Typography variant="body1" gutterBottom>{documentType.original_name ? documentType.original_name : '-'}</Typography>
{dataDialog.service_code === 'IP' ? 'Inpatient' : 'Outpatient'} </a>
</Typography>
</Stack>
</Card>
</Stack> </Stack>
) : ''} <Stack direction="column" spacing={2}>
</DialogContent> <IconButton onClick={() => {
<DialogActions> setDialogDeleteFileLog(true)
<Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialogSubmit}>Cancel</Button> setPathFile(documentType.path)
<Button sx={{backgroundColor: '#19BBBB'}} onClick={handleSubmitData} variant="contained">Submit</Button> }} aria-label="delete" size="small" sx={{ marginLeft: 'auto' }}>
</DialogActions> <Delete color='error' fontSize="small" />
</Dialog> </IconButton>
</Stack> </Stack>
</Stack>
))}
<DialogDeleteFileLog
id={claimRequests?.request_log_id}
path={pathFile}
setOpenDialog={setDialogDeleteFileLog}
openDialog={dialogDeleteFIleLog}
/>
<DialogUploadFileFinalLog
id={claimRequests?.request_log_id}
setOpenDialog={setDialogUploadFileLog}
openDialog={dialogUploadFileLog}
/>
</Card>
</Grid>
{/* Benefit */}
<Grid item xs={12} md={12}>
<Card sx={{padding:2}} >
<Stack direction="row" alignItems="center" sx={{marginBottom: 4}}>
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Benefit</Typography>
<Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => {
// setDialogBenefit(true);
}} >
<Typography variant="button" display="block">Benefit</Typography>
</Button>
</Stack>
<Box sx={{ border: '1px solid rgba(0,0,0,0.125)', px: '24px', py: '20px', marginBottom: '24px', borderRadius: '12px'}}>
{claimRequests?.benefit_data?.map((item, index) => (
<Grid container spacing={2}>
<Grid item xs={12}>
<Grid container >
<Grid item xs={6}>
<Typography variant="body2" sx={{ fontWeight: 'bold'}}>
{item.benefit?.description}
</Typography>
</Grid>
<Grid item xs={6} sx={{ display: 'flex', placeContent: 'end' }}>
<MoreMenu actions={
<>
<MenuItem onClick={() => {
// setDialogEditBenefit(true)
// setIdBenefitData(item.id)
// setBenefitConfigurationData(item)
}}
>
<EditOutlined />
Edit
</MenuItem>
<MenuItem onClick={() => {
// setIdBenefitData(item.id)
// setDialogDeleteBenefit(true)
}}
>
<Delete color='error'/>
Delete
</MenuItem>
</>
} />
</Grid>
</Grid>
</Grid>
<Grid item xs={12} py={2}>
<Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
<Grid container spacing={1}>
{/* Amount Incurred */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Incurred
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(item.amount_incurred)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Approved */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(item.amount_approved)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Not Approved */}
<Grid item xs={3}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Not Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(item.amount_not_approved)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Excess Paid* */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Excess Paid*
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(item.excess_paid)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Keterangan* */}
<Grid item xs={3}>
<Grid container>
<Grid item xs={12}>
<Typography variant="caption">
Keterangan*
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{item.keterangan}
</Typography>
</Grid>
</Grid>
</Grid>
</Grid>
</Box>
</Grid>
</Grid>
))}
<hr />
<br />
{claimRequests?.benefit_data && claimRequests.benefit_data.length > 0 ? (
<Grid container spacing={2}>
<Grid item xs={12}>
<Grid container spacing={2}>
<Grid item xs={6}>
<Typography variant="body2" sx={{ fontWeight: 'bold'}}>
Total Benefit
</Typography>
</Grid>
</Grid>
</Grid>
<Grid item xs={12}>
<Box sx={{ py: '8px', px: '12px', background: palette.light.grey[50012], borderRadius: '6px'}}>
<Grid container spacing={1}>
{/* Amount Incurred */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Incurred
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountIncurred)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Approved */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountApprove)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Amount Not Approved */}
<Grid item xs={3}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Amount Not Approved
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalAmountNotApprove)}
</Typography>
</Grid>
</Grid>
</Grid>
{/* Excess Paid* */}
<Grid item xs={2}>
<Grid container sx={{ borderRight: `0.5px solid ${palette.light.grey[400]}` }}>
<Grid item xs={12}>
<Typography variant="caption">
Excess Paid
</Typography>
</Grid>
<Grid item xs={12}>
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>
{fNumber(totalExcessPaid)}
</Typography>
</Grid>
</Grid>
</Grid>
</Grid>
</Box>
</Grid>
</Grid>
)
: (
null
)}
</Box>
</Card>
{/* PR Buat pindahin ke componen */}
{/* <CardBenefit
requestLog={requestLog}
>
</CardBenefit> */}
{/* <DialogBenefit
requestLog={requestLog}
openDialog={openDialogBenefit}
setOpenDialog={setDialogBenefit}
/>
{/* Dialog Edit */}
{/* <DialogEditBenefit
id={idBenefitData}
data={BenefitConfigurationData}
openDialog={openDialogEditBenefit}
setOpenDialog={setDialogEditBenefit}
/> */}
{/* Dialog Delete */}
{/* <DialogDeleteBenfit
id={idBenefitData}
openDialog={openDialogDeleteBenefit}
setOpenDialog={setDialogDeleteBenefit}
/> */}
{/* Dialog Edit Detai; */}
{/* <DialogEditFinalLOG
setOpenDialog={setDialogDEditDetail}
requestLog={requestLog}
openDialog={openDialogEditDetail}
/> */}
</Grid> </Grid>
</Grid> </Grid>
) : ''}
</Container> </Container>
</Page> </Page>
); )
} }

58
frontend/dashboard/src/pages/ClaimRequests/Model/Types.tsx
View File

@@ -23,3 +23,61 @@ export type ServiceType = {
code : string code : string
name : string name : string
} }
export type DetailClaimRequest = {
id : number,
code : string,
member_id : string,
policy_number : string,
name : string,
date_of_birth : string,
gender : string,
marital_status : string,
submission_date : string,
service_type : string,
claim_method : string,
no_identitas : string,
keterangan : string,
hak_kamar_pasien : string,
penempatan_kamar : string,
provider : string,
status : string,
request_log_id : number,
benefit : Benefit[],
reason : string,
files : file[],
benefit_data : BenefitData[],
diagnosis : Diagnosis[],
}
export type Benefit = {
code: string,
description: string
}
export type BenefitData = {
amount_incurred : number,
amount_approved : number,
amount_not_approved : number,
excess_paid : number,
keterangan : string,
benefit : Benefit,
request_log_id : number,
benefit_name : string,
description : string,
id : number,
}
export type Diagnosis = {
id : number,
name : string,
code : string
}
export type file = {
original_name: string,
name: string,
path: string,
url: string,
}