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

Fixed img in components

Browse Source
This commit is contained in:
MaxOvs19
2023-05-24 13:49:09 +03:00
parent 2aa2b15d2d
commit 08f7d13f01
40 changed files with 1133 additions and 1092 deletions
Download Patch File Download Diff File Expand all files Collapse all files

361
src/pages/AuthForCandidate/AuthForCandidate.jsx
View File

@ -1,188 +1,207 @@
import React, {useEffect, useRef, useState} from "react";
import {loading, selectIsLoading} from "../../redux/loaderSlice";
import {apiRequest} from "../../api/request";
import {auth, selectAuth, setUserInfo} from "../../redux/outstaffingSlice";
import {setRole} from "../../redux/roleSlice";
import {useDispatch, useSelector} from "react-redux";
import React, { useEffect, useRef, useState } from "react";
import { loading, selectIsLoading } from "../../redux/loaderSlice";
import { apiRequest } from "../../api/request";
import { auth, selectAuth, setUserInfo } from "../../redux/outstaffingSlice";
import { setRole } from "../../redux/roleSlice";
import { useDispatch, useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import SideBar from "../../components/SideBar/SideBar";
import CategoriesItem from "../../components/CategoriesItem/CategoriesItem"
import StepsForCandidate from "../../components/StepsForCandidate/StepsForCandidate"
import {Footer} from "../../components/Footer/Footer";
import CategoriesItem from "../../components/CategoriesItem/CategoriesItem";
import StepsForCandidate from "../../components/StepsForCandidate/StepsForCandidate";
import { Footer } from "../../components/Footer/Footer";
import BackEndImg from "../../pages/PartnerСategories/images/personalBackEnd.png"
import FrontendImg from "../../pages/PartnerСategories/images/PersonalFrontend.png"
import ArchitectureImg from "../../pages/PartnerСategories/images/PersonalArchitecture.png"
import DesignImg from "../../pages/PartnerСategories/images/PersonalDesign.png"
import TestImg from "../../pages/PartnerСategories/images/PersonalTesters.png"
import AdminImg from "../../pages/PartnerСategories/images/PersonalAdmin.png"
import ManageImg from "../../pages/PartnerСategories/images/PersonalMng.png"
import CopyImg from "../../pages/PartnerСategories/images/PersonalCopy.png"
import SmmImg from "../../pages/PartnerСategories/images/PersonalSMM.png"
import BackEndImg from "../../pages/PartnerСategories/images/personalBackEnd.png";
import FrontendImg from "../../pages/PartnerСategories/images/PersonalFrontend.png";
import ArchitectureImg from "../../pages/PartnerСategories/images/PersonalArchitecture.png";
import DesignImg from "../../pages/PartnerСategories/images/PersonalDesign.png";
import TestImg from "../../pages/PartnerСategories/images/PersonalTesters.png";
import AdminImg from "../../pages/PartnerСategories/images/PersonalAdmin.png";
import ManageImg from "../../pages/PartnerСategories/images/PersonalMng.png";
import CopyImg from "../../pages/PartnerСategories/images/PersonalCopy.png";
import SmmImg from "../../pages/PartnerСategories/images/PersonalSMM.png";
import authImg from "../../images/authCandidateFormImg.png"
import arrowBtn from "../../images/arrowRight.png";
import authImg from "../../images/authCandidateFormImg.png";
import arrowBtn from "../../images/arrowRight.svg";
import './authForCandidate.scss';
import "./authForCandidate.scss";
export const AuthForCandidate = () => {
const isLoading = useSelector(selectIsLoading);
const ref = useRef();
const dispatch = useDispatch();
const isAuth = useSelector(selectAuth);
let navigate = useNavigate();
const getToken = localStorage.getItem("auth_token");
const isLoading = useSelector(selectIsLoading);
const ref = useRef();
const dispatch = useDispatch();
const isAuth = useSelector(selectAuth);
let navigate = useNavigate();
const getToken = localStorage.getItem("auth_token");
const [personalInfoItems] = useState([
{
title: "Backend разработчики",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: BackEndImg,
},
{
title: "Frontend разработчики",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: FrontendImg,
},
{
title: "Архитектура проектов",
link: "/registration-candidate",
description: "Потоки данных ER ERP CRM CQRS UML BPMN",
available: true,
img: ArchitectureImg,
},
{
title: "Дизайн проектов",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: DesignImg,
},
{
title: "Тестирование проектов",
link: "/registration-candidate",
description: "SQL Postman TestRail Kibana Ручное тестирование",
available: false,
img: TestImg,
},
{
title: "Администрирование проектов",
link: "/registration-candidate",
description: "DevOps ELK Kubernetes Docker Bash Apache Oracle Git",
available: false,
img: AdminImg,
},
{
title: "Управление проектом",
link: "/registration-candidate",
description: "Scrum Kanban Agile Miro CustDev",
available: false,
img: ManageImg,
},
{
title: "Копирайтинг проектов",
link: "/registration-candidate",
description: "Теги Заголовок H1 Дескриптор Абзац Сценарий",
available: false,
img: CopyImg,
},
{
title: "Реклама и SMM",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: false,
img: SmmImg,
},
]);
const [personalInfoItems] = useState([
{
title: 'Backend разработчики',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: BackEndImg
},
{
title: 'Frontend разработчики',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: FrontendImg
},
{
title: 'Архитектура проектов',
link: '/registration-candidate',
description: 'Потоки данных ER ERP CRM CQRS UML BPMN',
available: true,
img: ArchitectureImg
},
{
title: 'Дизайн проектов',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: DesignImg
},
{
title: 'Тестирование проектов',
link: '/registration-candidate',
description: 'SQL Postman TestRail Kibana Ручное тестирование',
available: false,
img: TestImg
},
{
title: 'Администрирование проектов',
link: '/registration-candidate',
description: 'DevOps ELK Kubernetes Docker Bash Apache Oracle Git',
available: false,
img: AdminImg
},
{
title: 'Управление проектом',
link: '/registration-candidate',
description: 'Scrum Kanban Agile Miro CustDev',
available: false,
img: ManageImg
},
{
title: 'Копирайтинг проектов',
link: '/registration-candidate',
description: 'Теги Заголовок H1 Дескриптор Абзац Сценарий',
available: false,
img: CopyImg
},
{
title: 'Реклама и SMM',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: false,
img: SmmImg
},
]);
useEffect(() => {
if (isAuth || getToken) {
navigate("/profile");
}
}, [getToken]);
useEffect(() => {
if (isAuth || getToken) {
navigate("/profile");
const submitHandler = () => {
let formData = new FormData(ref.current);
if (!isLoading) {
dispatch(loading(true));
apiRequest("/user/login", {
method: "POST",
data: formData,
}).then((res) => {
if (!res.access_token) {
dispatch(loading(false));
} else {
localStorage.setItem("auth_token", res.access_token);
localStorage.setItem("id", res.id);
localStorage.setItem("cardId", res.card_id);
localStorage.setItem("role_status", res.status);
localStorage.setItem(
"access_token_expired_at",
res.access_token_expired_at
);
dispatch(auth(true));
dispatch(setUserInfo(res));
dispatch(loading(false));
dispatch(setRole("ROLE_PARTNER"));
}
}, [getToken]);
});
}
};
const submitHandler = () => {
let formData = new FormData(ref.current);
if (!isLoading) {
dispatch(loading(true));
apiRequest("/user/login", {
method: "POST",
data: formData,
}).then((res) => {
if (!res.access_token) {
dispatch(loading(false));
} else {
localStorage.setItem("auth_token", res.access_token);
localStorage.setItem("id", res.id);
localStorage.setItem("cardId", res.card_id);
localStorage.setItem("role_status", res.status);
localStorage.setItem(
"access_token_expired_at",
res.access_token_expired_at
);
dispatch(auth(true));
dispatch(setUserInfo(res));
dispatch(loading(false));
dispatch(setRole("ROLE_PARTNER"));
}
});
}
};
return (
<div className="auth-candidate">
<AuthHeader />
<div className="container">
<div className="auth__wrapper">
<div className="auth__info">
<h3>Войти, уже есть доступ</h3>
<img src={authImg} alt="img" />
<p>
если вы получили доступ пройдя 2 шага для входа или хотите узнать
свои результаты в кабинете
</p>
</div>
<form ref={ref} className="auth__form">
<label htmlFor="login">Ваш email *</label>
<input id="login" type="text" name="username" placeholder="Email" />
return(
<div className='auth-candidate'>
<AuthHeader />
<div className='container'>
<div className='auth__wrapper'>
<div className='auth__info'>
<h3>Войти, уже есть доступ</h3>
<img src={authImg} alt='img' />
<p>если вы получили доступ пройдя 2 шага для входа или хотите узнать свои результаты в кабинете</p>
</div>
<form ref={ref} className='auth__form'>
<label htmlFor="login">Ваш email *</label>
<input id="login" type="text" name="username" placeholder="Email" />
<label htmlFor="password">Ваш пароль*</label>
<input
id="password"
type="password"
name="password"
placeholder="Пароль"
/>
<button
onClick={(e) => {
e.preventDefault();
submitHandler();
}}
>Войти</button>
</form>
</div>
<div className='auth-candidate__start'>
<h2 className="auth-candidate__start__title">Хочу в команду <span>Айти специалистов</span></h2>
<div className="change-mode__arrow">
<img src={arrowBtn}></img>
</div>
<p className="auth-candidate__start__description">Для нас не имеет значение Ваша локация.</p>
<div className='auth-candidate__start__categoriesWrapper'>
<StepsForCandidate step="шаг 1 - выбери специализацтию" />
{personalInfoItems.map((item, index) => {
return <CategoriesItem link={item.link} key={index} title={item.title} img={item.img} skills={item.description} available={item.available} />
})
}
</div>
</div>
</div>
<SideBar />
<Footer/>
<label htmlFor="password">Ваш пароль*</label>
<input
id="password"
type="password"
name="password"
placeholder="Пароль"
/>
<button
onClick={(e) => {
e.preventDefault();
submitHandler();
}}
>
Войти
</button>
</form>
</div>
)
<div className="auth-candidate__start">
<h2 className="auth-candidate__start__title">
Хочу в команду <span>Айти специалистов</span>
</h2>
<div className="change-mode__arrow">
<img src={arrowBtn} alt="#"></img>
</div>
<p className="auth-candidate__start__description">
Для нас не имеет значение Ваша локация.
</p>
<div className="auth-candidate__start__categoriesWrapper">
<StepsForCandidate step="шаг 1 - выбери специализацтию" />
{personalInfoItems.map((item, index) => {
return (
<CategoriesItem
link={item.link}
key={index}
title={item.title}
img={item.img}
skills={item.description}
available={item.available}
/>
);
})}
</div>
</div>
</div>
<SideBar />
<Footer />
</div>
);
};

28
src/pages/AuthForDevelopers/AuthForDevelopers.jsx
View File

@ -1,24 +1,22 @@
import React, { useEffect, useState } from "react";
import { AuthBox } from "../../components/AuthBox/AuthBox";
import React, { useEffect } from "react";
import { useSelector } from "react-redux";
import arrow from "../../images/arrow__login_page.png";
import medium from "../../images/medium_male_big.png";
import cross from "../../images/cross.png";
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 { 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";
import SliderWorkers from "../../components/SliderWorkers/SliderWorkers";
import { AuthBox } from "../../components/AuthBox/AuthBox";
import { selectAuth } from "../../redux/outstaffingSlice";
import { Link, useNavigate } from "react-router-dom";
import { scrollToForm } from "../../helper";
import arrow from "../../images/arrow__login_page.png";
import medium from "../../images/medium_male_big.png";
import cross from "../../images/cross.png";
import text from "../../images/Body_Text.png";
import arrowBtn from "../../images/arrowRight.svg";
import vector from "../../images/Vector_Smart_Object.png";
import vectorBlack from "../../images/Vector_Smart_Object_black.png";
import "./authForDevelopers.scss";

25
src/pages/AuthForPartners/AuthForPartners.js
View File

@ -1,16 +1,4 @@
import React, { useEffect } from "react";
import arrow from "../../images/arrow__login_page.png";
import authImg from "../../images/auth_img.png";
import cross from "../../images/cross.png";
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";
@ -18,6 +6,19 @@ import SideBar from "../../components/SideBar/SideBar";
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import SliderWorkers from "../../components/SliderWorkers/SliderWorkers";
import { useSelector } from "react-redux";
import { selectAuth } from "../../redux/outstaffingSlice";
import { Link, useNavigate } from "react-router-dom";
import { scrollToForm } from "../../helper";
import arrow from "../../images/arrow__login_page.png";
import authImg from "../../images/auth_img.png";
import cross from "../../images/cross.png";
import text from "../../images/Body_Text.png";
import arrowBtn from "../../images/arrowRight.svg";
import vector from "../../images/Vector_Smart_Object.png";
import vectorBlack from "../../images/Vector_Smart_Object_black.png";
import "./authForPartners.scss";
const AuthForPartners = () => {

22
src/pages/FrequentlyAskedQuestion/FrequentlyAskedQuestion.jsx
View File

@ -1,19 +1,18 @@
import { useEffect, useState } from "react";
import { useNavigate, useParams } from "react-router";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import SideBar from "../../components/SideBar/SideBar";
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import { Footer } from "../../components/Footer/Footer";
import arrowBtn from "../../images/arrowRight.png";
import arrowBtn from "../../images/arrowRight.svg";
import "./FrequentlyAskedQuestion.scss";
import { useEffect, useState } from "react";
import {
FREQUENTLY_ASKED_QUESTIONS_ROUTE,
FREQUENTLY_ASKED_QUESTION_ROUTE,
} from "../../constants/router-path";
export const FrequentlyAskedQuestion = () => {
const params = useParams();
const navigate = useNavigate()
const navigate = useNavigate();
const [question, setQuestion] = useState({
id: params.id,
title: "Это фриланс-платформа?",
@ -35,16 +34,19 @@ export const FrequentlyAskedQuestion = () => {
{ name: "Главная", link: "/auth" },
{
name: "FAQ (часто задаваемые вопросы)",
link: FREQUENTLY_ASKED_QUESTIONS_ROUTE,
link: "/frequently-asked-questions",
},
{
name: question.title,
link: FREQUENTLY_ASKED_QUESTION_ROUTE + "/" + params.id,
link: `/frequently-asked-question/${params.id}`,
},
]}
/>
<div className="frequently-asked-question__title">{question.title}</div>
<div className="frequently-asked-question__back" onClick={()=>navigate(-1)}>
<div
className="frequently-asked-question__back"
onClick={() => navigate(-1)}
>
<div className="frequently-asked-question__arrow">
<img src={arrowBtn}></img>
</div>

79
src/pages/FrequentlyAskedQuestions/FrequentlyAskedQuestions.jsx
View File

@ -1,78 +1,83 @@
import React from "react";
import "./FrequentlyAskedQuestions.scss";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
import { FrequentlyAskedQuestionsItem } from "../../components/FrequentlyAskedQuestionsItem/FrequentlyAskedQuestionsItem";
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import SideBar from "../../components/SideBar/SideBar";
import arrow from "./../../images/faq/arrow.svg";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
import { FREQUENTLY_ASKED_QUESTIONS_ROUTE } from "../../constants/router-path";
import { FrequentlyAskedQuestionsItem } from "../../components/FrequentlyAskedQuestionsItem/FrequentlyAskedQuestionsItem";
import "./FrequentlyAskedQuestions.scss";
export const FrequentlyAskedQuestions = () => {
const rubrics = [
{
title: 'Общие вопросы ',
title: "Общие вопросы ",
questions: [
{
id: 1,
title: 'Это фриланс-платформа?'
title: "Это фриланс-платформа?",
},
{
id: 2,
title: 'Чем вы отличаетесь от традиционного процесса выбора исполнителя?'
title:
"Чем вы отличаетесь от традиционного процесса выбора исполнителя?",
},
{
id: 3,
title: 'Это фриланс-платформа?'
title: "Это фриланс-платформа?",
},
{
id: 4,
title: 'Чем вы отличаетесь от традиционного процесса выбора исполнителя?'
}
]
title:
"Чем вы отличаетесь от традиционного процесса выбора исполнителя?",
},
],
},
{
title: 'Поиск специалиста',
title: "Поиск специалиста",
questions: [
{
id: 11,
title: 'Это фриланс-платформа?'
title: "Это фриланс-платформа?",
},
{
id: 22,
title: 'Чем вы отличаетесь от традиционного процесса выбора исполнителя?'
title:
"Чем вы отличаетесь от традиционного процесса выбора исполнителя?",
},
{
id: 33,
title: 'Это фриланс-платформа?'
title: "Это фриланс-платформа?",
},
{
id: 44,
title: 'Чем вы отличаетесь от традиционного процесса выбора исполнителя?'
}
]
title:
"Чем вы отличаетесь от традиционного процесса выбора исполнителя?",
},
],
},
{
title: 'Бронирование специалиста',
title: "Бронирование специалиста",
questions: [
{
id: 11,
title: 'Это фриланс-платформа?'
}
]
title: "Это фриланс-платформа?",
},
],
},
{
title: 'Работа с выбранным специалистом',
title: "Работа с выбранным специалистом",
questions: [
{
id: 11,
title: 'Чем вы отличаетесь от традиционного процесса выбора исполнителя?'
}
]
title:
"Чем вы отличаетесь от традиционного процесса выбора исполнителя?",
},
],
},
]
];
return (
<div className="frequently-asked-questions">
@ -83,7 +88,10 @@ export const FrequentlyAskedQuestions = () => {
<ProfileBreadcrumbs
links={[
{ name: "Главная", link: "/auth" },
{ name: "FAQ (часто задаваемые вопросы)", link: FREQUENTLY_ASKED_QUESTIONS_ROUTE },
{
name: "FAQ (часто задаваемые вопросы)",
link: "/frequently-asked-questions",
},
]}
/>
<div className="frequently-asked-questions__about">
@ -98,13 +106,12 @@ export const FrequentlyAskedQuestions = () => {
</div>
</div>
<div className="frequently-asked-questions__items">
{
rubrics.map((rubric,index)=><FrequentlyAskedQuestionsItem rubric={rubric} key={index} />)
}
</div>
{rubrics.map((rubric, index) => (
<FrequentlyAskedQuestionsItem rubric={rubric} key={index} />
))}
</div>
</div>
<Footer />
<Footer />
</div>
);
};

145
src/pages/PartnerEmployees/PartnerEmployees.js
View File

@ -1,74 +1,85 @@
import React from 'react';
import {Link, Navigate} from "react-router-dom";
import {useSelector} from "react-redux";
import {getPartnerEmployees} from "../../redux/outstaffingSlice";
import React from "react";
import { Link, Navigate } from "react-router-dom";
import { useSelector } from "react-redux";
import { getPartnerEmployees } from "../../redux/outstaffingSlice";
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
import {Footer} from "../../components/Footer/Footer";
import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
import imgInfo from "./emplInfo.png"
import rightArrow from "../../images/arrowRight.png"
import imgInfo from "./emplInfo.png";
import rightArrow from "../../images/arrowRight.svg";
import "./partnerEmployees.scss"
import "./partnerEmployees.scss";
export const PartnerEmployees = () => {
const partnerEmployees = useSelector(getPartnerEmployees);
if(localStorage.getItem('role_status') !== '18' || !partnerEmployees.length) {
return <Navigate to="/profile/categories" replace/>
}
return(
<div className="partnerEmployees">
<ProfileHeader />
<div className="container">
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные моего персонала', link: '/profile/categories'},
{name: 'Backend разработчики', link: '/profile/categories/employees'},
]}
/>
<h2 className="partnerEmployees__title">Backend разработчики</h2>
<div className="partnerEmployees__items">
{partnerEmployees.map((person) => {
return <div className="partnerEmployees__item" key={person.id}>
<div className="partnerEmployees__item__name">
<img src={person.personAvatar} alt="avatar" />
<h4>{person.name}</h4>
</div>
<div className="partnerEmployees__item__info">
<div className="partnerEmployees__item__info__qualification">
<h5>{person.qualification}</h5>
<span>{person.level}</span>
<div className="info_summary">
<img src={imgInfo} alt="img" />
<p>Данные и резюме</p>
<Link to='/candidate/26' className="arrow">
<img src={rightArrow} alt="arrow" />
</Link>
</div>
</div>
<div className="partnerEmployees__item__info__project">
<span className="name">Проект:</span>
<h5>{person.project}</h5>
<div className="partnerEmployees__item__info__project__details">
<div className="details__item">
<p>Открытые задачи</p>
<span className="count">{person.tasks_in_progress}</span>
</div>
<div className="details__item">
<p>Отработанных часов в <span>марте</span></p>
<span className="count">{person.month_hours}</span>
</div>
</div>
</div>
</div>
</div>
})
}
const partnerEmployees = useSelector(getPartnerEmployees);
if (
localStorage.getItem("role_status") !== "18" ||
!partnerEmployees.length
) {
return <Navigate to="/profile/categories" replace />;
}
return (
<div className="partnerEmployees">
<ProfileHeader />
<div className="container">
<ProfileBreadcrumbs
links={[
{ name: "Главная", link: "/profile" },
{ name: "Данные моего персонала", link: "/profile/categories" },
{
name: "Backend разработчики",
link: "/profile/categories/employees",
},
]}
/>
<h2 className="partnerEmployees__title">Backend разработчики</h2>
<div className="partnerEmployees__items">
{partnerEmployees.map((person) => {
return (
<div className="partnerEmployees__item" key={person.id}>
<div className="partnerEmployees__item__name">
<img src={person.personAvatar} alt="avatar" />
<h4>{person.name}</h4>
</div>
</div>
<Footer/>
<div className="partnerEmployees__item__info">
<div className="partnerEmployees__item__info__qualification">
<h5>{person.qualification}</h5>
<span>{person.level}</span>
<div className="info_summary">
<img src={imgInfo} alt="img" />
<p>Данные и резюме</p>
<Link to="/candidate/26" className="arrow">
<img src={rightArrow} alt="arrow" />
</Link>
</div>
</div>
<div className="partnerEmployees__item__info__project">
<span className="name">Проект:</span>
<h5>{person.project}</h5>
<div className="partnerEmployees__item__info__project__details">
<div className="details__item">
<p>Открытые задачи</p>
<span className="count">
{person.tasks_in_progress}
</span>
</div>
<div className="details__item">
<p>
Отработанных часов в <span>марте</span>
</p>
<span className="count">{person.month_hours}</span>
</div>
</div>
</div>
</div>
</div>
);
})}
</div>
)
}
</div>
<Footer />
</div>
);
};

