admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Correction in EmpReportingManger.

Browse Source
This commit is contained in:
Kartik Sharma 2025-11-13 12:33:50 +05:30
parent 8453a09426
commit c4b589460a
3 changed files with 47 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Employee/EmpDashboard.jsx
View File

@ -83,9 +83,12 @@ const EmpDashboard = ({ profile }) => {
</div> </div>
</div> </div>
<div className="col-12 col-sm-6 pt-5"> <div className="col-12 col-sm-6 pt-5">
{" "} <EmpReportingManager
<EmpReportingManager employeeId={profile?.id}></EmpReportingManager> employeeId={profile?.id}
employee={profile}
/>
</div> </div>
</div> </div>
</> </>
); );

82
src/components/Employee/EmpReportingManager.jsx
View File

@ -2,61 +2,59 @@ import React, { useState } from "react";
import { useOrganizationHierarchy } from "../../hooks/useEmployees"; import { useOrganizationHierarchy } from "../../hooks/useEmployees";
import GlobalModel from "../common/GlobalModel"; import GlobalModel from "../common/GlobalModel";
import ManageReporting from "./ManageReporting"; import ManageReporting from "./ManageReporting";
import Avatar from "../common/Avatar";
import { SpinnerLoader } from "../common/Loader";
const EmpReportingManager = ({ employeeId, employee }) => { const EmpReportingManager = ({ employeeId, employee }) => {
const { data, isLoading } = useOrganizationHierarchy(employeeId); const { data, isLoading } = useOrganizationHierarchy(employeeId);
const [showManageReportingModal, setShowManageReportingModal] = useState(false); const [showManageReportingModal, setShowManageReportingModal] = useState(false);
if (isLoading) return <span>Loading...</span>; if (isLoading)
return (
<div className="d-flex justify-content-center py-5">
<SpinnerLoader />
</div>
);
const primary = data?.find((item) => item.isPrimary); // Safe access to primary and secondary managers
const secondary = data?.filter((item) => !item.isPrimary); const primaryManager = data?.find((d) => d.isPrimary)?.reportTo;
const secondaryManagers = data?.filter((d) => !d.isPrimary).map((d) => d.reportTo) || [];
// Create comma-separated string for secondary managers
const secondaryNames = secondary
?.map((item) => `${item.reportTo?.firstName || ""} ${item.reportTo?.lastName || ""}`.trim())
.join(", ");
return ( return (
<div className="row"> <div className="row">
<div className="col-12 mb-4"> <div className="col-12 mb-4">
<div className="card"> <div className="card">
<div className="card-body"> <div className="card-body">
<h5 className="m-0 py-1 mb-3"> <small className="card-text text-uppercase text-body-secondary small d-block text-start mb-3">
Update Reporting Manager Reporting Manager
</small>
</h5> <div className="text-start">
{/* Primary Manager */}
<div className="row mb-2 align-items-start">
<div className="col-auto text-end pe-3"><i className="bx bx-user-circle me-1"></i>Primary Manager<span style={{ marginLeft: "50px" }}>:</span></div>
<div className="col text-wrap">
{primaryManager
? `${primaryManager.firstName || ""} ${primaryManager.lastName || ""}`
: "NA"}
</div>
</div>
{/* Secondary Managers */}
{/* Primary Reporting Manager */} {secondaryManagers?.length > 0 && (
<div className="d-flex align-items-start mb-3"> <div className="row mb-3 align-items-start">
<span className="d-flex"> <div className="col-auto text-end pe-3"><i className="bx bx-group me-1"></i>Secondary Managers<span style={{ marginLeft: "25px" }}>:</span></div>
<i className="bx bx-user bx-xs me-2 mt-1"></i> <div className="col text-wrap">
<span>Primary Reporting Manager</span> {secondaryManagers
</span> .map((m) => `${m.firstName || ""} ${m.lastName || ""}`)
<span style={{ marginLeft: "75px" }}>:</span> .join(", ")}
<span className="ms-5"> </div>
{primary?.reportTo?.firstName || <em>NA</em>}{" "} </div>
{primary?.reportTo?.lastName || ""} )}
</span>
</div> </div>
{/* Secondary Reporting Manager (comma-separated) */} {/* Manage Reporting Button */}
{secondary?.length > 0 && ( <div className="mt-5 text-end" >
<div className="d-flex align-items-start mb-3" style={{ textAlign: "left" }}>
<span className="d-flex">
<i className="bx bx-user bx-xs me-2 mt-1"></i>
<span>Secondary Reporting Manager</span>
</span>
<span style={{ marginLeft: "57px" }}>:</span>
<span className="ms-5" >
{secondaryNames || <em>NA</em>}
</span>
</div>
)}
{/* Open Modal Button */}
<div className="mt-3 text-end">
<button <button
className="btn btn-sm btn-primary" className="btn btn-sm btn-primary"
onClick={() => setShowManageReportingModal(true)} onClick={() => setShowManageReportingModal(true)}
@ -68,18 +66,17 @@ const EmpReportingManager = ({ employeeId, employee }) => {
</div> </div>
</div> </div>
{/* ManageReporting Modal */} {/* Manage Reporting Modal */}
{showManageReportingModal && ( {showManageReportingModal && (
<GlobalModel <GlobalModel
isOpen={showManageReportingModal} isOpen={showManageReportingModal}
closeModal={() => setShowManageReportingModal(false)} closeModal={() => setShowManageReportingModal(false)}
> >
<ManageReporting <ManageReporting
employee={employee}
employeeId={employeeId} employeeId={employeeId}
employee={primary?.employee || {}}
onClosed={() => setShowManageReportingModal(false)} onClosed={() => setShowManageReportingModal(false)}
/> />
</GlobalModel> </GlobalModel>
)} )}
</div> </div>
@ -87,3 +84,4 @@ const EmpReportingManager = ({ employeeId, employee }) => {
}; };
export default EmpReportingManager; export default EmpReportingManager;

2
src/components/Employee/ManageReporting.jsx
View File

@ -110,7 +110,7 @@ const ManageReporting = ({ onClosed, employee, employeeId }) => {
{/* Employee Name + Role */} {/* Employee Name + Role */}
<div className="d-flex flex-column"> <div className="d-flex flex-column">
<div className="d-flex align-items-center gap-2"> <div className="d-flex align-items-center gap-2">
<span className="fw-semibold text-dark fs-6 me-1"> <span className="fw-semibold text-dark fs-6 me-1 cursor-pointer" onClick={handleClick}>
{`${employee.firstName || ""} ${employee.middleName || ""} ${employee.lastName || ""}`.trim() || "Employee Name NA"} {`${employee.firstName || ""} ${employee.middleName || ""} ${employee.lastName || ""}`.trim() || "Employee Name NA"}
</span> </span>