From 13ef733010a59f021ae46acfd2d6f1a073a90220 Mon Sep 17 00:00:00 2001 From: ivan-sim Date: Fri, 17 Nov 2023 17:16:47 +0700 Subject: [PATCH] Update Hospital Portal --- .../Api/ClaimRequestController.php | 29 + .../hospital-portal/src/components/Table.tsx | 8 +- .../src/contexts/CollapseDrawerContext.tsx | 16 +- .../src/contexts/LaravelAuthContext.tsx | 4 +- .../dashboard/header/AccountPopover.tsx | 8 +- .../layouts/dashboard/navbar/NavbarDocs.tsx | 35 +- .../hospital-portal/src/pages/Dashboard.tsx | 5 +- .../src/sections/dashboard/TableList.tsx | 885 +++++++----------- .../src/sections/dashboard/TableList2.tsx | 284 ------ 9 files changed, 389 insertions(+), 885 deletions(-) delete mode 100644 frontend/hospital-portal/src/sections/dashboard/TableList2.tsx diff --git a/Modules/HospitalPortal/Http/Controllers/Api/ClaimRequestController.php b/Modules/HospitalPortal/Http/Controllers/Api/ClaimRequestController.php index 62fc3e95..e70991c4 100644 --- a/Modules/HospitalPortal/Http/Controllers/Api/ClaimRequestController.php +++ b/Modules/HospitalPortal/Http/Controllers/Api/ClaimRequestController.php @@ -267,6 +267,35 @@ class ClaimRequestController extends Controller $query->orderBy($orderBy, $direction); }) + ->when($request->input('start_date') && !$request->input('end_date'), function ($query, $start_date) { + $query->where(function ($query) use ($start_date) { + $query->where('claim_requests.submission_date', '<', $start_date); + }); + }) + ->when($request->input('status'), function ($query, $status) { + $query->where(function ($query) use ($status) { + + if ($status === 'requested') { + $query->where('claim_requests.status', '=', 'requested'); + } + + if ($status === 'reviewed') { + $query->where('claim_requests.status', '=', 'approved'); + $query->where('claims.status', '=', 'received'); + } + + if ($status === 'approved') { + $query->where('claim_requests.status', '=', 'approved'); + $query->where('claims.status', '=', 'approved'); + } + + if ($status === 'declined') { + $query->where('claim_requests.status', '=', 'approved'); + $query->where('claims.status', '=', 'declined'); + } + + }); + }) ->select('members.id', 'claim_requests.code','members.member_id', 'members.name as full_name', 'corporate_divisions.name AS division_name', DB::raw(' CASE diff --git a/frontend/hospital-portal/src/components/Table.tsx b/frontend/hospital-portal/src/components/Table.tsx index 5a9ac040..172bb0a7 100644 --- a/frontend/hospital-portal/src/components/Table.tsx +++ b/frontend/hospital-portal/src/components/Table.tsx @@ -204,7 +204,7 @@ export default function Table({ {searchs && searchs.useSearchs ? ( {filterStatus && filterStatus.useFilter ? ( - +
({ {/* Start date */} {filterStartDate && filterStartDate.useFilter ? ( - + filterStartDate.handleStartDateChange(event)}> filterStartDate.setStartDate(event.target.value)} fullWidth label="Start Date" InputLabelProps={{ @@ -272,13 +271,12 @@ export default function Table({ {filterEndDate && filterEndDate.useFilter ? ( - + filterEndDate.handleEndDateChange(event)}> filterEndDate.setEndDate(event.target.value)} fullWidth label="End Date" InputLabelProps={{ diff --git a/frontend/hospital-portal/src/contexts/CollapseDrawerContext.tsx b/frontend/hospital-portal/src/contexts/CollapseDrawerContext.tsx index 6191f198..b9b34558 100644 --- a/frontend/hospital-portal/src/contexts/CollapseDrawerContext.tsx +++ b/frontend/hospital-portal/src/contexts/CollapseDrawerContext.tsx @@ -35,14 +35,14 @@ function CollapseDrawerProvider({ children }: CollapseDrawerProviderProps) { hover: false }); - // useEffect(() => { - // if (isDesktop) { - // setCollapse({ - // click: false, - // hover: false - // }); - // } - // }, [isDesktop]); + useEffect(() => { + if (isDesktop) { + setCollapse({ + click: false, + hover: false + }); + } + }, [isDesktop]); const handleToggleCollapse = () => { setCollapse({ ...collapse, click: !collapse.click }); diff --git a/frontend/hospital-portal/src/contexts/LaravelAuthContext.tsx b/frontend/hospital-portal/src/contexts/LaravelAuthContext.tsx index c4ad4438..e5719f70 100644 --- a/frontend/hospital-portal/src/contexts/LaravelAuthContext.tsx +++ b/frontend/hospital-portal/src/contexts/LaravelAuthContext.tsx @@ -2,7 +2,7 @@ import { createContext, ReactNode, useEffect, useReducer } from 'react'; // utils import axios from '@/utils/axios'; // import { isValidToken, setSession } from '@/utils/jwt'; -import { setSession, getSession, getUser } from '@/utils/token'; +import { setSession, getSession, setUser, getUser } from '@/utils/token'; // @types import { ActionMap, AuthState, AuthUser, JWTContextType } from '@/@types/auth'; // ---------------------------------------------------------------------- @@ -135,6 +135,7 @@ function AuthProvider({ children }: AuthProviderProps) { .then((response) => { const { user, token } = response.data.data; setSession(token); + setUser(user); dispatch({ type: Types.Login, @@ -168,6 +169,7 @@ function AuthProvider({ children }: AuthProviderProps) { const logout = async () => { setSession(null); + setUser(null); dispatch({ type: Types.Logout }); }; diff --git a/frontend/hospital-portal/src/layouts/dashboard/header/AccountPopover.tsx b/frontend/hospital-portal/src/layouts/dashboard/header/AccountPopover.tsx index cae44c1e..2f0c3d3c 100644 --- a/frontend/hospital-portal/src/layouts/dashboard/header/AccountPopover.tsx +++ b/frontend/hospital-portal/src/layouts/dashboard/header/AccountPopover.tsx @@ -19,10 +19,10 @@ const MENU_OPTIONS = [ label: 'Profile', linkTo: '/profile', }, - { - label: 'Settings', - linkTo: '/', - }, + // { + // label: 'Settings', + // linkTo: '/', + // }, ]; // ---------------------------------------------------------------------- diff --git a/frontend/hospital-portal/src/layouts/dashboard/navbar/NavbarDocs.tsx b/frontend/hospital-portal/src/layouts/dashboard/navbar/NavbarDocs.tsx index 6d75ec49..a12453a1 100644 --- a/frontend/hospital-portal/src/layouts/dashboard/navbar/NavbarDocs.tsx +++ b/frontend/hospital-portal/src/layouts/dashboard/navbar/NavbarDocs.tsx @@ -7,23 +7,26 @@ import { DocIllustration } from '@/assets'; export default function NavbarDocs() { return ( - - + <> + + - {/*
- - Hi, Rayan Moran - - - Need help? -
Please check our docs -
-
+
+ + Hi, Rayan Moran + + + Need help? +
Please check our docs +
+
- */} -
+ + Hak Cipta © 2023 - 2024 Link Sehat +
+ ); } diff --git a/frontend/hospital-portal/src/pages/Dashboard.tsx b/frontend/hospital-portal/src/pages/Dashboard.tsx index 6ff99da1..2d537013 100644 --- a/frontend/hospital-portal/src/pages/Dashboard.tsx +++ b/frontend/hospital-portal/src/pages/Dashboard.tsx @@ -13,7 +13,6 @@ import { Stack } from '@mui/system'; import { Input } from '@mui/material'; //sections import TableList from '@/sections/dashboard/TableList'; -import TableList2 from '@/sections/dashboard/TableList2'; import { fDate } from '@/utils/formatTime'; import DialogDetailClaim from '@/components/dialogs/DialogDetailClaim'; @@ -88,13 +87,13 @@ export default function Dashboard() { - {console.log('submit success')}}> + {/* */} - + diff --git a/frontend/hospital-portal/src/sections/dashboard/TableList.tsx b/frontend/hospital-portal/src/sections/dashboard/TableList.tsx index bd063a75..fa14ad4d 100644 --- a/frontend/hospital-portal/src/sections/dashboard/TableList.tsx +++ b/frontend/hospital-portal/src/sections/dashboard/TableList.tsx @@ -1,351 +1,41 @@ /* ---------------------------------- @mui ---------------------------------- */ -import { styled } from '@mui/material/styles'; -import { - Paper, - Table, - TableBody, - TableCell, - TableContainer, - TableHead, - TableRow, - TextField, - Button, - TableSortLabel, - Box, - IconButton, - Card, - Grid, - FormControl, - InputLabel, - Select, - MenuItem, - SelectChangeEvent, - Stack, - Typography, - LinearProgress, - linearProgressClasses, -} from '@mui/material'; -import { visuallyHidden } from '@mui/utils'; +import { Stack, Button, MenuItem, SelectChangeEvent } from '@mui/material'; /* ---------------------------------- axios --------------------------------- */ -import axios from '@/utils/axios'; +// import axios from 'axios'; +import axios from '../../utils/axios'; /* ---------------------------------- react --------------------------------- */ import { useContext, useEffect, useState } from 'react'; + /* -------------------------------- component ------------------------------- */ -import Iconify from '@/components/Iconify'; -import BaseTablePagination from '@/components/BaseTablePagination'; +import Iconify from '../../components/Iconify'; +import TableComponent from '../../components/Table'; /* ---------------------------------- theme --------------------------------- */ -import palette from '@/theme/palette'; -import { useSearchParams } from 'react-router-dom'; -// import { UserCurrentCorporateContext } from '@/contexts/UserCurrentCorporate'; -import { fSplit } from '@/utils/formatNumber'; -import { Chip } from '@mui/material'; -import { enqueueSnackbar } from 'notistack'; -import DialogDetailClaim from '@/components/dialogs/DialogDetailClaim'; +import palette from '../../theme/palette'; +//import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate'; +import { HeadCell, Order, PaginationTableProps } from '../../@types/table'; +import { useSearchParams, useNavigate } from 'react-router-dom'; +import { fDate, fDateSuffix } from '../../utils/formatTime'; +import Typography from '@mui/material/Typography'; import { format } from 'date-fns'; -import TableMoreMenu from '@/components/table/TableMoreMenu'; +import TableMoreMenu from '../../components/table/TableMoreMenu'; +import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined'; +import HistoryIcon from '@mui/icons-material/History'; +import SearchIcon from '@mui/icons-material/Search'; +import Label from '../../components/Label'; +import { enqueueSnackbar } from 'notistack'; -/* ---------------------------------- types --------------------------------- */ -type PaginationTableProps = { - current_page: number; - from: number; - last_page: number; - links: []; - path: string; - per_page: number; - to: number; - total: number; -}; +export default function TableList2() { + const navigate = useNavigate(); -type DataTableProps = { - fullName: string; - memberId: string; - division: string; - limit: { - current: number; - total: number; - percentage: number; - }; - status: string; -}; + //const { corporateValue } = useContext(UserCurrentCorporateContext); + //const { corporateValue } = useContext(null); -type Order = 'asc' | 'desc'; + const [data, setData] = useState([]); -interface HeadCell { - id: string; - align: string; - label: string; - isSort: boolean; -} - -interface EnhancedTableProps { - onRequestSort: (event: React.MouseEvent, property: string) => void; - order: Order; - orderBy: string; -} - -type DivisionDataProps = { - id: number; - name: string; -}; -/* -------------------------------------------------------------------------- */ - -/* --------------------------------- styled --------------------------------- */ -const BorderLinearProgress = styled(LinearProgress)(({ theme }) => ({ - height: 10, - borderRadius: 6, - [`&.${linearProgressClasses.colorPrimary}`]: { - backgroundColor: '#D1F1F1', - }, - [`& .${linearProgressClasses.bar}`]: { - borderRadius: 6, - backgroundColor: theme.palette.primary.main, - }, -})); -/* -------------------------------------------------------------------------- */ - -/* -------------------------- enchanced table head -------------------------- */ -const headCells: readonly HeadCell[] = [ - { - id: 'code', - align: 'left', - label: 'Request Code', - isSort: true, - width:'25%', - }, - { - id: 'member.name', - align: 'left', - label: 'Name', - isSort: false, - width: '33%', - }, - { - id: 'submission_date', - align: 'left', - label: 'Submission Date', - isSort: true, - width: '25%', - }, - { - id: 'status', - align: 'left', - label: 'Status', - isSort: true, - width: '10%', - }, - { - id: 'action', - align: 'left', - label: '', - isSort: true, - width: '7%', - }, -]; - -function EnhancedTableHead({ order, orderBy, onRequestSort }: EnhancedTableProps) { - const createSortHandler = (property: string) => (event: React.MouseEvent) => { - onRequestSort(event, property); - }; - - return ( - - - {headCells.map((headCell) => ( - - {headCell.isSort ? ( - - {headCell.label} - {orderBy === headCell.id ? ( - - {order === 'desc' ? 'sorted descending' : 'sorted ascending'} - - ) : null} - - ) : ( - headCell.label - )} - - ))} - {''} - - - ); -} -/* -------------------------------------------------------------------------- */ - -// TODO Don't use emit -export default function TableList(props: any) { - const [dataTable, setDataTable] = useState([]); - const [paginationTable, setPaginationTable] = useState({ - current_page: 0, - from: 0, - last_page: 0, - links: [], - path: '', - per_page: 0, - to: 0, - total: 0, - }); - - const [isLoading, setIsLoading] = useState(true); - const [searchParams, setSearchParams] = useSearchParams(); - const [appliedParams, setAppliedParams] = useState({}); - - const [order, setOrder] = useState('asc'); - const [orderBy, setOrderBy] = useState('name'); - const [page, setPage] = useState(0); - const [rowsPerPage, setRowsPerPage] = useState(10); - - /* ------------------------------- handle sort ------------------------------ */ - const handleRequestSort = async (event: React.MouseEvent, property: string) => { - const isAsc = orderBy === property && order === 'asc'; - setOrder(isAsc ? 'desc' : 'asc'); - setOrderBy(property); - const params = Object.fromEntries([ - ...searchParams.entries(), - ['order', isAsc ? 'desc' : 'asc'], - ['orderBy', property], - ]); - setAppliedParams(params); - }; - /* -------------------------------------------------------------------------- */ - - /* ----------------------------- status field ----------------------------- */ - const [filterStatus, setFilterStatus] = useState('All'); - const [statusOptions, setStatusOptions] = useState(['All', 'Requested', 'Approved', 'Declined']); - - const handleStatusChange = (event: SelectChangeEvent) => { - setFilterStatus(event.target.value as string); - - if (event.target.value === 'All') { - searchParams.delete('status'); - const params = Object.fromEntries([...searchParams.entries()]); - setAppliedParams(params); - } else { - const params = Object.fromEntries([ - ...searchParams.entries(), - ['status', event.target.value.toLowerCase() as string], - ]); - setAppliedParams(params); - } - }; - /* -------------------------------------------------------------------------- */ - - /* ------------------------------ Search field ------------------------------ */ - const [searchText, setSearchText] = useState(''); - const [searchStatus, setSearchStatus] = useState('all'); - - const handleSearchSubmit = async (event: React.FormEvent) => { - event.preventDefault(); - setIsLoading(true); - - // Filter by Search Text - if (searchText === '') { - searchParams.delete('search'); - const params = Object.fromEntries([...searchParams.entries()]); - setAppliedParams(params); - } else { - const params = Object.fromEntries([...searchParams.entries(), ['search', searchText]]); - setAppliedParams(params); - } - - await new Promise((resolve) => setTimeout(resolve, 500)); - setIsLoading(false); - }; - /* -------------------------------------------------------------------------- */ - - /* ------------------------ button change pagination ------------------------ */ - const onPageChangeHandle = async ( - event: React.MouseEvent | null, - newPage: number - ) => { - setIsLoading(true); - const params = Object.fromEntries([...searchParams.entries(), ['page', newPage + 1]]); - setPage(newPage); - await new Promise((resolve) => setTimeout(resolve, 500)); - setAppliedParams(params); - setIsLoading(false); - }; - /* -------------------------------------------------------------------------- */ - - /* --------------------------- row page per limit --------------------------- */ - const onRowsPerPageChangeHandle = async (event: React.ChangeEvent) => { - setIsLoading(true); - searchParams.delete('page'); - const params = Object.fromEntries([ - ...searchParams.entries(), - ['per_page', parseInt(event.target.value, 10)], - ]); - setRowsPerPage(parseInt(event.target.value, 10)); - await new Promise((resolve) => setTimeout(resolve, 500)); - setAppliedParams(params); - setIsLoading(false); - }; - /* -------------------------------------------------------------------------- */ - - useEffect(() => { - (async () => { - setIsLoading(true); - - // const division = await axios.get(`${corporateValue}/division`); - // setDivisionData(division.data); - - const params = - Object.keys(appliedParams).length !== 0 - ? appliedParams - : Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]); - - const response = await axios.get(`/claim-requests`, { - params: { ...params }, - }); - - setSearchParams(params); - setDataTable(response.data.data.data); - setPaginationTable(response.data.data); - setRowsPerPage(response.data.data.per_page); - setIsLoading(false); - - // TODO Remove This - props.dataLoaded(response.data.data.data); - })(); - }, [appliedParams, searchParams, order, orderBy, setSearchParams]); - - // --------------------------------------------------------- - // Dialog Detail Claim - const [openDialogDetailClaim, setOpenDialogDetailClaim] = useState(false); - const [loadingClaimDetail, setLoadingClaimDetail] = useState(true); - const [currentClaim, setCurrentClaim] = useState(null); - - function handleShowClaim(claimRequest) { - setLoadingClaimDetail(true); - setOpenDialogDetailClaim(true); - - axios.get(`/claim-requests/${claimRequest.id}`) - .then(({data}) => { - console.log(data.data); - setCurrentClaim(data.data); - setLoadingClaimDetail(false); - }) - .catch((err) => { - enqueueSnackbar(err.message, {variant: 'error'}) - }) - } - - // ----------------------------------------------------------------- // Download LOG async function handleDownloadLog(claimRequest) { return axios - .get(`claim-requests/${claimRequest.id}/log`, { + .get(`claim-requests/${claimRequest}/log`, { responseType: 'blob', }) .then((response) => { @@ -357,245 +47,312 @@ export default function TableList(props: any) { // setLoadingLog(false); // }) .catch((response) => { + console.log(response); enqueueSnackbar(response.message, { variant: 'error' }); // setLoadingLog(false); }); } - return ( - - - {/* Field 1 */} - - - - {/* - Division - - */} - - - - - - setSearchText(event.target.value)} - value={searchText} - fullWidth - /> - - - - Status - - - - - - - - - - {/* End Field 1 */} - {/* Field 2 */} - - - - - - {isLoading ? ( - - - Loading . . . - - - ) : dataTable.length >= 1 ? ( - dataTable.map((row: DataTableProps, index) => ( - - {row.code} - {row.member?.full_name ?? ''} - - theme.palette.grey[300], - borderRadius: '4px', - width: '70%', - }} - variant="body2" - > - {row.submission_date ? format(new Date(row.submission_date), "d MMM yyyy") : ''} - - - - {row.status === 'requested' ? ( - - Request - - ) : row.status === 'approved' ? ( - - Approval - - ) : row.status === 'declined' ? ( - - Decline - - ) : row.status === 'pending' ? ( - - Pending - - ) : row.status === 'reviewed' ? ( - - Review - - ) : ''} - + handleDownloadLog(obj.claim_request_id)}> + + Download LOG + + + } /> + })) + ); - - - handleShowClaim(row)}> - - View - - handleDownloadLog(row)}> - - Download LOG - - - } /> - - - )) - ) : ( - - - No Data Found - - - )} - -
-
+ setPaginationTable(response.data); + setRowsPerPage(response.data.per_page); - {/* Pagination */} - -
- {/* End Field 2 */} -
+ if (searchParams.get('page')) { + //@ts-ignore + const currentPage = parseInt(searchParams.get('page')) - 1; - - - + paginationTable.current_page = currentPage; + setPage(currentPage); + } -
+ const status = [ + {"id": "requested", "name": "Request" }, + {"id": "reviewed", "name": "Review" }, + {"id": "approved", "name": "Approval" }, + {"id": "declined", "name": "Decline" }, + ] + setStatusData(status) + + setIsLoading(false); + })(); + }, [appliedParams, searchParams, order, orderBy, setSearchParams]); + + return ( + + + ); } diff --git a/frontend/hospital-portal/src/sections/dashboard/TableList2.tsx b/frontend/hospital-portal/src/sections/dashboard/TableList2.tsx deleted file mode 100644 index f10f6048..00000000 --- a/frontend/hospital-portal/src/sections/dashboard/TableList2.tsx +++ /dev/null @@ -1,284 +0,0 @@ -/* ---------------------------------- @mui ---------------------------------- */ -import { Stack, Button, MenuItem } from '@mui/material'; -/* ---------------------------------- axios --------------------------------- */ -// import axios from 'axios'; -import axios from '../../utils/axios'; -/* ---------------------------------- react --------------------------------- */ -import { useContext, useEffect, useState } from 'react'; - -/* -------------------------------- component ------------------------------- */ -import Iconify from '../../components/Iconify'; -import TableComponent from '../../components/Table'; -/* ---------------------------------- theme --------------------------------- */ -import palette from '../../theme/palette'; -//import { UserCurrentCorporateContext } from '../../contexts/UserCurrentCorporate'; -import { HeadCell, Order, PaginationTableProps } from '../../@types/table'; -import { useSearchParams, useNavigate } from 'react-router-dom'; -import { fDate, fDateSuffix } from '../../utils/formatTime'; -import Typography from '@mui/material/Typography'; -import { format } from 'date-fns'; -import TableMoreMenu from '../../components/table/TableMoreMenu'; -import VisibilityOutlinedIcon from '@mui/icons-material/VisibilityOutlined'; -import HistoryIcon from '@mui/icons-material/History'; -import SearchIcon from '@mui/icons-material/Search'; -import Label from '../../components/Label'; -import { enqueueSnackbar } from 'notistack'; - -export default function TableList2() { - const navigate = useNavigate(); - - //const { corporateValue } = useContext(UserCurrentCorporateContext); - //const { corporateValue } = useContext(null); - - const [data, setData] = useState([]); - - // Download LOG - async function handleDownloadLog(claimRequest) { - return axios - .get(`claim-requests/${claimRequest}/log`, { - responseType: 'blob', - }) - .then((response) => { - window.open(URL.createObjectURL(response.data)); - // setLoadingLog(false); - }) - // .then((blobFile) => { - // new File([blobFile], 'asdads.pdf', { type: blobFile.type }) - // setLoadingLog(false); - // }) - .catch((response) => { - console.log(response); - enqueueSnackbar(response.message, { variant: 'error' }); - // setLoadingLog(false); - }); - } - - /* -------------------------------------------------------------------------- */ - /* setting up for the table */ - /* -------------------------------------------------------------------------- */ - const [isLoading, setIsLoading] = useState(true); - - const loadings = { - isLoading: isLoading, - setIsLoading: setIsLoading, - }; - - /* ------------------------------ handle params ----------------------------- */ - const [searchParams, setSearchParams] = useSearchParams(); - const [appliedParams, setAppliedParams] = useState({}); - - const params = { - searchParams: searchParams, - setSearchParams: setSearchParams, - appliedParams: appliedParams, - setAppliedParams: setAppliedParams, - }; - /* -------------------------------------------------------------------------- */ - - /* ------------------------------ handle order ------------------------------ */ - const [order, setOrder] = useState('desc'); - const [orderBy, setOrderBy] = useState('submission_date'); - - const orders = { - order: order, - setOrder: setOrder, - orderBy: orderBy, - setOrderBy: setOrderBy, - }; - /* -------------------------------------------------------------------------- */ - - /* ---------------------------- handle pagination --------------------------- */ - const [page, setPage] = useState(0); - const [rowsPerPage, setRowsPerPage] = useState(10); - - const [paginationTable, setPaginationTable] = useState({ - current_page: 0, - from: 0, - last_page: 0, - links: [], - path: '', - per_page: 0, - to: 0, - total: 0, - }); - - const paginations = { - page: page, - setPage: setPage, - rowsPerPage: rowsPerPage, - setRowsPerPage: setRowsPerPage, - paginationTable: paginationTable, - setPaginationTable: setPaginationTable, - }; - - /* -------------------------------------------------------------------------- */ - - /* ------------------------------ handle search ----------------------------- */ - const [searchText, setSearchText] = useState(''); - - const handleSearchSubmit = async (event: React.FormEvent) => { - event.preventDefault(); - - if (searchText === '') { - searchParams.delete('search'); - const params = Object.fromEntries([...searchParams.entries()]); - setAppliedParams(params); - } else { - const params = Object.fromEntries([...searchParams.entries(), ['search', searchText]]); - setAppliedParams(params); - } - }; - - const searchs = { - useSearchs: true, - searchText: searchText, - setSearchText: setSearchText, - handleSearchSubmit: handleSearchSubmit, - }; - - /* -------------------------------- headCell -------------------------------- */ - const headCells: HeadCell[] = [ - { - id: 'submission_date', - align: 'center', - label: 'Request Date', - isSort: true, - }, - { - id: 'member_id', - align: 'left', - label: 'Member ID', - isSort: true, - }, - { - id: 'code', - align: 'left', - label: 'Claim Code', - isSort: true, - }, - { - id: 'full_name', - align: 'left', - label: 'Name', - isSort: true, - }, - { - id: 'status', - align: 'center', - label: 'Status', - isSort: true, - }, - { - id: 'action', - align: 'right', - label: '', - isSort: false, - }, - ]; - - useEffect(() => { - (async () => { - setIsLoading(true); - - await new Promise((resolve) => setTimeout(resolve, 250)); - - const parameters = - Object.keys(appliedParams).length !== 0 - ? appliedParams - : Object.fromEntries([...searchParams.entries(), ['order', order], ['orderBy', orderBy]]); - - const response = await axios.get(`/get-claim-requests`, { - params: { ...parameters, type: 'claim-report' }, - }); - - setData( - response.data.data.map((obj: any) => ({ - ...obj, - status: - obj.status === 'requested' ? ( - - ) : obj.status === 'approved' ? ( - - ) : obj.status === 'declined' ? ( - - ) : obj.status === 'pending' ? ( - - ) : obj.status === 'reviewed' ? ( - - ) : ( - - ), - submission_date: - - , - action: - - navigate ('/detail/'+obj.claim_request_id)}> - - View - - handleDownloadLog(obj.claim_request_id)}> - - Download LOG - - - } /> - })) - ); - - setPaginationTable(response.data); - setRowsPerPage(response.data.per_page); - - if (searchParams.get('page')) { - //@ts-ignore - const currentPage = parseInt(searchParams.get('page')) - 1; - - paginationTable.current_page = currentPage; - setPage(currentPage); - } - - setIsLoading(false); - })(); - }, [appliedParams, searchParams, order, orderBy, setSearchParams]); - - return ( - - - - ); -}