datetime to date filter

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',
+      settlement: 'Diterima',
-      'expired' : 'Kadaluarsa',
+      expired: 'Kadaluarsa',
-      'capture' : 'Captured',
+      capture: 'Captured',
-      'deny' : 'Ditolak',
+      deny: 'Ditolak',
-      'pending' : 'Menunggu Pembayaran',
+      pending: 'Menunggu Pembayaran',
-      'cancel' : 'Dibatalkan',
+      cancel: 'Dibatalkan',
-      'refund' : 'Dikembalikan',
+      refund: 'Dikembalikan',
-      'expire' : 'Kadaluarsa',
+      expire: 'Kadaluarsa',
-      'cod' : 'COD',
+      cod: 'COD',
-      'FAILED' : 'Gagal',
+      FAILED: 'Gagal',
-      'COMPLETED' : 'Complete',
+      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]]);
+                  const filter = Object.fromEntries([
-                  setSearchParams(filter)
+                    ...searchParams.entries(),
-                  loadDataTableData(filter)
+                    ['search', searchText],
+                  ]);
+                  setSearchParams(filter);
+                  loadDataTableData(filter);
                 }
               }}
               label="Search"
@@ -170,44 +171,55 @@ export default function List() {
             />
           </Grid>
           <Grid item md={2}>
-          <FormControl fullWidth>
+            <FormControl fullWidth>
-  <InputLabel>
+              <InputLabel>Payment Status</InputLabel>
-    Payment Status
+              <Select
-  </InputLabel>
+                value={searchParams.get('payment_status') ?? 'semua'}
-            <Select
+                label="Payment Status"
-              value={searchParams.get('payment_status') ?? 'semua'}
+                onChange={(el) => {
-              label="Payment Status"
+                  // console.log(el.target.value)
-              onChange={(el) => {
+                  const filter = Object.fromEntries([
-                // console.log(el.target.value)
+                    ...searchParams.entries(),
-                const filter = Object.fromEntries([...searchParams.entries(), ['payment_status', el.target.value]]);
+                    ['payment_status', el.target.value],
-                setSearchParams(filter)
+                  ]);
-                loadDataTableData(filter)
+                  setSearchParams(filter);
-              }}
+                  loadDataTableData(filter);
-            >
+                }}
-              <MenuItem value={'semua'}>Semua</MenuItem>
+              >
-              {Object.entries(paymentStatusOptions).map((option, index) => (
+                <MenuItem value={'semua'}>Semua</MenuItem>
-                <MenuItem value={option[0]} key={index}>{option[1]}</MenuItem>
+                {Object.entries(paymentStatusOptions).map((option, index) => (
-              ))}
+                  <MenuItem value={option[0]} key={index}>
-            </Select>
+                    {option[1]}
+                  </MenuItem>
+                ))}
+              </Select>
             </FormControl>
           </Grid>
           <Grid item md={2}>
             <AutocompleteLinksehatHealthcare
               onChange={(value) => {
                 if (value) {
-                  const filter = Object.fromEntries([...searchParams.entries(), ['healthcare_id', value.nID ?? '']]);
+                  const filter = Object.fromEntries([
-                  setSearchParams(filter)
+                    ...searchParams.entries(),
-                  loadDataTableData(filter)
+                    ['healthcare_id', value.nID ?? ''],
-                  setOrganizationOptions([value])
+                  ]);
+                  setSearchParams(filter);
+                  loadDataTableData(filter);
+                  setOrganizationOptions([value]);
                 } else {
-                  const filter = Object.fromEntries([...searchParams.entries(), ['healthcare_id', '']]);
+                  const filter = Object.fromEntries([
-                  setSearchParams(filter)
+                    ...searchParams.entries(),
-                  loadDataTableData(filter)
+                    ['healthcare_id', ''],
-                  setOrganizationOptions([])
+                  ]);
+                  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) : ''
+                      setSearchParams(filter);
-                  var entries = [...searchParams.entries(), ['appointment_start', date ?? '']];
+                      loadDataTableData(filter);
-                  if (!searchParams.get('appointment_end')) {
+                    }
-                    entries = [...entries, ['appointment_end', date ?? '']];
+                  } catch (e) {}
-                  }
-                  const filter = Object.fromEntries(entries);
-
-                  setSearchParams(filter)
-                  loadDataTableData(filter)
-                }
-                } catch (e) {}
                 }}
-                renderInput={(params) => (
+                renderInput={(params) => <TextField {...params} fullWidth label="Start" />}
-                  <TextField
-                    {...params}
-                    fullWidth
-                    label="Start"
-                  />
-                )}
               />
             </LocalizationProvider>
           </Grid>
@@ -254,18 +257,16 @@ export default function List() {
                 inputFormat="dd/MM/yyyy"
                 onChange={(value) => {
                   try {
-
                     if (value && !!Date.parse(value)) {
-
+                      const date = fDateOnly(value);
-                      const date = fPostFormat(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)
+                      setSearchParams(filter);
-                      loadDataTableData(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(
+    const response = await axios.get('/linksehat/payments', {
-      '/linksehat/payments',
+      params: filter,
-      {
+    });
-        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,