diff --git a/src/components/Dashboard/Dashboard.jsx b/src/components/Dashboard/Dashboard.jsx index 46bd2197..fd970c1a 100644 --- a/src/components/Dashboard/Dashboard.jsx +++ b/src/components/Dashboard/Dashboard.jsx @@ -200,7 +200,6 @@ const Dashboard = () => {
+
+
Coming Soon
+
+
+ + + ) +} + +export default SuspendEmp \ No newline at end of file diff --git a/src/components/Layout/Header.jsx b/src/components/Layout/Header.jsx index ae380b24..dcaa306f 100644 --- a/src/components/Layout/Header.jsx +++ b/src/components/Layout/Header.jsx @@ -6,9 +6,8 @@ import {changeMaster} from "../../slices/localVariablesSlice"; import useMaster from "../../hooks/masterHook/useMaster"; import {useProfile} from "../../hooks/useProfile"; import {useNavigate} from "react-router-dom"; - -const Header = () => -{ +import Avatar from "../../components/common/Avatar"; +const Header = () =>{ const {profile} = useProfile() const dispatch = useDispatch( changeMaster( "Job Role" ) ) const {data, loading} = useMaster() @@ -88,11 +87,9 @@ const Header = () => data-bs-toggle="dropdown" >
- avatar-image
@@ -106,11 +103,9 @@ const Header = () =>
- avatar-image
diff --git a/src/components/common/Avatar.jsx b/src/components/common/Avatar.jsx index a09d97d3..537af159 100644 --- a/src/components/common/Avatar.jsx +++ b/src/components/common/Avatar.jsx @@ -1,6 +1,22 @@ -import React from "react"; +import React, { useState, useEffect } from "react"; -const Avatar = ({ firstName, lastName }) => { +// A simple hash function to generate a deterministic value from the name +function hashString(str) { + let hash = 0; + for (let i = 0; i < str.length; i++) { + const char = str.charCodeAt(i); + hash = (hash << 5) - hash + char; + } + return hash; +} + +const Avatar = ({ firstName, lastName, size='sm' }) => { + // Combine firstName and lastName to create a unique string for hashing + const fullName = `${firstName} ${lastName}`; + + const [bgClass, setBgClass] = useState(""); + + // Function to generate the avatar text function generateAvatarText(firstName, lastName) { if (!firstName) return ""; if (!lastName || lastName.trim() === "") { @@ -9,7 +25,8 @@ const Avatar = ({ firstName, lastName }) => { return `${firstName[0]}${lastName[0]}`.toUpperCase(); } - function getRandomBootstrapBgClass() { + // Function to map the hash value to a Bootstrap background class + function getBgClassFromHash(hash) { const bgClasses = [ "bg-primary", "bg-secondary", @@ -21,21 +38,27 @@ const Avatar = ({ firstName, lastName }) => { "text-light", ]; - const randomIndex = Math.floor(Math.random() * bgClasses.length); - return bgClasses[randomIndex]; + // Use the hash value to pick a background color from the array + const index = Math.abs(hash % bgClasses.length); + return bgClasses[index]; } + + useEffect(() => { + // Generate the hash from the full name and map it to a background class + const hash = hashString(fullName); + setBgClass(getBgClassFromHash(hash)); + }, [fullName]); // Re-run if the fullName changes + return ( - <> -
-
- - {generateAvatarText(firstName, lastName)} - -
+
+
+ + {generateAvatarText(firstName, lastName)} +
- +
); }; diff --git a/src/pages/employee/EmployeeList.jsx b/src/pages/employee/EmployeeList.jsx index 0e0f87a6..301e61a7 100644 --- a/src/pages/employee/EmployeeList.jsx +++ b/src/pages/employee/EmployeeList.jsx @@ -10,6 +10,7 @@ import { useProfile } from "../../hooks/useProfile"; import { hasUserPermission } from "../../utils/authUtils"; import { MANAGE_EMPLOYEES } from "../../utils/constants"; import { useHasUserPermission } from "../../hooks/useHasUserPermission"; +import SuspendEmp from "../../components/Employee/SuspendEmp"; const EmployeeList = () => { @@ -26,10 +27,11 @@ const EmployeeList = () => const [employeeList, setEmployeeList] = useState([]); const [modelConfig, setModelConfig] = useState(); const [currentPage, setCurrentPage] = useState(1); - const [itemsPerPage] = useState(5); + const [itemsPerPage] = useState(10); const [isCreateModalOpen, setIsCreateModalOpen] = useState(false); const [searchText, setSearchText] = useState(""); - const [filteredData, setFilteredData] = useState([]); + const [ filteredData, setFilteredData ] = useState( [] ); + const [showModal, setShowModal] = useState(false); const navigate = useNavigate(); const handleSearch = (e) => { @@ -74,7 +76,6 @@ const EmployeeList = () => const closeModal = () => { setIsCreateModalOpen(false); - const modalElement = document.getElementById("managerole-modal"); if (modalElement) { modalElement.classList.remove("show"); @@ -83,7 +84,9 @@ const EmployeeList = () => document.querySelector(".modal-backdrop").remove(); } }; - + const handleShow = () => setShowModal(true); + const handleClose = () => setShowModal( false ); + const handleConfigData = (config) => { setModelConfig(config); }; @@ -99,6 +102,17 @@ const EmployeeList = () => {isCreateModalOpen && ( )} + +
+ +
+
className="dropdown-item" href="#" > - - Print - - -
  • - - - Csv - -
    • -
  • - - - Excel - -
    • - -
  • - - - Pdf + {/* */} + Coming Soon
    • @@ -442,7 +429,7 @@ const EmployeeList = () => > Edit -
    + -