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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
config/webpack/common.js
View File

@ -1,45 +1,44 @@
const paths = require('../paths');
const paths = require("../paths");
const webpack = require('webpack');
const webpack = require("webpack");
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const Dotenv = require('dotenv-webpack');
const CopyWebpackPlugin = require("copy-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const Dotenv = require("dotenv-webpack");
const plugins = [
'@babel/plugin-proposal-class-properties',
'@babel/plugin-syntax-dynamic-import',
'@babel/plugin-transform-runtime'
"@babel/plugin-proposal-class-properties",
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-transform-runtime",
];
if (process.env.NODE_ENV === 'development') {
plugins.push('react-refresh/babel');
if (process.env.NODE_ENV === "development") {
plugins.push("react-refresh/babel");
}
const babelLoader = {
loader: 'babel-loader',
loader: "babel-loader",
options: {
presets: [
// "react-app",
'@babel/preset-env',
'@babel/preset-react',
"@babel/preset-env",
"@babel/preset-react",
],
plugins: plugins
}
plugins: plugins,
},
};
module.exports = {
entry: `${paths.src}/index.js`,
output: {
path: paths.build,
filename: '[name].bundle.js',
publicPath: '/',
filename: "[name].bundle.js",
publicPath: "/",
// publicPath: 'https://itguild.info',
asyncChunks: true,
clean: true,
crossOriginLoading: 'anonymous',
crossOriginLoading: "anonymous",
module: true,
environment: {
arrowFunction: true,
@ -47,57 +46,56 @@ module.exports = {
const: true,
destructuring: true,
dynamicImport: false,
forOf: true
}
forOf: true,
},
},
resolve: {
alias: {
'@': `${paths.src}/modules`
"@": `${paths.src}/modules`,
},
extensions: ['.mjs', '.js', '.jsx', '.ts', '.tsx', '.json']
extensions: [".mjs", ".js", ".jsx", ".ts", ".tsx", ".json"],
},
experiments: {
topLevelAwait: true,
outputModule: true
outputModule: true,
},
module: {
rules: [
// JavaScript, React
{
test: /\.m?jsx?$/i,
exclude: /node_modules/,
use: babelLoader
use: babelLoader,
},
// TypeScript
{
test: /.tsx?$/i,
exclude: /node_modules/,
use: [babelLoader, 'ts-loader']
use: [babelLoader, "ts-loader"],
},
// CSS, SASS
{
test: /\.(c|sa|sc)ss$/i,
use: [
'style-loader',
"style-loader",
{
loader: 'css-loader',
options: {importLoaders: 1}
loader: "css-loader",
options: { importLoaders: 1 },
},
'sass-loader'
]
"sass-loader",
],
},
// MD
{
test: /\.md$/i,
use: ['html-loader', 'markdown-loader']
use: ["html-loader", "markdown-loader"],
},
// static files
{
test: /\.(jpe?g|png|gif|svg|eot|ttf|woff2|woff?)$/i,
type: 'asset/resource'
}
]
test: /\.(jpe?g|png|gif|webp|svg|eot|ttf|woff2|woff?)$/i,
type: "asset/resource",
},
],
},
plugins: [
new webpack.ProgressPlugin(),
@ -107,10 +105,10 @@ module.exports = {
{
from: `${paths.public}`,
globOptions: {
ignore: ["**/index.html"]
}
}
]
ignore: ["**/index.html"],
},
},
],
}),
new HtmlWebpackPlugin({
@ -119,11 +117,11 @@ module.exports = {
}),
new webpack.ProvidePlugin({
React: 'react'
React: "react",
}),
new Dotenv({
path: '.env'
})
]
path: ".env",
}),
],
};

0
src/components/Achievement/Achievement.js → src/components/Achievement/Achievement.jsx
View File

14
src/components/AuthBox/AuthBox.js → src/components/AuthBox/AuthBox.jsx
View File

@ -1,20 +1,18 @@
import React, { useEffect, useRef, useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { useNavigate } from "react-router-dom";
import { useDispatch, useSelector } from "react-redux";
import { Loader } from "../Loader/Loader";
import { auth, selectAuth, setUserInfo } from "../../redux/outstaffingSlice";
import { loading } from "../../redux/loaderSlice";
import { setRole } from "../../redux/roleSlice";
import { selectIsLoading } from "../../redux/loaderSlice";
import ModalErrorLogin from "../../components/UI/ModalErrorLogin/ModalErrorLogin";
import ModalRegistration from "../UI/ModalRegistration/ModalRegistration";
import ModalErrorLogin from "../UI/ModalErrorLogin/ModalErrorLogin";
import { Loader } from "../Loader/Loader";
import { apiRequest } from "../../api/request";
import ellipse from "../../images/ellipse.png";
import ModalRegistration from "../UI/ModalRegistration/ModalRegistration";
import "./authBox.scss";
@ -78,7 +76,7 @@ export const AuthBox = ({ title }) => {
Войти в <span>систему</span>
</h2>
<div className="auth-box__title">
<img src={ellipse} alt="" />
<img src={ellipse} alt="." />
<span>{title}</span>
</div>
<form ref={ref} className="auth-box__form">

2
src/components/AuthHeader/AuthHeader.js → src/components/AuthHeader/AuthHeader.jsx
View File

@ -2,7 +2,7 @@ import React from "react";
import { NavLink } from "react-router-dom";
import { scrollToForm } from "../../helper";
import userIcon from "../../images/userIcon.png";
import userIcon from "../../images/userIcon.svg";
import "./authHeader.scss";

2
src/components/AuthHeader/authHeader.scss
View File

@ -53,7 +53,7 @@
}
.candidate {
color: #1458DD;
color: #1458dd;
}
}
}

