@bjsdistribution/dms-client-return 0.0.16 → 0.0.18

package/src/components/order-view/details-filters/DetailsFilters.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import styled from 'styled-components';
 import Details from './right-side-filters/Details';
-// import ActionsMenu from './left-side-filters/ActionsMenu';
+import ActionsMenu from './left-side-filters/ActionsMenu';
 
 const DetailsFilters = () => {
   return (
     <Flex>
       <Details />
-      {/* <ActionsMenu /> */}
+      <ActionsMenu />
     </Flex>
   );
 };
@@ -28,7 +28,7 @@ const Flex = styled.div`
   margin-bottom: -71px;
   width: 97%;
   margin-left: 21px;
-  top: -40px;
+  top: -132px;
   justify-content: space-between;
 `;
 export default DetailsFilters;

package/src/components/order-view/details-filters/left-side-filters/ActionsMenu.tsx

@@ -1,13 +1,13 @@
 import React from 'react';
 import styled from 'styled-components';
 import DropDowns from './dropdowns/DropDowns';
-import Actions from './actions/Actions';
+// import Actions from './actions/Actions';
 
 const ActionsMenu = () => {
   return (
     <Flex>
       <DropDowns />
-      <Actions />
+      {/* <Actions /> */}
     </Flex>
   );
 };

package/src/components/order-view/details-filters/left-side-filters/dropdowns/DropDowns.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import styled from 'styled-components';
 import OptionsDropDown from './OptionsDropDown';
 import MenuDropDown from './MenuDropDown';
