@bjsdistribution/dms-client-return 0.0.20 → 0.0.21

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

@@ -13,7 +13,6 @@ import ClientIcon from '../../../../assets/icons/ClientIcon';
 import { DatePicker, Select } from 'antd';
 import { useAtom } from '../../../order-view/store';
 import styled from 'styled-components';
-import { filtersReducerReturnAtom } from './ReturnFilterStore';
 import dayjs from 'dayjs';
 import { useCustomerData, useStatusOrderData } from '../../../store';
 import StatusIcon from '../../../../assets/icons/StatusIcon';
@@ -23,7 +22,7 @@ import {
   StyledFilterBtnIcon,
   StyledFilterBtnLabel,
 } from '../../table/table-data/styles';
-
+import { filtersReducerReturnAtom } from './ReturnFilterStore';
 const ReturnOrderFilter = () => {
   const [, dispatch] = useAtom(filtersReducerReturnAtom);
   const [customers] = useCustomerData();
@@ -31,7 +30,7 @@ const ReturnOrderFilter = () => {
   const [statusOfOrder] = useStatusOrderData();
   const [selectedClient, setSelectedClient] = useState<any | null>();
   const [statusOrder, setStatusOfOrder] = useState<any | null>();
-
+  console.log(selectedClient, 'fffffselectedClient');
   const zoneOptions = [
     { label: 'Zone 1', value: 'zone1' },
     { label: 'Zone 2', value: 'zone2' },
@@ -39,7 +38,6 @@ const ReturnOrderFilter = () => {
     { label: 'Zone 4', value: 'zone4' },
     { label: 'Zone 5', value: 'zone5' },
   ];
-
   // date change here
   const handleDateChange = (date: any | null) => {
     setSelectedDate(date ? date?.$d : null);
@@ -52,9 +50,13 @@ const ReturnOrderFilter = () => {
         type: 'SET_DATE_FILTER',
         payload: selectedDate,
       });
+      // Reset to the first page
+      dispatch({
+        type: 'SET_PAGE',
+        payload: 1,
+      });
     }
   }, [selectedDate]);
