admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge pull request 'Display Only "Re-activate" Button for Inactive Employees in Action Column' (#394) from Kartik_Bug#1113 into Issues_Sep_1W_V2

Browse Source 
Reviewed-on: #394
Merged
This commit is contained in:
pramod.mahajan 2025-09-13 10:11:25 +00:00
commit 548597ed4f
1 changed files with 78 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
src/pages/employee/EmployeeList.jsx
View File

@ -18,7 +18,7 @@ import {
VIEW_ALL_EMPLOYEES, VIEW_ALL_EMPLOYEES,
VIEW_TEAM_MEMBERS, VIEW_TEAM_MEMBERS,
} from "../../utils/constants"; } from "../../utils/constants";
import { clearCacheKey, useSelectedProject } from "../../slices/apiDataManager"; import { clearCacheKey } from "../../slices/apiDataManager";
import { useHasUserPermission } from "../../hooks/useHasUserPermission"; import { useHasUserPermission } from "../../hooks/useHasUserPermission";
import SuspendEmp from "../../components/Employee/SuspendEmp"; // Keep if you use SuspendEmp import SuspendEmp from "../../components/Employee/SuspendEmp"; // Keep if you use SuspendEmp
import { import {
@ -38,10 +38,9 @@ import usePagination from "../../hooks/usePagination";
import { setProjectId } from "../../slices/localVariablesSlice"; import { setProjectId } from "../../slices/localVariablesSlice";
const EmployeeList = () => { const EmployeeList = () => {
// const selectedProjectId = useSelector( const selectedProjectId = useSelector(
// (store) => store.localVariables.projectId (store) => store.localVariables.projectId
// ); );
const selectedProjectId = useSelectedProject();
const { projectNames, loading: projectLoading, fetchData } = useProjectName(); const { projectNames, loading: projectLoading, fetchData } = useProjectName();
const dispatch = useDispatch(); const dispatch = useDispatch();
@ -79,11 +78,11 @@ const EmployeeList = () => {
} }
); );
useEffect(() => { useEffect(() => {
if (!selectedProjectId && projectNames?.length > 0) { if (selectedProjectId === null) {
dispatch(setProjectId(projectNames[0].id)); dispatch(setProjectId(projectNames[0]?.id));
} }
}, [selectedProjectId, projectNames, dispatch]); }, [selectedProjectId]);
const navigate = useNavigate(); const navigate = useNavigate();
const applySearchFilter = (data, text) => { const applySearchFilter = (data, text) => {
@ -177,12 +176,10 @@ useEffect(() => {
useEffect(() => { useEffect(() => {
if (!loading && Array.isArray(employees)) { if (!loading && Array.isArray(employees)) {
const sorted = [...employees].sort((a, b) => { const sorted = [...employees].sort((a, b) => {
const nameA = `${a.firstName || ""}${a.middleName || ""}${ const nameA = `${a.firstName || ""}${a.middleName || ""}${a.lastName || ""
a.lastName || "" }`.toLowerCase();
}`.toLowerCase(); const nameB = `${b.firstName || ""}${b.middleName || ""}${b.lastName || ""
const nameB = `${b.firstName || ""}${b.middleName || ""}${ }`.toLowerCase();
b.lastName || ""
}`.toLowerCase();
return nameA?.localeCompare(nameB); return nameA?.localeCompare(nameB);
}); });
@ -221,10 +218,10 @@ useEffect(() => {
recallEmployeeData( recallEmployeeData(
showInactive, showInactive,
showAllEmployees ? null : selectedProjectId showAllEmployees ? null : selectedProjectId
); ); // Use selectedProjectId here
} }
}, },
[employees, showInactive, showAllEmployees, selectedProjectId] [employees, showInactive, showAllEmployees, selectedProjectId] // Add all relevant dependencies
); );
useEffect(() => { useEffect(() => {
@ -247,7 +244,7 @@ useEffect(() => {
)} )}
{showModal && ( {showModal && (
<GlobalModel <GlobalModel
isOpen={showModal} isOpen={showModal}
size="lg" size="lg"
closeModal={() => setShowModal(false)} closeModal={() => setShowModal(false)}
@ -259,18 +256,24 @@ useEffect(() => {
/> />
</GlobalModel> </GlobalModel>
)} )}
{IsDeleteModalOpen && (
{IsDeleteModalOpen && (
<ConfirmModal <ConfirmModal
isOpen={IsDeleteModalOpen} isOpen={IsDeleteModalOpen}
type="delete" type="delete"
header="Suspend Employee" header={
message="Are you sure you want suspend?" selectedEmpFordelete?.isActive
? "Suspend Employee"
: "Reactivate Employee"
}
message={`Are you sure you want to ${selectedEmpFordelete?.isActive ? "suspend" : "reactivate"
} this employee?`}
onSubmit={(id) => onSubmit={(id) =>
suspendEmployee({ suspendEmployee({
employeeId:id , employeeId: id,
active: !selectedEmpFordelete.isActive, active: !selectedEmpFordelete.isActive,
}) })
} }
onClose={() => setIsDeleteModalOpen(false)} onClose={() => setIsDeleteModalOpen(false)}
loading={employeeLodaing} loading={employeeLodaing}
paramData={selectedEmpFordelete.id} paramData={selectedEmpFordelete.id}
@ -496,9 +499,8 @@ useEffect(() => {
Status Status
</th> </th>
<th <th
className={`sorting_disabled ${ className={`sorting_disabled ${!Manage_Employee && "d-none"
!Manage_Employee && "d-none" }`}
}`}
rowSpan="1" rowSpan="1"
colSpan="1" colSpan="1"
style={{ width: "50px" }} style={{ width: "50px" }}
@ -518,9 +520,9 @@ useEffect(() => {
)} )}
{/* Conditional messages for no data or no search results */} {/* Conditional messages for no data or no search results */}
{!loading && {!loading &&
displayData?.length === 0 && displayData?.length === 0 &&
searchText && searchText &&
!showAllEmployees ? ( !showAllEmployees ? (
<tr> <tr>
<td colSpan={8}> <td colSpan={8}>
<small className="muted"> <small className="muted">
@ -530,14 +532,14 @@ useEffect(() => {
</tr> </tr>
) : null} ) : null}
{!loading && {!loading &&
displayData?.length === 0 && displayData?.length === 0 &&
(!searchText || showAllEmployees) ? ( (!searchText || showAllEmployees) ? (
<tr> <tr>
<td <td
colSpan={8} colSpan={8}
style={{ paddingTop: "20px", textAlign: "center" }} style={{ paddingTop: "20px", textAlign: "center" }}
> >
No team members assigned yet No Data Found
</td> </td>
</tr> </tr>
) : null} ) : null}
@ -556,9 +558,7 @@ useEffect(() => {
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<a <a
onClick={() => onClick={() =>
navigate( navigate(`/employee/${item.id}`)
`/employee/${item.id}?for=attendance`
)
} }
className="text-heading text-truncate cursor-pointer" className="text-heading text-truncate cursor-pointer"
> >
@ -594,10 +594,9 @@ useEffect(() => {
{item.jobRole || "Not Assign Yet"} {item.jobRole || "Not Assign Yet"}
</span> </span>
</td> </td>
<td className=" d-none d-md-table-cell"> <td className=" d-none d-md-table-cell">
{item.joiningDate {moment(item.joiningDate)?.format("DD-MMM-YYYY")}
? moment(item.joiningDate).format("DD-MMM-YYYY")
: "NA"}
</td> </td>
<td> <td>
{showInactive ? ( {showInactive ? (
@ -626,47 +625,56 @@ useEffect(() => {
<i className="bx bx-dots-vertical-rounded bx-md"></i> <i className="bx bx-dots-vertical-rounded bx-md"></i>
</button> </button>
<div className="dropdown-menu dropdown-menu-end"> <div className="dropdown-menu dropdown-menu-end">
{/* View always visible */}
<button <button
onClick={() => onClick={() => navigate(`/employee/${item.id}`)}
navigate(`/employee/${item.id}`)
}
className="dropdown-item py-1" className="dropdown-item py-1"
> >
<i className="bx bx-detail bx-sm"></i> View <i className="bx bx-detail bx-sm"></i> View
</button> </button>
<button
className="dropdown-item py-1" {/* If ACTIVE employee */}
onClick={() => { {item.isActive && (
handleEmployeeModel(item.id);
}}
>
<i className="bx bx-edit bx-sm"></i> Edit
</button>
{!item.isSystem && (
<> <>
<button <button
className="dropdown-item py-1" className="dropdown-item py-1"
onClick={() => onClick={() => handleEmployeeModel(item.id)}
handleOpenDelete(item)
}
> >
<i className="bx bx-task-x bx-sm"></i>{" "} <i className="bx bx-edit bx-sm"></i> Edit
Suspend
</button> </button>
{/* Suspend only when active */}
{item.isActive && (
<button
className="dropdown-item py-1"
onClick={() => handleOpenDelete(item)}
>
<i className="bx bx-task-x bx-sm"></i> Suspend
</button>
)}
<button <button
className="dropdown-item py-1" className="dropdown-item py-1"
type="button" type="button"
data-bs-toggle="modal" data-bs-toggle="modal"
data-bs-target="#managerole-modal" data-bs-target="#managerole-modal"
onClick={() => onClick={() => setEmpForManageRole(item.id)}
setEmpForManageRole(item.id)
}
> >
<i className="bx bx-cog bx-sm"></i>{" "} <i className="bx bx-cog bx-sm"></i> Manage Role
Manage Role
</button> </button>
</> </>
)} )}
{/* If INACTIVE employee AND inactive toggle is ON */}
{!item.isActive && showInactive && (
<button
className="dropdown-item py-1"
onClick={() => handleOpenDelete(item)}
>
<i className="bx bx-refresh bx-sm me-1"></i> Re-activate
</button>
)}
</div> </div>
</div> </div>
</td> </td>
@ -683,9 +691,8 @@ useEffect(() => {
<nav aria-label="Page"> <nav aria-label="Page">
<ul className="pagination pagination-sm justify-content-end py-1"> <ul className="pagination pagination-sm justify-content-end py-1">
<li <li
className={`page-item ${ className={`page-item ${currentPage === 1 ? "disabled" : ""
currentPage === 1 ? "disabled" : "" }`}
}`}
> >
<button <button
className="page-link btn-xs" className="page-link btn-xs"
@ -698,9 +705,8 @@ useEffect(() => {
{[...Array(totalPages)]?.map((_, index) => ( {[...Array(totalPages)]?.map((_, index) => (
<li <li
key={index} key={index}
className={`page-item ${ className={`page-item ${currentPage === index + 1 ? "active" : ""
currentPage === index + 1 ? "active" : "" }`}
}`}
> >
<button <button
className="page-link" className="page-link"
@ -712,9 +718,8 @@ useEffect(() => {
))} ))}
<li <li
className={`page-item ${ className={`page-item ${currentPage === totalPages ? "disabled" : ""
currentPage === totalPages ? "disabled" : "" }`}
}`}
> >
<button <button
className="page-link" className="page-link"