@djb25/digit-ui-module-wt 1.0.44 → 1.0.45

package/dist/index.modern.js

@@ -1,4 +1,4 @@
-import { TickMark, ArrowDown, ViewsIcon, MobileNumber, CardLabelError, TextInput, Dropdown, DatePicker, SubmitBar, Card, Table, Loader, Modal, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, CitizenHomeCard, CHBIcon, PropertyHouse, HomeIcon, KeyNote, CardHeader, FormStep, CardLabel, RadioButtons, UploadFile, TextArea, CheckBox, CardSubHeader, StatusTable, Row, GenericFileIcon, LinkButton, EditIcon, Banner, EmployeeModuleCard, CloseSvg, Label, LinkLabel, ActionBar, DetailsCard, SearchAction, FilterAction, PopUp, ShippingTruck, CustomNameDropdown, MultiSelectDropdown, CollapsibleCardPage as CollapsibleCardPage$1, LabelFieldPair, AddIcon, Menu, CheckSvg, LayoutWrapper, Header, TelePhone, DisplayPhotos, CardSectionHeader, CheckPoint, ConnectingCheckPoints, MultiLink, Localities, RemoveableTag, FormComposer, PDFSvg, MultiUploadWrapper, Close as Close$h, BreakLine, InfoBannerIcon, ButtonSelector, LocationIcon, PTIcon, ApplicantDetails, AddressDetails } from '@djb25/digit-ui-react-components';
+import { TickMark, ArrowDown, ViewsIcon, TextInput, MobileNumber, CardLabelError, Dropdown, DatePicker, SubmitBar, Card, Table, Loader, Modal, Toast, AppContainer, ModuleHeader, ArrowLeft, PrivateRoute, CitizenHomeCard, CHBIcon, PropertyHouse, HomeIcon, KeyNote, CardHeader, FormStep, CardLabel, RadioButtons, UploadFile, TextArea, CheckBox, CardSubHeader, StatusTable, Row, GenericFileIcon, LinkButton, EditIcon, Banner, EmployeeModuleCard, CloseSvg, Label, LinkLabel, ActionBar, DetailsCard, SearchAction, FilterAction, PopUp, ShippingTruck, CustomNameDropdown, MultiSelectDropdown, CollapsibleCardPage as CollapsibleCardPage$1, LabelFieldPair, AddIcon, Menu, CheckSvg, LayoutWrapper, Header, TelePhone, DisplayPhotos, CardSectionHeader, CheckPoint, ConnectingCheckPoints, MultiLink, Localities, RemoveableTag, FormComposer, PDFSvg, MultiUploadWrapper, Close as Close$h, BreakLine, InfoBannerIcon, ButtonSelector, LocationIcon, PTIcon, ApplicantDetails, AddressDetails } from '@djb25/digit-ui-react-components';
 import React, { useRef, useEffect, useState, useCallback, useMemo, Fragment, useReducer } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useRouteMatch, useHistory, Switch, Route, Redirect, Link, useParams } from 'react-router-dom';
