@bjsdistribution/dms-client-return 0.0.23 → 0.0.25

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.23",
+  "version": "0.0.25",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/common/services-slider/ServiceSlider.tsx

@@ -8,25 +8,26 @@ interface SliderProps {
   serviceId: number;
   isSelected: boolean;
   toggle: (id: number) => void;
+  disabled: boolean;
 }
 
 function ServiceSlider(props: SliderProps) {
+  // const onClick = (event: React.MouseEvent<HTMLDivElement>) => {
+  //   event.preventDefault();
+  //   props.toggle(props.serviceId);
+  // };
 
-  const onClick = (event: React.MouseEvent<HTMLDivElement>) => {
-    event.preventDefault();
-    props.toggle(props.serviceId);
-  };
-  
   return (
-    <Container onClick={() => props.toggle(props.serviceId)}>
+    <Container>
       <ServiceIcon src={getIcon(props.serviceId)} />
       <ServiceName>{props.serviceName}</ServiceName>
       {/* to stop event propagation */}
-      <div onClick={onClick}>
+      <div className="hidden">
         <Switch
           checked={props.isSelected}
           name={props.serviceName}
           onChange={() => {}}
+          disabled={props?.disabled}
         />
       </div>
     </Container>
@@ -51,7 +52,7 @@ const Container = styled.div`
   display: flex;
   gap: 10px;
   align-items: center;
-  cursor: pointer;
+  cursor: not-allowed;
   flex: 1;
 `;
 

package/src/components/order-daily-overview/header-filters/filterStore.ts

@@ -98,13 +98,13 @@ const filterReducer = (state: FilterState, action: any): FilterState => {
         ],
       };
 
-    case 'CLEAR_CLIENT':
-      return {
-        ...state,
-        'x-filters': state['x-filters'].filter(
-          f => f.field !== 'order.customer_id'
-        ),
-      };
+    // case 'CLEAR_CLIENT':
+    //   return {
+    //     ...state,
+    //     'x-filters': state['x-filters'].filter(
+    //       f => f.field !== 'order.customer_id'
+    //     ),
+    //   };
 
     case 'CLEAR_ACTION':
       return {

package/src/components/order-daily-overview/index.tsx

@@ -46,7 +46,8 @@ function ReturnMainTable() {
   }>({
     endpoint: `/return_orders/get/client-returns/`,
     method: 'GET',
-    pagination: { page: 1, per_page: 200 },
+    //@ts-ignore
+    pagination: { page: 1, per_page: 200, is_pagination: false },
   });
 
   useEffect(() => {

package/src/components/order-daily-overview/return-after-table/table/OrderTable.tsx

@@ -90,16 +90,22 @@ const OrderTable = ({ loadingskeleton }: any) => {
     },
   ];
 
-  const getStatusClass = (status: any) => {
+  const getStatusClass = (status: string) => {
     switch (status) {
       case 'Cancelled':
         return { color: '#E95252', background: 'rgba(233, 82, 82, 0.15)' };
-      case 'Pending':
+      case 'On Hold':
         return { color: '#F4A503', background: '#FFF1D6' };
-      case 'Awaiting':
+      case 'Sub-Contracted':
+        return { color: '#F4A503', background: '#FFF1D6' };
+      case 'Awaiting route':
         return { color: '#845ADF', background: 'rgba(132, 90, 223, 0.15)' };
       case 'Completed':
         return { color: '#1F9254', background: 'rgba(41, 204, 106, 0.15)' };
+      case 'Outstanding':
+        return { color: '#FF9900', background: 'rgba(255, 153, 0, 0.15)' };
+      case 'Routed':
+        return { color: '#6396E5', background: 'rgba(99, 150, 229, 0.15)' };
       default:
         return { color: '#000', background: '#fff' };
     }
@@ -109,7 +115,7 @@ const OrderTable = ({ loadingskeleton }: any) => {
   // console.log(id, 'idid');
   return (
     <>
-      <StyledTableWrapper>
+      <StyledTableWrapper className="fortables">
         <StyledTable>
           <thead>
             <tr>
@@ -150,14 +156,16 @@ const OrderTable = ({ loadingskeleton }: any) => {
             ) : (
               returnAfterOrder?.map((item: any, index: any) => {
                 const statusMapping: any = {
-                  CO: 'Cancelled',
+                  cancelled: 'Cancelled',
                   OO: 'On Hold',
                   SC: 'Sub-Contracted',
-                  AR: 'Awaiting Route',
-                  SD: 'Completed',
-                  AD: 'Outstanding',
+                  'awaiting route': 'Awaiting route',
+                  completed: 'completed',
+                  outstanding: 'Outstanding',
+                  routed: 'Routed',
                 };
-                const status = statusMapping[item?.status] || 'Unknown';
+
+                const status = statusMapping[item?.status_value] || 'Unknown';
                 const statusClass = getStatusClass(status);
                 return (
                   <tr key={item.id}>
@@ -223,9 +231,15 @@ const OrderTable = ({ loadingskeleton }: any) => {
                     <td>
                       <ul
                         className="statuscontainer"
-                        style={{ listStyleType: 'none' }}
+                        style={{
+                          listStyleType: 'none',
+                          background: statusClass.background,
+                        }}
                       >
-                        <li className={`statustext ${statusClass}`}>
+                        <li
+                          className="statustext"
+                          style={{ color: statusClass.color }}
+                        >
                           {status}
                         </li>
                       </ul>

package/src/components/order-daily-overview/return-order-table/return-orders-filters/ReturnOrderTable.tsx

@@ -7,6 +7,7 @@ import {
   useGroupedPayload,
   useLocationData,
   useNewReturnPayload,
+  usePostLoading,
   useReturnPayload,
   useSelectAll,
   useSelectedOrders,
@@ -26,6 +27,7 @@ import { filtersReducerAtom } from '../../header-filters/filterStore';
 import { displayValueOrNA } from '../../shared/utlis';
 import PrintDropDownReturn from '../../../order-view/details-filters/left-side-filters/dropdowns/PrintDropDownReturn';
 import { format } from 'date-fns';
+import Loader from '../../header/loader/Loader';
 const ReturnOrderTable = () => {
   const [state] = useAtom(filtersReducerAtom);
 
@@ -34,6 +36,7 @@ const ReturnOrderTable = () => {
   const { 'x-filters': filters, 'x-pagination': pagination } = state;
   const [returnData, setReturnData] = useReturnData();
   const [load, setLoading] = useLoading();
+  const [postLoading] = usePostLoading();
   const dropdownRefParent = useRef<HTMLDivElement>(null);
   const dropdownRef = useRef<HTMLDivElement>(null);
   const [printToogle, setPrintToggle] = usePrintOptionTOggle();
@@ -256,7 +259,8 @@ const ReturnOrderTable = () => {
 
   return (
     <>
-      <StyledTableWrapper>
+      {postLoading && <Loader />}
+      <StyledTableWrapper className="fortables">
         <StyledTable>
           <thead>
             <tr>

package/src/components/order-daily-overview/return-order-table/return-orders-filters/returnstyles.ts

@@ -517,7 +517,13 @@ export const StyledTableWrapper = styled.div`
   overflow-x: auto;
   max-height: 60vh;
   scrollbar-width: none;
-  min-height: 60vh;
+
+  .fortables {
+    overflow-x: auto;
+    max-height: 60vh;
+    scrollbar-width: none;
+    min-height: 60vh;
+  }
   /* height: 600px; */
   /* box-shadow: 0px 0px 30px 6px rgba(46, 45, 116, 0.05); */
   &::-webkit-scrollbar {

package/src/components/order-view/modalsPopup/CreateReturnModal.tsx

@@ -4,17 +4,14 @@ import styled from 'styled-components';
 import {
   useFinalPayload,
   useGroupedPayload,
-  usePostLoading,
   useSelectedConfirmLoc,
   useSelectedOrders,
 } from '../../store';
 import { displayValueOrNA } from '../../order-daily-overview/shared/utlis';
-import Loader from '../../order-daily-overview/header/loader/Loader';
 
 const CreateReturnModal = () => {
   const [selectedlocation, setSelectedLocations] = useSelectedConfirmLoc();
   const [selectedReturnOrder] = useSelectedOrders();
-  const [load] = usePostLoading();
   const [groupedPayload] = useGroupedPayload();
   const [, setNew] = useFinalPayload();
 
@@ -55,7 +52,6 @@ const CreateReturnModal = () => {
 
   return (
     <>
-      {load && <Loader />}
       <Wrapper>
         <Alert
           onClose={() => {}}

package/src/components/order-view/modalsPopup/ModalManager.tsx

@@ -47,7 +47,7 @@ const ModalManager = () => {
   const [selectedTab] = useAtom(selectedTabKeyAtom);
   const [, setIsFormValid] = useState(false);
   const [newGrouped] = useFinalPayload();
-  const [, SetPostLoading] = usePostLoading();
+  const [postLoading, SetPostLoading] = usePostLoading();
   const [, setSelectedReturnOrder] = useSelectedOrders();
   const [forDisabledCheck, setCheck] = useSelectedConfirmLoc();
   const [, setNewPayload] = useNewReturnPayload();
@@ -155,6 +155,7 @@ const ModalManager = () => {
     if (newGrouped?.length > 0) {
       setShouldPerformAction(true);
       setCallForFetch(true);
+      SetPostLoading(confirmLoading);
     }
     dispatch({ type: 'close' });
   };
@@ -218,40 +219,39 @@ const ModalManager = () => {
       setShouldPerformAction(false);
       setSelectAll(false);
       setError(null);
-      navigate('/order-return');
+      navigate('returnclient/order-return');
     }
-  }, [response, apiError]);
-
-  console.log(apiError, 'apiError apiError');
-  console.log(response, 'response response ');
+  }, [response, apiError, postLoading]);
 
   return (
     <>
-      {popupName?.state == 'create-return' && (
-        <AntModal
-          openStatus={popupName?.state == 'create-return' ? true : false}
-          closeModal={() => closeModal()}
-          PopupHeader={{
-            heading: 'CONFIRM RETURN',
-            subHeading: '',
-          }}
-          PopupFooter={{
-            btns: [
-              {
-                name: 'Submit',
-                btnStyle: 'rounded',
-                onClick: handleConfirmReturn,
-                type: 'button',
-                disabled: forDisabledCheck.length === 0,
-              },
-            ],
+      {popupName?.state === 'create-return' && (
+        <>
+          <AntModal
+            openStatus={popupName?.state == 'create-return' ? true : false}
+            closeModal={() => closeModal()}
+            PopupHeader={{
+              heading: 'CONFIRM RETURN',
+              subHeading: '',
+            }}
+            PopupFooter={{
+              btns: [
+                {
+                  name: 'Submit',
+                  btnStyle: 'rounded',
+                  onClick: handleConfirmReturn,
+                  type: 'button',
+                  disabled: forDisabledCheck.length === 0,
+                },
+              ],
 
-            btnAlign: 'justifyEnd',
-          }}
-          BodyComponent={CreateReturnModal}
-          width={800}
-          classNameAdd={'globalPopup'}
-        />
+              btnAlign: 'justifyEnd',
+            }}
+            BodyComponent={CreateReturnModal}
+            width={800}
+            classNameAdd={'globalPopup'}
+          />
+        </>
       )}
       {popupName?.state === 'qclog' && (
         <AntModal

package/src/components/order-view/order-details/expanded-content/services-section/AssemblyType.tsx

@@ -123,7 +123,7 @@ function AssemblyType() {
         onChange={radioGroupHandler}
         required={false}
         //@ts-ignore
-        isDisabled={isServiceDisable()}
+        isDisabled={true}
       />
     </Container>
   );

package/src/components/order-view/order-details/expanded-content/services-section/DeliveryPoint.tsx

@@ -38,6 +38,7 @@ function DeliveryPointDropdown() {
         )}
         openMenuOnFocus
         onChange={onChange}
+        isDisabled={true}
       />
     </Container>
   );

package/src/components/order-view/order-details/expanded-content/services-section/OrderServices.tsx

@@ -208,6 +208,7 @@ function OrderServices() {
             isSelected={selected}
             toggle={toggleServices}
             key={service?.id}
+            disabled={true}
           />
         );
       })}

package/src/components/order-view/order-details/expanded-content/services-section/ServiceLevel.tsx

@@ -34,6 +34,7 @@ function ServiceLevel() {
         options={serviceLevelOptions || []}
         onChange={radioGroupHandler}
         required={true}
+        isDisabled={true}
       />
     </Container>
   );

package/src/components/order-view/order-details/expanded-content/services-section/ServiceType.tsx

@@ -32,6 +32,7 @@ function ServiceTypeDropdown() {
         inputId="serviceTypeDropdown"
         openMenuOnFocus
         onChange={onChange}
+        isDisabled={true}
       />
     </Container>
   );

package/src/components/order-view/order-details/expanded-content/services-section/TimedService.tsx

@@ -51,6 +51,7 @@ function TimedServiceDropdown() {
         )}
         inputId="timedServiceDropdown"
         onChange={onChange}
+        isDisabled={true}
       />
     </Container>
   );

package/src/components/order-view/products-info/expanded-content/index.tsx

@@ -1,28 +1,31 @@
 import React from 'react';
 import styled from 'styled-components';
 import ProductTable from '../../return-client-products/ProductTable';
-// import OrderDetailsFooter from '../../order-details/expanded-content/footer';
-// import NewReturnDropdown from '../../notes/order-dropdown/NewReturnDropdown';
+import NewReturnDropdown from '../../notes/order-dropdown/NewReturnDropdown';
 import { Button } from '@bjsdistribution/dms-component-library';
-import { notification } from 'antd';
+// import { notification } from 'antd';
 
 function ExpandedContent() {
-  const SaveNote = () => {
-    // alert('saved');
-    notification.success({
-      message: 'Success',
-      description: ' Saved successfully.',
-    });
-  };
+  // const SaveNote = () => {
+  //   // alert('saved');
+  //   notification.success({
+  //     message: 'Success',
+  //     description: ' Saved successfully.',
+  //   });
+  // };
   return (
     <Container>
       <ProductTable />
       <MidConatiner>
         <SaveNoteContainer>
-          <Button style={{ borderRadius: '20px' }} onClick={SaveNote}>
-            SAVE Details
+          <Button
+            style={{ borderRadius: '20px' }}
+            onClick={() => {}}
+            disabled={true}
+          >
+            Move Products
           </Button>
-          {/* <NewReturnDropdown /> */}
+          <NewReturnDropdown />
         </SaveNoteContainer>
       </MidConatiner>
     </Container>

package/src/components/order-view/return-client-products/product-table/ReturnProductTable.tsx

@@ -76,7 +76,12 @@ const ReturnProductTable = () => {
           <thead>
             <tr>
               <th className="emailInvoiceCheckbox">
-                <Checkbox checked={selectAll} onChange={handleSelectAll} />
+                <Checkbox
+                  checked={selectAll}
+                  onChange={handleSelectAll}
+                  disabled={true}
+                  style={{ cursor: 'not-allowed' }}
+                />
               </th>
               <th>Location</th>
               <th>Sender</th>
@@ -96,6 +101,7 @@ const ReturnProductTable = () => {
                       checked={selectedInvoices.some(
                         selectedInvoice => selectedInvoice.id === invoice.id
                       )}
+                      style={{ cursor: 'not-allowed' }}
                     />
                   </td>
                   <td>{'N/A'}</td>

package/src/index.tsx

@@ -35,28 +35,18 @@ function ReturnClient() {
   const [, setActionType] = useActionType();
   const [, setLocationData] = useLocationData();
   const [, setStatusOfOrders] = useStatusOrderData();
-  // const [, dispatch] = useAtom(filtersReducerAtom);
-
-  console.log(selectedClientString, 'selectedClient');
-  console.log(`../filter/:${selectedClientString}`);
 
   const splitPath = (str: any) => {
     const parts = str?.split('/')?.filter((part: any) => part !== ''); // Filter out empty parts
     return parts;
   };
   const paths = splitPath(location.pathname);
-  console.log(paths, 'pathssssssssssssssssssssssssssss');
 
   useEffect(() => {
-    console.log(
-      paths[paths.length - 1],
-      'paths[paths.length] paths[paths.length]'
-    );
     if (paths[paths.length - 1] === 'returnclient') {
       localStorage.removeItem('clientName');
       localStorage.removeItem('clientId');
       localStorage.removeItem('uuid');
-      // dispatch({ type: 'CLEAR_CLIENT', payload: [] });
     }
   }, [location.pathname]);