@djb25/digit-ui-module-wt 1.0.31 → 1.0.32

package/dist/index.modern.js

@@ -1,4 +1,4 @@
-import { TickMark, ArrowDown, MobileNumber, CardLabelError, TextInput, Dropdown, DatePicker, SubmitBar, Card, Table, Loader, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, HomeIcon, KeyNote, Modal, CardHeader, FormStep, CardLabel, RadioButtons, UploadFile, TextArea, CheckBox, CardSubHeader, StatusTable, Row, GenericFileIcon, LinkButton, EditIcon, Banner, CHBIcon, EmployeeModuleCard, CloseSvg, Label, LinkLabel, ActionBar, DetailsCard, SearchAction, FilterAction, PopUp, ShippingTruck, CustomNameDropdown, MultiSelectDropdown, CollapsibleCardPage as CollapsibleCardPage$1, LabelFieldPair, AddIcon, Menu, Header, TelePhone, DisplayPhotos, CardSectionHeader, CheckPoint, ConnectingCheckPoints, MultiLink, Localities, RemoveableTag, FormComposer, PDFSvg, MultiUploadWrapper, Close as Close$g, BreakLine, InfoBannerIcon, ViewsIcon, ButtonSelector, LocationIcon, CitizenHomeCard, PTIcon, ApplicantDetails, AddressDetails } from '@djb25/digit-ui-react-components';
+import { TickMark, ArrowDown, MobileNumber, CardLabelError, TextInput, Dropdown, DatePicker, SubmitBar, Card, Table, Loader, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, HomeIcon, KeyNote, Modal, CardHeader, FormStep, CardLabel, RadioButtons, UploadFile, TextArea, CheckBox, CardSubHeader, StatusTable, Row, GenericFileIcon, LinkButton, EditIcon, Banner, CHBIcon, EmployeeModuleCard, CloseSvg, Label, LinkLabel, ActionBar, DetailsCard, SearchAction, FilterAction, PopUp, ShippingTruck, CustomNameDropdown, MultiSelectDropdown, CollapsibleCardPage as CollapsibleCardPage$1, LabelFieldPair, AddIcon, Menu, LayoutWrapper, Header, TelePhone, DisplayPhotos, CardSectionHeader, CheckPoint, ConnectingCheckPoints, MultiLink, Localities, RemoveableTag, FormComposer, PDFSvg, MultiUploadWrapper, Close as Close$g, BreakLine, InfoBannerIcon, ViewsIcon, ButtonSelector, LocationIcon, CitizenHomeCard, PTIcon, ApplicantDetails, AddressDetails } from '@djb25/digit-ui-react-components';
 import React, { useRef, useEffect, useState, useMemo, useCallback, Fragment } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useRouteMatch, useHistory, Switch, Route, Redirect, Link, useParams } from 'react-router-dom';
@@ -7841,6 +7841,254 @@ const VendorAssign = ({
   }));
 };
 
