added pading in check-in check-out form

This commit is contained in:
pramod.mahajan 2025-10-10 19:54:20 +05:30
parent c921dbff09
commit bb2d7b8923
3 changed files with 137 additions and 96 deletions

View File

@ -133,9 +133,12 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
useEffect(() => {
if (data?.length) {
filtering(data);
}
}, [data, showPending]);
// New useEffect to handle search filtering
const filteredSearchData = useMemo(() => {
if (!searchTerm) {
@ -148,31 +151,6 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
});
}, [processedData, searchTerm]);
// const filteredSearchData = useMemo(() => {
// let tempData = processedData;
// if (searchTerm) {
// const lowercasedSearchTerm = searchTerm.toLowerCase();
// tempData = tempData.filter((item) => {
// const fullName = `${item.firstName} ${item.lastName}`.toLowerCase();
// return fullName.includes(lowercasedSearchTerm);
// });
// }
// if (filters?.selectedOrganization) {
// tempData = tempData.filter(
// (item) => item.organization?.name === filters.selectedOrganization
// );
// }
// if (filters?.selectedServices?.length > 0) {
// tempData = tempData.filter((item) =>
// filters.selectedServices.includes(item.service?.name)
// );
// }
// return tempData;
// }, [processedData, searchTerm, filters]);
const {

View File

@ -110,8 +110,8 @@ const CheckInCheckOut = ({ modeldata, closeModal, handleSubmitForm }) => {
}, [projectNames, projectId, loading]);
return (
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
<div className="col-12 d-flex justify-content-center">
<form className="row p-2" onSubmit={handleSubmit(onSubmit)}>
<div className="col-12 d-flex justify-content-center mt-2">
<label className="fs-5 text-dark text-center">
{modeldata?.checkInTime && !modeldata?.checkOutTime
? `Check out for ${currentProject?.name}`
@ -220,7 +220,7 @@ export const Regularization = ({ modeldata, closeModal, handleSubmitForm }) => {
};
return (
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
<form className="row " onSubmit={handleSubmit(onSubmit)}>
<div className="col-12 col-md-12">
<p>Regularize Attendance</p>
<label className="form-label" htmlFor="description">

View File

@ -1,4 +1,3 @@
import {
useState,
Suspense,
@ -22,7 +21,13 @@ import ContactProfile from "../../components/Directory/ContactProfile";
import GlobalModel from "../../components/common/GlobalModel";
import ConfirmModal from "../../components/common/ConfirmModal";
import { useSelectedProject } from "../../slices/apiDataManager";
import { exportToCSV, exportToExcel, exportToPDF, exportToPDF1, printTable } from "../../utils/tableExportUtils";
import {
exportToCSV,
exportToExcel,
exportToPDF,
exportToPDF1,
printTable,
} from "../../utils/tableExportUtils";
const NotesPage = lazy(() => import("./NotesPage"));
const ContactsPage = lazy(() => import("./ContactsPage"));
@ -80,10 +85,16 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
exportToPDF1(exportData, "Notes");
} else {
// Columns for Contacts PDF
const columns = ["Email", "Phone", "Organization", "Category", "Tags"];
const columns = [
"Email",
"Phone",
"Organization",
"Category",
"Tags",
];
// Sanitize and trim long text to avoid PDF overflow
const sanitizedData = exportData.map(item => ({
const sanitizedData = exportData.map((item) => ({
Email: (item.Email || "").slice(0, 40),
Phone: (item.Phone || "").slice(0, 20),
Organization: (item.Organization || "").slice(0, 30),
@ -105,7 +116,6 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
}
};
const { data, isLoading, isError, error } = useBucketList();
const handleTabClick = (tab, e) => {
@ -173,7 +183,8 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
<ul className="nav nav-tabs">
<li className="nav-item cursor-pointer">
<a
className={`nav-link ${activeTab === "notes" ? "active" : ""
className={`nav-link ${
activeTab === "notes" ? "active" : ""
} fs-6`}
onClick={(e) => handleTabClick("notes", e)}
>
@ -183,7 +194,8 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
</li>
<li className="nav-item cursor-pointer">
<a
className={`nav-link ${activeTab === "contacts" ? "active" : ""
className={`nav-link ${
activeTab === "contacts" ? "active" : ""
} fs-6`}
onClick={(e) => handleTabClick("contacts", e)}
>
@ -216,16 +228,23 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
value={searchContact}
onChange={(e) => setsearchContact(e.target.value)}
/>
<div className="d-none d-md-flex gap-2">
{" "}
<button
className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
className={`btn btn-sm p-1 ${
gridView
? " btn-primary"
: " btn-outline-primary"
}`}
onClick={() => setGridView(true)}
>
<i className="bx bx-grid-alt"></i>
</button>
<button
className={`btn btn-sm p-1 ${!gridView ? "btn-primary" : "btn-outline-primary"
className={`btn btn-sm p-1 ${
!gridView
? "btn-primary"
: "btn-outline-primary"
}`}
onClick={() => setGridView(false)}
>
@ -233,6 +252,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
</button>
</div>
</div>
</div>
)}
</div>
<div className="dropdown z-2">
@ -246,7 +266,7 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
<i className="bx bx-dots-vertical-rounded text-muted bx-md"></i>
</button>
<ul className="dropdown-menu dropdown-menu-end shadow-sm p-2" style={{ minWidth: "220px" }}>
<ul className="dropdown-menu dropdown-menu-end shadow-sm ">
{activeTab === "contacts" && (
<li className="dropdown-item d-flex align-items-center">
<div className="form-check form-switch mb-0">
@ -256,30 +276,73 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
role="switch"
id="inactiveContactsSwitch"
checked={showActive}
onChange={(e) => setShowActive(e.target.checked)}
onChange={(e) =>
setShowActive(e.target.checked)
}
/>
</div>
<span>{showActive ? "Active Contacts" : "Inactive Contacts"}</span>
<span>
{showActive
? "Active Contacts"
: "Inactive Contacts"}
</span>
</li>
)}
<li>
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("csv")}>
<i className="bx bx-file"></i><span>Export to CSV</span>
<button
className="dropdown-item d-flex align-items-center gap-2"
onClick={() => handleExport("csv")}
>
<i className="bx bx-file"></i>
<span>Export to CSV</span>
</button>
</li>
<li>
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("excel")}>
<i className="bx bx-spreadsheet"></i><span>Export to Excel</span>
<button
className="dropdown-item d-flex align-items-center gap-2"
onClick={() => handleExport("excel")}
>
<i className="bx bx-spreadsheet"></i>
<span>Export to Excel</span>
</button>
</li>
<li>
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("pdf")}>
<i className="bx bxs-file-pdf"></i><span>Export to PDF</span>
<button
className="dropdown-item d-flex align-items-center gap-2"
onClick={() => handleExport("pdf")}
>
<i className="bx bxs-file-pdf"></i>
<span>Export to PDF</span>
</button>
</li>
<li className={`d-block d-md-none ${activeTab === "contacts" ? "d-block":"d-none"}`}>
<span
className={`dropdown-item ${
gridView ? " text-primary" : ""
}`}
onClick={() => setGridView(true)}
>
<i className="bx bx-grid-alt"></i> Card View
</span>
</li>
<li className={` d-block d-md-none ${activeTab === "contacts" ? "d-block":"d-none"}`}>
<span
className={`dropdown-item ${
!gridView ? "text-primary" : ""
}`}
onClick={() => setGridView(false)}
>
<i className="bx bx-list-ul"></i> List View
</span>
</li>
{/* Divider */}
{activeTab === "contacts" && <li><hr className="dropdown-divider" /></li>}
{activeTab === "contacts" && (
<li>
<hr className="dropdown-divider" />
</li>
)}
</ul>
</div>
</div>