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

Merge pull request 'Excessive space between Organization dropdown and Search bar in Attendance menu.' (#484) from Kartik_Bug#1499 into Issues_Oct_main_2W

Browse Source 
Reviewed-on: #484
Merged
This commit is contained in:
pramod.mahajan 2025-10-15 12:37:16 +00:00
commit 8460460caf
8 changed files with 317 additions and 345 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
src/components/Activities/Attendance.jsx
View File

@ -223,50 +223,6 @@ const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizat
)} )}
</tbody> </tbody>
</table> </table>
{!loading && finalFilteredData.length > ITEMS_PER_PAGE && (
<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)}
>
&laquo;
</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)}
>
&raquo;
</button>
</li>
</ul>
</nav>
)}
</> </>
) : ( ) : (
<div <div
@ -281,6 +237,48 @@ const Attendance = ({ getRole, handleModalData, searchTerm, projectId, organizat
</div> </div>
)} )}
</div> </div>
{!loading && finalFilteredData.length > ITEMS_PER_PAGE && (
<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)}
>
&laquo;
</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)}
>
&raquo;
</button>
</li>
</ul>
</nav>
)}
</> </>
); );
}; };

18
src/components/Activities/AttendcesLogs.jsx
View File

@ -15,6 +15,7 @@ import AttendanceRepository from "../../repositories/AttendanceRepository";
import { useAttendancesLogs } from "../../hooks/useAttendance"; import { useAttendancesLogs } from "../../hooks/useAttendance";
import { queryClient } from "../../layouts/AuthLayout"; import { queryClient } from "../../layouts/AuthLayout";
import { ITEMS_PER_PAGE } from "../../utils/constants"; import { ITEMS_PER_PAGE } from "../../utils/constants";
import { useNavigate } from "react-router-dom";
const usePagination = (data, itemsPerPage) => { const usePagination = (data, itemsPerPage) => {
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
@ -44,6 +45,7 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [showPending, setShowPending] = useState(false); const [showPending, setShowPending] = useState(false);
const [isRefreshing, setIsRefreshing] = useState(false); const [isRefreshing, setIsRefreshing] = useState(false);
const navigate = useNavigate();
const today = new Date(); const today = new Date();
today.setHours(0, 0, 0, 0); today.setHours(0, 0, 0, 0);
@ -172,15 +174,15 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
return ( return (
<> <>
<div <div
className="dataTables_length text-start py-2 d-flex justify-content-between " className="dataTables_length text-start py-2 d-flex flex-wrap justify-content-between"
id="DataTables_Table_0_length" id="DataTables_Table_0_length"
> >
<div className="d-flex align-items-center my-0 "> <div className="d-flex flex-wrap align-items-center my-0 gap-2">
<DateRangePicker <DateRangePicker
onRangeChange={setDateRange} onRangeChange={setDateRange}
defaultStartDate={yesterday} defaultStartDate={yesterday}
/> />
<div className="form-check form-switch text-start ms-1 ms-md-2 align-items-center mb-0"> <div className="form-check form-switch text-start d-flex align-items-center mb-0">
<input <input
type="checkbox" type="checkbox"
className="form-check-input" className="form-check-input"
@ -190,10 +192,11 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
checked={showPending} checked={showPending}
onChange={(e) => setShowPending(e.target.checked)} onChange={(e) => setShowPending(e.target.checked)}
/> />
<label className="form-check-label ms-0">Pending Attendance</label> <label className="form-check-label ms-2 mb-0">Pending Attendance</label>
</div> </div>
</div> </div>
</div> </div>
<div <div
className="table-responsive text-nowrap" className="table-responsive text-nowrap"
style={{ minHeight: "200px" }} style={{ minHeight: "200px" }}
@ -260,7 +263,12 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
lastName={attendance.lastName} lastName={attendance.lastName}
/> />
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<a href="#" className="text-heading text-truncate"> <a
onClick={() =>
navigate(`/employee/${attendance.employeeId}?for=attendance`)
}
className="text-heading text-truncate cursor-pointer"
>
<span className="fw-normal"> <span className="fw-normal">
{attendance.firstName} {attendance.lastName} {attendance.firstName} {attendance.lastName}
</span> </span>

226
src/components/Activities/Regularization.jsx
View File

@ -14,6 +14,7 @@ import {
} from "../../slices/apiDataManager"; } from "../../slices/apiDataManager";
import { useQueryClient } from "@tanstack/react-query"; import { useQueryClient } from "@tanstack/react-query";
import Pagination from "../../components/common/Pagination"; import Pagination from "../../components/common/Pagination";
import { useNavigate } from "react-router-dom";
const Regularization = ({ const Regularization = ({
handleRequest, handleRequest,
@ -26,6 +27,7 @@ const Regularization = ({
// var selectedProject = useSelector((store) => store.localVariables.projectId); // var selectedProject = useSelector((store) => store.localVariables.projectId);
const selectedProject = useSelectedProject(); const selectedProject = useSelectedProject();
const [regularizesList, setregularizedList] = useState([]); const [regularizesList, setregularizedList] = useState([]);
const navigate = useNavigate();
const { regularizes, loading, error, refetch } = useRegularizationRequests( const { regularizes, loading, error, refetch } = useRegularizationRequests(
selectedProject, selectedProject,
organizationId, organizationId,
@ -33,9 +35,9 @@ const Regularization = ({
); );
useEffect(() => { useEffect(() => {
if(!regularizes) return if (!regularizes) return
if(regularizes?.length) { if (regularizes?.length) {
setregularizedList(regularizes); setregularizedList(regularizes);
} }
}, [regularizes]); }, [regularizes]);
@ -102,141 +104,106 @@ const Regularization = ({
}, [employeeHandler]); }, [employeeHandler]);
return ( return (
<div <div>
className="table-responsive text-nowrap pb-4" <div
style={{ minHeight: "200px" }} className="table-responsive pt-3 text-nowrap pb-4"
> style={{ minHeight: "200px" }}
{loading ? ( >
<div {loading ? (
className="d-flex justify-content-center align-items-center" <div
style={{ height: "200px" }} className="d-flex justify-content-center align-items-center"
> style={{ height: "200px" }}
<p className="text-secondary">Loading...</p> >
</div> <p className="text-secondary">Loading...</p>
) : currentItems?.length > 0 ? ( </div>
<table className="table mb-0"> ) : currentItems?.length > 0 ? (
<thead> <table className="table mb-0">
<tr> <thead>
<th colSpan={2}>Name</th> <tr>
<th>Date</th> <th colSpan={2}>Name</th>
<th>Organization</th> <th>Date</th>
<th> <th>Organization</th>
<i className="bx bxs-down-arrow-alt text-success"></i>Check-In <th>
</th> <i className="bx bxs-down-arrow-alt text-success"></i>Check-In
<th> </th>
<i className="bx bxs-up-arrow-alt text-danger"></i>Check-Out <th>
</th> <i className="bx bxs-up-arrow-alt text-danger"></i>Check-Out
<th colSpan={2}> </th>
Requested By <th colSpan={2}>
</th> Requested By
<th > </th>
Requested At <th >
</th> Requested At
<th>Action</th> </th>
</tr> <th>Action</th>
</thead> </tr>
<tbody> </thead>
{currentItems?.map((att, index) => ( <tbody>
<tr key={index}> {currentItems?.map((att, index) => (
<td colSpan={2}> <tr key={index}>
<div className="d-flex justify-content-start align-items-center"> <td colSpan={2}>
<Avatar firstName={att.firstName} lastName={att.lastName} /> <div className="d-flex justify-content-start align-items-center">
<div className="d-flex flex-column"> <Avatar firstName={att.firstName} lastName={att.lastName} />
<a href="#" className="text-heading text-truncate"> <div className="d-flex flex-column"> <a
onClick={() =>
navigate(`/employee/${att.employeeId}?for=attendance`)
}
className="text-heading text-truncate cursor-pointer" >
<span className="fw-normal"> <span className="fw-normal">
{att.firstName} {att.lastName} {att.firstName} {att.lastName}
</span> </span>
</a> </a>
</div>
</div> </div>
</div> </td>
</td> <td>{moment(att.checkOutTime).format("DD-MMM-YYYY")}</td>
<td>{moment(att.checkOutTime).format("DD-MMM-YYYY")}</td>
<td>{att.organizationName || "--"}</td> <td>{att.organizationName || "--"}</td>
<td>{convertShortTime(att.checkInTime)}</td> <td>{convertShortTime(att.checkInTime)}</td>
<td>
{att.requestedAt ? convertShortTime(att.checkOutTime) : "--"}
</td>
<td colSpan={2}>
{att.requestedBy ? ( <div className="d-flex justify-content-start align-items-center">
<Avatar firstName={att?.requestedBy?.firstName} lastName={att?.requestedBy?.lastName} />
<div className="d-flex flex-column">
<a href="#" className="text-heading text-truncate">
<span className="fw-normal">
{att?.requestedBy?.firstName} {att?.requestedBy?.lastName}
</span>
</a>
</div>
</div>):(<small>--</small>)}
</td>
<td> <td>
{att?.requestedAt ? formatUTCToLocalTime(att.requestedAt,true) : "--"} {att.requestedAt ? convertShortTime(att.checkOutTime) : "--"}
</td> </td>
<td className="text-center ">
<RegularizationActions
attendanceData={att}
handleRequest={handleRequest}
refresh={refetch}
/>
</td>
</tr>
))}
</tbody>
</table>
) : (
<div
className="d-flex justify-content-center align-items-center"
style={{ height: "200px" }}
>
<span className="text-secondary">
{searchTerm
? "No results found for your search."
: "No Requests Found !"}
</span>
</div>
)}
{/* {!loading && totalPages > 1 && (
<nav aria-label="Page ">
<ul className="pagination pagination-sm justify-content-end py-1 mt-3">
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
<button
className="page-link btn-xs"
onClick={() => paginate(currentPage - 1)}
>
&laquo;
</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)}
>
&raquo;
</button>
</li>
</ul>
</nav>
)} */}
<td colSpan={2}>
{att.requestedBy ? (<div className="d-flex justify-content-start align-items-center">
<Avatar firstName={att?.requestedBy?.firstName} lastName={att?.requestedBy?.lastName} />
<div className="d-flex flex-column">
<a href="#" className="text-heading text-truncate">
<span className="fw-normal">
{att?.requestedBy?.firstName} {att?.requestedBy?.lastName}
</span>
</a>
</div>
</div>) : (<small>--</small>)}
</td>
<td>
{att?.requestedAt ? formatUTCToLocalTime(att.requestedAt, true) : "--"}
</td>
<td className="text-center ">
<RegularizationActions
attendanceData={att}
handleRequest={handleRequest}
refresh={refetch}
/>
</td>
</tr>
))}
</tbody>
</table>
) : (
<div
className="d-flex justify-content-center align-items-center"
style={{ height: "200px" }}
>
<span className="text-secondary">
{searchTerm
? "No results found for your search."
: "No Requests Found !"}
</span>
</div>
)}
</div>
{totalPages > 0 && ( {totalPages > 0 && (
<Pagination <Pagination
currentPage={currentPage} currentPage={currentPage}
@ -244,6 +211,7 @@ const Regularization = ({
onPageChange={paginate} onPageChange={paginate}
/> />
)} )}
</div> </div>
); );
}; };

203
src/components/DailyProgressRport/TaskReportList.jsx
View File

@ -29,7 +29,7 @@ const TaskReportList = () => {
const ApprovedTaskRights = useHasUserPermission(APPROVE_TASK); const ApprovedTaskRights = useHasUserPermission(APPROVE_TASK);
const ReportTaskRights = useHasUserPermission(ASSIGN_REPORT_TASK); const ReportTaskRights = useHasUserPermission(ASSIGN_REPORT_TASK);
const { service, openModal, closeModal,filter } = useDailyProgrssContext(); const { service, openModal, closeModal, filter } = useDailyProgrssContext();
const selectedProject = useSelectedProject(); const selectedProject = useSelectedProject();
const { projectNames } = useProjectName(); const { projectNames } = useProjectName();
@ -37,7 +37,7 @@ const TaskReportList = () => {
selectedProject, selectedProject,
ITEMS_PER_PAGE, ITEMS_PER_PAGE,
currentPage, currentPage,
service,filter service, filter
); );
const ProgrssReportColumn = [ const ProgrssReportColumn = [
@ -192,109 +192,114 @@ const TaskReportList = () => {
if (isLoading) return <TaskReportListSkeleton />; if (isLoading) return <TaskReportListSkeleton />;
if (isError) return <div>Loading....</div>; if (isError) return <div>Loading....</div>;
return ( return (
<div className="mt-2 table-responsive text-nowrap"> <div>
<table className="table"> <div className="mt-2 table-responsive text-nowrap">
<thead> <table className="table">
<tr> <thead>
<th className="text-start">Activity</th>
<th>
<span>
Total Pending{" "}
<HoverPopup
title="Total Pending Task"
content={<p>This shows the total pending tasks for each activity on that date.</p>}
>
<i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
</HoverPopup>
</span>
</th>
<th>
<span>
Reported/Planned{" "}
<HoverPopup
title="Reported and Planned Task"
content={<p>This shows the reported versus planned tasks for each activity on that date.</p>}
>
<i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
</HoverPopup>
</span>
</th>
<th>Assign Date</th>
<th>Team</th>
<th className="text-center">Actions</th>
</tr>
</thead>
<tbody>
{groupedTasks.length === 0 && (
<tr> <tr>
<td colSpan={6} className="text-center align-middle" style={{ height: "200px", borderBottom: "none" }}> <th className="text-start">Activity</th>
No reports available <th>
</td> <span>
Total Pending{" "}
<HoverPopup
title="Total Pending Task"
content={<p>This shows the total pending tasks for each activity on that date.</p>}
>
<i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
</HoverPopup>
</span>
</th>
<th>
<span>
Reported/Planned{" "}
<HoverPopup
title="Reported and Planned Task"
content={<p>This shows the reported versus planned tasks for each activity on that date.</p>}
>
<i className="bx bx-xs ms-1 bx-info-circle cursor-pointer"></i>
</HoverPopup>
</span>
</th>
<th>Assign Date</th>
<th>Team</th>
<th className="text-center">Actions</th>
</tr> </tr>
)} </thead>
<tbody>
{groupedTasks.map(({ date, tasks }) => ( {groupedTasks.length === 0 && (
<React.Fragment key={date}> <tr>
<tr className="table-row-header text-start"> <td colSpan={6} className="text-center align-middle" style={{ height: "200px", borderBottom: "none" }}>
<td colSpan={6}> No reports available
<strong>{formatUTCToLocalTime(date)}</strong>
</td> </td>
</tr> </tr>
{tasks.map((task, idx) => ( )}
<tr key={task.id || idx}>
<td className="flex-wrap text-start"> {groupedTasks.map(({ date, tasks }) => (
<div> <React.Fragment key={date}>
{task.workItem.activityMaster?.activityName || "No Activity Name"} <tr className="table-row-header text-start">
</div> <td colSpan={6}>
<div className="text-sm py-2"> <strong>{formatUTCToLocalTime(date)}</strong>
{task.workItem.workArea?.floor?.building?.name} ›{" "}
{task.workItem.workArea?.floor?.floorName} ›{" "}
{task.workItem.workArea?.areaName}
</div>
</td>
<td>
{formatNumber(task.workItem.plannedWork)}
</td>
<td>{`${formatNumber(task.completedTask)} / ${formatNumber(task.plannedTask)}`}</td>
<td>{formatUTCToLocalTime(task.assignmentDate)}</td>
<td className="text-center">{renderTeamMembers(task, idx)}</td>
<td className="text-center">
<div className="d-flex justify-content-end gap-2">
{ReportTaskRights && !task.reportedDate && (
<button className="btn btn-xs btn-primary" onClick={() => openModal("report", task)}>
Report
</button>
)}
{ApprovedTaskRights && task.reportedDate && !task.approvedBy && (
<button
className="btn btn-xs btn-warning"
onClick={() => openModal("comments", { task, isActionAllow: true })}
>
QC
</button>
)}
<button
className="btn btn-xs btn-primary"
onClick={() => openModal("comments", { task, isActionAllow: false })}
>
Comment
</button>
</div>
</td> </td>
</tr> </tr>
))} {tasks.map((task, idx) => (
</React.Fragment> <tr key={task.id || idx}>
))} <td className="flex-wrap text-start">
</tbody> <div>
</table> {task.workItem.activityMaster?.activityName || "No Activity Name"}
{data?.data?.length > 0 && ( </div>
<Pagination <div className="text-sm py-2">
currentPage={currentPage} {task.workItem.workArea?.floor?.building?.name} ›{" "}
totalPages={data.totalPages} {task.workItem.workArea?.floor?.floorName} ›{" "}
onPageChange={paginate} {task.workItem.workArea?.areaName}
/> </div>
)} </td>
</div> <td>
{formatNumber(task.workItem.plannedWork)}
</td>
<td>{`${formatNumber(task.completedTask)} / ${formatNumber(task.plannedTask)}`}</td>
<td>{formatUTCToLocalTime(task.assignmentDate)}</td>
<td className="text-center">{renderTeamMembers(task, idx)}</td>
<td className="text-center">
<div className="d-flex justify-content-end gap-2">
{ReportTaskRights && !task.reportedDate && (
<button className="btn btn-xs btn-primary" onClick={() => openModal("report", task)}>
Report
</button>
)}
{ApprovedTaskRights && task.reportedDate && !task.approvedBy && (
<button
className="btn btn-xs btn-warning"
onClick={() => openModal("comments", { task, isActionAllow: true })}
>
QC
</button>
)}
<button
className="btn btn-xs btn-primary"
onClick={() => openModal("comments", { task, isActionAllow: false })}
>
Comment
</button>
</div>
</td>
</tr>
))}
</React.Fragment>
))}
</tbody>
</table>
</div>
{
data?.data?.length > 0 && (
<Pagination
currentPage={currentPage}
totalPages={data.totalPages}
onPageChange={paginate}
/>
)
}
</div >
); );
}; };

13
src/components/Directory/ListViewContact.jsx
View File

@ -160,8 +160,7 @@ const ListViewContact = ({ data, Pagination }) => {
</div> </div>
) : ( ) : (
<i <i
className={`bx ${ className={`bx ${isPending && activeContact === row.id
isPending && activeContact === row.id
? "bx-loader-alt bx-spin" ? "bx-loader-alt bx-spin"
: "bx-recycle" : "bx-recycle"
} me-1 text-primary cursor-pointer`} } me-1 text-primary cursor-pointer`}
@ -188,13 +187,13 @@ const ListViewContact = ({ data, Pagination }) => {
)} )}
</tbody> </tbody>
</table> </table>
{Pagination && (
<div className="d-flex justify-content-start">
{Pagination}
</div>
)}
</div> </div>
</div> </div>
{Pagination && (
<div className="d-flex justify-content-start">
{Pagination}
</div>
)}
</div> </div>
</> </>
); );

39
src/components/Expenses/ExpenseList.jsx
View File

@ -15,6 +15,7 @@ import { ExpenseTableSkeleton } from "./ExpenseSkeleton";
import ConfirmModal from "../common/ConfirmModal"; import ConfirmModal from "../common/ConfirmModal";
import { useHasUserPermission } from "../../hooks/useHasUserPermission"; import { useHasUserPermission } from "../../hooks/useHasUserPermission";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => { const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
const [deletingId, setDeletingId] = useState(null); const [deletingId, setDeletingId] = useState(null);
@ -24,6 +25,7 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
const IsExpesneApprpve = useHasUserPermission(APPROVE_EXPENSE); const IsExpesneApprpve = useHasUserPermission(APPROVE_EXPENSE);
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
const debouncedSearch = useDebounce(searchText, 500); const debouncedSearch = useDebounce(searchText, 500);
const navigate = useNavigate();
const { mutate: DeleteExpense, isPending } = useDeleteExpense(); const { mutate: DeleteExpense, isPending } = useDeleteExpense();
const { data, isLoading, isError, isInitialLoading, error } = useExpenseList( const { data, isLoading, isError, isInitialLoading, error } = useExpenseList(
@ -67,9 +69,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
key = item.status?.displayName || "Unknown"; key = item.status?.displayName || "Unknown";
break; break;
case "submittedBy": case "submittedBy":
key = `${item.createdBy?.firstName ?? ""} ${ key = `${item.createdBy?.firstName ?? ""} ${item.createdBy?.lastName ?? ""
item.createdBy?.lastName ?? "" }`.trim();
}`.trim();
break; break;
case "project": case "project":
key = item.project?.name || "Unknown Project"; key = item.project?.name || "Unknown Project";
@ -110,11 +111,11 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
label: "Submitted By", label: "Submitted By",
align: "text-start", align: "text-start",
getValue: (e) => getValue: (e) =>
`${e.createdBy?.firstName ?? ""} ${ `${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
e.createdBy?.lastName ?? "" }`.trim() || "N/A",
}`.trim() || "N/A",
customRender: (e) => ( customRender: (e) => (
<div className="d-flex align-items-center"> <div className="d-flex align-items-center cursor-pointer"
onClick={() => navigate(`/employee/${e.createdBy?.id}`)}>
<Avatar <Avatar
size="xs" size="xs"
classAvatar="m-0" classAvatar="m-0"
@ -122,9 +123,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
lastName={e.createdBy?.lastName} lastName={e.createdBy?.lastName}
/> />
<span className="text-truncate"> <span className="text-truncate">
{`${e.createdBy?.firstName ?? ""} ${ {`${e.createdBy?.firstName ?? ""} ${e.createdBy?.lastName ?? ""
e.createdBy?.lastName ?? "" }`.trim() || "N/A"}
}`.trim() || "N/A"}
</span> </span>
</div> </div>
), ),
@ -152,9 +152,8 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
align: "text-center", align: "text-center",
getValue: (e) => ( getValue: (e) => (
<span <span
className={`badge bg-label-${ className={`badge bg-label-${getColorNameFromHex(e?.status?.color) || "secondary"
getColorNameFromHex(e?.status?.color) || "secondary" }`}
}`}
> >
{e.status?.name || "Unknown"} {e.status?.name || "Unknown"}
</span> </span>
@ -299,15 +298,15 @@ const ExpenseList = ({ filters, groupBy = "transactionDate", searchText }) => {
)} )}
</tbody> </tbody>
</table> </table>
{data?.data?.length > 0 && (
<Pagination
currentPage={currentPage}
totalPages={data.totalPages}
onPageChange={paginate}
/>
)}
</div> </div>
</div> </div>
{data?.data?.length > 0 && (
<Pagination
currentPage={currentPage}
totalPages={data.totalPages}
onPageChange={paginate}
/>
)}
</div> </div>
</> </>
); );

68
src/pages/Activities/AttendancePage.jsx
View File

@ -179,44 +179,40 @@ const AttendancePage = () => {
</div> </div>
{/* Search + Organization filter */} {/* Search + Organization filter */}
<div className="col-12 col-md-auto mt-2 mt-md-0 ms-md-auto d-flex gap-2 align-items-center"> <div className="col-12 col-md-auto mt-2 mt-md-0 ms-md-auto">
{/* Organization Dropdown */} <div className="row g-2">
<div className="row"> <div className="col-12 col-sm-6">
<div className="col-12 col-sm-6 mb-2 mb-sm-0"> <select
<select className="form-select form-select-sm"
className="form-select form-select-sm" value={appliedFilters.selectedOrganization}
value={appliedFilters.selectedOrganization} onChange={(e) =>
onChange={(e) => setAppliedFilters((prev) => ({
setAppliedFilters((prev) => ({ ...prev,
...prev, selectedOrganization: e.target.value,
selectedOrganization: e.target.value, }))
})) }
} disabled={orgLoading}
disabled={orgLoading} >
> <option value="">All Organizations</option>
<option value="">All Organizations</option> {organizations?.map((org, ind) => (
{organizations?.map((org, ind) => ( <option key={`${org.id}-${ind}`} value={org.id}>
<option key={`${org.id}-${ind}`} value={org.id}> {org.name}
{org.name} </option>
</option> ))}
))} </select>
</select>
</div> </div>
<div className="col-12 col-sm-6"> <div className="col-12 col-sm-6">
{/* Search Input */} <input
<input type="text"
type="text" className="form-control form-control-sm"
className="form-control form-control-sm" placeholder="Search Employee..."
placeholder="Search Employee..." value={searchTerm}
value={searchTerm} onChange={(e) => setSearchTerm(e.target.value)}
onChange={(e) => setSearchTerm(e.target.value)} />
/>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -224,7 +220,7 @@ const AttendancePage = () => {
{selectedProject ? ( {selectedProject ? (
<> <>
{activeTab === "all" && ( {activeTab === "all" && (
<div className="tab-pane fade show active py-0 mx-5"> <div className="tab-pane fade show active py-0 mx-2">
<Attendance <Attendance
handleModalData={handleModalData} handleModalData={handleModalData}
getRole={getRole} getRole={getRole}
@ -234,7 +230,7 @@ const AttendancePage = () => {
</div> </div>
)} )}
{activeTab === "logs" && ( {activeTab === "logs" && (
<div className="tab-pane fade show active py-0"> <div className="tab-pane fade p-3 show active py-0">
<AttendanceLog <AttendanceLog
handleModalData={handleModalData} handleModalData={handleModalData}
searchTerm={searchTerm} searchTerm={searchTerm}
@ -243,7 +239,7 @@ const AttendancePage = () => {
</div> </div>
)} )}
{activeTab === "regularization" && DoRegularized && ( {activeTab === "regularization" && DoRegularized && (
<div className="tab-pane fade show active py-0"> <div className="tab-pane fade p-3 show active py-0">
<Regularization <Regularization
searchTerm={searchTerm} searchTerm={searchTerm}
organizationId={appliedFilters.selectedOrganization} organizationId={appliedFilters.selectedOrganization}

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

@ -649,17 +649,16 @@ const EmployeeList = () => {
</tr> </tr>
))} ))}
</tbody> </tbody>
</table> </table>
</div>
{displayData?.length > 0 && ( </div>
{displayData?.length > 0 && (
<Pagination <Pagination
currentPage={currentPage} currentPage={currentPage}
totalPages={totalPages} totalPages={totalPages}
onPageChange={paginate} onPageChange={paginate}
/> />
)} )}
</div>
</div>
</div> </div>
) : ( ) : (
<div className="card"> <div className="card">