78
src/components/Calendar/Calendar.js
View File

@ -1,78 +0,0 @@
import React, {useEffect, useState} from 'react'
import {useSelector} from 'react-redux'
import {Link, Navigate, useNavigate} from 'react-router-dom'
import CalendarComponent from './CalendarComponent'
import {currentMonth} from './calendarHelper'
import {Footer} from '../Footer/Footer'
import {LogoutButton} from "../LogoutButton/LogoutButton";
import {selectCurrentCandidate} from '../../redux/outstaffingSlice'
import rectangle from '../../images/rectangle_secondPage.png'
import './calendar.scss'
import {urlForLocal} from "../../helper";
const Calendar = () => {
if(localStorage.getItem('role_status') !== '18') {
return <Navigate to="/profile" replace/>
}
const candidateForCalendar = useSelector(selectCurrentCandidate);
const [month, setMonth] = useState('');
const navigate = useNavigate();
useEffect(() => {
setMonth(currentMonth)
}, [month]);
const {name, skillsName, photo} = candidateForCalendar;
const abbreviatedName = name && name.substring(0, name.lastIndexOf(' '));
return (
<div className='container'>
<section className='calendar'>
<div className='row'>
<div className='calendar__header'>
<h2 className='calendar__profile'>
Добрый день, <span>Александр !</span>
</h2>
<LogoutButton />
</div>
<div className='col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row'>
<div className='calendar__info'>
{photo && <img className='calendar__info-img' src={urlForLocal(photo)} alt='img'/>}
<h3 className='calendar__info-name'>{abbreviatedName}</h3>
</div>
<div className='calendar__title'>
<h3 className='calendar__title-text'>{skillsName} разработчик</h3>
<img className='calendar__title-img' src={rectangle} alt='img'/>
</div>
<div>
<Link to='/report'>
<button className='calendar__btn'>Заполнить отчет за день</button>
</Link>
</div>
</div>
</div>
<div className='row'>
<div className='col-12 col-xl-12'>
<CalendarComponent onSelect={() => { navigate('/report/0') }}/>
<p className='calendar__hours'>
{month} : <span> 60 часов </span>
</p>
</div>
</div>
<Footer/>
</section>
</div>
)
};
export default Calendar

88
src/components/Calendar/Calendar.jsx Normal file
View File

@ -0,0 +1,88 @@
import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { Link, Navigate, useNavigate } from "react-router-dom";
import CalendarComponent from "./CalendarComponent";
import { currentMonth } from "./calendarHelper";
import { Footer } from "../Footer/Footer";
import { LogoutButton } from "../LogoutButton/LogoutButton";
import { urlForLocal } from "../../helper";
import { selectCurrentCandidate } from "../../redux/outstaffingSlice";
import rectangle from "../../images/rectangle_secondPage.png";
import "./calendar.scss";
const Calendar = () => {
if (localStorage.getItem("role_status") !== "18") {
return <Navigate to="/profile" replace />;
}
const candidateForCalendar = useSelector(selectCurrentCandidate);
const [month, setMonth] = useState("");
const navigate = useNavigate();
useEffect(() => {
setMonth(currentMonth);
}, [month]);
const { name, skillsName, photo } = candidateForCalendar;
const abbreviatedName = name && name.substring(0, name.lastIndexOf(" "));
return (
<div className="container">
<section className="calendar">
<div className="row">
<div className="calendar__header">
<h2 className="calendar__profile">
Добрый день, <span>Александр !</span>
</h2>
<LogoutButton />
</div>
<div className="col-12 col-xl-12 d-flex justify-content-between align-items-center flex-column flex-sm-row">
<div className="calendar__info">
{photo && (
<img
className="calendar__info-img"
src={urlForLocal(photo)}
alt="img"
/>
)}
<h3 className="calendar__info-name">{abbreviatedName}</h3>
</div>
<div className="calendar__title">
<h3 className="calendar__title-text">{skillsName} разработчик</h3>
<img className="calendar__title-img" src={rectangle} alt="img" />
</div>
<div>
<Link to="/report">
<button className="calendar__btn">
Заполнить отчет за день
</button>
</Link>
</div>
</div>
</div>
<div className="row">
<div className="col-12 col-xl-12">
<CalendarComponent
onSelect={() => {
navigate("/report/0");
}}
/>
<p className="calendar__hours">
{month} : <span> 60 часов </span>
</p>
</div>
</div>
<Footer />
</section>
</div>
);
};
export default Calendar;

92
src/components/Calendar/CalendarComponent.js
View File

