- {workers.map((worker, index) => {
- return (
-
-
-
{worker.name}
-
- );
- })}
+ {Boolean(taskInfo.taskUsers?.length) &&
+ taskInfo.taskUsers.map((worker, index) => {
+ return (
+
+
+
{worker.name}
+
+ );
+ })}
+
удалить
diff --git a/src/pages/ProjectTracker/ProjectTracker.jsx b/src/pages/ProjectTracker/ProjectTracker.js
similarity index 78%
rename from src/pages/ProjectTracker/ProjectTracker.jsx
rename to src/pages/ProjectTracker/ProjectTracker.js
index ae4c0b19..de272f97 100644
--- a/src/pages/ProjectTracker/ProjectTracker.jsx
+++ b/src/pages/ProjectTracker/ProjectTracker.js
@@ -1,11 +1,12 @@
import React, { useEffect, useRef, useState } from "react";
-import { Link } from "react-router-dom";
+import { Link, useParams } from "react-router-dom";
import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
-import { Navigation } from "../../components/Navigation/Navigation";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
+import { Navigation } from "../../components/Navigation/Navigation";
import { useDispatch, useSelector } from "react-redux";
+import { apiRequest } from "../../api/request";
import {
getProjectBoard,
modalToggle,
@@ -25,32 +26,39 @@ import selectArrow from "../../images/select.svg";
import commentsBoard from "../../images/commentsBoard.svg";
import filesBoard from "../../images/filesBoard.svg";
import arrow from "../../images/arrowCalendar.png";
+import del from "../../images/delete.svg";
+import edit from "../../images/edit.svg";
export const ProjectTracker = () => {
const dispatch = useDispatch();
- const currentUrl = useState(window.location.pathname);
- const projectId = currentUrl[0].split("/").at(-1);
-
- useEffect(() => {
- dispatch(setProjectBoardFetch(projectId));
- }, []);
+ const projectId = useParams();
+ const [openColumnSelect, setOpenColumnSelect] = useState({});
+ const [selectedTab, setSelectedTab] = useState(0);
+ const [wrapperHover, setWrapperHover] = useState({});
const [modalAdd, setModalAdd] = useState(false);
const [modalActiveTicket, setModalActiveTicket] = useState(false);
const [selectedTicket, setSelectedTicket] = useState({});
- const [selectedTab, setSelectedTab] = useState(0);
-
const startWrapperIndexTest = useRef({});
- const [wrapperHover, setWrapperHover] = useState([
- false,
- false,
- false,
- false,
- ]);
-
const projectBoard = useSelector(getProjectBoard);
+ useEffect(() => {
+ dispatch(setProjectBoardFetch(projectId.id));
+ }, []);
+
+ useEffect(() => {
+ if (Object.keys(projectBoard).length) {
+ projectBoard.columns.forEach((column) => {
+ setOpenColumnSelect((prevState) => ({
+ ...prevState,
+ [column.id]: false,
+ }));
+ setWrapperHover((prevState) => ({ ...prevState, [column.id]: false }));
+ });
+ }
+ }, [projectBoard]);
+
// function toggleMoreTasks(columnId) {
// setTabTaskMok((prevArray) =>
// prevArray.map((elem, index) => {
@@ -71,11 +79,9 @@ export const ProjectTracker = () => {
}
function dragEndHandler(e) {
- setWrapperHover((prevArray) =>
- prevArray.map((elem) => {
- return false;
- })
- );
+ setWrapperHover((prevState) => ({
+ [prevState]: false,
+ }));
e.target.classList.remove("tasks__board__item__hide");
}
@@ -87,26 +93,21 @@ export const ProjectTracker = () => {
if (columnId === startWrapperIndexTest.current.index) {
return;
}
- setWrapperHover((prevArray) =>
- prevArray.map((elem, index) => {
- if (index === columnId) {
- return true;
- } else {
- return false;
- }
- })
- );
+
+ setWrapperHover((prevState) => ({
+ [prevState]: false,
+ [columnId]: true,
+ }));
}
function dragDropHandler(e, columnId) {
e.preventDefault();
if (startWrapperIndexTest.current.index === columnId) {
return;
}
- setWrapperHover((prevArray) =>
- prevArray.map((elem) => {
- return false;
- })
- );
+
+ setWrapperHover((prevState) => ({
+ [prevState]: false,
+ }));
if (columnId !== startWrapperIndexTest.current.index) {
dispatch(
@@ -129,6 +130,19 @@ export const ProjectTracker = () => {
setModalActiveTicket(true);
}
+ function deleteColumn(id) {
+ apiRequest("/project-column/update-column", {
+ method: "PUT",
+ data: {
+ column_id: id,
+ project_id: projectBoard.id,
+ status: 0,
+ },
+ }).then((res) => {
+ dispatch(setProjectBoardFetch(projectBoard.id));
+ });
+ }
+
return (
@@ -258,9 +272,44 @@ export const ProjectTracker = () => {
>
+
-
...
+
{
+ setOpenColumnSelect((prevState) => ({
+ ...prevState,
+ [column.id]: true,
+ }));
+ }}
+ className="more"
+ >
+ ...
+
+ {openColumnSelect[column.id] && (
+
+ )}
{column.tasks.map((task, index) => {
if (index > 2) {
if (!column.open) {
diff --git a/src/pages/Tracker/tracker.scss b/src/pages/Tracker/tracker.scss
index 344fe765..834712a9 100644
--- a/src/pages/Tracker/tracker.scss
+++ b/src/pages/Tracker/tracker.scss
@@ -501,6 +501,31 @@
&__more {
padding-bottom: 50px;
}
+
+ .column__select {
+ position: absolute;
+ padding: 15px;
+ background: #e1fccf;
+ border-radius: 12px;
+ right: -75px;
+ z-index: 10;
+ row-gap: 10px;
+ display: flex;
+ flex-direction: column;
+
+ &__item {
+ cursor: pointer;
+ display: flex;
+ align-content: center;
+ img {
+ margin-right: 5px;
+ }
+
+ span {
+ font-size: 14px;
+ }
+ }
+ }
}
.board {