87 lines
3.3 KiB
JavaScript

import React, { useEffect, useState } from "react";
import EmpOverview from "./EmpOverview";
import { useProjectsAllocationByEmployee } from "../../hooks/useProjects";
const EmpDashboard = ({ profile }) => {
const {
projectList,
loading: selectedProjectLoding,
refetch,
} = useProjectsAllocationByEmployee(profile?.id);
return (
<>
<div className="row">
<div className="col-12 col-sm-6 pt-2">
{" "}
<EmpOverview profile={profile}></EmpOverview>
</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 text-start d-block">
My Projects
</small>
<ul className="list-unstyled text-start my-3 py-1">
{selectedProjectLoding && <span>Loading</span>}
{projectList.map((project) => (
<li
className="d-flex mb-4 align-items-start flex-wrap"
key={project.id}
>
<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 ${project.removedDate ? "bg-label-warning" : "bg-label-success"
}`}
>
<i className="icon-base bx bx-buildings icon-lg"></i>
</span>
</div>
<div>
<h6 className="mb-0">{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>
{project.removedDate && (
<div className="mt-0 d-flex flex-column flex-sm-row justify-content-between">
<div className="label-secondary">
Unassigned:{" "}
{new Date(project.removedDate).toLocaleDateString()}
</div>
</div>
)}
</div>
</div>
<div>
<span className="badge bg-label-secondary">
{project.designation}
</span>
</div>
</div>
</div>
</li>
))}
</ul>
</div>
</div>
</div> */}
</div>
</>
);
};
export default EmpDashboard;