фиксы
This commit is contained in:
parent
2a8c26c3c6
commit
642a8a9641
@ -4,8 +4,8 @@ import {BrowserRouter as Router, Route, Routes, Navigate} from 'react-router-dom
|
||||
|
||||
import AuthForPartners from "./pages/AuthForPartners/AuthForPartners";
|
||||
import AuthForDevelopers from "./pages/AuthForDevelopers/AuthForDevelopers";
|
||||
import Home from "./components/Home/Home";
|
||||
import CandidatePage from './pages/CandidatePage'
|
||||
import Home from "./pages/Home/Home";
|
||||
import Candidate from "./components/Candidate/Candidate";
|
||||
import Calendar from "./components/Calendar/Calendar";
|
||||
import ReportForm from "./components/ReportForm/ReportForm";
|
||||
import {ProfileCalendar} from "./components/ProfileCalendar/ProfileCalendar";
|
||||
@ -24,6 +24,7 @@ import 'bootstrap/dist/css/bootstrap.min.css'
|
||||
|
||||
|
||||
|
||||
|
||||
const App = () => {
|
||||
return (
|
||||
<>
|
||||
@ -36,7 +37,7 @@ const App = () => {
|
||||
<Route exact path='/authdev' element={<AuthForDevelopers/>}/>
|
||||
<Route exact path='/auth' element={<AuthForPartners/>}/>
|
||||
|
||||
<Route exact path='/candidate/:id' element={<CandidatePage/>}/>
|
||||
<Route exact path='/candidate/:id' element={<Candidate/>}/>
|
||||
<Route exact path='/candidate/:id/form' element={<FormPage/>}/>
|
||||
<Route path='/:userId/calendar' element={<Calendar/>}/>
|
||||
|
||||
|
@ -1,21 +1,23 @@
|
||||
import React, {useState} from 'react'
|
||||
import {Link} from 'react-router-dom'
|
||||
import {Link, useNavigate} from 'react-router-dom'
|
||||
import {useDispatch, useSelector} from 'react-redux'
|
||||
import {withSwalInstance} from 'sweetalert2-react'
|
||||
import swal from 'sweetalert2'
|
||||
|
||||
import {Loader} from '../Loader/Loader'
|
||||
import ErrorBoundary from "../../hoc/ErrorBoundary";
|
||||
|
||||
import {auth, setUserInfo} from '../../redux/outstaffingSlice'
|
||||
import {auth, selectAuth, setUserInfo} from '../../redux/outstaffingSlice'
|
||||
import {loading} from '../../redux/loaderSlice'
|
||||
import {setRole} from '../../redux/roleSlice'
|
||||
|
||||
import {selectIsLoading} from '../../redux/loaderSlice'
|
||||
|
||||
import {useRequest} from "../../hooks/useRequest";
|
||||
|
||||
import ellipse from '../../images/ellipse.png'
|
||||
|
||||
import './authBox.scss'
|
||||
import {useRequest} from "../../hooks/useRequest";
|
||||
|
||||
|
||||
const SweetAlert = withSwalInstance(swal);
|
||||
@ -23,14 +25,21 @@ const SweetAlert = withSwalInstance(swal);
|
||||
export const AuthBox = ({title, altTitle, roleChangeLink}) => {
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const {apiRequest} = useRequest();
|
||||
const navigate = useNavigate();
|
||||
|
||||
const isAuth = useSelector(selectAuth);
|
||||
const isLoading = useSelector(selectIsLoading);
|
||||
|
||||
const {apiRequest} = useRequest();
|
||||
|
||||
const [username, setUsername] = useState('');
|
||||
const [password, setPassword] = useState('');
|
||||
const [error, setError] = useState(null);
|
||||
|
||||
if (isAuth) {
|
||||
navigate('/')
|
||||
}
|
||||
|
||||
const submitHandler = () => {
|
||||
|
||||
if (!isLoading) {
|
||||
@ -97,12 +106,14 @@ export const AuthBox = ({title, altTitle, roleChangeLink}) => {
|
||||
|
||||
{error && (
|
||||
<div className='auth-box__form-error'>
|
||||
<ErrorBoundary>
|
||||
<SweetAlert
|
||||
show={!!error}
|
||||
title='Ошибка'
|
||||
text={error}
|
||||
onConfirm={() => setError(null)}
|
||||
/>
|
||||
</ErrorBoundary>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@ -124,6 +135,7 @@ export const AuthBox = ({title, altTitle, roleChangeLink}) => {
|
||||
</Link>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
)
|
||||
};
|
||||
|
@ -18,13 +18,19 @@ import back from '../../images/back_end.png'
|
||||
import design from '../../images/design.png'
|
||||
|
||||
import './candidate.scss'
|
||||
import {LogoutButton} from "../LogoutButton/LogoutButton";
|
||||
import {Header} from "../Header/Header";
|
||||
|
||||
|
||||
const Candidate = () => {
|
||||
const {id: candidateId} = useParams();
|
||||
|
||||
const navigate = useNavigate();
|
||||
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const currentCandidateObj = useSelector(selectCurrentCandidate);
|
||||
|
||||
const [activeSnippet, setActiveSnippet] = useState(true);
|
||||
|
||||
const {apiRequest} = useRequest();
|
||||
@ -39,8 +45,6 @@ const Candidate = () => {
|
||||
}).then((el) => dispatch(currentCandidate(el)))
|
||||
}, [dispatch, candidateId]);
|
||||
|
||||
const currentCandidateObj = useSelector(selectCurrentCandidate);
|
||||
|
||||
const {position_id, skillValues, vc_text: text} = currentCandidateObj;
|
||||
|
||||
const setStyles = () => {
|
||||
@ -80,16 +84,9 @@ const Candidate = () => {
|
||||
const {header, img, classes} = setStyles();
|
||||
|
||||
return (
|
||||
<div className='candidate'>
|
||||
<div className='row'>
|
||||
<div className='col-12'>
|
||||
<div className='candidate__title'>
|
||||
<h2>
|
||||
<span>Аутстаффинг</span> it-персонала
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<>
|
||||
<Header/>
|
||||
<div className='container candidate'>
|
||||
|
||||
<div className='row'>
|
||||
<div className='col-12 candidate__header'>
|
||||
@ -148,7 +145,8 @@ const Candidate = () => {
|
||||
<div className="works__item item-works">
|
||||
<div className="item-works__body">
|
||||
<Link to="/" className="item-works__link">Vuetifyis.com</Link>
|
||||
<div className="item-works__text">Forked from peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
<div className="item-works__text">Forked from
|
||||
peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
documentation
|
||||
</div>
|
||||
<div className="item-works__mark">Angular</div>
|
||||
@ -157,7 +155,8 @@ const Candidate = () => {
|
||||
<div className="works__item item-works">
|
||||
<div className="item-works__body">
|
||||
<Link to="/" className="item-works__link">Vuetifyis.com</Link>
|
||||
<div className="item-works__text">Forked from peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
<div className="item-works__text">Forked from
|
||||
peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
documentation
|
||||
</div>
|
||||
<div className="item-works__mark">Angular</div>
|
||||
@ -166,7 +165,8 @@ const Candidate = () => {
|
||||
<div className="works__item item-works">
|
||||
<div className="item-works__body">
|
||||
<Link to="/" className="item-works__link">Vuetifyis.com</Link>
|
||||
<div className="item-works__text">Forked from peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
<div className="item-works__text">Forked from
|
||||
peluprvi/vuetifyjs.com <br/> Vuetifyjs.com
|
||||
documentation
|
||||
</div>
|
||||
<div className="item-works__mark item-works__mark_yellow">Laravel</div>
|
||||
@ -182,6 +182,7 @@ const Candidate = () => {
|
||||
</div>
|
||||
<Footer/>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
};
|
||||
|
||||
|
@ -1,26 +1,6 @@
|
||||
@use 'sass:math';
|
||||
.candidate {
|
||||
&__title {
|
||||
margin-top: 60px;
|
||||
|
||||
h2 {
|
||||
text-align: center;
|
||||
color: #52b709;
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-size: 5em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 77.81px;
|
||||
|
||||
span {
|
||||
color: #282828;
|
||||
font-style: normal;
|
||||
letter-spacing: 0.56px;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
|
@ -3,6 +3,7 @@ import {useSelector} from 'react-redux'
|
||||
import {Link} from 'react-router-dom'
|
||||
|
||||
import {Loader} from '../Loader/Loader'
|
||||
import ErrorBoundary from "../../hoc/ErrorBoundary";
|
||||
|
||||
import {LEVELS, SKILLS} from '../../constants/constants'
|
||||
import {selectProfiles, selectFilteredCandidates,} from '../../redux/outstaffingSlice'
|
||||
@ -12,16 +13,19 @@ import rectangle from '../../images/rectangle_secondPage.png'
|
||||
|
||||
import './description.scss'
|
||||
|
||||
|
||||
const Description = ({onLoadMore, isLoadingMore}) => {
|
||||
|
||||
const candidatesListArr = useSelector(selectProfiles);
|
||||
const filteredListArr = useSelector(selectFilteredCandidates);
|
||||
|
||||
|
||||
if (!filteredListArr) {
|
||||
return (
|
||||
<section className='description'>
|
||||
<div className='container'>
|
||||
<div className='description__wrapper'>
|
||||
<ErrorBoundary>
|
||||
{candidatesListArr && Array.isArray(candidatesListArr) && candidatesListArr.length > 0 ? (
|
||||
candidatesListArr.map((el) => (
|
||||
<div className='row' key={el.id}>
|
||||
@ -78,6 +82,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
|
||||
: 'Загрузка...'}
|
||||
</div>
|
||||
)}
|
||||
</ErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div className='row'>
|
||||
@ -104,6 +109,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
|
||||
<section className='description'>
|
||||
<div className='container'>
|
||||
<div className='description__wrapper'>
|
||||
<ErrorBoundary>
|
||||
{filteredListArr && Array.isArray(filteredListArr) && filteredListArr.length > 0
|
||||
? filteredListArr.map((el) => (
|
||||
<div className='row' key={el.id}>
|
||||
@ -201,6 +207,7 @@ const Description = ({ onLoadMore, isLoadingMore }) => {
|
||||
<div className='col-xl-4'></div>
|
||||
</div>
|
||||
))}
|
||||
</ErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div className='row'>
|
||||
|
15
src/components/Header/Header.js
Normal file
15
src/components/Header/Header.js
Normal file
@ -0,0 +1,15 @@
|
||||
import React from "react";
|
||||
import {LogoutButton} from "../LogoutButton/LogoutButton";
|
||||
|
||||
import './header.scss'
|
||||
|
||||
export const Header = () => {
|
||||
return (
|
||||
<div className='container header'>
|
||||
<h2>
|
||||
<span>Аутстаффинг</span> it-персонала
|
||||
</h2>
|
||||
<LogoutButton/>
|
||||
</div>
|
||||
)
|
||||
};
|
26
src/components/Header/header.scss
Normal file
26
src/components/Header/header.scss
Normal file
@ -0,0 +1,26 @@
|
||||
.header {
|
||||
margin-top: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
h2 {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #52b709;
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-size: 5em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 77.81px;
|
||||
|
||||
span {
|
||||
color: #282828;
|
||||
font-style: normal;
|
||||
letter-spacing: 0.56px;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
@ -2,6 +2,7 @@ import SVGLoader from 'react-loader-spinner'
|
||||
import './loader.scss'
|
||||
import React from "react";
|
||||
|
||||
|
||||
export const Loader = ({width = 50, height = 50}) => {
|
||||
return (
|
||||
<div className='loader'>
|
||||
|
@ -3,6 +3,7 @@ import {useSelector, useDispatch} from 'react-redux'
|
||||
|
||||
import OutstaffingBlock from '../OutstaffingBlock/OutstaffingBlock'
|
||||
import TagSelect from '../Select/TagSelect'
|
||||
import {Header} from "../Header/Header";
|
||||
|
||||
import {selectTags, getPositionId, setPositionId} from '../../redux/outstaffingSlice'
|
||||
|
||||
@ -11,7 +12,8 @@ import back from '../../images/back_end.png'
|
||||
import design from '../../images/design.png'
|
||||
|
||||
import './outstaffing.scss'
|
||||
import {LogoutButton} from "../LogoutButton/LogoutButton";
|
||||
|
||||
|
||||
|
||||
const createSelectPositionHandler =
|
||||
({positionId, setPositionId, dispatch}) =>
|
||||
@ -36,12 +38,6 @@ const Outstaffing = () => {
|
||||
return (
|
||||
<>
|
||||
<section className='outstaffing'>
|
||||
<div className='outstaffing__title'>
|
||||
<h2>
|
||||
<span>Аутстаффинг</span> it-персонала
|
||||
</h2>
|
||||
<LogoutButton/>
|
||||
</div>
|
||||
<div className='row'>
|
||||
<div className='col-12 col-xl-4'>
|
||||
<OutstaffingBlock
|
||||
|
@ -1,30 +1,3 @@
|
||||
.outstaffing {
|
||||
&__title {
|
||||
margin-top: 60px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
h2 {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #52b709;
|
||||
font-family: 'GT Eesti Pro Display', sans-serif;
|
||||
font-size: 5em;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
letter-spacing: normal;
|
||||
line-height: 77.81px;
|
||||
|
||||
span {
|
||||
color: #282828;
|
||||
font-style: normal;
|
||||
letter-spacing: 0.56px;
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 375.98px) {
|
||||
.outstaffing__title > h2 {
|
||||
|
22
src/hoc/ErrorBoundary.js
Normal file
22
src/hoc/ErrorBoundary.js
Normal file
@ -0,0 +1,22 @@
|
||||
import React, {Component} from "react";
|
||||
|
||||
class ErrorBoundary extends Component {
|
||||
state = {
|
||||
error: null,
|
||||
};
|
||||
|
||||
static getDerivedStateFromError(error) {
|
||||
return {error};
|
||||
}
|
||||
|
||||
render() {
|
||||
const { error } = this.state;
|
||||
|
||||
if (error) {
|
||||
return <div>Что-то пошло не так =( {error}</div>;
|
||||
}
|
||||
return this.props.children;
|
||||
}
|
||||
}
|
||||
|
||||
export default ErrorBoundary
|
@ -1,7 +0,0 @@
|
||||
import React from 'react';
|
||||
import { WithLogout } from '../hoc/withLogout';
|
||||
import Candidate from '../components/Candidate/Candidate';
|
||||
|
||||
const CandidatePage = () => <WithLogout><Candidate /></WithLogout>;
|
||||
|
||||
export default CandidatePage;
|
@ -1,14 +1,15 @@
|
||||
import React, {useState, useEffect} from 'react'
|
||||
import {useDispatch} from 'react-redux'
|
||||
|
||||
import Outstaffing from '../Outstaffing/Outstaffing'
|
||||
import Description from '../Description/Description'
|
||||
import {Footer} from '../Footer/Footer'
|
||||
import Outstaffing from '../../components/Outstaffing/Outstaffing'
|
||||
import Description from '../../components/Description/Description'
|
||||
import {Footer} from '../../components/Footer/Footer'
|
||||
|
||||
import {profiles, tags} from '../../redux/outstaffingSlice'
|
||||
|
||||
import {useRequest} from "../../hooks/useRequest";
|
||||
import {LogoutButton} from "../LogoutButton/LogoutButton";
|
||||
import {LogoutButton} from "../../components/LogoutButton/LogoutButton";
|
||||
import {Header} from "../../components/Header/Header";
|
||||
|
||||
|
||||
const Home = () => {
|
||||
@ -30,8 +31,7 @@ const Home = () => {
|
||||
setIsLoadingMore(false)
|
||||
});
|
||||
|
||||
apiRequest('/skills/skills-on-main-page', {
|
||||
}).then((skills) => {
|
||||
apiRequest('/skills/skills-on-main-page', {}).then((skills) => {
|
||||
if (!skills) {
|
||||
return []
|
||||
}
|
||||
@ -54,12 +54,14 @@ const Home = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Header/>
|
||||
<div className='container'>
|
||||
|
||||
<Outstaffing/>
|
||||
<Description onLoadMore={loadMore} isLoadingMore={isLoadingMore}/>
|
||||
<Footer/>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user