diff --git a/src/components/AuthHeader/AuthHeader.js b/src/components/AuthHeader/AuthHeader.js index f0cb9dc8..1b072eed 100644 --- a/src/components/AuthHeader/AuthHeader.js +++ b/src/components/AuthHeader/AuthHeader.js @@ -1,18 +1,12 @@ import React from "react"; import { NavLink } from "react-router-dom"; +import { scrollToForm } from "../../helper"; import userIcon from "../../images/userIcon.png"; import "./authHeader.scss"; export const AuthHeader = ({}) => { - function scrollToForm() { - window.scrollTo({ - top: 850, - behavior: "smooth", - }); - } - return (
@@ -25,10 +19,8 @@ export const AuthHeader = ({}) => {
  • - - - Главная - + + Главная
  • @@ -38,10 +30,8 @@ export const AuthHeader = ({}) => { Школа
  • - - - Войти в команду - + + Войти в команду
diff --git a/src/components/CandidateSidebar/CandidateSidebar.js b/src/components/CandidateSidebar/CandidateSidebar.js index 9f1a9277..0d009df8 100644 --- a/src/components/CandidateSidebar/CandidateSidebar.js +++ b/src/components/CandidateSidebar/CandidateSidebar.js @@ -1,79 +1,85 @@ -import React from 'react' -import {Link} from 'react-router-dom' -import {Achievement} from '../Achievement/Achievement' +import React, { useState } from "react"; +import { Link } from "react-router-dom"; +import { Achievement } from "../Achievement/Achievement"; -import {LEVELS, SKILLS} from '../../constants/constants' +import ModalAspt from "../UI/ModalAspt/ModalAspt"; +import { urlForLocal } from "../../helper"; +import { LEVELS, SKILLS } from "../../constants/constants"; -import './candidateSidebar.scss' -import {urlForLocal} from "../../helper"; +import "./candidateSidebar.scss"; const getYearsString = (years) => { let yearsString; if (years % 10 === 1) { - yearsString = 'год' + yearsString = "год"; } else if (years === 11 || years === 12 || years === 13 || years === 14) { - yearsString = 'лет' + yearsString = "лет"; } else if (years % 10 === 2 || years % 10 === 3 || years % 10 === 4) { - yearsString = 'года' + yearsString = "года"; } else { - yearsString = 'лет' + yearsString = "лет"; } - return `${years} ${yearsString}` + return `${years} ${yearsString}`; }; -const CandidateSidebar = ({candidate, setActiveSnippet, activeSnippet}) => { - const userId = localStorage.getItem('id'); +const CandidateSidebar = ({ candidate, setActiveSnippet, activeSnippet }) => { + const userId = localStorage.getItem("id"); const showSnippet = () => { - setActiveSnippet(!activeSnippet) + setActiveSnippet(!activeSnippet); }; + const [addAspt, setAddAspt] = useState(false); + return ( -
-
-
-

- {candidate.specification} {SKILLS[candidate.position_id]},{' '} - {LEVELS[candidate.level]}{' '} -

-
- {candidate.photo && } - {candidate && candidate.years_of_exp && ( - <> -

Опыт работы

-

- {getYearsString(candidate.years_of_exp)} -

- - )} - - - - {userId && ( - <> - - - - -
- {candidate && - candidate.achievements && - candidate.achievements.map((item) => { - return - })} -
- )} +
+
+
+

+ {candidate.specification} {SKILLS[candidate.position_id]},{" "} + {LEVELS[candidate.level]}{" "} +

+ {candidate.photo && } + {candidate && candidate.years_of_exp && ( + <> +

Опыт работы

+

+ {getYearsString(candidate.years_of_exp)} +

+ + )} + + + + + + {userId && ( + <> + + + + +
+ {candidate && + candidate.achievements && + candidate.achievements.map((item) => { + return ( + + ); + })} +
+ + )}
- ) +
+ ); }; -export default CandidateSidebar +export default CandidateSidebar; diff --git a/src/components/UI/FreeDevelopers/FreeDevelopers.js b/src/components/UI/FreeDevelopers/FreeDevelopers.js index adbc02a3..53fa1ec3 100644 --- a/src/components/UI/FreeDevelopers/FreeDevelopers.js +++ b/src/components/UI/FreeDevelopers/FreeDevelopers.js @@ -3,13 +3,15 @@ import React from "react"; import AuthHeader from "../../AuthHeader/AuthHeader"; import SideBar from "../../SideBar/SideBar"; import { Footer } from "../../Footer/Footer"; + +import { Link } from "react-router-dom"; +import { scrollToForm } from "../../../helper"; import { ProfileBreadcrumbs } from "../../ProfileBreadcrumbs/ProfileBreadcrumbs"; import mockWorker from "../../../images/mokPerson.png"; import arrow from "../../../images/arrow_left.png"; import "./freeDevelopers.scss"; -import { Link } from "react-router-dom"; export const FreeDevelopers = ({}) => { return ( @@ -40,7 +42,9 @@ export const FreeDevelopers = ({}) => {
- +
diff --git a/src/components/UI/ModalAdd/modalAdd.scss b/src/components/UI/ModalAdd/modalAdd.scss index c4e6e2e1..345b64ca 100644 --- a/src/components/UI/ModalAdd/modalAdd.scss +++ b/src/components/UI/ModalAdd/modalAdd.scss @@ -87,31 +87,31 @@ align-items: center; justify-content: center; } - - .exit { - cursor: pointer; - position: absolute; - top: 35px; - right: 40px; - - &:before, - &:after { - content: ""; - position: absolute; - width: 16px; - height: 2px; - background: #263238; - } - - &:before { - transform: rotate(45deg); - } - &:after { - transform: rotate(-45deg); - } - } } .modal-add.active { transform: scale(1); } + +.exit { + cursor: pointer; + position: absolute; + top: 35px; + right: 40px; + + &:before, + &:after { + content: ""; + position: absolute; + width: 16px; + height: 2px; + background: #263238; + } + + &:before { + transform: rotate(45deg); + } + &:after { + transform: rotate(-45deg); + } +} diff --git a/src/components/UI/ModalAspt/ModalAspt.js b/src/components/UI/ModalAspt/ModalAspt.js new file mode 100644 index 00000000..34f9faf0 --- /dev/null +++ b/src/components/UI/ModalAspt/ModalAspt.js @@ -0,0 +1,96 @@ +import React, { useState } from "react"; + +import avatar from "../../../images/mokPerson.png"; +import logoTg from "../../../images/TgLogo.svg"; +import arrow from "../../../images/right-arrow.png"; +import interview from "../../../images/interviewLogo.svg"; + +import ModalAdd from "../ModalAdd/ModalAdd"; + +import "./modalAspt.scss"; + +export const ModalAspt = ({ active, setActive }) => { + const [date, setDate] = useState(""); + const [time, setTime] = useState(""); + const [modalSend, setModalSend] = useState(false); + + const send = () => { + if (date != "" && time != "") { + setModalSend(true); + + setTimeout(() => { + setModalSend(false); + setActive(false); + }, 3200); + } + }; + + return ( +
setActive(false)} + > +
e.stopPropagation()}> +
+

Выбранный кандидат

+
+
+ +

Full-stack Back end - разработчик, Senior

+
+
+
+ +
+

Вернуться к списку

+
+
+ +
+

Есть вопросы?

+
+ +

Напишите нам в Телеграм. Мы с удовольствием ответим!

+
+
+
+
+

Дата собеседования

+
+ setDate(e.target.value)} + > +
+ +

Время собеседования

+
+ setTime(e.target.value)} + > +
+ + +
+ setActive(false)}> +
+ +
+ +

Спасибо,собеседование назначено

+

+ Дата: {date} +

+

+ Время собеседования: {time} +

+
+ +
+ ); +}; + +export default ModalAspt; diff --git a/src/components/UI/ModalAspt/modalAspt.scss b/src/components/UI/ModalAspt/modalAspt.scss new file mode 100644 index 00000000..3f4775cd --- /dev/null +++ b/src/components/UI/ModalAspt/modalAspt.scss @@ -0,0 +1,188 @@ +.modal-aspt { + z-index: 99; + height: 100%; + width: 100%; + background-color: rgba(0, 0, 0, 0.11); + position: fixed; + top: 0; + left: 0; + display: flex; + align-items: center; + justify-content: center; + transform: scale(0); + + &__content { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + background: #ffffff; + border: 1px solid #dde2e4; + border-radius: 8px; + + .aspt-decs { + padding: 54px 25px 51px 61px; + border-right: 1px solid #f1f1f1; + + h1 { + display: block; + font-weight: 500; + font-size: 30px; + line-height: 32px; + color: #000000; + text-align: left; + } + + &__avatar { + margin-top: 76px; + + &_title { + display: flex; + flex-direction: row; + align-items: center; + + img { + width: 48px; + height: 48px; + margin: 0 22px 0 0; + } + + p { + font-weight: 500; + font-size: 16px; + line-height: 24px; + } + } + + &_back { + display: flex; + align-items: center; + margin: 40px 0 0 0; + + div { + background: #8dc63f; + opacity: 0.3; + width: 48px; + height: 48px; + border-radius: 44px; + display: flex; + align-items: center; + justify-content: center; + margin: 0 15px 0 0; + + img { + margin: 0; + width: 50%; + } + } + + p { + font-size: 12px; + line-height: 16px; + color: #5b6871; + } + } + } + + &__telega { + text-align: left; + + h4 { + color: #52b709; + font-size: 14px; + margin: 55px 0 34px 0; + } + + p, + h4 { + font-weight: 900; + line-height: 24px; + } + + p { + width: 50%; + font-size: 12px; + } + + &-logo { + display: flex; + flex-direction: row; + + img { + margin: 0 19px 0 0; + } + } + } + } + + .form-interview { + text-align: left; + padding: 54px 61px 51px 72px; + + p { + font-weight: 400; + font-size: 15px; + line-height: 18px; + margin-bottom: 10px; + } + + button { + width: 174px; + height: 46px; + color: white; + border: none; + font-size: 18px; + line-height: 32px; + background: #52b709; + border-radius: 44px; + } + + .input { + background: #eff2f7; + border-radius: 8px; + display: flex; + justify-content: center; + width: 294px; + height: 35px; + margin: 0 0 36px 0; + + input { + background: #eff2f7; + width: 90%; + border: none; + outline: none; + font-size: 15px; + } + } + } + } + + .send { + display: flex; + flex-direction: column; + align-items: center; + + h2 { + text-align: center; + margin: 25px 0 31px 0; + } + + p { + font-size: 14px; + line-height: 17px; + font-weight: 700; + text-align: center; + color: #000000; + margin-bottom: 10px; + + span { + color: #406128; + } + } + } +} + +.modal-aspt.active { + transform: scale(1); +} diff --git a/src/components/UI/ModalCreate/ModalCreate.scss b/src/components/UI/ModalCreate/ModalCreate.scss index b7b8492e..8db78e25 100644 --- a/src/components/UI/ModalCreate/ModalCreate.scss +++ b/src/components/UI/ModalCreate/ModalCreate.scss @@ -69,29 +69,6 @@ align-items: center; justify-content: center; } - - .exit { - cursor: pointer; - position: absolute; - top: 35px; - right: 40px; - - &:before, - &:after { - content: ""; - position: absolute; - width: 16px; - height: 2px; - background: #263238; - } - - &:before { - transform: rotate(45deg); - } - &:after { - transform: rotate(-45deg); - } - } } } diff --git a/src/components/UI/ModalTiket/ModalTiket.js b/src/components/UI/ModalTiket/ModalTiket.js index a3417291..9648200c 100644 --- a/src/components/UI/ModalTiket/ModalTiket.js +++ b/src/components/UI/ModalTiket/ModalTiket.js @@ -14,8 +14,8 @@ import edit from "../../../images/edit.svg"; import send from "../../../images/send.svg"; import plus from "../../../images/plus.svg"; -import "./ModalTiket.scss"; import ModalAdd from "../ModalAdd/ModalAdd"; +import "./ModalTiket.scss"; export const ModalTiket = ({ active, setActive }) => { const [tiket] = useState({ diff --git a/src/helper.js b/src/helper.js index 46cfd13b..5e5b9993 100644 --- a/src/helper.js +++ b/src/helper.js @@ -1,22 +1,25 @@ export function createMarkup(text) { - return {__html: text.split('

').join('

')} + return { __html: text.split("

").join("

") }; } export function transformHtml(text) { - let startHtml = {__html: text.split('

||

').join('

').split('
')}; - startHtml = startHtml.__html.filter((el) => - el !== null && el !== "" || el === 0 + let startHtml = { + __html: text.split("

||

").join("

").split("
"), + }; + startHtml = startHtml.__html.filter( + (el) => (el !== null && el !== "") || el === 0 ); - const finalHtml = startHtml.map((item) => + const finalHtml = startHtml.map( + (item) => `

Описание опыта работы

-
${item.split('

')[0]}

+
${item.split("

")[0]}

` ); - return {__html: finalHtml.join('')} + return { __html: finalHtml.join("") }; } // // export const setToken = () => { @@ -29,12 +32,22 @@ export function transformHtml(text) { // }; export const getToken = () => { - const tParam = `Bearer ${localStorage.getItem('auth_token')}` + const tParam = `Bearer ${localStorage.getItem("auth_token")}`; - return tParam ? {Authorization: tParam} : {}; + return tParam ? { Authorization: tParam } : {}; }; -export const urlHasParams = (url) => url.indexOf('?') > 0 ? `${url}&${window.location.search.substr(1)}` : `${url}${window.location.search}`; +export const urlHasParams = (url) => + url.indexOf("?") > 0 + ? `${url}&${window.location.search.substr(1)}` + : `${url}${window.location.search}`; +export const urlForLocal = (url) => + process.env.NODE_ENV === "development" ? `https://itguild.info${url}` : url; -export const urlForLocal = (url) => process.env.NODE_ENV === 'development' ? `https://itguild.info${url}` : url; +export function scrollToForm() { + window.scrollTo({ + top: 850, + behavior: "smooth", + }); +} diff --git a/src/images/interviewLogo.svg b/src/images/interviewLogo.svg new file mode 100644 index 00000000..140aaa33 --- /dev/null +++ b/src/images/interviewLogo.svg @@ -0,0 +1,27 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/pages/AuthForDevelopers/AuthForDevelopers.js b/src/pages/AuthForDevelopers/AuthForDevelopers.js index ba7e4d01..2b375364 100644 --- a/src/pages/AuthForDevelopers/AuthForDevelopers.js +++ b/src/pages/AuthForDevelopers/AuthForDevelopers.js @@ -13,6 +13,8 @@ import vectorBlack from "../../images/Vector_Smart_Object_black.png"; import { selectAuth } from "../../redux/outstaffingSlice"; import { Link, useNavigate } from "react-router-dom"; +import { scrollToForm } from "../../helper"; + import { Footer } from "../../components/Footer/Footer"; import SideBar from "../../components/SideBar/SideBar"; import AuthHeader from "../../components/AuthHeader/AuthHeader"; @@ -31,13 +33,6 @@ const AuthForDevelopers = () => { } }, [getToken]); - function scrollToForm() { - window.scrollTo({ - top: 850, - behavior: "smooth", - }); - } - return (
diff --git a/src/pages/AuthForPartners/AuthForPartners.js b/src/pages/AuthForPartners/AuthForPartners.js index 044596ad..297f3d8e 100644 --- a/src/pages/AuthForPartners/AuthForPartners.js +++ b/src/pages/AuthForPartners/AuthForPartners.js @@ -6,9 +6,11 @@ import text from "../../images/Body_Text.png"; import arrowBtn from "../../images/arrowRight.png"; import vector from "../../images/Vector_Smart_Object.png"; import vectorBlack from "../../images/Vector_Smart_Object_black.png"; + import { useSelector } from "react-redux"; import { selectAuth } from "../../redux/outstaffingSlice"; import { Link, useNavigate } from "react-router-dom"; +import { scrollToForm } from "../../helper"; import { Footer } from "../../components/Footer/Footer"; import { AuthBox } from "../../components/AuthBox/AuthBox"; @@ -30,17 +32,14 @@ const AuthForPartners = () => { } }, [getToken]); - function scrollToForm() { - window.scrollTo({ - top: 850, - behavior: "smooth", - }); - } - return (
- +