+import Print from '../../../general-information/dropdowns/Print';
 // components
 
 function DropDowns() {
@@ -10,6 +11,7 @@ function DropDowns() {
       <DashBoardWrapper>
         <MenuDropDown />
         <OptionsDropDown />
+        <Print />
       </DashBoardWrapper>
     </>
   );

package/src/components/order-view/details-filters/left-side-filters/dropdowns/PrintDropDownReturn.tsx

@@ -3,17 +3,24 @@ import styled from 'styled-components';
 import { PrintIconMap } from '../../../../order-daily-overview/shared/utlis';
 import { PrintData } from '../../../../order-daily-overview/shared/interface';
 import { optionsForReturnPrint } from '../../../../order-daily-overview/common/fakedata';
-// import { PrintIconMap } from '../utils';
-// import { optionsPrint } from '../fakeData';
-// import { PrintData } from '../interface';
 
 const options: PrintData[] = optionsForReturnPrint;
 
-const PrintDropDownReturn = () => {
-  const downloadFiles = () => {};
+const PrintDropDownReturn = ({
+  legacyProductId,
+}: {
+  legacyProductId: number;
+}) => {
+  console.log(legacyProductId, 'legacyProductId');
+
+  const downloadFiles = () => {
+    const url = `https://toolbox.bjshomedelivery.com/offload/return_label?gsit_products_id=${legacyProductId}`;
+    window.open(url, '_blank'); // Opens the URL in a new tab
+  };
+
   return (
     <OptionsList>
-      {options.map((item, index) => {
+      {options?.map((item, index) => {
         const IconComponent = PrintIconMap[item.icon];
 
         return (

package/src/components/order-view/fakedata.ts

@@ -89,16 +89,16 @@ export const OptionsMenu = [
 
 export const PrintMenu = [
   {
-    label: 'Proof Of Delivery',
-    value: 'proof-of-delivery',
+    label: 'Return Notes',
+    value: 'return-notes',
   },
   {
-    label: 'Proof Of Delivery(DOC)',
-    value: 'doc',
+    label: 'Product Labels',
+    value: 'product-labels',
   },
   {
-    label: 'Order Delivery labels',
-    value: 'order-delivery-labels',
+    label: 'Return Cover Notes',
+    value: 'return-cover-notes',
   },
 ];
 

package/src/components/order-view/general-information/Status.tsx

@@ -92,6 +92,7 @@ const Heading = styled.div`
 
 const Container = styled.div`
   padding: 15px;
+  margin-top: 25px;
 `;
 
 const TextContainer = styled.div`

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

@@ -3,12 +3,11 @@ import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 import OrderDetails from './order-details';
 import Notes from './notes';
-import Order from './order-resources/expanded-content';
-import Toolbox from './toolbox-resources/expanded-content';
+// import Order from './order-resources/expanded-content';
+// import Toolbox from './toolbox-resources/expanded-content';
 import SystemLogs from './system-event-logs/expanded-content';
 import GeneralHeader from './general-information';
 import ProductsInfo from './products-info';
-import TomTomLogs from './tomtomlogs/expanded-content';
 // import { OrderViewType } from '../types';
 // import Modals from './modals';
 import OrderActions from './order-actions';
@@ -34,12 +33,13 @@ import {
   useApiCalling,
   useLiveRecalling,
 } from './store';
-import Loader from '../order-daily-overview/header/loader/Loader';
+// import Loader from '../order-daily-overview/header/loader/Loader';
 // import { useLoading } from '../order-daily-overview/store/store';
 import { OrdersType } from './types';
 import { useLocation } from 'react-router-dom';
 import useSystemLogs from './hooks/useGetSystemLogs';
 import { notification } from 'antd';
+import DetailsFilters from './details-filters/DetailsFilters';
 
 interface ApiResponse {
   message: string;
@@ -321,8 +321,9 @@ function OrderView() {
 
   return (
     <MainContainer>
-      <Loader />
+      {/* <Loader /> */}
       <GeneralHeader />
+      <DetailsFilters />
       {/* <Notification /> */}
       <OrderDetails />
       <ProductsInfo />
@@ -331,10 +332,10 @@ function OrderView() {
           <Notes />
         </NotesContainer>
         <TablesContainer>
-          <Order />
-          <Toolbox />
+          {/* call logs */}
+          {/* <Order /> */}
+          {/* <Toolbox /> */}
           <SystemLogs />
-          <TomTomLogs />
         </TablesContainer>
       </SplitLayout>
       <OrderActions />
@@ -347,6 +348,8 @@ const MainContainer = styled.div`
   flex-direction: column;
   gap: 10px;
   padding-bottom: 30px;
+  border-radius: 25px;
+  border: 1px solid #e3e3e3;
 `;
 
 const SplitLayout = styled.div`

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

@@ -16,7 +16,6 @@ const CreateReturnModal = () => {
   const [selectedReturnOrder] = useSelectedOrders();
   const [load] = usePostLoading();
   const [groupedPayload] = useGroupedPayload();
-  // const [forDisabledCheck] = useSelectedConfirmLoc();
   const [, setNew] = useFinalPayload();
 
   const handleSelectLocations = (id: number) => {

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

@@ -49,7 +49,7 @@ const ModalManager = () => {
   const [, setNewPayload] = useNewReturnPayload();
   const [, setGrouped] = useGroupedPayload();
   const [, setSelectAll] = useSelectAll();
-  const [forCheck, setStateCheck] = useState(false);
+  // const [forCheck, setStateCheck] = useState(false);
 
   console.log(orderProduct, 'abcabcabcabcabcabcabcabcabcabcabc');
 
@@ -243,6 +243,7 @@ const ModalManager = () => {
   }, [updateResponse]);
 
   //Confirm return popup
+  // Confirm return popup
   const {
     data: response,
     setShouldPerformAction,
@@ -261,28 +262,32 @@ const ModalManager = () => {
   }, [confirmLoading]);
 
   console.log(response, 'response');
+  console.log(newGrouped, 'newGrouped');
 
   const handleConfirmReturn = () => {
     setShouldPerformAction(false);
-    setStateCheck(!forCheck);
-    if (newGrouped.length > 0) {
+
+    if (newGrouped?.length > 0) {
       setShouldPerformAction(true);
     } else {
       setShouldPerformAction(false);
     }
+
     dispatch({ type: 'close' });
   };
 
   useEffect(() => {
-    dispatch({ type: 'close' });
-    setNewGrouped([]);
-    setSelectedReturnOrder([]);
-    setCheck([]);
-    setNewPayload([]);
-    setGrouped([]);
-    setShouldPerformAction(false);
-    setSelectAll(false);
-  }, [response, forCheck]);
+    if (response && !response) {
+      dispatch({ type: 'close' });
+      setNewGrouped([]);
+      setSelectedReturnOrder([]);
+      setCheck([]);
+      setNewPayload([]);
+      setGrouped([]);
+      setShouldPerformAction(false);
+      setSelectAll(false);
+    }
+  }, [response]);
 
   return (
     <>

package/src/components/order-view/order-actions/actions/modalstyle.tsx

@@ -252,7 +252,7 @@ export const DeleteCircleIcon = styled.div`
 export const RoundedTableSkelton = styled.div`
   margin-top: -8px;
   min-height: auto;
-  max-height: 300px;
+  max-height: 60vh;
   table {
     border-collapse: separate;
     width: 100%;

package/src/components/order-view/order-details/expanded-content/footer/AllowTracking.tsx

@@ -1,40 +1,21 @@
-// import { Checkbox } from '@bjsdistribution/dms-component-library';
 import React from 'react';
 import styled from 'styled-components';
-// import { useOrderDetails } from '../../../store';
+import { useOrderDetails } from '../../../store';
 
 function AllowTracking() {
-  // const [orderDetails, setOrderDetails] = useOrderDetails();
-  // const allowTracking = orderDetails?.allow_live_tracking;
-
-  // const onChange = () => {
-  //   setOrderDetails(prev => {
-  //     return {
-  //       ...prev,
-  //       allow_live_tracking: !orderDetails.allow_live_tracking,
-  //     };
-  //   });
-  // };
+  const [orderDetails] = useOrderDetails();
+  const createdBy = orderDetails?.created_by || 'Unknown';
+  const createdAt = orderDetails?.created_at || 'Not available';
 
   return (
     <Container>
-      {/* <Wrapper>
-        <Checkbox checked={allowTracking} onChange={onChange} />
-        <Tracking>Allow Tracking?</Tracking>
-      </Wrapper> */}
       <CreatedBy>
-        <Text>Created: </Text> IT - Manpreet Kaur, 21/08/2024 13:00:51
+        <Text>Created: </Text> {createdBy}, {createdAt}
       </CreatedBy>
     </Container>
   );
 }
 
-// const Wrapper = styled.div`
-//   display: flex;
-//   gap: 10px;
-//   align-items: center;
-// `;
-
 const Text = styled.span`
   color: #3a3630;
   font-family: 'Lato', sans-serif;
@@ -53,15 +34,6 @@ const CreatedBy = styled.span`
   line-height: 16px;
 `;
 
-// const Tracking = styled.span`
-//   color: #3a3630;
-//   font-family: 'Lato', sans-serif;
-//   font-size: 13px;
-//   font-style: normal;
-//   font-weight: 400;
-//   line-height: 16px;
-// `;
-
 const Container = styled.div`
   display: flex;
   flex-direction: column;

package/src/components/order-view/store.ts

@@ -50,6 +50,8 @@ export const ordersInitialValue: OrdersType = {
   order_locked_by: null,
   delivery_instructions: null,
   drop_time: null,
+  created_by: null,
+  created_at: null,
   order_recipient: {
     id: null,
     order_id: null,

package/src/components/order-view/types.ts

@@ -159,7 +159,9 @@ export interface OrdersType {
   name: string
   order_locked_by: string | null;
   delivery_instructions: string | null;
-  drop_time: string | null
+  drop_time: string | null;
+  created_by: any | null;
+  created_at: any | null;
 }
 
 export type DeleteProds = {

package/dist/components/order-view/tomtomlogs/collapsed-content/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-declare function TomTomCollapsedContent(): React.JSX.Element;
-export default TomTomCollapsedContent;

package/dist/components/order-view/tomtomlogs/expanded-content/index.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-declare function TomTomLogs(): React.JSX.Element;
-export default TomTomLogs;

package/src/components/order-view/tomtomlogs/collapsed-content/index.tsx

@@ -1,16 +0,0 @@
-import React from 'react';
-import styled from 'styled-components';
-// import styled from 'styled-components';
-
-function TomTomCollapsedContent() {
-  return <Font>TOMTOM LOGS</Font>;
-}
-
-const Font = styled.div`
-  font-family: 'Roboto', sans-serif;
-  font-size: 16px;
-  font-style: normal;
-  font-weight: 500;
-  line-height: 24px; /* 150% */
-`;
-export default TomTomCollapsedContent;

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

@@ -1,21 +0,0 @@
-import React from 'react';
-import CollapsedContent from '../collapsed-content';
-// import styled from 'styled-components';
-import styled from 'styled-components';
-import CollapsableForm from '../../../../common/expand-collapse';
-import DynamicTable from '../../DynamicTable';
-import { TomTomColumns, tomtomResources } from '../../../fakeData';
-
-function TomTomLogs() {
-  return (
-    <Table>
-      <CollapsableForm collapsedContent={<CollapsedContent />}>
-        <DynamicTable columns={TomTomColumns} data={tomtomResources} />
-      </CollapsableForm>
-    </Table>
-  );
-}
-const Table = styled.div`
-  width: 100%;
-`;
-export default TomTomLogs;