added pading in check-in check-out form
This commit is contained in:
parent
c921dbff09
commit
bb2d7b8923
@ -132,9 +132,12 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
|
||||
}, [showPending]);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
useEffect(() => {
|
||||
if (data?.length) {
|
||||
filtering(data);
|
||||
}, [data, showPending]);
|
||||
}
|
||||
}, [data, showPending]);
|
||||
|
||||
|
||||
// New useEffect to handle search filtering
|
||||
const filteredSearchData = useMemo(() => {
|
||||
@ -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 {
|
||||
|
||||
@ -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">
|
||||
|
||||
@ -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"));
|
||||
@ -65,46 +70,51 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
||||
const [ContactData, setContactData] = useState([]);
|
||||
|
||||
const handleExport = (type) => {
|
||||
let exportData = activeTab === "notes" ? notesData : ContactData;
|
||||
if (!exportData?.length) return;
|
||||
let exportData = activeTab === "notes" ? notesData : ContactData;
|
||||
if (!exportData?.length) return;
|
||||
|
||||
switch (type) {
|
||||
case "csv":
|
||||
exportToCSV(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||
break;
|
||||
case "excel":
|
||||
exportToExcel(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||
break;
|
||||
case "pdf":
|
||||
if (activeTab === "notes") {
|
||||
exportToPDF1(exportData, "Notes");
|
||||
} else {
|
||||
// Columns for Contacts PDF
|
||||
const columns = ["Email", "Phone", "Organization", "Category", "Tags"];
|
||||
switch (type) {
|
||||
case "csv":
|
||||
exportToCSV(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||
break;
|
||||
case "excel":
|
||||
exportToExcel(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||
break;
|
||||
case "pdf":
|
||||
if (activeTab === "notes") {
|
||||
exportToPDF1(exportData, "Notes");
|
||||
} else {
|
||||
// Columns for Contacts PDF
|
||||
const columns = [
|
||||
"Email",
|
||||
"Phone",
|
||||
"Organization",
|
||||
"Category",
|
||||
"Tags",
|
||||
];
|
||||
|
||||
// Sanitize and trim long text to avoid PDF overflow
|
||||
const sanitizedData = exportData.map(item => ({
|
||||
Email: (item.Email || "").slice(0, 40),
|
||||
Phone: (item.Phone || "").slice(0, 20),
|
||||
Organization: (item.Organization || "").slice(0, 30),
|
||||
Category: (item.Category || "").slice(0, 20),
|
||||
Tags: (item.Tags || "").slice(0, 40),
|
||||
}));
|
||||
|
||||
// Export with proper spacing
|
||||
exportToPDF(sanitizedData, "Contacts", columns, {
|
||||
columnWidths: [200, 120, 180, 120, 200], // Adjust widths per column
|
||||
fontSizeHeader: 12,
|
||||
fontSizeRow: 10,
|
||||
rowHeight: 25,
|
||||
});
|
||||
}
|
||||
break;
|
||||
default:
|
||||
console.warn("Unsupported export type");
|
||||
}
|
||||
};
|
||||
// Sanitize and trim long text to avoid PDF overflow
|
||||
const sanitizedData = exportData.map((item) => ({
|
||||
Email: (item.Email || "").slice(0, 40),
|
||||
Phone: (item.Phone || "").slice(0, 20),
|
||||
Organization: (item.Organization || "").slice(0, 30),
|
||||
Category: (item.Category || "").slice(0, 20),
|
||||
Tags: (item.Tags || "").slice(0, 40),
|
||||
}));
|
||||
|
||||
// Export with proper spacing
|
||||
exportToPDF(sanitizedData, "Contacts", columns, {
|
||||
columnWidths: [200, 120, 180, 120, 200], // Adjust widths per column
|
||||
fontSizeHeader: 12,
|
||||
fontSizeRow: 10,
|
||||
rowHeight: 25,
|
||||
});
|
||||
}
|
||||
break;
|
||||
default:
|
||||
console.warn("Unsupported export type");
|
||||
}
|
||||
};
|
||||
|
||||
const { data, isLoading, isError, error } = useBucketList();
|
||||
|
||||
@ -173,8 +183,9 @@ 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" : ""
|
||||
} fs-6`}
|
||||
className={`nav-link ${
|
||||
activeTab === "notes" ? "active" : ""
|
||||
} fs-6`}
|
||||
onClick={(e) => handleTabClick("notes", e)}
|
||||
>
|
||||
<i className="bx bx-notepad bx-sm me-1_5"></i>
|
||||
@ -183,8 +194,9 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
||||
</li>
|
||||
<li className="nav-item cursor-pointer">
|
||||
<a
|
||||
className={`nav-link ${activeTab === "contacts" ? "active" : ""
|
||||
} fs-6`}
|
||||
className={`nav-link ${
|
||||
activeTab === "contacts" ? "active" : ""
|
||||
} fs-6`}
|
||||
onClick={(e) => handleTabClick("contacts", e)}
|
||||
>
|
||||
<i className="bx bxs-contact bx-sm me-1_5"></i>
|
||||
@ -216,21 +228,29 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
||||
value={searchContact}
|
||||
onChange={(e) => setsearchContact(e.target.value)}
|
||||
/>
|
||||
<button
|
||||
className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
|
||||
<div className="d-none d-md-flex gap-2">
|
||||
{" "}
|
||||
<button
|
||||
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"
|
||||
onClick={() => setGridView(true)}
|
||||
>
|
||||
<i className="bx bx-grid-alt"></i>
|
||||
</button>
|
||||
<button
|
||||
className={`btn btn-sm p-1 ${
|
||||
!gridView
|
||||
? "btn-primary"
|
||||
: "btn-outline-primary"
|
||||
}`}
|
||||
onClick={() => setGridView(false)}
|
||||
>
|
||||
<i className="bx bx-list-ul"></i>
|
||||
</button>
|
||||
onClick={() => setGridView(false)}
|
||||
>
|
||||
<i className="bx bx-list-ul"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@ -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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user