From af8704eafe02cdc961ed28e4188401d8075d07c2 Mon Sep 17 00:00:00 2001 From: M1kola Date: Mon, 26 Jun 2023 12:57:33 +0300 Subject: [PATCH] Merge branch 'main' into tracker-connect-back --- .../Modal/Tracker/ModalTicket/ModalTicket.jsx | 142 ++-- .../Tracker/ModalTicket/modalTicket.scss | 5 + src/components/UI/ModalTicket/ModalTicket.jsx | 610 ------------------ 3 files changed, 86 insertions(+), 671 deletions(-) delete mode 100644 src/components/UI/ModalTicket/ModalTicket.jsx diff --git a/src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx b/src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx index 1b3ec8c7..fe3d4e14 100644 --- a/src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx +++ b/src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx @@ -1,14 +1,13 @@ import React, { useEffect, useState } from "react"; -import { useDispatch } from "react-redux"; +import { useDispatch, useSelector } from "react-redux"; import { Link } from "react-router-dom"; -import { modalToggle, setProjectBoardFetch } from "@redux/projectsTrackerSlice"; +import { setProjectBoardFetch } from "@redux/projectsTrackerSlice"; import { getCorrectRequestDate, urlForLocal } from "@utils/helper"; import { apiRequest } from "@api/request"; -import BaseButton from "@components/Common/BaseButton/BaseButton"; import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal"; import TrackerTaskComment from "@components/TrackerTaskComment/TrackerTaskComment"; @@ -21,11 +20,11 @@ import del from "assets/icons/delete.svg"; import edit from "assets/icons/edit.svg"; import file from "assets/icons/fileModal.svg"; import link from "assets/icons/link.svg"; -import plus from "assets/icons/plus.svg"; import send from "assets/icons/send.svg"; import watch from "assets/icons/watch.svg"; import "./modalTicket.scss"; +import { getProfileInfo } from "@redux/outstaffingSlice"; export const ModalTiсket = ({ active, @@ -57,6 +56,9 @@ export const ModalTiсket = ({ seconds: 0, }); const [timerId, setTimerId] = useState(null); + const [correctProjectUsers, setCorrectProjectUsers] = useState(projectUsers); + const [executorId, setExecutorId] = useState(task.executor_id); + const profileInfo = useSelector(getProfileInfo); function deleteTask() { apiRequest("/task/update-task", { @@ -65,7 +67,7 @@ export const ModalTiсket = ({ task_id: task.id, status: 0, }, - }).then(() => { + }).then((res) => { setActive(false); dispatch(setProjectBoardFetch(projectId)); }); @@ -79,7 +81,7 @@ export const ModalTiсket = ({ title: inputsValue.title, description: inputsValue.description, }, - }).then(() => { + }).then((res) => { dispatch(setProjectBoardFetch(projectId)); }); } @@ -177,8 +179,10 @@ export const ModalTiсket = ({ executor_id: person.user_id, }, }).then((res) => { + setExecutorId(person.user_id); setDropListOpen(false); setExecutor(res.executor); + dispatch(setProjectBoardFetch(projectId)); }); } @@ -190,7 +194,9 @@ export const ModalTiсket = ({ executor_id: 0, }, }).then(() => { + setExecutorId(null); setExecutor(null); + dispatch(setProjectBoardFetch(projectId)); }); } @@ -204,6 +210,7 @@ export const ModalTiсket = ({ }).then((res) => { setDropListMembersOpen(false); setMembers((prevValue) => [...prevValue, res]); + dispatch(setProjectBoardFetch(projectId)); }); } @@ -216,6 +223,7 @@ export const ModalTiсket = ({ }, }).then(() => { setMembers(members.filter((item) => item.user_id !== person.user_id)); + dispatch(setProjectBoardFetch(projectId)); }); } @@ -239,24 +247,40 @@ export const ModalTiсket = ({ (res) => { let timerSeconds = 0; res.length && - res.forEach((time) => { - timerSeconds += time.deltaSeconds; - setCurrentTimerCount({ - hours: Math.floor(timerSeconds / 60 / 60), - minute: Math.floor((timerSeconds / 60) % 60), - seconds: timerSeconds % 60, - }); - updateTimerHours = Math.floor(timerSeconds / 60 / 60); - updateTimerMinute = Math.floor((timerSeconds / 60) % 60); - updateTimerSec = timerSeconds % 60; - if (!time.stopped_at) { - setTimerStart(true); - startTimer(); - setTimerInfo(time); - } + res.forEach((time) => { + timerSeconds += time.deltaSeconds; + setCurrentTimerCount({ + hours: Math.floor(timerSeconds / 60 / 60), + minute: Math.floor((timerSeconds / 60) % 60), + seconds: timerSeconds % 60, }); + updateTimerHours = Math.floor(timerSeconds / 60 / 60); + updateTimerMinute = Math.floor((timerSeconds / 60) % 60); + updateTimerSec = timerSeconds % 60; + if (!time.stopped_at) { + setTimerStart(true); + startTimer(); + setTimerInfo(time); + } + }); } ); + + if ( + localStorage.getItem("role_status") !== "18" && + Boolean(!correctProjectUsers.find((item) => item.user_id === profileInfo.id_user)) + ) { + setCorrectProjectUsers((prevState) => [ + ...prevState, + { + user: { + avatar: profileInfo.photo, + fio: profileInfo.fio, + }, + user_id: profileInfo.id_user, + }, + ]); + } }, []); function startTimer() { @@ -314,17 +338,16 @@ export const ModalTiсket = ({ onClick={(e) => e.stopPropagation()} >
- - - - -
+

