update listing dan edit claim management

This commit is contained in:
2023-10-26 10:32:43 +07:00
parent 0abcaea006
commit adcb4e508d
22 changed files with 2302 additions and 1218 deletions

View File

@@ -16,13 +16,10 @@ import {
Menu,
ButtonGroup,
Tooltip,
TableHead,
} from '@mui/material';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
import AddIcon from '@mui/icons-material/Add';
import FindInPageOutlinedIcon from '@mui/icons-material/FindInPageOutlined';
import AssessmentIcon from '@mui/icons-material/Assessment';
import UploadIcon from '@mui/icons-material/Upload';
import CancelIcon from '@mui/icons-material/Cancel';
// hooks
import React, { ChangeEvent, useEffect, useRef, useState } from 'react';
import { Link, Navigate, useNavigate, useSearchParams } from 'react-router-dom';
@@ -36,6 +33,12 @@ import { Chip } from '@mui/material';
import Iconify from '@/components/Iconify';
import { enqueueSnackbar } from 'notistack';
import { fDate } from '../../utils/formatTime';
import { Claims } from '@/@types/claims';
import Label from '@/components/Label';
import { capitalizeFirstLetter } from '@/utils/formatString';
import TableMoreMenu from '@/components/table/TableMoreMenu';
import Edit from '@mui/icons-material/Edit';
import { Download } from '@mui/icons-material';
export default function List() {
const [searchParams, setSearchParams] = useSearchParams();
@@ -84,10 +87,16 @@ export default function List() {
fullWidth
onChange={handleSearchChange}
value={searchText}
placeholder='Search Code or Member ID...'
/>
<Tooltip title="Benefit Usage Report">
<Button variant="outlined" startIcon={<AssessmentIcon />} sx={{ p: 1.8 }} onClick={handleGetData}/>
</Tooltip>
<Button
variant="contained"
startIcon={<Download />}
sx={{ p: 1.8 }}
onClick={handleGetData}
>
Export
</Button>
</Stack>
</form>
);
@@ -153,7 +162,7 @@ export default function List() {
};
// Called on every row to map the data to the columns
function createData(data: any): any {
function createData(data: Claims): Claims {
return {
...data,
};
@@ -176,36 +185,37 @@ export default function List() {
</TableCell> */}
<TableCell align="left">{row.claim_request?.code}</TableCell>
{/* <TableCell align="left">{row.code}</TableCell> */}
<TableCell align="left">{fDate(row.created_at)}</TableCell>
<TableCell align="left">{row.member?.full_name}</TableCell>
<TableCell align="left">{row.plan?.code}</TableCell>
<TableCell align="left">{row.claim_request?.service?.name}</TableCell>
<TableCell align="left">
({row.diagnoses[0]?.icd?.code}) {row.diagnoses[0]?.icd?.name}
</TableCell>
<TableCell align="left">{fCurrency(row.total_claim)}</TableCell>
<TableCell align="left">{row.member?.current_plan?.code}</TableCell>
<TableCell align="left">{row.member?.current_corporate?.payor_id}</TableCell>
<TableCell align="left">{row.member?.current_corporate?.code}</TableCell>
<TableCell align="left">{row.member?.current_corporate?.current_policy?.code}</TableCell>
<TableCell align="left">{row.member?.member_id}</TableCell>
<TableCell align="left">{row.benefit ? row.benefit?.description : '-'}</TableCell>
<TableCell align="center">
{row.status == 'draft' && (<Chip label='Draft' color="default" variant="outlined" />)}
{row.status == 'requested' && (<Chip label='Requested' color="primary" />)}
{row.status == 'received' && (<Chip label='Received' color="success" variant='outlined' />)}
{row.status == 'approved' && (<Chip label='Approved' color="success" />)}
{row.status == 'postpone' && (<Chip label='Postpone' color="primary" variant="outlined" />)}
{row.status == 'paid' && (<Chip label='Paid' color="warning" />)}
{row.status == 'declined' && (<Chip label='Declined' color="error" />)}
{row.status == 'draft' && (<Label color='secondary' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'requested' && (<Label color='primary' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'received' && (<Label color='secondary' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'approved' && (<Label color='success' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'postpone' && (<Label color='secondary' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'paid' && (<Label color='secondary' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
{row.status == 'declined' && (<Label color='error' variant='ghost'>{capitalizeFirstLetter(row.status)}</Label>)}
</TableCell>
<TableCell align="right">
{['approved', 'paid'].includes(row.status) && (
<Iconify icon="eva:eye-fill" onClick={(e) => {
navigate('/claims/' + row.id);
}}></Iconify>
)}
{!['approved', 'paid'].includes(row.status) && (
<Iconify icon="eva:edit-outline" onClick={(e) => {
navigate('/claims/' + row.id);
}}></Iconify>
)}
</TableCell>
<TableMoreMenu actions={
<>
<MenuItem onClick={() =>navigate(`/claims/edit/${row.id}`) }>
<Edit />
Edit
</MenuItem>
<MenuItem onClick={() => setOpen(!open) }>
<FindInPageOutlinedIcon />
Detail
</MenuItem>
</>
} />
</TableRow>
{/* COLLAPSIBLE ROW */}
<TableRow>
@@ -230,41 +240,38 @@ export default function List() {
return (
<Table aria-label="collapsible table">
{/* ------------------ TABLE HEADER ------------------ */}
<TableBody>
<TableHead>
<TableRow>
{/* <TableCell style={headStyle} align="left" /> */}
<TableCell style={headStyle} align="left">
Code Request
Code
</TableCell>
<TableCell style={headStyle} align="left">
Date
</TableCell>
{/* <TableCell style={headStyle} align="left">
Code Claim
</TableCell> */}
<TableCell style={headStyle} align="left">
Member Name
Plan ID
</TableCell>
<TableCell style={headStyle} align="left">
Plan
Payor ID
</TableCell>
<TableCell style={headStyle} align="left">
Benefit
Corporate ID
</TableCell>
<TableCell style={headStyle} align="left">
Diagnosis
Policy Number
</TableCell>
<TableCell style={headStyle} align="left">
Total Claim
Member ID
</TableCell>
<TableCell style={headStyle} align="left">
Benefit Desc
</TableCell>
<TableCell style={headStyle} align="left">
Status
</TableCell>
<TableCell style={headStyle} align="right">
Action
<TableCell style={headStyle} align="left">
</TableCell>
</TableRow>
</TableBody>
</TableHead>
{/* ------------------ END TABLE HEADER ------------------ */}
{/* ------------------ TABLE ROW ------------------ */}