Update search function & utils

src/app/utils/commonUtil.ts

@@ -1,9 +1,26 @@
-
+import { defaultPagingController } from './../../components/SearchResults/SearchResults';
+import { isNullOrUndefined } from "html5-qrcode/esm/core";
+import { isEmpty } from "lodash";
 
 export const downloadFile = (blobData: Uint8Array, filename: string) => {
-    const url = URL.createObjectURL(new Blob([blobData]));
-    const link = document.createElement("a");
-    link.href = url;
-    link.setAttribute("download", filename);
-    link.click();
-  }
+  const url = URL.createObjectURL(new Blob([blobData]));
+  const link = document.createElement("a");
+  link.href = url;
+  link.setAttribute("download", filename);
+  link.click();
+}
+
+export const convertObjToURLSearchParams = <T extends Object>(data: T | null): string => {
+  if (isEmpty(data)) {
+    return ''
+  }
+
+  const params = new URLSearchParams()
+  Object.entries(data).forEach(([key, value]) => {
+    if (!isNullOrUndefined(value)) {
+      params.append(key, String(value))
+    }
+  })
+
+  return params.toString()
+}

src/app/utils/formatUtil.ts

@@ -1,4 +1,4 @@
-import dayjs, { ConfigType } from "dayjs";
+import dayjs, { ConfigType, Dayjs } from "dayjs";
 import { Uom } from "../api/settings/uom";
 import { ListIterateeCustom, every, isArray, isNaN, isNull, isUndefined, take } from "lodash";
 
@@ -54,6 +54,10 @@ export const dateTimeStringToDayjs = (dateTime: string) => {
   return dayjs(dateTime, `${OUTPUT_DATE_FORMAT} ${OUTPUT_TIME_FORMAT}`)
 }
 
+export const dayjsToDateString = (date: Dayjs) => {
+  return date.format(OUTPUT_DATE_FORMAT)
+}
+
 export const stockInLineStatusMap: { [status: string]: number } = {
   "draft": 0,
   "pending": 1,

src/components/SearchBox/SearchBox.tsx

@@ -111,11 +111,21 @@ function SearchBox<T extends string>({
     () =>
       criteria.reduce<Record<T | `${T}To`, string>>(
         (acc, c) => {
-          return {
+          var tempCriteria = {
             ...acc,
             [c.paramName]: (c.type === "select" || c.type === "select-labelled" || (c.type === "autocomplete" && !Boolean(c.multiple)) ? "All" 
             : (c.type === "autocomplete" && Boolean(c.multiple)) ? [defaultAll.value]: "")
-          };
+          }
+          
+          if (c.type === "dateRange") {
+            tempCriteria = {
+              ...tempCriteria,
+              [c.paramName]: "",
+              [`${c.paramName}To`]: ""
+            }
+          }
+
+          return tempCriteria;
         },
         {} as Record<T | `${T}To`, string>,
       ),
@@ -316,6 +326,7 @@ function SearchBox<T extends string>({
                         <DatePicker
                           label={c.label}
                           onChange={makeDateChangeHandler(c.paramName)}
+                          value={dayjs(inputs[c.paramName]).isValid() ? dayjs(inputs[c.paramName]) : null}
                         />
                       </FormControl>
                       <Box
@@ -330,6 +341,7 @@ function SearchBox<T extends string>({
                         <DatePicker
                           label={c.label2}
                           onChange={makeDateToChangeHandler(c.paramName)}
+                          value={dayjs(inputs[`${c.paramName}To`]).isValid() ? dayjs(inputs[`${c.paramName}To`]) : null}
                         />
                       </FormControl>
                     </Box>

src/components/SearchResults/SearchResults.tsx

@@ -203,7 +203,7 @@ function SearchResults<T extends ResultWithId>({
     if (setPagingController) {
       setPagingController({
         ...pagingController,
-        pageNum: +event.target.value,
+        pageNum: 1,
       });
     }
   };