@ -1,92 +0,0 @@
import React, { useState, useEffect } from 'react'
import ellipse from '../../images/ellipse.png'
import rectangle from '../../images/rectangle__calendar.png'
import calendarIcon from '../../images/calendar_icon.png'
import moment from 'moment'
import 'moment/locale/ru'
import { calendarHelper, currentMonthAndDay, } from './calendarHelper'
import './calendarComponent.scss'
const CalendarComponent = ({ onSelect }) => {
const [value, setValue] = useState(moment())
const [calendar, setCalendar] = useState([])
useEffect(() => {
setCalendar(calendarHelper(value))
}, [value])
function beforeToday(day) {
return day.isBefore(new Date(), 'day')
}
function isToday(day) {
return day.isSame(new Date(), 'day')
}
function dayStyles(day) {
if (beforeToday(day)) return `before`
if (isToday(day)) return `today`
if (day.day() === 6 || day.day() === 0) return `selected`
return ''
}
function prevMonth() {
return value.clone().subtract(1, 'month')
}
function nextMonth() {
return value.clone().add(1, 'month');
}
return (
<div className='calendar-component'>
<div className='calendar-component__header'>
<h3>Мои отчеты</h3>
<div className='calendar-component__header-box'>
<img src={ellipse} alt='' />
<span onClick={() => setValue(prevMonth())}>{prevMonth().format('MMMM')}</span>
</div>
<div className='calendar-component__header-box'>
<img src={ellipse} alt='' />
<span onClick={() => setValue(nextMonth())}>{nextMonth().format('MMMM')}</span>
</div>
</div>
<div className='calendar-component__rectangle'>
<img src={rectangle} alt='' />
</div>
<div className='calendar-component__body'>
<div>
<p>Пн</p>
<p>Вт</p>
<p>Ср</p>
<p>Чт</p>
<p>Пт</p>
<p>Сб</p>
<p>Вс</p>
</div>
<div className='calendar-component__form'>
{calendar.map((week) =>
week.map((day) => (
<button
onClick={() => { setValue(day); onSelect(day) }}
key={day}
className={dayStyles(day)}
name={day.format('dddd')}
id='btn'
>
<img className={'calendar__icon'} src={calendarIcon} alt='' />
{currentMonthAndDay(day)}
</button>
))
)}
</div>
</div>
</div>
)
}
export default CalendarComponent

101
src/components/Calendar/CalendarComponent.jsx Normal file
View File

@ -0,0 +1,101 @@
import React, { useState, useEffect } from "react";
import { calendarHelper, currentMonthAndDay } from "./calendarHelper";
import ellipse from "../../images/ellipse.png";
import rectangle from "../../images/rectangle__calendar.png";
import calendarIcon from "../../images/calendar_icon.png";
import moment from "moment";
import "moment/locale/ru";
import "./calendarComponent.scss";
const CalendarComponent = ({ onSelect }) => {
const [value, setValue] = useState(moment());
const [calendar, setCalendar] = useState([]);
useEffect(() => {
setCalendar(calendarHelper(value));
}, [value]);
function beforeToday(day) {
return day.isBefore(new Date(), "day");
}
function isToday(day) {
return day.isSame(new Date(), "day");
}
function dayStyles(day) {
if (beforeToday(day)) return `before`;
if (isToday(day)) return `today`;
if (day.day() === 6 || day.day() === 0) return `selected`;
return "";
}
function prevMonth() {
return value.clone().subtract(1, "month");
}
function nextMonth() {
return value.clone().add(1, "month");
}
return (
<div className="calendar-component">
<div className="calendar-component__header">
<h3>Мои отчеты</h3>
<div className="calendar-component__header-box">
<img src={ellipse} alt="" />
<span onClick={() => setValue(prevMonth())}>
{prevMonth().format("MMMM")}
</span>
</div>
<div className="calendar-component__header-box">
<img src={ellipse} alt="" />
<span onClick={() => setValue(nextMonth())}>
{nextMonth().format("MMMM")}
</span>
</div>
</div>
<div className="calendar-component__rectangle">
<img src={rectangle} alt="" />
</div>
<div className="calendar-component__body">
<div>
<p>Пн</p>
<p>Вт</p>
<p>Ср</p>
<p>Чт</p>
<p>Пт</p>
<p>Сб</p>
<p>Вс</p>
</div>
<div className="calendar-component__form">
{calendar.map((week) =>
week.map((day) => (
<button
onClick={() => {
setValue(day);
onSelect(day);
}}
key={day}
className={dayStyles(day)}
name={day.format("dddd")}
id="btn"
>
<img className={"calendar__icon"} src={calendarIcon} alt="" />
{currentMonthAndDay(day)}
</button>
))
)}
</div>
</div>
</div>
);
};
export default CalendarComponent;

4
src/components/Calendar/calendar.scss
View File

