Added new modal in tracker

src/pages/ProjectTracker/ProjectTracker.js

@@ -6,7 +6,6 @@ import { Link, useParams } from "react-router-dom";
 import {
   activeLoader,
   addNewTagToProject,
-  deletePersonOnProject,
   deleteTagProject,
   filterCreatedByMe,
   filteredExecutorTasks,
@@ -34,6 +33,7 @@ import BaseButton from "@components/Common/BaseButton/BaseButton";
 import { Footer } from "@components/Common/Footer/Footer";
 import { Loader } from "@components/Common/Loader/Loader";
 import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
+import ListEmployees from "@components/Modal/Tracker/ListEmployees/ListEmployees";
 import ModalTicket from "@components/Modal/Tracker/ModalTicket/ModalTicket";
 import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal";
 import { Navigation } from "@components/Navigation/Navigation";
@@ -261,18 +261,6 @@ export const ProjectTracker = () => {
     });
   }
 
-  function deletePerson(userId) {
-    apiRequest("/project/del-user", {
-      method: "DELETE",
-      data: {
-        project_id: projectBoard.id,
-        user_id: userId
-      }
-    }).then(() => {
-      dispatch(deletePersonOnProject(userId));
-    });
-  }
-
   function filterParticipateTasks() {
     if (!checkBoxParticipateTasks) {
       dispatch(filteredParticipateTasks(Number(localStorage.getItem("id"))));
@@ -513,14 +501,7 @@ export const ProjectTracker = () => {
                     >
                       +
                     </BaseButton>
-                    {/* <span
-                      onClick={() => {
-                        dispatch(modalToggle("createColumn"));
-                        setModalAdd(true);
-                      }}
-                    >
-                      +
-                    </span> */}
+
                     <p>добавить колонку</p>
                   </div>
                   <div
@@ -565,65 +546,13 @@ export const ProjectTracker = () => {
                       +
                     </span>
                     <p>добавить участника</p>
-                    {personListOpen && (
-                      <div className="persons__list">
-                        <img
-                          className="persons__list__close"
-                          src={close}
-                          alt="close"
-                          onClick={() => setPersonListOpen(false)}
-                        />
-                        <div className="persons__list__count">
-                          <span>{projectBoard.projectUsers?.length}</span>
-                          {caseOfNum(
-                            projectBoard.projectUsers?.length,
-                            "persons"
-                          )}
-                        </div>
-                        <div className="persons__list__info">
-                          <span>В проекте - </span>
-                          <p>“{projectBoard.name}”</p>
-                        </div>
-                        <div className="persons__list__items">
-                          {projectBoard.projectUsers?.map((person) => {
-                            return (
-                              <div
-                                className="persons__list__item"
-                                key={person.user_id}
-                              >
-                                <img
-                                  className="avatar"
-                                  src={
-                                    person.user?.avatar
-                                      ? urlForLocal(person.user.avatar)
-                                      : avatarMok
-                                  }
-                                  alt="avatar"
-                                />
-                                <span>{person.user.fio}</span>
-                                <img
-                                  className="delete"
-                                  src={close}
-                                  alt="delete"
-                                  onClick={() => deletePerson(person.user_id)}
-                                />
-                              </div>
-                            );
-                          })}
-                        </div>
-                        <div
-                          className="persons__list__add"
-                          onClick={() => {
-                            dispatch(modalToggle("addWorker"));
-                            setModalAdd(true);
-                            setPersonListOpen(false);
-                          }}
-                        >
-                          <span className="addPerson">+</span>
-                          <p>Добавить участников</p>
-                        </div>
-                      </div>
-                    )}
+
+                    <ListEmployees
+                      active={personListOpen}
+                      setActiveListEmpl={setPersonListOpen}
+                      setModalAdd={setModalAdd}
+                      projectBoard={projectBoard}
+                    />
                   </div>
                   <div
                     className="tasks__head__checkBox"