footer layout

This commit is contained in:
Victor Batischev 2024-02-15 14:29:00 +03:00
parent 42cae241f2
commit 26b27129fd
36 changed files with 183 additions and 140 deletions

View File

@ -1,6 +1,6 @@
import React from "react";
import { getCorrectDate } from "@components/Calendar/calendarHelper";
import { getCorrectDate } from "@utils/calendarHelper";
import "./archiveTasksItem.scss";

View File

@ -13,7 +13,7 @@ import rectangle from "assets/images/rectangle_secondPage.png";
import CalendarComponent from "./CalendarComponent";
import "./calendar.scss";
import { currentMonth } from "./calendarHelper";
import { currentMonth } from "../../utils/calendarHelper";
const Calendar = () => {
if (localStorage.getItem("role_status") !== "18") {

View File

@ -7,7 +7,7 @@ import ellipse from "assets/icons/ellipse.png";
import rectangle from "assets/images/rectangle__calendar.png";
import "./calendarComponent.scss";
import { calendarHelper, currentMonthAndDay } from "./calendarHelper";
import { calendarHelper, currentMonthAndDay } from "../../utils/calendarHelper";
const CalendarComponent = ({ onSelect }) => {
const [value, setValue] = useState(moment());

View File

@ -43,7 +43,7 @@ import send from "assets/icons/send.svg";
import watch from "assets/icons/watch.svg";
import avatarMok from "assets/images/avatarMok.png";
import { getCorrectDate } from "../../../Calendar/calendarHelper";
import { getCorrectDate } from "../../../../utils/calendarHelper";
import "./modalTicket.scss";
registerLocale("ru", ru);

View File

@ -21,7 +21,7 @@ import { apiRequest } from "@api/request";
import { useNotification } from "@hooks/useNotification";
import { getCorrectDate } from "@components/Calendar/calendarHelper";
import { getCorrectDate } from "@utils/calendarHelper";
import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader";
import FileTracker from "@components/FileTracker/FileTracker";

View File

@ -28,7 +28,7 @@ import { apiRequest } from "@api/request";
import { useNotification } from "@hooks/useNotification";
import { getCorrectDate } from "@components/Calendar/calendarHelper";
import { getCorrectDate } from "@utils/calendarHelper";
import BaseButton from "@components/Common/BaseButton/BaseButton";
import { Loader } from "@components/Common/Loader/Loader";
import ModalLayout from "@components/Common/ModalLayout/ModalLayout";

View File

@ -16,7 +16,7 @@ import { urlForLocal } from "@utils/helper";
import { apiRequest } from "@api/request";
import { getReports } from "@components/Calendar/calendarHelper";
import { getReports } from "@utils/calendarHelper";
import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader";
import { Navigation } from "@components/Navigation/Navigation";

View File

@ -23,7 +23,7 @@ import {
getCorrectDate,
getReports,
hourOfNum
} from "@components/Calendar/calendarHelper";
} from "@utils/calendarHelper";
import BaseButton from "@components/Common/BaseButton/BaseButton";
import arrow from "assets/icons/arrows/arrowCalendar.png";
@ -286,15 +286,15 @@ export const ProfileCalendarComponent = React.memo(
? `${getCorrectDate(startDate)} - ${getCorrectDate(endDate)}`
: `${getCorrectDate(endDate)} - ${getCorrectDate(startDate)}`
: activePeriod
? "Выберите диапазон на календаре"
: "Выбрать диапазон"}
? "Выберите диапазон на календаре"
: "Выбрать диапазон"}
</span>
<span>
{totalRangeHours
? `${totalRangeHours} ${hourOfNum(totalRangeHours)}`
: endDate
? "0 часов"
: ""}
? "0 часов"
: ""}
</span>
{endDate && (
<BaseButton

View File

@ -26,7 +26,7 @@ import {
getCorrectDate,
getCreatedDate,
hourOfNum
} from "../Calendar/calendarHelper";
} from "../../utils/calendarHelper";
import "./reportForm.scss";
registerLocale("ru", ru);

View File

@ -1,8 +1,13 @@
.report-form {
background: #f1f1f1;
min-height: 100vh;
display: flex;
flex-direction: column;
.container {
display: flex;
flex-direction: column;
flex: 1;
max-width: 1160px;
margin-top: 23px;

View File

@ -14,7 +14,7 @@ import {
getCorrectDate,
getCreatedDate,
hourOfNum
} from "@components/Calendar/calendarHelper";
} from "@utils/calendarHelper";
import { Loader } from "@components/Common/Loader/Loader";
import "./shortReport.scss";

View File

@ -6,7 +6,7 @@ import { urlForLocal } from "@utils/helper";
import { apiRequest } from "@api/request";
import { getCorrectDate } from "@components/Calendar/calendarHelper";
import { getCorrectDate } from "@utils/calendarHelper";
import TrackerTaskSubComment from "@components/TrackerTaskComment/TrackerTaskComment";
import del from "assets/icons/delete.svg";

View File

@ -13,7 +13,7 @@ import { urlForLocal } from "@utils/helper";
import { apiRequest } from "@api/request";
import { getCorrectDate } from "@components/Calendar/calendarHelper";
import { getCorrectDate } from "@utils/calendarHelper";
import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader";
import ModalLayout from "@components/Common/ModalLayout/ModalLayout";

View File

@ -5,6 +5,7 @@
min-height: 100vh;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -7,7 +7,7 @@ import { getRequestDates, setRequestDate } from "@redux/reportSlice";
import { apiRequest } from "@api/request";
import { getReports } from "@components/Calendar/calendarHelper";
import { getReports } from "@utils/calendarHelper";
import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader";
import { Navigation } from "@components/Navigation/Navigation";

View File

@ -5,6 +5,7 @@
min-height: 100vh;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -167,6 +167,7 @@
}
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -5,6 +5,7 @@
min-height: 100vh;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -378,6 +378,7 @@
}
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -144,6 +144,7 @@
}
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -2,7 +2,9 @@ import React from "react";
import { Navigation } from "@components/Navigation/Navigation";
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import { Footer } from "@components/common/Footer/Footer";
import { Footer } from "@components/Common/Footer/Footer";
import "./payouts.scss";
export const Payouts = () => {
return (

View File

@ -0,0 +1,13 @@
.payouts {
display: flex;
flex-direction: column;
min-height: 100vh;
background: #f1f1f1;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;
}
}

View File

@ -4,6 +4,7 @@
flex-direction: column;
min-height: 100vh;
&__container {
max-width: 1160px;
display: flex;
flex-direction: column;
margin: 0 auto 42px auto;

View File

@ -58,7 +58,7 @@ import accept from "assets/images/accept.png";
import archive from "assets/images/archiveIcon.png";
import avatarMok from "assets/images/avatarMok.png";
import { getCorrectDate } from "../../components/Calendar/calendarHelper";
import { getCorrectDate } from "../../utils/calendarHelper";
export const ProjectTracker = () => {
const dispatch = useDispatch();

View File

@ -5,6 +5,7 @@
flex-direction: column;
&__container {
max-width: 1160px;
display: flex;
flex-direction: column;
margin: 23px auto 42px auto;
@ -76,6 +77,7 @@
}
&__container {
max-width: 1160px;
display: flex;
margin: 23px auto 42px auto;
flex: 1 1 auto;
@ -98,6 +100,8 @@
flex-direction: column;
&__container {
max-width: 1160px;
flex-direction: column;
display: flex;
margin: 23px auto 42px auto;
flex: 1 1 auto;
@ -136,6 +140,7 @@
flex-direction: column;
&__container {
max-width: 1160px;
display: flex;
flex-direction: column;
margin: 23px auto 42px auto;

View File

@ -9,6 +9,7 @@ import { copyProjectLink } from "@utils/helper";
import { Navigation } from "@components/Navigation/Navigation";
import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import { Footer } from "@components/Common/Footer/Footer";
import arrow from "assets/icons/arrows/arrowCalendar.png";
import emailImg from "assets/icons/emailStatistics.svg";
@ -71,136 +72,137 @@ const Statistics = () => {
/>
<h2 className="tracker__title">Управление проектами с трекером</h2>
</div>
</div>
<div className="tracker__tabs">
<div className="tracker__tabs__head">
<Link
to="/profile/tracker"
className="tab active-tab"
onClick={() => toggleTabs(1)}
>
<img src={project} alt="img" />
<p>Проекты </p>
</Link>
<Link
to="/profile/tracker"
className="tab"
onClick={() => toggleTabs(2)}
>
<img src={tasks} alt="img" />
<p>Все мои задачи</p>
</Link>
<Link
to="/profile/tracker"
className="tab"
onClick={() => toggleTabs(3)}
>
<img src={archive} alt="img" />
<p>Архив</p>
</Link>
</div>
<div className="tracker__tabs__content">
<div className="tracker__tabs__content__wrapper statistics-body">
<div className="statistics-header">
<div className="statistics-header__menu">
<h1>Статистика проекта</h1>
<img src={link} alt="#" />
<span
className="return-text"
onClick={() => copyProjectLink("62")}
>
ссылка на проект
</span>
</div>
<div className="statistics-header__return">
<img src={arrow} alt="#" />
<Link to={`/profile/tracker`} className="return-text">
К списку проектов
</Link>
</div>
</div>
<div className="statistics-info">
<div className="statistics-info__head">
<p>Проект: </p>
<h1>{"Разработка трекера"}</h1>
</div>
<div className="statistics-info__team">
<div className="project-info">
<div className="project-info__creator">
<span className="return-text">Создатель проекта:</span>
<div>
<p>{"Василий Тарасов"}</p>{" "}
<img src={mockAvatar} alt="#" />
</div>
</div>
<div className="project-info__tasks">
<div className="task-quantity">
<p>Открытые задачи</p>
<span className="task-quantity_open">{4}</span>
</div>
<div className="task-quantity">
<p>Задач в работе</p>
<span className="task-quantity_work">{5}</span>
</div>
<div className="task-quantity">
<p>Закрыто задач</p>
<span className="task-quantity_closed">{434}</span>
</div>
</div>
<div className="tracker__tabs">
<div className="tracker__tabs__head">
<Link
to="/profile/tracker"
className="tab active-tab"
onClick={() => toggleTabs(1)}
>
<img src={project} alt="img" />
<p>Проекты </p>
</Link>
<Link
to="/profile/tracker"
className="tab"
onClick={() => toggleTabs(2)}
>
<img src={tasks} alt="img" />
<p>Все мои задачи</p>
</Link>
<Link
to="/profile/tracker"
className="tab"
onClick={() => toggleTabs(3)}
>
<img src={archive} alt="img" />
<p>Архив</p>
</Link>
</div>
<div className="tracker__tabs__content">
<div className="tracker__tabs__content__wrapper statistics-body">
<div className="statistics-header">
<div className="statistics-header__menu">
<h1>Статистика проекта</h1>
<img src={link} alt="#" />
<span
className="return-text"
onClick={() => copyProjectLink("62")}
>
ссылка на проект
</span>
</div>
<div className="list-team">
<div className="list-team__title">
<span className="return-text">Участники проекта:</span>
</div>
<div className="list-team__head">
<p>Имя</p>
<p>Почта</p>
<p>Роль</p>
<p>Статус</p>
</div>
<div className="list-team__body">
{teams.map((item) => {
return (
<>
<div className="list-team__item">
<div className="person-name">
<img src={item.avatar} alt="#" />
<p>{item.name}</p>
</div>
<div className="person-email">
<img src={emailImg} alt="#" />
<p>{item.email}</p>
</div>
<p className="person-type">{item.role}</p>
{/* <span className="status status-active"> */}
<div className="statistics-header__return">
<img src={arrow} alt="#" />
<span
className={
item.status
? "status status-active"
: "status status-none"
}
>
{item.status ? "Активно" : "Не активно"}
</span>
</div>
</>
);
})}
</div>
<Link to={`/profile/tracker`} className="return-text">
К списку проектов
</Link>
</div>
<div className="add-person">
<span className="add-person__button">+</span>
<p>Добавить участника</p>
</div>
<div className="statistics-info">
<div className="statistics-info__head">
<p>Проект: </p>
<h1>{"Разработка трекера"}</h1>
</div>
<div className="statistics-info__team">
<div className="project-info">
<div className="project-info__creator">
<span className="return-text">Создатель проекта:</span>
<div>
<p>{"Василий Тарасов"}</p>{" "}
<img src={mockAvatar} alt="#" />
</div>
</div>
<div className="project-info__tasks">
<div className="task-quantity">
<p>Открытые задачи</p>
<span className="task-quantity_open">{4}</span>
</div>
<div className="task-quantity">
<p>Задач в работе</p>
<span className="task-quantity_work">{5}</span>
</div>
<div className="task-quantity">
<p>Закрыто задач</p>
<span className="task-quantity_closed">{434}</span>
</div>
</div>
</div>
<div className="list-team">
<div className="list-team__title">
<span className="return-text">Участники проекта:</span>
</div>
<div className="list-team__head">
<p>Имя</p>
<p>Почта</p>
<p>Роль</p>
<p>Статус</p>
</div>
<div className="list-team__body">
{teams.map((item) => {
return (
<>
<div className="list-team__item">
<div className="person-name">
<img src={item.avatar} alt="#" />
<p>{item.name}</p>
</div>
<div className="person-email">
<img src={emailImg} alt="#" />
<p>{item.email}</p>
</div>
<p className="person-type">{item.role}</p>
{/* <span className="status status-active"> */}
<span
className={
item.status
? "status status-active"
: "status status-none"
}
>
{item.status ? "Активно" : "Не активно"}
</span>
</div>
</>
);
})}
</div>
</div>
<div className="add-person">
<span className="add-person__button">+</span>
<p>Добавить участника</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<Footer />
</div>
);
};

View File

@ -4,6 +4,13 @@
flex-direction: column;
min-height: 100vh;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;
}
&-header {
display: flex;
justify-content: space-between;

View File

@ -510,6 +510,7 @@
}
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;

View File

@ -10,7 +10,7 @@ import {
getCorrectDate,
getCreatedDate,
hourOfNum
} from "@components/Calendar/calendarHelper";
} from "@utils/calendarHelper";
import { Footer } from "@components/Common/Footer/Footer";
import { Loader } from "@components/Common/Loader/Loader";
import { Navigation } from "@components/Navigation/Navigation";

View File

@ -5,6 +5,7 @@
min-height: 100vh;
.container {
max-width: 1160px;
display: flex;
flex-direction: column;
flex: 1;