task priority

This commit is contained in:
Mikola 2023-11-21 16:41:18 +03:00
parent 5b60001013
commit 8c440ce7c7
4 changed files with 202 additions and 170 deletions

View File

@ -75,7 +75,7 @@ export const ModalTiсket = ({
const [dropListOpen, setDropListOpen] = useState(false); const [dropListOpen, setDropListOpen] = useState(false);
const [dropListMembersOpen, setDropListMembersOpen] = useState(false); const [dropListMembersOpen, setDropListMembersOpen] = useState(false);
const [executor, setExecutor] = useState(task.executor); const [executor, setExecutor] = useState(task.executor);
const [taskPriority, setTaskPriority] = useState(task.execution_priority) const [taskPriority, setTaskPriority] = useState(task.execution_priority);
const [members, setMembers] = useState(task.taskUsers); const [members, setMembers] = useState(task.taskUsers);
const [taskTags, setTaskTags] = useState(task.mark); const [taskTags, setTaskTags] = useState(task.mark);
const [users, setUsers] = useState([]); const [users, setUsers] = useState([]);
@ -95,7 +95,7 @@ export const ModalTiсket = ({
const profileInfo = useSelector(getProfileInfo); const profileInfo = useSelector(getProfileInfo);
const [acceptModalOpen, setAcceptModalOpen] = useState(false); const [acceptModalOpen, setAcceptModalOpen] = useState(false);
const [selectTagsOpen, setSelectTagsOpen] = useState(false); const [selectTagsOpen, setSelectTagsOpen] = useState(false);
const [selectPriorityOpen, setSelectPriorityOpen] = useState(false) const [selectPriorityOpen, setSelectPriorityOpen] = useState(false);
const { showNotification } = useNotification(); const { showNotification } = useNotification();
const [commentSendDisable, setCommentSendDisable] = useState(false); const [commentSendDisable, setCommentSendDisable] = useState(false);
@ -117,27 +117,26 @@ export const ModalTiсket = ({
}); });
} }
const priority = const priority = {
{ 2: "Высокий",
2: 'Высокий', 1: "Средний",
1: 'Средний', 0: "Низкий",
0: 'Низкий' };
}
const priorityTypes = [ const priorityTypes = [
{ {
name: 'Высокий', name: "Высокий",
key: 2 key: 2,
}, },
{ {
name: 'Средний', name: "Средний",
key: 1 key: 1,
}, },
{ {
name: 'Низкий', name: "Низкий",
key: 0 key: 0,
}, },
] ];
function archiveTask() { function archiveTask() {
setAcceptModalOpen(true); setAcceptModalOpen(true);
@ -287,12 +286,12 @@ export const ModalTiсket = ({
} }
function updateTaskPriority(key) { function updateTaskPriority(key) {
setSelectPriorityOpen(false) setSelectPriorityOpen(false);
apiRequest("/task/update-task", { apiRequest("/task/update-task", {
method: "PUT", method: "PUT",
data: { data: {
task_id: task.id, task_id: task.id,
execution_priority: key execution_priority: key,
}, },
}).then(() => { }).then(() => {
dispatch(setProjectBoardFetch(projectId)); dispatch(setProjectBoardFetch(projectId));
@ -1006,29 +1005,40 @@ export const ModalTiсket = ({
)} )}
</div> </div>
</div> </div>
<div className='workers_box-priority'> <div className="workers_box-priority">
<div className='priority__name' onClick={() => setSelectPriorityOpen(!selectPriorityOpen)}> <div
<span>{typeof taskPriority === "number" ? priority[taskPriority] : 'Выберете приоритет'}</span> className="priority__name"
onClick={() => setSelectPriorityOpen(!selectPriorityOpen)}
>
<span>
{typeof taskPriority === "number"
? priority[taskPriority]
: "Выберете приоритет"}
</span>
<img <img
className={selectPriorityOpen ? "open" : ""} className={selectPriorityOpen ? "open" : ""}
src={arrowDown} src={arrowDown}
alt="arrow" alt="arrow"
/> />
</div> </div>
{selectPriorityOpen && {selectPriorityOpen && (
<div className='priority__dropDown'> <div className="priority__dropDown">
{priorityTypes.map((item) => { {priorityTypes.map((item) => {
return <div return (
className='priority__dropDown__item' <div
key={item.key} className="priority__dropDown__item"
onClick={() => { key={item.key}
setTaskPriority(item.key) onClick={() => {
updateTaskPriority(item.key) setTaskPriority(item.key);
}} updateTaskPriority(item.key);
>{item.name}</div> }}
})} >
</div> {item.name}
} </div>
);
})}
</div>
)}
</div> </div>
<div className="workers_box-bottom"> <div className="workers_box-bottom">
<div <div

View File

@ -10,7 +10,8 @@ import { getProfileInfo } from "@redux/outstaffingSlice";
import { import {
deletePersonOnProject, deletePersonOnProject,
getBoarderLoader, getBoarderLoader,
modalToggle, setProjectBoardFetch, modalToggle,
setProjectBoardFetch,
setToggleTab, setToggleTab,
} from "@redux/projectsTrackerSlice"; } from "@redux/projectsTrackerSlice";
@ -89,35 +90,35 @@ export const TicketFullScreen = () => {
const [startDate, setStartDate] = useState(null); const [startDate, setStartDate] = useState(null);
const [uploadedFile, setUploadedFile] = useState(null); const [uploadedFile, setUploadedFile] = useState(null);
const [taskFiles, setTaskFiles] = useState([]); const [taskFiles, setTaskFiles] = useState([]);
const [taskPriority, setTaskPriority] = useState("") const [taskPriority, setTaskPriority] = useState("");
const [acceptModalOpen, setAcceptModalOpen] = useState(false); const [acceptModalOpen, setAcceptModalOpen] = useState(false);
const [taskTags, setTaskTags] = useState([]); const [taskTags, setTaskTags] = useState([]);
const [selectTagsOpen, setSelectTagsOpen] = useState(false); const [selectTagsOpen, setSelectTagsOpen] = useState(false);
const [selectPriorityOpen, setSelectPriorityOpen] = useState(false) const [selectPriorityOpen, setSelectPriorityOpen] = useState(false);
const [correctProjectTags, setCorrectProjectTags] = useState([]); const [correctProjectTags, setCorrectProjectTags] = useState([]);
const { showNotification } = useNotification(); const { showNotification } = useNotification();
const [commentSendDisable, setCommentSendDisable] = useState(false); const [commentSendDisable, setCommentSendDisable] = useState(false);
const priority = { const priority = {
2: 'Высокий', 2: "Высокий",
1: 'Средний', 1: "Средний",
0: 'Низкий' 0: "Низкий",
} };
const priorityTypes = [ const priorityTypes = [
{ {
name: 'Высокий', name: "Высокий",
key: 2 key: 2,
}, },
{ {
name: 'Средний', name: "Средний",
key: 1 key: 1,
}, },
{ {
name: 'Низкий', name: "Низкий",
key: 0 key: 0,
}, },
] ];
useEffect(() => { useEffect(() => {
initListeners(); initListeners();
@ -125,7 +126,7 @@ export const TicketFullScreen = () => {
(taskInfo) => { (taskInfo) => {
setTaskInfo(taskInfo); setTaskInfo(taskInfo);
setDeadLine(taskInfo.dead_line); setDeadLine(taskInfo.dead_line);
setTaskPriority(taskInfo.execution_priority) setTaskPriority(taskInfo.execution_priority);
setStartDate( setStartDate(
taskInfo.dead_line ? new Date(taskInfo.dead_line) : new Date() taskInfo.dead_line ? new Date(taskInfo.dead_line) : new Date()
); );
@ -509,15 +510,14 @@ export const TicketFullScreen = () => {
} }
function updateTaskPriority(key) { function updateTaskPriority(key) {
setSelectPriorityOpen(false) setSelectPriorityOpen(false);
apiRequest("/task/update-task", { apiRequest("/task/update-task", {
method: "PUT", method: "PUT",
data: { data: {
task_id: taskInfo.id, task_id: taskInfo.id,
execution_priority: key execution_priority: key,
}, },
}).then(() => { }).then(() => {});
});
} }
// function deleteFile(file) { // function deleteFile(file) {
@ -1144,84 +1144,95 @@ export const TicketFullScreen = () => {
<div className="tags__selected"> <div className="tags__selected">
{taskTags.map((tag) => { {taskTags.map((tag) => {
return ( return (
<div <div
className="tags__selected__item" className="tags__selected__item"
key={tag.id} key={tag.id}
style={{ background: tag.color }} style={{ background: tag.color }}
> >
<p>{tag.slug}</p> <p>{tag.slug}</p>
<img <img
src={close} src={close}
className="delete" className="delete"
alt="delete" alt="delete"
onClick={() => deleteTagFromTask(tag.id)} onClick={() => deleteTagFromTask(tag.id)}
/> />
</div> </div>
); );
})} })}
</div> </div>
<div <div
className="tags__select" className="tags__select"
onClick={() => setSelectTagsOpen(!selectTagsOpen)} onClick={() => setSelectTagsOpen(!selectTagsOpen)}
> >
<span>Выберете тег</span> <span>Выберете тег</span>
<img <img
className={selectTagsOpen ? "open" : ""} className={selectTagsOpen ? "open" : ""}
src={arrowDown} src={arrowDown}
alt="arrow" alt="arrow"
/> />
</div> </div>
{selectTagsOpen && ( {selectTagsOpen && (
<div className="tags__dropDown"> <div className="tags__dropDown">
<img <img
onClick={() => setSelectTagsOpen(false)} onClick={() => setSelectTagsOpen(false)}
className="tags__dropDown__close" className="tags__dropDown__close"
src={close} src={close}
alt="close" alt="close"
/> />
{correctProjectTags.map((tag) => { {correctProjectTags.map((tag) => {
return ( return (
<div <div
className="tagItem" className="tagItem"
key={tag.id} key={tag.id}
onClick={() => addTagToTask(tag.id)} onClick={() => addTagToTask(tag.id)}
> >
<p>{tag.slug}</p> <p>{tag.slug}</p>
<span style={{ background: tag.color }} /> <span style={{ background: tag.color }} />
</div> </div>
); );
})} })}
{!Boolean(correctProjectTags.length) && ( {!Boolean(correctProjectTags.length) && (
<p className="tags__dropDown__noItem">Нет тегов</p> <p className="tags__dropDown__noItem">Нет тегов</p>
)} )}
</div> </div>
)} )}
</div> </div>
</div> </div>
<div className='workers_box-priority'> <div className="workers_box-priority">
<div className='priority__name' onClick={() => setSelectPriorityOpen(!selectPriorityOpen)}> <div
<span>{typeof taskPriority === "number" ? priority[taskPriority] : 'Выберете приоритет'}</span> className="priority__name"
onClick={() => setSelectPriorityOpen(!selectPriorityOpen)}
>
<span>
{typeof taskPriority === "number"
? priority[taskPriority]
: "Выберете приоритет"}
</span>
<img <img
className={selectPriorityOpen ? "open" : ""} className={selectPriorityOpen ? "open" : ""}
src={arrowDown} src={arrowDown}
alt="arrow" alt="arrow"
/> />
</div> </div>
{selectPriorityOpen && {selectPriorityOpen && (
<div className='priority__dropDown'> <div className="priority__dropDown">
{priorityTypes.map((item) => { {priorityTypes.map((item) => {
return <div return (
className='priority__dropDown__item' <div
key={item.key} className="priority__dropDown__item"
onClick={() => { key={item.key}
setTaskPriority(item.key) onClick={() => {
updateTaskPriority(item.key) setTaskPriority(item.key);
}} updateTaskPriority(item.key);
>{item.name}</div> }}
})} >
</div> {item.name}
} </div>
);
})}
</div>
)}
</div> </div>
<div className="workers_box-bottom"> <div className="workers_box-bottom">
<div <div

View File

@ -81,8 +81,8 @@ export const TrackerModal = ({
const [correctProjectTags, setCorrectProjectTags] = useState([]); const [correctProjectTags, setCorrectProjectTags] = useState([]);
const [taskTags, setTaskTags] = useState([]); const [taskTags, setTaskTags] = useState([]);
const [selectTagsOpen, setSelectTagsOpen] = useState(false); const [selectTagsOpen, setSelectTagsOpen] = useState(false);
const [selectedPriority, setSelectedPriority] = useState(null) const [selectedPriority, setSelectedPriority] = useState(null);
const [selectPriority, setSelectPriority] = useState(false) const [selectPriority, setSelectPriority] = useState(false);
const [selectColumnPriorityOpen, setSelectColumnPriorityOpen] = const [selectColumnPriorityOpen, setSelectColumnPriorityOpen] =
useState(false); useState(false);
const { showNotification } = useNotification(); const { showNotification } = useNotification();
@ -91,19 +91,19 @@ export const TrackerModal = ({
const [startDate, setStartDate] = useState(new Date()); const [startDate, setStartDate] = useState(new Date());
const priority = [ const priority = [
{
name: 'Высокий',
key: 2
},
{ {
name: 'Средний', name: "Высокий",
key: 1 key: 2,
}, },
{ {
name: 'Низкий', name: "Средний",
key: 0 key: 1,
}, },
] {
name: "Низкий",
key: 0,
},
];
function createTab() { function createTab() {
if (!valueColumn) { if (!valueColumn) {
@ -146,7 +146,7 @@ export const TrackerModal = ({
status: 1, status: 1,
user_id: localStorage.getItem("id"), user_id: localStorage.getItem("id"),
column_id: selectedTab, column_id: selectedTab,
execution_priority: selectedPriority ? selectedPriority.key : '', execution_priority: selectedPriority ? selectedPriority.key : "",
priority: priorityTask, priority: priorityTask,
dead_line: deadLineDate ? getCorrectRequestDate(deadLineDate) : "", dead_line: deadLineDate ? getCorrectRequestDate(deadLineDate) : "",
}, },
@ -183,7 +183,7 @@ export const TrackerModal = ({
setValueTiket(""); setValueTiket("");
setDescriptionTicket(""); setDescriptionTicket("");
setSelectedExecutorTask("Выберите исполнителя задачи"); setSelectedExecutorTask("Выберите исполнителя задачи");
setSelectedPriority(null) setSelectedPriority(null);
}); });
} else { } else {
setActive(false); setActive(false);
@ -605,33 +605,38 @@ export const TrackerModal = ({
</div> </div>
)} )}
</div> </div>
<div className='select__priority'> <div className="select__priority">
<div className='select__priority__name' <div
onClick={() => setSelectPriority(!selectPriority)} className="select__priority__name"
onClick={() => setSelectPriority(!selectPriority)}
> >
{selectedPriority ? `Приоритет: ${selectedPriority.name}` : 'Выберети приоритет'} {selectedPriority
? `Приоритет: ${selectedPriority.name}`
: "Выберети приоритет"}
<img <img
className={ className={selectPriority ? "arrow arrow--open" : "arrow"}
selectPriority ? "arrow arrow--open" : "arrow" src={arrowDown}
} alt="arrow"
src={arrowDown}
alt="arrow"
/> />
</div> </div>
{selectPriority && {selectPriority && (
<div className='select__priority__dropDown'> <div className="select__priority__dropDown">
{priority.map((item) => { {priority.map((item) => {
return <div return (
className='dropdown__item' <div
key={item.key} className="dropdown__item"
onClick={() => { key={item.key}
setSelectPriority(false) onClick={() => {
setSelectedPriority(item) setSelectPriority(false);
}} setSelectedPriority(item);
>{item.name}</div> }}
})} >
</div> {item.name}
} </div>
);
})}
</div>
)}
</div> </div>
<div <div
onClick={() => onClick={() =>

View File

@ -90,18 +90,17 @@ export const ProjectTracker = () => {
const loader = useSelector(getBoarderLoader); const loader = useSelector(getBoarderLoader);
const { showNotification } = useNotification(); const { showNotification } = useNotification();
const priority = const priority = {
{ 2: "Высокий",
2: 'Высокий', 1: "Средний",
1: 'Средний', 0: "Низкий",
0: 'Низкий' };
}
const priorityClass = { const priorityClass = {
2: 'high', 2: "high",
1: 'middle', 1: "middle",
0: 'low' 0: "low",
} };
useEffect(() => { useEffect(() => {
dispatch(activeLoader()); dispatch(activeLoader());
@ -1011,12 +1010,19 @@ export const ProjectTracker = () => {
})} })}
</div> </div>
)} )}
{typeof task.execution_priority === "number" && {typeof task.execution_priority ===
<div className='tasks__board__item__priority'> "number" && (
<p>Приоритет:</p> <div className="tasks__board__item__priority">
<span className={priorityClass[task.execution_priority]}>{priority[task.execution_priority]}</span> <p>Приоритет:</p>
</div> <span
} className={
priorityClass[task.execution_priority]
}
>
{priority[task.execution_priority]}
</span>
</div>
)}
{task.dead_line && ( {task.dead_line && (
<div className="tasks__board__item__deadLine"> <div className="tasks__board__item__deadLine">
<p>Срок исполнения:</p> <p>Срок исполнения:</p>