Nevigate to "Projects" Page Should Display Only Message When No Projects Are Assigned.

This commit is contained in:
Kartik sharma 2025-07-09 15:15:53 +05:30 committed by pramod mahajan
parent f7e66ce28f
commit 3f245bf62b

View File

@ -264,139 +264,114 @@ const ProjectList = () => {
)} )}
{listView ? ( {listView ? (
currentItems.length === 0 ? ( <div className="card cursor-pointer">
<div className="text-center text-muted mt-4"> <div className="card-body p-2" style={{ minHeight: "200px" }}>
No projects found. <div className="table-responsive text-nowrap py-2">
</div> <table className="table m-3">
) : ( <thead>
<div className="card cursor-pointer"> <tr>
<div className="card-body p-2"> <th className="text-start" colSpan={5}>
<div className="table-responsive text-nowrap py-2 "> Project Name
<table className="table m-3"> </th>
<thead> <th className="mx-2 text-start">Contact Person</th>
<tr> <th className="mx-2">START DATE</th>
<th className="text-start" colSpan={5}> <th className="mx-2">DEADLINE</th>
Project Name <th className="mx-2">Task</th>
</th> <th className="mx-2">Progress</th>
<th className="mx-2 text-start">Contact Person</th> <th className="mx-2">
<th className="mx-2">START DATE</th> <div className="dropdown">
<th className="mx-2">DEADLINE</th> <a
<th className="mx-2">Task</th> className="dropdown-toggle hide-arrow cursor-pointer"
<th className="mx-2">Progress</th> data-bs-toggle="dropdown"
<th className="mx-2"> aria-expanded="false"
<div className="dropdown"> >
<a Status <i className="bx bx-filter bx-sm"></i>
className="dropdown-toggle hide-arrow cursor-pointer" </a>
data-bs-toggle="dropdown" <ul className="dropdown-menu p-2 text-capitalize">
aria-expanded="false" {[
> {
Status <i className="bx bx-filter bx-sm"></i> id: "b74da4c2-d07e-46f2-9919-e75e49b12731",
</a> label: "Active",
<ul className="dropdown-menu p-2 text-capitalize"> },
{[ {
{ id: "603e994b-a27f-4e5d-a251-f3d69b0498ba",
id: "b74da4c2-d07e-46f2-9919-e75e49b12731", label: "On Hold",
label: "Active", },
}, {
{ id: "ef1c356e-0fe0-42df-a5d3-8daee355492d",
id: "603e994b-a27f-4e5d-a251-f3d69b0498ba", label: "Inactive",
label: "On Hold", },
}, {
{ id: "33deaef9-9af1-4f2a-b443-681ea0d04f81",
id: "ef1c356e-0fe0-42df-a5d3-8daee355492d", label: "Completed",
label: "Inactive", },
}, ].map(({ id, label }) => (
{ <li key={id}>
id: "33deaef9-9af1-4f2a-b443-681ea0d04f81", <div className="form-check">
label: "Completed", <input
}, className="form-check-input"
].map(({ id, label }) => ( type="checkbox"
<li key={id}> checked={selectedStatuses.includes(id)}
<div className="form-check"> onChange={() => handleStatusChange(id)}
<input />
className="form-check-input" <label className="form-check-label">{label}</label>
type="checkbox" </div>
checked={selectedStatuses.includes(id)} </li>
onChange={() => handleStatusChange(id)} ))}
/> </ul>
<label className="form-check-label">{label}</label>
</div>
</li>
))}
</ul>
</div>
</th>
<th
className={`mx-2 ${HasManageProject ? "d-sm-table-cell" : "d-none"
}`}
>
Action
</th>
</tr>
</thead>
<tbody className="table-border-bottom-0 overflow-auto">
{currentItems.map((project) => (
<ProjectListView
key={project.id}
projectData={project}
recall={sortingProject}
/>
))}
</tbody>
</table>
</div> </div>
</div> </th>
</div> <th
) className={`mx-2 ${
) : ( HasManageProject ? "d-sm-table-cell" : "d-none"
<div className="row"> }`}
{currentItems.map((project) => ( >
<ProjectCard Action
key={project.id} </th>
projectData={project} </tr>
recall={sortingProject} </thead>
/> <tbody className="table-border-bottom-0" style={{ height: "200px" }}>
))} {currentItems.length === 0 ? (
</div> <tr>
)} <td
colSpan="12"
className="text-center"
{!loading && totalPages > 1 && ( style={{
<nav> verticalAlign: "middle",
<ul className="pagination pagination-sm justify-content-end py-2"> height: "200px",
<li className={`page-item ${currentPage === 1 && "disabled"}`}> paddingTop: 0,
<button paddingBottom: 0,
className="page-link" }}
onClick={() => setCurrentPage((p) => Math.max(1, p - 1))} >
> <div className="d-flex flex-column justify-content-center align-items-center h-100">
&laquo; <p className="mb-0">No projects found</p>
</button> </div>
</li> </td>
{[...Array(totalPages)].map((_, i) => ( </tr>
<li ) : (
key={i} currentItems.map((project) => (
className={`page-item ${currentPage === i + 1 && "active"}`} <ProjectListView
> key={project.id}
<button projectData={project}
className="page-link" recall={sortingProject}
onClick={() => setCurrentPage(i + 1)} />
> ))
{i + 1} )}
</button> </tbody>
</li> </table>
))} </div>
<li className={`page-item ${currentPage === totalPages && "disabled"}`}> </div>
<button </div>
className="page-link" ) : (
onClick={() => <div className="row">
setCurrentPage((p) => Math.min(totalPages, p + 1)) {currentItems.map((project) => (
} <ProjectCard
> key={project.id}
&raquo; projectData={project}
</button> recall={sortingProject}
</li> />
</ul> ))}
</nav> </div>
)} )}
{!loading && totalPages > 1 && ( {!loading && totalPages > 1 && (