Merge pull request #122 from apuc/tracker-tasks

Tracker tasks
This commit is contained in:
NikoM1k 2023-08-07 15:59:31 +03:00 committed by GitHub
commit 32ab09c54a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 187 additions and 18 deletions

View File

@ -746,6 +746,11 @@
top: 10px !important;
left: -110px !important;
z-index: 10;
@media (max-width: 880px) {
left: 0 !important;
top: -15px !important;
}
}
.react-datepicker__current-month {

View File

@ -479,7 +479,7 @@ export const TicketFullScreen = () => {
<div className="tracker__tabs__head">
<Link
to="/profile/tracker"
className="tab active-tab"
className="tab active-tab projectsTab"
onClick={() => toggleTabs(1)}
>
<img src={project} alt="img" />
@ -487,7 +487,7 @@ export const TicketFullScreen = () => {
</Link>
<Link
to="/profile/tracker"
className="tab"
className="tab tasksTab"
onClick={() => toggleTabs(2)}
>
<img src={tasks} alt="img" />
@ -495,7 +495,7 @@ export const TicketFullScreen = () => {
</Link>
<Link
to="/profile/tracker"
className="tab"
className="tab archiveTab"
onClick={() => toggleTabs(3)}
>
<img src={archive} alt="img" />
@ -626,7 +626,9 @@ export const TicketFullScreen = () => {
}}
/>
) : (
<h5 className="fullName">{inputsValue.title}</h5>
<h5 className="fullName nameFullScreen">
{inputsValue.title}
</h5>
)}
<div className="content__description">
{editOpen ? (
@ -657,7 +659,7 @@ export const TicketFullScreen = () => {
/>
) : (
<p
className="fullDescription"
className="fullDescription fullScreenDescription"
dangerouslySetInnerHTML={{
__html: inputsValue.description,
}}
@ -665,7 +667,7 @@ export const TicketFullScreen = () => {
)}
</div>
{Boolean(taskFiles.length) && (
<div className="task__files">
<div className="task__files filesFullScreen">
{taskFiles.map((file) => {
return (
<div className="taskFile" key={file.id}>
@ -742,7 +744,7 @@ export const TicketFullScreen = () => {
{caseOfNum(taskFiles.length, "files")}
</div>
</div>
<div className="content__input">
<div className="content__input commentFullScreen">
<input
placeholder="Оставить комментарий"
value={inputsValue.comment}
@ -771,11 +773,10 @@ export const TicketFullScreen = () => {
</div>
</div>
</div>
<div className="workers">
<div className="workers fullScreenWorkers">
<div className="workers_box task__info">
<p className="workers__creator">
Создатель : <br />
{taskInfo.user?.fio}
Создатель :<p>&nbsp;{taskInfo.user?.fio}</p>
</p>
{taskInfo.executor ? (

View File

@ -8,6 +8,112 @@
&-whith {
width: 850px !important;
@media (max-width: 1190px) {
width: auto !important;
margin: 0 !important;
}
}
@media (max-width: 880px) {
flex-direction: column !important;
}
}
.fullScreenWorkers {
@media (max-width: 880px) {
background: #DFF1FF;
.workers_box {
@media (max-width: 880px) {
flex-direction: inherit !important;
align-items: center;
flex-wrap: wrap;
gap: 10px;
padding: 10px 18px !important;
.workers__creator {
margin-bottom: 0 !important;
display: flex;
}
.add-worker {
margin: 0 !important;
}
.executor {
p {
max-width: none !important;
}
}
}
}
.workers_box-middle {
padding: 0 10px !important;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 20px;
border-bottom: none !important;
.deadLine {
width: 100%;
}
.start {
margin-top: 0 !important;
order: 2;
}
.time {
margin-top: 0;
order: 3;
}
}
.workers_box-bottom {
display: flex;
flex-wrap: wrap;
gap: 10px;
padding: 10px !important;
div {
width: 145px;
}
}
}
}
.commentFullScreen {
@media (max-width: 520px) {
width: auto !important;
}
}
.filesFullScreen {
@media (max-width: 520px) {
justify-content: space-evenly;
max-height: 400px !important;
}
}
.comments__list__item {
@media (max-width: 520px) {
padding: 0 !important;
}
}
.nameFullScreen {
@media (max-width: 520px) {
white-space: inherit !important;
}
}
.fullScreenDescription {
@media (max-width: 1190px) {
white-space: inherit !important;
}
}

View File

@ -15,7 +15,7 @@ export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
className="trackerSelectColumn"
onClick={() => setOpenSelect(!openSelect)}
>
<p>Выберите колонку</p>
<p>{currentColumn.title}</p>
<img className={openSelect ? "open" : ""} src={arrowDown} alt="arrow" />
{openSelect && (
<div className="trackerSelectColumn__dropDown">
@ -26,7 +26,7 @@ export const TrackerSelectColumn = ({ columns, task, currentColumn }) => {
onClick={() => {
dispatch(
moveProjectTask({
startWrapperIndex: { index: currentColumn, task },
startWrapperIndex: { index: currentColumn.id, task },
columnId: column.id,
})
);

View File

@ -15,8 +15,8 @@
p {
color: #252c32;
font-weight: 400;
font-size: 14px;
font-weight: 500;
font-size: 16px;
line-height: 24px;
}

View File

@ -194,7 +194,7 @@ export const ProjectTracker = () => {
}
function openTicket(e, task) {
if (window.innerWidth < 900) {
if (window.innerWidth < 985) {
return;
}
setSelectedTicket(task);
@ -634,7 +634,16 @@ export const ProjectTracker = () => {
}
onClick={(e) => openTicket(e, task)}
>
<div className="tasks__board__item__title">
<div
className="tasks__board__item__title"
onClick={() => {
if (window.innerWidth < 985) {
window.location.replace(
`https://itguild.info/tracker/task/${task.id}`
);
}
}}
>
<p className="task__board__item__title">
{task.title}
</p>
@ -690,7 +699,7 @@ export const ProjectTracker = () => {
columns={projectBoard.columns.filter(
(item) => item.id !== column.id
)}
currentColumn={column.id}
currentColumn={column}
task={task}
/>
</div>

View File

@ -402,7 +402,7 @@
.persons__list {
position: absolute;
z-index: 2;
z-index: 20;
display: flex;
flex-direction: column;
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
@ -527,6 +527,33 @@
max-width: none;
}
}
@media (max-width: 1000px) {
width: 390px;
padding: 15px 30px;
.persons__list__info {
margin: 10px;
}
.persons__list__items {
flex-direction: column;
margin-bottom: 20px;
row-gap: 15px;
.persons__list__item {
max-width: none;
span {
max-width: none;
width: 100%;
}
}
}
}
@media (max-width: 440px) {
width: 290px;
padding: 15px 20px;
}
}
}
@ -620,6 +647,17 @@
width: 20px;
height: 20px;
}
@media (max-width: 915px) {
width: 100%;
max-width: none;
justify-content: start;
p {
font-size: 16px;
max-width: none;
}
}
}
p {
color: #252c32;
@ -659,6 +697,11 @@
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@media (max-width: 915px) {
max-width: none;
}
}
img {
@ -811,6 +854,7 @@
@media (max-width: 900px) {
width: 100%;
max-height: none;
&:hover {
transform: none;
@ -1025,6 +1069,10 @@
font-size: 14px;
line-height: 22px;
}
@media (max-width: 900px) {
transform: none;
}
}
}