From 60354a3d09ec850b1a2f83f018e15d3f67854c4c Mon Sep 17 00:00:00 2001 From: M1kola Date: Wed, 24 May 2023 01:20:53 +0300 Subject: [PATCH] task add users --- src/components/UI/ModalTicket/ModalTicket.jsx | 135 ++++++++++++++++-- .../UI/ModalTicket/ModalTicket.scss | 108 +++++++++++++- .../UI/TicketFullScreen/TicketFullScreen.jsx | 13 +- src/pages/ProjectTracker/ProjectTracker.js | 1 + src/pages/Tracker/tracker.scss | 4 + 5 files changed, 241 insertions(+), 20 deletions(-) diff --git a/src/components/UI/ModalTicket/ModalTicket.jsx b/src/components/UI/ModalTicket/ModalTicket.jsx index 1aa706f1..cd2201b0 100644 --- a/src/components/UI/ModalTicket/ModalTicket.jsx +++ b/src/components/UI/ModalTicket/ModalTicket.jsx @@ -13,7 +13,6 @@ import {getCorrectDate} from '../../../components/Calendar/calendarHelper' import category from "../../../images/category.png"; import watch from "../../../images/watch.png"; import file from "../../../images/fileModal.svg"; -import taskImg from "../../../images/tasksMock.png"; import arrow from "../../../images/arrowStart.png"; import link from "../../../images/link.svg"; import archive from "../../../images/archive.svg"; @@ -22,8 +21,10 @@ import edit from "../../../images/edit.svg"; import send from "../../../images/send.svg"; import plus from "../../../images/plus.svg"; import fullScreen from "../../../images/inFullScreen.svg"; +import close from "../../../images/closeProjectPersons.svg"; import "./ModalTicket.scss"; +import {urlForLocal} from "../../../helper"; export const ModalTiсket = ({ active, @@ -31,6 +32,7 @@ export const ModalTiсket = ({ task, projectId, projectName, + projectUsers }) => { const dispatch = useDispatch(); const [addSubtask, setAddSubtask] = useState(false); @@ -39,6 +41,11 @@ export const ModalTiсket = ({ const [comments, setComments] = useState([]); const [commentsEditOpen, setCommentsEditOpen] = useState({}) const [commentsEditText, setCommentsEditText] = 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([]) function deleteTask() { apiRequest("/task/update-task", { @@ -107,6 +114,56 @@ export const ModalTiсket = ({ }) } + function taskExecutor(person) { + apiRequest("/task/update-task", { + method: "PUT", + data: { + task_id: task.id, + executor_id: person.user_id + }, + }).then((res) => { + setDropListOpen(false) + setExecutor(res.executor) + }); + } + + function deleteTaskExecutor() { + apiRequest("/task/update-task", { + method: "PUT", + data: { + task_id: task.id, + executor_id: null + }, + }).then((res) => { + setExecutor(null) + }); + } + + 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])) + }); + } + + function deleteMember(person) { + apiRequest("/task/del-user", { + method: "DELETE", + data: { + task_id: task.id, + user_id: person.user_id + }, + }).then((res) => { + setMembers(members.filter((item) => item.user_id !== person.user_id)) + }); + } + useEffect(() => { apiRequest(`/comment/get-by-entity?entity_type=2&entity_id=${task.id}`).then((res) => { setComments(res) @@ -117,6 +174,15 @@ export const ModalTiсket = ({ }) }, []) + 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)}> - {task.title} + {task.title}

Создатель : {task.user?.fio}

-
- {Boolean(task.taskUsers?.length) && - task.taskUsers.map((worker, index) => { - return ( -
- -

{worker.name}

+ + {executor ? +
+

Исполнитель: {executor.fio}

+ avatar + deleteTaskExecutor()} /> +
: +
+ + Добавить исполнителя + {dropListOpen && +
+ setDropListOpen(false)} /> + {projectUsers.map((person) => { + return
taskExecutor(person)}> + {person.user.fio} + +
+ }) + } +
+ } +
+ } + + {Boolean(members.length) && +
+

Участники:

+
+ {members.map((member) => { + return
+

{member.fio}

+ + deleteMember(member)} />
- ); - })} + }) + } +
+ }
- + Добавить участников + {dropListMembersOpen && +
+ setDropListMembersOpen(false)} /> + {users.length ? users.map((person) => { + return
addMember(person)}> + {person.user.fio} + +
+ }) :

Нет пользователей

+ } +
+ }
@@ -228,7 +335,7 @@ export const ModalTiсket = ({
Длительность : -

{"8:30:22"}

+

{"0:00:00"}

+
+ + Добавить исполнителя +