335
src/pages/PartnerСategories/PartnerСategories.js
View File

@ -1,171 +1,186 @@
import React, {useState} from 'react';
import {Link} from "react-router-dom";
import {Navigate} from "react-router-dom";
import {useDispatch} from "react-redux";
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { Navigate } from "react-router-dom";
import { useDispatch } from "react-redux";
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
import {Footer} from "../../components/Footer/Footer";
import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
import {setPartnerEmployees} from "../../redux/outstaffingSlice";
import { setPartnerEmployees } from "../../redux/outstaffingSlice";
import BackEndImg from "./images/personalBackEnd.png"
import FrontendImg from "./images/PersonalFrontend.png"
import ArchitectureImg from "./images/PersonalArchitecture.png"
import DesignImg from "./images/PersonalDesign.png"
import TestImg from "./images/PersonalTesters.png"
import AdminImg from "./images/PersonalAdmin.png"
import ManageImg from "./images/PersonalMng.png"
import CopyImg from "./images/PersonalCopy.png"
import SmmImg from "./images/PersonalSMM.png"
import rightArrow from "../../images/arrowRight.png"
import BackEndImg from "./images/personalBackEnd.png";
import FrontendImg from "./images/PersonalFrontend.png";
import ArchitectureImg from "./images/PersonalArchitecture.png";
import DesignImg from "./images/PersonalDesign.png";
import TestImg from "./images/PersonalTesters.png";
import AdminImg from "./images/PersonalAdmin.png";
import ManageImg from "./images/PersonalMng.png";
import CopyImg from "./images/PersonalCopy.png";
import SmmImg from "./images/PersonalSMM.png";
import rightArrow from "../../images/arrowRight.svg";
import avatarImg from "../PartnerEmployees/avatarMok.png";
import "./partnerСategories.scss"
import { Navigation } from '../../components/Navigation/Navigation';
import "./partnerСategories.scss";
import { Navigation } from "../../components/Navigation/Navigation";
export const PartnerCategories = () => {
const dispatch = useDispatch();
if(localStorage.getItem('role_status') !== '18') {
return <Navigate to="/profile" replace/>
}
const dispatch = useDispatch();
if (localStorage.getItem("role_status") !== "18") {
return <Navigate to="/profile" replace />;
}
const [personalInfoItems] = useState([
{
title: 'Backend разработчики',
link: '/profile/categories/employees',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: BackEndImg
},
{
title: 'Frontend разработчики',
link: '/profile/categories/employees',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: FrontendImg
},
{
title: 'Архитектура проектов',
link: '/profile/categories/employees',
description: 'Потоки данных ER ERP CRM CQRS UML BPMN',
available: true,
img: ArchitectureImg
},
{
title: 'Дизайн проектов',
link: '/profile/categories/employees',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: true,
img: DesignImg
},
{
title: 'Тестирование проектов',
link: '/profile/add-request',
description: 'SQL Postman TestRail Kibana Ручное тестирование',
available: false,
img: TestImg
},
{
title: 'Администрирование проектов',
link: '/profile/add-request',
description: 'DevOps ELK Kubernetes Docker Bash Apache Oracle Git',
available: false,
img: AdminImg
},
{
title: 'Управление проектом',
link: '/profile/add-request',
description: 'Scrum Kanban Agile Miro CustDev',
available: false,
img: ManageImg
},
{
title: 'Копирайтинг проектов',
link: '/profile/add-request',
description: 'Теги Заголовок H1 Дескриптор Абзац Сценарий',
available: false,
img: CopyImg
},
{
title: 'Реклама и SMM',
link: '/profile/add-request',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
available: false,
img: SmmImg
},
])
const [personalInfoItems] = useState([
{
title: "Backend разработчики",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: BackEndImg,
},
{
title: "Frontend разработчики",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: FrontendImg,
},
{
title: "Архитектура проектов",
link: "/profile/categories/employees",
description: "Потоки данных ER ERP CRM CQRS UML BPMN",
available: true,
img: ArchitectureImg,
},
{
title: "Дизайн проектов",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: DesignImg,
},
{
title: "Тестирование проектов",
link: "/profile/add-request",
description: "SQL Postman TestRail Kibana Ручное тестирование",
available: false,
img: TestImg,
},
{
title: "Администрирование проектов",
link: "/profile/add-request",
description: "DevOps ELK Kubernetes Docker Bash Apache Oracle Git",
available: false,
img: AdminImg,
},
{
title: "Управление проектом",
link: "/profile/add-request",
description: "Scrum Kanban Agile Miro CustDev",
available: false,
img: ManageImg,
},
{
title: "Копирайтинг проектов",
link: "/profile/add-request",
description: "Теги Заголовок H1 Дескриптор Абзац Сценарий",
available: false,
img: CopyImg,
},
{
title: "Реклама и SMM",
link: "/profile/add-request",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: false,
img: SmmImg,
},
]);
const [mokPersons] = useState([
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 1
},
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 2
},
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 3
},
])
return (
<div className="partnerCategories">
<ProfileHeader />
<Navigation />
<div className="container">
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные моего персонала', link: '/profile/categories'},
]}
/>
<h2 className="partnerCategories__title">Данные персонала</h2>
<div className="partnerCategories__items">
{personalInfoItems.map((item, index) => {
return <Link to={item.link} key={index} className={item.available ? "partnerCategories__item item" : "partnerCategories__item item item__disable"}
onClick={() => {
dispatch(setPartnerEmployees(mokPersons))
}}>
<div className="item__title">
<img src={item.img} alt={item.title} />
<h4>{item.title}</h4>
</div>
<div className="item__info">
<p>{item.description}</p>
<div className='more'>
<img src={rightArrow} alt="arrow" />
</div>
</div>
{!item.available &&
<div className="item__disableHover">
<p>У вас нет персонала из категории</p>
<button>Подобрать</button>
</div>
}
</Link>
})}
const [mokPersons] = useState([
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 1,
},
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 2,
},
{
personAvatar: avatarImg,
name: "Макаренко Дмитрий",
qualification: "PHP Backend - разработчик",
level: "Middle",
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 3,
},
]);
return (
<div className="partnerCategories">
<ProfileHeader />
<Navigation />
<div className="container">
<ProfileBreadcrumbs
links={[
{ name: "Главная", link: "/profile" },
{ name: "Данные моего персонала", link: "/profile/categories" },
]}
/>
<h2 className="partnerCategories__title">Данные персонала</h2>
<div className="partnerCategories__items">
{personalInfoItems.map((item, index) => {
return (
<Link
to={item.link}
key={index}
className={
item.available
? "partnerCategories__item item"
: "partnerCategories__item item item__disable"
}
onClick={() => {
dispatch(setPartnerEmployees(mokPersons));
}}
>
<div className="item__title">
<img src={item.img} alt={item.title} />
<h4>{item.title}</h4>
</div>
</div>
<Footer/>
<div className="item__info">
<p>{item.description}</p>
<div className="more">
<img src={rightArrow} alt="arrow" />
</div>
</div>
{!item.available && (
<div className="item__disableHover">
<p>У вас нет персонала из категории</p>
<button>Подобрать</button>
</div>
)}
</Link>
);
})}
</div>
)
}
</div>
<Footer />
</div>
);
};