@ -1,6 +1,6 @@
.calendar {
margin-bottom: 40px;
font-family: 'LabGrotesque', sans-serif;
font-family: "LabGrotesque", sans-serif;
&__header {
display: flex;
@ -85,7 +85,7 @@
);
border: none;
color: #ffffff;
font-family: 'Muller';
font-family: "Muller";
font-size: 1.6em;
letter-spacing: normal;
text-align: center;

101
src/components/Calendar/calendarComponent.scss
View File

@ -210,12 +210,6 @@
padding: 28px 10px 48px 10px;
&__header {
//h3 {
// position: absolute;
// top: -10%;
// left: 25%;
//}
&-box {
margin-left: 20px;
}
@ -233,101 +227,6 @@
}
}
//@media (max-width: 768px) {
// .calendar-component__form > button {
// width: 70px;
// height: 40px;
//
// img {
// display: none;
// }
// }
//}
//@media (max-width: 540.98px) {
// .calendar-component__form > button {
// width: 68px;
// height: 40px;
// }
//}
//
//@media (max-width: 520.98px) {
// .calendar-component__form > button {
// width: 66px;
// height: 40px;
// }
//}
//
//@media (max-width: 500.98px) {
// .calendar-component__form > button {
// width: 64px;
// height: 40px;
// }
//}
//
//@media (max-width: 480.98px) {
// .calendar-component__form > button {
// width: 60px;
// height: 40px;
// }
//}
//
//@media (max-width: 460.98px) {
// .calendar-component__form > button {
// width: 56px;
// height: 40px;
// }
//}
//
//@media (max-width: 440.98px) {
// .calendar-component__form > button {
// width: 52px;
// height: 40px;
// }
//}
//
//@media (max-width: 428.98px) {
// .calendar-component__form > button {
// width: 50px;
// height: 40px;
// }
//}
//
//@media (max-width: 414.98px) {
// .calendar-component__form > button {
// width: 49px;
// height: 40px;
// }
//}
//
//@media (max-width: 395.98px) {
// .calendar-component__form > button {
// width: 46px;
// height: 40px;
// }
//}
//
//@media (max-width: 350.98px) {
// .calendar-component__form > button {
// width: 44px;
// height: 40px;
// }
//}
//
//@media (max-width: 349.98px) {
// .calendar-component__form > button {
// width: 42px;
// height: 40px;
// }
//}
//
//@media (max-width: 346.98px) {
// .calendar-component__form > button {
// width: 40px;
// height: 40px;
// }
//}
.calendar__icon {
margin-right: 10px;
margin-top: -4px;

13
src/components/Candidate/Candidate.js
View File

@ -7,6 +7,7 @@ import Sidebar from "../CandidateSidebar/CandidateSidebar";
import { ProfileHeader } from "../ProfileHeader/ProfileHeader";
import { ProfileBreadcrumbs } from "../ProfileBreadcrumbs/ProfileBreadcrumbs";
import { Footer } from "../Footer/Footer";
import { Navigation } from "../Navigation/Navigation";
import {
currentCandidate,
@ -16,17 +17,17 @@ import {
import { apiRequest } from "../../api/request";
import { createMarkup } from "../../helper";
import gitImgItem from "../../images/gitItemImg.png";
import gitImgItem from "../../images/gitItemImg.svg";
import rectangle from "../../images/rectangle_secondPage.png";
import front from "../Outstaffing/images/front_end.png";
import back from "../Outstaffing/images/back_end.png";
import design from "../Outstaffing/images/design.png";
import rightArrow from "../../images/arrowRight.png";
import front from "../../images/front-end.webp";
import back from "../../images/back-end.webp";
import design from "../../images/design.webp";
import rightArrow from "../../images/arrowRight.svg";
import { LEVELS, SKILLS } from "../../constants/constants";
import "./candidate.scss";
import { Navigation } from "../Navigation/Navigation";
const Candidate = () => {
if (localStorage.getItem("role_status") !== "18") {

4
src/components/CandidateSidebar/CandidateSidebar.js → src/components/CandidateSidebar/CandidateSidebar.jsx
View File

@ -1,8 +1,8 @@
import React, { useState } from "react";
import { Link } from "react-router-dom";
import { Achievement } from "../Achievement/Achievement";
import { Achievement } from "../Achievement/Achievement";
import ModalAspt from "../UI/ModalAspt/ModalAspt";
import { urlForLocal } from "../../helper";
import { LEVELS, SKILLS } from "../../constants/constants";

29
src/components/CardControl/CardControl.js
View File

@ -1,20 +1,23 @@
import React from 'react'
import rightArrow from "../../images/arrowRight.png"
import { Link } from 'react-router-dom'
import './CardControl.scss'
import React from "react";
import { Link } from "react-router-dom";
export const CardControl = ({title,path,description, img}) => {
import rightArrow from "../../images/arrowRight.svg";
import "./CardControl.scss";
export const CardControl = ({ title, path, description, img }) => {
return (
<Link to={`/${path}`} className='control-card'>
<div className='control-card__about'>
<img src={img} alt='itemImg' />
<Link to={`/${path}`} className="control-card">
<div className="control-card__about">
<img src={img} alt="itemImg" />
<h3>{title}</h3>
</div>
<div className='control-card__info'>
<div className="control-card__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className='control-card__infoLink'>
<img src={rightArrow} alt='arrow' />
<div className="control-card__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>)
}
</Link>
);
};

29
src/components/CategoriesItem/CategoriesItem.js
View File

@ -1,25 +1,30 @@
import React from "react";
import {Link} from "react-router-dom";
import { Link } from "react-router-dom";
import rightArrow from "../../images/arrowRight.png"
import rightArrow from "../../images/arrowRight.svg";
import './categoriesItem.scss'
import "./categoriesItem.scss";
export const CategoriesItem = ({img, title, skills, available, link}) => {
return(
<Link to={link} className={available ? "categoriesItem" : "categoriesItem categoriesItem__disable"}>
<div className='categoriesItem__title'>
<img src={img} alt='img' />
export const CategoriesItem = ({ img, title, skills, available, link }) => {
return (
<Link
to={link}
className={
available ? "categoriesItem" : "categoriesItem categoriesItem__disable"
}
>
<div className="categoriesItem__title">
<img src={img} alt="img" />
<h5>{title}</h5>
</div>
<div className='categoriesItem__description'>
<div className="categoriesItem__description">
<p>{skills}</p>
<div className='more'>
<div className="more">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
)
);
};
export default CategoriesItem
export default CategoriesItem;

11
src/components/FrequentlyAskedQuestionsItem/FrequentlyAskedQuestionsItem.jsx
View File

@ -1,14 +1,17 @@
import React from "react";
import "./FrequentlyAskedQuestionsItem.scss";
import { FREQUENTLY_ASKED_QUESTION_ROUTE } from "../../constants/router-path";
import { Link } from "react-router-dom";
import questionIcon from "./../../images/faq/question.svg";
import "./FrequentlyAskedQuestionsItem.scss";
export const FrequentlyAskedQuestionsItem = ({ rubric }) => {
return (
<div className="frequently-asked-questions-item">
<div className="frequently-asked-questions-item__head">
<div className="frequently-asked-questions-item__icon-question"><img src={questionIcon} alt="" /></div>
<div className="frequently-asked-questions-item__icon-question">
<img src={questionIcon} alt="" />
</div>
<div className="frequently-asked-questions-item__title">
{rubric?.title}
</div>
@ -16,7 +19,7 @@ export const FrequentlyAskedQuestionsItem = ({ rubric }) => {
{rubric?.questions?.map((question) => (
<Link
key={question.id}
to={FREQUENTLY_ASKED_QUESTION_ROUTE + "/" + question.id}
to={`/frequently-asked-question/${question.id}`}
className="frequently-asked-questions-item__body"
>
<p>{question.title}</p>

72
src/components/Outstaffing/Outstaffing.js
View File

@ -1,26 +1,28 @@
import React from 'react'
import {useSelector, useDispatch} from 'react-redux'
import React from "react";
import { useSelector, useDispatch } from "react-redux";
import OutstaffingBlock from '../OutstaffingBlock/OutstaffingBlock'
import TagSelect from '../Select/TagSelect'
import OutstaffingBlock from "../OutstaffingBlock/OutstaffingBlock";
import TagSelect from "../Select/TagSelect";
import {selectTags, getPositionId, setPositionId} from '../../redux/outstaffingSlice'
import front from './images/front_end.png'
import back from './images/back_end.png'
import design from './images/design.png'
import './outstaffing.scss'
import {
selectTags,
getPositionId,
setPositionId,
} from "../../redux/outstaffingSlice";
import front from "../../images/front-end.webp";
import back from "../../images/back-end.webp";
import design from "../../images/design.webp";
import "./outstaffing.scss";
const createSelectPositionHandler =
({positionId, setPositionId, dispatch}) =>
({ positionId, setPositionId, dispatch }) =>
(id) => {
if (id === positionId) {
dispatch(setPositionId(null))
dispatch(setPositionId(null));
} else {
dispatch(setPositionId(id))
dispatch(setPositionId(id));
}
};
@ -32,56 +34,56 @@ const Outstaffing = () => {
const onSelectPosition = createSelectPositionHandler({
positionId,
setPositionId,
dispatch
dispatch,
});
return (
<>
<section className='outstaffing'>
<div className='row'>
<div className='col-12 col-xl-4'>
<section className="outstaffing">
<div className="row">
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_front')
tagsArr.flat().filter((tag) => tag.name === "skills_front")
}
img={front}
header='Frontend разработчики'
positionId='2'
isSelected={positionId === '2'}
header="Frontend разработчики"
positionId="2"
isSelected={positionId === "2"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<div className='col-12 col-xl-4'>
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_back')
tagsArr.flat().filter((tag) => tag.name === "skills_back")
}
img={back}
header='Backend разработчики'
positionId='1'
isSelected={positionId === '1'}
header="Backend разработчики"
positionId="1"
isSelected={positionId === "1"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
<div className='col-12 col-xl-4'>
<div className="col-12 col-xl-4">
<OutstaffingBlock
dataTags={
tagsArr &&
tagsArr.flat().filter((tag) => tag.name === 'skills_design')
tagsArr.flat().filter((tag) => tag.name === "skills_design")
}
img={design}
header='Дизайн проектов'
positionId='5'
isSelected={positionId === '5'}
header="Дизайн проектов"
positionId="5"
isSelected={positionId === "5"}
onSelect={(id) => onSelectPosition(id)}
/>
</div>
</div>
</section>
<TagSelect/>
<TagSelect />
</>
)
);
};
export default Outstaffing
export default Outstaffing;

BIN
src/components/Outstaffing/images/back_end.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 15 KiB

BIN
src/components/Outstaffing/images/design.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 19 KiB

BIN
src/components/Outstaffing/images/front_end.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 14 KiB

48
src/components/features/quiz/CardAviableTest.js
View File

@ -1,34 +1,38 @@
import React from 'react'
import { Link } from 'react-router-dom'
import rightArrow from "../../../images/arrowRight.png"
import StarRating from '../../StarRating/StarRating'
import React from "react";
import { Link } from "react-router-dom";
import rightArrow from "../../../images/arrowRight.svg";
import StarRating from "../../StarRating/StarRating";
export const CardAvailableTest = ({ title, description, path, passedTest }) => {
return (
<div className='card-available-test'>
<Link to={`/${path}`} className="card-available-test__container" style={{ opacity: passedTest ? 0.3 : 1, pointerEvents: passedTest ? 'none' : 'all' }}>
<div className='card-available-test__top-head'>
<div className="card-available-test">
<Link
to={`/${path}`}
className="card-available-test__container"
style={{
opacity: passedTest ? 0.3 : 1,
pointerEvents: passedTest ? "none" : "all",
}}
>
<div className="card-available-test__top-head">
<StarRating />
<h3 className='card-available-test__title'>{title}</h3>
<h3 className="card-available-test__title">{title}</h3>
</div>
<div className='card-available-test__info'>
<div className="card-available-test__info">
<p dangerouslySetInnerHTML={{ __html: description }}></p>
<div className='card-available-test__infoLink'>
<img src={rightArrow} alt='arrow' />
<div className="card-available-test__infoLink">
<img src={rightArrow} alt="arrow" />
</div>
</div>
</Link>
{passedTest && <div className='card-available-test__finished'>
<p>
Получить отчет по тестированию
</p>
<Link to={'/quiz/report'}>Отчет по тесту</Link>
</div>}
{passedTest && (
<div className="card-available-test__finished">
<p>Получить отчет по тестированию</p>
<Link to={"/quiz/report"}>Отчет по тесту</Link>
</div>
)
}
)}
</div>
);
};

2
src/constants/router-path.js
View File

@ -1,2 +0,0 @@
export const FREQUENTLY_ASKED_QUESTIONS_ROUTE = "/frequently-asked-questions";
export const FREQUENTLY_ASKED_QUESTION_ROUTE = "/frequently-asked-question";

BIN
src/images/arrowRight.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 240 B

9
src/images/arrowRight.svg Normal file
View File

@ -0,0 +1,9 @@
<svg width="18" height="10" viewBox="0 0 18 10" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect x="18" y="10" width="17.8125" height="10" transform="rotate(180 18 10)" fill="url(#pattern0)"/>
<defs>
<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
<use xlink:href="#image0_931_914" transform="matrix(0.0244088 0 0 0.0434783 -0.000381388 0)"/>
</pattern>
<image id="image0_931_914" width="41" height="23" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAAXCAMAAAChzpYZAAAAAXNSR0IB2cksfwAAAEJQTFRFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAjuH28gAAABZ0Uk5TAEK0Cvb/vgaIlxC7oNwcwg/J2f1bS4SvOREAAABWSURBVHicY2CAA0YmZgaiACMLKxs7kQpZOUYV4lPIyUUYgBUSBRiYiFTIysDMBiS5eQgDBrBSXj5ifESSUn6ilQoIDi2lQkTlDqBSYRGiFAKViuKVBgCepwfqGDtvmgAAAABJRU5ErkJggg=="/>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 902 B

BIN
src/images/back-end.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
src/images/design.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
src/images/front-end.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
src/images/gitItemImg.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 KiB

9
src/images/gitItemImg.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

BIN
src/images/userIcon.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 499 B

4
src/images/userIcon.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.1111 19.9999V18.111C19.1111 17.1091 18.7131 16.1482 18.0046 15.4397C17.2962 14.7313 16.3353 14.3333 15.3333 14.3333H7.77778C6.77585 14.3333 5.81496 14.7313 5.10649 15.4397C4.39801 16.1482 4 17.1091 4 18.111V19.9999" stroke="#406128" stroke-width="1.9" stroke-linecap="square" stroke-linejoin="round"/>
<path d="M11.5551 10.5556C13.6415 10.5556 15.3329 8.86419 15.3329 6.77778C15.3329 4.69137 13.6415 3 11.5551 3C9.46871 3 7.77734 4.69137 7.77734 6.77778C7.77734 8.86419 9.46871 10.5556 11.5551 10.5556Z" stroke="#406128" stroke-width="1.9" stroke-linecap="square" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 706 B

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

@ -1,34 +1,33 @@
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();
@ -38,67 +37,71 @@ export const AuthForCandidate = () => {
const [personalInfoItems] = useState([
{
title: 'Backend разработчики',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Backend разработчики",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: BackEndImg
img: BackEndImg,
},
{
title: 'Frontend разработчики',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Frontend разработчики",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: FrontendImg
img: FrontendImg,
},
{
title: 'Архитектура проектов',
link: '/registration-candidate',
description: 'Потоки данных ER ERP CRM CQRS UML BPMN',
title: "Архитектура проектов",
link: "/registration-candidate",
description: "Потоки данных ER ERP CRM CQRS UML BPMN",
available: true,
img: ArchitectureImg
img: ArchitectureImg,
},
{
title: 'Дизайн проектов',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Дизайн проектов",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: DesignImg
img: DesignImg,
},
{
title: 'Тестирование проектов',
link: '/registration-candidate',
description: 'SQL Postman TestRail Kibana Ручное тестирование',
title: "Тестирование проектов",
link: "/registration-candidate",
description: "SQL Postman TestRail Kibana Ручное тестирование",
available: false,
img: TestImg
img: TestImg,
},
{
title: 'Администрирование проектов',
link: '/registration-candidate',
description: 'DevOps ELK Kubernetes Docker Bash Apache Oracle Git',
title: "Администрирование проектов",
link: "/registration-candidate",
description: "DevOps ELK Kubernetes Docker Bash Apache Oracle Git",
available: false,
img: AdminImg
img: AdminImg,
},
{
title: 'Управление проектом',
link: '/registration-candidate',
description: 'Scrum Kanban Agile Miro CustDev',
title: "Управление проектом",
link: "/registration-candidate",
description: "Scrum Kanban Agile Miro CustDev",
available: false,
img: ManageImg
img: ManageImg,
},
{
title: 'Копирайтинг проектов',
link: '/registration-candidate',
description: 'Теги Заголовок H1 Дескриптор Абзац Сценарий',
title: "Копирайтинг проектов",
link: "/registration-candidate",
description: "Теги Заголовок H1 Дескриптор Абзац Сценарий",
available: false,
img: CopyImg
img: CopyImg,
},
{
title: 'Реклама и SMM',
link: '/registration-candidate',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Реклама и SMM",
link: "/registration-candidate",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: false,
img: SmmImg
img: SmmImg,
},
]);
@ -136,17 +139,20 @@ export const AuthForCandidate = () => {
}
};
return(
<div className='auth-candidate'>
return (
<div className="auth-candidate">
<AuthHeader />
<div className='container'>
<div className='auth__wrapper'>
<div className='auth__info'>
<div className="container">
<div className="auth__wrapper">
<div className="auth__info">
<h3>Войти, уже есть доступ</h3>
<img src={authImg} alt='img' />
<p>если вы получили доступ пройдя 2 шага для входа или хотите узнать свои результаты в кабинете</p>
<img src={authImg} alt="img" />
<p>
если вы получили доступ пройдя 2 шага для входа или хотите узнать
свои результаты в кабинете
</p>
</div>
<form ref={ref} className='auth__form'>
<form ref={ref} className="auth__form">
<label htmlFor="login">Ваш email *</label>
<input id="login" type="text" name="username" placeholder="Email" />
@ -162,27 +168,40 @@ export const AuthForCandidate = () => {
e.preventDefault();
submitHandler();
}}
>Войти</button>
>
Войти
</button>
</form>
</div>
<div className='auth-candidate__start'>
<h2 className="auth-candidate__start__title">Хочу в команду <span>Айти специалистов</span></h2>
<div className="auth-candidate__start">
<h2 className="auth-candidate__start__title">
Хочу в команду <span>Айти специалистов</span>
</h2>
<div className="change-mode__arrow">
<img src={arrowBtn}></img>
<img src={arrowBtn} alt="#"></img>
</div>
<p className="auth-candidate__start__description">Для нас не имеет значение Ваша локация.</p>
<div className='auth-candidate__start__categoriesWrapper'>
<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} />
})
}
return (
<CategoriesItem
link={item.link}
key={index}
title={item.title}
img={item.img}
skills={item.description}
available={item.available}
/>
);
})}
</div>
</div>
</div>
<SideBar />
<Footer/>
<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>

75
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} />)
}
{rubrics.map((rubric, index) => (
<FrequentlyAskedQuestionsItem rubric={rubric} key={index} />
))}
</div>
</div>
<Footer />
</div>
);
};

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