+const Reports = ({
+  isLoading: _isLoading = false,
+  t,
+  onSubmit: _onSubmit = () => {},
+  data: _data = null,
+  count: _count = 0,
+  setShowToast: _setShowToast = false
+}) => {
+  const isMobile = window.Digit.Utils.browser.isMobile();
+  const user = Digit.UserService.getUser().info;
+  const defaultValues = {
+    offset: 0,
+    limit: 10,
+    sortBy: "commencementDate",
+    sortOrder: "DESC",
+    bookingNo: "",
+    mobileNumber: "",
+    applicantName: "",
+    status: "",
+    fromDate: "",
+    toDate: ""
+  };
+  const {
+    register,
+    control,
+    handleSubmit,
+    setValue,
+    getValues,
+    reset,
+    formState,
+    watch
+  } = useForm({
+    defaultValues
+  });
+  const fromDateValue = watch("fromDate");
+  const GetCell = value => /*#__PURE__*/React.createElement("span", {
+    className: "cell-text"
+  }, value);
+  const columns = useMemo(() => [{
+    Header: t("WT_BOOKING_NO"),
+    accessor: "bookingNo",
+    disableSortBy: true,
+    Cell: ({
+      row
+    }) => {
+      const bookingNo = row.original["bookingNo"];
+      const userTypePath = user.type === "EMPLOYEE" ? "employee" : "citizen";
+      return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+        className: "link"
+      }, /*#__PURE__*/React.createElement(Link, {
+        to: `${APPLICATION_PATH}/${userTypePath}/wt/bookingsearch/booking-details/${bookingNo}`
+      }, bookingNo)));
+    }
+  }, {
+    Header: t("WT_APPLICANT_NAME"),
+    disableSortBy: true,
+    Cell: ({
+      row
+    }) => {
+      var _row$original, _row$original$applica;
+      return GetCell((_row$original = row.original) === null || _row$original === void 0 ? void 0 : (_row$original$applica = _row$original.applicantDetail) === null || _row$original$applica === void 0 ? void 0 : _row$original$applica["name"]);
+    }
+  }, {
+    Header: t("WT_MOBILE_NUMBER"),
+    disableSortBy: true,
+    Cell: ({
+      row
+    }) => {
+      var _row$original2, _row$original2$applic;
+      return GetCell((_row$original2 = row.original) === null || _row$original2 === void 0 ? void 0 : (_row$original2$applic = _row$original2.applicantDetail) === null || _row$original2$applic === void 0 ? void 0 : _row$original2$applic["mobileNumber"]);
+    }
+  }, {
+    Header: t("PT_COMMON_TABLE_COL_STATUS_LABEL"),
+    disableSortBy: true,
+    Cell: ({
+      row
+    }) => GetCell(t(row.original["bookingStatus"]))
+  }], [t, user.type]);
+  const onSort = useCallback(args => {
+    if (args.length === 0) return;
+    setValue("sortBy", args.id);
+    setValue("sortOrder", args.desc ? "DESC" : "ASC");
+  }, [setValue]);
+  const onPageSizeChange = e => {
+    setValue("limit", Number(e.target.value));
+    handleSubmit(_onSubmit)();
+  };
+  const nextPage = () => {
+    setValue("offset", getValues("offset") + getValues("limit"));
+    handleSubmit(_onSubmit)();
+  };
+  const previousPage = () => {
+    const currentOffset = getValues("offset");
+    const limit = getValues("limit");
+    if (currentOffset - limit >= 0) {
+      setValue("offset", currentOffset - limit);
+      handleSubmit(_onSubmit)();
+    }
+  };
+  const handleClearSearch = () => {
+    reset(defaultValues);
+    _setShowToast(null);
+    handleSubmit(_onSubmit)();
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: (user === null || user === void 0 ? void 0 : user.type) === "CITIZEN" ? "citizen-wrapper" : "employee-wrapper"
+  }, /*#__PURE__*/React.createElement(CollapsibleCardPage, {
+    title: t("WT_SEARCH_FILTERS_LABEL") || "Search Filters",
+    defaultOpen: true,
+    tabs: [t("WT_SMART_SEARCH"), t("WT_ADVANCED_SEARCH")],
+    defaultTab: t("WT_SMART_SEARCH")
+  }, activeTab => {
+    var _formState$errors, _formState$errors$mob, _formState$errors2, _formState$errors2$mo;
+    return /*#__PURE__*/React.createElement("form", {
+      onSubmit: handleSubmit(_onSubmit)
+    }, activeTab === t("WT_SMART_SEARCH") && /*#__PURE__*/React.createElement("div", {
+      className: "wt-search-grid",
+      style: {
+        display: "grid",
+        gridTemplateColumns: isMobile ? "1fr" : "1fr 1fr",
+        gap: "24px"
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("WT_MOBILE_NUMBER")), /*#__PURE__*/React.createElement(MobileNumber, {
+      name: "mobileNumber",
+      inputRef: register({
+        minLength: {
+          value: 10,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        },
+        maxLength: {
+          value: 10,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        },
+        pattern: {
+          value: /[6789][0-9]{9}/,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        }
+      }),
+      type: "number",
+      maxlength: 10
+    }), /*#__PURE__*/React.createElement(CardLabelError, null, formState === null || formState === void 0 ? void 0 : (_formState$errors = formState.errors) === null || _formState$errors === void 0 ? void 0 : (_formState$errors$mob = _formState$errors["mobileNumber"]) === null || _formState$errors$mob === void 0 ? void 0 : _formState$errors$mob.message))), activeTab === t("WT_ADVANCED_SEARCH") && /*#__PURE__*/React.createElement("div", {
+      className: "formcomposer-section-grid"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("WT_BOOKING_NO")), /*#__PURE__*/React.createElement(TextInput, {
+      name: "bookingNo",
+      inputRef: register({})
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("WT_APPLICANT_NAME")), /*#__PURE__*/React.createElement(TextInput, {
+      name: "applicantName",
+      inputRef: register({})
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("WT_MOBILE_NUMBER")), /*#__PURE__*/React.createElement(MobileNumber, {
+      name: "mobileNumber",
+      inputRef: register({
+        minLength: {
+          value: 10,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        },
+        maxLength: {
+          value: 10,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        },
+        pattern: {
+          value: /[6789][0-9]{9}/,
+          message: t("CORE_COMMON_MOBILE_ERROR")
+        }
+      }),
+      type: "number",
+      maxlength: 10
+    }), /*#__PURE__*/React.createElement(CardLabelError, null, formState === null || formState === void 0 ? void 0 : (_formState$errors2 = formState.errors) === null || _formState$errors2 === void 0 ? void 0 : (_formState$errors2$mo = _formState$errors2["mobileNumber"]) === null || _formState$errors2$mo === void 0 ? void 0 : _formState$errors2$mo.message)), /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("FROM_DATE")), /*#__PURE__*/React.createElement(Controller, {
+      render: props => /*#__PURE__*/React.createElement(DatePicker, {
+        date: props.value,
+        onChange: props.onChange,
+        max: new Date().toISOString().split("T")[0]
+      }),
+      name: "fromDate",
+      control: control
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "search-field-wrapper"
+    }, /*#__PURE__*/React.createElement("label", null, t("TO_DATE")), /*#__PURE__*/React.createElement(Controller, {
+      render: props => /*#__PURE__*/React.createElement(DatePicker, {
+        date: props.value,
+        onChange: props.onChange,
+        min: fromDateValue
+      }),
+      name: "toDate",
+      control: control
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: "wt-search-actions",
+      style: {
+        display: "flex",
+        justifyContent: isMobile ? "center" : "flex-end",
+        flexDirection: isMobile ? "column-reverse" : "row",
+        gap: "24px",
+        marginTop: "16px"
+      }
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "generic-button clear-search",
+      onClick: handleClearSearch,
+      style: {
+        cursor: "pointer",
+        alignSelf: "center"
+      }
+    }, t("ES_COMMON_CLEAR_ALL")), /*#__PURE__*/React.createElement("div", {
+      style: {
+        minWidth: isMobile ? "100%" : "160px"
+      }
+    }, /*#__PURE__*/React.createElement(SubmitBar, {
+      label: t("ES_COMMON_SEARCH"),
+      submit: true
+    }))));
+  }), _isLoading && /*#__PURE__*/React.createElement(Loader, null), _data === "" ? /*#__PURE__*/React.createElement("p", {
+    style: {
+      textAlign: "center"
+    }
+  }, "No data found") : _data ? /*#__PURE__*/React.createElement(Table, {
+    t: t,
+    data: _data,
+    totalRecords: _count,
+    columns: columns,
+    getCellProps: cellInfo => ({
+      style: {
+        minWidth: cellInfo.column.Header === t("WT_INBOX_APPLICATION_NO") ? "240px" : "",
+        padding: "20px 18px",
+        fontSize: "16px"
+      }
+    }),
+    onPageSizeChange: onPageSizeChange,
+    currentPage: getValues("offset") / getValues("limit"),
+    onNextPage: nextPage,
+    onPrevPage: previousPage,
+    pageSizeLimit: getValues("limit"),
+    onSort: onSort,
+    disableSort: false,
+    sortParams: [{
+      id: getValues("sortBy"),
+      desc: getValues("sortOrder") === "DESC"
+    }]
+  }) : null));
+};
+
 const EmployeeApp = ({
   path
 }) => {
@@ -8106,6 +8354,16 @@ const EmployeeApp = ({
   }), /*#__PURE__*/React.createElement(PrivateRoute, {
     path: `${path}/vendor-assignment`,
     component: VendorAssign
+  }), /*#__PURE__*/React.createElement(PrivateRoute, {
+    path: `${path}/reports`,
+    component: props => /*#__PURE__*/React.createElement(LayoutWrapper, {
+      layoutClass: "normal"
+    }, /*#__PURE__*/React.createElement(Reports, Object.assign({
+      t: t
+    }, props, {
+      parentRoute: path,
+      moduleCode: "WT"
+    })))
   }))))));
 };
 
@@ -15450,7 +15708,8 @@ const Filter = ({
     onClick: clearAll,
     style: {
       border: "1px solid #e0e0e0",
-      padding: "6px"
+      padding: "6px",
+      minWidth: "fit-content"
     }
   }, /*#__PURE__*/React.createElement("svg", {
     width: "17",