@bjsdistribution/dms-client-return 0.0.33 → 0.0.34

package/package.json

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

package/src/components/order-daily-overview/header-filters/SelectionFilter.tsx

@@ -10,158 +10,141 @@ import {
 } from './Styledfilters';
 import { atom, useAtom } from 'jotai';
 import {
-  useActionType,
+  useActionTypeOptions,
   useClearState,
   useCustomerData,
-  useGroupedPayload,
-  useLocationData,
-  useNewReturnPayload,
   useReturnPayload,
-  useSelectAll,
-  useSelectedConfirmLoc,
-  useSelectedOrders,
 } from '../../store';
 import { filtersReducerAtom } from './filterStore';
 import {
   useSelectedAction,
   useSelectedClient,
   useSelectedLocation,
+  useIdForTableName,
+  useLoading,
   useTableName,
 } from '../store/store';
 import styled from 'styled-components';
 import { Select } from 'antd';
-import { DefaultOptionType } from 'antd/es/select';
+import { useLocationOptions } from '../../order-view/store';
 
 export const clickedState = atom<boolean>(false);
 
 function SelectionFilter() {
   const [customers] = useCustomerData();
-  const [actionType] = useActionType();
-  const [locationData] = useLocationData();
-  const [filteredLocationOptions, setFilteredLocationOptions] = useState([]);
-  const [, setUuid] = useState<any>();
   const [selectedFilterValue, setSelectedFilterValue] = useSelectedAction();
   const [, dispatch] = useAtom(filtersReducerAtom);
   const [
     selectedLocationValue,
     setSelectedLocationValue,
   ] = useSelectedLocation();
-  const [, setSelectedClient] = useSelectedClient();
-  const [, setClientLabel] = useTableName();
-  const [, setName] = useState<any>();
+  const [selectedClient, setSelectedClient] = useSelectedClient();
+  const [, setClientIdForTable] = useIdForTableName();
   const [isButtonEnabled, setIsButtonEnabled] = useState(false);
   const [, setReturnPayload] = useReturnPayload();
-  const [storedAccNumber, setStoredAccNumber] = useState<any>();
-  const [storedCustomerId, setStoredCustomerId] = useState<any>();
-  const [, setNewPayload] = useNewReturnPayload();
-  const [, setGrouped] = useGroupedPayload();
-  const [, setSelectedReturnOrder] = useSelectedOrders();
-  const [, setSelectAll] = useSelectAll();
-  const [, setCheck] = useSelectedConfirmLoc();
+  const [load] = useLoading();
+  const [, setTableName] = useTableName();
   const [clearState, setClear] = useClearState();
+  const [actionTypeOptions, setActionTypeOptions] = useActionTypeOptions();
+  const [locationOptions, setLocationOptions] = useLocationOptions();
 
-  //client options
   const clientOptions = customers?.map((option: any) => ({
     label:
       option?.customer_name?.charAt(0)?.toUpperCase() +
       option?.customer_name?.slice(1),
-    value: `${option?.id}_${option?.uuid}`,
-    id: option?.id,
-    uuid: option?.uuid,
+    value: option?.customer_id,
+    actions: option?.actions,
+    return_locations: option?.return_locations,
     account_number: option?.account_number,
-    gsit_customer_id: option?.gsit_customer_id,
   }));
 
-  const actionTypeOptions = actionType?.map((option: any) => ({
-    label: option?.type?.charAt(0)?.toUpperCase() + option?.type?.slice(1),
-    value: option?.id,
-  }));
+  //client change
+  const handleClientChange = (value: any, option: any) => {
+    // console.log(value, 'value');
+    setSelectedClient(value);
 
-  const LocationOptions = locationData?.map((option: any) => ({
-    label: option?.location_name,
-    value: option?.token,
-  }));
+    localStorage.setItem('clientName', option?.label);
+    localStorage.setItem('clientId', value?.toString());
+    localStorage.setItem('account_number', option?.account_number);
 
-  //client change
-  const handleSelectChange = (_value: unknown, option: DefaultOptionType) => {
-    setNewPayload([]);
-    const selectedLabel = option?.label as string;
-    const selectedValue = option?.id as number;
-    const selectedUuids = option?.uuid as string;
-    const selectAccountNumber = option?.account_number as string;
-    const selectedCustomerId = option?.gsit_customer_id as number;
-    setSelectedClient(selectedValue);
-    setName(selectedLabel);
-    // storedName(selectedLabel);
-    //set items in local storage
-    localStorage.setItem('clientName', selectedLabel);
-    localStorage.setItem('clientId', selectedValue?.toString());
-    localStorage.setItem('account_number', selectAccountNumber);
-    localStorage.setItem('uuid', selectedUuids);
-    localStorage.setItem('customer_id', selectedCustomerId?.toString());
-    const storedAccNo = localStorage.getItem('account_number');
-    const storedCustomerId = localStorage.getItem('customer_id');
-    const storedUuid = localStorage.getItem('uuid');
-    setUuid(storedUuid);
+    const selectedClient = clientOptions?.find(
+      (client: any) => client?.value === value
+    );
+
+    const clientActions = selectedClient?.actions || [];
+
+    const clientLocations = selectedClient?.return_locations || [];
+
+    setActionTypeOptions(
+      clientActions?.map((action: any) => ({
+        label: action,
+        value: action,
+      }))
+    );
 
+    setLocationOptions(
+      clientLocations?.map((action: any) => ({
+        label: action,
+        value: action,
+      }))
+    );
     //set payload
     setReturnPayload((prevState: any) => ({
       ...prevState,
-      account_number: storedAccNo,
-      customer_id: storedCustomerId,
+      account_number: option?.account_number,
+      customer_id: value,
     }));
-
-    //filtering locations
-    const filteredSubLocations = locationData
-      ?.filter((subCat: any) => subCat?.customer_id === storedUuid)
-      .map((subCat: any) => ({
-        label: subCat?.location_name,
-        value: subCat?.token,
-      }));
-
-    setFilteredLocationOptions(filteredSubLocations);
-
-    //clearing states
-    setUuid('');
-    setSelectedReturnOrder([]);
-    setNewPayload([]);
-    setGrouped([]);
-    setSelectAll(false);
-    setCheck([]);
   };
 
+  const storedName = localStorage.getItem('clientName');
+  const storedClientId = localStorage.getItem('clientId');
+  const storedAccountNumber = localStorage.getItem('account_number');
+
   useEffect(() => {
-    const accountNumberFromStorage = localStorage.getItem('account_number');
-    const customerIdFromStorage = localStorage.getItem('customer_id');
-    if (accountNumberFromStorage) {
-      setStoredAccNumber(accountNumberFromStorage);
-    }
-    if (customerIdFromStorage) {
-      setStoredCustomerId(customerIdFromStorage);
+    if (storedClientId !== selectedClient) {
+      localStorage.removeItem('clientDetails');
+      localStorage.removeItem('clientActions');
+      localStorage.removeItem('clientLocations');
     }
-    if (storedAccNumber && storedCustomerId) {
+  }, [storedClientId]);
+
+  useEffect(() => {
+    if (storedClientId && storedAccountNumber) {
       setReturnPayload((prevState: any) => ({
         ...prevState,
-        account_number: storedAccNumber,
-        customer_id: storedCustomerId,
+        account_number: storedAccountNumber,
+        customer_id: storedClientId,
       }));
     }
-  }, [storedAccNumber, storedCustomerId]);
-
-  const storedUuid = localStorage.getItem('uuid');
+  }, [storedClientId, storedAccountNumber]);
 
   useEffect(() => {
-    if (storedUuid && locationData) {
-      const filteredSubLocations = locationData
-        .filter((subCat: any) => subCat?.customer_id === storedUuid)
-        .map((subCat: any) => ({
-          label: subCat?.location_name,
-          value: subCat?.token,
+    const storedClientId = localStorage.getItem('clientId');
+
+    if (storedClientId && clientOptions?.length > 0) {
+      const filteredClient = clientOptions?.find(
+        (client: any) => client?.value == storedClientId
+      );
+
+      if (filteredClient) {
+        const mappedActions = filteredClient?.actions?.map((action: any) => ({
+          label: action,
+          value: action,
         }));
 
-      setFilteredLocationOptions(filteredSubLocations);
+        setActionTypeOptions(mappedActions);
+
+        const mappedLocations = filteredClient?.return_locations?.map(
+          (location: any) => ({
+            label: location,
+            value: location,
+          })
+        );
+
+        setLocationOptions(mappedLocations);
+      }
     }
-  }, [storedUuid, locationData]);
+  }, [load]);
 
   //location change
   const handleLocationChange = (value: any) => {
@@ -175,8 +158,11 @@ function SelectionFilter() {
 
   //Apply filters
   const applyFilters = () => {
+    if (selectedClient) {
+      setClientIdForTable(selectedClient);
+    }
     if (storedName) {
-      setClientLabel(storedName);
+      setTableName(storedName);
     }
     //client value
     if (storedClientId) {
@@ -218,8 +204,7 @@ function SelectionFilter() {
     }
   };
 
-  const storedName = localStorage.getItem('clientName');
-  const storedClientId = localStorage.getItem('clientId');
+  // const storedName = localStorage.getItem('clientName');
 
   useEffect(() => {
     if (storedClientId) {
@@ -231,12 +216,12 @@ function SelectionFilter() {
   }, []);
 
   useEffect(() => {
-    if (storedName || selectedFilterValue || selectedLocationValue) {
+    if (storedClientId || selectedFilterValue || selectedLocationValue) {
       setIsButtonEnabled(true);
     } else {
       setIsButtonEnabled(false);
     }
-  }, [storedName, selectedFilterValue, selectedLocationValue]);
+  }, [storedClientId, selectedFilterValue, selectedLocationValue]);
 
   useEffect(() => {}, [location.pathname]);
 
@@ -255,16 +240,14 @@ function SelectionFilter() {
 
   const handleClear = () => {
     setClear(false);
-    localStorage.removeItem('clientName');
-    localStorage.removeItem('clientId');
+    localStorage.removeItem('clientDetails');
     setClear(true);
   };
 
   useEffect(() => {
     if (clearState) {
       dispatch({ type: 'CLEAR_CLIENT' });
-      // window.location.href = '/returnclient';
-      window.location.replace('/returnclient');
+      window.location.href = '/returnclient';
     }
   }, [clearState]);
 
@@ -277,7 +260,7 @@ function SelectionFilter() {
             <StyledAntSelect
               options={clientOptions}
               placeholder="Select Client Name"
-              onChange={handleSelectChange}
+              onChange={handleClientChange}
               style={{ minWidth: '14vw' }}
               value={storedName}
               allowClear
@@ -285,38 +268,34 @@ function SelectionFilter() {
             />
           </FilterColumn>
 
-          {storedName && location.pathname.includes(`filter/`) ? (
-            <>
-              <FilterColumn>
-                <Label>Action Type</Label>
-                <StyledAntSelect
-                  options={actionTypeOptions}
-                  placeholder="Select Action Type"
-                  value={selectedFilterValue}
-                  onChange={handleActionClick}
-                  style={{ minWidth: '14vw' }}
-                  allowClear
-                />
-              </FilterColumn>
-
-              <FilterColumn>
-                <Label>Location </Label>
-                <StyledAntSelect
-                  options={
-                    filteredLocationOptions?.length > 0
-                      ? filteredLocationOptions
-                      : LocationOptions
-                  }
-                  value={selectedLocationValue}
-                  placeholder="Select Location"
-                  onChange={handleLocationChange}
-                  style={{ minWidth: '14vw' }}
-                  allowClear
-                  mode="multiple"
-                />
-              </FilterColumn>
-            </>
-          ) : null}
+          {/* {storedName && location.pathname.includes(`filter/`) ? ( */}
+          <>
+            <FilterColumn>
+              <Label>Action Type</Label>
+              <StyledAntSelect
+                options={actionTypeOptions}
+                placeholder="Select Action Type"
+                value={selectedFilterValue}
+                onChange={handleActionClick}
+                style={{ minWidth: '14vw' }}
+                allowClear
+              />
+            </FilterColumn>
+
+            <FilterColumn>
+              <Label>Location </Label>
+              <StyledAntSelect
+                options={locationOptions}
+                value={selectedLocationValue}
+                placeholder="Select Location"
+                onChange={handleLocationChange}
+                style={{ minWidth: '14vw' }}
+                allowClear
+                mode="multiple"
+              />
+            </FilterColumn>
+          </>
+          {/* ) : null} */}
         </LeftColumn>
         <RightColumn>
           <ApplyButton onClick={applyFilters} disabled={!isButtonEnabled}>

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

@@ -24,7 +24,7 @@ interface FilterState {
 }
 // let todayDate = new Date();
 const initialState: FilterState = {
-  'x-filters': [],
+  'x-filters': [{ field: 'isdeleted', op: '=', value: 0 }],
   'x-pagination': { page: 1, per_page: 50 },
 };
 
@@ -75,10 +75,10 @@ const filterReducer = (state: FilterState, action: any): FilterState => {
         ...state,
         'x-filters': [
           ...state['x-filters'].filter(
-            f => f.field !== 'product_return_action_id'
+            f => f.field !== 'order_product_return_action.type'
           ),
           {
-            field: 'product_return_action_id',
+            field: 'order_product_return_action.type',
             op: '=',
             value: action.payload,
           },
@@ -110,7 +110,7 @@ const filterReducer = (state: FilterState, action: any): FilterState => {
       return {
         ...state,
         'x-filters': state['x-filters'].filter(
-          f => f.field !== 'product_return_action_id'
+          f => f.field !== 'order_product_return_action.type'
         ),
       };
 

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

@@ -1,7 +1,10 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 import {
+  useItemsPerOverviewPage,
   //useItemsPerPage,
   useLoading,
+  UsePaginationOverviewData,
+  useTableName,
   //UsePaginationData,
 } from './store/store';
 import Filters from './filters/Filters';
@@ -9,49 +12,52 @@ import styled from 'styled-components';
 import { useStickyStatus } from '../store';
 import HeaderFilter from './header-filters/HeaderFilter';
 import { useApiHook } from '@bjsdistribution/dms-component-library';
-import { useClientData } from '../order-view/store';
+import { useAtom, useClientData } from '../order-view/store';
 import { ClientData } from './common/interface';
 import ReturnFilter from './return-order-table/return-orders-filters/ReturnFilter';
 import { Text } from './filters/FilterStyle';
 import ReturnTable from './table/ReturnTable';
+import { overviewfiltersReducerAtom } from './header-filters/overViewFilter';
+// import { notification } from 'antd';
+import Pagination from './table-view/Pagination';
 // import Pagination from './table-view/Pagination';
 // import { overviewfiltersReducerAtom } from './header-filters/overViewFilter';
 
 function ReturnMainTable() {
-  // const [state] = useAtom(overviewfiltersReducerAtom);
-  // const [paginationObj] = UsePaginationData();
-  // const [, setCurrentPage] = useState(1);
-  // const [itemsPerPage, setItemsPerPage] = useItemsPerPage();
-  // const { 'x-pagination': pagination } = state;
-  // const { page, total } = paginationObj;
+  const [state] = useAtom(overviewfiltersReducerAtom);
+  const [paginationObj] = UsePaginationOverviewData();
+  const [, setCurrentPage] = useState(1);
+  const [itemsPerPage, setItemsPerPage] = useItemsPerOverviewPage();
+  const { 'x-pagination': pagination } = state;
+  const { page, total } = paginationObj;
   // const [selectedClient] = useTableName();
-  // const [, setPaginationObject] = UsePaginationData();
   const [isScrolled] = useStickyStatus();
   const [, setLoading] = useLoading();
   const [, setClientData] = useClientData();
+  const [tableName] = useTableName();
 
-  // const handlePageChange = (page: number) => {
-  //   setCurrentPage(page);
-  // };
-  // const handleItemsPerPageChange = (itemsPerPage: number) => {
-  //   setItemsPerPage(itemsPerPage);
-  // };
+  const handlePageChange = (page: number) => {
+    setCurrentPage(page);
+  };
+  const handleItemsPerPageChange = (itemsPerPage: number) => {
+    setItemsPerPage(itemsPerPage);
+  };
 
   const {
     data: fetchedClientData,
-    loading: staticDataLoading,
+    loading: statsDataLoading,
     // paginationData,
   } = useApiHook<{
     data: ClientData[];
   }>({
-    endpoint: `/return_orders/get/client-returns/`,
+    endpoint: `/return_orders/stats/`,
     method: 'GET',
     //@ts-ignore
-    pagination: { page: 1, per_page: 200, is_pagination: false },
+    pagination: pagination,
   });
 
   useEffect(() => {
-    setLoading(staticDataLoading);
+    setLoading(statsDataLoading);
     if (fetchedClientData && fetchedClientData.data) {
       const result = fetchedClientData?.data;
       setClientData(result);
@@ -65,9 +71,7 @@ function ReturnMainTable() {
       //   });
       // }
     }
-  }, [staticDataLoading]);
-
-  const getClient = localStorage.getItem('clientName');
+  }, [statsDataLoading]);
 
   return (
     <>
@@ -78,11 +82,11 @@ function ReturnMainTable() {
           <Container>
             <Row>
               <Text>Client Return</Text>
-              {getClient ? <ReturnFilter /> : <Filters />}
+              {tableName ? <ReturnFilter /> : <Filters />}
             </Row>
             <ReturnTable />
           </Container>
-          {/* {total > 0 && (
+          {total > 0 && (
             <Pagination
               currentPage={page}
               totalItems={total}
@@ -90,7 +94,7 @@ function ReturnMainTable() {
               onPageChange={handlePageChange}
               onItemsPerPageChange={handleItemsPerPageChange}
             ></Pagination>
-          )} */}
+          )}
         </div>
       </DashBoardWrapper>
     </>

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

@@ -14,22 +14,19 @@ import { useApiHook } from '@bjsdistribution/dms-component-library';
 import { filtersReducerReturnAtom } from './table-filters/ReturnFilterStore';
 import { notification } from 'antd';
 import ReturnPagination from '../table-view/ReturnPagination';
+import { useCallApiAgain } from '../../store';
 
 const ReturnAfterTable = () => {
-  const [, setReturnOrderData] = useReturnAfterOrderData();
+  const [returnAfterOrder, setReturnOrderData] = useReturnAfterOrderData();
   const [, setLoading] = useLoading();
   const [state] = useAtom(filtersReducerReturnAtom);
+  const [callApi] = useCallApiAgain();
+
   const { 'x-filters': filters, 'x-pagination': pagination } = state;
-  const splitPath = (str: any) => {
-    const parts = str?.split('/')?.filter((part: any) => part !== ''); // Filter out empty parts
-    return parts;
-  };
-  const paths = splitPath(location.pathname);
   const [paginationObj] = UsePaginationReturnData();
   const [, setCurrentPage] = useState(1);
   const [itemsPerPage, setItemsPerPage] = useItemsPerReturnPage();
   const [, setPaginationObject] = UsePaginationData();
-  console.log(paths, 'paths');
   const { page, total } = paginationObj;
 
   const handlePageChange = (page: number) => {
@@ -41,17 +38,23 @@ const ReturnAfterTable = () => {
 
   const {
     data: fetchedReturnOrderData,
-    loading: staticDataLoading,
+    loading,
+    setShouldPerformAction,
     paginationData,
   } = useApiHook<ApiResponse>({
     endpoint: '/return_orders/?skip_filters=0',
     method: 'GET',
     filters: filters,
     pagination: pagination,
+    performAction: false,
   });
 
   useEffect(() => {
-    setLoading(staticDataLoading);
+    callApi ? setShouldPerformAction(true) : setShouldPerformAction(false);
+  }, [callApi]);
+
+  useEffect(() => {
+    setLoading(loading);
     if (fetchedReturnOrderData && fetchedReturnOrderData?.data) {
       setReturnOrderData(fetchedReturnOrderData?.data);
       if (paginationData !== null) {
@@ -64,7 +67,8 @@ const ReturnAfterTable = () => {
         });
       }
     }
-  }, [fetchedReturnOrderData, staticDataLoading]);
+  }, [fetchedReturnOrderData, loading, returnAfterOrder]);
+
   return (
     <div>
       <DashBoardWrapper>