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

This commit is contained in:
Kartik sharma 2025-07-08 12:45:48 +05:30 committed by pramod mahajan
parent b1c0773c33
commit f7e66ce28f

View File

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