Adding Services Dropdown in Infrastructure. #410
@ -143,7 +143,7 @@ const InfraTable = ({ buildings, projectId}) => {
|
||||
// }, [handler]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="px-6">
|
||||
{projectBuilding && projectBuilding.length > 0 && (
|
||||
<table className="table table-bordered">
|
||||
<tbody>
|
||||
|
||||
@ -17,22 +17,21 @@ import {
|
||||
getCachedData,
|
||||
useSelectedProject,
|
||||
} from "../../slices/apiDataManager";
|
||||
import { useProjectDetails, useProjectInfra } from "../../hooks/useProjects";
|
||||
import { useProjectAssignedServices, useProjectDetails, useProjectInfra } from "../../hooks/useProjects";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { refreshData } from "../../slices/localVariablesSlice";
|
||||
import eventBus from "../../services/eventBus";
|
||||
import {useParams} from "react-router-dom";
|
||||
import { useParams } from "react-router-dom";
|
||||
import GlobalModel from "../common/GlobalModel";
|
||||
|
||||
const ProjectInfra = ( {data, onDataChange, eachSiteEngineer} ) =>
|
||||
{
|
||||
const ProjectInfra = ({ data, onDataChange, eachSiteEngineer }) => {
|
||||
// const projectId = useSelector((store)=>store.localVariables.projectId)
|
||||
const projectId = useSelectedProject();
|
||||
const reloadedData = useSelector((store) => store.localVariables.reload);
|
||||
const [ expandedBuildings, setExpandedBuildings ] = useState( [] );
|
||||
const {projectInfra,isLoading,error} = useProjectInfra(projectId)
|
||||
const [expandedBuildings, setExpandedBuildings] = useState([]);
|
||||
const { projectInfra, isLoading, error } = useProjectInfra(projectId)
|
||||
const { projects_Details, refetch, loading } = useProjectDetails(data?.id);
|
||||
const [ project, setProject ] = useState( projects_Details );
|
||||
const [project, setProject] = useState(projects_Details);
|
||||
const ManageInfra = useHasUserPermission(MANAGE_PROJECT_INFRA);
|
||||
const ManageTask = useHasUserPermission(MANAGE_TASK)
|
||||
const [showModalFloor, setshowModalFloor] = useState(false);
|
||||
@ -40,47 +39,46 @@ const ProjectInfra = ( {data, onDataChange, eachSiteEngineer} ) =>
|
||||
const [showModalTask, setshowModalTask] = useState(false);
|
||||
const [showModalBuilding, setshowModalBuilding] = useState(false);
|
||||
const dispatch = useDispatch();
|
||||
const { data: assignedServices, isLoading: servicesLoading } = useProjectAssignedServices(projectId);
|
||||
|
||||
const [selectedService, setSelectedService] = useState("");
|
||||
const handleServiceChange = (e) => {
|
||||
setSelectedService(e.target.value);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
setProject(projectInfra);
|
||||
}, [data, projects_Details]);
|
||||
|
||||
// useEffect(() => {
|
||||
// if (reloadedData) {
|
||||
// refetch();
|
||||
// dispatch(refreshData(false));
|
||||
// }
|
||||
// }, [reloadedData]);
|
||||
|
||||
const signalRHandler = (response) => {
|
||||
setProject(response);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{showModalBuilding && <GlobalModel isOpen={showModalBuilding} size="md" closeModal={() => setshowModalBuilding( false )}>
|
||||
{showModalBuilding && <GlobalModel isOpen={showModalBuilding} size="md" closeModal={() => setshowModalBuilding(false)}>
|
||||
<BuildingModel
|
||||
project={projectInfra}
|
||||
onClose={() => setshowModalBuilding( false )}
|
||||
onClose={() => setshowModalBuilding(false)}
|
||||
/>
|
||||
</GlobalModel>}
|
||||
{showModalFloor && <GlobalModel isOpen={showModalFloor} size="md" closeModal={()=>setshowModalFloor(false)}>
|
||||
</GlobalModel>}
|
||||
{showModalFloor && <GlobalModel isOpen={showModalFloor} size="md" closeModal={() => setshowModalFloor(false)}>
|
||||
<FloorModel
|
||||
project={projectInfra}
|
||||
onClose={()=>setshowModalFloor(false)}
|
||||
/>
|
||||
project={projectInfra}
|
||||
onClose={() => setshowModalFloor(false)}
|
||||
/>
|
||||
</GlobalModel>}
|
||||
{showModalWorkArea && <GlobalModel isOpen={showModalWorkArea} size="lg" closeModal={()=>setshowModalWorkArea(false)} >
|
||||
<WorkAreaModel
|
||||
project={projectInfra}
|
||||
onClose={()=>setshowModalWorkArea(false)}
|
||||
/>
|
||||
{showModalWorkArea && <GlobalModel isOpen={showModalWorkArea} size="lg" closeModal={() => setshowModalWorkArea(false)} >
|
||||
<WorkAreaModel
|
||||
project={projectInfra}
|
||||
onClose={() => setshowModalWorkArea(false)}
|
||||
/>
|
||||
</GlobalModel>}
|
||||
{showModalTask && ( <GlobalModel isOpen={showModalTask} size="lg" closeModal={()=>setshowModalTask(false)}>
|
||||
{showModalTask && (<GlobalModel isOpen={showModalTask} size="lg" closeModal={() => setshowModalTask(false)}>
|
||||
<TaskModel
|
||||
project={projectInfra}
|
||||
onClose={()=>setshowModalTask(false)}
|
||||
/>
|
||||
project={projectInfra}
|
||||
onClose={() => setshowModalTask(false)}
|
||||
/>
|
||||
</GlobalModel>)}
|
||||
<div className="col-md-12 col-lg-12 col-xl-12 order-0 mb-4">
|
||||
<div className="card">
|
||||
@ -88,38 +86,73 @@ const ProjectInfra = ( {data, onDataChange, eachSiteEngineer} ) =>
|
||||
<div className="align-items-center">
|
||||
<div className="row ">
|
||||
<div
|
||||
className={`col-12 text-end mb-1 `}
|
||||
className="dataTables_length text-start py-2 px-6 col-md-4 col-12"
|
||||
id="DataTables_Table_0_length"
|
||||
>
|
||||
{ManageInfra && (<>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md link-button-sm m-1 btn-primary"
|
||||
onClick={()=>setshowModalBuilding(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Building
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md m-1 btn-primary"
|
||||
onClick={()=>setshowModalFloor(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Floors
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md m-1 btn-primary"
|
||||
onClick={() => setshowModalWorkArea(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Work Areas
|
||||
</button></>)}
|
||||
|
||||
{servicesLoading ? (
|
||||
<span></span>
|
||||
) : assignedServices?.length > 1 ? (
|
||||
<label>
|
||||
<select
|
||||
name="DataTables_Table_0_length"
|
||||
aria-controls="DataTables_Table_0"
|
||||
className="form-select form-select-sm"
|
||||
aria-label="Select Service"
|
||||
value={selectedService}
|
||||
onChange={handleServiceChange}
|
||||
>
|
||||
{assignedServices.map((service) => (
|
||||
<option key={service.id} value={service.id}>
|
||||
{service.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
) : (
|
||||
<div
|
||||
style={{
|
||||
|
||||
}}
|
||||
>
|
||||
{assignedServices?.length === 1
|
||||
? <h5>{ assignedServices[0].name}</h5>
|
||||
: "No service available"}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* Buttons Section (aligned to right) */}
|
||||
<div className="col-md-8 col-12 text-end mb-1">
|
||||
{ManageInfra && (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md link-button-sm m-1 btn-primary"
|
||||
onClick={() => setshowModalBuilding(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Building
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md m-1 btn-primary"
|
||||
onClick={() => setshowModalFloor(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Floors
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md m-1 btn-primary"
|
||||
onClick={() => setshowModalWorkArea(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Work Areas
|
||||
</button></>)}
|
||||
|
||||
{(ManageTask || ManageInfra) && (<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md m-1 btn-primary"
|
||||
onClick={()=>setshowModalTask(true)}
|
||||
onClick={() => setshowModalTask(true)}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Create Tasks
|
||||
@ -132,8 +165,8 @@ const ProjectInfra = ( {data, onDataChange, eachSiteEngineer} ) =>
|
||||
<InfraTable
|
||||
buildings={projectInfra}
|
||||
projectId={projectId}
|
||||
// handleFloor={submitData}
|
||||
// signalRHandler ={signalRHandler}
|
||||
// handleFloor={submitData}
|
||||
// signalRHandler ={signalRHandler}
|
||||
/>
|
||||
)}
|
||||
{!isLoading && projectInfra?.length == 0 && <div className="mt-5"><p>No Infra Avaiable</p></div>}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user