132
src/pages/RegistrationForCandidate/RegistrationForCandidate.js
View File

@ -1,72 +1,78 @@
import React from 'react';
import React from "react";
import AuthHeader from "../../components/AuthHeader/AuthHeader";
import SideBar from "../../components/SideBar/SideBar";
import StepsForCandidate from "../../components/StepsForCandidate/StepsForCandidate"
import {Footer} from "../../components/Footer/Footer";
import StepsForCandidate from "../../components/StepsForCandidate/StepsForCandidate";
import { Footer } from "../../components/Footer/Footer";
import BackEndImg from "../../pages/PartnerСategories/images/personalBackEnd.png"
import arrowBtn from "../../images/arrowRight.png";
import BackEndImg from "../../pages/PartnerСategories/images/personalBackEnd.png";
import arrowBtn from "../../images/arrowRight.svg";
import './registationForCandidate.scss'
import "./registationForCandidate.scss";
export const RegistrationForCandidate = () => {
return(
<div className='registrationCandidate'>
<AuthHeader/>
<div className='container'>
<div className='registrationCandidate__start'>
<h2 className="auth-candidate__start__title">Хочу в команду <span>Айти специалистов</span></h2>
<div className="change-mode__arrow">
<img src={arrowBtn}></img>
</div>
<p className="auth-candidate__start__description">Для нас не имеет значение Ваша локация.</p>
<StepsForCandidate step="шаг 2 - заполните данные" />
<div className='registrationCandidate__formWrapper'>
<div className='registrationCandidate__info'>
<div className='registrationCandidate__info__category'>
<img src={BackEndImg} alt='img' />
<p>Backend разработчики</p>
</div>
<p className='registrationCandidate__info__skills'>Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript</p>
<div className='registrationCandidate__info__arrow'>
<img src={arrowBtn} alt='img' />
</div>
</div>
<form className='registrationCandidate__form'>
<div className='registrationCandidate__form__input'>
<label htmlFor="name">Ваше имя *</label>
<input id="name" type="text" placeholder="Имя" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="summary">Если есть ссылка на резюме</label>
<input id="summary" type="text" placeholder="Резюме" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="email">Ваш email *</label>
<input id="email" type="text" placeholder="Email" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="tg">Ваш телеграм*</label>
<input id="tg" type="text" placeholder="Телеграм" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="password">Придумайте пароль*</label>
<input id="password" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__input'>
<label htmlFor="secondPassword">Повторите пароль*</label>
<input id="secondPassword" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__submit'>
<button>Отправить</button>
</div>
</form>
</div>
</div>
return (
<div className="registrationCandidate">
<AuthHeader />
<div className="container">
<div className="registrationCandidate__start">
<h2 className="auth-candidate__start__title">
Хочу в команду <span>Айти специалистов</span>
</h2>
<div className="change-mode__arrow">
<img src={arrowBtn}></img>
</div>
<p className="auth-candidate__start__description">
Для нас не имеет значение Ваша локация.
</p>
<StepsForCandidate step="шаг 2 - заполните данные" />
<div className="registrationCandidate__formWrapper">
<div className="registrationCandidate__info">
<div className="registrationCandidate__info__category">
<img src={BackEndImg} alt="img" />
<p>Backend разработчики</p>
</div>
<p className="registrationCandidate__info__skills">
Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript
</p>
<div className="registrationCandidate__info__arrow">
<img src={arrowBtn} alt="img" />
</div>
</div>
<SideBar/>
<Footer/>
<form className="registrationCandidate__form">
<div className="registrationCandidate__form__input">
<label htmlFor="name">Ваше имя *</label>
<input id="name" type="text" placeholder="Имя" />
</div>
<div className="registrationCandidate__form__input">
<label htmlFor="summary">Если есть ссылка на резюме</label>
<input id="summary" type="text" placeholder="Резюме" />
</div>
<div className="registrationCandidate__form__input">
<label htmlFor="email">Ваш email *</label>
<input id="email" type="text" placeholder="Email" />
</div>
<div className="registrationCandidate__form__input">
<label htmlFor="tg">Ваш телеграм*</label>
<input id="tg" type="text" placeholder="Телеграм" />
</div>
<div className="registrationCandidate__form__input">
<label htmlFor="password">Придумайте пароль*</label>
<input id="password" type="text" placeholder="Пароль" />
</div>
<div className="registrationCandidate__form__input">
<label htmlFor="secondPassword">Повторите пароль*</label>
<input id="secondPassword" type="text" placeholder="Пароль" />
</div>
<div className="registrationCandidate__form__submit">
<button>Отправить</button>
</div>
</form>
</div>
</div>
)
}
</div>
<SideBar />
<Footer />
</div>
);
};

