diff --git a/public/assets/css/core-extend.css b/public/assets/css/core-extend.css index c017c963..327febfa 100644 --- a/public/assets/css/core-extend.css +++ b/public/assets/css/core-extend.css @@ -3,10 +3,6 @@ --bs-nav-link-font-size: 0.7375rem; } -.nav { - --bs-nav-link-font-size: 0.7375rem; -} - .card-header { padding: 0.5rem var(--bs-card-cap-padding-x); } diff --git a/src/pages/employee/AttendancesEmployeeRecords.jsx b/src/components/Employee/EmpAttendance.jsx similarity index 83% rename from src/pages/employee/AttendancesEmployeeRecords.jsx rename to src/components/Employee/EmpAttendance.jsx index 9b3b7b06..f94b3a8a 100644 --- a/src/pages/employee/AttendancesEmployeeRecords.jsx +++ b/src/components/Employee/EmpAttendance.jsx @@ -1,24 +1,30 @@ import React, { useState, useEffect } from "react"; import moment from "moment"; -import DateRangePicker from "../../components/common/DateRangePicker"; +import DateRangePicker from "../common/DateRangePicker"; import { useDispatch, useSelector } from "react-redux"; import { fetchEmployeeAttendanceData } from "../../slices/apiSlice/employeeAttendanceSlice"; import usePagination from "../../hooks/usePagination"; -import Avatar from "../../components/common/Avatar"; +import Avatar from "../common/Avatar"; import { convertShortTime } from "../../utils/dateUtils"; -import RenderAttendanceStatus from "../../components/Activities/RenderAttendanceStatus"; -import AttendLogs from "../../components/Activities/AttendLogs"; +import RenderAttendanceStatus from "../Activities/RenderAttendanceStatus"; +import AttendLogs from "../Activities/AttendLogs"; import { useAttendanceByEmployee } from "../../hooks/useAttendance"; -import GlobalModel from "../../components/common/GlobalModel"; +import GlobalModel from "../common/GlobalModel"; import { ITEMS_PER_PAGE } from "../../utils/constants"; -const AttendancesEmployeeRecords = ({ employee }) => { +const EmpAttendance = ({ employee }) => { const [attendances, setAttendnaces] = useState([]); const [selectedDate, setSelectedDate] = useState(""); const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" }); const [isModalOpen, setIsModalOpen] = useState(false); const [attendanceId, setAttendanecId] = useState(); - const {data =[],isLoading:loading,isFetching,error,refetch} = useAttendanceByEmployee(employee,dateRange.startDate, dateRange.endDate) + const { + data = [], + isLoading: loading, + isFetching, + error, + refetch, + } = useAttendanceByEmployee(employee, dateRange.startDate, dateRange.endDate); const dispatch = useDispatch(); // const { data, loading, error } = useSelector( @@ -75,16 +81,24 @@ const AttendancesEmployeeRecords = ({ employee }) => { const uniqueMap = new Map(); [...group1, ...group2, ...group3, ...group4, ...group5].forEach((rec) => { - const date = moment(rec.checkInTime || rec.checkOutTime).format("YYYY-MM-DD"); + const date = moment(rec.checkInTime || rec.checkOutTime).format( + "YYYY-MM-DD" + ); const key = `${rec.employeeId}-${date}`; const existing = uniqueMap.get(key); - if (!existing || new Date(rec.checkInTime || rec.checkOutTime) > new Date(existing.checkInTime || existing.checkOutTime)) { + if ( + !existing || + new Date(rec.checkInTime || rec.checkOutTime) > + new Date(existing.checkInTime || existing.checkOutTime) + ) { uniqueMap.set(key, rec); } }); - const sortedFinalList = [...uniqueMap.values()].sort((a, b) => - new Date(b.checkInTime || b.checkOutTime) - new Date(a.checkInTime || a.checkOutTime) + const sortedFinalList = [...uniqueMap.values()].sort( + (a, b) => + new Date(b.checkInTime || b.checkOutTime) - + new Date(a.checkInTime || a.checkOutTime) ); const currentDate = new Date().toLocaleDateString("en-CA"); @@ -93,8 +107,6 @@ const AttendancesEmployeeRecords = ({ employee }) => { ITEMS_PER_PAGE ); - - const openModal = (id) => { setAttendanecId(id); setIsModalOpen(true); @@ -103,25 +115,28 @@ const AttendancesEmployeeRecords = ({ employee }) => { return ( <> - - {isModalOpen && ( - - + + )} -
+
- +
refetch()} @@ -214,8 +229,9 @@ const AttendancesEmployeeRecords = ({ employee }) => { {[...Array(totalPages)].map((_, index) => (
    • ))}
  • +
    • +
  • + {profile?.id == loggedInUser?.employeeInfo?.id && ( + + )} +
    • + +
    +
    +
    +
    + + ); +}; + +export default EmpBanner; diff --git a/src/components/Employee/EmpDashboard.jsx b/src/components/Employee/EmpDashboard.jsx new file mode 100644 index 00000000..c11f6e20 --- /dev/null +++ b/src/components/Employee/EmpDashboard.jsx @@ -0,0 +1,37 @@ +import React from "react"; +import Avatar from "../common/Avatar"; +import EmpOverview from "./EmpOverview"; + +const EmpDashboard = ({ profile }) => { + return ( + <> +
    +
    + {" "} + +
    +
    +
    + {" "} +
    + + My Projects + {" "} +
    +
    +
    +
    +
    +
    + + My Expences + {" "} +
    {" "} +
    +
    +
    + + ); +}; + +export default EmpDashboard; diff --git a/src/components/Employee/EmpOverview.jsx b/src/components/Employee/EmpOverview.jsx new file mode 100644 index 00000000..90b6fbb9 --- /dev/null +++ b/src/components/Employee/EmpOverview.jsx @@ -0,0 +1,111 @@ +import React from "react"; +import Avatar from "../common/Avatar"; +import { useProfile } from "../../hooks/useProfile"; + +const EmpOverview = ({ profile }) => { + const { loggedInUserProfile } = useProfile(); + console.log(loggedInUserProfile); + console.log(profile); + return ( + <> + {" "} +
    +
    +
    +
    + + About + +
      +
    • + + Full Name:{" "} + {`${profile?.firstName} ${profile?.lastName}`} +
      • +
    • + + Status:{" "} + Active +
      • +
    • + + Role:{" "} + {profile?.jobRole || NA} +
      • +
    • + + Gender:{" "} + {profile?.gender || NA} +
      • {" "} +
    • + + Birth Date:{" "} + + {profile?.birthDate ? ( + new Date(profile.birthDate).toLocaleDateString() + ) : ( + NA + )} + +
      • +
    • + + Joining Date:{" "} + + {profile?.joiningDate ? ( + new Date(profile.joiningDate).toLocaleDateString() + ) : ( + NA + )} + +
      • +
    + + Contacts + +
      +
    • + + Contact:{" "} + {profile?.phoneNumber || NA} +
      • +
    • + + Email:{" "} + + {" "} + {profile?.email || NA} + +
      • +
    • + + + {" "} + Emergency Contact: + {" "} + {profile?.emergencyContactPerson || NA} +
      • +
    • + + Emergency Phone:{" "} + {profile?.emergencyPhoneNumber || NA} +
      • +
    • +
      +
      + Address: +
      +
      + {profile?.currentAddress || NA} +
      +
      +
      • +
    +
    +
    +
    +
    + + ); +}; +export default EmpOverview; diff --git a/src/components/Employee/EmployeeNav.jsx b/src/components/Employee/EmployeeNav.jsx index 32c94b20..a7f02b64 100644 --- a/src/components/Employee/EmployeeNav.jsx +++ b/src/components/Employee/EmployeeNav.jsx @@ -5,6 +5,20 @@ const EmployeeNav = ({ onPillClick, activePill }) => {
    )} @@ -457,4 +462,4 @@ const Header = () => { ); }; -export default Header; \ No newline at end of file +export default Header; diff --git a/src/pages/employee/EmployeeList.jsx b/src/pages/employee/EmployeeList.jsx index 73ef5901..86af49a9 100644 --- a/src/pages/employee/EmployeeList.jsx +++ b/src/pages/employee/EmployeeList.jsx @@ -51,7 +51,8 @@ const EmployeeList = () => { const { employees, loading, setLoading, error, recallEmployeeData } = useEmployeesAllOrByProjectId( - showAllEmployees ,selectedProjectId, + showAllEmployees, + selectedProjectId, showInactive ); @@ -153,8 +154,6 @@ const EmployeeList = () => { } }; - - const handleAllEmployeesToggle = (e) => { const isChecked = e.target.checked; setShowInactive(false); @@ -295,450 +294,449 @@ const EmployeeList = () => { {ViewTeamMember ? ( //
    -
    -
    -
    -
    - {/* Switches: All Employees + Inactive */} -
    - {/* All Employees Switch */} - {ViewAllEmployee && ( -
    - - -
    - )} - - {/* Show Inactive Employees Switch */} - {showAllEmployees && ( -
    - setShowInactive(e.target.checked)} - /> - -
    - )} -
    - - {/* Right side: Search + Export + Add Employee */} -
    - {/* Search Input - ALWAYS ENABLED */} -
    -
    +
    +
    + - - - - - - - + /> + + - - - - - - - {loading && ( - - - - )} - {/* Conditional messages for no data or no search results */} - {!loading && - displayData?.length === 0 && - searchText && - !showAllEmployees ? ( - - - - ) : null} - {!loading && - displayData?.length === 0 && - (!searchText || showAllEmployees) ? ( - - - - ) : null} + Print + + +
  • + handleExport("csv")} + > + CSV + +
    • +
  • + handleExport("excel")} + > + Excel + +
    • +
  • + handleExport("pdf")} + > + PDF + +
    • + + - {/* Render current items */} - {currentItems && - !loading && - currentItems.map((item) => ( - - - - {Manage_Employee && ( - - )} - - ))} - -
    + {/* Search Input - ALWAYS ENABLED */} +
    +
    		-
    Email
    -     		-
    Contact
    -     		-
    Official Designation
    -     		- Joining Date - - Status - - Actions -
    -

    Loading...

    -
    - - '{searchText}' employee not found - {" "} -
    + +
    - + + + + + + + + + + + + + + + + {loading && ( + + + + )} + {/* Conditional messages for no data or no search results */} + {!loading && + displayData?.length === 0 && + searchText && + !showAllEmployees ? ( + + + + ) : null} + {!loading && + displayData?.length === 0 && + (!searchText || showAllEmployees) ? ( + + + + ) : null} + + {/* Render current items */} + {currentItems && + !loading && + currentItems.map((item) => ( + + + + + + + + + {Manage_Employee && ( + - - - + )} + + ))} + +
    +
    Name
    +     		+
    Email
    +     		+
    Contact
    +     		+
    + Official Designation +
    +     		+ Joining Date + + Status + + Actions +
    +

    Loading...

    +
    + + '{searchText}' employee not found + {" "} +
    + No Data Found +
    + + + {item.email ? ( + + + {item.email} + + ) : ( + + NA + + )} + + + + {item.phoneNumber} + + + + + {item.jobRole || "Not Assign Yet"} + + + {moment(item.joiningDate)?.format("DD-MMM-YYYY")} + + {showInactive ? ( + + Inactive + + ) : ( + + Active + + )} + +
    + +
    + + + {!item.isSystem && ( + <> + + + + )}
    		- {item.email ? ( - - - {item.email} - - ) : ( - - NA - - )} - - - - {item.phoneNumber} - - - - - {item.jobRole || "Not Assign Yet"} - -
    -     		- {moment(item.joiningDate)?.format("DD-MMM-YYYY")} - - {showInactive ? ( - - Inactive - - ) : ( - - Active - - )} - -
    - -
    - - - {!item.isSystem && ( - <> - - - - )} -
    -
    -
    +
    -
    - - {/* Pagination */} - {!loading && displayData.length > ITEMS_PER_PAGE && ( -
    + ))} + +
  • + +
    • + + + )}
    - //
    +
    ) : ( + //
    diff --git a/src/pages/employee/EmployeeProfile.jsx b/src/pages/employee/EmployeeProfile.jsx index fd94c668..a5f4b722 100644 --- a/src/pages/employee/EmployeeProfile.jsx +++ b/src/pages/employee/EmployeeProfile.jsx @@ -1,26 +1,25 @@ import React, { useState, useEffect } from "react"; -import EmpProfile from "../../components/Employee/EmpProfile"; -import axios from "axios"; -import Breadcrumb from "../../components/common/Breadcrumb"; -import EmployeeNav from "../../components/Employee/EmployeeNav"; -import { useSearchParams, useParams } from "react-router-dom"; -import { getCachedData } from "../../slices/apiDataManager"; +import { useSearchParams, useParams, useNavigate } from "react-router-dom"; +import { useSelector } from "react-redux"; + import { useEmployeeProfile, useEmployees, useEmployeesByProject, } from "../../hooks/useEmployees"; import { useProfile } from "../../hooks/useProfile"; +import { getCachedData } from "../../slices/apiDataManager"; -import { useSelector } from "react-redux"; import EmployeeRepository from "../../repositories/EmployeeRepository"; import { ComingSoonPage } from "../Misc/ComingSoonPage"; -import { useNavigate } from "react-router-dom"; -import Avatar from "../../components/common/Avatar"; -import AttendancesEmployeeRecords from "./AttendancesEmployeeRecords"; + +import Breadcrumb from "../../components/common/Breadcrumb"; +import EmployeeNav from "../../components/Employee/EmployeeNav"; +import EmpProfile from "../../components/Employee/EmpProfile"; +import EmpAttendance from "../../components/Employee/EmpAttendance"; import ManageEmployee from "../../components/Employee/ManageEmployee"; -import { useChangePassword } from "../../components/Context/ChangePasswordContext"; -import GlobalModel from "../../components/common/GlobalModel"; +import EmpBanner from "../../components/Employee/EmpBanner"; +import EmpDashboard from "../../components/Employee/EmpDashboard"; const EmployeeProfile = () => { const { profile } = useProfile(); @@ -32,7 +31,7 @@ const EmployeeProfile = () => { const [SearchParams] = useSearchParams(); const tab = SearchParams.get("for"); - const [activePill, setActivePill] = useState(tab); + const [activePill, setActivePill] = useState(tab || "profile"); const [currentEmployee, setCurrentEmployee] = useState(); const [showModal, setShowModal] = useState(false); @@ -40,8 +39,6 @@ const EmployeeProfile = () => { setActivePill(pillKey); }; - - const fetchEmployeeProfile = async (employeeID) => { try { const resp = await EmployeeRepository.getEmployeeProfile(employeeID); @@ -62,10 +59,17 @@ const EmployeeProfile = () => { const renderContent = () => { if (loading) return
    Loading
    ; switch (activePill) { + case "profile": { + return ( + <> + + + ); + } case "attendance": { return ( <> - + ); } @@ -98,14 +102,8 @@ const EmployeeProfile = () => { if (loading) { return
    Loading...
    ; } - const { openChangePassword } = useChangePassword(); return ( <> - {showModal && ( - setShowModal(false)}> - setShowModal(false)} /> - - )}
    { { label: "Profile", link: null }, ]} > -
    -
    -
    -
    -
    -
    -
    -
    - -
    -

    {`${currentEmployee?.firstName} ${currentEmployee?.lastName}`}

    -
    -
    -
    -
    -
    - Employee Info -
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
    Email: - {currentEmployee?.email || NA} -
    - Phone Number: - - {currentEmployee?.phoneNumber || NA} -
    - Emergency Contact Person: - - {currentEmployee?.emergencyContactPerson || NA} -
    - Emergency Contact Number: - - {currentEmployee?.emergencyPhoneNumber || NA} -
    - Gender: - - {currentEmployee?.gender || NA} -
    - Birth Date: - - {currentEmployee?.birthDate ? ( - new Date( - currentEmployee.birthDate - ).toLocaleDateString() - ) : ( - NA - )} -
    - Joining Date: - - {currentEmployee?.joiningDate ? ( - new Date( - currentEmployee.joiningDate - ).toLocaleDateString() - ) : ( - NA - )} -
    - Job Role: - - {currentEmployee?.jobRole || NA} -
    - Address: - - {currentEmployee?.currentAddress || NA} -
    -
    - - {currentEmployee?.id == profile?.employeeInfo?.id && ( - - )} -
    -
    -
    -
    -
    -
    +
    +
    - -
    -
    - -
    -
    +
    {" "} +
    +
    + +
    +
    +
    +
    +
    {renderContent()}