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]);
|
}, [showPending]);
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (data?.length) {
|
||||||
filtering(data);
|
filtering(data);
|
||||||
}, [data, showPending]);
|
}
|
||||||
|
}, [data, showPending]);
|
||||||
|
|
||||||
|
|
||||||
// New useEffect to handle search filtering
|
// New useEffect to handle search filtering
|
||||||
const filteredSearchData = useMemo(() => {
|
const filteredSearchData = useMemo(() => {
|
||||||
@ -148,31 +151,6 @@ const AttendanceLog = ({ handleModalData, searchTerm, organizationId }) => {
|
|||||||
});
|
});
|
||||||
}, [processedData, searchTerm]);
|
}, [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 {
|
const {
|
||||||
|
|||||||
@ -110,8 +110,8 @@ const CheckInCheckOut = ({ modeldata, closeModal, handleSubmitForm }) => {
|
|||||||
}, [projectNames, projectId, loading]);
|
}, [projectNames, projectId, loading]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
|
<form className="row p-2" onSubmit={handleSubmit(onSubmit)}>
|
||||||
<div className="col-12 d-flex justify-content-center">
|
<div className="col-12 d-flex justify-content-center mt-2">
|
||||||
<label className="fs-5 text-dark text-center">
|
<label className="fs-5 text-dark text-center">
|
||||||
{modeldata?.checkInTime && !modeldata?.checkOutTime
|
{modeldata?.checkInTime && !modeldata?.checkOutTime
|
||||||
? `Check out for ${currentProject?.name}`
|
? `Check out for ${currentProject?.name}`
|
||||||
@ -220,7 +220,7 @@ export const Regularization = ({ modeldata, closeModal, handleSubmitForm }) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
|
<form className="row " onSubmit={handleSubmit(onSubmit)}>
|
||||||
<div className="col-12 col-md-12">
|
<div className="col-12 col-md-12">
|
||||||
<p>Regularize Attendance</p>
|
<p>Regularize Attendance</p>
|
||||||
<label className="form-label" htmlFor="description">
|
<label className="form-label" htmlFor="description">
|
||||||
|
|||||||
@ -1,4 +1,3 @@
|
|||||||
|
|
||||||
import {
|
import {
|
||||||
useState,
|
useState,
|
||||||
Suspense,
|
Suspense,
|
||||||
@ -22,7 +21,13 @@ import ContactProfile from "../../components/Directory/ContactProfile";
|
|||||||
import GlobalModel from "../../components/common/GlobalModel";
|
import GlobalModel from "../../components/common/GlobalModel";
|
||||||
import ConfirmModal from "../../components/common/ConfirmModal";
|
import ConfirmModal from "../../components/common/ConfirmModal";
|
||||||
import { useSelectedProject } from "../../slices/apiDataManager";
|
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 NotesPage = lazy(() => import("./NotesPage"));
|
||||||
const ContactsPage = lazy(() => import("./ContactsPage"));
|
const ContactsPage = lazy(() => import("./ContactsPage"));
|
||||||
@ -65,46 +70,51 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
|||||||
const [ContactData, setContactData] = useState([]);
|
const [ContactData, setContactData] = useState([]);
|
||||||
|
|
||||||
const handleExport = (type) => {
|
const handleExport = (type) => {
|
||||||
let exportData = activeTab === "notes" ? notesData : ContactData;
|
let exportData = activeTab === "notes" ? notesData : ContactData;
|
||||||
if (!exportData?.length) return;
|
if (!exportData?.length) return;
|
||||||
|
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case "csv":
|
case "csv":
|
||||||
exportToCSV(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
exportToCSV(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||||
break;
|
break;
|
||||||
case "excel":
|
case "excel":
|
||||||
exportToExcel(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
exportToExcel(exportData, activeTab === "notes" ? "Notes" : "Contacts");
|
||||||
break;
|
break;
|
||||||
case "pdf":
|
case "pdf":
|
||||||
if (activeTab === "notes") {
|
if (activeTab === "notes") {
|
||||||
exportToPDF1(exportData, "Notes");
|
exportToPDF1(exportData, "Notes");
|
||||||
} else {
|
} else {
|
||||||
// Columns for Contacts PDF
|
// 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
|
// 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),
|
Email: (item.Email || "").slice(0, 40),
|
||||||
Phone: (item.Phone || "").slice(0, 20),
|
Phone: (item.Phone || "").slice(0, 20),
|
||||||
Organization: (item.Organization || "").slice(0, 30),
|
Organization: (item.Organization || "").slice(0, 30),
|
||||||
Category: (item.Category || "").slice(0, 20),
|
Category: (item.Category || "").slice(0, 20),
|
||||||
Tags: (item.Tags || "").slice(0, 40),
|
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");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
|
// 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();
|
const { data, isLoading, isError, error } = useBucketList();
|
||||||
|
|
||||||
@ -173,8 +183,9 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
|||||||
<ul className="nav nav-tabs">
|
<ul className="nav nav-tabs">
|
||||||
<li className="nav-item cursor-pointer">
|
<li className="nav-item cursor-pointer">
|
||||||
<a
|
<a
|
||||||
className={`nav-link ${activeTab === "notes" ? "active" : ""
|
className={`nav-link ${
|
||||||
} fs-6`}
|
activeTab === "notes" ? "active" : ""
|
||||||
|
} fs-6`}
|
||||||
onClick={(e) => handleTabClick("notes", e)}
|
onClick={(e) => handleTabClick("notes", e)}
|
||||||
>
|
>
|
||||||
<i className="bx bx-notepad bx-sm me-1_5"></i>
|
<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>
|
||||||
<li className="nav-item cursor-pointer">
|
<li className="nav-item cursor-pointer">
|
||||||
<a
|
<a
|
||||||
className={`nav-link ${activeTab === "contacts" ? "active" : ""
|
className={`nav-link ${
|
||||||
} fs-6`}
|
activeTab === "contacts" ? "active" : ""
|
||||||
|
} fs-6`}
|
||||||
onClick={(e) => handleTabClick("contacts", e)}
|
onClick={(e) => handleTabClick("contacts", e)}
|
||||||
>
|
>
|
||||||
<i className="bx bxs-contact bx-sm me-1_5"></i>
|
<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}
|
value={searchContact}
|
||||||
onChange={(e) => setsearchContact(e.target.value)}
|
onChange={(e) => setsearchContact(e.target.value)}
|
||||||
/>
|
/>
|
||||||
<button
|
<div className="d-none d-md-flex gap-2">
|
||||||
className={`btn btn-sm p-1 ${gridView ? " btn-primary" : " btn-outline-primary"
|
{" "}
|
||||||
|
<button
|
||||||
|
className={`btn btn-sm p-1 ${
|
||||||
|
gridView
|
||||||
|
? " btn-primary"
|
||||||
|
: " btn-outline-primary"
|
||||||
}`}
|
}`}
|
||||||
onClick={() => setGridView(true)}
|
onClick={() => setGridView(true)}
|
||||||
>
|
>
|
||||||
<i className="bx bx-grid-alt"></i>
|
<i className="bx bx-grid-alt"></i>
|
||||||
</button>
|
</button>
|
||||||
|
<button
|
||||||
<button
|
className={`btn btn-sm p-1 ${
|
||||||
className={`btn btn-sm p-1 ${!gridView ? "btn-primary" : "btn-outline-primary"
|
!gridView
|
||||||
|
? "btn-primary"
|
||||||
|
: "btn-outline-primary"
|
||||||
}`}
|
}`}
|
||||||
onClick={() => setGridView(false)}
|
onClick={() => setGridView(false)}
|
||||||
>
|
>
|
||||||
<i className="bx bx-list-ul"></i>
|
<i className="bx bx-list-ul"></i>
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</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>
|
<i className="bx bx-dots-vertical-rounded text-muted bx-md"></i>
|
||||||
</button>
|
</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" && (
|
{activeTab === "contacts" && (
|
||||||
<li className="dropdown-item d-flex align-items-center">
|
<li className="dropdown-item d-flex align-items-center">
|
||||||
<div className="form-check form-switch mb-0">
|
<div className="form-check form-switch mb-0">
|
||||||
@ -256,30 +276,73 @@ export default function DirectoryPage({ IsPage = true, projectId = null }) {
|
|||||||
role="switch"
|
role="switch"
|
||||||
id="inactiveContactsSwitch"
|
id="inactiveContactsSwitch"
|
||||||
checked={showActive}
|
checked={showActive}
|
||||||
onChange={(e) => setShowActive(e.target.checked)}
|
onChange={(e) =>
|
||||||
|
setShowActive(e.target.checked)
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<span>{showActive ? "Active Contacts" : "Inactive Contacts"}</span>
|
<span>
|
||||||
|
{showActive
|
||||||
|
? "Active Contacts"
|
||||||
|
: "Inactive Contacts"}
|
||||||
|
</span>
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
<li>
|
<li>
|
||||||
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("csv")}>
|
<button
|
||||||
<i className="bx bx-file"></i><span>Export to CSV</span>
|
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>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("excel")}>
|
<button
|
||||||
<i className="bx bx-spreadsheet"></i><span>Export to Excel</span>
|
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>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<button className="dropdown-item d-flex align-items-center gap-2" onClick={() => handleExport("pdf")}>
|
<button
|
||||||
<i className="bx bxs-file-pdf"></i><span>Export to PDF</span>
|
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>
|
</button>
|
||||||
</li>
|
</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 */}
|
{/* Divider */}
|
||||||
{activeTab === "contacts" && <li><hr className="dropdown-divider" /></li>}
|
{activeTab === "contacts" && (
|
||||||
|
<li>
|
||||||
|
<hr className="dropdown-divider" />
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user