apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

working in archive page

Browse Source
This commit is contained in:
MaxOvs19
2023-10-11 19:56:36 +03:00
parent b226ee88bd
commit 40133b72a3
3 changed files with 111 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/pages/Tracker/Tracker.js → src/pages/Tracker/Tracker.jsx
View File

@ -24,11 +24,13 @@ import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import ProjectTiket from "@components/ProjectTiket/ProjectTiket";
import addProjectImg from "assets/icons/addProjectImg.svg";
import archiveTrackerProjects from "assets/icons/archiveTrackerProjects.svg";
import arrowViewReport from "assets/icons/arrows/arrowViewReport.svg";
import search from "assets/icons/serchIcon.png";
import project from "assets/icons/trackerProject.svg";
import tasks from "assets/icons/trackerTasks.svg";
import archive from "assets/images/archiveIcon.png";
import mockAvatar from "assets/images/avatarMok.png";
import avatarMok from "assets/images/avatarMok.png";
import noProjects from "assets/images/noProjects.png";
@ -327,6 +329,13 @@ export const Tracker = () => {
/>
</div>
</div>
<div className="archive__title-table">
<p>Задача</p>
<p>Потраченное время</p>
<p>Дата окончания</p>
</div>
<div className="archive__tasksWrapper">
{loader && <Loader style="green" />}
{!loader && (
@ -347,14 +356,6 @@ export const Tracker = () => {
/>
</div>
<div className="archive__completeTask__info">
<img
src={
task.user?.avatar
? urlForLocal(task.user.avatar)
: avatarMok
}
alt="avatar"
/>
<div className="archive__completeTask__info__project">
{/*<span>Проект</span>*/}
<p>{getCorrectDate(task.updated_at)}</p>
@ -365,7 +366,7 @@ export const Tracker = () => {
})
) : (
<div className="archive__noItem">
<p>В архиве задач нет</p>
<p>В данном месяце у вас не было задач</p>
</div>
)}
</>
@ -373,7 +374,7 @@ export const Tracker = () => {
</div>
</div>
<div className="archive__projects">
<div className="archive__title">
<div className="archive__projects-title">
<h3>Архив проектов:</h3>
<p>
{`${
@ -392,18 +393,29 @@ export const Tracker = () => {
) ? (
projects.map((project, index) => {
return project.status === 10 ? (
<div className="archive__completeTask" key={index}>
<div
className="archive__completeTask-project"
key={index}
>
<div className="archive__completeTask__description">
<p>{project.name}</p>
<p className="date">{project.date}</p>
</div>
<div className="archive__copmpleteTask-creator">
<img src={mockAvatar} alt="#" />
<div className="creator-title">
<h4>Создатель проекта:</h4>
<p>{"Василий Тарасов"}</p>
</div>
</div>
</div>
) : (
""
);
})
) : (
<div className="archive__noItem">
<div className="archive__noItem-project">
<img src={archiveTrackerProjects} alt="#" />
<p>В архиве проектов нет</p>
</div>
)}

99
src/pages/Tracker/tracker.scss
View File

@ -1401,14 +1401,29 @@
@media (max-width: 450px) {
flex-wrap: wrap;
}
&-table {
margin: 29px 0 0 0;
height: 67px;
display: flex;
align-items: center;
justify-content: space-between;
background: #f1f1f1;
color: #5b6871;
font-size: 14px;
font-weight: 400;
border-radius: 12px;
padding-left: 15px;
padding-right: 15px;
margin-right: -6px;
}
}
&__tasksWrapper {
margin-top: 10px;
margin-top: 20px;
display: flex;
flex-direction: column;
row-gap: 15px;
// max-height: 400px;
overflow-y: auto;
margin-right: -16px;
padding-right: 10px;
@ -1443,7 +1458,7 @@
transition: all 0.3s ease;
background: #f1f1f1;
border-radius: 12px;
padding: 12px 42px 7px 32px;
padding: 12px 15px 7px 16px;
&:hover {
transform: scale(0.99);
@ -1462,7 +1477,7 @@
.completeTask__title {
font-weight: 700;
font-size: 20px;
font-size: 18px;
line-height: 32px;
}
@ -1472,7 +1487,7 @@
.date {
font-weight: 500;
font-size: 16px;
font-size: 14px;
line-height: 24px;
color: #6f6f6f;
}
@ -1504,6 +1519,15 @@
}
}
&-project {
background: #f1f1f1;
width: 328px;
border-radius: 8px;
display: flex;
flex-direction: column;
padding: 23px;
}
@media (max-width: 740px) {
flex-direction: column;
padding: 10px 20px;
@ -1515,10 +1539,7 @@
}
&__tasks {
// min-height: 400px;
// max-height: 450px;
padding-right: 15px;
// width: 65%;
@media (max-width: 1100px) {
width: 100%;
@ -1617,35 +1638,75 @@
}
&__projects {
display: none;
display: flex;
flex-direction: column;
width: 33%;
min-height: 400px;
max-height: 450px;
padding-right: 15px;
@media (max-width: 1100px) {
width: 100%;
min-height: auto;
}
&-title {
background: #e1fccf;
display: flex;
align-items: center;
height: 66px;
border-radius: 12px;
margin: 25px 0 0 0;
padding-left: 15px;
color: #000;
font-style: normal;
h3 {
font-size: 16px;
font-weight: 700;
margin: 0 5px 0 0;
}
p {
font-size: 16px;
font-weight: 300;
}
}
}
&__noItem {
background: #f1f1f1;
border-radius: 12px;
padding: 23px 0 19px;
color: #6f6f6f;
p {
font-size: 17px;
font-style: normal;
font-weight: 700;
font-size: 22px;
line-height: 32px;
color: #111112;
text-align: center;
padding-left: 15px;
}
@media (max-width: 650px) {
background-color: white;
}
&-project {
background: #f1f1f1;
width: 328px;
height: 108px;
border-radius: 8px;
display: flex;
gap: 21px;
padding: 23px;
align-items: center;
p {
width: 105px;
color: #6f6f6f;
font-size: 16px;
font-style: normal;
font-weight: 700;
}
img {
margin-left: 10px;
}
}
}
}
}