pramod_Bug#128 #54

Merged
vikas.nale merged 2 commits from pramod_Bug#128 into Issues_April_5W 2025-04-30 11:25:40 +00:00
2 changed files with 63 additions and 39 deletions

View File

@ -53,16 +53,21 @@ const AssignRoleModel = ({ assignData, onClose }) => {
}, },
}); });
const handleRoleChange = (event) => { const handleRoleChange = ( event ) =>
setSelectedRole(event.plannedTask.value); {
reset()
setSelectedEmployees( [] )
setSelectedRole(event.target.value);
}; };
const filteredEmployees = const filteredEmployees =
selectedRole === "all" selectedRole === "all"
? employees ? employees
: employees.filter((emp) => emp.JobRoleId.toString() === selectedRole); : employees.filter((emp) =>
String(emp.jobRoleId || "") === selectedRole
);
// not need currently for this fun
const handleEmployeeSelection = (employeeId, field) => { const handleEmployeeSelection = (employeeId, field) => {
setSelectedEmployees((prevSelected) => { setSelectedEmployees((prevSelected) => {
let updatedSelection; let updatedSelection;
@ -97,8 +102,7 @@ const AssignRoleModel = ({ assignData, onClose }) => {
showToast( "Task Successfully Assigend", "success" ); showToast( "Task Successfully Assigend", "success" );
setSelectedEmployees([]) setSelectedEmployees([])
reset(); reset();
closeModal() onClose();
} catch (error) { } catch (error) {
showToast("something wrong", "error"); showToast("something wrong", "error");
} }
@ -109,7 +113,18 @@ const AssignRoleModel = ({ assignData, onClose }) => {
}, [dispatch]); }, [dispatch]);
return ( return (
<> <div
className="modal-dialog modal-lg modal-simple mx-sm-auto mx-1 edit-project-modal"
role="document"
>
<div className="modal-content">
<div className="modal-body p-sm-4 p-0">
<button
type="button"
className="btn-close"
onClick={onClose}
aria-label="Close"
></button>
<div className="container my-1"> <div className="container my-1">
<div className="mb-"> <div className="mb-">
<p className="fs-sm-5 fs-6 text-dark text-start d-flex align-items-center flex-wrap"> <p className="fs-sm-5 fs-6 text-dark text-start d-flex align-items-center flex-wrap">
@ -161,16 +176,17 @@ const AssignRoleModel = ({ assignData, onClose }) => {
<div className="divider text-start"> <div className="divider text-start">
<div className="divider-text">Employee</div> <div className="divider-text">Employee</div>
</div> </div>
{( filteredEmployees?.length === 0 && employees ) && <div>No employees found</div>}
<div className="row"> <div className="row">
<div className="col-12 col-md-8 h-sm-25 overflow-auto"> <div className="col-12 col-md-8 h-sm-25 overflow-auto">
{selectedRole !== "" && ( {selectedRole !== "" && (
<div className="row mb-2"> <div className="row mb-2">
<div className="col-sm-12"> <div className="col-sm-12">
<div className="row"> <div className="row">
{filteredEmployees.map((emp) => { {filteredEmployees?.map((emp) => {
const jobRole = jobRoleData?.find( const jobRole = jobRoleData?.find(
(role) => role.id === emp.jobRoleId (role) => role?.id === emp?.jobRoleId
); );
return ( return (
@ -188,9 +204,9 @@ const AssignRoleModel = ({ assignData, onClose }) => {
{...field} {...field}
className="form-check-input mx-2" className="form-check-input mx-2"
type="checkbox" type="checkbox"
id={`employee-${emp.id}`} id={`employee-${emp?.id}`}
value={emp.id} value={emp.id}
checked={field.value.includes(emp.id)} // Ensure the checkbox reflects the current form state checked={field.value.includes(emp.id)}
onChange={() => { onChange={() => {
handleEmployeeSelection(emp.id, field); handleEmployeeSelection(emp.id, field);
}} }}
@ -326,15 +342,17 @@ const AssignRoleModel = ({ assignData, onClose }) => {
className="btn btn-sm btn-label-secondary" className="btn btn-sm btn-label-secondary"
data-bs-dismiss="modal" data-bs-dismiss="modal"
aria-label="Close" aria-label="Close"
onClick={closeModal} onClick={onClose}
> >
Cancel Cancel
</button> </button>
</div> </div>
</form> </form>
</div> </div>
</div> </div>
</> </div>
</div>
</div>
); );
}; };
export default AssignRoleModel; export default AssignRoleModel;

View File

@ -2,7 +2,6 @@ import React, { useState, useEffect } from "react";
import { useModal } from "../../../ModalContext"; import { useModal } from "../../../ModalContext";
import AssignRoleModel from "../AssignRole"; import AssignRoleModel from "../AssignRole";
import { useParams } from "react-router-dom"; import { useParams } from "react-router-dom";
import GlobalModel from "../../common/GlobalModel";
const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => { const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
const { projectId } = useParams(); const { projectId } = useParams();
@ -22,7 +21,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
useEffect(() => { useEffect(() => {
setNewWorkItem(workItem); setNewWorkItem(workItem);
}, [workItem]); // This hook will run whenever the workItem prop changes }, [workItem]);
let assigndata = { let assigndata = {
building: forBuilding, building: forBuilding,
@ -33,22 +32,24 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
const hasWorkItem = NewWorkItem && NewWorkItem; const hasWorkItem = NewWorkItem && NewWorkItem;
useEffect(() => { useEffect(() => {
const tooltipTriggerList = Array.from(document.querySelectorAll('[data-bs-toggle="tooltip"]')); const tooltipTriggerList = Array.from(
document.querySelectorAll('[data-bs-toggle="tooltip"]')
);
tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el)); tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
}, []); }, []);
return ( return (
<> <>
<GlobalModel <div
isOpen={isModalOpen} className={`modal fade ${isModalOpen ? "show" : ""}`}
closeModal={closeModal} tabIndex="-1"
dialogClass="modal-dialog-centered" role="dialog"
role="document" style={{ display: isModalOpen ? "block" : "none" }}
size="lg" aria-hidden={!isModalOpen}
> >
<AssignRoleModel assignData={assigndata} onClose={closeModal} /> <AssignRoleModel assignData={assigndata} onClose={closeModal} />
</GlobalModel> </div>
<tr> <tr>
<td className="text-start table-cell-small"> <td className="text-start table-cell-small">
<i className="bx bx-right-arrow-alt"></i> <i className="bx bx-right-arrow-alt"></i>
@ -75,7 +76,6 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
<td className="text-center d-none d-md-table-cell"> <td className="text-center d-none d-md-table-cell">
{NewWorkItem?.workItem?.completedWork} {NewWorkItem?.workItem?.completedWork}
</td> </td>
{/* ************************************************ */}
<td className="text-center" style={{ width: "15%" }}> <td className="text-center" style={{ width: "15%" }}>
<div className="progress p-0"> <div className="progress p-0">
<div <div
@ -99,7 +99,6 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
></div> ></div>
</div> </div>
</td> </td>
{/* for greather than mobile view */}
<td className="d-none d-md-table-cell"> <td className="d-none d-md-table-cell">
<div className="dropdown"> <div className="dropdown">
{!projectId && ( {!projectId && (
@ -134,14 +133,16 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
type="button" type="button"
className="btn p-0 dropdown-toggle hide-arrow" className="btn p-0 dropdown-toggle hide-arrow"
> >
<i className="bx bx-trash me-1 text-danger" data-bs-toggle="tooltip" <i
className="bx bx-trash me-1 text-danger"
data-bs-toggle="tooltip"
data-bs-placement="top" data-bs-placement="top"
title="Delete Activity" title="Delete Activity"
data-bs-original-title="Delete Activity"></i> data-bs-original-title="Delete Activity"
></i>
</button> </button>
</div> </div>
</td> </td>
{/* for mobile view */}
<td className="text-end d-sm-none d-sm-table-cell"> <td className="text-end d-sm-none d-sm-table-cell">
<div className="d-flex align-items-center justify-content-center "> <div className="d-flex align-items-center justify-content-center ">
<a <a
@ -159,14 +160,19 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
</a> </a>
<a className="dropdown-item"> <a className="dropdown-item">
{" "} {" "}
<i className="bx bx-trash me-1 text-danger" ></i>Delete <i className="bx bx-trash me-1 text-danger"></i>Delete
</a> </a>
{!projectId && ( <a className="dropdown-item" data-bs-toggle="modal" {!projectId && (
data-bs-target="#project-modal" <a
onClick={openModal}> className="dropdown-item"
{" "} data-bs-toggle="modal"
<i className="bx bx-task me-1 text-info" ></i>Assign data-bs-target="#project-modal"
</a> )} onClick={openModal}
>
{" "}
<i className="bx bx-task me-1 text-info"></i>Assign
</a>
)}
</div> </div>
</div> </div>
</td> </td>