@ -1,36 +1,44 @@
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/>
if (
localStorage.getItem("role_status") !== "18" ||
!partnerEmployees.length
) {
return <Navigate to="/profile/categories" replace />;
}
return(
return (
<div className="partnerEmployees">
<ProfileHeader />
<div className="container">
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные моего персонала', link: '/profile/categories'},
{name: 'Backend разработчики', link: '/profile/categories/employees'},
<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}>
return (
<div className="partnerEmployees__item" key={person.id}>
<div className="partnerEmployees__item__name">
<img src={person.personAvatar} alt="avatar" />
<h4>{person.name}</h4>
@ -42,7 +50,7 @@ export const PartnerEmployees = () => {
<div className="info_summary">
<img src={imgInfo} alt="img" />
<p>Данные и резюме</p>
<Link to='/candidate/26' className="arrow">
<Link to="/candidate/26" className="arrow">
<img src={rightArrow} alt="arrow" />
</Link>
</div>
@ -53,22 +61,25 @@ export const PartnerEmployees = () => {
<div className="partnerEmployees__item__info__project__details">
<div className="details__item">
<p>Открытые задачи</p>
<span className="count">{person.tasks_in_progress}</span>
<span className="count">
{person.tasks_in_progress}
</span>
</div>
<div className="details__item">
<p>Отработанных часов в <span>марте</span></p>
<p>
Отработанных часов в <span>марте</span>
</p>
<span className="count">{person.month_hours}</span>
</div>
</div>
</div>
</div>
</div>
})
}
);
})}
</div>
</div>
<Footer/>
<Footer />
</div>
)
}
);
};

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

