src/components/Project/Infrastructure/TaskModel.jsx

@@ -6,9 +6,10 @@ import {
   useActivitiesMaster,
   useWorkCategoriesMaster,
 } from "../../../hooks/masterHook/useMaster";
-import { useManageTask } from "../../../hooks/useProjects";
+import { useManageTask, useProjectAssignedServices } from "../../../hooks/useProjects";
 import showToast from "../../../services/toastService";
 import Label from "../../common/Label";
+import { useSelectedProject } from "../../../slices/apiDataManager";
 
 const taskSchema = z.object({
   buildingID: z.string().min(1, "Building is required"),
@@ -37,6 +38,15 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
   const { activities, loading: activityLoading } = useActivitiesMaster();
   const { categories, categoryLoading } = useWorkCategoriesMaster();
 
+  const projectId = useSelectedProject();
+
+  const { data: assignedServices, isLoading: servicesLoading } = useProjectAssignedServices(projectId);
+
+  const [selectedService, setSelectedService] = useState("");
+
+  const handleServiceChange = (e) => {
+    setSelectedService(e.target.value);
+  };
   const {
     register,
     handleSubmit,
@@ -96,10 +106,12 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
   }, [categories]);
 
   const onSubmitForm = async (data) => {
-       const payload = [data];
-      CreateTask({payload:payload,buildingId: data.buildingID,
+    const payload = [data];
+    CreateTask({
+      payload: payload, buildingId: data.buildingID,
       floorId: data.floorId,
-      workAreaId: data.workAreaId, PreviousPlannedWork:0,previousCompletedWork:0});
+      workAreaId: data.workAreaId, PreviousPlannedWork: 0, previousCompletedWork: 0
+    });
   };
 
   return (
@@ -150,6 +162,7 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
         </div>
       )}
 
+      {/* Work Area Selection */}
       {selectedFloor && (
         <div className="col-12 text-start">
           <Label className="form-label" required>Select Work Area</Label>
@@ -172,6 +185,32 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
         </div>
       )}
 
+      {/* Services Selection */}
+      {selectedWorkArea && (
+        <div className="col-12 text-start">
+          <Label className="form-label">Select Services</Label>
+          <select
+            name="DataTables_Table_0_length"
+            aria-controls="DataTables_Table_0"
+            className="form-select form-select-sm"
+            aria-label="Select Service"
+            value={selectedService}
+            onChange={handleServiceChange}
+          >
+            {servicesLoading && <option>Loading...</option>}
+            {assignedServices?.map((service) => (
+              <option key={service.id} value={service.id}>
+                {service.name}
+              </option>
+            ))}
+          </select>
+          {errors.buildingID && (
+            <p className="danger-text">{errors.buildingID.message}</p>
+          )}
+        </div>
+      )}
+
+      {/* Activity Selection */}
       {selectedWorkArea && (
         <div className="col-12 text-start">
           <Label className="form-label" required>Select Activity</Label>
@@ -192,6 +231,7 @@ const TaskModel = ({ project, onSubmit, onClose }) => {
         </div>
       )}
 
+
       {selectedWorkArea && (
         <div className="col-12 text-start">
           <label className="form-label">Select Work Category</label>