changed modal , added global model

src/components/Employee/ManageEmployee.jsx

@@ -233,24 +233,14 @@ const ManageEmployee = ({ employeeId, onClosed }) => {
 
   return (
     <>
-      <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"}
-              </h6>
-
-              <span className="cursor-pointer fs-6" onClick={() => onClosed()}>
-                <i className="bx bx-x"></i>
-              </span>
-            </div>
-            <div className="card-body">
+     
+            {/* <div className="c">
               {!currentEmployee && empLoading && employeeId && (
                 <p>Loading Employee Data...</p>
-              )}
+              )} */}
 
-              <form onSubmit={handleSubmit(onSubmit)}>
+      <form onSubmit={handleSubmit( onSubmit )} className="p-sm-0 p-2">
+        <div className="text-center"><p className="fs-6 fw-semibold"> {employee ? "Update Employee" : "Create Employee"}</p></div>
                 <div className="row mb-3">
                   <div className="col-sm-4">
                     {" "}
@@ -646,10 +636,7 @@ const ManageEmployee = ({ employeeId, onClosed }) => {
                   </div>
                 </div>
               </form>
-            </div>
-          </div>
-        </div>
-      </div>
+          
     </>
   );
 };

src/pages/employee/EmployeeList.jsx

@@ -25,6 +25,7 @@ import ConfirmModal from "../../components/common/ConfirmModal";
 import { useSelector } from "react-redux";
 import eventBus from "../../services/eventBus";
 import { newlineChars } from "pdf-lib";
+import GlobalModel from "../../components/common/GlobalModel";
 
 const EmployeeList = () => {
   const selectedProjectId = useSelector((store) => store.localVariables.projectId);
@@ -239,7 +240,7 @@ const EmployeeList = () => {
       {isCreateModalOpen && (
         <ManageEmp employeeId={modelConfig} onClosed={closeModal} />
       )}
-      {showModal && (<div
+      {/* {showModal && (<div
         className={`modal fade ${showModal ? "show" : ""} `}
         tabIndex="-1"
         role="dialog"
@@ -257,7 +258,16 @@ const EmployeeList = () => {
             />
           </div>
         </div>
-      </div>)}
+      </div> )} */}
+      
+      {showModal && (
+        <GlobalModel isOpen={showModal} size="lg" closeModal={()=>setShowModal(false)}>
+           <ManageEmployee
+              employeeId={selectedEmployeeId}
+              onClosed={()=>setShowModal(false)}
+            />
+        </GlobalModel>
+     )}
 
       {IsDeleteModalOpen && (
         <div