Merge branch 'main' into quiz
This commit is contained in:
Mikola
@ -73,7 +73,7 @@ export const Article = () => {
|
||||
предпринимателями и тщательно проверяем своих партнеров.
|
||||
Партнерами являются агентства, которые специализируются на
|
||||
оказании услуг в формате аутстафф-модели и обладают глубокой
|
||||
экспертизой в разработке и внедрении ИТ-проектов.
|
||||
экспертизой в разработке и внедрении IT-проектов.
|
||||
</p>
|
||||
</div>
|
||||
<img src={mockImgArticle} className="article-blog__body-img" />
|
||||
@ -81,7 +81,7 @@ export const Article = () => {
|
||||
<p>
|
||||
С одной стороны, зарплаты в сфере разработки растут, с другой
|
||||
стороны, появляется огромное количество новичков, которые хотят
|
||||
легко и просто войти в ИТ-сферу на волне востребованности и
|
||||
легко и просто войти в IT-сферу на волне востребованности и
|
||||
больших зарплат. Разумеется, это приводит к осторожному отношению
|
||||
работодателя к выпускникам различных курсов. Нет такого курса,
|
||||
который даст на 100% готового джуна, слишком многое завязано на
|
||||
|
||||
@ -1,18 +1,15 @@
|
||||
import React, { useEffect } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
import { selectAuth } from "@redux/outstaffingSlice";
|
||||
|
||||
import { scrollToForm } from "@utils/helper";
|
||||
|
||||
import { AuthBox } from "@components/AuthBox/AuthBox";
|
||||
import AuthHeader from "@components/Common/AuthHeader/AuthHeader";
|
||||
import { Footer } from "@components/Common/Footer/Footer";
|
||||
import SideBar from "@components/SideBar/SideBar";
|
||||
import SliderWorkers from "@components/SliderWorkers/SliderWorkers";
|
||||
|
||||
import arrowBtn from "assets/icons/arrows/arrowRight.svg";
|
||||
import arrow from "assets/icons/arrows/arrow__login_page.png";
|
||||
import text from "assets/images/Body_Text.png";
|
||||
import vector from "assets/images/Vector_Smart_Object.png";
|
||||
@ -20,9 +17,9 @@ import vectorBlack from "assets/images/Vector_Smart_Object_black.png";
|
||||
import authImg from "assets/images/auth_img.png";
|
||||
import cross from "assets/images/cross.png";
|
||||
|
||||
import "./authForPartners.scss";
|
||||
import "./auth.scss";
|
||||
|
||||
const AuthForPartners = () => {
|
||||
const Auth = () => {
|
||||
const isAuth = useSelector(selectAuth);
|
||||
let navigate = useNavigate();
|
||||
|
||||
@ -46,28 +43,10 @@ const AuthForPartners = () => {
|
||||
<img className="auth-partners__vector" src={vector} alt="" />
|
||||
<img className="auth-partners__vector-black" src={vectorBlack} alt="" />
|
||||
<div className="container">
|
||||
<div className="change-mode">
|
||||
<div className="change-mode__arrow" onClick={() => scrollToForm()}>
|
||||
<img src={arrowBtn}></img>
|
||||
</div>
|
||||
<div className="buttons">
|
||||
<Link to={"/authdev"}>
|
||||
<button className="change-mode__developersForPart">
|
||||
Для разработчиков
|
||||
</button>
|
||||
</Link>
|
||||
<Link to={"/auth"}>
|
||||
<button className="change-mode__partnersForPart">
|
||||
Для партнёров
|
||||
</button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="row">
|
||||
<div className="col-12 col-xl-6">
|
||||
<div className="auth-partners__box">
|
||||
<AuthBox title="для партнёров" />
|
||||
<AuthBox />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-2">
|
||||
@ -90,7 +69,6 @@ const AuthForPartners = () => {
|
||||
<img className="cross" src={cross} alt="" />
|
||||
</div>
|
||||
<div>
|
||||
{/* <img className='auth-specialists} src={specialists} alt="" /> */}
|
||||
<p className="auth-partners__specialists">
|
||||
300 Специалистов
|
||||
</p>
|
||||
@ -121,4 +99,4 @@ const AuthForPartners = () => {
|
||||
);
|
||||
};
|
||||
|
||||
export default AuthForPartners;
|
||||
export default Auth;
|
||||
@ -181,7 +181,7 @@
|
||||
&__img-text {
|
||||
position: absolute;
|
||||
right: -68px;
|
||||
bottom: -84px;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
@ -146,14 +146,14 @@ export const AuthForCandidate = () => {
|
||||
<AuthHeader />
|
||||
<div className="container">
|
||||
<AuthBlock
|
||||
title="Войти, уже есть доступ"
|
||||
description="если вы получили доступ пройдя
|
||||
title="Войти, если есть доступ"
|
||||
description="Если вы получили доступ, пройдя
|
||||
2 шага для входа или хотите узнать
|
||||
свои результаты в кабинете"
|
||||
/>
|
||||
<div className="auth-candidate__start">
|
||||
<h2 className="auth-candidate__start__title">
|
||||
Хочу в команду <span>Айти специалистов</span>
|
||||
Хочу в команду <span>IT-специалистов</span>
|
||||
</h2>
|
||||
<div className="change-mode__arrow">
|
||||
<img src={arrowBtn} alt="#"></img>
|
||||
@ -162,7 +162,7 @@ export const AuthForCandidate = () => {
|
||||
Для нас не имеет значение Ваша локация.
|
||||
</p>
|
||||
<div className="auth-candidate__start__categoriesWrapper">
|
||||
<StepsForCandidate step="шаг 1 - выбери специализацтию" />
|
||||
<StepsForCandidate step="шаг 1 - выберите специализацию" />
|
||||
{personalInfoItems.map((item, index) => {
|
||||
return (
|
||||
<CategoriesItem
|
||||
|
||||
@ -64,6 +64,6 @@
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 70px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,124 +0,0 @@
|
||||
import React, { useEffect } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { Link, useNavigate } from "react-router-dom";
|
||||
|
||||
import { selectAuth } from "@redux/outstaffingSlice";
|
||||
|
||||
import { scrollToForm } from "@utils/helper";
|
||||
|
||||
import { AuthBox } from "@components/AuthBox/AuthBox";
|
||||
import AuthHeader from "@components/Common/AuthHeader/AuthHeader";
|
||||
import { Footer } from "@components/Common/Footer/Footer";
|
||||
import SideBar from "@components/SideBar/SideBar";
|
||||
import SliderWorkers from "@components/SliderWorkers/SliderWorkers";
|
||||
|
||||
import arrowBtn from "assets/icons/arrows/arrowRight.svg";
|
||||
import arrow from "assets/icons/arrows/arrow__login_page.png";
|
||||
import text from "assets/images/Body_Text.png";
|
||||
import vector from "assets/images/Vector_Smart_Object.png";
|
||||
import vectorBlack from "assets/images/Vector_Smart_Object_black.png";
|
||||
import cross from "assets/images/cross.png";
|
||||
import medium from "assets/images/medium_male_big.png";
|
||||
|
||||
import "./authForDevelopers.scss";
|
||||
|
||||
const AuthForDevelopers = () => {
|
||||
const isAuth = useSelector(selectAuth);
|
||||
let navigate = useNavigate();
|
||||
const getToken = localStorage.getItem("auth_token");
|
||||
|
||||
useEffect(() => {
|
||||
if (isAuth || getToken) {
|
||||
navigate("/profile");
|
||||
}
|
||||
}, [getToken]);
|
||||
|
||||
return (
|
||||
<section className="auth-developers">
|
||||
<AuthHeader />
|
||||
<SliderWorkers
|
||||
title={"Свободные разработчики"}
|
||||
titleInfo={"для Вашей команды"}
|
||||
subTitle={true}
|
||||
/>
|
||||
<div className="auth-developers__background">
|
||||
<img className="auth-developers__vector" src={vector} alt="" />
|
||||
<img
|
||||
className="auth-developers__vector-black"
|
||||
src={vectorBlack}
|
||||
alt="#"
|
||||
/>
|
||||
<div className="container">
|
||||
<div className="change-mode">
|
||||
<div className="change-mode__arrow" onClick={() => scrollToForm()}>
|
||||
<img src={arrowBtn}></img>
|
||||
</div>
|
||||
<div className="buttons">
|
||||
<Link to={"/authdev"}>
|
||||
<button className="change-mode__developersForDev">
|
||||
Для разработчиков
|
||||
</button>
|
||||
</Link>
|
||||
<Link to={"/auth"}>
|
||||
<button className="change-mode__partnersForDev">
|
||||
Для партнёров
|
||||
</button>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-12 col-xl-6">
|
||||
<div className="auth-developers__box">
|
||||
<AuthBox title="для разработчиков" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-2">
|
||||
<img className="auth-developers__arrow" src={arrow} alt="" />
|
||||
</div>
|
||||
<div className="col-12 col-xl-4">
|
||||
<div className="auth-developers__info">
|
||||
<div className="auth-developers__info-box">
|
||||
<img src={medium} alt="" />
|
||||
<h3>
|
||||
Frontend разработчик,
|
||||
<br /> Middle
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div className="auth-developers__info-container">
|
||||
<div className="auth-developers__info-img">
|
||||
<div>
|
||||
<img className="cross" src={cross} alt="" />
|
||||
</div>
|
||||
<div>
|
||||
{/* <img className='auth-specialists} src={specialists} alt="" /> */}
|
||||
<p className="auth-developers__specialists">
|
||||
300 Специалистов
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul className="auth-developers__info-list">
|
||||
<li className="auth-developers__info-item">
|
||||
Ruby on Rails
|
||||
</li>
|
||||
<li className="auth-developers__info-item">PHP</li>
|
||||
<li className="auth-developers__info-item">Python</li>
|
||||
<li className="auth-developers__info-item">Vue.js</li>
|
||||
<li className="auth-developers__info-item">React. JS</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<img className="auth-developers__img-text" src={text} alt="" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Footer />
|
||||
</div>
|
||||
</div>
|
||||
<SideBar />
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default AuthForDevelopers;
|
||||
@ -1,240 +0,0 @@
|
||||
.auth-developers {
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
&__background {
|
||||
background-color: #f1f1f1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&__vector,
|
||||
&__vector-black {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
&__vector {
|
||||
top: -37px;
|
||||
left: -285px;
|
||||
}
|
||||
|
||||
&__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) {
|
||||
&__vector,
|
||||
&__vector-black,
|
||||
&__arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&__info {
|
||||
background-color: #e1fccf;
|
||||
margin-top: 70px;
|
||||
max-width: 310px;
|
||||
padding-top: 30px;
|
||||
position: relative;
|
||||
padding-bottom: 310px;
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__info {
|
||||
max-width: 380px;
|
||||
}
|
||||
|
||||
&__info-box {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 375.98px) {
|
||||
&__info {
|
||||
max-width: 340px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-box > img {
|
||||
width: 165px;
|
||||
height: 165px;
|
||||
margin-left: -84px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__info-box > img {
|
||||
margin-left: 0px;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-box > h3 {
|
||||
font-family: "GT Eesti Pro Display";
|
||||
font-size: 2em;
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 36px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__info-box > h3 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-container {
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&__info-img {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
margin-top: 28px;
|
||||
margin-left: -40px;
|
||||
}
|
||||
|
||||
&__info-img > div > img {
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
|
||||
&__specialists {
|
||||
font-family: "GT Eesti Pro Display";
|
||||
font-size: 1.8em;
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 26.12px;
|
||||
text-align: left;
|
||||
transform: rotate(-90deg);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
&__info-list {
|
||||
list-style: none;
|
||||
margin-top: 110px;
|
||||
position: absolute;
|
||||
right: -70px;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__info-list {
|
||||
left: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info-item {
|
||||
color: #1f1f1f;
|
||||
font-family: "GT Eesti Pro Display";
|
||||
font-size: 4em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 56.95px;
|
||||
text-align: left;
|
||||
text-decoration: underline;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__info-item {
|
||||
font-size: 2.6em;
|
||||
}
|
||||
}
|
||||
|
||||
&__img-text {
|
||||
position: absolute;
|
||||
right: -68px;
|
||||
bottom: -84px;
|
||||
}
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
&__img-text {
|
||||
right: 0px;
|
||||
bottom: -40px;
|
||||
}
|
||||
}
|
||||
////////////////////////////////////
|
||||
|
||||
&__auth-link {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&__auth-link a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@media (max-width: 766px) {
|
||||
&__form-buttons {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
&__form-btn {
|
||||
margin: 0;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.change-mode {
|
||||
&__partnersForDev {
|
||||
background: #52b7098c;
|
||||
color: #2d6505;
|
||||
margin-left: -35px;
|
||||
}
|
||||
|
||||
&__partnersForDev,
|
||||
&__developersForDev {
|
||||
width: 220px;
|
||||
height: 50px;
|
||||
border-radius: 44px;
|
||||
font-size: 16px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
&__developersForDev {
|
||||
position: relative;
|
||||
background: #406128;
|
||||
color: white;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
&__partnersForDev {
|
||||
margin: 15px 0 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -27,7 +27,7 @@ export const CompanyInfo = () => {
|
||||
<img src={arrow} alt="arrow" />
|
||||
</div>
|
||||
<p className="companyInfo__subTitle">
|
||||
Мы предоставляем вам «в аренду» it-специалистов. При этом они
|
||||
Мы предоставляем вам «в аренду» IT-специалистов. При этом они
|
||||
находятся в нашем штате. Оплата происходит за отработанные часы
|
||||
</p>
|
||||
<div className="companyInfo__info">
|
||||
@ -36,7 +36,8 @@ export const CompanyInfo = () => {
|
||||
<img src={countingImg} alt="countingImg" />
|
||||
<div className="countingBlock__info">
|
||||
<h3 className="countingBlock__title">
|
||||
Экономия бюджета компании - главное преимущество аутстафинга
|
||||
Экономия бюджета компании - главное преимущество
|
||||
аутстаффинга
|
||||
</h3>
|
||||
<p className="countingBlock__subTitle">
|
||||
Приблизительный просчет дал результаты в экономии до 50%
|
||||
|
||||
@ -17,7 +17,7 @@ export const FrequentlyAskedQuestion = () => {
|
||||
id: params.id,
|
||||
title: "Это фриланс-платформа?",
|
||||
answer:
|
||||
"Нет, мы работаем только с юридическими лицами и индивидуальными предпринимателями и тщательно проверяем своих партнеров. Партнерами являются агентства, которые специализируются на оказании услуг в формате аутстафф-модели и обладают глубокой экспертизой в разработке и внедрении ИТ-проектов.",
|
||||
"Нет, мы работаем только с юридическими лицами и индивидуальными предпринимателями и тщательно проверяем своих партнеров. Партнерами являются агентства, которые специализируются на оказании услуг в формате аутстафф-модели и обладают глубокой экспертизой в разработке и внедрении IT-проектов.",
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
@ -402,7 +402,7 @@ export const PartnerAddRequest = () => {
|
||||
<h4>Процесс:</h4>
|
||||
</div>
|
||||
<p>
|
||||
При аутстафе мы предоставляем вам it-специалистов при этом они
|
||||
При аутстаффе мы предоставляем вам IT-специалистов при этом они
|
||||
находятся в нашем штате.
|
||||
<br />
|
||||
<br />
|
||||
|
||||
@ -98,7 +98,7 @@ export const PartnerRequests = () => {
|
||||
<div className="partnerRequests__noItems__create">
|
||||
<div className="partnerRequests__noItems__create__link">
|
||||
<img src={cursorImg} alt="cursor" />
|
||||
<p>У вас еще нет запросов на сотрудников</p>
|
||||
<p>У вас ещё нет запросов на сотрудников</p>
|
||||
<BaseButton>
|
||||
<Link to={"/profile/add-request"}>
|
||||
<span>+</span>
|
||||
|
||||
@ -1,7 +1,12 @@
|
||||
import React from "react";
|
||||
import React, { useState } from "react";
|
||||
|
||||
import { apiRequest } from "@api/request";
|
||||
|
||||
import { useNotification } from "@hooks/useNotification";
|
||||
|
||||
import BaseButton from "@components/Common/BaseButton/BaseButton";
|
||||
import { Footer } from "@components/Common/Footer/Footer";
|
||||
import { Loader } from "@components/Common/Loader/Loader";
|
||||
import { Navigation } from "@components/Navigation/Navigation";
|
||||
import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs";
|
||||
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
|
||||
@ -12,6 +17,69 @@ import kontur from "assets/images/logo/konturLogo.png";
|
||||
import "./partnerSettings.scss";
|
||||
|
||||
export const PartnerSettings = () => {
|
||||
const { showNotification } = useNotification();
|
||||
const [inputsValue, setInputsValue] = useState({
|
||||
name: "",
|
||||
oldPassword: "",
|
||||
password: "",
|
||||
});
|
||||
|
||||
const [inputsError, setInputsError] = useState({
|
||||
name: false,
|
||||
password: false,
|
||||
});
|
||||
|
||||
const [loader, setLoader] = useState(false);
|
||||
|
||||
const setSettings = () => {
|
||||
if (inputsValue.name.length < 2) {
|
||||
setInputsError((prevValue) => ({ ...prevValue, name: true }));
|
||||
return;
|
||||
}
|
||||
if (inputsValue.password.length < 6 || inputsValue.oldPassword.length < 6) {
|
||||
setInputsError(() => ({ name: false, password: true }));
|
||||
return;
|
||||
}
|
||||
setLoader(true);
|
||||
apiRequest("/user/change-personal-data", {
|
||||
method: "PUT",
|
||||
data: {
|
||||
newUsername: inputsValue.name,
|
||||
},
|
||||
}).then((data) => {
|
||||
apiRequest("/user/change-password", {
|
||||
method: "PUT",
|
||||
data: {
|
||||
password: inputsValue.oldPassword,
|
||||
newPassword: inputsValue.password,
|
||||
},
|
||||
}).then((data) => {
|
||||
setLoader(false);
|
||||
if (data.status === "success") {
|
||||
setInputsError({
|
||||
name: false,
|
||||
password: false,
|
||||
});
|
||||
setInputsValue({
|
||||
name: "",
|
||||
oldPassword: "",
|
||||
password: "",
|
||||
});
|
||||
showNotification({
|
||||
show: true,
|
||||
text: "Данные изменены",
|
||||
type: "success",
|
||||
});
|
||||
} else {
|
||||
showNotification({
|
||||
show: true,
|
||||
text: "Неверные данные",
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
return (
|
||||
<div className="settings">
|
||||
<ProfileHeader />
|
||||
@ -20,32 +88,95 @@ export const PartnerSettings = () => {
|
||||
<ProfileBreadcrumbs
|
||||
links={[
|
||||
{ name: "Главная", link: "/profile" },
|
||||
{ name: "Настройка профиля", link: "/profile/settings" },
|
||||
{ name: "Настройки", link: "/profile/settings" },
|
||||
]}
|
||||
/>
|
||||
<div className="partner-settings">
|
||||
<h2 className="infoPersonal__title">Настройки акаунта</h2>
|
||||
<h2 className="infoPersonal__title">Настройки профиля</h2>
|
||||
<div className="partner-settings__body">
|
||||
<div className="partner-settings__login">
|
||||
<h3 className="settings__title">Вход в систему</h3>
|
||||
|
||||
<p className="settings__lable-first">Изменение логина</p>
|
||||
<p className="settings__label">Изменение логина</p>
|
||||
<div className="settings__input">
|
||||
<input></input>
|
||||
<input
|
||||
className={inputsError.name ? "warning" : ""}
|
||||
placeholder="Имя"
|
||||
onChange={(e) => {
|
||||
setInputsValue((prevValue) => ({
|
||||
...prevValue,
|
||||
name: e.target.value,
|
||||
}));
|
||||
setInputsError((prevValue) => ({
|
||||
...prevValue,
|
||||
name: false,
|
||||
}));
|
||||
}}
|
||||
value={inputsValue.name}
|
||||
/>
|
||||
{inputsError.name && (
|
||||
<span className="error">Минимум 2 символа</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<p className="settings__lable-second">Изменение пароля</p>
|
||||
<p className="settings__label">Изменение пароля</p>
|
||||
<div className="settings__input oldPassword">
|
||||
<input
|
||||
className={inputsError.password ? "warning" : ""}
|
||||
placeholder="Старый пароль"
|
||||
type={"password"}
|
||||
onChange={(e) => {
|
||||
setInputsValue((prevValue) => ({
|
||||
...prevValue,
|
||||
oldPassword: e.target.value,
|
||||
}));
|
||||
setInputsError((prevValue) => ({
|
||||
...prevValue,
|
||||
password: false,
|
||||
}));
|
||||
}}
|
||||
value={inputsValue.oldPassword}
|
||||
/>
|
||||
{inputsError.password && (
|
||||
<span className="error">Введите верный пароль</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="settings__input">
|
||||
<input></input>
|
||||
<input
|
||||
className={inputsError.password ? "warning" : ""}
|
||||
placeholder="Новый пароль"
|
||||
type={"password"}
|
||||
onChange={(e) => {
|
||||
setInputsValue((prevValue) => ({
|
||||
...prevValue,
|
||||
password: e.target.value,
|
||||
}));
|
||||
setInputsError((prevValue) => ({
|
||||
...prevValue,
|
||||
password: false,
|
||||
}));
|
||||
}}
|
||||
value={inputsValue.password}
|
||||
/>
|
||||
{inputsError.password && (
|
||||
<span className="error">Минимум 6 символов</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="settings__buttons">
|
||||
<BaseButton styles={"settings__buttons-cancel"}>
|
||||
Отмена
|
||||
</BaseButton>
|
||||
<BaseButton styles={"settings__buttons-save"}>
|
||||
Сохранить
|
||||
</BaseButton>
|
||||
{loader ? (
|
||||
<Loader style={"green"} width={"40px"} height={"40px"} />
|
||||
) : (
|
||||
<BaseButton
|
||||
onClick={setSettings}
|
||||
styles={"settings__buttons-save"}
|
||||
>
|
||||
Сохранить
|
||||
</BaseButton>
|
||||
)}
|
||||
</div>
|
||||
<span className="settings__agreement">
|
||||
Нажимая "Сохранить", вы соглашаетесь с Правилами обработки и
|
||||
@ -54,28 +185,26 @@ export const PartnerSettings = () => {
|
||||
</div>
|
||||
<div className="partner-settings__report">
|
||||
<h3 className="settings__title">Документы и отчеты</h3>
|
||||
<p className="settings__lable-first">Изменить провадера ЭДО</p>
|
||||
<p className="settings__label">Изменить провадера ЭДО</p>
|
||||
|
||||
<div className="partner-settings__logo">
|
||||
<div>
|
||||
<label className="partner-settings__label-first">
|
||||
<label className="partner-settings__label">
|
||||
<img src={astral}></img>
|
||||
<input type="checkbox" />
|
||||
<span className="checkbox__first"></span>
|
||||
<span className="checkbox"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<label className="partner-settings__label-second">
|
||||
<label className="partner-settings__label">
|
||||
<img src={kontur}></img>
|
||||
<input type="checkbox" />
|
||||
<span className="checkbox__second"></span>
|
||||
<span className="checkbox"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p className="settings__lable-second">
|
||||
Изменение названия компании
|
||||
</p>
|
||||
<p className="settings__label">Изменение названия компании</p>
|
||||
<div className="settings__input">
|
||||
<input></input>
|
||||
</div>
|
||||
|
||||
@ -22,38 +22,39 @@
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
&__lable {
|
||||
&-first,
|
||||
&-second {
|
||||
font-size: 15px;
|
||||
line-height: 18px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
&-first {
|
||||
margin: 39px 0 10px 0;
|
||||
}
|
||||
&-second {
|
||||
margin: 31px 0 10px 0;
|
||||
}
|
||||
&__label {
|
||||
font-size: 15px;
|
||||
line-height: 18px;
|
||||
color: #000000;
|
||||
margin: 15px 0 10px 0;
|
||||
}
|
||||
|
||||
&__input {
|
||||
background: #eff2f7;
|
||||
border-radius: 8px;
|
||||
width: 373px;
|
||||
height: 35px;
|
||||
border: none;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 5px;
|
||||
input {
|
||||
font-size: 15px;
|
||||
padding: 5px 10px;
|
||||
background: #eff2f7;
|
||||
height: 100%;
|
||||
margin-left: 15px;
|
||||
width: 85%;
|
||||
border-radius: 8px;
|
||||
height: 35px;
|
||||
border: none;
|
||||
font-size: 15px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.error {
|
||||
color: red;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.warning {
|
||||
border: 1px solid red;
|
||||
}
|
||||
}
|
||||
|
||||
.oldPassword {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
&__agreement {
|
||||
@ -64,15 +65,16 @@
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
width: 87%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin: 36px 0 30px 0;
|
||||
justify-content: flex-start;
|
||||
gap: 20px;
|
||||
margin: 30px 0 20px;
|
||||
|
||||
&-cancel,
|
||||
&-save {
|
||||
width: 151px;
|
||||
min-width: 151px;
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
@ -102,7 +104,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 570px) {
|
||||
@media (max-width: 800px) {
|
||||
&__input {
|
||||
width: 95%;
|
||||
}
|
||||
@ -112,6 +114,7 @@
|
||||
width: 100%;
|
||||
flex-direction: column-reverse;
|
||||
align-items: center;
|
||||
gap: 0px;
|
||||
|
||||
&-save {
|
||||
margin-bottom: 15px;
|
||||
@ -121,13 +124,7 @@
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
&__first {
|
||||
margin: 0px 0 0 20px;
|
||||
}
|
||||
|
||||
&__second {
|
||||
margin: 0px 20px 0 0;
|
||||
}
|
||||
margin: 0px 0 0 20px;
|
||||
}
|
||||
|
||||
.partner-settings {
|
||||
@ -136,14 +133,13 @@
|
||||
&__body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
justify-content: space-around;
|
||||
margin-top: 27px;
|
||||
}
|
||||
|
||||
&__report,
|
||||
&__login {
|
||||
width: 500px;
|
||||
height: 435px;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 30px 60px;
|
||||
@ -187,15 +183,8 @@
|
||||
}
|
||||
|
||||
&__label {
|
||||
&-first,
|
||||
&-second {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-second {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
@ -217,10 +206,7 @@
|
||||
}
|
||||
|
||||
&__label {
|
||||
&-second,
|
||||
&-first {
|
||||
flex-direction: row;
|
||||
}
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
@ -258,6 +244,7 @@
|
||||
|
||||
&__report {
|
||||
margin-top: 55px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
&__logo {
|
||||
@ -266,16 +253,7 @@
|
||||
}
|
||||
|
||||
&__label {
|
||||
&-second,
|
||||
&-first {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
&__second {
|
||||
margin: 0px 0 0 20px;
|
||||
}
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -36,7 +36,7 @@ export const Profile = () => {
|
||||
{
|
||||
path: "profile/summary",
|
||||
img: summaryIcon,
|
||||
title: "Данные и резюме",
|
||||
title: "Резюме",
|
||||
description: "Ваше резюме<br/><span>заполнено</span>",
|
||||
},
|
||||
{
|
||||
@ -54,7 +54,7 @@ export const Profile = () => {
|
||||
{
|
||||
path: "profile/settings",
|
||||
img: settingIcon,
|
||||
title: "Настройки аккаунта",
|
||||
title: "Настройки профиля",
|
||||
description: "Перейдите чтобы начать<br/> редактирование",
|
||||
},
|
||||
],
|
||||
@ -87,7 +87,7 @@ export const Profile = () => {
|
||||
{
|
||||
path: "profile/settings",
|
||||
img: settingIcon,
|
||||
title: "Настройки аккаунта",
|
||||
title: "Настройки профиля",
|
||||
description: "Перейдите чтобы начать<br/> редактирование",
|
||||
},
|
||||
],
|
||||
@ -103,7 +103,7 @@ export const Profile = () => {
|
||||
{user === "developer" ? (
|
||||
<span>
|
||||
<p>Добрый день, </p>
|
||||
{profileInfo.fio}
|
||||
{profileInfo?.fio ? profileInfo?.fio : profileInfo?.username}
|
||||
</span>
|
||||
) : (
|
||||
"ООО НДВ Консалтинг"
|
||||
@ -113,7 +113,7 @@ export const Profile = () => {
|
||||
<div className="summary__person">
|
||||
<img
|
||||
src={
|
||||
profileInfo.photo ? urlForLocal(profileInfo.photo) : avatarMok
|
||||
profileInfo?.photo ? urlForLocal(profileInfo.photo) : avatarMok
|
||||
}
|
||||
className="summary__avatar"
|
||||
alt="avatar"
|
||||
@ -121,7 +121,8 @@ export const Profile = () => {
|
||||
<p className="summary__name">
|
||||
{user === "developer" ? (
|
||||
<span>
|
||||
{profileInfo.fio}, {profileInfo.specification} разработчик
|
||||
{profileInfo?.fio ? profileInfo?.fio : profileInfo?.username},{" "}
|
||||
{profileInfo?.specification} разработчик
|
||||
</span>
|
||||
) : (
|
||||
"ООО НДВ Консалтинг"
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.profile {
|
||||
background: #F1F1F1;
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__title {
|
||||
font-weight: 700;
|
||||
@ -14,7 +14,7 @@
|
||||
p {
|
||||
color: black;
|
||||
}
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
|
||||
@media (max-width: 560px) {
|
||||
@ -28,7 +28,7 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
min-height: 128px;
|
||||
min-height: 110px;
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
margin-top: 30px;
|
||||
|
||||
@ -25,7 +25,7 @@ export const ProfileCandidate = () => {
|
||||
{
|
||||
path: "profile/settings",
|
||||
img: settingIcon,
|
||||
title: "Настройки аккаунта",
|
||||
title: "Настройки профиля",
|
||||
description: "Перейдите чтобы начать редактирование",
|
||||
},
|
||||
]);
|
||||
|
||||
@ -33,6 +33,7 @@ import { useNotification } from "@hooks/useNotification";
|
||||
import BaseButton from "@components/Common/BaseButton/BaseButton";
|
||||
import { Footer } from "@components/Common/Footer/Footer";
|
||||
import { Loader } from "@components/Common/Loader/Loader";
|
||||
import AcceptModal from "@components/Modal/AcceptModal/AcceptModal";
|
||||
import ModalTicket from "@components/Modal/Tracker/ModalTicket/ModalTicket";
|
||||
import TrackerModal from "@components/Modal/Tracker/TrackerModal/TrackerModal";
|
||||
import { Navigation } from "@components/Navigation/Navigation";
|
||||
@ -74,6 +75,8 @@ export const ProjectTracker = () => {
|
||||
add: false,
|
||||
edit: false,
|
||||
});
|
||||
const [acceptModalOpen, setAcceptModalOpen] = useState(false);
|
||||
const [currentColumnDelete, setCurrentColumnDelete] = useState(null);
|
||||
const [color, setColor] = useState("#aabbcc");
|
||||
const [tagInfo, setTagInfo] = useState({ description: "", name: "" });
|
||||
const [checkBoxParticipateTasks, setCheckBoxParticipateTasks] =
|
||||
@ -87,9 +90,22 @@ 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));
|
||||
initListeners();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
@ -335,6 +351,8 @@ export const ProjectTracker = () => {
|
||||
...prevState,
|
||||
edit: false,
|
||||
}));
|
||||
setTagInfo({ description: "", name: "" });
|
||||
setColor("#aabbcc");
|
||||
});
|
||||
}
|
||||
|
||||
@ -351,6 +369,81 @@ export const ProjectTracker = () => {
|
||||
});
|
||||
}
|
||||
|
||||
const initListeners = () => {
|
||||
document.addEventListener("click", closeByClickingOut);
|
||||
};
|
||||
|
||||
const closeByClickingOut = (event) => {
|
||||
const path = event.path || (event.composedPath && event.composedPath());
|
||||
|
||||
if (
|
||||
event &&
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("addPerson") ||
|
||||
div.classList.contains("persons__list"))
|
||||
)
|
||||
) {
|
||||
setPersonListOpen(false);
|
||||
}
|
||||
|
||||
if (
|
||||
event &&
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("tasks__head__executor") ||
|
||||
div.classList.contains("tasks__head__executorDropdown"))
|
||||
)
|
||||
) {
|
||||
setSelectedExecutorOpen(false);
|
||||
}
|
||||
|
||||
if (
|
||||
event &&
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("tasks__head__tags") ||
|
||||
div.classList.contains("tags__list"))
|
||||
)
|
||||
) {
|
||||
setTags({
|
||||
open: false,
|
||||
add: false,
|
||||
edit: false,
|
||||
});
|
||||
setTagInfo({
|
||||
description: "",
|
||||
name: "",
|
||||
});
|
||||
setColor("#aabbcc");
|
||||
}
|
||||
|
||||
if (
|
||||
event &&
|
||||
!path.find(
|
||||
(div) =>
|
||||
div.classList &&
|
||||
(div.classList.contains("board__head__more") ||
|
||||
div.classList.contains("column__select"))
|
||||
)
|
||||
) {
|
||||
setOpenColumnSelect((prevState) => {
|
||||
const newState = {};
|
||||
for (const key in prevState) {
|
||||
newState[key] = false;
|
||||
}
|
||||
return newState;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
function closeAcceptModal() {
|
||||
setAcceptModalOpen(false);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="tracker">
|
||||
<ProfileHeader />
|
||||
@ -400,6 +493,7 @@ export const ProjectTracker = () => {
|
||||
selectedTab={selectedTab}
|
||||
priorityTask={priorityTask}
|
||||
projectUsers={projectBoard.projectUsers}
|
||||
projectMarks={projectBoard.mark}
|
||||
/>
|
||||
|
||||
{loader && <Loader style="green" />}
|
||||
@ -437,7 +531,13 @@ export const ProjectTracker = () => {
|
||||
}
|
||||
>
|
||||
{Boolean(projectBoard.projectUsers?.length) && (
|
||||
<div className="projectPersons">
|
||||
<div
|
||||
className={
|
||||
projectBoard.projectUsers?.length == 1
|
||||
? "onePerson"
|
||||
: "projectPersons"
|
||||
}
|
||||
>
|
||||
{projectBoard.projectUsers.slice(0, 3).map((person) => {
|
||||
return (
|
||||
<img
|
||||
@ -614,23 +714,19 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
{tags.open && (
|
||||
<div className="tags__list">
|
||||
<img
|
||||
src={close}
|
||||
className="close"
|
||||
alt="close"
|
||||
onClick={() => {
|
||||
setTags({
|
||||
open: false,
|
||||
add: false,
|
||||
edit: false,
|
||||
});
|
||||
setTagInfo({
|
||||
description: "",
|
||||
name: "",
|
||||
});
|
||||
setColor("#aabbcc");
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
className="addNewTag"
|
||||
onClick={() =>
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: true,
|
||||
}))
|
||||
}
|
||||
>
|
||||
<p>Добавить новый тег</p>
|
||||
<span>+</span>
|
||||
</div>
|
||||
|
||||
{!tags.add && !tags.edit && (
|
||||
<div className="tags__list__created">
|
||||
{projectBoard.mark.map((tag) => {
|
||||
@ -647,46 +743,35 @@ export const ProjectTracker = () => {
|
||||
className="tagItem__info__color"
|
||||
style={{ background: tag.color }}
|
||||
/>
|
||||
</div>
|
||||
<div className="tagItem__images">
|
||||
<img
|
||||
src={edit}
|
||||
alt="edit"
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
edit: true,
|
||||
}));
|
||||
setTagInfo({
|
||||
description: tag.title,
|
||||
name: tag.slug,
|
||||
editMarkId: tag.id,
|
||||
});
|
||||
setColor(tag.color);
|
||||
}}
|
||||
/>
|
||||
<img
|
||||
onClick={() => deleteTag(tag.id)}
|
||||
className="delete"
|
||||
src={close}
|
||||
alt="delete"
|
||||
/>
|
||||
|
||||
<div className="tagItem__info__images">
|
||||
<img
|
||||
src={edit}
|
||||
alt="edit"
|
||||
onClick={() => {
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
edit: true,
|
||||
}));
|
||||
setTagInfo({
|
||||
description: tag.title,
|
||||
name: tag.slug,
|
||||
editMarkId: tag.id,
|
||||
});
|
||||
setColor(tag.color);
|
||||
}}
|
||||
/>
|
||||
<img
|
||||
onClick={() => deleteTag(tag.id)}
|
||||
className="delete"
|
||||
src={close}
|
||||
alt="delete"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
<div
|
||||
className="addNewTag"
|
||||
onClick={() =>
|
||||
setTags((prevState) => ({
|
||||
...prevState,
|
||||
add: true,
|
||||
}))
|
||||
}
|
||||
>
|
||||
<p>Добавить новый тег</p>
|
||||
<span>+</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{(tags.add || tags.edit) && (
|
||||
@ -835,7 +920,14 @@ export const ProjectTracker = () => {
|
||||
</div>
|
||||
<div
|
||||
className="column__select__item"
|
||||
onClick={() => deleteColumn(column)}
|
||||
onClick={() => {
|
||||
if (column.tasks.length) {
|
||||
setAcceptModalOpen(true);
|
||||
setCurrentColumnDelete(column);
|
||||
} else {
|
||||
deleteColumn(column);
|
||||
}
|
||||
}}
|
||||
>
|
||||
<img src={del} alt="delete" />
|
||||
<span>Удалить</span>
|
||||
@ -914,6 +1006,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>
|
||||
@ -981,6 +1086,13 @@ export const ProjectTracker = () => {
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{acceptModalOpen && (
|
||||
<AcceptModal
|
||||
title={"В колонке ещё есть задачи, Вы точно хотите удалить её ?"}
|
||||
closeModal={closeAcceptModal}
|
||||
agreeHandler={() => deleteColumn(currentColumnDelete)}
|
||||
/>
|
||||
)}
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -17,7 +17,7 @@ export const RegistrationForCandidate = () => {
|
||||
<div className="container">
|
||||
<div className="registrationCandidate__start">
|
||||
<h2 className="auth-candidate__start__title">
|
||||
Хочу в команду <span>Айти специалистов</span>
|
||||
Хочу в команду <span>IT-специалистов</span>
|
||||
</h2>
|
||||
<div className="change-mode__arrow">
|
||||
<img src={arrowBtn}></img>
|
||||
@ -41,7 +41,7 @@ export const RegistrationForCandidate = () => {
|
||||
</div>
|
||||
<form className="registrationCandidate__form">
|
||||
<div className="registrationCandidate__form__input">
|
||||
<label htmlFor="name">Ваше имя *</label>
|
||||
<label htmlFor="name">Ваше имя</label>
|
||||
<input id="name" type="text" placeholder="Имя" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
@ -49,19 +49,19 @@ export const RegistrationForCandidate = () => {
|
||||
<input id="summary" type="text" placeholder="Резюме" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<label htmlFor="email">Ваш email *</label>
|
||||
<input id="email" type="text" placeholder="Email" />
|
||||
<label htmlFor="email">Ваш e-mail</label>
|
||||
<input id="email" type="text" placeholder="E-mail" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<label htmlFor="tg">Ваш телеграм*</label>
|
||||
<input id="tg" type="text" placeholder="Телеграм" />
|
||||
<label htmlFor="tg">Ваш telegram</label>
|
||||
<input id="tg" type="text" placeholder="Telegram" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<label htmlFor="password">Придумайте пароль*</label>
|
||||
<label htmlFor="password">Придумайте пароль</label>
|
||||
<input id="password" type="text" placeholder="Пароль" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__input">
|
||||
<label htmlFor="secondPassword">Повторите пароль*</label>
|
||||
<label htmlFor="secondPassword">Повторите пароль</label>
|
||||
<input id="secondPassword" type="text" placeholder="Пароль" />
|
||||
</div>
|
||||
<div className="registrationCandidate__form__submit">
|
||||
|
||||
@ -1,3 +1,5 @@
|
||||
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
|
||||
import { CKEditor } from "@ckeditor/ckeditor5-react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useSelector } from "react-redux";
|
||||
import { Navigate } from "react-router-dom";
|
||||
@ -15,7 +17,10 @@ import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
|
||||
|
||||
import rightArrow from "assets/icons/arrows/arrowRight.svg";
|
||||
import arrow from "assets/icons/arrows/left-arrow.png";
|
||||
import arrowDown from "assets/icons/arrows/selectArrow.png";
|
||||
import deleteIcon from "assets/icons/closeProjectPersons.svg";
|
||||
import gitImgItem from "assets/icons/gitItemImg.svg";
|
||||
import avatarMok from "assets/images/avatarMok.png";
|
||||
|
||||
import "./summary.scss";
|
||||
|
||||
@ -26,12 +31,49 @@ export const Summary = () => {
|
||||
const profileInfo = useSelector(getProfileInfo);
|
||||
const [openGit, setOpenGit] = useState(false);
|
||||
const [gitInfo, setGitInfo] = useState([]);
|
||||
const [editSummeryOpen, setEditSummeryOpen] = useState(false);
|
||||
const [editSkills, setEditSkills] = useState(false);
|
||||
const [summery, setSummery] = useState("");
|
||||
const [selectedSkills, setSelectedSkills] = useState([]);
|
||||
const [selectSkillsOpen, setSelectSkillsOpen] = useState(false);
|
||||
const [skillsList, seSkillsList] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
apiRequest(
|
||||
`/profile/portfolio-projects?card_id=${localStorage.getItem("cardId")}`
|
||||
).then((responseGit) => setGitInfo(responseGit));
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setSummery(profileInfo.vc_text);
|
||||
setSelectedSkills(profileInfo.skillValues);
|
||||
}, [profileInfo]);
|
||||
|
||||
useEffect(() => {
|
||||
apiRequest(`/skills/get-skills-list`).then((el) => {
|
||||
seSkillsList(el);
|
||||
});
|
||||
}, []);
|
||||
|
||||
function setSkills() {
|
||||
apiRequest("/resume/edit-skills", {
|
||||
method: "PUT",
|
||||
data: {
|
||||
UserCard: {
|
||||
skill: selectedSkills.map((item) => item.skill_id),
|
||||
},
|
||||
},
|
||||
}).then(() => {});
|
||||
}
|
||||
|
||||
function editSummery() {
|
||||
apiRequest("/resume/edit-text", {
|
||||
method: "PUT",
|
||||
data: {
|
||||
resume: summery,
|
||||
},
|
||||
}).then(() => {});
|
||||
}
|
||||
return (
|
||||
<div className="summary">
|
||||
<ProfileHeader />
|
||||
@ -41,7 +83,7 @@ export const Summary = () => {
|
||||
<ProfileBreadcrumbs
|
||||
links={[
|
||||
{ name: "Главная", link: "/profile" },
|
||||
{ name: "Данные и резюме", link: "/profile/summary" },
|
||||
{ name: "Резюме", link: "/profile/summary" },
|
||||
]}
|
||||
/>
|
||||
<h2 className="summary__title">
|
||||
@ -56,12 +98,17 @@ export const Summary = () => {
|
||||
<div className={openGit ? "summary__info openGit" : "summary__info"}>
|
||||
<div className="summary__person">
|
||||
<img
|
||||
src={urlForLocal(profileInfo.photo)}
|
||||
src={
|
||||
profileInfo?.photo
|
||||
? urlForLocal(profileInfo.photo)
|
||||
: avatarMok
|
||||
}
|
||||
className="summary__avatar"
|
||||
alt="avatar"
|
||||
/>
|
||||
<p className="summary__name">
|
||||
{profileInfo.fio}, {profileInfo.specification} разработчик
|
||||
{profileInfo?.fio ? profileInfo?.fio : profileInfo?.username},{" "}
|
||||
{profileInfo.specification} разработчик
|
||||
</p>
|
||||
</div>
|
||||
{!openGit && (
|
||||
@ -75,18 +122,84 @@ export const Summary = () => {
|
||||
<div className="summary__skills skills__section">
|
||||
<div className="summary__sections__head">
|
||||
<h3>Основной стек</h3>
|
||||
<button>Редактировать раздел</button>
|
||||
<button
|
||||
className={editSkills ? "edit" : ""}
|
||||
onClick={() => {
|
||||
if (editSkills) {
|
||||
setSkills();
|
||||
}
|
||||
setEditSkills(!editSkills);
|
||||
}}
|
||||
>
|
||||
{editSkills ? "Сохранить" : "Редактировать"}
|
||||
</button>
|
||||
</div>
|
||||
<div className="skills__section__items">
|
||||
<div className="skills__section__items__wrapper">
|
||||
{profileInfo.skillValues &&
|
||||
profileInfo.skillValues.map((skill, index) => (
|
||||
<span key={skill.id} className="skill_item">
|
||||
{skill.skill.name}
|
||||
{profileInfo.skillValues.length > index + 1 && ","}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
{editSkills ? (
|
||||
<div className="editSkills">
|
||||
{selectedSkills &&
|
||||
selectedSkills.map((skill) => {
|
||||
return (
|
||||
<span key={skill.skill_id}>
|
||||
{skill.skill.name}
|
||||
<img
|
||||
src={deleteIcon}
|
||||
alt="deleteIcon"
|
||||
onClick={() =>
|
||||
setSelectedSkills((prevValue) =>
|
||||
prevValue.filter(
|
||||
(item) => item.skill_id !== skill.skill_id
|
||||
)
|
||||
)
|
||||
}
|
||||
/>
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
<div className="selectSkills">
|
||||
<div
|
||||
className="selectSkills__name"
|
||||
onClick={() => setSelectSkillsOpen(!selectSkillsOpen)}
|
||||
>
|
||||
Выберите скилл
|
||||
<img
|
||||
className={selectSkillsOpen ? "open" : ""}
|
||||
src={arrowDown}
|
||||
/>
|
||||
</div>
|
||||
{selectSkillsOpen && (
|
||||
<div className="selectSkills__dropDown">
|
||||
{skillsList.map((skill) => {
|
||||
return (
|
||||
<p
|
||||
onClick={() =>
|
||||
setSelectedSkills((prevValue) => [
|
||||
...prevValue,
|
||||
{ skill: skill, skill_id: skill.id },
|
||||
])
|
||||
}
|
||||
key={skill.id}
|
||||
className="selectSkills__item"
|
||||
>
|
||||
{skill.name}
|
||||
</p>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="skills__section__items__wrapper">
|
||||
{selectedSkills &&
|
||||
selectedSkills.map((skill, index) => (
|
||||
<span key={skill.id} className="skill_item">
|
||||
{skill.skill.name}
|
||||
{selectedSkills.length > index + 1 && ","}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@ -94,21 +207,56 @@ export const Summary = () => {
|
||||
<div className="summary__experience">
|
||||
<div className="experience__block">
|
||||
<div className="summary__sections__head">
|
||||
<h3>Описание опыта работы</h3>
|
||||
<button>Редактировать раздел</button>
|
||||
<h3>Опыт работы</h3>
|
||||
<button
|
||||
className={editSummeryOpen ? "edit" : ""}
|
||||
onClick={() => {
|
||||
if (editSummeryOpen) {
|
||||
editSummery();
|
||||
}
|
||||
setEditSummeryOpen(!editSummeryOpen);
|
||||
}}
|
||||
>
|
||||
{editSummeryOpen ? "Сохранить" : "Редактировать"}
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className="experience__content"
|
||||
dangerouslySetInnerHTML={{ __html: profileInfo.vc_text }}
|
||||
></div>
|
||||
{editSummeryOpen ? (
|
||||
<CKEditor
|
||||
editor={ClassicEditor}
|
||||
data={summery}
|
||||
config={{
|
||||
removePlugins: [
|
||||
"CKFinderUploadAdapter",
|
||||
"CKFinder",
|
||||
"EasyImage",
|
||||
"Image",
|
||||
"ImageCaption",
|
||||
"ImageStyle",
|
||||
"ImageToolbar",
|
||||
"ImageUpload",
|
||||
"MediaEmbed",
|
||||
"BlockQuote",
|
||||
],
|
||||
}}
|
||||
onChange={(event, editor) => {
|
||||
const data = editor.getData();
|
||||
setSummery(data);
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<div
|
||||
className="experience__content"
|
||||
dangerouslySetInnerHTML={{ __html: summery }}
|
||||
></div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{openGit && (
|
||||
<div className="summary__sectionGit">
|
||||
<div className="summary__sections__head">
|
||||
<h3>Страница портфолио кода разработчика</h3>
|
||||
<button>Редактировать раздел</button>
|
||||
<h3>Ваши репозитории</h3>
|
||||
<button>Редактировать</button>
|
||||
</div>
|
||||
<div className="summary__sectionGitItems">
|
||||
{Boolean(gitInfo.length) &&
|
||||
@ -145,6 +293,9 @@ export const Summary = () => {
|
||||
</a>
|
||||
);
|
||||
})}
|
||||
{!Boolean(gitInfo.length) && (
|
||||
<p className="noGitItems">Нет актуальных проектов</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -1,17 +1,8 @@
|
||||
.summary {
|
||||
background: #F1F1F1;
|
||||
background: #f1f1f1;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
font-family: 'LabGrotesque', sans-serif;
|
||||
//
|
||||
//&__container {
|
||||
// max-width: 1160px;
|
||||
// padding: 0 10px;
|
||||
// margin: 20px auto;
|
||||
// position: relative;
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
//}
|
||||
font-family: "LabGrotesque", sans-serif;
|
||||
|
||||
&__content {
|
||||
display: flex;
|
||||
@ -25,7 +16,7 @@
|
||||
margin-bottom: 0;
|
||||
|
||||
span {
|
||||
color: #52B709;
|
||||
color: #52b709;
|
||||
}
|
||||
}
|
||||
|
||||
@ -45,10 +36,10 @@
|
||||
}
|
||||
|
||||
&__info {
|
||||
min-height: 128px;
|
||||
min-height: 110px;
|
||||
background: white;
|
||||
border-radius: 12px;
|
||||
margin-top: 30px;
|
||||
margin-top: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 25px 0 45px;
|
||||
@ -110,14 +101,6 @@
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
|
||||
//@media (max-width: 915px) {
|
||||
// max-width: 220px;
|
||||
// overflow: hidden;
|
||||
// white-space: nowrap;
|
||||
// text-overflow: ellipsis;
|
||||
//}
|
||||
|
||||
@media (max-width: 690px) {
|
||||
font-size: 14px;
|
||||
@ -128,19 +111,18 @@
|
||||
@media (max-width: 550px) {
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
max-width: 150px;
|
||||
max-width: 160px;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '';
|
||||
content: "";
|
||||
position: absolute;
|
||||
background: #52B709;
|
||||
background: #52b709;
|
||||
border-radius: 12px;
|
||||
width: 70%;
|
||||
height: 8px;
|
||||
@ -159,7 +141,14 @@
|
||||
color: white;
|
||||
border: none;
|
||||
transition: all 0.3s ease;
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%), linear-gradient(36deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.16) 47%, rgba(255, 255, 255, 0.17) 50%, rgba(255, 255, 255, 0) 100%);
|
||||
background-image: linear-gradient(to top, #6aaf5c 0%, #52b709 100%),
|
||||
linear-gradient(
|
||||
36deg,
|
||||
rgba(255, 255, 255, 0) 0%,
|
||||
rgba(255, 255, 255, 0.16) 47%,
|
||||
rgba(255, 255, 255, 0.17) 50%,
|
||||
rgba(255, 255, 255, 0) 100%
|
||||
);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 6px 5px 20px rgb(87 98 80 / 21%);
|
||||
@ -170,10 +159,15 @@
|
||||
width: 120px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
@media (max-width: 450px) {
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
&__skills {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
margin-top: 35px;
|
||||
}
|
||||
@ -181,7 +175,7 @@
|
||||
&__sections__head {
|
||||
display: flex;
|
||||
min-height: 69px;
|
||||
background: #E1FCCF;
|
||||
background: #e1fccf;
|
||||
border-radius: 12px 12px 0px 0px;
|
||||
align-items: center;
|
||||
padding: 0 35px 0 50px;
|
||||
@ -195,6 +189,7 @@
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
margin: 0;
|
||||
|
||||
@media (max-width: 660px) {
|
||||
line-height: 20px;
|
||||
@ -202,7 +197,7 @@
|
||||
}
|
||||
|
||||
button {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 44px;
|
||||
padding: 10px 20px;
|
||||
display: flex;
|
||||
@ -220,6 +215,11 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.edit {
|
||||
background-color: green;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.skills__section {
|
||||
@ -227,7 +227,7 @@
|
||||
padding: 25px 35px 25px 50px;
|
||||
|
||||
@media (max-width: 550px) {
|
||||
padding: 15px 15px 20px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
@ -241,6 +241,94 @@
|
||||
line-height: 32px;
|
||||
white-space: nowrap;
|
||||
text-transform: uppercase;
|
||||
|
||||
@media (max-width: 550px) {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.editSkills {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 14px;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
display: flex;
|
||||
column-gap: 8px;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 15px;
|
||||
padding: 3px 10px 3px 10px;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
white-space: nowrap;
|
||||
text-transform: uppercase;
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.selectSkills {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
|
||||
&__name {
|
||||
display: flex;
|
||||
column-gap: 12px;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 15px;
|
||||
padding: 3px 10px 3px 10px;
|
||||
|
||||
img {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.open {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
&__dropDown {
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
border-radius: 12px;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
row-gap: 5px;
|
||||
align-items: center;
|
||||
padding: 7px;
|
||||
top: 35px;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #cbd9f9;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
background: #c5c0c6;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
p {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -254,7 +342,7 @@
|
||||
|
||||
.experience {
|
||||
&__block {
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
@ -287,6 +375,15 @@
|
||||
}
|
||||
}
|
||||
|
||||
.ck-toolbar {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.ck-content {
|
||||
border: none !important;
|
||||
padding: 15px 35px 15px 50px !important;
|
||||
}
|
||||
|
||||
&__sectionGit {
|
||||
margin-top: 25px;
|
||||
|
||||
@ -298,14 +395,24 @@
|
||||
column-gap: 25px;
|
||||
justify-content: space-between;
|
||||
|
||||
.noGitItems {
|
||||
width: 100%;
|
||||
font-size: 20px;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 10px;
|
||||
color: #000000;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.gitItem {
|
||||
width: 48%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: #FFFFFF;
|
||||
background: #ffffff;
|
||||
border-radius: 12px;
|
||||
padding: 35px 30px 30px 45px;
|
||||
padding: 10px;
|
||||
transition: all 0.3s ease;
|
||||
color: #000000;
|
||||
|
||||
@ -350,29 +457,11 @@
|
||||
p {
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
line-height: 32px;
|
||||
margin-bottom: 0;
|
||||
white-space: nowrap;
|
||||
max-width: 300px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
@media (max-width: 1040px) {
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
@media (max-width: 890px) {
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
@media (max-width: 825px) {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
max-width: 250px;
|
||||
}
|
||||
|
||||
@media (max-width: 470px) {
|
||||
max-width: 200px;
|
||||
}
|
||||
@ -380,7 +469,6 @@
|
||||
}
|
||||
|
||||
&__specification {
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 10px;
|
||||
@ -391,7 +479,7 @@
|
||||
}
|
||||
|
||||
span {
|
||||
background: #D4F123;
|
||||
background: #d4f123;
|
||||
border-radius: 12px;
|
||||
max-width: 260px;
|
||||
width: 100%;
|
||||
@ -409,7 +497,7 @@
|
||||
|
||||
&__link {
|
||||
border-radius: 50%;
|
||||
background: #DDEEC6;
|
||||
background: #ddeec6;
|
||||
min-width: 48px;
|
||||
height: 48px;
|
||||
cursor: pointer;
|
||||
@ -422,15 +510,15 @@
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 70px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 1160px;
|
||||
margin-top: 23px;
|
||||
max-width: 1160px;
|
||||
margin-top: 23px;
|
||||
|
||||
@media (max-width: 570px) {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
@media (max-width: 570px) {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -129,7 +129,7 @@ export const Tracker = () => {
|
||||
e.target.closest("img").classList.toggle("open-desc-item");
|
||||
e.target
|
||||
.closest("td")
|
||||
.querySelector(".taskList__table__name-project")
|
||||
?.querySelector(".taskList__table__name-project")
|
||||
.classList.toggle("hide-desc");
|
||||
}
|
||||
|
||||
@ -197,7 +197,7 @@ export const Tracker = () => {
|
||||
!loader &&
|
||||
projects.map((project, index) => {
|
||||
return project.status !== 10 ? (
|
||||
<ProjectTiket key={index} project={project}></ProjectTiket>
|
||||
<ProjectTiket key={index} project={project} />
|
||||
) : (
|
||||
""
|
||||
);
|
||||
@ -317,7 +317,8 @@ export const Tracker = () => {
|
||||
<tr key={task.id}>
|
||||
<td>
|
||||
<div className="taskList__table__title-task">
|
||||
{task.title}
|
||||
<p>{task.title}</p>
|
||||
|
||||
<div
|
||||
onClick={(e) => {
|
||||
toggleDescTask(e);
|
||||
@ -452,7 +453,7 @@ export const Tracker = () => {
|
||||
{Boolean(filterCompleteTasks.length) ? (
|
||||
filterCompleteTasks.map((task, index) => {
|
||||
return (
|
||||
<tr>
|
||||
<tr key={index}>
|
||||
<td className="archive__completeTask__description">
|
||||
<p className="completeTask__title">
|
||||
{task.title}
|
||||
|
||||
@ -322,6 +322,7 @@
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: 5px;
|
||||
|
||||
img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@ -341,6 +342,19 @@
|
||||
}
|
||||
}
|
||||
|
||||
.onePerson {
|
||||
display: flex;
|
||||
position: relative;
|
||||
left: -15px;
|
||||
|
||||
img {
|
||||
position: relative;
|
||||
display: flex;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
@ -390,10 +404,10 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
|
||||
border-radius: 40px;
|
||||
padding: 31px 128px 41px 49px;
|
||||
border-radius: 20px;
|
||||
padding: 30px;
|
||||
cursor: default;
|
||||
width: 650px;
|
||||
width: 800px;
|
||||
|
||||
&__close {
|
||||
cursor: pointer;
|
||||
@ -410,7 +424,6 @@
|
||||
align-items: end;
|
||||
color: #1458dd;
|
||||
font-size: 22px;
|
||||
margin-top: 10px;
|
||||
span {
|
||||
font-size: 44px;
|
||||
font-weight: 700;
|
||||
@ -462,7 +475,7 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-width: 190px;
|
||||
max-width: 300px;
|
||||
width: 100%;
|
||||
|
||||
.avatar {
|
||||
@ -479,7 +492,7 @@
|
||||
color: #807777;
|
||||
width: auto;
|
||||
height: auto;
|
||||
max-width: 130px;
|
||||
max-width: 215px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
@ -494,6 +507,7 @@
|
||||
|
||||
&__add {
|
||||
display: flex;
|
||||
margin-left: 3px;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
@ -514,7 +528,8 @@
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
width: 390px;
|
||||
padding: 15px 30px;
|
||||
padding: 30px;
|
||||
|
||||
.persons__list__info {
|
||||
margin: 10px;
|
||||
}
|
||||
@ -756,16 +771,18 @@
|
||||
margin: 0 10px;
|
||||
column-gap: 5px;
|
||||
cursor: pointer;
|
||||
padding: 4px;
|
||||
padding: 5px 20px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #e3e2e2;
|
||||
max-height: 30px;
|
||||
|
||||
p {
|
||||
white-space: nowrap;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
line-height: 17px;
|
||||
}
|
||||
|
||||
span {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
@ -783,12 +800,13 @@
|
||||
}
|
||||
&__list {
|
||||
position: absolute;
|
||||
background: #f8f9fa;
|
||||
border-radius: 2px;
|
||||
background: #d9d9d9;
|
||||
z-index: 8;
|
||||
border-radius: 8px;
|
||||
padding: 20px 10px 10px;
|
||||
|
||||
// padding: 0 8px 10px;
|
||||
top: 30px;
|
||||
width: 220px;
|
||||
width: 265px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -806,17 +824,27 @@
|
||||
flex-direction: column;
|
||||
row-gap: 8px;
|
||||
margin-top: 8px;
|
||||
padding: 0 8px 8px;
|
||||
|
||||
.tagItem {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 5px;
|
||||
border: 1px solid #e3e2e2;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 0px 8px;
|
||||
border-radius: 8px;
|
||||
height: 50px;
|
||||
max-height: 50px;
|
||||
background: #fff;
|
||||
|
||||
&__description {
|
||||
font-size: 14px;
|
||||
font-size: 12px;
|
||||
word-break: break-word;
|
||||
max-width: 115px;
|
||||
max-height: 40px;
|
||||
overflow: hidden;
|
||||
text-wrap: wrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__info {
|
||||
@ -825,32 +853,29 @@
|
||||
column-gap: 10px;
|
||||
|
||||
&__name {
|
||||
font-size: 16px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
&__color {
|
||||
border: 1px solid #e3e2e2;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
&__images {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 3px;
|
||||
display: flex;
|
||||
column-gap: 3px;
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
width: 22.25px;
|
||||
height: 23.217px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.delete {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
&__images {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
row-gap: 6px;
|
||||
|
||||
img {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.delete {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -859,17 +884,21 @@
|
||||
.addNewTag {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 8px;
|
||||
column-gap: 15px;
|
||||
border-radius: 8px;
|
||||
background: #252c32;
|
||||
color: white;
|
||||
height: 42px;
|
||||
cursor: pointer;
|
||||
justify-content: center;
|
||||
|
||||
p {
|
||||
font-size: 13px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
span {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
border-radius: 50px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@ -884,8 +913,9 @@
|
||||
.formTag {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 8px;
|
||||
padding: 8px;
|
||||
row-gap: 8px;
|
||||
|
||||
.arrow {
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
@ -906,11 +936,12 @@
|
||||
&__btn {
|
||||
outline: none;
|
||||
border: none;
|
||||
background: #6f6f6f;
|
||||
background: #252c32;
|
||||
color: whitesmoke;
|
||||
margin: 0 auto;
|
||||
margin: 10px auto 0;
|
||||
border-radius: 10px;
|
||||
font-size: 15px;
|
||||
padding: 5px 12px;
|
||||
}
|
||||
|
||||
.disable {
|
||||
@ -1125,6 +1156,35 @@
|
||||
}
|
||||
}
|
||||
|
||||
&__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;
|
||||
@ -1288,6 +1348,7 @@
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
min-width: 300px;
|
||||
padding-left: 18px;
|
||||
|
||||
&__more {
|
||||
display: flex;
|
||||
@ -1550,12 +1611,20 @@
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
transition: 0.4s;
|
||||
max-width: 350px;
|
||||
|
||||
p {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div {
|
||||
cursor: pointer;
|
||||
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
min-width: 15px;
|
||||
min-height: 15px;
|
||||
display: flex;
|
||||
background-color: #000;
|
||||
align-items: center;
|
||||
|
||||
@ -36,7 +36,7 @@ export const TrackerIntro = () => {
|
||||
компании в одном месте: проекты, задачи, цели, сотрудники,
|
||||
документы, переписки, отчеты
|
||||
</p>
|
||||
<NavLink to="/auth" className="trackerIntro__btn">
|
||||
<NavLink to="/tracker-registration" className="trackerIntro__btn">
|
||||
Начать работу
|
||||
</NavLink>
|
||||
</div>
|
||||
@ -57,7 +57,7 @@ export const TrackerIntro = () => {
|
||||
Управление большим количеством проектов и гибкая настройка
|
||||
структуры под любые процессы
|
||||
</p>
|
||||
<NavLink to="/auth" className="trackerIntro__btn">
|
||||
<NavLink to="/tracker-registration" className="trackerIntro__btn">
|
||||
Начать работу
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
@ -31,19 +31,19 @@ export const TrackerRegistration = () => {
|
||||
<div className="trackerRegistration__form">
|
||||
<div className="trackerRegistration__form__inputs">
|
||||
<div className="trackerRegistration__inputContainer">
|
||||
<span>Ваше имя *</span>
|
||||
<span>Ваше имя</span>
|
||||
<input placeholder="Имя" />
|
||||
</div>
|
||||
<div className="trackerRegistration__inputContainer">
|
||||
<span>Ваш email *</span>
|
||||
<input placeholder="Email" type="email" />
|
||||
<span>Ваш e-mail</span>
|
||||
<input placeholder="E-mail" type="email" />
|
||||
</div>
|
||||
<div className="trackerRegistration__inputContainer">
|
||||
<span>Придумайте пароль*</span>
|
||||
<span>Придумайте пароль</span>
|
||||
<input placeholder="Пароль" />
|
||||
</div>
|
||||
<div className="trackerRegistration__inputContainer">
|
||||
<span>Повторите пароль*</span>
|
||||
<span>Повторите пароль</span>
|
||||
<input placeholder="Повторите пароль" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user