- Add project list on emplyee profile

- Add image as per gender
This commit is contained in:
Vikas Nale 2025-08-06 11:55:12 +05:30
parent dd81d873f1
commit bae7cb4890
8 changed files with 55 additions and 16 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 376 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 426 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 364 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 376 KiB

View File

@ -24,12 +24,22 @@ const EmpBanner = ({ profile, loggedInUser }) => {
)} )}
<div className="user-profile-header d-flex flex-column flex-lg-row text-sm-start text-center mb-8"> <div className="user-profile-header d-flex flex-column flex-lg-row text-sm-start text-center mb-8">
<div className="flex-shrink-0 mt-1 mx-sm-0 mx-auto"> <div className="flex-shrink-0 mt-1 mx-sm-0 mx-auto">
<img {profile.gender.toLowerCase() == "male" && (
width={125} <img
src="../../assets/img/avatars/00.jpg" width={125}
alt="user image" src="../../assets/img/avatars/avatar_m_01.png"
className="d-block h-auto ms-0 ms-sm-6 rounded-3 user-profile-img" alt="user image"
/> className="d-block h-auto ms-0 ms-sm-6 rounded-3 user-profile-img"
/>
)}
{profile.gender.toLowerCase() == "female" && (
<img
width={125}
src="../../assets/img/avatars/avatar_f_02.png"
alt="user image"
className="d-block h-auto ms-0 ms-sm-6 rounded-3 user-profile-img"
/>
)}
</div> </div>
<div className="flex-grow-1 mt-1 mt-lg-1"> <div className="flex-grow-1 mt-1 mt-lg-1">
<div className="d-flex align-items-md-end align-items-sm-start align-items-center justify-content-md-between justify-content-start mx-5 flex-md-row flex-column gap-4"> <div className="d-flex align-items-md-end align-items-sm-start align-items-center justify-content-md-between justify-content-start mx-5 flex-md-row flex-column gap-4">

View File

@ -1,26 +1,55 @@
import React from "react"; import React, { useEffect, useState } from "react";
import Avatar from "../common/Avatar";
import EmpOverview from "./EmpOverview"; import EmpOverview from "./EmpOverview";
import { useProjectsByEmployee } from "../../hooks/useProjects";
const EmpDashboard = ({ profile }) => { const EmpDashboard = ({ profile }) => {
const {
projectList,
loading: selectedProjectLoding,
refetch,
} = useProjectsByEmployee(profile?.id);
return ( return (
<> <>
<div className="row"> <div className="row">
<div className="col col-4 pt-5"> <div className="col pt-5">
{" "} {" "}
<EmpOverview profile={profile}></EmpOverview> <EmpOverview profile={profile}></EmpOverview>
</div> </div>
<div className="col col-4 pt-5"> <div className="col pt-5">
<div className="card"> <div className="card">
{" "} {" "}
<div className="card-body"> <div className="card-body">
<small className="card-text text-uppercase text-body-secondary small"> <small className="card-text text-uppercase text-body-secondary small">
My Projects My Projects
</small>{" "} </small>{" "}
<ul className="list-unstyled my-3 py-1">
{selectedProjectLoding && <span>Loading</span>}
{projectList.map((project) => (
<li
className="d-flex mb-6 align-items-center"
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="col-sm-8 col-lg-12 col-xxl-8 mb-1 mb-sm-0 mb-lg-1 mb-xxl-0 text-start">
<h6 className="mb-0">{project.shortName}</h6>
</div>
<div className="col-sm-4 col-lg-12 col-xxl-4 d-flex justify-content-xxl-end">
<div className="label-secondary">{project.name}</div>
</div>
</div>
</li>
))}
</ul>
</div> </div>
</div> </div>
</div> </div>
<div className="col col-4 pt-5"> {/* <div className="col col-4 pt-5">
<div className="card"> <div className="card">
<div className="card-body"> <div className="card-body">
<small className="card-text text-uppercase text-body-secondary small"> <small className="card-text text-uppercase text-body-secondary small">
@ -28,7 +57,7 @@ const EmpDashboard = ({ profile }) => {
</small>{" "} </small>{" "}
</div>{" "} </div>{" "}
</div> </div>
</div> </div> */}
</div> </div>
</> </>
); );

View File

@ -27,9 +27,9 @@ const Header = () => {
const { data, loading } = useMaster(); const { data, loading } = useMaster();
const navigate = useNavigate(); const navigate = useNavigate();
const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT); const HasManageProjectPermission = useHasUserPermission(MANAGE_PROJECT);
{ // {
console.log(location.pathname); // console.log(location.pathname);
} // }
const isDashboardPath = const isDashboardPath =
/^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname); /^\/dashboard$/.test(location.pathname) || /^\/$/.test(location.pathname);

View File

@ -286,7 +286,7 @@ export const useProjectDetails = (projectId, isAuto = true) => {
export const useProjectsByEmployee = (employeeId) => { export const useProjectsByEmployee = (employeeId) => {
const { const {
data: projectNameList = [], data: projectList = [],
isLoading, isLoading,
error, error,
refetch, refetch,