@bjsdistribution/dms-client-return 0.1.19-dev → 0.1.19-prod

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

@@ -6,17 +6,24 @@ import {
 import {
   Checkbox,
   displayValueOrNA,
-  useApiHook,
+  useAxios,
 } from '@bjsdistribution/dms-component-library';
 import ActionIcon from '../../../../assets/icons/ActionIcon';
 import { useOrderId, useProductDetails } from '../../store';
 import { ApiResponse } from '../../types';
-import { notification } from 'antd';
+import { Empty, notification, Skeleton } from 'antd';
 import { useNewReturnOrderData, useSelectedProducts } from '../../../store';
 import styled from 'styled-components';
 import { NavLink } from 'react-router-dom';
+import { EmptyDataContainer } from '../../order-actions/actions/charge-log';
 
-const ReturnProductTable = () => {
+interface IPROS {
+  callReturnProducts: any;
+  loading: boolean;
+  locationloading: boolean;
+}
+
+const ReturnProductTable = (props: IPROS) => {
   const [selectedProducts, setSelectedProducts] = useSelectedProducts();
   const [selectAll, setSelectAll] = useState(false);
   const [productData, setProductData] = useProductDetails();
@@ -24,17 +31,16 @@ const ReturnProductTable = () => {
   const [orderId] = useOrderId();
   const [returnOrderData] = useNewReturnOrderData();
 
-  const handleActionClick = (id: number) => {
-    setSelectedRowId(id);
-  };
+  // const handleActionClick = (id: number) => {
+  //   setSelectedRowId(id);
+  // };
 
-  const { data: isresponse, setShouldPerformAction: setAction } = useApiHook<{
+  const { data: isresponse, fetchData: callDeleteProduct } = useAxios<{
     data: ApiResponse[];
   }>({
-    endpoint: `order/order_products/delete/`,
-    method: 'DELETE',
-    body: [{ id: selectedRowId, order_id: orderId }],
-    performAction: false,
+    endpoint: `v1/return/product/remove/`,
+    method: 'POST',
+    body: { return_order_product_id: selectedRowId, return_order_id: +orderId },
   });
 
   useEffect(() => {
@@ -56,9 +62,9 @@ const ReturnProductTable = () => {
     }
   };
 
-  const onDeleteProducts = () => {
-    setAction(true);
-  };
+  // const onDeleteProducts = () => {
+  //   callDeleteProduct();
+  // };
 
   const handleSelectAll = () => {
     if (selectAll) {
@@ -78,6 +84,43 @@ const ReturnProductTable = () => {
     );
   };
 
+  //delete product API
+  const deleteProduct = async (selectedProductId: any) => {
+    try {
+      const response = (await callDeleteProduct({
+        payload: {
+          return_order_product_id: selectedProductId,
+          return_order_id: +orderId,
+        },
+      })) as {
+        code: number | null;
+        error?: string | null;
+        data?: any[];
+        message?: string;
+      };
+
+      if (response?.code === 200) {
+        notification.success({
+          message: 'Success',
+          description: response?.message || 'Product deleted successfully.',
+        });
+        props?.callReturnProducts();
+      } else {
+        notification.error({
+          message: 'Deletion Failed',
+          description: response?.message || 'Could not delete the product.',
+        });
+      }
+    } catch (error) {
+      console.error('Error deleting product:', error);
+      notification.error({
+        message: 'Error',
+        //@ts-ignore
+        description: error?.message || 'An unexpected error occurred.',
+      });
+    }
+  };
+
   const disableCheckbox =
     productData?.length == 0 || returnOrderData?.length == 0;
 
@@ -104,7 +147,21 @@ const ReturnProductTable = () => {
             </tr>
           </thead>
           <tbody>
-            {productData && productData?.length > 0 ? (
+            {props?.loading || props?.locationloading ? (
+              <tr>
+                <td colSpan={14}>
+                  <Skeleton active />
+                </td>
+              </tr>
+            ) : productData?.length === 0 ? (
+              <tr>
+                <td colSpan={14}>
+                  <EmptyDataContainer>
+                    <Empty />
+                  </EmptyDataContainer>
+                </td>
+              </tr>
+            ) : (
               productData?.map((product: any) => (
                 <tr key={product.id}>
                   <td>
@@ -140,8 +197,7 @@ const ReturnProductTable = () => {
                   <td>
                     <div
                       onClick={() => {
-                        handleActionClick(product?.id);
-                        onDeleteProducts();
+                        deleteProduct(product?.id);
                       }}
                       style={{ cursor: 'pointer' }}
                     >
@@ -150,12 +206,6 @@ const ReturnProductTable = () => {
                   </td>
                 </tr>
               ))
-            ) : (
-              <tr>
-                <td colSpan={8} style={{ textAlign: 'center' }}>
-                  No records found
-                </td>
-              </tr>
             )}
           </tbody>
         </StyledTable>

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

@@ -2,6 +2,7 @@ import { atom, useAtom } from 'jotai';
 import { atomWithReducer } from 'jotai/utils';
 import {
   CancelOrderProductsType,
+  ChargesType,
   CreateProduct,
   OrderActionsType,
   OrdersType,
@@ -109,6 +110,15 @@ export const ordersInitialValue: OrdersType = {
   id: null,
   name: '',
   carrier_id: null,
+  order_type: {
+    type: null,
+  },
+  assemble: false,
+  disassemble: false,
+  unpack_items: false,
+  take_packaging_away: false,
+  collect_disposal: false,
+  assembly_type: null,
 };
 
 export const orderProductInitialvalue: CreateProduct = {
@@ -140,6 +150,42 @@ export const updateOrderProducts: UpdateOrderProduct = {
   return_reason_id: 0,
 };
 
+//force debrief
+const chargesIntialValue: ChargesType = {
+  base_charge_type: 1,
+  base_charge: 0,
+  weight: 0,
+  drop_time: 0,
+  timed_service: 0,
+  wait_time: 0,
+  extra_floor: 0,
+  bulky_items: 0,
+  re_label: 0,
+  extra_cube: 0,
+  additional_box: 0,
+  additional_item: 0,
+  weekend: 0,
+  re_allocation: 0,
+  pre_dated: 0,
+  re_package: 0,
+  disassemble: 0,
+  qc: 0,
+  collection_qc: 0,
+  return_to_client: 0,
+  roc: 0,
+  unpack: 0,
+  packaging_disposal: 0,
+  assembly: 0,
+  debrief_notes: '',
+  recycle: 0,
+  admin: 0,
+  disposal: 0,
+  disposal_recycling: 0,
+  debrief_status: '',
+  new_order_status: '',
+  adhoc_charges: [],
+};
+
 export const usedate = () => {
   return useAtom(date);
 };
@@ -243,6 +289,11 @@ export function useOrderAlertsData() {
   return useAtom(orderAlertsData);
 }
 
+const customerList = atom<any>([]);
+export function useOrderCustomersList() {
+  return useAtom(customerList);
+}
+
 export {
   useTabType,
   useInfoType,
@@ -275,7 +326,7 @@ const DepotDeatils = atom<any>(0);
 function useDepotDetails() {
   return useAtom(DepotDeatils);
 }
-const productDetails = atom<any>([]);
+const productDetails = atom<any[]>([]);
 function useProductDetails() {
   return useAtom(productDetails);
 }
@@ -558,6 +609,67 @@ export function useGlobalStateHitOrder() {
   return useAtom(globalOrderGetApi);
 }
 
+//force debrief states
+const globalEscData = atom<any>([]);
+export function useGlobalEscData() {
+  return useAtom(globalEscData);
+}
+
+const activeTab = atom<any>('success');
+
+export function useActiveTab() {
+  return useAtom(activeTab);
+}
+
+const chargesStateAtom = atom<ChargesType>(chargesIntialValue);
+
+export function useChargesState() {
+  return useAtom(chargesStateAtom);
+}
+
+const failureReasonAtom = atom<any>('');
+export function useFailureReason() {
+  return useAtom(failureReasonAtom);
+}
+
+const escalationCategoryAtom = atom<any>('');
+
+export function useEscalationCategory() {
+  return useAtom(escalationCategoryAtom);
+}
+
+const escalationLevelAtom = atom<any>('');
+
+export function useEscalationLevel() {
+  return useAtom(escalationLevelAtom);
+}
+
+const escalationReasonAtom = atom<any>('');
+
+export function useEscalationReason() {
+  return useAtom(escalationReasonAtom);
+}
+
+const newStatusAtom = atom<any>('');
+export function useNewStatus() {
+  return useAtom(newStatusAtom);
+}
+
+const orderCancelReasonAtom = atom<any>('');
+export function useOrderCancelReason() {
+  return useAtom(orderCancelReasonAtom);
+}
+
+const orderHoldReasonAtom = atom<any>('');
+export function useOrderHoldReason() {
+  return useAtom(orderHoldReasonAtom);
+}
+
+const isFailureReasonChangedAtom = atom<boolean>(false);
+export function useIsFailureReasonChanged() {
+  return useAtom(isFailureReasonChangedAtom);
+}
+
 // Popup state Manage
 const initialState = null;
 

package/src/components/order-view/system-event-logs/expanded-content/index.tsx

@@ -8,7 +8,7 @@ import { tableColumns } from '../helper';
 // import { useAxios } from '@bjsdistribution/dms-component-library';
 // import { ApiResponse } from '../../types';
 
-function SystemLogs() {
+function SystemLogs({ loading }: any) {
   const [systemLogs] = useOrderProductSystemLogs();
   // const [, setNotesData] = useEventNotesData();
 
@@ -38,7 +38,11 @@ function SystemLogs() {
   return (
     <Table>
       <CollapsableForm collapsedContent={<CollapsedContent />}>
-        <DynamicTable columns={tableColumns} data={systemLogs} />
+        <DynamicTable
+          columns={tableColumns}
+          data={systemLogs}
+          loading={loading}
+        />
       </CollapsableForm>
     </Table>
   );

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

@@ -50,7 +50,8 @@ export type OrderActionsType =
   | 'unrelease-order'
   | 'clear-date'
   | 'uncancel-order'
-  | 'remove-from-route';
+  | 'remove-from-route'
+  | 'force-debrief';
 
 export interface ChargeLogData {
   id: number;
@@ -127,6 +128,10 @@ export interface OrderRouteType {
   feedback_received?: boolean;
   is_active?: boolean;
 }
+
+export interface orderType {
+  type: string | null;
+}
 export interface OrdersType {
   depot_id: number | null;
   gsit_order_id: number | null;
@@ -168,6 +173,13 @@ export interface OrdersType {
   recipient_name: any;
   postcode: any;
   carrier_id: number | null;
+  order_type: orderType;
+  assemble: boolean;
+  disassemble: boolean;
+  unpack_items: boolean;
+  take_packaging_away: boolean;
+  collect_disposal: boolean;
+  assembly_type: string | null;
 }
 
 export type DeleteProds = {
@@ -269,3 +281,50 @@ export interface CancelOrderProductsType {
   product_type?: string;
   previous_product_type?: string;
 }
+
+//force debrief
+export interface AdhocCharge {
+  adhoc_charges_description: string;
+  adhoc_charges: number;
+  id: string; // required for state updations only
+}
+export interface ChargesType {
+  base_charge_type: number;
+  base_charge: number;
+  weight: number;
+  drop_time: number;
+  timed_service: number;
+  wait_time: number;
+  extra_floor: number;
+  bulky_items: number;
+  re_label: number;
+  extra_cube: number;
+  additional_box: number;
+  additional_item: number;
+  weekend: number;
+  re_allocation: number;
+  pre_dated: number;
+  re_package: number;
+  disassemble: number;
+  qc: number;
+  collection_qc: number;
+  return_to_client: number;
+  roc: number;
+  unpack: number;
+  packaging_disposal: number;
+  assembly: number;
+  debrief_notes: string;
+  recycle: number;
+  admin: number;
+  disposal: number;
+  disposal_recycling: number;
+  debrief_status: string;
+  new_order_status: string;
+  adhoc_charges: AdhocCharge[];
+}
+
+export interface AdhocCharge {
+  adhoc_charges_description: string;
+  adhoc_charges: number;
+  id: string; // required for state updations only
+}

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

@@ -2,7 +2,6 @@ import {
   OrderRecipientType,
   OrderRouteType,
   OrderServicesDetailType,
-  OrderServiceType,
   OrdersType,
 } from './types';
 
@@ -14,7 +13,44 @@ export const capitalize = (input: string) => {
     return char.toUpperCase();
   });
 };
+export const getBaseUrlSymbol = (): string => {
+  const storedSymbol = localStorage.getItem('baseUrlSymbol');
+  if (!storedSymbol) {
+    localStorage.setItem('baseUrlSymbol', '£');
+    return '£';
+  }
+  return storedSymbol;
+};
+export const handleKeyDownDebrief = (
+  e: React.KeyboardEvent<HTMLInputElement>
+) => {
+  // Allowed keys: numbers (0-9), '.'
+  const allowedKeys = [
+    '0',
+    '1',
+    '2',
+    '3',
+    '4',
+    '5',
+    '6',
+    '7',
+    '8',
+    '9',
+    '.',
+    'ArrowLeft',
+    'ArrowRight',
+  ];
+
+  // Allow backspace, delete and Tab keys
+  if (e.key === 'Backspace' || e.key === 'Delete' || e.key === 'Tab') {
+    return;
+  }
 
+  // Prevent input if key is not in allowedKeys
+  if (!allowedKeys.includes(e.key)) {
+    e.preventDefault();
+  }
+};
 export const RepackData = [
   {
     packaging_type: 'Recycled Cardboard',
@@ -109,6 +145,18 @@ export const getCookie = (name: string): string | null => {
 };
 
 export const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+  // Allow common shortcuts like Ctrl+V, Ctrl+C, Ctrl+A, etc.
+  if (e.ctrlKey || e.metaKey) {
+    if (
+      e.key.toLowerCase() === 'v' || // Paste
+      e.key.toLowerCase() === 'c' || // Copy
+      e.key.toLowerCase() === 'x' || // Cut
+      e.key.toLowerCase() === 'a' // Select All
+    ) {
+      return;
+    }
+  }
+
   // Allowed keys: numbers (0-9), '.', '-', '+'
   const allowedKeys = [
     '0',
@@ -240,14 +288,12 @@ export const compareOrderDetailsStates = (
     order_recipient: oldOrderRecipient,
     order_routes: oldOrderRoutes,
     order_services_detail: oldOrderServicesDetail,
-    order_services: oldOrderServices,
     ...oldRequiredData
   } = oldData;
   const {
     order_recipient: newOrderRecipient,
     order_routes: newOrderRoutes,
     order_services_detail: newOrderServicesDetail,
-    order_services: newOrderServices,
     ...newRequiredData
   } = newData;
 
@@ -270,33 +316,6 @@ export const compareOrderDetailsStates = (
     newOrderServicesDetail
   );
 
-  // need to remove id and new_id from new order_services
-  const filteredNewOrderServices = newOrderServices?.map((item: any) => {
-    if (item.new_id) {
-      const { id, new_id, ...newItem } = item;
-      return newItem;
-    } else {
-      return item;
-    }
-  });
-
-  const newOrderServicesWithoutId = filteredNewOrderServices.filter(
-    (service: OrderServiceType) => !service.id
-  );
-  const newOrderServicesWithId = filteredNewOrderServices.filter(
-    (service: OrderServiceType) => service.id
-  );
-
-  const payloadOrderServices: OrderServiceType[] = compareArrays(
-    oldOrderServices,
-    newOrderServicesWithId
-  );
-
-  const finalPayloadOrderServices = [
-    ...payloadOrderServices,
-    ...newOrderServicesWithoutId,
-  ];
-
   const finalPayload = {
     ...payloadWithId,
     ...(!isObjectEmpty(payloadOrderRecipient) && {
@@ -308,9 +327,6 @@ export const compareOrderDetailsStates = (
     ...(!isObjectEmpty(payloadOrderServicesDetail) && {
       order_services_detail: payloadOrderServicesDetail,
     }),
-    ...(finalPayloadOrderServices.length > 0 && {
-      order_services: finalPayloadOrderServices,
-    }),
   };
 
   return finalPayload;

package/src/components/order-view/view-reminder/AssigneeDropdown.tsx

@@ -13,8 +13,6 @@ function AssigneeDropdown() {
   const [reminderData] = useReminderById();
   const [reminderPayload, setReminderPayload] = useUpdateReminderData();
   const [departmentData, setDepartmentData] = useDeptData();
-  const [selectedDeptId, setSelectedDeptId] = useState<any | null>(null);
-  const [, setFilteredUsers] = useState<typeof allUsers>([]);
   const [allUsers, setAllUsers] = useState<
     {
       fName: string;
@@ -58,15 +56,7 @@ function AssigneeDropdown() {
       value: item?.value,
     })) || [];
 
-  const handleDepartmentChange = (value: string, option: { label: string }) => {
-    setSelectedDeptId(value);
-
-    setReminderPayload((prevState: any) => ({
-      ...prevState,
-      department: option?.label,
-      assigned_to: null,
-    }));
-  };
+  const [selectedDeptIds, setSelectedDeptIds] = useState<string[]>([]);
 
   // SSO Departments
   const { fetchData: getSSOData, data: fetchData } = useAxios<{
@@ -134,15 +124,22 @@ function AssigneeDropdown() {
   }, []);
 
   useEffect(() => {
-    if (selectedDeptId !== null && allUsers?.length > 0) {
-      const matchedUsers = allUsers?.filter(
-        user => user?.deptId?.toString() === selectedDeptId?.toString()
-      );
-      setFilteredUsers(matchedUsers);
-    } else {
-      setFilteredUsers([]);
+    if (
+      selectedDeptIds.length === 0 &&
+      reminderPayload?.department &&
+      departmentData?.length > 0
+    ) {
+      const deptNames = reminderPayload.department
+        .split(',')
+        .map((d: any) => d.trim());
+
+      const matched = departmentData
+        .filter((dept: any) => deptNames.includes(dept.label))
+        .map((dept: any) => dept.value);
+
+      setSelectedDeptIds(matched);
     }
-  }, [selectedDeptId, allUsers]);
+  }, [reminderPayload?.department, departmentData, selectedDeptIds]);
 
   useEffect(() => {
     if (fetchData && fetchData?.data) {
@@ -155,24 +152,86 @@ function AssigneeDropdown() {
     }
   }, [fetchData]);
 
-  const userOptions = allUsers?.map(user => ({
-    label: `${user?.fName?.trim()} ${user?.lName?.trim()}`, // shown in dropdown
-    value: user?.id, // used internally and stored
-  }));
+  const assignedUserIds = (reminderPayload?.assigned_to ?? []) as string[];
+
+  const selectedUsers = allUsers?.filter(user =>
+    assignedUserIds?.includes(user?.id)
+  );
+
+  const deptUsers = selectedDeptIds.length
+    ? allUsers?.filter(user => selectedDeptIds?.includes(user?.deptId as any))
+    : [];
+
+  const mergedUsersMap = new Map();
+
+  // Add selected users first
+  selectedUsers?.forEach(user => {
+    mergedUsersMap?.set(user.id, {
+      label: `${user?.fName} ${user?.lName}`,
+      value: user?.id,
+    });
+  });
+
+  // Add department users next
+  deptUsers?.forEach(user => {
+    if (!mergedUsersMap?.has(user?.id)) {
+      mergedUsersMap?.set(user?.id, {
+        label: `${user?.fName} ${user?.lName}`,
+        value: user?.id,
+      });
+    }
+  });
+
+  const userOptions = Array.from(mergedUsersMap.values());
+
+  const handleDepartmentChange = (
+    values: string[],
+    options: { label: string }[]
+  ) => {
+    setSelectedDeptIds(values);
+
+    const deptLabels = options?.map(opt => opt.label).join(', ');
+
+    let updatedAssignedTo = reminderPayload?.assigned_to || [];
+
+    if (reminderPayload && reminderPayload?.assigned_to?.length > 0) {
+      const matchedUsers = allUsers?.filter(
+        user => user?.deptId !== null && values?.includes(String(user?.deptId))
+      );
+
+      updatedAssignedTo = reminderPayload?.assigned_to?.filter((id: any) =>
+        matchedUsers?.some(user => user.id === id)
+      );
+    }
+
+    setReminderPayload((prev: any) => ({
+      ...prev,
+      department: deptLabels,
+      assigned_to: updatedAssignedTo,
+    }));
+  };
 
   return (
     <FormContainer>
       <Label label="Department" required />
       <StyledAntSelect
         disabled={disabled}
+        mode="multiple"
         options={deptData}
         placeholder="Select Department"
         onChange={handleDepartmentChange}
+        // {(values: string[], options: { label: string }[]) => {
+        // setSelectedDeptIds(values);
+        // setReminderPayload((prev: any) => ({
+        // ...prev,
+        // department: options?.map(o => o?.label).join(', '),
+        // assigned_to: reminderPayload?.assigned_to,
+        // }));
+        // }}
         style={{ width: '8vw' }}
-        value={reminderPayload?.department || undefined}
-        showSearch
-        dis
+        value={selectedDeptIds}
       />
+
       <Label label="Assigned To" required htmlFor="assigneDropdown" />
       <StyledAntSelect
         disabled={disabled}