From 5c72dae35a70a44c87e8367f932f076f087bdf62 Mon Sep 17 00:00:00 2001 From: Mikola Date: Thu, 26 Oct 2023 14:44:39 +0300 Subject: [PATCH 1/2] marks --- .../TicketFullScreen/TicketFullScreen.jsx | 103 +++++++++++++++++- src/pages/ProjectTracker/ProjectTracker.js | 2 + 2 files changed, 104 insertions(+), 1 deletion(-) diff --git a/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx b/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx index 8950a8bc..656f28e3 100644 --- a/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx +++ b/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx @@ -53,6 +53,7 @@ import archive from "assets/images/archiveIcon.png"; import avatarMok from "assets/images/avatarMok.png"; import "./ticketFullScreen.scss"; +import arrowDown from "assets/icons/arrows/selectArrow.png"; registerLocale("ru", ru); @@ -88,6 +89,9 @@ export const TicketFullScreen = () => { const [uploadedFile, setUploadedFile] = useState(null); const [taskFiles, setTaskFiles] = useState([]); const [acceptModalOpen, setAcceptModalOpen] = useState(false); + const [taskTags, setTaskTags] = useState([]); + const [selectTagsOpen, setSelectTagsOpen] = useState(false); + const [correctProjectTags, setCorrectProjectTags] = useState([]); const { showNotification } = useNotification(); useEffect(() => { @@ -103,6 +107,7 @@ export const TicketFullScreen = () => { description: taskInfo.description, comment: "", }); + setTaskTags(taskInfo.mark) apiRequest( `/comment/get-by-entity?entity_type=2&entity_id=${taskInfo.id}` ).then((res) => { @@ -148,7 +153,7 @@ export const TicketFullScreen = () => { }); }); apiRequest( - `/project/get-project?project_id=${taskInfo.project_id}&expand=columns` + `/project/get-project?project_id=${taskInfo.project_id}&expand=columns,mark` ).then((res) => { setProjectInfo(res); setCorrectProjectUsers(res.projectUsers); @@ -158,6 +163,18 @@ export const TicketFullScreen = () => { ); }, []); + useEffect(() => { + let tagIds = taskTags.map((tag) => tag.id); + if (projectInfo.mark) { + setCorrectProjectTags( + projectInfo.mark.reduce((acc, cur) => { + if (!tagIds.includes(cur.id)) acc.push(cur); + return acc; + }, []) + ); + } + }, [taskTags, projectInfo]); + function deleteTask() { apiRequest("/task/update-task", { method: "PUT", @@ -481,6 +498,33 @@ export const TicketFullScreen = () => { setAcceptModalOpen(false); } + function deleteTagFromTask(tagId) { + apiRequest("/mark/detach", { + method: "DELETE", + data: { + mark_id: tagId, + entity_type: 2, + entity_id: taskInfo.id, + }, + }).then(() => { + setTaskTags((prevValue) => prevValue.filter((tag) => tag.id !== tagId)); + }); + } + + function addTagToTask(tagId) { + apiRequest("/mark/attach", { + method: "POST", + data: { + mark_id: tagId, + entity_type: 2, + entity_id: taskInfo.id, + }, + }).then((data) => { + setSelectTagsOpen(false); + setTaskTags((prevValue) => [...prevValue, data.mark]); + }); + } + return (
@@ -991,6 +1035,63 @@ export const TicketFullScreen = () => {
+
+
+ {taskTags.map((tag) => { + return ( +
+

{tag.slug}

+ delete deleteTagFromTask(tag.id)} + /> +
+ ); + })} +
+
setSelectTagsOpen(!selectTagsOpen)} + > + Выберите тег + arrow +
+ {selectTagsOpen && ( +
+ setSelectTagsOpen(false)} + className="tags__dropDown__close" + src={close} + alt="close" + /> + {correctProjectTags.map((tag) => { + return ( +
addTagToTask(tag.id)} + > +

{tag.slug}

+ +
+ ); + })} + {!Boolean(correctProjectTags.length) && ( +

Нет тегов

+ )} +
+ )} +
{ diff --git a/src/pages/ProjectTracker/ProjectTracker.js b/src/pages/ProjectTracker/ProjectTracker.js index b26786f3..c6edb0dc 100644 --- a/src/pages/ProjectTracker/ProjectTracker.js +++ b/src/pages/ProjectTracker/ProjectTracker.js @@ -335,6 +335,8 @@ export const ProjectTracker = () => { ...prevState, edit: false, })); + setTagInfo({description: "", name: ""}) + setColor("#aabbcc") }); } From db0f0e1f2474c241bc898aa1acf56d08ee11dfd7 Mon Sep 17 00:00:00 2001 From: Mikola Date: Thu, 26 Oct 2023 14:45:14 +0300 Subject: [PATCH 2/2] marks --- .../TicketFullScreen/TicketFullScreen.jsx | 94 +++++++++---------- src/pages/ProjectTracker/ProjectTracker.js | 4 +- 2 files changed, 49 insertions(+), 49 deletions(-) diff --git a/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx b/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx index 656f28e3..7c24717b 100644 --- a/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx +++ b/src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx @@ -38,6 +38,7 @@ import TrackerTaskComment from "@components/TrackerTaskComment/TrackerTaskCommen import arrow from "assets/icons/arrows/arrowCalendar.png"; import arrowStart from "assets/icons/arrows/arrowStart.png"; +import arrowDown from "assets/icons/arrows/selectArrow.png"; import calendarIcon from "assets/icons/calendar.svg"; import close from "assets/icons/close.png"; import fileDelete from "assets/icons/closeProjectPersons.svg"; @@ -53,7 +54,6 @@ import archive from "assets/images/archiveIcon.png"; import avatarMok from "assets/images/avatarMok.png"; import "./ticketFullScreen.scss"; -import arrowDown from "assets/icons/arrows/selectArrow.png"; registerLocale("ru", ru); @@ -107,7 +107,7 @@ export const TicketFullScreen = () => { description: taskInfo.description, comment: "", }); - setTaskTags(taskInfo.mark) + setTaskTags(taskInfo.mark); apiRequest( `/comment/get-by-entity?entity_type=2&entity_id=${taskInfo.id}` ).then((res) => { @@ -167,10 +167,10 @@ export const TicketFullScreen = () => { let tagIds = taskTags.map((tag) => tag.id); if (projectInfo.mark) { setCorrectProjectTags( - projectInfo.mark.reduce((acc, cur) => { - if (!tagIds.includes(cur.id)) acc.push(cur); - return acc; - }, []) + projectInfo.mark.reduce((acc, cur) => { + if (!tagIds.includes(cur.id)) acc.push(cur); + return acc; + }, []) ); } }, [taskTags, projectInfo]); @@ -1039,57 +1039,57 @@ export const TicketFullScreen = () => {
{taskTags.map((tag) => { return ( -
-

{tag.slug}

- delete deleteTagFromTask(tag.id)} - /> -
+
+

{tag.slug}

+ delete deleteTagFromTask(tag.id)} + /> +
); })}
setSelectTagsOpen(!selectTagsOpen)} + className="tags__select" + onClick={() => setSelectTagsOpen(!selectTagsOpen)} > Выберите тег arrow
{selectTagsOpen && ( -
- setSelectTagsOpen(false)} - className="tags__dropDown__close" - src={close} - alt="close" - /> - {correctProjectTags.map((tag) => { - return ( -
addTagToTask(tag.id)} - > -

{tag.slug}

- -
- ); - })} - {!Boolean(correctProjectTags.length) && ( -

Нет тегов

- )} -
+
+ setSelectTagsOpen(false)} + className="tags__dropDown__close" + src={close} + alt="close" + /> + {correctProjectTags.map((tag) => { + return ( +
addTagToTask(tag.id)} + > +

{tag.slug}

+ +
+ ); + })} + {!Boolean(correctProjectTags.length) && ( +

Нет тегов

+ )} +
)}
{ ...prevState, edit: false, })); - setTagInfo({description: "", name: ""}) - setColor("#aabbcc") + setTagInfo({ description: "", name: "" }); + setColor("#aabbcc"); }); }