handled loading properly

This commit is contained in:
Pramod Mahajan 2025-05-06 23:12:08 +05:30
parent 7ef148ac32
commit 9802746267

View File

@ -65,7 +65,8 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
}) })
); );
} }
}, [dateRange, projectId, isRefreshing]); }, [ dateRange, projectId, isRefreshing ] );
return ( return (
<> <>
@ -82,12 +83,13 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
loading ? "spin":"" loading ? "spin":""
}`} }`}
title="Refresh" title="Refresh"
onClick={()=>setIsRefreshing(!isRefreshing)} onClick={() => setIsRefreshing( !isRefreshing )}
/> />
</div> </div>
</div> </div>
<div className="table-responsive text-nowrap"> <div className="table-responsive text-nowrap">
{data && data.length > 0 ? ( {(data && data.length > 0 ) && (
<table className="table mb-0"> <table className="table mb-0">
<thead> <thead>
<tr> <tr>
@ -107,14 +109,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
</thead> </thead>
<tbody> <tbody>
{loading && <td colSpan={5}>Loading...</td>} {loading && <td colSpan={5}>Loading...</td>}
{error && <td colSpan={5}>{error}</td>} {currentItems?.map( ( attendance, index ) => (
{data && data.length === 0 && (
<tr>
<td colSpan={5}>No Data Found</td>
</tr>
)}
{currentItems?.map((attendance, index) => (
<tr key={index}> <tr key={index}>
<td colSpan={2}> <td colSpan={2}>
<div className="d-flex justify-content-start align-items-center"> <div className="d-flex justify-content-start align-items-center">
@ -133,12 +128,12 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
</td> </td>
<td> <td>
{" "} {" "}
{moment(attendance.checkInTime).format("DD-MMM-YYYY")} {moment( attendance.checkInTime ).format( "DD-MMM-YYYY" )}
</td> </td>
<td>{convertShortTime(attendance.checkInTime)}</td> <td>{convertShortTime( attendance.checkInTime )}</td>
<td> <td>
{attendance.checkOutTime {attendance.checkOutTime
? convertShortTime(attendance.checkOutTime) ? convertShortTime( attendance.checkOutTime )
: "--"} : "--"}
</td> </td>
<td className="text-center"> <td className="text-center">
@ -150,12 +145,14 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
/> />
</td> </td>
</tr> </tr>
))} ) )}
</tbody> </tbody>
</table> </table>
) : ( ) }
{(!loading && data.length === 0) &&
<span>No employee logs</span> <span>No employee logs</span>
)} }
{error && <td colSpan={5}>{error}</td>}
</div> </div>
{!loading && ( {!loading && (
<nav aria-label="Page "> <nav aria-label="Page ">
@ -201,7 +198,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
</li> </li>
</ul> </ul>
</nav> </nav>
)} )}
</> </>
); );
}; };