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

handled proper loading, pagination only display if record have greather than 5 and added refresh button

Browse Source
This commit is contained in:
Pramod Mahajan 2025-05-06 22:52:59 +05:30
parent 6f81b99dcd
commit 099a3bcc36
1 changed files with 17 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
src/pages/employee/AttendancesEmployeeRecords.jsx
View File

@ -84,7 +84,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
})
);
}
}, [dateRange, employee]);
}, [dateRange, employee,isRefreshing]);
const openModal = (id) => {
setAttendanecId(id);
@ -132,14 +132,20 @@ const AttendancesEmployeeRecords = ({ employee }) => {
<i
className={`bx bx-refresh cursor-pointer fs-4 ${
loading ? "spin" : ""
}`}
}`}
data-toggle="tooltip"
title="Refresh"
onClick={() => setIsRefreshing(!isRefreshing)}
/>
</div>
</div>
<div className="table-responsive text-nowrap">
{data && data.length > 0 ? (
{(!loading && data.length === 0) &&
<span>No employee logs</span>
}
{error && <div className="text-center">{error }</div>}
{(loading && !data ) && <div className="text-center">Loading...</div>}
{(data && data.length > 0 ) && (
<table className="table mb-0">
<thead>
<tr>
@ -159,15 +165,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
</tr>
</thead>
<tbody>
{loading && <td colSpan={5}>Loading...</td>}
{error && <td colSpan={5}>{error}</td>}
{data && data.length === 0 && (
<tr>
<td colSpan={5}>No Data Found</td>
</tr>
)}
{currentItems?.map((attendance, index) => (
{currentItems?.map( ( attendance, index ) => (
<tr key={index}>
<td colSpan={2}>
<div className="d-flex justify-content-start align-items-center">
@ -186,12 +184,12 @@ const AttendancesEmployeeRecords = ({ employee }) => {
</td>
<td>
{" "}
{moment(attendance.checkInTime).format("DD-MMM-YYYY")}
{moment( attendance.checkInTime ).format( "DD-MMM-YYYY" )}
</td>
<td>{convertShortTime(attendance.checkInTime)}</td>
<td>{convertShortTime( attendance.checkInTime )}</td>
<td>
{attendance.checkOutTime
? convertShortTime(attendance.checkOutTime)
? convertShortTime( attendance.checkOutTime )
: "--"}
</td>
@ -202,20 +200,18 @@ const AttendancesEmployeeRecords = ({ employee }) => {
tabIndex="0"
aria-controls="DataTables_Table_0"
data-bs-toggle="modal"
onClick={() => openModal(attendance.id)}
onClick={() => openModal( attendance.id )}
>
View
</button>
</td>
</tr>
))}
) )}
</tbody>
</table>
) : (
<span>No employee logs</span>
)}
) }
</div>
{!loading && (
{(!loading && currentItems < 5) && (
<nav aria-label="Page ">
<ul className="pagination pagination-sm justify-content-end py-1">
<li