commit
8d83fcacf8
@ -94,6 +94,7 @@ export const ModalTiсket = ({
|
|||||||
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
|
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
|
||||||
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
|
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
|
||||||
const { showNotification } = useNotification();
|
const { showNotification } = useNotification();
|
||||||
|
const [commentSendDisable, setCommentSendDisable] = useState(false);
|
||||||
|
|
||||||
function deleteTask() {
|
function deleteTask() {
|
||||||
apiRequest("/task/update-task", {
|
apiRequest("/task/update-task", {
|
||||||
@ -144,6 +145,8 @@ export const ModalTiсket = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
function createComment() {
|
function createComment() {
|
||||||
|
if (!inputsValue.comment) return;
|
||||||
|
setCommentSendDisable(true);
|
||||||
apiRequest("/comment/create", {
|
apiRequest("/comment/create", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
data: {
|
data: {
|
||||||
@ -153,6 +156,7 @@ export const ModalTiсket = ({
|
|||||||
},
|
},
|
||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
let newComment = res;
|
let newComment = res;
|
||||||
|
setCommentSendDisable(false);
|
||||||
newComment.created_at = new Date();
|
newComment.created_at = new Date();
|
||||||
newComment.subComments = [];
|
newComment.subComments = [];
|
||||||
setInputsValue((prevValue) => ({ ...prevValue, comment: "" }));
|
setInputsValue((prevValue) => ({ ...prevValue, comment: "" }));
|
||||||
@ -285,6 +289,7 @@ export const ModalTiсket = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
initListeners();
|
||||||
apiRequest(
|
apiRequest(
|
||||||
`/comment/get-by-entity?entity_type=2&entity_id=${task.id}`
|
`/comment/get-by-entity?entity_type=2&entity_id=${task.id}`
|
||||||
).then((res) => {
|
).then((res) => {
|
||||||
@ -502,15 +507,59 @@ export const ModalTiсket = ({
|
|||||||
setAcceptModalOpen(false);
|
setAcceptModalOpen(false);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const initListeners = () => {
|
||||||
|
document.addEventListener("click", closeByClickingOut);
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeByClickingOut = (event) => {
|
||||||
|
const path = event.path || (event.composedPath && event.composedPath());
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("button-add-worker") ||
|
||||||
|
div.classList.contains("dropdownList"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setDropListOpen(false);
|
||||||
|
setDropListMembersOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("deadLine") ||
|
||||||
|
div.classList.contains("react-datepicker-popper"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setDatePickerOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("tags") ||
|
||||||
|
div.classList.contains("tags__dropDown"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setSelectTagsOpen(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={active ? "modal-tiket active" : "modal-tiket"}
|
className={active ? "modal-tiket active" : "modal-tiket"}
|
||||||
onClick={() => setActive(false)}
|
onClick={(e) => {
|
||||||
|
if (e.target.className.includes("modal-tiket")) setActive(false);
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<div
|
<div className="modal-tiket__content">
|
||||||
className="modal-tiket__content"
|
|
||||||
onClick={(e) => e.stopPropagation()}
|
|
||||||
>
|
|
||||||
<div className="content">
|
<div className="content">
|
||||||
<h3 className="title-project">
|
<h3 className="title-project">
|
||||||
<img src={category} className="title-project__category"></img>
|
<img src={category} className="title-project__category"></img>
|
||||||
@ -646,7 +695,11 @@ export const ModalTiсket = ({
|
|||||||
}));
|
}));
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<img src={send} onClick={createComment}></img>
|
<img
|
||||||
|
className={commentSendDisable ? "disable" : ""}
|
||||||
|
src={send}
|
||||||
|
onClick={createComment}
|
||||||
|
></img>
|
||||||
</div>
|
</div>
|
||||||
<div className="comments__list">
|
<div className="comments__list">
|
||||||
{comments.map((comment) => {
|
{comments.map((comment) => {
|
||||||
|
@ -584,6 +584,11 @@
|
|||||||
margin-right: 18px;
|
margin-right: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.disable {
|
||||||
|
pointer-events: none;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
//&:focus-within {
|
//&:focus-within {
|
||||||
// border: 1px solid #0000004d;
|
// border: 1px solid #0000004d;
|
||||||
//}
|
//}
|
||||||
|
@ -93,8 +93,10 @@ export const TicketFullScreen = () => {
|
|||||||
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
|
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
|
||||||
const [correctProjectTags, setCorrectProjectTags] = useState([]);
|
const [correctProjectTags, setCorrectProjectTags] = useState([]);
|
||||||
const { showNotification } = useNotification();
|
const { showNotification } = useNotification();
|
||||||
|
const [commentSendDisable, setCommentSendDisable] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
initListeners();
|
||||||
apiRequest(`/task/get-task?task_id=${ticketId.id}&expand=mark`).then(
|
apiRequest(`/task/get-task?task_id=${ticketId.id}&expand=mark`).then(
|
||||||
(taskInfo) => {
|
(taskInfo) => {
|
||||||
setTaskInfo(taskInfo);
|
setTaskInfo(taskInfo);
|
||||||
@ -217,6 +219,8 @@ export const TicketFullScreen = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function createComment() {
|
function createComment() {
|
||||||
|
if (!inputsValue.comment) return;
|
||||||
|
setCommentSendDisable(true);
|
||||||
apiRequest("/comment/create", {
|
apiRequest("/comment/create", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
data: {
|
data: {
|
||||||
@ -226,6 +230,7 @@ export const TicketFullScreen = () => {
|
|||||||
},
|
},
|
||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
let newComment = res;
|
let newComment = res;
|
||||||
|
setCommentSendDisable(false);
|
||||||
newComment.created_at = new Date();
|
newComment.created_at = new Date();
|
||||||
newComment.subComments = [];
|
newComment.subComments = [];
|
||||||
setInputsValue((prevValue) => ({ ...prevValue, comment: "" }));
|
setInputsValue((prevValue) => ({ ...prevValue, comment: "" }));
|
||||||
@ -525,6 +530,63 @@ export const TicketFullScreen = () => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const initListeners = () => {
|
||||||
|
document.addEventListener("click", closeByClickingOut);
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeByClickingOut = (event) => {
|
||||||
|
const path = event.path || (event.composedPath && event.composedPath());
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("button-add-worker") ||
|
||||||
|
div.classList.contains("dropdownList"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setDropListOpen(false);
|
||||||
|
setDropListMembersOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("deadLine") ||
|
||||||
|
div.classList.contains("react-datepicker-popper"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setDatePickerOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("tags") ||
|
||||||
|
div.classList.contains("tags__dropDown"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setSelectTagsOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("addPerson") ||
|
||||||
|
div.classList.contains("persons__list"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setPersonListOpen(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="ticket-full-screen">
|
<section className="ticket-full-screen">
|
||||||
<ProfileHeader />
|
<ProfileHeader />
|
||||||
@ -820,7 +882,12 @@ export const TicketFullScreen = () => {
|
|||||||
}));
|
}));
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<img src={send} onClick={createComment} alt="send"></img>
|
<img
|
||||||
|
className={commentSendDisable ? "disable" : ""}
|
||||||
|
src={send}
|
||||||
|
onClick={createComment}
|
||||||
|
alt="send"
|
||||||
|
></img>
|
||||||
</div>
|
</div>
|
||||||
<div className="comments__list">
|
<div className="comments__list">
|
||||||
{comments.map((comment) => {
|
{comments.map((comment) => {
|
||||||
|
@ -90,6 +90,7 @@ export const ProjectTracker = () => {
|
|||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
dispatch(activeLoader());
|
dispatch(activeLoader());
|
||||||
dispatch(setProjectBoardFetch(projectId.id));
|
dispatch(setProjectBoardFetch(projectId.id));
|
||||||
|
initListeners();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@ -353,6 +354,72 @@ export const ProjectTracker = () => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const initListeners = () => {
|
||||||
|
document.addEventListener("click", closeByClickingOut);
|
||||||
|
};
|
||||||
|
|
||||||
|
const closeByClickingOut = (event) => {
|
||||||
|
const path = event.path || (event.composedPath && event.composedPath());
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("addPerson") ||
|
||||||
|
div.classList.contains("persons__list"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setPersonListOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("tasks__head__executor") ||
|
||||||
|
div.classList.contains("tasks__head__executorDropdown"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setSelectedExecutorOpen(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("tasks__head__tags") ||
|
||||||
|
div.classList.contains("tags__list"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setTags({
|
||||||
|
open: false,
|
||||||
|
add: false,
|
||||||
|
edit: false,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
event &&
|
||||||
|
!path.find(
|
||||||
|
(div) =>
|
||||||
|
div.classList &&
|
||||||
|
(div.classList.contains("board__head__more") ||
|
||||||
|
div.classList.contains("column__select"))
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
setOpenColumnSelect((prevState) => {
|
||||||
|
const newState = {};
|
||||||
|
for (const key in prevState) {
|
||||||
|
newState[key] = false;
|
||||||
|
}
|
||||||
|
return newState;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="tracker">
|
<div className="tracker">
|
||||||
<ProfileHeader />
|
<ProfileHeader />
|
||||||
|
Loading…
Reference in New Issue
Block a user