From 6c2a6ca7f96867731edacea37f6c4ab443cd1dc2 Mon Sep 17 00:00:00 2001 From: Pramod Mahajan Date: Mon, 21 Apr 2025 15:41:37 +0530 Subject: [PATCH] employee assign perfectly with job role. --- src/components/Project/MapUsers.jsx | 119 +++++---- src/components/Project/Teams.jsx | 366 ++++----------------------- src/pages/Activities/TaskPlannng.jsx | 2 +- 3 files changed, 117 insertions(+), 370 deletions(-) diff --git a/src/components/Project/MapUsers.jsx b/src/components/Project/MapUsers.jsx index 393d3e04..be02b1f4 100644 --- a/src/components/Project/MapUsers.jsx +++ b/src/components/Project/MapUsers.jsx @@ -1,8 +1,9 @@ import React, { useState, useEffect } from "react"; import EmployeeRepository from "../../repositories/EmployeeRepository"; -import AssignEmployeeCard from "./AssignEmployeeCard"; -import {useAllEmployees} from "../../hooks/useEmployees"; +import { useAllEmployees } from "../../hooks/useEmployees"; import useSearch from "../../hooks/useSearch"; +import AssignEmployeeTable from "./AssignEmployeeTable"; +import showToast from "../../services/toastService"; const MapUsers = ({ projectId, @@ -11,61 +12,59 @@ const MapUsers = ({ onSubmit, allocation, }) => { - const {employeesList, loading, error} = useAllEmployees(); + const { employeesList, loading, error } = useAllEmployees(); const [selectedEmployees, setSelectedEmployees] = useState([]); const [searchText, setSearchText] = useState(""); - const handleAllocationData = Array.isArray( allocation ) ? allocation : []; + const handleAllocationData = Array.isArray(allocation) ? allocation : []; const allocationEmployees = employeesList.map((employee) => { - const allocationItem = handleAllocationData.find((alloc) => alloc.employeeId === employee.id); + const allocationItem = handleAllocationData.find( + (alloc) => alloc.employeeId === employee.id + ); return { ...employee, isActive: allocationItem ? allocationItem.isActive : false, jobRoleId: allocationItem ? allocationItem.jobRoleId : employee.jobRoleId, }; - } ); + }); + function parseDate(dateStr) { + return new Date(dateStr.split(".")[0]); + } - - -function parseDate(dateStr) { - return new Date(dateStr.split('.')[0]); -} - - -const latestAllocations = handleAllocationData.reduce((acc, alloc) => { + const latestAllocations = handleAllocationData.reduce((acc, alloc) => { const existingAlloc = acc[alloc.employeeId]; if (!existingAlloc) { - acc[alloc.employeeId] = alloc; + acc[alloc.employeeId] = alloc; } else { - - const existingDate = parseDate(existingAlloc.reAllocationDate || existingAlloc.allocationDate); - const newDate = parseDate(alloc.reAllocationDate || alloc.allocationDate); + const existingDate = parseDate( + existingAlloc.reAllocationDate || existingAlloc.allocationDate + ); + const newDate = parseDate(alloc.reAllocationDate || alloc.allocationDate); - - if (newDate > existingDate) { - acc[alloc.employeeId] = alloc; - } + if (newDate > existingDate) { + acc[alloc.employeeId] = alloc; + } } return acc; -}, {}); + }, {}); - -const allocationEmployeesData = employeesList + const allocationEmployeesData = employeesList .map((employee) => { - const allocationItem = latestAllocations[employee.id]; - return { - ...employee, - isActive: allocationItem ? allocationItem.isActive : false, - }; + const allocationItem = latestAllocations[employee.id]; + return { + ...employee, + isActive: allocationItem ? allocationItem.isActive : false, + }; }) - .filter( ( employee ) => employee.isActive === false ); - - - - const { filteredData, setSearchQuery } = useSearch(allocationEmployeesData, searchText); + .filter((employee) => employee.isActive === false); + + const { filteredData, setSearchQuery } = useSearch( + allocationEmployeesData, + searchText + ); const handleRoleChange = (employeeId, newRoleId) => { setSelectedEmployees((prevSelectedEmployees) => @@ -78,7 +77,9 @@ const allocationEmployeesData = employeesList const handleCheckboxChange = (employeeId) => { setSelectedEmployees((prevSelectedEmployees) => { const updatedEmployees = [...prevSelectedEmployees]; - const employeeIndex = updatedEmployees.findIndex((emp) => emp.id === employeeId); + const employeeIndex = updatedEmployees.findIndex( + (emp) => emp.id === employeeId + ); if (employeeIndex !== -1) { const isSelected = !updatedEmployees[employeeIndex].isSelected; @@ -93,12 +94,17 @@ const allocationEmployeesData = employeesList }); }; - const handleSubmit = () => { const selected = selectedEmployees .filter((emp) => emp.isSelected) .map((emp) => ({ empID: emp.id, jobRoleId: emp.jobRoleId })); - onSubmit(selected); + if (selected.length > 0) { + console.log(selected); + onSubmit( selected ); + setSelectedEmployees([]) + } else { + showToast("Please select Employee", "error"); + } }; return ( @@ -118,20 +124,27 @@ const allocationEmployeesData = employeesList
- + + + + {loading && !employeesList &&

Loading...

} + {filteredData.map((emp) => ( + + ))} + +
@@ -198,7 +189,6 @@ const Teams = ( {project} ) => Assigned Date Release Date Role - Actions @@ -278,259 +268,3 @@ const Teams = ( {project} ) => export default Teams; - - - - - - - -// const Teams = ({ project }) => { -// const dispatch = useDispatch() -// const {data, loading} = useMaster() -// const navigate = useNavigate() - - -// const [isModalOpen, setIsModelOpen] = useState(false); -// const [error, setError] = useState(""); -// const [empJobRoles, setEmpJobRoles] = useState([]); -// const [clearFormTrigger, setClearFormTrigger] = useState(false); -// const [employees, setEmployees] = useState([]); -// const [ filteredEmployees, setFilteredEmployees ] = useState( [] ); - -// useEffect( () => -// { -// dispatch( changeMaster( 'Job Role' ) ) -// },[dispatch]) - -// const fetchEmployees = useCallback(async () => { -// try { -// const response = await ProjectRepository.getProjectAllocation(project.id); -// setEmployees(response.data); -// setFilteredEmployees(response.data.filter((emp) => emp.isActive)); -// } catch (error) { -// console.error(error); -// setError("Failed to fetch data."); -// } -// }, [project.id]); - -// useEffect(() => { -// fetchEmployees(); -// }, [fetchEmployees]); - - -// useEffect(() => { -// if (data) setEmpJobRoles(data); -// }, [ data ] ); - -// const submitAllocations = (items) => { -// ProjectRepository.manageProjectAllocation(items) -// .then((response) => { -// showToast("Details updated successfully.", "success"); -// setClearFormTrigger(true); -// fetchEmployees(); -// }) -// .catch((error) => { -// showToast(error.message, "error"); -// }); -// }; - -// const removeAllocation = (item) => { -// submitAllocations([ -// { -// empID: item.employeeId, -// jobRoleId: item.jobRoleId, -// projectId: project.id, -// status: false, -// }, -// ]); -// }; - -// const handleEmpAlicationFormSubmit = (allocaionObj) => { -// console.log("Form submitted:", allocaionObj); - -// let items = allocaionObj.map((item) => { -// return { -// empID: item.empID, -// jobRoleId: item.jobRoleId, -// projectId: project.id, -// status: true, -// }; -// }); -// submitAllocations(items) -// }; - -// const getRole = ( jobRoleId ) => -// { -// if (loading) return "Loading..."; -// if (!Array.isArray(empJobRoles)) return "Unassigned"; -// if (!jobRoleId) return "Unassigned"; - -// const role = empJobRoles.find((b) => b.id == jobRoleId); -// return role ? role.name : "Unassigned"; -// }; - -// const openModel = () => { -// setIsModelOpen(true); -// }; - -// const onModelClose = () => { -// setIsModelOpen(false); -// const modalElement = document.getElementById("user-model"); -// if (modalElement) { -// modalElement.classList.remove("show"); -// modalElement.style.display = "none"; -// document.body.classList.remove("modal-open"); -// document.querySelector(".modal-backdrop").remove(); -// } -// const modalBackdropElement = document.querySelector('.modal-backdrop'); -// if (modalBackdropElement) { -// modalBackdropElement.remove(); -// } -// document.body.style.overflow = 'auto' - -// }; - - -// const handleFilterEmployee = (e) => { -// const filterValue = e.target.value === "true"; -// setFilteredEmployees( -// employees.filter((emp) => emp.isActive === filterValue) -// ); -// }; - -// return ( -// <> -// {isModalOpen && ( -// -// )} -//
-//
-//
-//
-//
-// -//
-// -//
-//
-//
-// {employees && employees.length > 0 ? ( -// -// -// -// -// -// -// -// -// -// -// -// {filteredEmployees && -// filteredEmployees.map((item) => ( -// -// -// -// -// -// -// -// ))} -// -//
NameAssigned DateRelease DateRoleActions
-// -// -// {" "} -// {moment(item.allocationDate).format( -// "DD-MMM-YYYY" -// )}{" "} -// -// {item.reAllocationDate -// ? moment(item.reAllocationDate).format("DD-MMM-YYYY"): "Present"} -// -// -// {getRole(item.jobRoleId)} -// -// -// {item.isActive && ( -// -// )} -// {!item.isActive && Not in project} -//
-// ) : ( -// No employees assigned to the project -// )} -//
-//
-//
-// -// ); -// }; - -// export default Teams; diff --git a/src/pages/Activities/TaskPlannng.jsx b/src/pages/Activities/TaskPlannng.jsx index 265823a7..ae97d4e3 100644 --- a/src/pages/Activities/TaskPlannng.jsx +++ b/src/pages/Activities/TaskPlannng.jsx @@ -18,7 +18,7 @@ const TaskPlannng = () => { const {projects,loading:project_listLoader,error:projects_error} = useProjects(); const dispatch = useDispatch(); const selectedProject = useSelector((store)=>store.localVariables.projectId); - console.log(selectedProject) + const [project, setProject] = useState(null); const [projectDetails, setProjectDetails] = useState(null);