-
   //client options
   const clientOptions = customers?.map((option: any) => ({
     label:
@@ -62,7 +64,7 @@ const ReturnOrderFilter = () => {
       option?.customer_name?.slice(1),
     value: option?.id,
   }));
-
+  console.log(clientOptions, 'clientOptions');
   //status of order
   const orderOptions = statusOfOrder?.map((option: any) => ({
     label:
@@ -70,32 +72,40 @@ const ReturnOrderFilter = () => {
       option?.status_type?.slice(1),
     value: option?.id,
   }));
-
   const handleClientChange = (value: any) => {
+    if (value === selectedClient) return;
     console.log(value, 'value');
     setSelectedClient(value);
     dispatch({
       type: 'SET_CLIENT_FILTER',
-      payload: selectedClient,
+      payload: value,
+    });
+    // Reset to the first page
+    dispatch({
+      type: 'SET_PAGE',
+      payload: 1,
     });
   };
-
   const handleStatusOfOrder = (value: any) => {
+    if (value === statusOfOrder) return;
     console.log(value, 'value');
     setStatusOfOrder(value);
     dispatch({
       type: 'SET_STATUS_ORDER_FILTER',
       payload: value,
     });
+    // Reset to the first page
+    dispatch({
+      type: 'SET_PAGE',
+      payload: 1,
+    });
   };
-
   const handleClearAll = () => {
     setSelectedDate(null);
     setSelectedClient(null);
     setStatusOfOrder(null);
     dispatch({ type: 'CLEAR_ALL_FILTER' });
   };
-
   return (
     <>
       <StyledFiter>
@@ -135,7 +145,6 @@ const ReturnOrderFilter = () => {
                   onChange={handleStatusOfOrder}
                   style={{ minWidth: '130px' }}
                   value={statusOrder}
-                  allowClear
                 />
               </StyledAntSelect>
             </div>
@@ -151,7 +160,6 @@ const ReturnOrderFilter = () => {
                   onChange={handleClientChange}
                   value={selectedClient}
                   style={{ width: '125px', border: 'none' }}
-                  allowClear
                 />
               </StyledAntSelect>
             </div>
@@ -173,7 +181,7 @@ const ReturnOrderFilter = () => {
                 />
               </StyledAntSelect>
             </div>
-            {selectedDate ? (
+            {selectedDate || statusOrder || selectedClient ? (
               <>
                 <ClearAll onClick={handleClearAll}>
                   <StyledFilterBtnIcon>
@@ -190,15 +198,12 @@ const ReturnOrderFilter = () => {
     </>
   );
 };
-
 const StyledDatePicker = styled.div`
   .custom-datepicker {
     border: none;
   }
 `;
-
 // const DropdownContainer = styled.div``;
-
 export const StyledAntSelect = styled.div`
   .custom-select {
     border: none;
@@ -211,7 +216,6 @@ export const StyledAntSelect = styled.div`
     .ant-select-selector {
     padding: 0 5px;
   }
-
   :where(.css-dev-only-do-not-override-m4timi).ant-select-outlined:not(.ant-select-customize-input)
     .ant-select-selector {
     border: none;
@@ -234,5 +238,4 @@ export const StyledAntSelect = styled.div`
     top: 16px;
   }
 `;
-
 export default ReturnOrderFilter;

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

@@ -1,9 +1,9 @@
 import React from 'react';
 
-import { StyledBulkItem } from '../../filters/BulkFilterStyle';
-import SearchType from '../../header/route-header/search/SearchType';
+// import { StyledBulkItem } from '../../filters/BulkFilterStyle';
+// import SearchType from '../../header/route-header/search/SearchType';
 import styled from 'styled-components';
-import DownloadIcon from '../../../../assets/icons/DownloadIcon';
+// import DownloadIcon from '../../../../assets/icons/DownloadIcon';
 
 const TableFilters = () => {
   return (
@@ -12,15 +12,15 @@ const TableFilters = () => {
         <Text>Create Return</Text>
       </TextConatiner> */}
 
-      <StyledBulkItem>
+      {/* <StyledBulkItem>
         <SearchType />
-      </StyledBulkItem>
-      <IconConatiner>
-        <Mid>
+      </StyledBulkItem> */}
+      {/* <IconConatiner>
+         <Mid>
           <IconText>Export</IconText>
           <DownloadIcon />
-        </Mid>
-      </IconConatiner>
+        </Mid> 
+      </IconConatiner> */}
     </Container>
   );
 
@@ -44,14 +44,14 @@ const Container = styled.div`
   gap: 16px;
   align-items: center;
 `;
-const Mid = styled.div`
-  display: flex;
-  padding: 10px 10px 10px 10px;
-  align-items: center;
-  gap: 8px;
-  align-self: stretch;
-  /* border-radius: 15px 15px 15px 15px; */
-`;
+// const Mid = styled.div`
+//   display: flex;
+//   padding: 10px 10px 10px 10px;
+//   align-items: center;
+//   gap: 8px;
+//   align-self: stretch;
+//   /* border-radius: 15px 15px 15px 15px; */
+// `;
 
 // const TextConatiner = styled.div`
 //   display: flex;
@@ -71,47 +71,47 @@ const Mid = styled.div`
 //   line-height: 20px;
 // `;
 
-const IconConatiner = styled.div`
-  /* display: flex;
-  height: 34px;
-  padding: 4px 10px;  
-  align-items: flex-start;
-  border-radius: 8px 8px 8px 8px; */
+// const IconConatiner = styled.div`
+//   /* display: flex;
+//   height: 34px;
+//   padding: 4px 10px;
+//   align-items: flex-start;
+//   border-radius: 8px 8px 8px 8px; */
 
-  ///working
-  /* box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
-  background: #f0f2f2;
-  border: 1px solid #e2e0db;
-  display: flex;
-  padding: 7px 12px;
-  justify-content: center;
-  align-items: center;
-  gap: 2px;
-  border-radius: 15px;
-  height: 34px; */
-  ///////
+//   ///working
+//   /* box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+//   background: #f0f2f2;
+//   border: 1px solid #e2e0db;
+//   display: flex;
+//   padding: 7px 12px;
+//   justify-content: center;
+//   align-items: center;
+//   gap: 2px;
+//   border-radius: 15px;
+//   height: 34px; */
+//   ///////
 
-  display: flex;
-  height: 34px;
-  padding: 1px;
-  align-items: flex-start;
-  background: #f0f2f2;
-  border: 1px solid #e2e0db;
-  border-radius: 20px 20px 20px 20px;
+//   display: flex;
+//   height: 34px;
+//   padding: 1px;
+//   align-items: flex-start;
+//   background: #f0f2f2;
+//   border: 1px solid #e2e0db;
+//   border-radius: 20px 20px 20px 20px;
 
-  /* shadow/shadow-xs */
-  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
-`;
+//   /* shadow/shadow-xs */
+//   box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+// `;
 
-const IconText = styled.div`
-  color: #3a3630;
-  text-align: center;
+// const IconText = styled.div`
+//   color: #3a3630;
+//   text-align: center;
 
-  /* body/captions */
-  font-family: 'Lato';
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 16px;
-`;
+//   /* body/captions */
+//   font-family: 'Lato';
+//   font-size: 13px;
+//   font-style: normal;
+//   font-weight: 400;
+//   line-height: 16px;
+// `;
 export default TableFilters;

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

@@ -47,7 +47,7 @@ const ReturnOrderTable = () => {
   const OpenDropDown = (index: number) => {
     setPrintToggle(prevIndex => (prevIndex === index ? null : index));
   };
-
+  console.log(newpayload, 'newpayload');
   // Close dropdown outside click
   useEffect(() => {
     document.addEventListener('mousedown', handleClickOutside);
@@ -116,28 +116,38 @@ const ReturnOrderTable = () => {
 
   const handleSelectAll = (e: any) => {
     setSelectAll(e.target.checked);
+
     if (e.target.checked) {
       setSelectedReturnOrder(
-        returnData?.map((loc: any) => ({
-          id: loc.id,
-          return_locations: loc?.return_locations,
-          return_location: loc?.return_location,
-          products: loc?.legacy_product_id,
-          order_product_return_action: loc?.order_product_return_action,
-          return_location_token: loc?.return_location,
-          new_location: loc?.new_location,
-        }))
+        returnData
+          ?.filter(
+            (loc: any) => loc?.order_product_return_action?.type === 'RTS'
+          )
+          .map((loc: any) => ({
+            id: loc.id,
+            return_locations: loc?.return_locations,
+            return_location: loc?.return_location,
+            products: loc?.legacy_product_id,
+            order_product_return_action: loc?.order_product_return_action,
+            return_location_token: loc?.return_location,
+            new_location: loc?.new_location,
+          }))
       );
+
       setNewPayload(
-        returnData?.map((loc: any) => ({
-          id: loc.id,
-          account_number: createReturn?.account_number,
-          customer_id: +createReturn?.customer_id,
-          products: [loc?.legacy_product_id],
-          return_action: [loc?.order_product_return_action?.type] || null,
-          return_location_token: loc?.return_location || null,
-          new_location: loc?.new_location,
-        }))
+        returnData
+          ?.filter(
+            (loc: any) => loc?.order_product_return_action?.type === 'RTS'
+          )
+          .map((loc: any) => ({
+            id: loc.id,
+            account_number: createReturn?.account_number,
+            customer_id: +createReturn?.customer_id,
+            products: [loc?.legacy_product_id],
+            return_action: loc?.order_product_return_action?.type,
+            return_location_token: loc?.return_location || null,
+            new_location: loc?.new_location,
+          }))
       );
     } else {
       setSelectedReturnOrder([]);
@@ -146,6 +156,9 @@ const ReturnOrderTable = () => {
     }
   };
 
+  console.log(selectedReturnOrder, 'selectedReturnOrder');
+  console.log(newpayload, 'newpayload');
+
   const handleSelectOrderReturn = (
     id: any,
     return_location: any,
@@ -252,12 +265,22 @@ const ReturnOrderTable = () => {
         <StyledTable>
           <thead>
             <tr>
-              <th className="emailInvoiceCheckbox">
+              {/* <th className="emailInvoiceCheckbox">
                 <Checkbox checked={selectAll} onChange={handleSelectAll} />
-              </th>
+              </th> */}
+              {returnData?.some(
+                (item: any) => item?.order_product_return_action?.type === 'RTS'
+              ) ? (
+                <th className="emailInvoiceCheckbox">
+                  <Checkbox checked={selectAll} onChange={handleSelectAll} />
+                </th>
+              ) : (
+                <th></th>
+              )}
               <th>Product Location</th>
               <th>Return Location</th>
               <th>Recipient</th>
+              <th>Return Action Type</th>
               <th>Code</th>
               <th>Description</th>
               <th>Part</th>
@@ -289,24 +312,33 @@ const ReturnOrderTable = () => {
               returnData?.map((item: any, index: any) => (
                 <tr key={item.id}>
                   <td>
-                    <Checkbox
-                      className="custom-check"
-                      checked={selectedReturnOrder?.some(
-                        (selectedInvoice: any) =>
-                          selectedInvoice?.id === item.id
-                      )}
-                      onChange={() =>
-                        handleSelectOrderReturn(
-                          item.id,
-                          item.return_location,
-                          item.return_locations,
-                          item.order_product_return_action,
-                          item.new_location,
-                          item.legacy_product_id
-                        )
-                      }
-                    />
+                    {item?.order_product_return_action?.type == 'RTS' ? (
+                      <>
+                        <Checkbox
+                          className="custom-check"
+                          checked={selectedReturnOrder?.some(
+                            (selectedInvoice: any) =>
+                              selectedInvoice?.id === item.id
+                          )}
+                          onChange={() =>
+                            handleSelectOrderReturn(
+                              item.id,
+                              item.return_location,
+                              item.return_locations,
+                              item.order_product_return_action,
+                              item.new_location,
+                              item.legacy_product_id
+                            )
+                          }
+                        />
+                      </>
+                    ) : null}
                   </td>
+
+                  {/* <>
+                      <Checkbox disabled onChange={() => {}} checked={false} />
+                    </> */}
+
                   <td>
                     {item?.orders_products_stock?.location !== null &&
                     item?.orders_products_stock?.location !== undefined ? (
@@ -336,6 +368,9 @@ const ReturnOrderTable = () => {
                       </li>
                     </ul>
                   </td>
+                  <td>
+                    {displayValueOrNA(item?.order_product_return_action?.type)}
+                  </td>
                   <td>{displayValueOrNA(item?.code)}</td>
                   <td>{displayValueOrNA(item?.description)}</td>
                   <td>{displayValueOrNA(item?.parts_count)}</td>

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

@@ -1,11 +1,10 @@
 import React from 'react';
-
-import { StyledBulkItem } from '../../filters/BulkFilterStyle';
-import SearchType from '../../header/route-header/search/SearchType';
 import styled from 'styled-components';
-import DownloadIcon from '../../../../assets/icons/DownloadIcon';
 import { countReducerAtom, useAtom } from '../../../order-view/store';
 import { useSelectedOrders } from '../../../store';
+// import { StyledBulkItem } from '../../filters/BulkFilterStyle';
+// import SearchType from '../../header/route-header/search/SearchType';
+// import DownloadIcon from '../../../../assets/icons/DownloadIcon';
 
 const RightFilters = () => {
   const [, dispatch] = useAtom(countReducerAtom);
@@ -19,15 +18,15 @@ const RightFilters = () => {
       >
         Create Return
       </ButtonText>
-      <StyledBulkItem>
+      {/* <StyledBulkItem>
         <SearchType />
-      </StyledBulkItem>
-      <IconConatiner>
+      </StyledBulkItem> */}
+      {/* <IconConatiner>
         <Mid>
           <IconText>Export</IconText>
           <DownloadIcon />
         </Mid>
-      </IconConatiner>
+      </IconConatiner> */}
     </Container>
   );
 };
@@ -37,14 +36,14 @@ const Container = styled.div`
   gap: 16px;
   align-items: center;
 `;
-const Mid = styled.div`
-  display: flex;
-  padding: 4px 10px;
-  align-items: center;
-  gap: 8px;
-  align-self: stretch;
-  border-radius: 15px 0px 0px 15px;
-`;
+// const Mid = styled.div`
+//   display: flex;
+//   padding: 4px 10px;
+//   align-items: center;
+//   gap: 8px;
+//   align-self: stretch;
+//   border-radius: 15px 0px 0px 15px;
+// `;
 
 const ButtonText = styled.button`
   color: white;
@@ -71,33 +70,33 @@ const ButtonText = styled.button`
   }
 `;
 
-const IconConatiner = styled.div`
-  /* display: flex;
-  height: 34px;
-  padding: 4px 10px;  
-  align-items: flex-start;
-  border-radius: 8px 8px 8px 8px; */
-  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
-  background: #f0f2f2;
-  border: 1px solid #e2e0db;
-  display: flex;
-  padding: 7px 12px;
-  justify-content: center;
-  align-items: center;
-  gap: 2px;
-  border-radius: 15px;
-  height: 34px;
-`;
+// const IconConatiner = styled.div`
+//   /* display: flex;
+//   height: 34px;
+//   padding: 4px 10px;
+//   align-items: flex-start;
+//   border-radius: 8px 8px 8px 8px; */
+//   box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
+//   background: #f0f2f2;
+//   border: 1px solid #e2e0db;
+//   display: flex;
+//   padding: 7px 12px;
+//   justify-content: center;
+//   align-items: center;
+//   gap: 2px;
+//   border-radius: 15px;
+//   height: 34px;
+// `;
 
-const IconText = styled.div`
-  color: #3a3630;
-  text-align: center;
+// const IconText = styled.div`
+//   color: #3a3630;
+//   text-align: center;
 
-  /* body/captions */
-  font-family: 'Lato';
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: 16px;
-`;
+//   /* body/captions */
+//   font-family: 'Lato';
+//   font-size: 13px;
+//   font-style: normal;
+//   font-weight: 400;
+//   line-height: 16px;
+// `;
 export default RightFilters;

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

@@ -517,6 +517,7 @@ export const StyledTableWrapper = styled.div`
   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-daily-overview/store/store.ts

@@ -46,7 +46,7 @@ export function useSelectedAction() {
   return useAtom(selectedAction);
 }
 
-const selectedLocation = atom<string | null>(null);
+const selectedLocation = atom<any[] | null>(null);
 export function useSelectedLocation() {
   return useAtom(selectedLocation);
 }

package/src/components/order-view/index.tsx

@@ -136,13 +136,13 @@ function OrderView() {
   }, [apiCalling]);
 
   useEffect(() => {
-    if (paths.length > 1) {
-      setOrderId(paths[2]);
-    }
-    // for local
-    // if (paths.length >= 0) {
-    //   setOrderId(paths[1]);
+    // if (paths.length > 1) {
+    //   setOrderId(paths[2]);
     // }
+    // for local
+    if (paths.length >= 0) {
+      setOrderId(paths[1]);
+    }
   }, [paths]);
 
   useEffect(() => {