increase page size
This commit is contained in:
parent
a2f23ee5ae
commit
3607bdc77d
@ -1,4 +1,4 @@
|
||||
import React, { useState,useEffect } from "react";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import moment from "moment";
|
||||
import Avatar from "../common/Avatar";
|
||||
import { convertShortTime } from "../../utils/dateUtils";
|
||||
@ -32,7 +32,7 @@ const Attendance = ({ attendance, getRole, handleModalData }) => {
|
||||
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
filteredData,
|
||||
5
|
||||
10
|
||||
);
|
||||
return (
|
||||
<>
|
||||
@ -116,7 +116,7 @@ const Attendance = ({ attendance, getRole, handleModalData }) => {
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
{!attendance && (
|
||||
{!attendance && (
|
||||
<span>No employees assigned to the project</span>
|
||||
)}
|
||||
</tbody>
|
||||
|
||||
@ -66,7 +66,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
const currentDate = new Date().toLocaleDateString("en-CA");
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
sortedFinalList,
|
||||
5
|
||||
10
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@ -86,8 +86,8 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
const attendanceDate = [
|
||||
...new Set(sortedFinalList.map((item) => item.checkInTime.split("T")[0])),
|
||||
].sort((a, b) => new Date(b) - new Date(a));
|
||||
if(attendanceDate != dates){
|
||||
setDates(attendanceDate);
|
||||
if (attendanceDate != dates) {
|
||||
setDates(attendanceDate);
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
@ -134,11 +134,15 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
{dates.map((date, i) => {
|
||||
return (
|
||||
<React.Fragment key={i}>
|
||||
{currentItems.some(item => item.checkInTime.split("T")[0] === date) && <tr className="table-row-header">
|
||||
<td colSpan={7} className="text-start">
|
||||
<strong>{date}</strong>
|
||||
</td>
|
||||
</tr>}
|
||||
{currentItems.some(
|
||||
(item) => item.checkInTime.split("T")[0] === date
|
||||
) && (
|
||||
<tr className="table-row-header">
|
||||
<td colSpan={7} className="text-start">
|
||||
<strong>{date}</strong>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{currentItems
|
||||
?.filter((item) => item.checkInTime.includes(date))
|
||||
.map((attendance, index) => (
|
||||
|
||||
@ -23,11 +23,11 @@ const Regularization = ({ handleRequest }) => {
|
||||
return nameA.localeCompare(nameB);
|
||||
};
|
||||
|
||||
const filteredData = regularizesList.sort(sortByName)
|
||||
|
||||
const filteredData = regularizesList.sort(sortByName);
|
||||
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
filteredData,
|
||||
5
|
||||
10
|
||||
);
|
||||
|
||||
return (
|
||||
@ -94,50 +94,46 @@ const Regularization = ({ handleRequest }) => {
|
||||
</tbody>
|
||||
</table>
|
||||
{!loading && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === 1 ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
)}
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -70,7 +70,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
const currentDate = new Date().toLocaleDateString("en-CA");
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
sortedFinalList,
|
||||
5
|
||||
10
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@ -84,7 +84,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
})
|
||||
);
|
||||
}
|
||||
}, [dateRange, employee,isRefreshing]);
|
||||
}, [dateRange, employee, isRefreshing]);
|
||||
|
||||
const openModal = (id) => {
|
||||
setAttendanecId(id);
|
||||
@ -132,20 +132,18 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
<i
|
||||
className={`bx bx-refresh cursor-pointer fs-4 ${
|
||||
loading ? "spin" : ""
|
||||
}`}
|
||||
data-toggle="tooltip"
|
||||
}`}
|
||||
data-toggle="tooltip"
|
||||
title="Refresh"
|
||||
onClick={() => setIsRefreshing(!isRefreshing)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-responsive text-nowrap">
|
||||
{(!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 ) && (
|
||||
{!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>
|
||||
@ -165,7 +163,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{currentItems?.map( ( attendance, index ) => (
|
||||
{currentItems?.map((attendance, index) => (
|
||||
<tr key={index}>
|
||||
<td colSpan={2}>
|
||||
<div className="d-flex justify-content-start align-items-center">
|
||||
@ -184,12 +182,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>
|
||||
|
||||
@ -200,18 +198,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>
|
||||
) }
|
||||
)}
|
||||
</div>
|
||||
{(!loading && data.length > 5) && (
|
||||
{!loading && data.length > 5 && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user