Merge branch 'OnFieldWork_V1' of https://git.marcoaiot.com/admin/marco.pms.web into OnFieldWork_V1
This commit is contained in:
commit
c1a8b87a2c
@ -95,8 +95,12 @@ const AttendanceOverview = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Content */}
|
{/* Content */}
|
||||||
<div className="flex-grow-1 d-flex align-items-center justify-content-center">
|
<div className="flex-grow-1 d-flex align-items-center justify-content-center ">
|
||||||
{view === "chart" ? (
|
{!isLoading && (!attendanceData || attendanceData.length === 0) ? (
|
||||||
|
<div
|
||||||
|
className="text-muted fw-semibold d-flex align-items-center justify-content-center"
|
||||||
|
style={{ minHeight: "250px" }}>No data found</div>
|
||||||
|
) : view === "chart" ? (
|
||||||
<div className="w-100">
|
<div className="w-100">
|
||||||
<ReactApexChart options={chartOptions} series={chartSeries} type="bar" height={300} />
|
<ReactApexChart options={chartOptions} series={chartSeries} type="bar" height={300} />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -45,13 +45,13 @@ const Dashboard = () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="row g-6">
|
<div className="row ">
|
||||||
{!isAllProjectsSelected && (
|
{!isAllProjectsSelected && (
|
||||||
<div className="col-6">
|
<div className="col-12 col-md-6 mb-sm-0 mb-4 ">
|
||||||
<AttendanceOverview />
|
<AttendanceOverview />
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<div className="col-6">
|
<div className="col-12 col-md-6">
|
||||||
<ExpenseByProject />
|
<ExpenseByProject />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -65,9 +65,6 @@ const { labels, series, total } = useMemo(() => {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
if (data?.report === 0) {
|
|
||||||
return <div>No data found</div>;
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@ -97,7 +94,7 @@ const { labels, series, total } = useMemo(() => {
|
|||||||
|
|
||||||
{/* Data display */}
|
{/* Data display */}
|
||||||
{!isLoading && report.length === 0 && (
|
{!isLoading && report.length === 0 && (
|
||||||
<div className="text-center text-muted py-5">No data found</div>
|
<div className="text-center py-5 text-muted ">No data found</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{!isLoading && report.length > 0 && (
|
{!isLoading && report.length > 0 && (
|
||||||
|
|||||||
@ -117,11 +117,10 @@ const ExpenseByProject = () => {
|
|||||||
{["1M", "3M", "6M", "12M", "All"].map((item) => (
|
{["1M", "3M", "6M", "12M", "All"].map((item) => (
|
||||||
<button
|
<button
|
||||||
key={item}
|
key={item}
|
||||||
className={`border-0 px-2 py-1 text-sm rounded ${
|
className={`border-0 px-2 py-1 text-sm rounded ${range === item
|
||||||
range === item
|
|
||||||
? "text-white bg-primary"
|
? "text-white bg-primary"
|
||||||
: "text-body bg-transparent"
|
: "text-body bg-transparent"
|
||||||
}`}
|
}`}
|
||||||
style={{ cursor: "pointer", transition: "all 0.2s ease" }}
|
style={{ cursor: "pointer", transition: "all 0.2s ease" }}
|
||||||
onClick={() => setRange(item)}
|
onClick={() => setRange(item)}
|
||||||
>
|
>
|
||||||
@ -148,15 +147,16 @@ const ExpenseByProject = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Chart */}
|
{/* Chart */}
|
||||||
<div
|
<div className="card-body bg-white text-dark p-3 rounded" style={{ minHeight: "210px" }}>
|
||||||
className="card-body bg-white text-dark p-3 rounded"
|
|
||||||
>
|
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<p>Loading chart...</p>
|
<p>Loading chart...</p>
|
||||||
|
) : !expenseApiData || expenseApiData.length === 0 ? (
|
||||||
|
<div className="text-center text-muted py-5">No data found</div>
|
||||||
) : (
|
) : (
|
||||||
<Chart options={options} series={series} type="bar" height={235} />
|
<Chart options={options} series={series} type="bar" height={235} />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -147,7 +147,7 @@ const Documents = ({ Document_Entity, Entity }) => {
|
|||||||
return (
|
return (
|
||||||
<DocumentContext.Provider value={contextValues}>
|
<DocumentContext.Provider value={contextValues}>
|
||||||
<div className="mt-2">
|
<div className="mt-2">
|
||||||
<div className="card page-min-h d-flex p-2">
|
<div className="card page-min-h d-flex p-5">
|
||||||
<DocumentFilterChips filters={filters} filterData={filterData} removeFilterChip={removeFilterChip} />
|
<DocumentFilterChips filters={filters} filterData={filterData} removeFilterChip={removeFilterChip} />
|
||||||
<div className="row align-items-center">
|
<div className="row align-items-center">
|
||||||
{/* Search */}
|
{/* Search */}
|
||||||
|
|||||||
@ -270,7 +270,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
|
|||||||
<td colSpan={8} className="text-start">
|
<td colSpan={8} className="text-start">
|
||||||
<div className="d-flex align-items-center">
|
<div className="d-flex align-items-center">
|
||||||
{" "}
|
{" "}
|
||||||
<small className="fs-6 ">
|
<small className="fs-6 py-1">
|
||||||
{displayField} :{" "}
|
{displayField} :{" "}
|
||||||
</small>{" "}
|
</small>{" "}
|
||||||
<small className="fs-6 ms-3">
|
<small className="fs-6 ms-3">
|
||||||
|
|||||||
@ -360,7 +360,7 @@ const EmployeeList = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Right side: Search + Add Employee + Options */}
|
{/* Right side: Search + Add Employee + Options */}
|
||||||
<div className="d-flex flex-wrap align-items-center justify-content-end gap-3 flex-grow-1">
|
<div className="d-flex flex-wrap align-items-center justify-content-end flex-grow-1">
|
||||||
{/* Add Employee Button */}
|
{/* Add Employee Button */}
|
||||||
{Manage_Employee && (
|
{Manage_Employee && (
|
||||||
<button
|
<button
|
||||||
@ -429,269 +429,272 @@ const EmployeeList = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<div className="table-responsive text-nowrap">
|
||||||
<table
|
<table
|
||||||
className="datatables-users table border-top dataTable no-footer dtr-column text-nowrap"
|
className="datatables-users table border-top dataTable no-footer dtr-column text-nowrap"
|
||||||
id="DataTables_Table_0"
|
id="DataTables_Table_0"
|
||||||
aria-describedby="DataTables_Table_0_info"
|
aria-describedby="DataTables_Table_0_info"
|
||||||
style={{ width: "100%" }}
|
style={{ width: "100%" }}
|
||||||
ref={tableRef}
|
ref={tableRef}
|
||||||
>
|
>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
|
||||||
<th
|
|
||||||
className="sorting sorting_desc"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="2"
|
|
||||||
aria-label="User: activate to sort column ascending"
|
|
||||||
aria-sort="descending"
|
|
||||||
>
|
|
||||||
<div className="text-start ms-6">Name</div>
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
className="sorting sorting_desc d-none d-sm-table-cell"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
aria-label="User: activate to sort column ascending"
|
|
||||||
aria-sort="descending"
|
|
||||||
>
|
|
||||||
<div className="text-start ms-5">Email</div>
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
className="sorting sorting_desc d-none d-sm-table-cell"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
aria-label="User: activate to sort column ascending"
|
|
||||||
aria-sort="descending"
|
|
||||||
>
|
|
||||||
<div className="text-start ms-5">Contact</div>
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
className="sorting sorting_desc d-none d-sm-table-cell"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
aria-label="User: activate to sort column ascending"
|
|
||||||
aria-sort="descending"
|
|
||||||
>
|
|
||||||
<div className="text-start ms-5">Designation</div>
|
|
||||||
</th>
|
|
||||||
|
|
||||||
<th
|
|
||||||
className="sorting d-none d-md-table-cell"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
aria-label="Plan: activate to sort column ascending"
|
|
||||||
>
|
|
||||||
Joining Date
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
className="sorting"
|
|
||||||
tabIndex="0"
|
|
||||||
aria-controls="DataTables_Table_0"
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
aria-label="Billing: activate to sort column ascending"
|
|
||||||
>
|
|
||||||
Status
|
|
||||||
</th>
|
|
||||||
<th
|
|
||||||
className={`sorting_disabled ${!Manage_Employee && "d-none"
|
|
||||||
}`}
|
|
||||||
rowSpan="1"
|
|
||||||
colSpan="1"
|
|
||||||
style={{ width: "50px" }}
|
|
||||||
aria-label="Actions"
|
|
||||||
>
|
|
||||||
Actions
|
|
||||||
</th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
{loading && (
|
|
||||||
<tr>
|
<tr>
|
||||||
<td colSpan={8}>
|
<th
|
||||||
<p>Loading...</p>
|
className="sorting sorting_desc"
|
||||||
</td>
|
tabIndex="0"
|
||||||
</tr>
|
aria-controls="DataTables_Table_0"
|
||||||
)}
|
rowSpan="1"
|
||||||
{/* Conditional messages for no data or no search results */}
|
colSpan="2"
|
||||||
{!loading &&
|
aria-label="User: activate to sort column ascending"
|
||||||
displayData?.length === 0 &&
|
aria-sort="descending"
|
||||||
searchText ? (
|
>
|
||||||
<tr>
|
<div className="text-start ms-6">Name</div>
|
||||||
<td colSpan={8} className="border-0">
|
</th>
|
||||||
<div className="py-12">
|
<th
|
||||||
<small className="muted">
|
className="sorting sorting_desc d-none d-sm-table-cell"
|
||||||
'{searchText}' employee not found
|
tabIndex="0"
|
||||||
</small>{" "}
|
aria-controls="DataTables_Table_0"
|
||||||
</div>
|
rowSpan="1"
|
||||||
</td>
|
colSpan="1"
|
||||||
</tr>
|
aria-label="User: activate to sort column ascending"
|
||||||
) : null}
|
aria-sort="descending"
|
||||||
{!loading &&
|
>
|
||||||
displayData?.length === 0 &&
|
<div className="text-start ms-5">Email</div>
|
||||||
(!searchText) ? (
|
</th>
|
||||||
<tr>
|
<th
|
||||||
<td colSpan={8} className="border-0">
|
className="sorting sorting_desc d-none d-sm-table-cell"
|
||||||
<div className="py-12">{showInactive ? "No In-active Employeee Found" : "No Employeee Found"}</div>
|
tabIndex="0"
|
||||||
</td>
|
aria-controls="DataTables_Table_0"
|
||||||
</tr>
|
rowSpan="1"
|
||||||
) : null}
|
colSpan="1"
|
||||||
|
aria-label="User: activate to sort column ascending"
|
||||||
|
aria-sort="descending"
|
||||||
|
>
|
||||||
|
<div className="text-start ms-5">Contact</div>
|
||||||
|
</th>
|
||||||
|
<th
|
||||||
|
className="sorting sorting_desc d-none d-sm-table-cell"
|
||||||
|
tabIndex="0"
|
||||||
|
aria-controls="DataTables_Table_0"
|
||||||
|
rowSpan="1"
|
||||||
|
colSpan="1"
|
||||||
|
aria-label="User: activate to sort column ascending"
|
||||||
|
aria-sort="descending"
|
||||||
|
>
|
||||||
|
<div className="text-start ms-5">Designation</div>
|
||||||
|
</th>
|
||||||
|
|
||||||
{/* Render current items */}
|
<th
|
||||||
{currentItems &&
|
className="sorting d-none d-md-table-cell"
|
||||||
!loading &&
|
tabIndex="0"
|
||||||
currentItems.map((item) => (
|
aria-controls="DataTables_Table_0"
|
||||||
<tr className="odd" key={item.id}>
|
rowSpan="1"
|
||||||
<td className="sorting_1" colSpan={2}>
|
colSpan="1"
|
||||||
<div className="d-flex justify-content-start align-items-center user-name">
|
aria-label="Plan: activate to sort column ascending"
|
||||||
<Avatar
|
>
|
||||||
firstName={item.firstName}
|
Joining Date
|
||||||
lastName={item.lastName}
|
</th>
|
||||||
></Avatar>
|
<th
|
||||||
<div className="d-flex flex-column">
|
className="sorting"
|
||||||
<a
|
tabIndex="0"
|
||||||
onClick={() => navigate(`/employee/${item.id}`)}
|
aria-controls="DataTables_Table_0"
|
||||||
className="text-heading text-truncate cursor-pointer"
|
rowSpan="1"
|
||||||
>
|
colSpan="1"
|
||||||
<span className="fw-normal">
|
aria-label="Billing: activate to sort column ascending"
|
||||||
{item.firstName} {item.middleName}{" "}
|
>
|
||||||
{item.lastName}
|
Status
|
||||||
</span>
|
</th>
|
||||||
</a>
|
<th
|
||||||
</div>
|
className={`sorting_disabled ${!Manage_Employee && "d-none"
|
||||||
|
}`}
|
||||||
|
rowSpan="1"
|
||||||
|
colSpan="1"
|
||||||
|
style={{ width: "50px" }}
|
||||||
|
aria-label="Actions"
|
||||||
|
>
|
||||||
|
Actions
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{loading && (
|
||||||
|
<tr>
|
||||||
|
<td colSpan={8}>
|
||||||
|
<p>Loading...</p>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
)}
|
||||||
|
{/* Conditional messages for no data or no search results */}
|
||||||
|
{!loading &&
|
||||||
|
displayData?.length === 0 &&
|
||||||
|
searchText ? (
|
||||||
|
<tr>
|
||||||
|
<td colSpan={8} className="border-0">
|
||||||
|
<div className="py-12">
|
||||||
|
<small className="muted">
|
||||||
|
'{searchText}' employee not found
|
||||||
|
</small>{" "}
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td className="text-start d-none d-sm-table-cell">
|
</tr>
|
||||||
{item.email ? (
|
) : null}
|
||||||
<span className="text-truncate">
|
{!loading &&
|
||||||
<i className="bx bxs-envelope text-primary me-2"></i>
|
displayData?.length === 0 &&
|
||||||
{item.email}
|
(!searchText) ? (
|
||||||
</span>
|
<tr>
|
||||||
) : (
|
<td colSpan={8} className="border-0">
|
||||||
<span className="text-truncate text-italic">-</span>
|
<div className="py-12">{showInactive ? "No In-active Employeee Found" : "No Employeee Found"}</div>
|
||||||
)}
|
|
||||||
</td>
|
|
||||||
<td className="text-start d-none d-sm-table-cell">
|
|
||||||
<span className="text-truncate">
|
|
||||||
<i className="bx bxs-phone-call text-primary me-2"></i>
|
|
||||||
{item.phoneNumber}
|
|
||||||
</span>
|
|
||||||
</td>
|
|
||||||
<td className=" d-none d-sm-table-cell text-start">
|
|
||||||
<span className="text-truncate">
|
|
||||||
<i className="bx bxs-wrench text-success me-2"></i>
|
|
||||||
{item.jobRole || "Not Assign Yet"}
|
|
||||||
</span>
|
|
||||||
</td>
|
</td>
|
||||||
|
</tr>
|
||||||
|
) : null}
|
||||||
|
|
||||||
<td className="d-none d-md-table-cell">
|
{/* Render current items */}
|
||||||
{item.joiningDate ? moment(item.joiningDate).format("DD-MMM-YYYY") : "NA"}
|
{currentItems &&
|
||||||
</td>
|
!loading &&
|
||||||
|
currentItems.map((item) => (
|
||||||
<td>
|
<tr className="odd" key={item.id}>
|
||||||
{showInactive ? (
|
<td className="sorting_1" colSpan={2}>
|
||||||
<span
|
<div className="d-flex justify-content-start align-items-center user-name">
|
||||||
className="badge bg-label-danger"
|
<Avatar
|
||||||
text-capitalized=""
|
firstName={item.firstName}
|
||||||
>
|
lastName={item.lastName}
|
||||||
Inactive
|
></Avatar>
|
||||||
</span>
|
<div className="d-flex flex-column">
|
||||||
) : (
|
<a
|
||||||
<span
|
onClick={() => navigate(`/employee/${item.id}`)}
|
||||||
className="badge bg-label-success"
|
className="text-heading text-truncate cursor-pointer"
|
||||||
text-capitalized=""
|
|
||||||
>
|
|
||||||
Active
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</td>
|
|
||||||
{Manage_Employee && (
|
|
||||||
<td className="text-end">
|
|
||||||
<div className="dropdown">
|
|
||||||
<button
|
|
||||||
className="btn btn-icon dropdown-toggle hide-arrow"
|
|
||||||
data-bs-toggle="dropdown"
|
|
||||||
>
|
|
||||||
<i className="bx bx-dots-vertical-rounded bx-md"></i>
|
|
||||||
</button>
|
|
||||||
<div className="dropdown-menu dropdown-menu-end">
|
|
||||||
{/* View always visible */}
|
|
||||||
<button
|
|
||||||
onClick={() =>
|
|
||||||
navigate(`/employee/${item.id}`)
|
|
||||||
}
|
|
||||||
className="dropdown-item py-1"
|
|
||||||
>
|
>
|
||||||
<i className="bx bx-detail bx-sm"></i> View
|
<span className="fw-normal">
|
||||||
</button>
|
{item.firstName} {item.middleName}{" "}
|
||||||
|
{item.lastName}
|
||||||
{/* If ACTIVE employee */}
|
</span>
|
||||||
{item.isActive && (
|
</a>
|
||||||
<>
|
|
||||||
<button
|
|
||||||
className="dropdown-item py-1"
|
|
||||||
onClick={() =>
|
|
||||||
handleEmployeeModel(item.id)
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<i className="bx bx-edit bx-sm"></i> Edit
|
|
||||||
</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
|
|
||||||
className="dropdown-item py-1"
|
|
||||||
type="button"
|
|
||||||
data-bs-toggle="modal"
|
|
||||||
data-bs-target="#managerole-modal"
|
|
||||||
onClick={() =>
|
|
||||||
setEmpForManageRole(item.id)
|
|
||||||
}
|
|
||||||
>
|
|
||||||
<i className="bx bx-cog bx-sm"></i> Manage
|
|
||||||
Role
|
|
||||||
</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>
|
||||||
)}
|
<td className="text-start d-none d-sm-table-cell">
|
||||||
</tr>
|
{item.email ? (
|
||||||
))}
|
<span className="text-truncate">
|
||||||
</tbody>
|
<i className="bx bxs-envelope text-primary me-2"></i>
|
||||||
</table>
|
{item.email}
|
||||||
|
</span>
|
||||||
|
) : (
|
||||||
|
<span className="text-truncate text-italic">-</span>
|
||||||
|
)}
|
||||||
|
</td>
|
||||||
|
<td className="text-start d-none d-sm-table-cell">
|
||||||
|
<span className="text-truncate">
|
||||||
|
<i className="bx bxs-phone-call text-primary me-2"></i>
|
||||||
|
{item.phoneNumber}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className=" d-none d-sm-table-cell text-start">
|
||||||
|
<span className="text-truncate">
|
||||||
|
<i className="bx bxs-wrench text-success me-2"></i>
|
||||||
|
{item.jobRole || "Not Assign Yet"}
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td className="d-none d-md-table-cell">
|
||||||
|
{item.joiningDate ? moment(item.joiningDate).format("DD-MMM-YYYY") : "NA"}
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td>
|
||||||
|
{showInactive ? (
|
||||||
|
<span
|
||||||
|
className="badge bg-label-danger"
|
||||||
|
text-capitalized=""
|
||||||
|
>
|
||||||
|
Inactive
|
||||||
|
</span>
|
||||||
|
) : (
|
||||||
|
<span
|
||||||
|
className="badge bg-label-success"
|
||||||
|
text-capitalized=""
|
||||||
|
>
|
||||||
|
Active
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</td>
|
||||||
|
{Manage_Employee && (
|
||||||
|
<td className="text-end">
|
||||||
|
<div className="dropdown">
|
||||||
|
<button
|
||||||
|
className="btn btn-icon dropdown-toggle hide-arrow"
|
||||||
|
data-bs-toggle="dropdown"
|
||||||
|
>
|
||||||
|
<i className="bx bx-dots-vertical-rounded bx-md"></i>
|
||||||
|
</button>
|
||||||
|
<div className="dropdown-menu dropdown-menu-end">
|
||||||
|
{/* View always visible */}
|
||||||
|
<button
|
||||||
|
onClick={() =>
|
||||||
|
navigate(`/employee/${item.id}`)
|
||||||
|
}
|
||||||
|
className="dropdown-item py-1"
|
||||||
|
>
|
||||||
|
<i className="bx bx-detail bx-sm"></i> View
|
||||||
|
</button>
|
||||||
|
|
||||||
|
{/* If ACTIVE employee */}
|
||||||
|
{item.isActive && (
|
||||||
|
<>
|
||||||
|
<button
|
||||||
|
className="dropdown-item py-1"
|
||||||
|
onClick={() =>
|
||||||
|
handleEmployeeModel(item.id)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<i className="bx bx-edit bx-sm"></i> Edit
|
||||||
|
</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
|
||||||
|
className="dropdown-item py-1"
|
||||||
|
type="button"
|
||||||
|
data-bs-toggle="modal"
|
||||||
|
data-bs-target="#managerole-modal"
|
||||||
|
onClick={() =>
|
||||||
|
setEmpForManageRole(item.id)
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<i className="bx bx-cog bx-sm"></i> Manage
|
||||||
|
Role
|
||||||
|
</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>
|
||||||
|
</td>
|
||||||
|
)}
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{displayData.length > 0 && (
|
{displayData.length > 0 && (
|
||||||
<Pagination
|
<Pagination
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user