@@ -816,77 +816,33 @@ const WTSearchApplication = ({
   moduleCode,
   isFixedPoint
 }) => {
-  var _tripReportsData$driv;
   const isMobile = window.Digit.Utils.browser.isMobile();
   const user = Digit.UserService.getUser().info;
-  const [showWorkOrderModal, setShowWorkOrderModal] = useState(false);
-  const [selectedVendorForWorkOrder, setSelectedVendorForWorkOrder] = useState(null);
+  const [showImageModal, setShowImageModal] = useState(false);
+  const [selectedImage, setSelectedImage] = useState(null);
+  const [isImageLoading, setIsImageLoading] = useState(false);
   const handleViewDocument = useCallback(async fileStoreId => {
     if (!fileStoreId) return;
+    setIsImageLoading(true);
+    setShowImageModal(true);
     try {
       const response = await Digit.UploadServices.FileFetchbyid(fileStoreId, tenantId);
-      if (response && response.data) {
+      if ((response === null || response === void 0 ? void 0 : response.status) === 200 && response !== null && response !== void 0 && response.data) {
+        var _response$headers;
         const file = new Blob([response.data], {
-          type: response.headers["content-type"]
+          type: ((_response$headers = response.headers) === null || _response$headers === void 0 ? void 0 : _response$headers["content-type"]) || "image/jpeg"
         });
         const fileUrl = URL.createObjectURL(file);
-        window.open(fileUrl, "_blank");
+        setSelectedImage(fileUrl);
+      } else {
+        throw new Error("Failed to fetch image");
       }
     } catch (e) {
       console.error(e);
+    } finally {
+      setIsImageLoading(false);
     }
-  }, []);
-  const DriverReportColumns = useMemo(() => [{
-    Header: t("S.No"),
-    accessor: (row, index) => index + 1
-  }, {
-    Header: t("WT_BOOKING_NO"),
-    accessor: "bookingNo"
-  }, {
-    Header: t("WT_VEHICLE_NO"),
-    accessor: "vehicleRegistrationNo"
-  }, {
-    Header: t("WT_DRIVER_NAME"),
-    accessor: "driverName"
-  }, {
-    Header: t("WT_TANK_CAPACITY"),
-    accessor: "tankCapicity"
-  }, {
-    Header: t("WT_STATUS"),
-    accessor: "currentStatus"
-  }, {
-    Header: t("WT_START_PHOTO"),
-    Cell: ({
-      row
-    }) => row.original.startFileStoreId ? /*#__PURE__*/React.createElement("div", {
-      style: {
-        color: "#f47738",
-        cursor: "pointer",
-        display: "inline-block"
-      },
-      onClick: () => handleViewDocument(row.original.startFileStoreId)
-    }, /*#__PURE__*/React.createElement(ViewsIcon, null)) : t("CS_NA")
-  }, {
-    Header: t("WT_END_PHOTO"),
-    Cell: ({
-      row
-    }) => row.original.endFileStoreId ? /*#__PURE__*/React.createElement("div", {
-      style: {
-        color: "#f47738",
-        cursor: "pointer",
-        display: "inline-block"
-      },
-      onClick: () => handleViewDocument(row.original.endFileStoreId)
-    }, /*#__PURE__*/React.createElement(ViewsIcon, null)) : t("CS_NA")
-  }], [t, handleViewDocument]);
-  const openWorkOrderModal = vendorDetails => {
-    setSelectedVendorForWorkOrder(vendorDetails);
-    setShowWorkOrderModal(true);
-  };
-  const closeWorkOrderModal = () => {
-    setSelectedVendorForWorkOrder(null);
-    setShowWorkOrderModal(false);
-  };
+  }, [tenantId]);
   const defaultValues = {
     offset: 0,
     limit: 10,
@@ -924,20 +880,34 @@ const WTSearchApplication = ({
   });
   const fillingPoints = (fillingPointsData === null || fillingPointsData === void 0 ? void 0 : fillingPointsData.fillingPoints) || [];
   const {
-    data: tripReportsData,
-    isLoading: isTripReportsLoading
+    data: allReportsData,
+    isLoading: isAllReportsLoading
   } = Digit.Hooks.wt.useDriverTripReportSearch({
     tenantId,
     filters: {
-      bookingNo: selectedVendorForWorkOrder === null || selectedVendorForWorkOrder === void 0 ? void 0 : selectedVendorForWorkOrder.bookingNo
+      bookingNo: Array.isArray(data) ? data.map(d => d.bookingNo).join(",") : null
     }
   }, {
-    enabled: !!(selectedVendorForWorkOrder !== null && selectedVendorForWorkOrder !== void 0 && selectedVendorForWorkOrder.bookingNo)
+    enabled: !!data && Array.isArray(data) && data.length > 0 && moduleCode === "WT"
   });
+  const mergedData = useMemo(() => {
+    if (!data || !Array.isArray(data)) return data;
+    if (moduleCode !== "WT" || !(allReportsData !== null && allReportsData !== void 0 && allReportsData.driverTripReports)) return data;
+    return data.map(booking => {
+      const report = allReportsData.driverTripReports.find(r => r.bookingNo === booking.bookingNo);
+      return {
+        ...booking,
+        ...report
+      };
+    });
+  }, [data, allReportsData, moduleCode]);
   const GetCell = value => /*#__PURE__*/React.createElement("span", {
     className: "cell-text"
   }, value);
   const columns = useMemo(() => [{
+    Header: t("S.No"),
+    accessor: (row, index) => index + 1
+  }, {
     Header: t("WT_BOOKING_NO"),
     accessor: "bookingNo",
     disableSortBy: true,
@@ -977,20 +947,41 @@ const WTSearchApplication = ({
       row
     }) => GetCell(t(row.original["bookingStatus"]))
   }, {
-    Header: t("VIEW_REPORTS"),
-    disableSortBy: true,
+    Header: t("WT_VEHICLE_NO"),
+    accessor: "vehicleRegistrationNo"
+  }, {
+    Header: t("WT_DRIVER_NAME"),
+    accessor: "driverName"
+  }, {
+    Header: t("WT_TANK_CAPACITY"),
+    accessor: "tankCapicity"
+  }, {
+    Header: t("WT_STATUS"),
+    accessor: "currentStatus"
+  }, {
+    Header: t("WT_START_PHOTO"),
     Cell: ({
       row
-    }) => {
-      return /*#__PURE__*/React.createElement("button", {
-        className: "submit-bar",
-        style: {
-          backgroundColor: "#417505",
-          color: "white"
-        },
-        onClick: () => openWorkOrderModal(row.original)
-      }, t("VIEW_REPORTS"));
-    }
+    }) => row.original.startFileStoreId ? /*#__PURE__*/React.createElement("div", {
+      style: {
+        color: "#f47738",
+        cursor: "pointer",
+        display: "inline-block"
+      },
+      onClick: () => handleViewDocument(row.original.startFileStoreId)
+    }, /*#__PURE__*/React.createElement(ViewsIcon, null)) : t("CS_NA")
+  }, {
+    Header: t("WT_END_PHOTO"),
+    Cell: ({
+      row
+    }) => row.original.endFileStoreId ? /*#__PURE__*/React.createElement("div", {
+      style: {
+        color: "#f47738",
+        cursor: "pointer",
+        display: "inline-block"
+      },
+      onClick: () => handleViewDocument(row.original.endFileStoreId)
+    }, /*#__PURE__*/React.createElement(ViewsIcon, null)) : t("CS_NA")
   }], [t, user.type]);
   const statusOptions = moduleCode === "TP" ? [{
     i18nKey: "TP_BOOKING_CREATED",
@@ -1075,14 +1066,14 @@ const WTSearchApplication = ({
     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"
-      }
+      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_MOBILE_NUMBER")), /*#__PURE__*/React.createElement(MobileNumber, {
       name: "mobileNumber",
       inputRef: register({
@@ -1214,7 +1205,7 @@ const WTSearchApplication = ({
     }
   }, text))) : !isLoading && data !== "" ? /*#__PURE__*/React.createElement(Table, {
     t: t,
-    data: data,
+    data: mergedData,
     totalRecords: count,
     columns: columns,
     getCellProps: cellInfo => ({
@@ -1235,16 +1226,16 @@ const WTSearchApplication = ({
       id: getValues("sortBy"),
       desc: getValues("sortOrder") === "DESC"
     }]
-  }) : (data !== "" || isLoading) && /*#__PURE__*/React.createElement(Loader, null)), showWorkOrderModal && /*#__PURE__*/React.createElement(Modal, {
+  }) : (data !== "" || isLoading) && /*#__PURE__*/React.createElement(Loader, null)), showImageModal && /*#__PURE__*/React.createElement(Modal, {
     headerBarMain: /*#__PURE__*/React.createElement("h1", {
-      className: "heading-m",
-      style: {
-        margin: 0
-      }
-    }, t("VIEW_DRIVER_TRIP_REPORTS")),
+      className: "heading-m"
+    }, t("WT_VIEW_PHOTO")),
     headerBarEnd: /*#__PURE__*/React.createElement("div", {
       className: "icon-bg-secondary",
-      onClick: closeWorkOrderModal,
+      onClick: () => {
+        setShowImageModal(false);
+        setSelectedImage(null);
+      },
       style: {
         cursor: "pointer"
       }
@@ -1260,33 +1251,27 @@ const WTSearchApplication = ({
     }), /*#__PURE__*/React.createElement("path", {
       d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
     }))),
-    actionCancelLabel: t("CS_COMMON_CLOSE"),
-    actionCancelOnSubmit: closeWorkOrderModal,
     hideSubmit: true,
-    formId: "modal-action"
+    actionCancelLabel: t("CS_COMMON_CLOSE"),
+    actionCancelOnSubmit: () => {
+      setShowImageModal(false);
+      setSelectedImage(null);
+    }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      padding: "16px"
-    }
-  }, isTripReportsLoading ? /*#__PURE__*/React.createElement(Loader, null) : (tripReportsData === null || tripReportsData === void 0 ? void 0 : (_tripReportsData$driv = tripReportsData.driverTripReports) === null || _tripReportsData$driv === void 0 ? void 0 : _tripReportsData$driv.length) > 0 ? /*#__PURE__*/React.createElement(Table, {
-    t: t,
-    data: tripReportsData.driverTripReports,
-    columns: DriverReportColumns,
-    getCellProps: cellInfo => {
-      return {
-        style: {
-          minWidth: "150px",
-          padding: "8px 12px",
-          fontSize: "13.5px"
-        }
-      };
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      minHeight: "200px"
     }
-  }) : /*#__PURE__*/React.createElement("p", {
+  }, isImageLoading ? /*#__PURE__*/React.createElement(Loader, null) : selectedImage ? /*#__PURE__*/React.createElement("img", {
+    src: selectedImage,
+    alt: "View",
     style: {
-      textAlign: "center",
-      marginTop: "20px"
+      maxWidth: "100%",
+      maxHeight: "500px"
     }
-  }, t("ES_VENDOR_NO_WORKORDERS")))));
+  }) : /*#__PURE__*/React.createElement("p", null, t("CS_COMMON_NO_DATA")))));
 };
 
 const SearchApp = ({