82 lines
2.8 KiB
JavaScript
82 lines
2.8 KiB
JavaScript
import React, { useState } from "react";
|
|
import TeamEmployeeList from "./TeamEmployeeList";
|
|
import { useOrganization } from "../../../hooks/useDirectory";
|
|
import { useOrganizationsList } from "../../../hooks/useOrganization";
|
|
import { useProjectAssignedOrganizationsName } from "../../../hooks/useProjects";
|
|
import { useSelectedProject } from "../../../slices/apiDataManager";
|
|
|
|
const TeamAssignToProject = ({ closeModal }) => {
|
|
const [searchText, setSearchText] = useState("");
|
|
const [selectedOrg, setSelectedOrg] = useState(null);
|
|
const project = useSelectedProject();
|
|
const { data, isLoading, isError, error } =
|
|
useProjectAssignedOrganizationsName(project);
|
|
return (
|
|
<div className="container">
|
|
{/* <p className="fs-5 fs-seminbod ">Assign Employee To Project </p> */}
|
|
<h5 className="mb-4">Assign Employee To Project</h5>
|
|
|
|
<div className="row align-items-center gx-5">
|
|
<div className="col">
|
|
<div className="d-flex flex-grow-1 align-items-center gap-2">
|
|
{isLoading ? (
|
|
<select className="form-select form-select-sm w-100" disabled>
|
|
<option value="">Loading...</option>
|
|
</select>
|
|
) : data?.length === 0 ? (
|
|
<p className="mb-0 badge bg-label-secondary">No organizations found</p>
|
|
) : (
|
|
<>
|
|
<label
|
|
htmlFor="organization"
|
|
className="form-label mb-0 text-nowrap"
|
|
>
|
|
Select Organization
|
|
</label>
|
|
<select
|
|
id="organization"
|
|
className="form-select form-select-sm w-100"
|
|
value={selectedOrg || ""}
|
|
onChange={(e) => setSelectedOrg(e.target.value)}
|
|
>
|
|
<option value="">Select</option>
|
|
{data.map((org) => (
|
|
<option key={org.id} value={org.id}>
|
|
{org.name}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</>
|
|
)}
|
|
</div>
|
|
</div>
|
|
<div className="col">
|
|
<div className="d-flex flex-grow-1 align-items-center gap-2">
|
|
<label htmlFor="search" className="form-label mb-0 text-nowrap">
|
|
Search Employee
|
|
</label>
|
|
<input
|
|
id="search"
|
|
type="search"
|
|
className="form-control form-control-sm w-100"
|
|
placeholder="Search..."
|
|
value={searchText}
|
|
onChange={(e) => setSearchText(e.target.value)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div >
|
|
<TeamEmployeeList
|
|
organizationId={selectedOrg}
|
|
searchTerm={searchText}
|
|
closeModal={closeModal}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TeamAssignToProject;
|