detail dan add document dan hapus di claim request
This commit is contained in:
@@ -516,89 +516,102 @@ class ClaimRequestController extends Controller
|
||||
|
||||
public function claimRequestDetail($claimRequestId)
|
||||
{
|
||||
$status = DB::table('claim_requests')
|
||||
->leftJoin('claims', 'claim_requests.id', '=', 'claims.claim_request_id')
|
||||
->leftJoin('members', 'claim_requests.member_id', '=', 'members.id')
|
||||
->leftJoin('corporate_employees', 'members.id', '=', 'corporate_employees.member_id')
|
||||
->leftJoin('corporate_divisions', 'corporate_employees.division_id', '=', 'corporate_divisions.id')
|
||||
->where('claim_requests.id', '=', $claimRequestId)
|
||||
->select(
|
||||
'claim_requests.submission_date',
|
||||
'claim_requests.code',
|
||||
DB::raw('
|
||||
CASE
|
||||
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 = "declined" THEN "declined"
|
||||
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 "reviewed"
|
||||
ELSE ""
|
||||
END AS status
|
||||
')
|
||||
)
|
||||
->first();
|
||||
$results['status'] = $status;
|
||||
$timeline = DB::table('claim_logs')
|
||||
->where('claim_logs.claim_request_id', '=', $claimRequestId)
|
||||
->select(
|
||||
DB::raw('
|
||||
CASE
|
||||
WHEN claim_logs.status = "requested" THEN "Request"
|
||||
WHEN claim_logs.status = "reviewed" THEN "Review"
|
||||
WHEN claim_logs.status = "approved" THEN "Approval"
|
||||
WHEN claim_logs.status = "declined" THEN "Decline"
|
||||
ELSE "-"
|
||||
END AS txt_status
|
||||
'),
|
||||
DB::raw('
|
||||
CASE
|
||||
WHEN claim_logs.status = "requested" THEN "#159C9C"
|
||||
WHEN claim_logs.status = "reviewed" THEN "#0C53B7"
|
||||
WHEN claim_logs.status = "approved" THEN "#229A16"
|
||||
WHEN claim_logs.status = "declined" THEN "#FF4842"
|
||||
ELSE "-"
|
||||
END AS txt_status_color
|
||||
'),
|
||||
DB::raw('
|
||||
CASE
|
||||
WHEN claim_logs.status = "requested" THEN "#00AB5529"
|
||||
WHEN claim_logs.status = "reviewed" THEN "#1890FF29"
|
||||
WHEN claim_logs.status = "approved" THEN "#54D62C29"
|
||||
WHEN claim_logs.status = "declined" THEN "#FF48427A"
|
||||
ELSE "-"
|
||||
END AS txt_status_backgroundColor
|
||||
'),
|
||||
'claim_logs.date',
|
||||
'claim_logs.description',
|
||||
'claim_logs.status'
|
||||
)
|
||||
->orderBy('claim_logs.id', 'desc')
|
||||
->get();
|
||||
$results['timeline'] = $timeline;
|
||||
$request_files = DB::table('claim_request_files')
|
||||
->where('claim_request_files.claim_request_id', '=', $claimRequestId)
|
||||
->select(
|
||||
'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'),
|
||||
)
|
||||
->get();
|
||||
$results['request_files'] = $request_files;
|
||||
$documents = DB::table('files')
|
||||
->where('fileable_type', 'App\Models\ClaimRequest')
|
||||
->where('fileable_id', $claimRequestId)
|
||||
->select('original_name', \DB::raw("CONCAT('" . env('APP_URL') . "/storage/', path) as path"), 'type')
|
||||
->orderBy('id', 'desc')
|
||||
->get();
|
||||
$results['documents'] = $documents;
|
||||
$dialog_submits = DB::table('claim_requests')
|
||||
->leftJoin('members', 'claim_requests.member_id','=', 'members.id')
|
||||
->where('claim_requests.id', $claimRequestId)
|
||||
->select('claim_requests.code', 'members.name', 'claim_requests.submission_date', 'claim_requests.service_code','claim_requests.status')
|
||||
->first();
|
||||
$results['dialog_submits'] = $dialog_submits;
|
||||
// $status = DB::table('claim_requests')
|
||||
// ->leftJoin('claims', 'claim_requests.id', '=', 'claims.claim_request_id')
|
||||
// ->leftJoin('members', 'claim_requests.member_id', '=', 'members.id')
|
||||
// ->leftJoin('corporate_employees', 'members.id', '=', 'corporate_employees.member_id')
|
||||
// ->leftJoin('corporate_divisions', 'corporate_employees.division_id', '=', 'corporate_divisions.id')
|
||||
// ->where('claim_requests.id', '=', $claimRequestId)
|
||||
// ->select(
|
||||
// 'claim_requests.submission_date',
|
||||
// 'claim_requests.code',
|
||||
// DB::raw('
|
||||
// CASE
|
||||
// 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 = "declined" THEN "declined"
|
||||
// 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 "reviewed"
|
||||
// ELSE ""
|
||||
// END AS status
|
||||
// ')
|
||||
// )
|
||||
// ->first();
|
||||
// $results['status'] = $status;
|
||||
// $timeline = DB::table('claim_logs')
|
||||
// ->where('claim_logs.claim_request_id', '=', $claimRequestId)
|
||||
// ->select(
|
||||
// DB::raw('
|
||||
// CASE
|
||||
// WHEN claim_logs.status = "requested" THEN "Request"
|
||||
// WHEN claim_logs.status = "reviewed" THEN "Review"
|
||||
// WHEN claim_logs.status = "approved" THEN "Approval"
|
||||
// WHEN claim_logs.status = "declined" THEN "Decline"
|
||||
// ELSE "-"
|
||||
// END AS txt_status
|
||||
// '),
|
||||
// DB::raw('
|
||||
// CASE
|
||||
// WHEN claim_logs.status = "requested" THEN "#159C9C"
|
||||
// WHEN claim_logs.status = "reviewed" THEN "#0C53B7"
|
||||
// WHEN claim_logs.status = "approved" THEN "#229A16"
|
||||
// WHEN claim_logs.status = "declined" THEN "#FF4842"
|
||||
// ELSE "-"
|
||||
// END AS txt_status_color
|
||||
// '),
|
||||
// DB::raw('
|
||||
// CASE
|
||||
// WHEN claim_logs.status = "requested" THEN "#00AB5529"
|
||||
// WHEN claim_logs.status = "reviewed" THEN "#1890FF29"
|
||||
// WHEN claim_logs.status = "approved" THEN "#54D62C29"
|
||||
// WHEN claim_logs.status = "declined" THEN "#FF48427A"
|
||||
// ELSE "-"
|
||||
// END AS txt_status_backgroundColor
|
||||
// '),
|
||||
// 'claim_logs.date',
|
||||
// 'claim_logs.description',
|
||||
// 'claim_logs.status'
|
||||
// )
|
||||
// ->orderBy('claim_logs.id', 'desc')
|
||||
// ->get();
|
||||
// $results['timeline'] = $timeline;
|
||||
// $request_files = DB::table('claim_request_files')
|
||||
// ->where('claim_request_files.claim_request_id', '=', $claimRequestId)
|
||||
// ->select(
|
||||
// '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'),
|
||||
// )
|
||||
// ->get();
|
||||
// $results['request_files'] = $request_files;
|
||||
// $documents = DB::table('files')
|
||||
// ->where('fileable_type', 'App\Models\ClaimRequest')
|
||||
// ->where('fileable_id', $claimRequestId)
|
||||
// ->select('original_name', \DB::raw("CONCAT('" . env('APP_URL') . "/storage/', path) as path"), 'type')
|
||||
// ->orderBy('id', 'desc')
|
||||
// ->get();
|
||||
// $results['documents'] = $documents;
|
||||
// $dialog_submits = DB::table('claim_requests')
|
||||
// ->leftJoin('members', 'claim_requests.member_id','=', 'members.id')
|
||||
// ->where('claim_requests.id', $claimRequestId)
|
||||
// ->select('claim_requests.code', 'members.name', 'claim_requests.submission_date', 'claim_requests.service_code','claim_requests.status')
|
||||
// ->first();
|
||||
// $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)
|
||||
|
||||
@@ -104,8 +104,8 @@ class ReportLogController extends Controller
|
||||
*/
|
||||
public function show($id)
|
||||
{
|
||||
$claimRequest = RequestLog::findOrFail($id);
|
||||
$claimRequest->load([
|
||||
$requestLog = RequestLog::findOrFail($id);
|
||||
$requestLog->load([
|
||||
'histories' => function ($history) {
|
||||
$history->latest();
|
||||
},
|
||||
@@ -120,7 +120,7 @@ class ReportLogController extends Controller
|
||||
|
||||
]);
|
||||
|
||||
return Helper::responseJson(data: RequestLogShowResource::make($claimRequest));
|
||||
return Helper::responseJson(data: RequestLogShowResource::make($requestLog));
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -439,6 +439,7 @@ class RequestLogController extends Controller
|
||||
'path' => $pathFile,
|
||||
'created_by' => auth()->user()->id,
|
||||
'updated_by' => auth()->user()->id,
|
||||
'reason' => $request->reason,
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -876,6 +877,7 @@ class RequestLogController extends Controller
|
||||
'path' => $pathFile,
|
||||
'created_by' => auth()->user()->id,
|
||||
'updated_by' => auth()->user()->id,
|
||||
'reason' => $request->reason,
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -891,6 +893,7 @@ class RequestLogController extends Controller
|
||||
'path' => $pathFile,
|
||||
'created_by' => auth()->user()->id,
|
||||
'updated_by' => auth()->user()->id,
|
||||
'reason' => $request->reason,
|
||||
]);
|
||||
}
|
||||
}
|
||||
@@ -906,6 +909,7 @@ class RequestLogController extends Controller
|
||||
'path' => $pathFile,
|
||||
'created_by' => auth()->user()->id,
|
||||
'updated_by' => auth()->user()->id,
|
||||
'reason' => $request->reason,
|
||||
]);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,14 @@ namespace Modules\Internal\Transformers;
|
||||
use Illuminate\Http\Resources\Json\JsonResource;
|
||||
use Illuminate\Support\Str;
|
||||
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
|
||||
{
|
||||
@@ -17,34 +25,57 @@ class ClaimRequestShowResource extends JsonResource
|
||||
public function 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();
|
||||
if($service){
|
||||
$serviceName = $service->name;
|
||||
} else {
|
||||
$serviceName = '-';
|
||||
$planId = Plan::whereIn('id', $planMember)->where('service_code', $data['service_code'])->first();
|
||||
$benefit = CorporateBenefit::with('benefit')->where('plan_id', $planId->id)->get()->toArray();
|
||||
$benefitDetailLog = RequestLogBenefit::with('benefit')->where('request_log_id', $data['request_log_id'])->get()->toArray();
|
||||
$medicineDetailLog = RequestLogMedicine::where('request_log_id', $data['request_log_id'])->get()->toArray();
|
||||
|
||||
$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) {
|
||||
return [$history->created_at->format('Y-m-d') => $history];
|
||||
});
|
||||
$data['histories_by_date'] = [];
|
||||
foreach ($historiesGroupByDate as $date => $histories) {
|
||||
$data['histories_by_date'][] = [
|
||||
'date' => $date,
|
||||
'histories' => $histories
|
||||
];
|
||||
}
|
||||
|
||||
$response = [
|
||||
'id' => $data['id'],
|
||||
'code' => $data['code'],
|
||||
'request_log_id' => $data['request_log_id'],
|
||||
'provider' => $data['request_log']['organization']['name'],
|
||||
'member_id' => $data['request_log']['member']['member_id'],
|
||||
'policy_number' => $policyNumber->code ? $policyNumber->code : '-',
|
||||
'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;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -209,6 +209,11 @@ class ClaimRequest extends Model
|
||||
return $this->hasMany(Claim::class, 'claim_request_id');
|
||||
}
|
||||
|
||||
public function requestLog()
|
||||
{
|
||||
return $this->hasOne(RequestLog::class, 'id', 'request_log_id');
|
||||
}
|
||||
|
||||
public function files()
|
||||
{
|
||||
return $this->morphMany(File::class, 'fileable');
|
||||
|
||||
@@ -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"
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -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"
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
// 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
|
||||
import Page from '../../components/Page';
|
||||
// utils
|
||||
@@ -8,7 +8,7 @@ import useSettings from '../../hooks/useSettings';
|
||||
import { useNavigate, useParams, useLocation } from 'react-router-dom';
|
||||
import { useEffect, useState, useRef } from 'react';
|
||||
import axios from '../../utils/axios';
|
||||
// pages
|
||||
// pages
|
||||
import DetailTimeline from '../../pages/ClaimRequests/DetailTimeline';
|
||||
import DetailStepper from '../../pages/ClaimRequests/DetailStepper';
|
||||
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 { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
|
||||
import Iconify from '@/components/Iconify';
|
||||
import { fPostFormat } from '@/utils/formatTime';
|
||||
import { fDate, fPostFormat } from '@/utils/formatTime';
|
||||
import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
|
||||
import DownloadIcon from '@mui/icons-material/Download';
|
||||
import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
|
||||
@@ -28,279 +28,509 @@ import { fDateTimesecond } from '@/utils/formatTime';
|
||||
import { makeFormData } from '@/utils/jsonToFormData';
|
||||
|
||||
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() {
|
||||
const location = useLocation();
|
||||
const queryParams = new URLSearchParams(location.search);
|
||||
const code = queryParams.get('code');
|
||||
|
||||
const navigate = useNavigate();
|
||||
const { themeStretch } = useSettings();
|
||||
const [data, setData] = useState();
|
||||
const [dataDialog, setDataDialog] = useState();
|
||||
const [document, setDocument] = useState(null);
|
||||
const [claimRequests, setClaimRequest] = useState<DetailClaimRequest>();
|
||||
|
||||
const { id } = useParams();
|
||||
|
||||
useEffect(() => {
|
||||
axios
|
||||
.get('/claim-requests/detail/'+id)
|
||||
.get('claim-requests/detail/'+id)
|
||||
.then((response) => {
|
||||
setData(response.data);
|
||||
setDataDialog(response.data.data.dialog_submits);
|
||||
setDocument(response.data.data.documents);
|
||||
|
||||
setClaimRequest(response.data.data)
|
||||
})
|
||||
.catch((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;
|
||||
})
|
||||
);
|
||||
};
|
||||
const date = dateInvoice ? fPostFormat(dateInvoice, 'yyyy-MM-dd') : null;
|
||||
}, [id]);
|
||||
|
||||
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 handleCloseDialogSubmit = () => {
|
||||
setOpenDialogSubmit(false);
|
||||
}
|
||||
const handleSubmitData = () => {
|
||||
// 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' });
|
||||
// }
|
||||
const [approve, setApprove] = useState('');
|
||||
|
||||
setTimeout(() =>
|
||||
{
|
||||
window.location.reload();
|
||||
}, 5000);
|
||||
// Handle Delete File LOG
|
||||
const [pathFile, setPathFile] = useState('')
|
||||
const [dialogDeleteFIleLog, setDialogDeleteFileLog] = useState(false)
|
||||
|
||||
};
|
||||
|
||||
const check_invoice = document?.find((dataInvoice) => dataInvoice.type === 'claim-invoice');
|
||||
// Handle Upload File LOG
|
||||
const [dialogUploadFileLog, setDialogUploadFileLog] = useState(false)
|
||||
|
||||
// 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 (
|
||||
<Page title='Detail'>
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<Page title='Detail'>
|
||||
<Container maxWidth={themeStretch ? false : 'xl'}>
|
||||
<Stack direction="row" alignItems="center" sx={{ marginBottom: 3 }}>
|
||||
<ArrowBackIosIcon onClick={() => navigate(-1)} sx={{cursor:'pointer'}}/>
|
||||
<Typography variant="h5" sx={{marginLeft:2}}>{(data && data.data) ? data.data.status.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>
|
||||
<ArrowBackIosIcon onClick={() => navigate(-1)} sx={{cursor:'pointer'}}/>
|
||||
<Typography variant="h5" sx={{marginLeft:2}}>{(claimRequests && claimRequests.code ? claimRequests.code : '')}</Typography>
|
||||
</Stack>
|
||||
) : ''}
|
||||
</Stack>
|
||||
{data ? (
|
||||
<Grid container spacing={2}>
|
||||
{/* Detail */}
|
||||
<Grid item xs={12} md={12}>
|
||||
<DetailStepper data={data}/>
|
||||
</Grid>
|
||||
<Grid item xs={12} md={12}>
|
||||
<Stack direction="row" alignItems="center">
|
||||
<Typography variant="subtitle1">Format Claim</Typography>
|
||||
<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
|
||||
<Card sx={{padding:2}} >
|
||||
<Grid container spacing={2}>
|
||||
<Grid item xs={6}>
|
||||
<Typography variant='subtitle1' sx={{ color: '#19BBBB', marginBottom: 4 }} gutterBottom>
|
||||
Details
|
||||
</Typography>
|
||||
</Box>
|
||||
<input
|
||||
type="file"
|
||||
id="file"
|
||||
ref={fileInvoiceInput}
|
||||
style={{ display: 'none' }}
|
||||
multiple
|
||||
onChange={handleInvoiceInputChange}
|
||||
accept="application/pdf"
|
||||
/>
|
||||
</ButtonBase>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Stack direction='row' spacing={2} sx={marginBottom1}>
|
||||
<Typography variant='subtitle2' sx={style1} gutterBottom>Provider Name</Typography>
|
||||
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.provider}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2} sx={marginBottom1}>
|
||||
<Typography variant='subtitle2' sx={style1} gutterBottom>Member ID</Typography>
|
||||
<Typography variant='subtitle2' sx={style2} gutterBottom>{claimRequests?.member_id}</Typography>
|
||||
</Stack>
|
||||
<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>
|
||||
</Card>
|
||||
</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>
|
||||
|
||||
{/* Document */}
|
||||
<Grid item xs={12} md={12}>
|
||||
<Stack direction="row" padding={4}>
|
||||
{dataDialog && dataDialog.status === 'requested' ? (
|
||||
<>
|
||||
<Button variant="outlined" sx={{color: '#212B36', marginLeft: 'auto', borderColor: '#919EAB52'}} >Cancel</Button>
|
||||
<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>
|
||||
<Card sx={{padding:2}} >
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between" sx={{marginBottom: 4}}>
|
||||
<Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
|
||||
<Typography variant='subtitle1' sx={{color: '#19BBBB'}} gutterBottom>Document </Typography>
|
||||
</Stack>
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
{dataDialog ? (
|
||||
<Stack spacing={2} padding={2}>
|
||||
<Typography variant='body1'>Are you sure to submit this claim ?</Typography>
|
||||
<Card sx={{padding:2}} >
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Code</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '70%'}}>{dataDialog.code}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Name</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '70%'}}>{dataDialog.name}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Date Submission</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '70%'}}>{fDateTimesecond(dataDialog.submission_date)}</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Claim Method</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '70%'}}>Service Type</Typography>
|
||||
</Stack>
|
||||
<Stack direction='row' spacing={2}>
|
||||
<Typography variant='subtitle2' sx={{color: '#919EAB', width: '30%'}}>Service Type</Typography>
|
||||
<Typography variant='subtitle2' sx={{width: '70%'}}>
|
||||
{dataDialog.service_code === 'IP' ? 'Inpatient' : 'Outpatient'}
|
||||
</Typography>
|
||||
</Stack>
|
||||
</Card>
|
||||
<Stack direction="column" spacing={2} sx={{marginBottom: 2}}>
|
||||
<Button variant="outlined" startIcon={<AddIcon/>} sx={{marginLeft: 'auto'}} onClick={() => {
|
||||
setDialogUploadFileLog(true)
|
||||
}} >
|
||||
<Typography variant="button" display="block">File</Typography>
|
||||
</Button>
|
||||
</Stack>
|
||||
</Stack>
|
||||
{claimRequests?.files?.map((documentType, index) => (
|
||||
<Stack direction="row" alignItems="center" justifyContent="space-between" sx={{marginBottom: 2}} key={index}>
|
||||
<Stack direction="column" spacing={2} >
|
||||
|
||||
<a
|
||||
href={documentType.url}
|
||||
style={{
|
||||
cursor: 'pointer',
|
||||
textDecoration: 'none',
|
||||
color: '#19BBBB',
|
||||
display: 'flex',
|
||||
alignItems: 'center' // Menjadikan konten dalam satu garis vertikal
|
||||
}}
|
||||
target="_blank"
|
||||
>
|
||||
<InsertDriveFileIcon style={{ marginRight: '5px' }} />
|
||||
<Typography variant="body1" gutterBottom>{documentType.original_name ? documentType.original_name : '-'}</Typography>
|
||||
</a>
|
||||
</Stack>
|
||||
) : ''}
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button variant="outlined" sx={{color: '#212B36', borderColor: '#919EAB52'}} onClick={handleCloseDialogSubmit}>Cancel</Button>
|
||||
<Button sx={{backgroundColor: '#19BBBB'}} onClick={handleSubmitData} variant="contained">Submit</Button>
|
||||
</DialogActions>
|
||||
</Dialog>
|
||||
</Stack>
|
||||
<Stack direction="column" spacing={2}>
|
||||
<IconButton onClick={() => {
|
||||
setDialogDeleteFileLog(true)
|
||||
setPathFile(documentType.path)
|
||||
}} aria-label="delete" size="small" sx={{ marginLeft: 'auto' }}>
|
||||
<Delete color='error' fontSize="small" />
|
||||
</IconButton>
|
||||
</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>
|
||||
) : ''}
|
||||
|
||||
</Container>
|
||||
</Page>
|
||||
);
|
||||
</Page>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -23,3 +23,61 @@ export type ServiceType = {
|
||||
code : 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,
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user