From 26b82db77bc677830593bcbc4c5519e5ee83f4e8 Mon Sep 17 00:00:00 2001 From: Muhammad Fajar Date: Thu, 31 Aug 2023 15:54:01 +0700 Subject: [PATCH] datetime to date filter --- .../pages/Report/LinksehatPayments/List.tsx | 158 +++++++++--------- 1 file changed, 78 insertions(+), 80 deletions(-) diff --git a/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx b/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx index 3d4bcb87..338d64b2 100644 --- a/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx +++ b/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx @@ -63,7 +63,7 @@ import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight'; import { DesktopDatePicker, LocalizationProvider } from '@mui/x-date-pickers'; import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'; import { MenuItem } from '@mui/material'; -import { fPostFormat } from '@/utils/formatTime'; +import { fDateOnly } from '@/utils/formatTime'; import AutocompleteLinksehatHealthcare from '@/components/autocomplete/AutocompleteLinksehatHealthcare'; // ---------------------------------------------------------------------- @@ -81,12 +81,10 @@ export default function List() { const [searchParamsFilter, setSearchParamsFilter] = useSearchParams(); useEffect(() => { - // axios.get(`/search-organizations`).then((response) => { // setOrganizationOptions(response.data); // }); - - }, []) + }, []); function Filter(props: any) { // SEARCH @@ -123,17 +121,17 @@ export default function List() { ]; const paymentStatusOptions = { - 'settlement' : 'Diterima', - 'expired' : 'Kadaluarsa', - 'capture' : 'Captured', - 'deny' : 'Ditolak', - 'pending' : 'Menunggu Pembayaran', - 'cancel' : 'Dibatalkan', - 'refund' : 'Dikembalikan', - 'expire' : 'Kadaluarsa', - 'cod' : 'COD', - 'FAILED' : 'Gagal', - 'COMPLETED' : 'Complete', + settlement: 'Diterima', + expired: 'Kadaluarsa', + capture: 'Captured', + deny: 'Ditolak', + pending: 'Menunggu Pembayaran', + cancel: 'Dibatalkan', + refund: 'Dikembalikan', + expire: 'Kadaluarsa', + cod: 'COD', + FAILED: 'Gagal', + COMPLETED: 'Complete', }; const dataOrganizations = []; @@ -151,10 +149,13 @@ export default function List() { onKeyDown={(event) => { if (event.key === 'Enter') { // handleSearchSubmit(event); - - const filter = Object.fromEntries([...searchParams.entries(), ['search', searchText]]); - setSearchParams(filter) - loadDataTableData(filter) + + const filter = Object.fromEntries([ + ...searchParams.entries(), + ['search', searchText], + ]); + setSearchParams(filter); + loadDataTableData(filter); } }} label="Search" @@ -170,44 +171,55 @@ export default function List() { /> - - - Payment Status - - + + Payment Status + { if (value) { - const filter = Object.fromEntries([...searchParams.entries(), ['healthcare_id', value.nID ?? '']]); - setSearchParams(filter) - loadDataTableData(filter) - setOrganizationOptions([value]) + const filter = Object.fromEntries([ + ...searchParams.entries(), + ['healthcare_id', value.nID ?? ''], + ]); + setSearchParams(filter); + loadDataTableData(filter); + setOrganizationOptions([value]); } else { - const filter = Object.fromEntries([...searchParams.entries(), ['healthcare_id', '']]); - setSearchParams(filter) - loadDataTableData(filter) - setOrganizationOptions([]) + const filter = Object.fromEntries([ + ...searchParams.entries(), + ['healthcare_id', ''], + ]); + setSearchParams(filter); + loadDataTableData(filter); + setOrganizationOptions([]); } }} currentOptions={organizationOptions} - currentValue={organizationOptions?.find((org) => org?.nID == searchParams.get('healthcare_id'))} + currentValue={organizationOptions?.find( + (org) => org?.nID == searchParams.get('healthcare_id') + )} textLabel="Rumah Sakit" placeholder="Nama" /> @@ -219,30 +231,21 @@ export default function List() { value={searchParams.get('appointment_start')} inputFormat="dd/MM/yyyy" onChange={(value) => { - try { - if (value && !!Date.parse(value)) { + const date = value ? fDateOnly(value) : ''; + var entries = [...searchParams.entries(), ['appointment_start', date ?? '']]; + if (!searchParams.get('appointment_end')) { + entries = [...entries, ['appointment_end', date ?? '']]; + } + const filter = Object.fromEntries(entries); - const date = value ? fPostFormat(value) : '' - var entries = [...searchParams.entries(), ['appointment_start', date ?? '']]; - if (!searchParams.get('appointment_end')) { - entries = [...entries, ['appointment_end', date ?? '']]; - } - const filter = Object.fromEntries(entries); - - setSearchParams(filter) - loadDataTableData(filter) - } - } catch (e) {} + setSearchParams(filter); + loadDataTableData(filter); + } + } catch (e) {} }} - renderInput={(params) => ( - - )} + renderInput={(params) => } /> @@ -254,18 +257,16 @@ export default function List() { inputFormat="dd/MM/yyyy" onChange={(value) => { try { - if (value && !!Date.parse(value)) { - - const date = fPostFormat(value) + const date = fDateOnly(value); var entries = [...searchParams.entries(), ['appointment_end', date ?? '']]; if (!searchParams.get('appointment_start')) { entries = [...entries, ['appointment_start', date ?? '']]; } const filter = Object.fromEntries(entries); - - setSearchParams(filter) - loadDataTableData(filter) + + setSearchParams(filter); + loadDataTableData(filter); } } catch (e) {} }} @@ -488,12 +489,9 @@ export default function List() { const loadDataTableData = async (appliedFilter: any | null = null) => { setDataTableLoading(true); const filter = appliedFilter ? appliedFilter : Object.fromEntries([...searchParams.entries()]); - const response = await axios.get( - '/linksehat/payments', - { - params: filter, - } - ); + const response = await axios.get('/linksehat/payments', { + params: filter, + }); setDataTableLoading(false); setDataTableData(response.data.data); }; @@ -508,7 +506,7 @@ export default function List() { searchFilterOrganization: string, searchFilterPaymentStatus: string, searchFilterAppointmentStart: string, - searchFilterAppointmentEnd: string, + searchFilterAppointmentEnd: string ) => { await loadDataTableData({ search: searchFilter,