Merge branch 'Issue_May_2W' of https://git.marcoaiot.com/admin/marco.pms.web into pramod_Bug-#120deleteConfirmModal
This commit is contained in:
Pramod Mahajan
commit
c29a76a36c
@ -15,17 +15,19 @@ import { clearApiCacheKey } from "../../slices/apiCacheSlice";
|
||||
|
||||
const mobileNumberRegex = /^[7-9]\d{9}$/;
|
||||
|
||||
const ManageEmployee = () => {
|
||||
const ManageEmployee = ({ employeeId, onClosed }) => {
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const { employeeId } = useParams();
|
||||
// const { employeeId } = useParams();
|
||||
const {
|
||||
employee,
|
||||
error,
|
||||
loading: empLoading,
|
||||
} = useEmployeeProfile(employeeId);
|
||||
|
||||
dispatch(changeMaster("Job Role"));
|
||||
useEffect(() => {
|
||||
dispatch(changeMaster("Job Role"));
|
||||
}, [employeeId]);
|
||||
|
||||
const [disabledEmail, setDisabledEmail] = useState(false);
|
||||
const { data: job_role, loading } = useMaster();
|
||||
@ -36,11 +38,11 @@ const ManageEmployee = () => {
|
||||
const [permanentAddressLength, setPermanentAddressLength] = useState(0);
|
||||
|
||||
const userSchema = z.object({
|
||||
...(employeeId ? { Id: z.string().optional() } : {}),
|
||||
FirstName: z.string().min(1, { message: "First Name is required" }),
|
||||
MiddleName: z.string().optional(),
|
||||
LastName: z.string().min(1, { message: "Last Name is required" }),
|
||||
Email: z
|
||||
...(employeeId ? { id: z.string().optional() } : {}),
|
||||
firstName: z.string().min(1, { message: "First Name is required" }),
|
||||
middleName: z.string().optional(),
|
||||
lastName: z.string().min(1, { message: "Last Name is required" }),
|
||||
email: z
|
||||
.string()
|
||||
.max(80, "Email cannot exceed 80 characters")
|
||||
.optional()
|
||||
@ -59,11 +61,11 @@ const ManageEmployee = () => {
|
||||
message: "Email local or domain part is too long",
|
||||
}
|
||||
),
|
||||
CurrentAddress: z
|
||||
currentAddress: z
|
||||
.string()
|
||||
.min(1, { message: "Current Address is required" })
|
||||
.max(500, { message: "Address cannot exceed 500 characters" }),
|
||||
BirthDate: z
|
||||
birthDate: z
|
||||
.string()
|
||||
.min(1, { message: "Birth Date is required" })
|
||||
.refine(
|
||||
@ -74,7 +76,7 @@ const ManageEmployee = () => {
|
||||
message: "Birth date cannot be in the future",
|
||||
}
|
||||
),
|
||||
JoiningDate: z
|
||||
joiningDate: z
|
||||
.string()
|
||||
.min(1, { message: "Joining Date is required" })
|
||||
.refine(
|
||||
@ -85,43 +87,43 @@ const ManageEmployee = () => {
|
||||
message: "Joining date cannot be in the future",
|
||||
}
|
||||
),
|
||||
EmergencyPhoneNumber: z
|
||||
emergencyPhoneNumber: z
|
||||
.string()
|
||||
.min(1, { message: "Phone Number is required" })
|
||||
.regex(mobileNumberRegex, { message: "Invalid phone number " }),
|
||||
EmergencyContactPerson: z
|
||||
emergencyContactPerson: z
|
||||
.string()
|
||||
.min(1, { message: "Emergency Contact Person is required" })
|
||||
.regex(/^[A-Za-z\s]+$/, {
|
||||
message: "Emergency Contact Person must contain only letters",
|
||||
}),
|
||||
AadharNumber: z
|
||||
aadharNumber: z
|
||||
.string()
|
||||
.optional()
|
||||
.refine((val) => !val || /^\d{12}$/.test(val), {
|
||||
message: "Aadhar card must be exactly 12 digits long",
|
||||
}),
|
||||
Gender: z
|
||||
gender: z
|
||||
.string()
|
||||
.min(1, { message: "Gender is required" })
|
||||
.refine((val) => val !== "Select Gender", {
|
||||
message: "Please select a gender",
|
||||
}),
|
||||
PanNumber: z
|
||||
panNumber: z
|
||||
.string()
|
||||
.optional()
|
||||
.refine((val) => !val || /^[A-Z]{5}[0-9]{4}[A-Z]{1}$/.test(val), {
|
||||
message: "Invalid PAN number",
|
||||
}),
|
||||
PermanentAddress: z
|
||||
permanentAddress: z
|
||||
.string()
|
||||
.min(1, { message: "Permanent Address is required" })
|
||||
.max(500, { message: "Address cannot exceed 500 characters" }),
|
||||
PhoneNumber: z
|
||||
phoneNumber: z
|
||||
.string()
|
||||
.min(1, { message: "Phone Number is required" })
|
||||
.regex(mobileNumberRegex, { message: "Invalid phone number " }),
|
||||
JobRoleId: z.string().min(1, { message: "Role is required" }),
|
||||
jobRoleId: z.string().min(1, { message: "Role is required" }),
|
||||
});
|
||||
|
||||
const {
|
||||
@ -135,22 +137,22 @@ const ManageEmployee = () => {
|
||||
} = useForm({
|
||||
resolver: zodResolver(userSchema),
|
||||
defaultValues: {
|
||||
Id: currentEmployee?.id || null,
|
||||
FirstName: currentEmployee?.firstName || "",
|
||||
MiddleName: currentEmployee?.middleName || "",
|
||||
LastName: currentEmployee?.lastName || "",
|
||||
Email: currentEmployee?.email || "",
|
||||
CurrentAddress: currentEmployee?.currentAddress || "",
|
||||
BirthDate: formatDate(currentEmployee?.birthDate) || "",
|
||||
JoiningDate: formatDate(currentEmployee?.joiningDate) || "",
|
||||
EmergencyPhoneNumber: currentEmployee?.emergencyPhoneNumber || "",
|
||||
EmergencyContactPerson: currentEmployee?.emergencyContactPerson || "",
|
||||
AadharNumber: currentEmployee?.aadharNumber || "",
|
||||
Gender: currentEmployee?.gender || "",
|
||||
PanNumber: currentEmployee?.panNumber || "",
|
||||
PermanentAddress: currentEmployee?.permanentAddress || "",
|
||||
PhoneNumber: currentEmployee?.phoneNumber || "",
|
||||
JobRoleId: currentEmployee?.jobRoleId.toString() || null,
|
||||
id: currentEmployee?.id || null,
|
||||
firstName: currentEmployee?.firstName || "",
|
||||
middleName: currentEmployee?.middleName || "",
|
||||
lastName: currentEmployee?.lastName || "",
|
||||
email: currentEmployee?.email || "",
|
||||
currentAddress: currentEmployee?.currentAddress || "",
|
||||
birthDate: formatDate(currentEmployee?.birthDate) || "",
|
||||
joiningDate: formatDate(currentEmployee?.joiningDate) || "",
|
||||
emergencyPhoneNumber: currentEmployee?.emergencyPhoneNumber || "",
|
||||
emergencyContactPerson: currentEmployee?.emergencyContactPerson || "",
|
||||
aadharNumber: currentEmployee?.aadharNumber || "",
|
||||
gender: currentEmployee?.gender || "",
|
||||
panNumber: currentEmployee?.panNumber || "",
|
||||
permanentAddress: currentEmployee?.permanentAddress || "",
|
||||
phoneNumber: currentEmployee?.phoneNumber || "",
|
||||
jobRoleId: currentEmployee?.jobRoleId.toString() || null,
|
||||
},
|
||||
mode: "onChange",
|
||||
});
|
||||
@ -160,29 +162,8 @@ const ManageEmployee = () => {
|
||||
const onSubmit = (data) => {
|
||||
setLoading(true);
|
||||
|
||||
const formData = getValues();
|
||||
|
||||
const formDataToSend = new FormData();
|
||||
|
||||
if (!employeeId) {
|
||||
delete formData["Id"];
|
||||
}
|
||||
|
||||
for (const key in formData) {
|
||||
formDataToSend.append(key, formData[key]);
|
||||
|
||||
// if (key === "Documents") {
|
||||
// formData[key]?.forEach((file, index) => {
|
||||
// formDataToSend.append(`Documents`, file);
|
||||
// });
|
||||
// } else if (key === "Photo" && formData[key]) {
|
||||
// formDataToSend.append("Photo", formData[key]);
|
||||
// } else{
|
||||
// formDataToSend.append(key, formData[key]);
|
||||
// }
|
||||
}
|
||||
|
||||
EmployeeRepository.manageEmployee(formDataToSend)
|
||||
console.log(data);
|
||||
EmployeeRepository.manageEmployee(data)
|
||||
.then((response) => {
|
||||
showToast("Employee details updated successfully.", "success");
|
||||
clearCacheKey("employeeListByProject");
|
||||
@ -194,7 +175,10 @@ const ManageEmployee = () => {
|
||||
navigation("/employees");
|
||||
})
|
||||
.catch((error) => {
|
||||
const message = error?.response?.data?.message || error?.message || "Error occured during api calling"
|
||||
const message =
|
||||
error?.response?.data?.message ||
|
||||
error?.message ||
|
||||
"Error occured during api calling";
|
||||
showToast(message, "error");
|
||||
setLoading(false);
|
||||
});
|
||||
@ -206,29 +190,27 @@ const ManageEmployee = () => {
|
||||
}
|
||||
}, [loading, error, employee]);
|
||||
|
||||
dispatch(changeMaster("Job Role"));
|
||||
|
||||
useEffect(() => {
|
||||
reset(
|
||||
currentEmployee
|
||||
? {
|
||||
Id: currentEmployee.id || null,
|
||||
FirstName: currentEmployee.firstName || "",
|
||||
MiddleName: currentEmployee.middleName || "",
|
||||
LastName: currentEmployee.lastName || "",
|
||||
Email: currentEmployee.email || "",
|
||||
CurrentAddress: currentEmployee.currentAddress || "",
|
||||
BirthDate: formatDate(currentEmployee.birthDate) || "",
|
||||
JoiningDate: formatDate(currentEmployee.joiningDate) || "",
|
||||
EmergencyPhoneNumber: currentEmployee.emergencyPhoneNumber || "",
|
||||
EmergencyContactPerson:
|
||||
id: currentEmployee.id || null,
|
||||
firstName: currentEmployee.firstName || "",
|
||||
middleName: currentEmployee.middleName || "",
|
||||
lastName: currentEmployee.lastName || "",
|
||||
email: currentEmployee.email || "",
|
||||
currentAddress: currentEmployee.currentAddress || "",
|
||||
birthDate: formatDate(currentEmployee.birthDate) || "",
|
||||
joiningDate: formatDate(currentEmployee.joiningDate) || "",
|
||||
emergencyPhoneNumber: currentEmployee.emergencyPhoneNumber || "",
|
||||
emergencyContactPerson:
|
||||
currentEmployee.emergencyContactPerson || "",
|
||||
AadharNumber: currentEmployee.aadharNumber || "",
|
||||
Gender: currentEmployee.gender || "",
|
||||
PanNumber: currentEmployee.panNumber || "",
|
||||
PermanentAddress: currentEmployee.permanentAddress || "",
|
||||
PhoneNumber: currentEmployee.phoneNumber || "",
|
||||
JobRoleId: currentEmployee.jobRoleId?.toString() || "",
|
||||
aadharNumber: currentEmployee.aadharNumber || "",
|
||||
gender: currentEmployee.gender || "",
|
||||
panNumber: currentEmployee.panNumber || "",
|
||||
permanentAddress: currentEmployee.permanentAddress || "",
|
||||
phoneNumber: currentEmployee.phoneNumber || "",
|
||||
jobRoleId: currentEmployee.jobRoleId?.toString() || "",
|
||||
}
|
||||
: {} // Empty object resets the form
|
||||
);
|
||||
@ -238,9 +220,9 @@ const ManageEmployee = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="row">
|
||||
<div className="col-xxl">
|
||||
<div className="card mb-4">
|
||||
<div className=" row">
|
||||
<div className="col-xl">
|
||||
<div className="card">
|
||||
<div className="card-header d-flex align-items-center justify-content-between">
|
||||
<h6 className="mb-0">
|
||||
{employee ? "Update Employee" : "Create Employee"}
|
||||
@ -248,15 +230,9 @@ const ManageEmployee = () => {
|
||||
|
||||
<span
|
||||
className="cursor-pointer fs-6"
|
||||
data-htm="true"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-offset="0,6"
|
||||
data-bs-placement="top"
|
||||
data-bs-html="true"
|
||||
title="Move Back"
|
||||
onClick={() => navigation("/employees")}
|
||||
onClick={() => onClosed()}
|
||||
>
|
||||
<i className="bx bxs-chevron-left"></i> Back
|
||||
<i className='bx bx-x'></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
@ -272,7 +248,7 @@ const ManageEmployee = () => {
|
||||
<input
|
||||
type="text"
|
||||
name="FirstName"
|
||||
{...register("FirstName")}
|
||||
{...register("firstName")}
|
||||
className="form-control form-control-sm"
|
||||
id="FirstName"
|
||||
placeholder="First Name"
|
||||
@ -291,7 +267,7 @@ const ManageEmployee = () => {
|
||||
|
||||
<input
|
||||
type="text"
|
||||
{...register("MiddleName")}
|
||||
{...register("middleName")}
|
||||
className="form-control form-control-sm"
|
||||
id="MiddleName"
|
||||
placeholder="Middle Name"
|
||||
@ -309,7 +285,7 @@ const ManageEmployee = () => {
|
||||
<div className="form-text text-start">Last Name</div>
|
||||
<input
|
||||
type="text"
|
||||
{...register("LastName")}
|
||||
{...register("lastName")}
|
||||
className="form-control form-control-sm"
|
||||
id="LastName"
|
||||
placeholder="Last Name"
|
||||
@ -330,7 +306,7 @@ const ManageEmployee = () => {
|
||||
<input
|
||||
type="email"
|
||||
id="Email"
|
||||
{...register("Email")}
|
||||
{...register("email")}
|
||||
className="form-control form-control-sm"
|
||||
placeholder="example@domain.com"
|
||||
maxLength={80}
|
||||
@ -352,7 +328,7 @@ const ManageEmployee = () => {
|
||||
type="text"
|
||||
keyboardType="numeric"
|
||||
id="PhoneNumber"
|
||||
{...register("PhoneNumber")}
|
||||
{...register("phoneNumber")}
|
||||
className="form-control form-control-sm"
|
||||
placeholder="Phone Number"
|
||||
inputMode="numeric"
|
||||
@ -376,7 +352,7 @@ const ManageEmployee = () => {
|
||||
<div className="input-group input-group-merge ">
|
||||
<select
|
||||
className="form-select form-select-sm "
|
||||
{...register("Gender")}
|
||||
{...register("gender")}
|
||||
id="Gender"
|
||||
aria-label=""
|
||||
>
|
||||
@ -404,7 +380,7 @@ const ManageEmployee = () => {
|
||||
<input
|
||||
className="form-control form-control-sm"
|
||||
type="date"
|
||||
{...register("BirthDate")}
|
||||
{...register("birthDate")}
|
||||
id="BirthDate"
|
||||
/>
|
||||
</div>
|
||||
@ -424,7 +400,7 @@ const ManageEmployee = () => {
|
||||
<input
|
||||
className="form-control form-control-sm"
|
||||
type="date"
|
||||
{...register("JoiningDate")}
|
||||
{...register("joiningDate")}
|
||||
id="JoiningDate"
|
||||
/>
|
||||
</div>
|
||||
@ -448,7 +424,7 @@ const ManageEmployee = () => {
|
||||
placeholder="Current Address"
|
||||
aria-label="Current Address"
|
||||
aria-describedby="basic-icon-default-message2"
|
||||
{...register("CurrentAddress")}
|
||||
{...register("currentAddress")}
|
||||
maxLength={500}
|
||||
onChange={(e) => {
|
||||
setCurrentAddressLength(e.target.value.length);
|
||||
@ -482,7 +458,7 @@ const ManageEmployee = () => {
|
||||
placeholder="Permanent Address"
|
||||
aria-label="Permanent Address"
|
||||
aria-describedby="basic-icon-default-message2"
|
||||
{...register("PermanentAddress")}
|
||||
{...register("permanentAddress")}
|
||||
maxLength={500}
|
||||
onChange={(e) => {
|
||||
setPermanentAddressLength(e.target.value.length);
|
||||
@ -516,7 +492,7 @@ const ManageEmployee = () => {
|
||||
<div className="input-group input-group-merge ">
|
||||
<select
|
||||
className="form-select form-select-sm"
|
||||
{...register("JobRoleId")}
|
||||
{...register("jobRoleId")}
|
||||
id="JobRoleId"
|
||||
aria-label=""
|
||||
>
|
||||
@ -545,7 +521,7 @@ const ManageEmployee = () => {
|
||||
</div>
|
||||
<input
|
||||
type="text"
|
||||
{...register("EmergencyContactPerson")}
|
||||
{...register("emergencyContactPerson")}
|
||||
className="form-control form-control-sm"
|
||||
id="EmergencyContactPerson"
|
||||
maxLength={50}
|
||||
@ -566,7 +542,7 @@ const ManageEmployee = () => {
|
||||
</div>
|
||||
<input
|
||||
type="text"
|
||||
{...register("EmergencyPhoneNumber")}
|
||||
{...register("emergencyPhoneNumber")}
|
||||
className="form-control form-control-sm phone-mask"
|
||||
id="EmergencyPhoneNumber"
|
||||
placeholder="Phone Number"
|
||||
@ -583,13 +559,13 @@ const ManageEmployee = () => {
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="row mb-3">
|
||||
<div className="row mb-3 d-none">
|
||||
<div className="col-sm-6">
|
||||
<div className="form-text text-start">AADHAR Number</div>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
{...register("AadharNumber")}
|
||||
{...register("aadharNumber")}
|
||||
className="form-control form-control-sm"
|
||||
id="AadharNumber"
|
||||
placeholder="AADHAR Number"
|
||||
@ -602,12 +578,12 @@ const ManageEmployee = () => {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<div className="col-sm-6 d-none">
|
||||
<div className="form-text text-start">PAN Number</div>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
{...register("PanNumber")}
|
||||
{...register("panNumber")}
|
||||
className="form-control form-control-sm"
|
||||
id="PanNumber"
|
||||
placeholder="PAN Number"
|
||||
@ -627,7 +603,7 @@ const ManageEmployee = () => {
|
||||
{employeeId && (
|
||||
<div className="row mb-3 d-none">
|
||||
<div className="col-sm-12">
|
||||
<input type="text" name="id" {...register("Id")} />
|
||||
<input type="text" name="id" {...register("id")} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -17,7 +17,9 @@ const ManageRole = ( {employeeId, onClosed} ) =>
|
||||
{
|
||||
|
||||
const disptach = useDispatch();
|
||||
useEffect(()=>{
|
||||
disptach(changeMaster("Application Role"));
|
||||
},[disptach])
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const { employeeRoles, loading } = useEmployeeRoles(employeeId);
|
||||
const { data, loading: roleLoading } = useMaster();
|
||||
|
||||
@ -40,7 +40,7 @@ const AssignRoleModel = ({ assignData, onClose }) => {
|
||||
const selectedProject = useSelector(
|
||||
(store) => store.localVariables.projectId
|
||||
);
|
||||
const { employees } = useEmployeesAllOrByProjectId(selectedProject);
|
||||
const { employees } = useEmployeesAllOrByProjectId(selectedProject,false);
|
||||
|
||||
const dispatch = useDispatch();
|
||||
const { data, loading } = useMaster();
|
||||
|
||||
@ -88,7 +88,7 @@ const BuildingModel = ({
|
||||
name: "",
|
||||
description: "",
|
||||
});
|
||||
if (data.Id !== "0") {
|
||||
if (data.Id !== null) {
|
||||
showToast("Building updated successfully.", "success");
|
||||
} else {
|
||||
showToast("Building created successfully.", "success");
|
||||
|
||||
@ -104,7 +104,7 @@ const FloorModel = ({
|
||||
reset({
|
||||
floorName: "",
|
||||
});
|
||||
if (data.id !== "0") {
|
||||
if (data.id !== null) {
|
||||
showToast("Floor updated successfully.", "success");
|
||||
} else {
|
||||
showToast("Floor created successfully.", "success");
|
||||
|
||||
@ -115,7 +115,7 @@ const WorkAreaModel = ({
|
||||
id: "0",
|
||||
areaName: "",
|
||||
});
|
||||
if (data.id !== "0") {
|
||||
if (WorkArea.id !== null) {
|
||||
showToast("WorkArea updated successfully.", "success");
|
||||
} else {
|
||||
showToast("WorkArea created successfully.", "success");
|
||||
|
||||
@ -14,7 +14,7 @@ const MapUsers = ({
|
||||
assignedLoading,
|
||||
setAssignedLoading,
|
||||
}) => {
|
||||
const { employeesList, loading: employeeLoading, error } = useAllEmployees();
|
||||
const { employeesList, loading: employeeLoading, error } = useAllEmployees(false);
|
||||
const [selectedEmployees, setSelectedEmployees] = useState([]);
|
||||
const [ searchText, setSearchText ] = useState( "" );
|
||||
|
||||
|
||||
@ -4,7 +4,7 @@ import { RolesRepository } from "../repositories/MastersRepository";
|
||||
import EmployeeRepository from "../repositories/EmployeeRepository";
|
||||
import ProjectRepository from "../repositories/ProjectRepository";
|
||||
|
||||
export const useAllEmployees = () => {
|
||||
export const useAllEmployees = (showInactive) => {
|
||||
const [employeesList, setEmployeeList] = useState([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState();
|
||||
@ -14,7 +14,7 @@ export const useAllEmployees = () => {
|
||||
let EmployeeList_cached = getCachedData("AllEmployees");
|
||||
if (!EmployeeList_cached) {
|
||||
setLoading(true);
|
||||
const response = await EmployeeRepository.getAllEmployeeList();
|
||||
const response = await EmployeeRepository.getAllEmployeeList(showInactive);
|
||||
cacheData("AllEmployees", response.data);
|
||||
setEmployeeList(response.data);
|
||||
setLoading(false);
|
||||
|
||||
@ -20,13 +20,14 @@ import {
|
||||
exportToPDF,
|
||||
} from "../../utils/tableExportUtils";
|
||||
import EmployeeRepository from "../../repositories/EmployeeRepository";
|
||||
import ManageEmployee from "../../components/Employee/ManageEmployee";
|
||||
|
||||
const EmployeeList = () => {
|
||||
const { profile: loginUser } = useProfile();
|
||||
const [selectedProject, setSelectedProject] = useState("");
|
||||
const { projects, loading: projectLoading } = useProjects();
|
||||
const [showInactive, setShowInactive] = useState(false);
|
||||
const ManageEmployee = useHasUserPermission(MANAGE_EMPLOYEES);
|
||||
const Manage_Employee = useHasUserPermission(MANAGE_EMPLOYEES);
|
||||
|
||||
const { employees, loading, setLoading, error, recallEmployeeData } =
|
||||
useEmployeesAllOrByProjectId(selectedProject, showInactive);
|
||||
@ -37,9 +38,11 @@ const EmployeeList = () => {
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
const [itemsPerPage] = useState(15);
|
||||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
|
||||
const [isEmployeeModalOpen, setIsEmployeeModalOpen] = useState(false);
|
||||
const [searchText, setSearchText] = useState("");
|
||||
const [filteredData, setFilteredData] = useState([]);
|
||||
const [showModal, setShowModal] = useState(false);
|
||||
const [selectedEmployeeId, setSelecedEmployeeId] = useState();
|
||||
|
||||
const navigate = useNavigate();
|
||||
|
||||
@ -91,13 +94,15 @@ const EmployeeList = () => {
|
||||
|
||||
const closeModal = () => {
|
||||
setIsCreateModalOpen(false);
|
||||
|
||||
const modalElement = document.getElementById("managerole-modal");
|
||||
if (modalElement) {
|
||||
if (modalElement && !showModal) {
|
||||
modalElement.classList.remove("show");
|
||||
modalElement.style.display = "none";
|
||||
document.body.classList.remove("modal-open");
|
||||
document.querySelector(".modal-backdrop").remove();
|
||||
}
|
||||
setShowModal(false);
|
||||
};
|
||||
const handleShow = () => setShowModal(true);
|
||||
const handleClose = () => setShowModal(false);
|
||||
@ -160,20 +165,34 @@ const EmployeeList = () => {
|
||||
recallEmployeeData(e.target.checked);
|
||||
};
|
||||
|
||||
const handleEmployeeModel = (id) => {
|
||||
setSelecedEmployeeId(id);
|
||||
setShowModal(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{isCreateModalOpen && (
|
||||
<ManageEmp employeeId={modelConfig} onClosed={closeModal} />
|
||||
)}
|
||||
|
||||
<div
|
||||
className={`modal fade ${showModal ? "show" : ""}`}
|
||||
className={`modal fade ${showModal ? "show" : ""} `}
|
||||
tabIndex="-1"
|
||||
role="dialog"
|
||||
style={{ display: showModal ? "block" : "none" }}
|
||||
aria-hidden={!showModal}
|
||||
>
|
||||
<SuspendEmp onClose={handleClose} />
|
||||
<div
|
||||
className="modal-dialog modal-xl modal-dialog-centered "
|
||||
>
|
||||
<div className="modal-content overflow-y-auto overflow-x-hidden"
|
||||
style={{ maxHeight: "90vh" }}>
|
||||
<ManageEmployee
|
||||
employeeId={selectedEmployeeId}
|
||||
onClosed={closeModal}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="container-xxl flex-grow-1 container-p-y">
|
||||
@ -301,21 +320,19 @@ const EmployeeList = () => {
|
||||
</ul>
|
||||
<button
|
||||
className={`btn btn-sm add-new btn-primary ${
|
||||
!ManageEmployee && "d-none"
|
||||
!Manage_Employee && "d-none"
|
||||
}`}
|
||||
tabIndex="0"
|
||||
type="button"
|
||||
onClick={() => {
|
||||
handleEmployeeModel(null);
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
<Link
|
||||
to="/employee/manage"
|
||||
className="dropdown-item"
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
<span className="d-none d-md-inline-block">
|
||||
Add New Employee
|
||||
</span>
|
||||
</Link>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
<span className="d-none d-md-inline-block">
|
||||
Add New Employee
|
||||
</span>
|
||||
</span>
|
||||
</button>{" "}
|
||||
</div>
|
||||
@ -332,12 +349,8 @@ const EmployeeList = () => {
|
||||
onChange={handleToggle}
|
||||
/>
|
||||
<span className="switch-toggle-slider">
|
||||
<span className="switch-on">
|
||||
<i className="icon-base bx bx-check"></i>
|
||||
</span>
|
||||
<span className="switch-off">
|
||||
<i className="icon-base bx bx-x"></i>
|
||||
</span>
|
||||
<span className="switch-on"></span>
|
||||
<span className="switch-off"></span>
|
||||
</span>
|
||||
<span className="switch-label">
|
||||
Show Inactive Employees
|
||||
@ -420,7 +433,7 @@ const EmployeeList = () => {
|
||||
</th>
|
||||
<th
|
||||
className={`sorting_disabled ${
|
||||
!ManageEmployee && "d-none"
|
||||
!Manage_Employee && "d-none"
|
||||
}`}
|
||||
rowSpan="1"
|
||||
colSpan="1"
|
||||
@ -535,7 +548,7 @@ const EmployeeList = () => {
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
{ManageEmployee && (
|
||||
{Manage_Employee && (
|
||||
<td className="text-end">
|
||||
<div className="dropdown">
|
||||
<button
|
||||
@ -553,12 +566,14 @@ const EmployeeList = () => {
|
||||
>
|
||||
<i className="bx bx-detail bx-sm"></i> View
|
||||
</button>
|
||||
<Link
|
||||
to={`/employee/manage/${item.id}`}
|
||||
<button
|
||||
className="dropdown-item py-1"
|
||||
onClick={() => {
|
||||
handleEmployeeModel(item.id);
|
||||
}}
|
||||
>
|
||||
<i className="bx bx-edit bx-sm"></i> Edit
|
||||
</Link>
|
||||
</button>
|
||||
{!item.isSystem && (
|
||||
<>
|
||||
<button
|
||||
|
||||
@ -1,31 +0,0 @@
|
||||
import React from "react";
|
||||
import ManageEmployee from "../../components/Employee/ManageEmployee";
|
||||
import Breadcrumb from "../../components/common/Breadcrumb";
|
||||
import { getCachedData } from "../../slices/apiDataManager";
|
||||
|
||||
const ManageEmp = () => {
|
||||
|
||||
const onEmployeeSubmt = () => {
|
||||
// console.log("employee submit clicked");
|
||||
};
|
||||
return (
|
||||
<div className="container-xxl flex-grow-1 container-p-y">
|
||||
<Breadcrumb
|
||||
data={[
|
||||
{ label: "Home", link: "/dashboard" },
|
||||
{ label: "Employees", link: "/employees" },
|
||||
{ label: "Manage", link: null },
|
||||
]}
|
||||
></Breadcrumb>
|
||||
|
||||
<div>
|
||||
<ManageEmployee
|
||||
employee={null}
|
||||
onSubmit={onEmployeeSubmt}
|
||||
></ManageEmployee>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ManageEmp;
|
||||
@ -14,7 +14,7 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
|
||||
"tenant",
|
||||
"tenantId",
|
||||
"checkLists",
|
||||
"isSystem"
|
||||
"isSystem",
|
||||
];
|
||||
|
||||
const safeData = Array.isArray(data) ? data : [];
|
||||
@ -82,7 +82,7 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
|
||||
<tbody>
|
||||
{currentItems.length > 0 ? (
|
||||
currentItems.map((item, index) => (
|
||||
<tr key={index} >
|
||||
<tr key={index}>
|
||||
<td style={{ width: "20px" }}>
|
||||
<i className="bx bx-right-arrow-alt"></i>
|
||||
</td>
|
||||
@ -107,30 +107,36 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
|
||||
)}
|
||||
</td>
|
||||
))}
|
||||
<td className={`${!hasMasterPermission && "d-none"}`}>
|
||||
<button
|
||||
aria-label="Modify"
|
||||
type="button"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#master-modal"
|
||||
className="btn p-0 dropdown-toggle hide-arrow"
|
||||
onClick={() =>
|
||||
handleModalData(`Edit-${selectedMaster}`, item)
|
||||
}
|
||||
>
|
||||
<i className="bx bxs-edit me-2 text-primary"></i>
|
||||
</button>
|
||||
<td className={!hasMasterPermission ? "d-none" : ""}>
|
||||
{selectedMaster === "Application Role" && item?.isSystem ? (
|
||||
"--"
|
||||
) : (
|
||||
<>
|
||||
<button
|
||||
aria-label="Modify"
|
||||
type="button"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#master-modal"
|
||||
className="btn p-0 dropdown-toggle hide-arrow"
|
||||
onClick={() =>
|
||||
handleModalData(`Edit-${selectedMaster}`, item)
|
||||
}
|
||||
>
|
||||
<i className="bx bxs-edit me-2 text-primary"></i>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Delete"
|
||||
type="button"
|
||||
className="btn p-0 dropdown-toggle hide-arrow"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#master-modal"
|
||||
onClick={() => handleModalData("delete", item)}
|
||||
>
|
||||
<i className="bx bx-trash me-1 text-danger"></i>
|
||||
</button>
|
||||
<button
|
||||
aria-label="Delete"
|
||||
type="button"
|
||||
className="btn p-0 dropdown-toggle hide-arrow"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#master-modal"
|
||||
onClick={() => handleModalData("delete", item)}
|
||||
>
|
||||
<i className="bx bx-trash me-1 text-danger"></i>
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
@ -144,7 +150,7 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
|
||||
)}
|
||||
|
||||
{/* Pagination */}
|
||||
{!loading && safeData.length > 20 && (
|
||||
{!loading && safeData.length > 20 && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
|
||||
|
||||
@ -7,9 +7,7 @@ const EmployeeRepository = {
|
||||
searchEmployees: (query) =>
|
||||
api.get(`/api/employee/search/${query}`),
|
||||
manageEmployee: (data) =>
|
||||
api.post("/api/employee/manage", data, {
|
||||
"Content-Type": "multipart/form-data",
|
||||
}),
|
||||
api.post("/api/employee/manage", data),
|
||||
updateEmployee: (id, data) => api.put(`/users/${id}`, data),
|
||||
// deleteEmployee: ( id ) => api.delete( `/users/${ id }` ),
|
||||
getEmployeeProfile:(id)=>api.get(`/api/employee/profile/get/${id}`),
|
||||
|
||||
@ -18,7 +18,7 @@ import ProjectList from "../pages/project/ProjectList";
|
||||
import ProjectDetails from "../pages/project/ProjectDetails";
|
||||
import ManageProject from "../components/Project/ManageProject";
|
||||
import EmployeeList from "../pages/employee/EmployeeList";
|
||||
import ManageEmp from "../pages/employee/ManageEmp";
|
||||
// import ManageEmp from "../pages/employee/ManageEmp";
|
||||
import EmployeeProfile from "../pages/employee/EmployeeProfile";
|
||||
import Inventory from "../pages/project/Inventory";
|
||||
import AttendancePage from "../pages/Activities/AttendancePage";
|
||||
@ -63,8 +63,8 @@ const router = createBrowserRouter(
|
||||
{ path: "/project/manage/:projectId", element: <ManageProject /> },
|
||||
{ path: "/employees", element: <EmployeeList /> },
|
||||
{ path: "/employee/:employeeId", element: <EmployeeProfile /> },
|
||||
{ path: "/employee/manage", element: <ManageEmp /> },
|
||||
{path: "/employee/manage/:employeeId", element: <ManageEmp />},
|
||||
// { path: "/employee/manage", element: <ManageEmp /> },
|
||||
// {path: "/employee/manage/:employeeId", element: <ManageEmp />},
|
||||
{ path: "/directory", element: <Directory /> },
|
||||
{ path: "/inventory", element: <Inventory /> },
|
||||
{ path: "/activities/attendance", element: <AttendancePage /> },
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user