Fixed conflict

2023-05-02 20:29:10 +03:00
parent b21e6b1818 a5cb5a4e22
commit 43acfe2b79
12 changed files with 636 additions and 736 deletions
--- a/src/components/ProjectTiket/ProjectTiket.js
+++ b/src/components/ProjectTiket/ProjectTiket.js
@ -1,4 +1,5 @@
 import React, { useEffect, useState } from "react";
+import {Link} from "react-router-dom";
 import ModalSettings from "../UI/ModalSettings/ModalSettings";

 import link from "../../images/link.svg";
@ -6,10 +7,15 @@ import archiveSet from "../../images/archive.svg";
 import del from "../../images/delete.svg";
 import edit from "../../images/edit.svg";

+import {apiRequest} from "../../api/request";
+import {useDispatch} from "react-redux";
+import { deleteProject } from "../../redux/projectsTrackerSlice";
+
 import "./projectTiket.scss";

-export const ProjectTiket = ({ project, index, setOpenProject }) => {
+export const ProjectTiket = ({ project, index }) => {
  const [modalSettings, setModalSettings] = useState(false);
+  const dispatch = useDispatch();

  useEffect(() => {
    initListeners();
@ -30,13 +36,25 @@ export const ProjectTiket = ({ project, index, setOpenProject }) => {
    }
  }

+  function removeProject() {
+    apiRequest('/project/update', {
+      method: 'PUT',
+      data: {
+        project_id: project.id,
+        status: 0
+      }
+    }).then((res) => {
+      dispatch(deleteProject(project))
+    })
+  }
+
  return (
    <div className="project" key={index}>
-      <h3 onClick={() => setOpenProject(true)}>{project.name}</h3>
+      <Link to={`/tracker/project/${project.id}`}>{project.name}</Link>
      <div className="project__info">
        <p>Открытые задачи</p>
-        <span className="count">{project.count}</span>
-        <span className="add">+</span>
+        <span className="count">{project.columns.reduce((accumulator, currentValue) => accumulator + currentValue.tasks.length, 0)}</span>
+        {/*<span className="add">{project.columns.length ? '+' : ''}</span>*/}
        <span className="menu-settings" onClick={() => setModalSettings(true)}>
          ...
        </span>
@ -56,7 +74,8 @@ export const ProjectTiket = ({ project, index, setOpenProject }) => {
            <img src={archiveSet}></img>
            <p>в архив</p>
          </div>
-          <div>
+          <div
+            onClick={removeProject}>
            <img src={del}></img>
            <p>удалить</p>
          </div>
--- a/src/components/ProjectTiket/projectTiket.scss
+++ b/src/components/ProjectTiket/projectTiket.scss
@ -19,7 +19,7 @@
    padding: 8px 13px 8px;
  }

-  h3 {
+  a {
    font-weight: 700;
    font-size: 18px;
    line-height: 32px;
@ -27,7 +27,12 @@
    margin-bottom: 10px;
    overflow: hidden;
    white-space: nowrap;
+    display: flex;
    text-overflow: ellipsis;
+
+    &:hover {
+      color: black;
+    }
  }

  &__info {
--- a/src/components/UI/ModalAdd/modalAdd.scss
+++ b/src/components/UI/ModalAdd/modalAdd.scss
@ -20,7 +20,7 @@
    padding: 60px 60px 30px 60px;
    display: flex;
    flex-direction: column;
-    align-items: flex-start;
+    align-items: center;
    justify-content: center;
  }

@ -34,14 +34,14 @@
      height: 35px;
      background: #ffffff;
      border-radius: 8px;
+      margin-top: 12px;
    }

    h4 {
      font-weight: 500;
-      font-size: 22px;
+      font-size: 17px;
      line-height: 26px;
      color: #263238 !important;
-      margin-bottom: 22px !important;
    }

    &__decs {
@ -73,7 +73,7 @@
  }

  .button-add {
-    margin: 20px 40% 0 0;
+    margin: 20px;
    width: 130px;
    height: 37px;
    background: #52b709;
--- a/src/components/UI/ModalCreate/ModalCreate.jsx
+++ b/src/components/UI/ModalCreate/ModalCreate.jsx
@ -1,6 +1,7 @@
 import React, { useState } from "react";
 import { useDispatch } from "react-redux";
 import { setProject } from "../../../redux/projectsTrackerSlice";
+import {apiRequest} from "../../../api/request";

 import "./ModalCreate.scss";

@ -12,13 +13,18 @@ export const ModalCreate = ({ active, setActive, title }) => {
    if (inputValue === "") {
      return;
    } else {
-      let newItem = {
-        name: inputValue,
-        count: 0,
-      };
-      dispatch(setProject(newItem));
-      setActive(false);
-      setInputValue("");
+      apiRequest('/project/create', {
+        method: 'POST',
+        data: {
+          user_id: localStorage.getItem('id'),
+          name: inputValue,
+          status: 1,
+        }
+      }).then((res) => {
+        dispatch(setProject(res));
+        setActive(false);
+        setInputValue("");
+      })
    }
  }

--- a/src/components/UI/ModalTicket/ModalTicket.jsx
+++ b/src/components/UI/ModalTicket/ModalTicket.jsx
@ -1,11 +1,16 @@
 import React, { useState } from "react";
+import { Link } from "react-router-dom";
+import ModalAdd from "../ModalAdd/ModalAdd";
+import { apiRequest } from "../../../api/request";
+import { useDispatch } from "react-redux";
+import { setProjectBoardFetch } from "../../../redux/projectsTrackerSlice";

 import avatarMock1 from "../../../images/avatarMoсk1.png";
 import avatarMock2 from "../../../images/avatarMoсk2.png";
 import category from "../../../images/category.png";
 import watch from "../../../images/watch.png";
 import file from "../../../images/fileModal.svg";
-import task from "../../../images/tasksMock.png";
+import taskImg from "../../../images/tasksMock.png";
 import arrow from "../../../images/arrowStart.png";
 import link from "../../../images/link.svg";
 import archive from "../../../images/archive.svg";
@ -15,11 +20,16 @@ import send from "../../../images/send.svg";
 import plus from "../../../images/plus.svg";
 import fullScreen from "../../../images/inFullScreen.svg";

-import ModalAdd from "../ModalAdd/ModalAdd";
 import "./ModalTicket.scss";
-import { Link } from "react-router-dom";

-export const ModalTiсket = ({ active, setActive, index }) => {
+export const ModalTiсket = ({
+  active,
+  setActive,
+  task,
+  projectId,
+  projectName,
+}) => {
+  const dispatch = useDispatch();
  const [tiket] = useState({
    name: "Разработка трекера",
    code: "PR - 2245",
@ -39,6 +49,19 @@ export const ModalTiсket = ({ active, setActive, index }) => {
  ]);
  const [addSubtask, setAddSubtask] = useState(false);

+  function deleteTask() {
+    apiRequest("/task/update-task", {
+      method: "PUT",
+      data: {
+        task_id: task.id,
+        status: 0,
+      },
+    }).then((res) => {
+      setActive(false);
+      dispatch(setProjectBoardFetch(projectId));
+    });
+  }
+
  return (
    <div
      className={active ? "modal-tiket active" : "modal-tiket"}
@ -51,18 +74,18 @@ export const ModalTiсket = ({ active, setActive, index }) => {
        <div className="content">
          <h3 className="title-project">
            <img src={category} className="title-project__category"></img>
-            Проект: {tiket.name}
-            <Link to={`/tracker/task/${index}`} className="title-project__full">
+            Проект: {projectName}
+            <Link to={`/tracker/${task.id}`} className="title-project__full">
              <img src={fullScreen}></img>
            </Link>
          </h3>

          <div className="content__task">
            <span>Задача</span>
-            <h5>{tiket.code}</h5>
+            <h5>{task.title}</h5>
            <div className="content__description">
-              <p>{tiket.descriptions}</p>
-              <img src={task} className="image-task"></img>
+              <p>{task.description}</p>
+              <img src={taskImg} className="image-task"></img>
              <p>{tiket.descriptions}</p>
            </div>
            <div className="content__communication">
@ -90,8 +113,8 @@ export const ModalTiсket = ({ active, setActive, index }) => {
        <div className="workers">
          <div className="workers_box">
            <span className="exit" onClick={() => setActive(false)}></span>
-            <span>{tiket.code}</span>
-            <p className="workers__creator">Создатель : {tiket.creator}</p>
+            <span>{task.title}</span>
+            <p className="workers__creator">Создатель : {task.user?.fio}</p>
            <div>
              {workers.map((worker, index) => {
                return (
@ -134,7 +157,7 @@ export const ModalTiсket = ({ active, setActive, index }) => {
              <img src={archive}></img>
              <p>в архив</p>
            </div>
-            <div>
+            <div onClick={deleteTask}>
              <img src={del}></img>
              <p>удалить</p>
            </div>
--- a/src/components/UI/ModalTicket/ModalTicket.scss
+++ b/src/components/UI/ModalTicket/ModalTicket.scss
@ -18,7 +18,7 @@

 .modal-tiket__content {
  background: #ffffff;
-  border: 1px solid #dde2e4;
+  //border: 1px solid #dde2e4;
  border-radius: 8px;
  display: flex;
  flex-direction: row;
@ -291,13 +291,14 @@
      }

      &-bottom {
-        padding: 40px 0 75px 56px;
+        padding: 40px 110px 75px 56px;
        font-weight: 400;
        font-size: 14px;
        line-height: 38px;

        div {
          display: flex;
+          cursor: pointer;
          align-items: center;

          p {
--- a/src/components/UI/TicketFullScreen/TicketFullScreen.jsx
+++ b/src/components/UI/TicketFullScreen/TicketFullScreen.jsx
@ -5,6 +5,8 @@ import { ProfileBreadcrumbs } from "../../ProfileBreadcrumbs/ProfileBreadcrumbs"
 import { Footer } from "../../Footer/Footer";
 import { Link } from "react-router-dom";
 import ModalAdd from "../ModalAdd/ModalAdd";
+import { useDispatch } from "react-redux";
+import {setToggleTab} from "../../../redux/projectsTrackerSlice";

 import avatarMock1 from "../../../images/avatarMoсk1.png";
 import avatarMock2 from "../../../images/avatarMoсk2.png";
@ -28,10 +30,10 @@ import edit from "../../../images/edit.svg";
 import "./ticketFullScreen.scss";

 export const TicketFullScreen = ({}) => {
-  const [toggleTab, setToggleTab] = useState(1);
  const [addSubtask, setAddSubtask] = useState(false);
  const [modalAddWorker, setModalAddWorker] = useState(false);
  const [valueTiket, setValueTiket] = useState("");
+  const dispatch = useDispatch();

  const [tiket] = useState({
    name: "Разработка трекера",
@ -52,7 +54,7 @@ export const TicketFullScreen = ({}) => {
  ]);

  const toggleTabs = (index) => {
-    setToggleTab(index);
+    dispatch(setToggleTab(index));
  };

  return (
@ -71,31 +73,30 @@ export const TicketFullScreen = ({}) => {
      </div>
      <div className="tracker__tabs">
        <div className="tracker__tabs__head">
-          <div
-            className={toggleTab === 1 ? "tab active-tab" : "tab"}
+          <Link
+            to='/profile/tracker'
+            className="tab active-tab"
            onClick={() => toggleTabs(1)}
          >
            <img src={project} alt="img" />
            <p>Проекты </p>
-          </div>
-          <div
-            className={toggleTab === 2 ? "tab active-tab" : "tab"}
+          </Link>
+          <Link
+            to='/profile/tracker'
+            className="tab"
            onClick={() => toggleTabs(2)}
          >
            <img src={tasks} alt="img" />
-            <Link to={`/profile/tracker`} className="link">
-              <p>Все мои задачи</p>
-            </Link>
-          </div>
-          <div
-            className={toggleTab === 3 ? "tab active-tab" : "tab"}
+            <p>Все мои задачи</p>
+          </Link>
+          <Link
+            to='/profile/tracker'
+            className="tab"
            onClick={() => toggleTabs(3)}
          >
            <img src={archive} alt="img" />
-            <Link to={`/profile/tracker`} className="link">
-              <p>Архив</p>
-            </Link>
-          </div>
+            <p>Архив</p>
+          </Link>
        </div>
        <div className="tracker__tabs__content content-tabs">
          <div className="tasks__head">