@ -1,100 +1,104 @@
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/>
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',
title: "Backend разработчики",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: BackEndImg
img: BackEndImg,
},
{
title: 'Frontend разработчики',
link: '/profile/categories/employees',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Frontend разработчики",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: FrontendImg
img: FrontendImg,
},
{
title: 'Архитектура проектов',
link: '/profile/categories/employees',
description: 'Потоки данных ER ERP CRM CQRS UML BPMN',
title: "Архитектура проектов",
link: "/profile/categories/employees",
description: "Потоки данных ER ERP CRM CQRS UML BPMN",
available: true,
img: ArchitectureImg
img: ArchitectureImg,
},
{
title: 'Дизайн проектов',
link: '/profile/categories/employees',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Дизайн проектов",
link: "/profile/categories/employees",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: true,
img: DesignImg
img: DesignImg,
},
{
title: 'Тестирование проектов',
link: '/profile/add-request',
description: 'SQL Postman TestRail Kibana Ручное тестирование',
title: "Тестирование проектов",
link: "/profile/add-request",
description: "SQL Postman TestRail Kibana Ручное тестирование",
available: false,
img: TestImg
img: TestImg,
},
{
title: 'Администрирование проектов',
link: '/profile/add-request',
description: 'DevOps ELK Kubernetes Docker Bash Apache Oracle Git',
title: "Администрирование проектов",
link: "/profile/add-request",
description: "DevOps ELK Kubernetes Docker Bash Apache Oracle Git",
available: false,
img: AdminImg
img: AdminImg,
},
{
title: 'Управление проектом',
link: '/profile/add-request',
description: 'Scrum Kanban Agile Miro CustDev',
title: "Управление проектом",
link: "/profile/add-request",
description: "Scrum Kanban Agile Miro CustDev",
available: false,
img: ManageImg
img: ManageImg,
},
{
title: 'Копирайтинг проектов',
link: '/profile/add-request',
description: 'Теги Заголовок H1 Дескриптор Абзац Сценарий',
title: "Копирайтинг проектов",
link: "/profile/add-request",
description: "Теги Заголовок H1 Дескриптор Абзац Сценарий",
available: false,
img: CopyImg
img: CopyImg,
},
{
title: 'Реклама и SMM',
link: '/profile/add-request',
description: 'Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript',
title: "Реклама и SMM",
link: "/profile/add-request",
description:
"Java PHP Python C# React Vue.js NodeJs Golang Ruby JavaScript",
available: false,
img: SmmImg
img: SmmImg,
},
])
]);
const [mokPersons] = useState([
{
@ -105,7 +109,7 @@ export const PartnerCategories = () => {
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 1
id: 1,
},
{
personAvatar: avatarImg,
@ -115,7 +119,7 @@ export const PartnerCategories = () => {
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 2
id: 2,
},
{
personAvatar: avatarImg,
@ -125,47 +129,58 @@ export const PartnerCategories = () => {
project: "Админка НВД Консалтинг",
tasks_in_progress: 5,
month_hours: 140,
id: 3
id: 3,
},
])
]);
return (
<div className="partnerCategories">
<ProfileHeader />
<Navigation />
<div className="container">
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные моего персонала', link: '/profile/categories'},
<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"}
return (
<Link
to={item.link}
key={index}
className={
item.available
? "partnerCategories__item item"
: "partnerCategories__item item item__disable"
}
onClick={() => {
dispatch(setPartnerEmployees(mokPersons))
}}>
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'>
<div className="more">
<img src={rightArrow} alt="arrow" />
</div>
</div>
{!item.available &&
{!item.available && (
<div className="item__disableHover">
<p>У вас нет персонала из категории</p>
<button>Подобрать</button>
</div>
}
)}
</Link>
);
})}
</div>
</div>
<Footer/>
<Footer />
</div>
)
}
);
};