-

- Проект: -

{projectName}

- -
+ Проект: {projectName} + + + +
Задача @@ -358,23 +381,22 @@ export const ModalTiсket = ({ {/**/}
-

- { - dispatch(modalToggle("addSubtask")); - setAddSubtask(true); - }} - styles={"button-green-add"} - > - - Добавить под задачу - -

+ {/*

*/} + {/* {*/} + {/* dispatch(modalToggle("addSubtask"));*/} + {/* setAddSubtask(true);*/} + {/* }}*/} + {/* >*/} + {/* */} + {/* Добавить под задачу*/} + {/* */} + {/*

*/}

- + {0} Файлов

@@ -426,12 +448,7 @@ export const ModalTiсket = ({
) : (
- setDropListOpen(true)} - styles={"button-add-worker"} - > - + - + Добавить исполнителя {dropListOpen && (
@@ -440,7 +457,7 @@ export const ModalTiсket = ({ className="dropdownList__close" onClick={() => setDropListOpen(false)} /> - {projectUsers.map((person) => { + {correctProjectUsers.map((person) => { return (
- setDropListMembersOpen(true)} - styles={"button-add-worker"} - > - + - + Добавить участников {dropListMembersOpen && (
@@ -526,19 +538,27 @@ export const ModalTiсket = ({
{timerStart ? ( - ) : ( )}
diff --git a/src/components/Modal/Tracker/ModalTicket/modalTicket.scss b/src/components/Modal/Tracker/ModalTicket/modalTicket.scss index eefb5eb6..ac7925b8 100644 --- a/src/components/Modal/Tracker/ModalTicket/modalTicket.scss +++ b/src/components/Modal/Tracker/ModalTicket/modalTicket.scss @@ -447,11 +447,16 @@ } .button-add-worker { + cursor: pointer; + background: #8bcc60; + border-radius: 44px; width: 33px; height: 33px; display: flex; justify-content: center; align-items: center; + border: none; + color: white; font-size: 17px; } } diff --git a/src/components/UI/ModalTicket/ModalTicket.jsx b/src/components/UI/ModalTicket/ModalTicket.jsx deleted file mode 100644 index 4052fdd3..00000000 --- a/src/components/UI/ModalTicket/ModalTicket.jsx +++ /dev/null @@ -1,610 +0,0 @@ -import React, { useEffect, useState } from "react"; -import { useDispatch, useSelector } from "react-redux"; -import { Link } from "react-router-dom"; - -import { getProfileInfo } from "@redux/outstaffingSlice"; - -import { apiRequest } from "../../../api/request"; -import archive from "../../../assets/icons/archive.svg"; -import arrow from "../../../assets/icons/arrows/arrowStart.png"; -import fullScreen from "../../../assets/icons/arrows/inFullScreen.svg"; -import category from "../../../assets/icons/category.svg"; -import close from "../../../assets/icons/closeProjectPersons.svg"; -import del from "../../../assets/icons/delete.svg"; -import edit from "../../../assets/icons/edit.svg"; -import file from "../../../assets/icons/fileModal.svg"; -import link from "../../../assets/icons/link.svg"; -import plus from "../../../assets/icons/plus.svg"; -import send from "../../../assets/icons/send.svg"; -import watch from "../../../assets/icons/watch.svg"; -import TrackerModal from "../../../components/Modal/TrackerModal/TrackerModal"; -import TrackerTaskComment from "../../../components/TrackerTaskComment/TrackerTaskComment"; -import { - modalToggle, - setProjectBoardFetch, -} from "../../../redux/projectsTrackerSlice"; -import { getCorrectRequestDate, urlForLocal } from "../../../utils/helper"; -import "./modalTicket.scss"; - -export const ModalTiсket = ({ - active, - setActive, - task, - projectId, - projectName, - projectUsers, -}) => { - const dispatch = useDispatch(); - const [addSubtask, setAddSubtask] = useState(false); - const [editOpen, setEditOpen] = useState(false); - const [inputsValue, setInputsValue] = useState({ - title: task.title, - description: task.description, - comment: "", - }); - const [comments, setComments] = useState([]); - const [dropListOpen, setDropListOpen] = useState(false); - const [dropListMembersOpen, setDropListMembersOpen] = useState(false); - const [executor, setExecutor] = useState(task.executor); - const [members, setMembers] = useState(task.taskUsers); - const [users, setUsers] = useState([]); - const [timerStart, setTimerStart] = useState(false); - const [timerInfo, setTimerInfo] = useState({}); - const [currentTimerCount, setCurrentTimerCount] = useState({ - hours: 0, - minute: 0, - seconds: 0, - }); - const [timerId, setTimerId] = useState(null); - const [correctProjectUsers, setCorrectProjectUsers] = useState(projectUsers); - const [executorId, setExecutorId] = useState(task.executor_id); - const profileInfo = useSelector(getProfileInfo); - - function deleteTask() { - apiRequest("/task/update-task", { - method: "PUT", - data: { - task_id: task.id, - status: 0, - }, - }).then((res) => { - setActive(false); - dispatch(setProjectBoardFetch(projectId)); - }); - } - - function editTask() { - apiRequest("/task/update-task", { - method: "PUT", - data: { - task_id: task.id, - title: inputsValue.title, - description: inputsValue.description, - }, - }).then((res) => { - dispatch(setProjectBoardFetch(projectId)); - }); - } - - function createComment() { - apiRequest("/comment/create", { - method: "POST", - data: { - text: inputsValue.comment, - entity_type: 2, - entity_id: task.id, - }, - }).then((res) => { - let newComment = res; - newComment.created_at = new Date(); - newComment.subComments = []; - setInputsValue((prevValue) => ({ ...prevValue, comment: "" })); - setComments((prevValue) => [...prevValue, newComment]); - }); - } - - function commentDelete(comment) { - setComments((prevValue) => - prevValue.filter((item) => item.id !== comment.id) - ); - if (comment.subComments.length) { - // promiseAll - comment.subComments.forEach((subComment) => { - apiRequest("/comment/update", { - method: "PUT", - data: { - comment_id: subComment.id, - status: 0, - }, - }).then(() => {}); - }); - } - } - - function addSubComment(commentId, subComment) { - const addSubComment = comments; - addSubComment.forEach((comment) => { - if (comment.id === commentId) { - comment.subComments.push(subComment); - } - }); - setComments(addSubComment); - } - - function subCommentDelete(subComment) { - const deleteSubComment = comments; - deleteSubComment.forEach((comment, index) => { - if (comment.id === subComment.parent_id) { - deleteSubComment[index].subComments = comment.subComments.filter( - (item) => item.id !== subComment.id - ); - } - }); - setComments([...deleteSubComment]); - } - - function startTaskTimer() { - apiRequest("/timer/create", { - method: "POST", - data: { - entity_type: 2, - entity_id: task.id, - created_at: getCorrectRequestDate(new Date()), - }, - }).then((res) => { - setTimerStart(true); - setTimerInfo(res); - startTimer(); - }); - } - - function stopTaskTimer() { - apiRequest("/timer/update", { - method: "PUT", - data: { - timer_id: timerInfo.id, - stopped_at: getCorrectRequestDate(new Date()), - }, - }).then(() => { - setTimerStart(false); - clearInterval(timerId); - }); - } - - function taskExecutor(person) { - apiRequest("/task/update-task", { - method: "PUT", - data: { - task_id: task.id, - executor_id: person.user_id, - }, - }).then((res) => { - setExecutorId(person.user_id); - setDropListOpen(false); - setExecutor(res.executor); - dispatch(setProjectBoardFetch(projectId)); - }); - } - - function deleteTaskExecutor() { - apiRequest("/task/update-task", { - method: "PUT", - data: { - task_id: task.id, - executor_id: 0, - }, - }).then(() => { - setExecutorId(null); - setExecutor(null); - dispatch(setProjectBoardFetch(projectId)); - }); - } - - function addMember(person) { - apiRequest("/task/add-user-to-task", { - method: "POST", - data: { - task_id: task.id, - user_id: person.user_id, - }, - }).then((res) => { - setDropListMembersOpen(false); - setMembers((prevValue) => [...prevValue, res]); - dispatch(setProjectBoardFetch(projectId)); - }); - } - - function deleteMember(person) { - apiRequest("/task/del-user", { - method: "DELETE", - data: { - task_id: task.id, - user_id: person.user_id, - }, - }).then(() => { - setMembers(members.filter((item) => item.user_id !== person.user_id)); - dispatch(setProjectBoardFetch(projectId)); - }); - } - - useEffect(() => { - apiRequest( - `/comment/get-by-entity?entity_type=2&entity_id=${task.id}` - ).then((res) => { - const comments = res.reduce((acc, cur) => { - if (!cur.parent_id) { - acc.push({ ...cur, subComments: [] }); - } else { - acc.forEach((item) => { - if (item.id === cur.parent_id) item.subComments.push(cur); - }); - } - return acc; - }, []); - setComments(comments); - }); - apiRequest(`/timer/get-by-entity?entity_type=2&entity_id=${task.id}`).then( - (res) => { - let timerSeconds = 0; - res.length && - res.forEach((time) => { - timerSeconds += time.deltaSeconds; - setCurrentTimerCount({ - hours: Math.floor(timerSeconds / 60 / 60), - minute: Math.floor((timerSeconds / 60) % 60), - seconds: timerSeconds % 60, - }); - updateTimerHours = Math.floor(timerSeconds / 60 / 60); - updateTimerMinute = Math.floor((timerSeconds / 60) % 60); - updateTimerSec = timerSeconds % 60; - if (!time.stopped_at) { - setTimerStart(true); - startTimer(); - setTimerInfo(time); - } - }); - } - ); - - if ( - localStorage.getItem("role_status") !== "18" && - Boolean( - !correctProjectUsers.find( - (item) => item.user_id === profileInfo.id_user - ) - ) - ) { - setCorrectProjectUsers((prevState) => [ - ...prevState, - { - user: { - avatar: profileInfo.photo, - fio: profileInfo.fio, - }, - user_id: profileInfo.id_user, - }, - ]); - } - }, []); - - function startTimer() { - setTimerId( - setInterval(() => { - run(); - }, 1000) - ); - } - - let updateTimerSec = currentTimerCount.seconds, - updateTimerMinute = currentTimerCount.minute, - updateTimerHours = currentTimerCount.hours; - - function run() { - updateTimerSec++; - if (updateTimerSec > 60) { - updateTimerMinute++; - updateTimerSec = 0; - } - if (updateTimerMinute === 60) { - updateTimerMinute = 0; - updateTimerHours++; - } - - return setCurrentTimerCount({ - hours: updateTimerHours, - minute: updateTimerMinute, - seconds: updateTimerSec, - }); - } - - function correctTimerTime(time) { - if (time < 10) return `0${time}`; - if (time > 10) return time; - } - - useEffect(() => { - let ids = members.map((user) => user.user_id); - setUsers( - projectUsers.reduce((acc, cur) => { - if (!ids.includes(cur.user_id)) acc.push(cur); - return acc; - }, []) - ); - }, [members]); - - return ( -
setActive(false)} - > -
e.stopPropagation()} - > -
-

- - Проект: {projectName} - - - -

- -
- Задача - {editOpen ? ( - { - setInputsValue((prevValue) => ({ - ...prevValue, - title: e.target.value, - })); - }} - /> - ) : ( -
{inputsValue.title}
- )} -
- {editOpen ? ( -