NikoM1k
GitHub
commit
e7a1273d17
@ -4,6 +4,10 @@
|
||||
align-self: center;
|
||||
margin-bottom: 194px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
|
||||
&__header {
|
||||
font-family: "GT Eesti Pro Display";
|
||||
font-size: 5.3em;
|
||||
@ -19,6 +23,15 @@
|
||||
letter-spacing: 0.56px;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
margin-top: 25px;
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
font-size: 4em;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&__sign-in {
|
||||
@ -63,6 +76,14 @@
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
margin-left: 120px;
|
||||
|
||||
@media (max-width: 700px) {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -175,7 +196,6 @@
|
||||
margin-bottom: 0px;
|
||||
|
||||
&__header {
|
||||
margin-top: 120px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
@ -196,6 +216,7 @@
|
||||
height: 45px;
|
||||
border-radius: 22.5px;
|
||||
padding-left: 22px;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
&-btn {
|
||||
|
||||
50
src/components/FileTracker/FileTracker.jsx
Normal file
50
src/components/FileTracker/FileTracker.jsx
Normal file
@ -0,0 +1,50 @@
|
||||
import React, { useState } from "react";
|
||||
|
||||
import { backendImg } from "@utils/helper";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
import close from "assets/icons/closeProjectPersons.svg";
|
||||
|
||||
const FileTracker = ({ file, setDeletedTask, taskId }) => {
|
||||
const [openImg, setOpenImg] = useState(false);
|
||||
function deleteFile(file) {
|
||||
apiRequest("/file/detach", {
|
||||
method: "DELETE",
|
||||
data: {
|
||||
file_id: file.id,
|
||||
entity_type: 2,
|
||||
entity_id: taskId,
|
||||
status: 0,
|
||||
},
|
||||
}).then(() => {
|
||||
setDeletedTask(file);
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className={openImg ? "taskFile ImgOpened" : "taskFile"}
|
||||
key={file.id}
|
||||
onClick={() => {
|
||||
if (openImg) setOpenImg(!openImg);
|
||||
}}
|
||||
>
|
||||
<img
|
||||
className="imgFile"
|
||||
src={backendImg(file.file?.url)}
|
||||
alt="img"
|
||||
onClick={() => {
|
||||
if (!openImg) setOpenImg(!openImg);
|
||||
}}
|
||||
/>
|
||||
{!openImg && (
|
||||
<div className="deleteFile" onClick={() => deleteFile(file)}>
|
||||
<img src={close} alt="delete" />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FileTracker;
|
||||
@ -22,6 +22,7 @@ import { apiRequest } from "@api/request";
|
||||
|
||||
import { useNotification } from "@hooks/useNotification";
|
||||
|
||||
import FileTracker from "@components/FileTracker/FileTracker";
|
||||
import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
|
||||
import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal";
|
||||
import TrackerTaskComment from "@components/TrackerTaskComment/TrackerTaskComment";
|
||||
@ -52,6 +53,7 @@ export const ModalTiсket = ({
|
||||
projectId,
|
||||
projectName,
|
||||
projectUsers,
|
||||
projectOwnerId,
|
||||
}) => {
|
||||
const dispatch = useDispatch();
|
||||
const [addSubtask, setAddSubtask] = useState(false);
|
||||
@ -120,6 +122,11 @@ export const ModalTiсket = ({
|
||||
},
|
||||
}).then((res) => {
|
||||
dispatch(setProjectBoardFetch(projectId));
|
||||
showNotification({
|
||||
show: true,
|
||||
text: "Изменения сохранены",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@ -366,19 +373,9 @@ export const ModalTiсket = ({
|
||||
}
|
||||
|
||||
function deleteFile(file) {
|
||||
apiRequest("/file/detach", {
|
||||
method: "DELETE",
|
||||
data: {
|
||||
file_id: file.id,
|
||||
entity_type: 2,
|
||||
entity_id: task.id,
|
||||
status: 0,
|
||||
},
|
||||
}).then(() => {
|
||||
setTaskFiles((prevValue) =>
|
||||
prevValue.filter((item) => item.id !== file.id)
|
||||
);
|
||||
});
|
||||
setTaskFiles((prevValue) =>
|
||||
prevValue.filter((item) => item.id !== file.id)
|
||||
);
|
||||
}
|
||||
|
||||
function startTimer() {
|
||||
@ -528,19 +525,12 @@ export const ModalTiсket = ({
|
||||
<div className="task__files">
|
||||
{taskFiles.map((file) => {
|
||||
return (
|
||||
<div className="taskFile" key={file.id}>
|
||||
<img
|
||||
className="imgFile"
|
||||
src={backendImg(file.file?.url)}
|
||||
alt="img"
|
||||
/>
|
||||
<div
|
||||
className="deleteFile"
|
||||
onClick={() => deleteFile(file)}
|
||||
>
|
||||
<img src={close} alt="delete" />
|
||||
</div>
|
||||
</div>
|
||||
<FileTracker
|
||||
key={file.id}
|
||||
file={file}
|
||||
setDeletedTask={deleteFile}
|
||||
taskId={task.id}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
@ -833,11 +823,27 @@ export const ModalTiсket = ({
|
||||
<img src={link}></img>
|
||||
<p onClick={copyTicketLink}>ссылка на задачу</p>
|
||||
</div>
|
||||
<div onClick={archiveTask}>
|
||||
<div
|
||||
onClick={archiveTask}
|
||||
className={
|
||||
profileInfo.id_user === projectOwnerId ||
|
||||
profileInfo.id_user === task.user_id
|
||||
? ""
|
||||
: "disable"
|
||||
}
|
||||
>
|
||||
<img src={archive}></img>
|
||||
<p>в архив</p>
|
||||
</div>
|
||||
<div onClick={deleteTask}>
|
||||
<div
|
||||
onClick={deleteTask}
|
||||
className={
|
||||
profileInfo.id_user === projectOwnerId ||
|
||||
profileInfo.id_user === task.user_id
|
||||
? ""
|
||||
: "disable"
|
||||
}
|
||||
>
|
||||
<img src={del}></img>
|
||||
<p>удалить</p>
|
||||
</div>
|
||||
|
||||
@ -20,6 +20,7 @@
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
max-height: 750px;
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
@ -116,45 +117,35 @@
|
||||
}
|
||||
|
||||
.taskName {
|
||||
display: -webkit-box;
|
||||
max-width: 550px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.taskDescription {
|
||||
display: -webkit-box;
|
||||
max-width: 550px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-line-clamp: 4;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.fullName {
|
||||
max-width: 800px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.fullDescription {
|
||||
max-width: 800px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 5;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.comments__list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-height: 300px;
|
||||
max-height: 215px;
|
||||
overflow: auto;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
@ -357,7 +348,7 @@
|
||||
column-gap: 25px;
|
||||
row-gap: 20px;
|
||||
margin-top: 33px;
|
||||
max-height: 350px;
|
||||
max-height: 170px;
|
||||
overflow-y: auto;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
@ -376,6 +367,7 @@
|
||||
}
|
||||
|
||||
.taskFile {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
.imgFile {
|
||||
max-width: 170px;
|
||||
@ -409,6 +401,26 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ImgOpened {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 100;
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
|
||||
.imgFile {
|
||||
width: 90vw;
|
||||
height: 90vh;
|
||||
max-width: none;
|
||||
max-height: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fileLoaded {
|
||||
|
||||
@ -6,6 +6,7 @@ import DatePicker, { registerLocale } from "react-datepicker";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { Link, useNavigate, useParams } from "react-router-dom";
|
||||
|
||||
import { getProfileInfo } from "@redux/outstaffingSlice";
|
||||
import {
|
||||
deletePersonOnProject,
|
||||
getBoarderLoader,
|
||||
@ -23,6 +24,8 @@ import {
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
import { useNotification } from "@hooks/useNotification";
|
||||
|
||||
import { getCorrectDate } from "@components/Calendar/calendarHelper";
|
||||
import { Footer } from "@components/Common/Footer/Footer";
|
||||
import { Loader } from "@components/Common/Loader/Loader";
|
||||
@ -73,6 +76,7 @@ export const TicketFullScreen = () => {
|
||||
minute: 0,
|
||||
seconds: 0,
|
||||
});
|
||||
const profileInfo = useSelector(getProfileInfo);
|
||||
const [timerId, setTimerId] = useState(null);
|
||||
const [dropListOpen, setDropListOpen] = useState(false);
|
||||
const [correctProjectUsers, setCorrectProjectUsers] = useState([]);
|
||||
@ -84,6 +88,7 @@ export const TicketFullScreen = () => {
|
||||
const [uploadedFile, setUploadedFile] = useState(null);
|
||||
const [taskFiles, setTaskFiles] = useState([]);
|
||||
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
|
||||
const { showNotification } = useNotification();
|
||||
|
||||
useEffect(() => {
|
||||
apiRequest(`/task/get-task?task_id=${ticketId.id}`).then((taskInfo) => {
|
||||
@ -175,7 +180,13 @@ export const TicketFullScreen = () => {
|
||||
title: inputsValue.title,
|
||||
description: inputsValue.description,
|
||||
},
|
||||
}).then(() => {});
|
||||
}).then(() => {
|
||||
showNotification({
|
||||
show: true,
|
||||
text: "Изменения сохранены",
|
||||
type: "success",
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function createComment() {
|
||||
@ -988,11 +999,27 @@ export const TicketFullScreen = () => {
|
||||
<img src={link} alt="link"></img>
|
||||
<p onClick={copyTicketLink}>ссылка на задачу</p>
|
||||
</div>
|
||||
<div onClick={archiveTask}>
|
||||
<div
|
||||
onClick={archiveTask}
|
||||
className={
|
||||
profileInfo.id_user === projectInfo.owner_id ||
|
||||
profileInfo.id_user === taskInfo.user_id
|
||||
? ""
|
||||
: "disable"
|
||||
}
|
||||
>
|
||||
<img src={archive} alt="arch"></img>
|
||||
<p>в архив</p>
|
||||
</div>
|
||||
<div onClick={deleteTask}>
|
||||
<div
|
||||
onClick={deleteTask}
|
||||
className={
|
||||
profileInfo.id_user === projectInfo.owner_id ||
|
||||
profileInfo.id_user === taskInfo.user_id
|
||||
? ""
|
||||
: "disable"
|
||||
}
|
||||
>
|
||||
<img src={del} alt="delete"></img>
|
||||
<p>удалить</p>
|
||||
</div>
|
||||
|
||||
@ -17,6 +17,7 @@ export const Navigation = () => {
|
||||
const [user] = useState(
|
||||
localStorage.getItem("role_status") === "18" ? "partner" : "developer"
|
||||
);
|
||||
|
||||
const [navInfo] = useState({
|
||||
developer: [
|
||||
{
|
||||
|
||||
@ -11,7 +11,6 @@
|
||||
position: fixed;
|
||||
width: 100% !important;
|
||||
height: 80px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
@media (max-width: 1440px) {
|
||||
|
||||
@ -32,6 +32,15 @@
|
||||
line-height: 22px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
|
||||
p {
|
||||
margin-top: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.slick-list {
|
||||
|
||||
@ -21,11 +21,23 @@
|
||||
&__vector-black {
|
||||
top: 460px;
|
||||
right: -224px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
top: 370px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
top: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
margin-top: 360px;
|
||||
z-index: 99;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
@ -42,6 +54,10 @@
|
||||
padding-top: 30px;
|
||||
position: relative;
|
||||
padding-bottom: 310px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-box {
|
||||
|
||||
@ -21,11 +21,23 @@
|
||||
&__vector-black {
|
||||
top: 460px;
|
||||
right: -224px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
top: 370px;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
top: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
margin-top: 360px;
|
||||
cursor: pointer;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
@ -43,6 +55,10 @@
|
||||
padding-top: 30px;
|
||||
position: relative;
|
||||
padding-bottom: 310px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
@ -305,7 +321,7 @@
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
@media (max-width: 660px) {
|
||||
@media (max-width: 1024px) {
|
||||
margin: 15px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -3,6 +3,10 @@
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
background-color: #F1F1F1;
|
||||
padding-top: 60px;
|
||||
|
||||
@media (max-width: 1375px) {
|
||||
padding-top: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
@ -17,6 +21,10 @@
|
||||
color: #52B709;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
font-size: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
&__subTitle {
|
||||
@ -25,6 +33,10 @@
|
||||
text-align: center;
|
||||
font-size: 22px;
|
||||
line-height: 32px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.arrowElement {
|
||||
@ -35,6 +47,10 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
@media (max-width: 850px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.arrowDown {
|
||||
@ -42,6 +58,10 @@
|
||||
img {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
margin: 15px auto;
|
||||
}
|
||||
}
|
||||
|
||||
&__info {
|
||||
@ -68,6 +88,19 @@
|
||||
ul {
|
||||
padding-left: 18px;
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
flex-direction: column;
|
||||
row-gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -78,6 +111,12 @@
|
||||
margin: 20px auto 70px;
|
||||
max-width: 1000px;
|
||||
|
||||
@media (max-width: 700px) {
|
||||
margin: 10px auto 30px;
|
||||
text-align: center;
|
||||
row-gap: 5px;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
font-weight: 700;
|
||||
@ -94,8 +133,16 @@
|
||||
font-size: 18px;
|
||||
line-height: 22px;
|
||||
row-gap: 20px;
|
||||
|
||||
@media (max-width: 700px) {
|
||||
row-gap: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
padding-top: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
&__countingBlock {
|
||||
@ -108,10 +155,34 @@
|
||||
row-gap: 16px;
|
||||
position: relative;
|
||||
|
||||
@media (max-width: 1125px) {
|
||||
padding-right: 45px;
|
||||
}
|
||||
|
||||
@media (max-width: 850px) {
|
||||
padding: 20px 25px;
|
||||
}
|
||||
|
||||
@media (max-width: 780px) {
|
||||
row-gap: 5px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
&__head {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
@media (max-width: 850px) {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
@media (max-width: 750px) {
|
||||
text-align: center;
|
||||
img {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__bottom {
|
||||
@ -135,12 +206,21 @@
|
||||
span {
|
||||
color: #52B709;
|
||||
}
|
||||
|
||||
@media (max-width: 780px) {
|
||||
text-align: center;
|
||||
row-gap: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.countingBlock__info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 12px;
|
||||
|
||||
@media (max-width: 850px) {
|
||||
row-gap: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.countingBlock {
|
||||
@ -162,6 +242,18 @@
|
||||
position: absolute;
|
||||
right: -140px;
|
||||
top: -55px;
|
||||
|
||||
@media (max-width: 1440px) {
|
||||
right: -25px;
|
||||
}
|
||||
|
||||
@media (max-width: 1210px) {
|
||||
right: 25px;
|
||||
}
|
||||
|
||||
@media (max-width: 1125px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -546,6 +546,7 @@ export const ProjectTracker = () => {
|
||||
projectId={projectBoard.id}
|
||||
projectName={projectBoard.name}
|
||||
projectUsers={projectBoard.projectUsers}
|
||||
projectOwnerId={projectBoard.owner_id}
|
||||
/>
|
||||
)}
|
||||
|
||||
@ -621,96 +622,104 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{column.tasks.map((task) => {
|
||||
return (
|
||||
<div
|
||||
key={task.id}
|
||||
className={`tasks__board__item ${
|
||||
taskHover[task.id] ? "task__hover" : ""
|
||||
}`}
|
||||
draggable={true}
|
||||
onDragStart={(e) =>
|
||||
dragStartHandler(e, task, column.id)
|
||||
}
|
||||
onDragOver={(e) => dragOverTaskHandler(e, task)}
|
||||
onDragLeave={(e) => dragLeaveTaskHandler(e)}
|
||||
onDragEnd={() => dragEndTaskHandler()}
|
||||
onDrop={(e) =>
|
||||
dragDropTaskHandler(e, task, column)
|
||||
}
|
||||
onClick={(e) => openTicket(e, task)}
|
||||
>
|
||||
<div className="tasksContainer">
|
||||
{column.tasks.map((task) => {
|
||||
return (
|
||||
<div
|
||||
className="tasks__board__item__title"
|
||||
onClick={() => {
|
||||
if (window.innerWidth < 985) {
|
||||
window.location.replace(
|
||||
`/tracker/task/${task.id}`
|
||||
);
|
||||
}
|
||||
}}
|
||||
key={task.id}
|
||||
className={`tasks__board__item ${
|
||||
taskHover[task.id] ? "task__hover" : ""
|
||||
}`}
|
||||
draggable={true}
|
||||
onDragStart={(e) =>
|
||||
dragStartHandler(e, task, column.id)
|
||||
}
|
||||
onDragOver={(e) => dragOverTaskHandler(e, task)}
|
||||
onDragLeave={(e) => dragLeaveTaskHandler(e)}
|
||||
onDragEnd={() => dragEndTaskHandler()}
|
||||
onDrop={(e) =>
|
||||
dragDropTaskHandler(e, task, column)
|
||||
}
|
||||
onClick={(e) => openTicket(e, task)}
|
||||
>
|
||||
<p className="task__board__item__title">
|
||||
{task.title}
|
||||
</p>
|
||||
</div>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: task.description,
|
||||
}}
|
||||
className="tasks__board__item__description"
|
||||
></p>
|
||||
<div className="tasks__board__item__executor">
|
||||
<span>
|
||||
{task.executor?.fio
|
||||
? task.executor?.fio
|
||||
: "Исполнитель не назначен"}
|
||||
</span>
|
||||
{task.executor?.avatar && (
|
||||
<img
|
||||
src={
|
||||
task.executor?.avatar
|
||||
? urlForLocal(task.executor?.avatar)
|
||||
: avatarMok
|
||||
<div
|
||||
className="tasks__board__item__title"
|
||||
onClick={() => {
|
||||
if (window.innerWidth < 985) {
|
||||
window.location.replace(
|
||||
`/tracker/task/${task.id}`
|
||||
);
|
||||
}
|
||||
alt="avatar"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<div className="tasks__board__item__deadLine">
|
||||
<p>Срок исполнения:</p>
|
||||
<span>
|
||||
{task.dead_line
|
||||
? getCorrectDate(task.dead_line)
|
||||
: "Не выбран"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="tasks__board__item__info">
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img src={commentsBoard} alt="commentsImg" />
|
||||
<span>
|
||||
{task.comment_count}{" "}
|
||||
{caseOfNum(task.comment_count, "comments")}
|
||||
</span>
|
||||
}}
|
||||
>
|
||||
<p className="task__board__item__title">
|
||||
{task.title}
|
||||
</p>
|
||||
</div>
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img src={filesBoard} alt="filesImg" />
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: task.description,
|
||||
}}
|
||||
className="tasks__board__item__description"
|
||||
></p>
|
||||
<div className="tasks__board__item__executor">
|
||||
<span>
|
||||
{task.files ? task.files : 0}{" "}
|
||||
{caseOfNum(0, "files")}
|
||||
{task.executor?.fio
|
||||
? task.executor?.fio
|
||||
: "Исполнитель не назначен"}
|
||||
</span>
|
||||
{task.executor?.avatar && (
|
||||
<img
|
||||
src={
|
||||
task.executor?.avatar
|
||||
? urlForLocal(task.executor?.avatar)
|
||||
: avatarMok
|
||||
}
|
||||
alt="avatar"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<TrackerSelectColumn
|
||||
columns={projectBoard.columns.filter(
|
||||
(item) => item.id !== column.id
|
||||
{task.dead_line && (
|
||||
<div className="tasks__board__item__deadLine">
|
||||
<p>Срок исполнения:</p>
|
||||
<span>
|
||||
{getCorrectDate(task.dead_line)}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
currentColumn={column}
|
||||
task={task}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
<div className="tasks__board__item__info">
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img
|
||||
src={commentsBoard}
|
||||
alt="commentsImg"
|
||||
/>
|
||||
<span>
|
||||
{task.comment_count}{" "}
|
||||
{caseOfNum(
|
||||
task.comment_count,
|
||||
"comments"
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
<div className="tasks__board__item__info__more">
|
||||
<img src={filesBoard} alt="filesImg" />
|
||||
<span>
|
||||
{task.files ? task.files : 0}{" "}
|
||||
{caseOfNum(0, "files")}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<TrackerSelectColumn
|
||||
columns={projectBoard.columns.filter(
|
||||
(item) => item.id !== column.id
|
||||
)}
|
||||
currentColumn={column}
|
||||
task={task}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
|
||||
@ -9,7 +9,7 @@ import {
|
||||
setToggleTab,
|
||||
} from "@redux/projectsTrackerSlice";
|
||||
|
||||
import { urlForLocal } from "@utils/helper";
|
||||
import { caseOfNum, urlForLocal } from "@utils/helper";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
@ -295,7 +295,10 @@ export const Tracker = () => {
|
||||
<div className="archive__tasks">
|
||||
<div className="archive__title">
|
||||
<h3>Архив задач:</h3>
|
||||
<p>{filterCompleteTasks.length} задач(а)</p>
|
||||
<p>
|
||||
{`${filterCompleteTasks.length}
|
||||
${caseOfNum(filterCompleteTasks.length, "tasks")}`}
|
||||
</p>
|
||||
<div className="archive__tasks__search">
|
||||
<img src={search} alt="search" />
|
||||
<input
|
||||
@ -354,8 +357,14 @@ export const Tracker = () => {
|
||||
<div className="archive__title">
|
||||
<h3>Архив проектов:</h3>
|
||||
<p>
|
||||
{projects.filter((project) => project.status === 10).length}{" "}
|
||||
проект(ов)
|
||||
{`${
|
||||
projects.filter((project) => project.status === 10).length
|
||||
}
|
||||
${caseOfNum(
|
||||
projects.filter((project) => project.status === 10)
|
||||
.length,
|
||||
"projects"
|
||||
)}`}
|
||||
</p>
|
||||
</div>
|
||||
<div className="archive__tasksWrapper">
|
||||
|
||||
@ -801,16 +801,17 @@
|
||||
0px 0px 0px 1px rgba(60, 66, 87, 0.08),
|
||||
0px 1px 1px rgba(0, 0, 0, 0.06);
|
||||
border-radius: 8px;
|
||||
padding: 16px 14px 16px 8px;
|
||||
min-width: 353px;
|
||||
max-width: 353px;
|
||||
padding: 12px 10px 12px 8px;
|
||||
min-width: 365px;
|
||||
max-width: 380px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 16px;
|
||||
row-gap: 10px;
|
||||
height: fit-content;
|
||||
position: relative;
|
||||
transition: all 0.3s ease;
|
||||
transform: scaleY(-1);
|
||||
min-height: 815px;
|
||||
|
||||
@media (max-width: 900px) {
|
||||
min-width: auto;
|
||||
@ -819,19 +820,28 @@
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.tasksContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 16px;
|
||||
max-height: 750px;
|
||||
overflow: auto;
|
||||
padding: 8px;
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #cbd9f9;
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: #c5c0c6;
|
||||
border-radius: 20px;
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #cbd9f9;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: #c5c0c6;
|
||||
border-radius: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&__hover {
|
||||
|
||||
@ -65,30 +65,17 @@ export function getCorrectRequestDate(date) {
|
||||
}
|
||||
|
||||
export function caseOfNum(number, type) {
|
||||
const comments = ["коментарий", "комментария", " коментариев"];
|
||||
const files = ["файл", "файла", "файлов"];
|
||||
const persons = ["участник", "участника", "участников"];
|
||||
const allTypes = {
|
||||
comments: ["коментарий", "комментария", " коментариев"],
|
||||
files: ["файл", "файла", "файлов"],
|
||||
persons: ["участник", "участника", "участников"],
|
||||
tasks: ["задача", "задачи", "задач"],
|
||||
projects: ["проект", "проекта", "проектов"],
|
||||
};
|
||||
const cases = [2, 0, 1, 1, 1, 2];
|
||||
if (type === "comments") {
|
||||
return comments[
|
||||
number % 100 > 4 && number % 100 < 20
|
||||
? 2
|
||||
: cases[number % 10 < 5 ? number % 10 : 5]
|
||||
];
|
||||
}
|
||||
if (type === "files") {
|
||||
return files[
|
||||
number % 100 > 4 && number % 100 < 20
|
||||
? 2
|
||||
: cases[number % 10 < 5 ? number % 10 : 5]
|
||||
];
|
||||
}
|
||||
|
||||
if (type === "persons") {
|
||||
return persons[
|
||||
number % 100 > 4 && number % 100 < 20
|
||||
? 2
|
||||
: cases[number % 10 < 5 ? number % 10 : 5]
|
||||
];
|
||||
}
|
||||
return allTypes[type][
|
||||
number % 100 > 4 && number % 100 < 20
|
||||
? 2
|
||||
: cases[number % 10 < 5 ? number % 10 : 5]
|
||||
];
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user