Merge pull request 'Adding Activity-Group in Create Task popup.' (#431) from Kartik_Task_InfraMask#1266 into Organization_Management

Reviewed-on: #431
merged

src/components/Project/Infrastructure/EditActivityModal.jsx

@@ -32,9 +32,8 @@ const EditActivityModal = ({
   building,
   floor,
   onClose,
-} ) =>
-{
-  
+}) => {
+
   const { activities, loading: loadingActivities } = useActivitiesMaster();
   const { categories, loading: loadingCategories } = useWorkCategoriesMaster();
   const [selectedActivity, setSelectedActivity] = useState(null);
@@ -57,13 +56,12 @@ const EditActivityModal = ({
       comment: "",
     },
   });
-const { mutate: UpdateTask, isPending } = useManageTask({
-  onSuccessCallback: (response) =>
-  {
-    showToast( response?.message, "success" )
-    onClose()
-  }
-} );
+  const { mutate: UpdateTask, isPending } = useManageTask({
+    onSuccessCallback: (response) => {
+      showToast(response?.message, "success")
+      onClose()
+    }
+  });
 
 
 
@@ -82,34 +80,33 @@ const { mutate: UpdateTask, isPending } = useManageTask({
     [categories]
   );
 
-useEffect(() => {
-  if (!workItem) return;
- console.log(workItem)
-  reset({
-    activityID: String(
-      workItem?.workItem?.activityId || workItem?.activityMaster?.id
-    ),
-    workCategoryId: String(
-      workItem?.workItem?.workCategoryId || workItem?.workCategoryMaster?.id
-    ),
-    plannedWork:
-      workItem?.workItem?.plannedWork || workItem?.plannedWork || 0,
-    completedWork:
-      workItem?.workItem?.completedWork || workItem?.completedWork || 0,
-    comment: workItem?.workItem?.description || workItem?.description || "",
-  });
-}, [workItem?.id,selectedActivity]);
+  useEffect(() => {
+    if (!workItem) return;
+    console.log(workItem)
+    reset({
+      activityID: String(
+        workItem?.workItem?.activityId || workItem?.activityMaster?.id
+      ),
+      workCategoryId: String(
+        workItem?.workItem?.workCategoryId || workItem?.workCategoryMaster?.id
+      ),
+      plannedWork:
+        workItem?.workItem?.plannedWork || workItem?.plannedWork || 0,
+      completedWork:
+        workItem?.workItem?.completedWork || workItem?.completedWork || 0,
+      comment: workItem?.workItem?.description || workItem?.description || "",
+    });
+  }, [workItem?.id, selectedActivity]);
 
 
 
   useEffect(() => {
     const selected = activities?.find((a) => a.id === activityID);
-    setSelectedActivity( selected || null );
+    setSelectedActivity(selected || null);
   }, [activityID, activities]);
 
-  const onSubmitForm = (data) =>
-  {
-      const payload = {
+  const onSubmitForm = (data) => {
+    const payload = {
       ...data,
       id: workItem?.workItem?.id ?? workItem?.id,
       buildingID: building?.id,
@@ -125,9 +122,9 @@ useEffect(() => {
       buildingId: building?.id,
       floorId: floor?.id,
       workAreaId: workArea?.id,
-      previousCompletedWork:completedTask
+      previousCompletedWork: completedTask
     });
- }
+  }
   return (
     <form className="row g-2 p-2 p-md-1" onSubmit={handleSubmit(onSubmitForm)}>
       <div className="text-center mb-1">
@@ -162,14 +159,26 @@ useEffect(() => {
           disabled
         />
       </div>
+      <div className="col-12 text-start">
+        <label className="form-label">Select Service</label>
+        <input
+          className="form-control form-control-sm"
+          value={
+            workItem?.activityMaster?.activityGroupMaster?.service?.name || ""
+          }
+          disabled
+        />
+      </div>
+
 
       <div className="col-12 text-start">
         <label className="form-label">Select Activity</label>
         <select
           {...register("activityID")}
           className="form-select form-select-sm"
+          disabled
         >
-          <option disabled>Select Activity</option>
+          <option >Select Activity</option>
           {loadingActivities ? (
             <option>Loading...</option>
           ) : (
@@ -264,7 +273,7 @@ useEffect(() => {
           disabled={isPending}
         >
           {isPending ? "Please Wait..." : "Edit Task"}
-        </button>        
+        </button>
       </div>
     </form>
   );

src/components/Project/Infrastructure/TaskModel.jsx

@@ -3,10 +3,12 @@ import { useForm } from "react-hook-form";
 import { z } from "zod";
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
+  useActivitiesByGroups,
   useActivitiesMaster,
+  useGroups,
   useWorkCategoriesMaster,
 } from "../../../hooks/masterHook/useMaster";
-import { useManageTask, useProjectAssignedServices } from "../../../hooks/useProjects";
+import { useManageTask, useProjectAssignedOrganizations, useProjectAssignedServices } from "../../../hooks/useProjects";
 import showToast from "../../../services/toastService";
 import Label from "../../common/Label";
 import { useSelectedProject } from "../../../slices/apiDataManager";
@@ -15,6 +17,8 @@ const taskSchema = z.object({
   buildingID: z.string().min(1, "Building is required"),
   floorId: z.string().min(1, "Floor is required"),
   workAreaId: z.string().min(1, "Work Area is required"),
+  serviceId: z.string().min(1, "Service is required"),
+  activityGroupId: z.string().min(1, "Activity Group is required"),
   activityID: z.string().min(1, "Activity is required"),
   workCategoryId: z.string().min(1, "Work Category is required"),
   plannedWork: z.number().min(1, "Planned Work must be greater than 0"),
@@ -27,6 +31,8 @@ const defaultModel = {
   buildingID: "",
   floorId: "",
   workAreaId: "",
+  serviceId: "",
+  activityGroupId: "",
   activityID: "",
   workCategoryId: "",
   plannedWork: 0,
@@ -35,18 +41,42 @@ const defaultModel = {
 };
 
 const TaskModel = ({ project, onSubmit, onClose }) => {
-  const { activities, loading: activityLoading } = useActivitiesMaster();
+  // const { activities, loading: activityLoading } = useActivitiesMaster();
   const { categories, categoryLoading } = useWorkCategoriesMaster();
 
   const projectId = useSelectedProject();
 
   const { data: assignedServices, isLoading: servicesLoading } = useProjectAssignedServices(projectId);
+  const { data: assignedOrganizations, isLoading: orgLoading } = useProjectAssignedOrganizations(projectId);
+
+
 
   const [selectedService, setSelectedService] = useState("");
+  const [selectedGroup, setSelectedGroup] = useState("");
+  const { data: groupsResponse, isLoading: groupsLoading } = useGroups(selectedService);
+  const groups = groupsResponse?.data ?? [];
 
+  const { data: activitiesResponse, isLoading: activitiesLoading } = useActivitiesByGroups(selectedGroup);
+  const activities = activitiesResponse?.data ?? [];
+  // Fetch Assigned Organizations (Activity Groups)
+
+  const [selectedOrg, setSelectedOrg] = useState("");
   const handleServiceChange = (e) => {
-    setSelectedService(e.target.value);
+    const value = e.target.value;
+    setSelectedService(value);
+    setSelectedGroup("");
+    setValue("activityGroupId", "");
+    setValue("activityID", "");
   };
+
+  const handleGroupChange = (e) => {
+    const value = e.target.value;
+    setSelectedGroup(value);
+    setValue("activityGroupId", value);
+    setValue("activityID", "");
+  };
+
+
   const {
     register,
     handleSubmit,
@@ -188,15 +218,18 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
       {/* Services Selection */}
       {selectedWorkArea && (
         <div className="col-12 text-start">
-          <Label className="form-label">Select Services</Label>
+          <Label className="form-label" required>Select Service</Label>
           <select
-            name="DataTables_Table_0_length"
-            aria-controls="DataTables_Table_0"
             className="form-select form-select-sm"
-            aria-label="Select Service"
+            {...register("serviceId")}
             value={selectedService}
-            onChange={handleServiceChange}
+            // onChange={handleServiceChange}
+            onChange={(e) => {
+              handleServiceChange(e);
+              setValue("serviceId", e.target.value);
+            }}
           >
+            <option value="">Select Service</option>
             {servicesLoading && <option>Loading...</option>}
             {assignedServices?.map((service) => (
               <option key={service.id} value={service.id}>
@@ -204,34 +237,45 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
               </option>
             ))}
           </select>
-          {errors.buildingID && (
-            <p className="danger-text">{errors.buildingID.message}</p>
-          )}
         </div>
       )}
 
-      {/* Activity Selection */}
-      {selectedWorkArea && (
+      {/* Activity Group (Organization) Selection */}
+      {selectedService && (
         <div className="col-12 text-start">
-          <Label className="form-label" required>Select Activity</Label>
+          <Label className="form-label" required>Select Activity Group</Label>
           <select
             className="form-select form-select-sm"
-            {...register("activityID")}
+            {...register("activityGroupId")}
+            value={selectedGroup}
+            onChange={handleGroupChange}
           >
-            <option value="">Select Activity</option>
-            {activityData.map((a) => (
-              <option key={a.id} value={a.id}>
-                {a.activityName}
-              </option>
+            <option value="">Select Group</option>
+            {groupsLoading && <option>Loading...</option>}
+            {groups?.map((g) => (
+              <option key={g.id} value={g.id}>{g.name}</option>
             ))}
           </select>
-          {errors.activityID && (
-            <p className="danger-text">{errors.activityID.message}</p>
-          )}
+          {errors.activityGroupId && <p className="danger-text">{errors.activityGroupId.message}</p>}
         </div>
       )}
 
 
+      {/* Activity Selection */}
+      {selectedGroup && (
+        <div className="col-12 text-start">
+          <Label className="form-label" required>Select Activity</Label>
+          <select className="form-select form-select-sm" {...register("activityID")}>
+            <option value="">Select Activity</option>
+            {activitiesLoading && <option>Loading...</option>}
+            {activities?.map((a) => (
+              <option key={a.id} value={a.id}>{a.activityName}</option>
+            ))}
+          </select>
+          {errors.activityID && <p className="danger-text">{errors.activityID.message}</p>}
+        </div>
+      )}
+
       {selectedWorkArea && (
         <div className="col-12 text-start">
           <label className="form-label">Select Work Category</label>

src/hooks/useOrganization.js

@@ -103,8 +103,12 @@ export const useAssignOrgToProject = (onSuccessCallback) => {
     mutationFn: async (payload) =>
       await OrganizationRepository.assignOrganizationToProject(payload),
     onSuccess: (_, variables) => {
+      const {projectId} = variables
       useClient.invalidateQueries({
         queryKey: ["projectAssignedOrganiztions"],
+      });
+       useClient.invalidateQueries({
+        queryKey: ["projectAssignedOrganization", projectId],
       });
       showToast("Organization  successfully", "success");
       if (onSuccessCallback) onSuccessCallback();