70
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>
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>
<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' />
<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' />
<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'>
<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'>
<div className="registrationCandidate__form__input">
<label htmlFor="summary">Если есть ссылка на резюме</label>
<input id="summary" type="text" placeholder="Резюме" />
</div>
<div className='registrationCandidate__form__input'>
<div className="registrationCandidate__form__input">
<label htmlFor="email">Ваш email *</label>
<input id="email" type="text" placeholder="Email" />
</div>
<div className='registrationCandidate__form__input'>
<div className="registrationCandidate__form__input">
<label htmlFor="tg">Ваш телеграм*</label>
<input id="tg" type="text" placeholder="Телеграм" />
</div>
<div className='registrationCandidate__form__input'>
<div className="registrationCandidate__form__input">
<label htmlFor="password">Придумайте пароль*</label>
<input id="password" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__input'>
<div className="registrationCandidate__form__input">
<label htmlFor="secondPassword">Повторите пароль*</label>
<input id="secondPassword" type="text" placeholder="Пароль" />
</div>
<div className='registrationCandidate__form__submit'>
<div className="registrationCandidate__form__submit">
<button>Отправить</button>
</div>
</form>
</div>
</div>
</div>
<SideBar/>
<Footer/>
<SideBar />
<Footer />
</div>
)
}
);
};

