96 lines
2.5 KiB
JavaScript
96 lines
2.5 KiB
JavaScript
import React from "react";
|
|
import Avatar from "../../common/Avatar";
|
|
import { formatUTCToLocalTime } from "../../../utils/dateUtils";
|
|
import { useServiceProjectTeam } from "../../../hooks/useServiceProject";
|
|
import { useNavigate, useParams } from "react-router-dom";
|
|
import { SpinnerLoader } from "../../common/Loader";
|
|
|
|
const ServiceProjectTeamList = () => {
|
|
const { projectId } = useParams();
|
|
const { data, isLoading, isError, error } = useServiceProjectTeam(
|
|
projectId,
|
|
true
|
|
);
|
|
|
|
const navigate = useNavigate();
|
|
|
|
const servceProjectColmen = [
|
|
{
|
|
key: "employeName",
|
|
label: "Name",
|
|
getValue: (e) => (
|
|
<div className="d-flex align-items-center cursor-pointer"
|
|
onClick={() => navigate(`/employee/${e.employee.id}`)}>
|
|
{" "}
|
|
<Avatar size="xs"
|
|
firstName={e.employee.firstName}
|
|
lastName={e.employee.lastName}
|
|
/>
|
|
<small>{`${e.employee.firstName} ${e.employee.lastName}`}</small>
|
|
</div>
|
|
),
|
|
align: "text-start",
|
|
},
|
|
{
|
|
key: "teamRole",
|
|
label: "Role",
|
|
getValue: (e) => {
|
|
return (
|
|
<div className="d-flex align-itmes-center">
|
|
<span>{`${e.teamRole.name}`}</span>
|
|
</div>
|
|
);
|
|
},
|
|
align: "text-start",
|
|
},
|
|
{
|
|
key: "assignedAt",
|
|
label: "assigned Date",
|
|
getValue: (e) =>
|
|
formatUTCToLocalTime(e.assignedAT)
|
|
,
|
|
align: "text-center",
|
|
},
|
|
];
|
|
return (
|
|
<div className="table-responsive">
|
|
<table className="table align-middle mb-0">
|
|
<thead>
|
|
<tr>
|
|
{servceProjectColmen.map((col) => (
|
|
<th key={col.key} className={col.align}>{col.label}</th>
|
|
))}
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
{data?.length > 0 ? (
|
|
data.map((row) => (
|
|
<tr key={row.id}>
|
|
{servceProjectColmen.map((col) => (
|
|
<td key={col.key} className={col.align}>{col.getValue(row)}</td>
|
|
))}
|
|
</tr>
|
|
))
|
|
) : (
|
|
<tr>
|
|
<td
|
|
colSpan={servceProjectColmen.length}
|
|
className="text-center py-4 border-0"
|
|
>
|
|
{isLoading ? (
|
|
<SpinnerLoader />
|
|
) : (
|
|
<div className="py-8">No Records Available</div>
|
|
)}
|
|
</td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ServiceProjectTeamList;
|