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

Increase the size of table in Projects Directory and show text in center and add 200 px height.

Browse Source
This commit is contained in:
Kartik sharma 2025-07-09 16:06:30 +05:30 committed by pramod mahajan
parent eae0669be1
commit c8166114c4
1 changed files with 82 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

143
src/pages/Directory/Directory.jsx
View File

@ -363,75 +363,97 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
</div>
</div>
<div className="card-minHeight mt-0">
{/* Loader when switching between Active/Pending or filtering */}
{loading && (
<div className="d-flex justify-content-center align-items-center py-5">
<div className="spinner-border text-primary" role="status">
<span className="visually-hidden">Loading...</span>
</div>
</div>
)}
{/* Empty state messages */}
{!loading && (viewType === "card" || viewType === "list") && (
<div className="d-flex flex-column justify-content-center align-items-center text-center">
{contacts?.length === 0 && (
<p className="mt-10">No contact found</p>
)}
{contacts?.length > 0 && currentItems.length === 0 && (
<p className="mt-10">No matching contact found</p>
)}
</div>
)}
{/* List View */}
{!loading && viewType === "list" && currentItems.length > 0 && (
<div className="card cursor-pointer mt-5">
<div className="card-body p-2 pb-1">
{/* LIST VIEW */}
{viewType === "list" && (
<div className="card cursor-pointer mt-3">
<div className="card-body p-2 pb-1" style={{ minHeight: "200px" }}>
<DirectoryListTableHeader>
{currentItems.map((contact) => (
<ListViewDirectory
key={contact.id}
IsActive={IsActive}
contact={contact}
setSelectedContact={setSelectedContact}
setIsOpenModal={setIsOpenModal}
setOpen_contact={setOpen_contact}
setIsOpenModalNote={setIsOpenModalNote}
IsDeleted={setDeleteContact}
restore={handleDeleteContact}
/>
))}
{!loading && contacts?.length === 0 ? (
<tr>
<td colSpan="6">
<div
className="d-flex justify-content-center align-items-center"
style={{ height: "150px",marginLeft: "230px" }}
>
<p className="mb-0 text-muted">No contact found</p>
</div>
</td>
</tr>
) : !loading && contacts?.length > 0 && currentItems.length === 0 ? (
<tr>
<td colSpan="6">
<div
className="d-flex justify-content-center align-items-center"
style={{ height: "150px" }}
>
<p className="mb-0 text-muted">No matching contact found</p>
</div>
</td>
</tr>
) : (
!loading &&
currentItems.map((contact) => (
<ListViewDirectory
key={contact.id}
IsActive={IsActive}
contact={contact}
setSelectedContact={setSelectedContact}
setIsOpenModal={setIsOpenModal}
setOpen_contact={setOpen_contact}
setIsOpenModalNote={setIsOpenModalNote}
IsDeleted={setDeleteContact}
restore={handleDeleteContact}
/>
))
)}
</DirectoryListTableHeader>
</div>
</div>
)}
{/* Card View */}
{!loading && viewType === "card" && currentItems.length > 0 && (
<div className="row mt-4">
{currentItems.map((contact) => (
{/* CARD VIEW */}
{viewType === "card" && (
<>
{contacts?.length === 0 && !loading ? (
<div
key={contact.id}
className="col-12 col-sm-6 col-md-4 col-lg-4 mb-4"
className="d-flex justify-content-center align-items-center text-center"
style={{ minHeight: "200px" }}
>
<CardViewDirectory
IsActive={IsActive}
contact={contact}
setSelectedContact={setSelectedContact}
setIsOpenModal={setIsOpenModal}
setOpen_contact={setOpen_contact}
setIsOpenModalNote={setIsOpenModalNote}
IsDeleted={setDeleteContact}
restore={handleDeleteContact}
/>
<p className="text-muted mb-0">No contact found</p>
</div>
))}
</div>
) : currentItems.length === 0 && !loading ? (
<div
className="d-flex justify-content-center align-items-center text-center"
style={{ minHeight: "250px" }}
>
<p className="text-muted mb-0">No matching contact found</p>
</div>
) : (
<div className="row mt-4">
{currentItems.map((contact) => (
<div
key={contact.id}
className="col-12 col-sm-6 col-md-4 col-lg-4 mb-4"
>
<CardViewDirectory
IsActive={IsActive}
contact={contact}
setSelectedContact={setSelectedContact}
setIsOpenModal={setIsOpenModal}
setOpen_contact={setOpen_contact}
setIsOpenModalNote={setIsOpenModalNote}
IsDeleted={setDeleteContact}
restore={handleDeleteContact}
/>
</div>
))}
</div>
)}
</>
)}
{/* Notes View */}
{!loading && viewType === "notes" && (
{/* NOTES VIEW */}
{viewType === "notes" && (
<div className="mt-0">
<NotesCardViewDirectory
notes={notes}
@ -448,7 +470,7 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
{!loading &&
viewType !== "notes" &&
contacts?.length > 0 &&
filteredContacts.length > ITEMS_PER_PAGE && (
currentItems.length > ITEMS_PER_PAGE && (
<nav aria-label="Page navigation">
<ul className="pagination pagination-sm justify-content-end py-1">
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
@ -500,5 +522,4 @@ const Directory = ({ IsPage = true, prefernceContacts }) => {
);
};
export default Directory;
export default Directory;