Merge pull request #152 from apuc/registration

Priority
This commit is contained in:
NikoM1k 2023-11-21 16:42:04 +03:00 committed by GitHub
commit aa1cd18a8e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 362 additions and 3 deletions

View File

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

View File

@ -1091,6 +1091,64 @@
}
}
&-priority {
position: relative;
padding: 10px 40px 0 40px;
border-radius: 10px;
margin-bottom: 10px;
.priority {
&__name {
cursor: pointer;
width: 100%;
height: 42px;
border-radius: 8px;
background: #ddd;
padding: 8px 12px 9px 12px;
display: flex;
justify-content: space-between;
align-items: center;
span {
font-size: 14px;
color: black;
}
img {
transition: all 0.3s ease;
}
.open {
transform: rotate(180deg);
}
}
&__dropDown {
position: absolute;
padding: 5px;
background: #ebebeb;
width: 30%;
border-radius: 8px;
border: 1px solid #e4e4e4;
top: 105%;
display: flex;
flex-direction: column;
align-items: center;
font-size: 16px;
row-gap: 6px;
z-index: 10;
&__item {
cursor: pointer;
&:hover {
font-weight: 700;
}
}
}
}
}
&-bottom {
padding: 10px 110px 15px 56px;
font-weight: 400;

View File

@ -11,6 +11,7 @@ import {
deletePersonOnProject,
getBoarderLoader,
modalToggle,
setProjectBoardFetch,
setToggleTab,
} from "@redux/projectsTrackerSlice";
@ -89,19 +90,43 @@ export const TicketFullScreen = () => {
const [startDate, setStartDate] = useState(null);
const [uploadedFile, setUploadedFile] = useState(null);
const [taskFiles, setTaskFiles] = useState([]);
const [taskPriority, setTaskPriority] = useState("");
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
const [taskTags, setTaskTags] = useState([]);
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
const [selectPriorityOpen, setSelectPriorityOpen] = useState(false);
const [correctProjectTags, setCorrectProjectTags] = useState([]);
const { showNotification } = useNotification();
const [commentSendDisable, setCommentSendDisable] = useState(false);
const priority = {
2: "Высокий",
1: "Средний",
0: "Низкий",
};
const priorityTypes = [
{
name: "Высокий",
key: 2,
},
{
name: "Средний",
key: 1,
},
{
name: "Низкий",
key: 0,
},
];
useEffect(() => {
initListeners();
apiRequest(`/task/get-task?task_id=${ticketId.id}&expand=mark`).then(
(taskInfo) => {
setTaskInfo(taskInfo);
setDeadLine(taskInfo.dead_line);
setTaskPriority(taskInfo.execution_priority);
setStartDate(
taskInfo.dead_line ? new Date(taskInfo.dead_line) : new Date()
);
@ -484,6 +509,17 @@ export const TicketFullScreen = () => {
setUploadedFile(null);
}
function updateTaskPriority(key) {
setSelectPriorityOpen(false);
apiRequest("/task/update-task", {
method: "PUT",
data: {
task_id: taskInfo.id,
execution_priority: key,
},
}).then(() => {});
}
// function deleteFile(file) {
// apiRequest("/file/detach", {
// method: "DELETE",
@ -1103,8 +1139,7 @@ export const TicketFullScreen = () => {
</button>
)}
</div>
<div className="workers_box-bottom">
<div className="workers_box-tag">
<div className="tags">
<div className="tags__selected">
{taskTags.map((tag) => {
@ -1162,6 +1197,44 @@ export const TicketFullScreen = () => {
</div>
)}
</div>
</div>
<div className="workers_box-priority">
<div
className="priority__name"
onClick={() => setSelectPriorityOpen(!selectPriorityOpen)}
>
<span>
{typeof taskPriority === "number"
? priority[taskPriority]
: "Выберете приоритет"}
</span>
<img
className={selectPriorityOpen ? "open" : ""}
src={arrowDown}
alt="arrow"
/>
</div>
{selectPriorityOpen && (
<div className="priority__dropDown">
{priorityTypes.map((item) => {
return (
<div
className="priority__dropDown__item"
key={item.key}
onClick={() => {
setTaskPriority(item.key);
updateTaskPriority(item.key);
}}
>
{item.name}
</div>
);
})}
</div>
)}
</div>
<div className="workers_box-bottom">
<div
className={editOpen ? "edit" : ""}
onClick={() => {

View File

@ -32,7 +32,6 @@ import { getCorrectDate } from "@components/Calendar/calendarHelper";
import BaseButton from "@components/Common/BaseButton/BaseButton";
import ModalLayout from "@components/Common/ModalLayout/ModalLayout";
import arrowCreateTask from "assets/icons/arrows/arrowCreateTask.svg";
import arrowRight from "assets/icons/arrows/arrowRightCreateTask.svg";
import arrowDown from "assets/icons/arrows/selectArrow.png";
import close from "assets/icons/close.png";
@ -82,6 +81,8 @@ export const TrackerModal = ({
const [correctProjectTags, setCorrectProjectTags] = useState([]);
const [taskTags, setTaskTags] = useState([]);
const [selectTagsOpen, setSelectTagsOpen] = useState(false);
const [selectedPriority, setSelectedPriority] = useState(null);
const [selectPriority, setSelectPriority] = useState(false);
const [selectColumnPriorityOpen, setSelectColumnPriorityOpen] =
useState(false);
const { showNotification } = useNotification();
@ -89,6 +90,21 @@ export const TrackerModal = ({
const [datePickerOpen, setDatePickerOpen] = useState(false);
const [startDate, setStartDate] = useState(new Date());
const priority = [
{
name: "Высокий",
key: 2,
},
{
name: "Средний",
key: 1,
},
{
name: "Низкий",
key: 0,
},
];
function createTab() {
if (!valueColumn) {
showNotification({ show: true, text: "Введите название", type: "error" });
@ -130,6 +146,7 @@ export const TrackerModal = ({
status: 1,
user_id: localStorage.getItem("id"),
column_id: selectedTab,
execution_priority: selectedPriority ? selectedPriority.key : "",
priority: priorityTask,
dead_line: deadLineDate ? getCorrectRequestDate(deadLineDate) : "",
},
@ -166,6 +183,7 @@ export const TrackerModal = ({
setValueTiket("");
setDescriptionTicket("");
setSelectedExecutorTask("Выберите исполнителя задачи");
setSelectedPriority(null);
});
} else {
setActive(false);
@ -587,6 +605,39 @@ export const TrackerModal = ({
</div>
)}
</div>
<div className="select__priority">
<div
className="select__priority__name"
onClick={() => setSelectPriority(!selectPriority)}
>
{selectedPriority
? `Приоритет: ${selectedPriority.name}`
: "Выберети приоритет"}
<img
className={selectPriority ? "arrow arrow--open" : "arrow"}
src={arrowDown}
alt="arrow"
/>
</div>
{selectPriority && (
<div className="select__priority__dropDown">
{priority.map((item) => {
return (
<div
className="dropdown__item"
key={item.key}
onClick={() => {
setSelectPriority(false);
setSelectedPriority(item);
}}
>
{item.name}
</div>
);
})}
</div>
)}
</div>
<div
onClick={() =>
setSelectExecutorTaskOpen(!selectExecutorTaskOpen)

View File

@ -520,6 +520,57 @@
}
}
.select__priority {
position: relative;
&__name {
color: #000;
width: 393px;
height: 47px;
font-size: 15px;
font-weight: 400;
line-height: normal;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
padding: 9.5px 12px;
border-radius: 8px;
height: 47px;
border: 1px solid #e4e4e4;
margin-bottom: 10px;
}
&__dropDown {
position: absolute;
border-radius: 8px;
padding: 9.5px 12px;
display: flex;
flex-direction: column;
row-gap: 5px;
width: 100%;
background: #f1f1f1;
z-index: 101;
.dropdown__item {
font-size: 16px;
cursor: pointer;
&:hover {
font-weight: 700;
}
}
}
img {
transition: all 0.3s ease;
}
.arrow--open {
transform: rotate(180deg);
}
}
.select__executor {
background: #f1f1f1;
width: 393px;

View File

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

View File

@ -1124,6 +1124,36 @@
}
}
&__priority {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
p {
font-weight: 500;
font-size: 14px;
}
span {
font-weight: 500;
font-size: 14px;
}
.high {
color: red;
}
.middle {
color: #cece00;
}
.low {
color: green;
}
}
&__deadLine {
display: flex;
align-items: center;