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

optimized EmpDashBoard , EmployeeNav and EmployeeProfile

Browse Source
This commit is contained in:
pramod mahajan 2025-08-12 16:22:34 +05:30
parent 80ede060cb
commit 8117e60bff
3 changed files with 64 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/components/Employee/EmpDashboard.jsx
View File

@ -19,51 +19,55 @@ const EmpDashboard = ({ profile }) => {
</div>
<div className="col col-sm-6 pt-5">
<div className="card ">
<div className="card-body">
<small className="card-text text-uppercase text-body-secondary small">
My Projects
</small>{" "}
<ul className="list-unstyled my-3 py-1">
<ul className="list-unstyled text-start my-3 py-1">
{selectedProjectLoding && <span>Loading</span>}
{projectList.map((project) => (
<li
className="d-flex mb-6 align-items-center"
className="d-flex mb-4 align-items-start flex-wrap"
key={project.id}
>
<div className="avatar flex-shrink-0 me-4">
<span className="avatar-initial rounded bg-label-primary">
<i className="icon-base bx bx-buildings icon-lg "></i>
</span>
</div>
<div className="row w-100 align-items-center">
<div className="d-flex w-100 flex-wrap align-items-center justify-content-between gap-2">
<div className="me-2">
<div className="d-flex align-items-center">
<h6 className="mb-0 me-2">
{/* Project Info */}
<div className="flex-grow-1">
<div className="d-flex flex-wrap align-items-center justify-content-between gap-2">
<div className="d-flex">
<div className="avatar flex-shrink-0 me-3">
<span className="avatar-initial rounded bg-label-primary">
<i className="icon-base bx bx-buildings icon-lg"></i>
</span>
</div>
<div className="d-block">
<h6 className="mb-0 d-block">
{project.projectShortName}
</h6>
<small className="text-muted">
{project.projectName}
</small>
<div className="label-secondary">
Assigned:{" "}
{project.assignedDate ? (
new Date(
project.assignedDate
).toLocaleDateString()
) : (
<em>NA</em>
)}
</div>
</div>
<small>{project.projectName}</small>
</div>
<div className="user-progress">
<div className="badge bg-label-secondary ">
<div>
<span className="badge bg-label-secondary">
{project.designation}
</div>
</span>
</div>
</div>
<div className="col-sm-4 col-lg-12 col-xxl-4 d-flex justify-content-xxl-end mt-1">
<div className="label-secondary">
Assigned:{" "}
{project.assignedDate ? (
new Date(project.assignedDate).toLocaleDateString()
) : (
<em>NA</em>
)}
</div>
</div>
{project.removedDate && (
<div className="col-sm-4 col-lg-12 col-xxl-4 d-flex justify-content-xxl-end mt-1">
{/* Dates */}
<div className="mt-2 d-flex flex-column flex-sm-row gap-3">
{project.removedDate && (
<div className="label-secondary">
Unassigned:{" "}
{project.removedDate ? (
@ -72,8 +76,8 @@ const EmpDashboard = ({ profile }) => {
<em>NA</em>
)}
</div>
</div>
)}
)}
</div>
</div>
</li>
))}

87
src/components/Employee/EmployeeNav.jsx
View File

@ -1,67 +1,36 @@
import React from "react";
const EmployeeNav = ({ onPillClick, activePill }) => {
const tabs = [
{ key: "profile", icon: "bx bx-user", label: "Profile" },
{ key: "attendance", icon: "bx bx-group", label: "Attendances" },
{ key: "documents", icon: "bx bx-user", label: "Documents" },
{ key: "activities", icon: "bx bx-grid-alt", label: "Activities" },
];
return (
<div className="col-md-12">
<div className="nav-align-top ">
<ul className="nav nav-tabs">
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
<a
className={`nav-link py-1 px-2 small ${
activePill === "profile" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("profile");
}}
<div className="nav-align-top">
<ul className="nav nav-tabs overflow-auto" id="horizontal-example">
{tabs.map(({ key, icon, label }) => (
<li
key={key}
className="nav-item"
style={{ padding: "10px 10px 0 10px" }}
>
<i className="icon-base bx bx-user icon-sm me-1_5"></i> Profile
</a>
</li>
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
<a
className={`nav-link py-1 px-2 small ${
activePill === "attendance" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("attendance");
}}
>
<i className="bx bx-group bx-sm me-1_5"></i> Attendances
</a>
</li>
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
<a
className={`nav-link py-1 px-2 small ${
activePill === "documents" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("documents");
}}
>
<i className="bx bx-user bx-sm me-1_5"></i> Documents
</a>
</li>
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
<a
className={`nav-link py-1 px-2 small ${
activePill === "activities" ? "active" : ""
}`}
href="#"
onClick={(e) => {
e.preventDefault(); // Prevent page reload
onPillClick("activities");
}}
>
<i className="bx bx-grid-alt bx-sm me-1_5"></i> Activities
</a>
</li>
<a
href="#"
className={`nav-link py-1 px-2 small ${
activePill === key ? "active" : ""
}`}
onClick={(e) => {
e.preventDefault();
onPillClick(key);
}}
>
<i className={`icon-base ${icon} icon-sm me-1_5`}></i> {label}
</a>
</li>
))}
</ul>
</div>
</div>

6
src/pages/employee/EmployeeProfile.jsx
View File

@ -131,11 +131,7 @@ const EmployeeProfile = () => {
</div>
</div>
<div className="row">
<div className="col-12">
<div>
<div className="row row-bordered g-0">{renderContent()}</div>
</div>
</div>
<div className=" ">{renderContent()}</div>
</div>
</div>
</>