partnerRequests

This commit is contained in:
2023-04-18 13:58:36 +03:00
parent 418b268425
commit 5067746178
7 changed files with 396 additions and 177 deletions

View File

@ -1,9 +1,15 @@
import React, {useState} from 'react';
import React, {useEffect, useState} from 'react';
import {Link, Navigate} from "react-router-dom";
import {useSelector, useDispatch} from 'react-redux'
import {getPartnerRequestId, getPartnerRequests, setPartnerRequestId} from '../../redux/outstaffingSlice'
import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
import {ProfileBreadcrumbs} from "../../components/ProfileBreadcrumbs/ProfileBreadcrumbs"
import {Footer} from "../../components/Footer/Footer";
import {Loader} from "../../components/Loader/Loader"
import {apiRequest} from "../../api/request";
import {getCorrectDate} from "../../components/Calendar/calendarHelper";
import arrowSwitchDate from "../../images/arrowViewReport.png";
import backEndImg from "../../images/QualificationInfo.png";
@ -17,20 +23,39 @@ export const PartnerBid = () => {
if(localStorage.getItem('role_status') !== '18') {
return <Navigate to="/profile" replace/>
}
const dispatch = useDispatch();
const requestId = useSelector(getPartnerRequestId);
const partnerRequests = useSelector(getPartnerRequests);
if (!requestId) {
return <Navigate to="/profile/requests" replace/>
}
useEffect(() => {
setLoader(true)
apiRequest(`/request/get-request?request_id=${requestId}`).then((el) => {
setRequestInfo(el)
setLoader(false)
})
}, [requestId]);
const [requestInfo, setRequestInfo] = useState({})
const [loader, setLoader] = useState(false)
const [mokPersons] = useState([
{
name: 'Дмитрий, PHP Back end - разработчик, Middle',
link: '',
link: '/candidate/110',
img: personImg
},
{
name: 'Дмитрий, PHP Back end - разработчик, Middle',
link: '',
link: '/candidate/111',
img: personImg
},
{
name: 'Дмитрий, PHP Back end - разработчик, Middle',
link: '',
link: '/candidate/112',
img: personImg
}
])
@ -45,84 +70,101 @@ export const PartnerBid = () => {
]}
/>
<h2 className='partnerBid__title'>Страница заявки </h2>
<div className='partnerBid__qualification'>
<h3>PHP разработчик</h3>
<div className='partnerBid__qualification__buttons'>
<button>Редактировать</button>
<img src={deleteBtn} alt='delete' />
</div>
</div>
<div className='partnerBid__switcher'>
<div className='partnerBid__switcher__prev switchDate'>
<img src={arrowSwitchDate} alt='arrow'/>
</div>
<p>Дата заявки : 19 декабря 2022 года </p>
<div className='partnerBid__switcher__next switchDate'>
<img src={arrowSwitchDate} alt='arrow'/>
</div>
</div>
<div className='table__wrapper'>
<table>
<thead>
<tr>
<th><p>Требования к стеку разработчика</p></th>
<th><p>Квалификация</p></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<p>
PHP приветствуется аккуратность в коде. MySQL - умение писать запросы к MySQL,
понимание как происходит запрос. Средний уровень: AJAX, JSON, общее понимание;
CSS/CSS3, HTML, Bootstrap;
</p>
</td>
<td>
<div className='qualification__info'>
<div className='img__wrapper'>
<img src={backEndImg} alt='backEndImg' />
{loader && <Loader />}
{!loader &&
<>
<div className='partnerBid__qualification'>
<h3>{requestInfo.title}</h3>
<div className='partnerBid__qualification__buttons'>
<button>Редактировать</button>
<img src={deleteBtn} alt='delete'/>
</div>
</div>
<div className='partnerBid__switcher'>
<div className={partnerRequests[partnerRequests.findIndex(el => el.id === requestId) - 1]?.id ? 'partnerBid__switcher__prev switchDate' : 'partnerBid__switcher__prev switchDate disable'}
onClick={() => {
dispatch(setPartnerRequestId(partnerRequests[partnerRequests.findIndex(el => el.id === requestId) - 1].id))
}}
>
<img src={arrowSwitchDate} alt='arrow'/>
</div>
<p>Дата заявки : {getCorrectDate(requestInfo.created_at)} </p>
<div className={partnerRequests[partnerRequests.findIndex(el => el.id === requestId) + 1]?.id ? 'partnerBid__switcher__next switchDate' : 'partnerBid__switcher__next switchDate disable'}
onClick={() => {
dispatch(setPartnerRequestId(partnerRequests[partnerRequests.findIndex(el => el.id === requestId) + 1].id))
}}
>
<img src={arrowSwitchDate} alt='arrow'/>
</div>
</div>
</>
}
{Boolean(Object.keys(requestInfo).length) && !loader &&
<div className='table__wrapper'>
<table>
<thead>
<tr>
<th><p>Требования к стеку разработчика</p></th>
<th><p>Квалификация</p></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<p>
{requestInfo.position.name}. &nbsp;
{requestInfo.skills.map((skill, index) => {
return <span key={skill.id}>{skill.name}
{requestInfo.skills.length > index + 1 ? ',' : '.'}
&nbsp;
</span>
})}
</p>
</td>
<td>
<div className='qualification__info'>
<div className='img__wrapper'>
<img src={backEndImg} alt='backEndImg' />
</div>
<p>{requestInfo.position.name}</p>
</div>
<p>Backend разработчик</p>
</div>
</td>
</tr>
<tr>
<td>
<p>
Знание современных фреймворков Laravel, Yii 2, FuelPHP, Симфони;
Знания по разработке REST API;
Знание PHP,HTML,CSS,MySQL,Pyhton,JavaScript.
</p>
</td>
<td>
<div className='qualification__info'>
<div className='img__wrapper'>
<img src={middle} alt='middleImg' />
</td>
</tr>
<tr>
<td>
<p>
{requestInfo.descr}
</p>
</td>
<td>
<div className='qualification__info'>
<div className='img__wrapper'>
<img src={middle} alt='middleImg' />
</div>
<p className='middle'>{requestInfo.level}</p>
</div>
<p className='middle'>Средний<br/>(Middle)</p>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
}
<div className='partnerBid__suitable'>
<div className='partnerBid__suitable__title'>
<p>Подходящие сотрудники по запросу</p>
</div>
<div className='partnerBid__suitable__persons'>
{mokPersons.map((person, index) => {
return <Link to='/candidate/110' key={index} className='partnerBid__suitable__person'>
return <div key={index} className='partnerBid__suitable__person'>
<img src={person.img} alt='avatar' />
<p>{person.name}</p>
<Link className='partnerBid__suitable__person__more' to='/candidate/110'>
<Link className='partnerBid__suitable__person__more' to={person.link}>
Подробнее
</Link>
<div className='partnerBid__suitable__person__info'>
</div>
</Link>
</div>
})
}
</div>

View File

@ -84,6 +84,11 @@
cursor: pointer;
}
.disable {
pointer-events: none;
opacity: 0.5;
}
&__prev {
transform: rotate(180deg);
}