206
src/pages/Summary/Summary.js
View File

@ -1,122 +1,152 @@
import React, {useEffect, useState} from 'react';
import {useSelector} from "react-redux";
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
import {getProfileInfo} from "../../redux/outstaffingSlice";
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
import {Footer} from '../../components/Footer/Footer'
import { urlForLocal} from "../../helper";
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { Navigate } from "react-router-dom";
import { ProfileHeader } from "../../components/ProfileHeader/ProfileHeader";
import { getProfileInfo } from "../../redux/outstaffingSlice";
import { ProfileBreadcrumbs } from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../../components/Footer/Footer";
import { urlForLocal } from "../../helper";
import { apiRequest } from "../../api/request";
import { Navigation } from "../../components/Navigation/Navigation";
import arrow from "../../images/right-arrow.png";
import rightArrow from "../../images/arrowRight.png"
import gitImgItem from "../../images/gitItemImg.png"
import rightArrow from "../../images/arrowRight.svg";
import gitImgItem from "../../images/gitItemImg.svg";
import {apiRequest} from "../../api/request";
import {Navigate} from "react-router-dom";
import { Navigation } from '../../components/Navigation/Navigation';
import './summary.scss'
import "./summary.scss";
export const Summary = () => {
if(localStorage.getItem('role_status') === '18') {
return <Navigate to="/profile" replace/>
}
if (localStorage.getItem("role_status") === "18") {
return <Navigate to="/profile" replace />;
}
const profileInfo = useSelector(getProfileInfo);
const [openGit, setOpenGit] = useState(false);
const [gitInfo, setGitInfo] = useState([]);
useEffect(() => {
apiRequest(`/profile/portfolio-projects?card_id=${localStorage.getItem('cardId')}`)
.then(responseGit => setGitInfo(responseGit))
apiRequest(
`/profile/portfolio-projects?card_id=${localStorage.getItem("cardId")}`
).then((responseGit) => setGitInfo(responseGit));
}, []);
return (
<div className='summary'>
<ProfileHeader/>
<Navigation />
<div className='container'>
<div className='summary__content'>
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные и резюме', link: '/profile/summary'}
]}
/>
<h2 className='summary__title'>Ваше резюме {openGit && <span>- Git</span>}</h2>
{openGit && <div className='summary__back' onClick={() => setOpenGit(false)}>
<img src={arrow} alt='arrow'/>
<div className="summary">
<ProfileHeader />
<Navigation />
<div className="container">
<div className="summary__content">
<ProfileBreadcrumbs
links={[
{ name: "Главная", link: "/profile" },
{ name: "Данные и резюме", link: "/profile/summary" },
]}
/>
<h2 className="summary__title">
Ваше резюме {openGit && <span>- Git</span>}
</h2>
{openGit && (
<div className="summary__back" onClick={() => setOpenGit(false)}>
<img src={arrow} alt="arrow" />
<p>Вернуться</p>
</div>}
<div className={openGit ? 'summary__info openGit' : 'summary__info'}>
<div className='summary__person'>
<img src={urlForLocal(profileInfo.photo)} className='summary__avatar' alt='avatar'/>
<p className='summary__name'>{profileInfo.fio}, {profileInfo.specification} разработчик</p>
</div>
{!openGit &&
<button className='summary__git' onClick={() => setOpenGit(true)}>Git</button>
}
</div>
)}
<div className={openGit ? "summary__info openGit" : "summary__info"}>
<div className="summary__person">
<img
src={urlForLocal(profileInfo.photo)}
className="summary__avatar"
alt="avatar"
/>
<p className="summary__name">
{profileInfo.fio}, {profileInfo.specification} разработчик
</p>
</div>
{!openGit && (
<button className="summary__git" onClick={() => setOpenGit(true)}>
Git
</button>
)}
</div>
{!openGit &&
<div className='summary__skills skills__section'>
<div className='summary__sections__head'>
</div>
{!openGit && (
<div className="summary__skills skills__section">
<div className="summary__sections__head">
<h3>Основной стек</h3>
<button>Редактировать раздел</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 && ','}
<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>
</div>
</div>
}
{profileInfo.vc_text && !openGit &&
<div className='summary__experience'>
<div className='experience__block'>
)}
{profileInfo.vc_text && !openGit && (
<div className="summary__experience">
<div className="experience__block">
<div className="summary__sections__head">
<h3>Описание опыта работы</h3>
<button>Редактировать раздел</button>
</div>
<div className="experience__content" dangerouslySetInnerHTML={{__html:profileInfo.vc_text}}>
<h3>Описание опыта работы</h3>
<button>Редактировать раздел</button>
</div>
<div
className="experience__content"
dangerouslySetInnerHTML={{ __html: profileInfo.vc_text }}
></div>
</div>
</div>
}
{openGit &&
<div className='summary__sectionGit'>
<div className='summary__sections__head'>
)}
{openGit && (
<div className="summary__sectionGit">
<div className="summary__sections__head">
<h3>Страница портфолио кода разработчика</h3>
<button>Редактировать раздел</button>
</div>
<div className='summary__sectionGitItems'>
{Boolean(gitInfo.length) && gitInfo.map((itemGit) => {
return <a href={itemGit.link} target="_blank" rel="noreferrer" key={itemGit.id} className='summary__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg'/>
<div className='gitItem__info__name'>
<h4>{itemGit.title}</h4>
<p>{itemGit.description}</p>
<div className="summary__sectionGitItems">
{Boolean(gitInfo.length) &&
gitInfo.map((itemGit) => {
return (
<a
href={itemGit.link}
target="_blank"
rel="noreferrer"
key={itemGit.id}
className="summary__sectionGitItem gitItem"
>
<div className="gitItem__info">
<div className="gitItem__info__about">
<img src={gitImgItem} alt="gitImg" />
<div className="gitItem__info__name">
<h4>{itemGit.title}</h4>
<p>{itemGit.description}</p>
</div>
</div>
<div className="gitItem__info__specification">
<span className="gitItem__lineSkill" />
<p>{itemGit.main_stack}</p>
</div>
</div>
</div>
<div className='gitItem__info__specification'>
<span className='gitItem__lineSkill'/>
<p>{itemGit.main_stack}</p>
</div>
</div>
<a className='gitItem__link' href={itemGit.link} target="_blank" rel="noreferrer">
<img src={rightArrow} alt='arrowRight'/>
</a>
</a>
})
}
<a
className="gitItem__link"
href={itemGit.link}
target="_blank"
rel="noreferrer"
>
<img src={rightArrow} alt="arrowRight" />
</a>
</a>
);
})}
</div>
</div>
}
</div>
<Footer/>
)}
</div>
)
<Footer />
</div>
);
};