182
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/>
<div className="summary">
<ProfileHeader />
<Navigation />
<div className='container'>
<div className='summary__content'>
<ProfileBreadcrumbs links={[
{name: 'Главная', link: '/profile'},
{name: 'Данные и резюме', link: '/profile/summary'}
<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'/>
<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 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>
</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 && ','}
</span>
{!openGit && (
<button className="summary__git" onClick={() => setOpenGit(true)}>
Git
</button>
)}
</div>
</div>
{!openGit && (
<div className="summary__skills skills__section">
<div className="summary__sections__head">
<h3>Основной стек</h3>
<button>Редактировать раздел</button>
</div>
}
{profileInfo.vc_text && !openGit &&
<div className='summary__experience'>
<div className='experience__block'>
<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">
<div className="summary__sections__head">
<h3>Описание опыта работы</h3>
<button>Редактировать раздел</button>
</div>
<div className="experience__content" dangerouslySetInnerHTML={{__html:profileInfo.vc_text}}>
<div
className="experience__content"
dangerouslySetInnerHTML={{ __html: profileInfo.vc_text }}
></div>
</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'>
<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'/>
<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
className="gitItem__link"
href={itemGit.link}
target="_blank"
rel="noreferrer"
>
<img src={rightArrow} alt="arrowRight" />
</a>
</a>
})
}
);
})}
</div>
</div>
}
)}
</div>
<Footer/>
<Footer />
</div>
)
);
};