@bjsdistribution/dms-client-return 0.1.20-dev → 0.1.21-dev

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}

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

@@ -30,6 +30,8 @@ import { useReminderData } from '../../store';
 
 export interface IProps {
   callReminderApi: any;
+  callReminderForCount: any;
+  callReminderTableApi: any;
 }
 
 const ViewReminderModal = (props: IProps) => {
@@ -70,12 +72,15 @@ const ViewReminderModal = (props: IProps) => {
   const handleDateChange = (date: any | null) => {
     if (date && date.isValid()) {
       const selectedDate = date.toISOString();
-
       setReminderPayload({
         ...reminderPayload,
         due_datetime: selectedDate,
       });
     } else {
+      setReminderPayload({
+        ...reminderPayload,
+        due_datetime: null,
+      });
     }
   };
 
@@ -177,12 +182,24 @@ const ViewReminderModal = (props: IProps) => {
     }
   };
 
+  const arraysEqual = (a: any = [], b: any = []) => {
+    if (a.length !== b.length) return false;
+    return a.every((val: any, index: any) => val === b[index]);
+  };
+
+  const isSameDate = (d1: any, d2: any) => {
+    if (!d1 || !d2) return d1 === d2; // both null/undefined
+    const date1 = new Date(d1).toISOString();
+    const date2 = new Date(d2).toISOString();
+    return date1 === date2;
+  };
+
   const hasReminderChanged = () => {
     if (!reminderDataById || !reminderPayload) return false;
 
     const original = {
       due_datetime: reminderDataById?.due_datetime,
-      assigned_to: reminderDataById?.assigned_to,
+      assigned_to: reminderDataById?.assigned_to || [],
       description: reminderDataById?.description?.trim(),
       department: reminderDataById?.department,
       status: reminderDataById?.status,
@@ -190,23 +207,23 @@ const ViewReminderModal = (props: IProps) => {
 
     const updated = {
       due_datetime: reminderPayload?.due_datetime,
-      assigned_to: reminderPayload?.assigned_to,
+      assigned_to: reminderPayload?.assigned_to || [],
       description: reminderPayload?.description?.trim(),
       department: reminderPayload?.department,
       status: reminderPayload?.status,
     };
 
     const baseChanged =
-      original?.due_datetime !== updated?.due_datetime ||
-      original?.assigned_to !== updated?.assigned_to ||
+      !isSameDate(original?.due_datetime, updated?.due_datetime) ||
+      !arraysEqual(original?.assigned_to, updated?.assigned_to) ||
       original?.description !== updated?.description ||
       original?.status !== updated?.status;
 
     const shouldCompareDept =
-      original.department !== undefined && updated?.department !== undefined;
+      original?.department !== undefined && updated?.department !== undefined;
 
     const departmentChanged = shouldCompareDept
-      ? original.department !== updated?.department
+      ? original?.department !== updated?.department
       : false;
 
     return baseChanged || departmentChanged;
@@ -290,10 +307,12 @@ const ViewReminderModal = (props: IProps) => {
                       <DatePicker
                         format="DD/MM/YYYY HH:mm A"
                         value={
-                          reminderPayload?.due_datetime
-                            ? dayjs(reminderPayload?.due_datetime)
+                          reminderPayload?.due_datetime !== undefined
+                            ? reminderPayload.due_datetime
+                              ? dayjs(reminderPayload.due_datetime)
+                              : null
                             : reminderDataById?.due_datetime
-                            ? dayjs(reminderDataById?.due_datetime)
+                            ? dayjs(reminderDataById.due_datetime)
                             : null
                         }
                         onChange={handleDateChange}
@@ -318,13 +337,13 @@ const ViewReminderModal = (props: IProps) => {
                 name="text"
                 required
                 value={
-                  reminderPayload?.description ||
-                  reminderDataById?.description ||
-                  ''
+                  reminderPayload?.description !== undefined
+                    ? reminderPayload.description
+                    : reminderDataById?.description || ''
                 }
                 disabled={disabled}
                 onChange={onChangeDetails}
-              ></DetailedContainer>
+              />
             </Right>
           </ContentsContainer>
         </OrderActionModal>

package/src/components/store.ts

@@ -132,7 +132,7 @@ function useSelectedClientAfterOrders() {
 }
 
 //start date and end date
-const startCPDate = atom<dayjs.Dayjs | null>(dayjs());
+const startCPDate = atom<dayjs.Dayjs | null>(null);
 
 function useStartDate() {
   return useAtom(startCPDate);

package/src/index.tsx

@@ -70,7 +70,7 @@ function ReturnClient() {
   }, [location.pathname, searchParams]);
 
   //API for action type
-  const { data: fetchedStaticData, loading: actionLoading } = useApiHook<
+  const { data: fetchedStaticData, loading: staticLoading } = useApiHook<
     ApiResponse
   >({
     endpoint: `/orders/getStaticData/all/`,
@@ -110,7 +110,7 @@ function ReturnClient() {
         fetchedStaticData?.data?.flatMap((i: any) => i?.assign_client)
       );
     }
-  }, [actionLoading]);
+  }, [staticLoading]);
   useEffect(() => {
     if (fetchedLocationData && fetchedLocationData?.data) {
       setLocationData(fetchedLocationData?.data);
@@ -136,7 +136,10 @@ function ReturnClient() {
             {/* for dev */}
             <Route path="" element={<OrderViewQueryHandler />} />
             <Route path="overview" element={<ReturnAfterTable />} />
-            <Route path="/:id" element={<OrderView />} />
+            <Route
+              path="/:id"
+              element={<OrderView locationloading={locationloading} />}
+            />
             {/* for local */}
             {/* <Route path="/orders/view/return/filter" element={<ReturnTable />} /> */}
             {/* for dev */}