@ -1,137 +1,147 @@
import React , { use State } from "react" ;
import { useDispatch } from "react-redux"
import { Link } from "react-router-dom"
import React , { use Effect, use State } from "react" ;
/ / i m p o r t { u s e D i s p a t c h } f r o m " r e a c t - r e d u x "
/ / i m p o r t { L i n k } f r o m " r e a c t - r o u t e r - d o m "
import { Navigate } from "react-router-dom" ;
import { setPartnerEmployees } from "@redux/outstaffingSlice" ;
/ / i m p o r t { s e t P a r t n e r E m p l o y e e s } f r o m " @ r e d u x / o u t s t a f f i n g S l i c e " ;
import { Footer } from "@components/Common/Footer/Footer" ;
import PartnerPersonCard from "@components/PartnerPersonCard/PartnerPersonCard" ;
import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadcrumbs" ;
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader" ;
import { Navigation } from "@components/Navigation/Navigation" ;
import rightArrow from "assets/icons/arrows/arrowRight.svg" ;
import avatarImg from "assets/images/avatarMok.png" ;
import AdminImg from "assets/images/partnerProfile/PersonalAdmin.svg" ;
import ArchitectureImg from "assets/images/partnerProfile/PersonalArchitecture.svg" ;
import CopyImg from "assets/images/partnerProfile/PersonalCopy.svg" ;
import DesignImg from "assets/images/partnerProfile/PersonalDesign.svg" ;
import FrontendImg from "assets/images/partnerProfile/PersonalFrontend.svg" ;
import ManageImg from "assets/images/partnerProfile/PersonalMng.svg" ;
import SmmImg from "assets/images/partnerProfile/PersonalSMM.svg" ;
import TestImg from "assets/images/partnerProfile/PersonalTesters.svg" ;
import BackEndImg from "assets/images/partnerProfile/personalBackEnd.svg" ;
import { apiRequest } from "@api/request" ;
/ / i m p o r t r i g h t A r r o w f r o m " a s s e t s / i c o n s / a r r o w s / a r r o w R i g h t . s v g " ;
/ / i m p o r t a v a t a r I m g f r o m " a s s e t s / i m a g e s / a v a t a r M o k . p n g " ;
/ / i m p o r t A d m i n I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l A d m i n . s v g " ;
/ / i m p o r t A r c h i t e c t u r e I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l A r c h i t e c t u r e . s v g " ;
/ / i m p o r t C o p y I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l C o p y . s v g " ;
/ / i m p o r t D e s i g n I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l D e s i g n . s v g " ;
/ / i m p o r t F r o n t e n d I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l F r o n t e n d . s v g " ;
/ / i m p o r t M a n a g e I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l M n g . s v g " ;
/ / i m p o r t S m m I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l S M M . s v g " ;
/ / i m p o r t T e s t I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / P e r s o n a l T e s t e r s . s v g " ;
/ / i m p o r t B a c k E n d I m g f r o m " a s s e t s / i m a g e s / p a r t n e r P r o f i l e / p e r s o n a l B a c k E n d . s v g " ;
import { Navigation } from "../../components/Navigation/Navigation" ;
import "./partnerС ;
export const PartnerCategories = ( ) => {
const dispatch = useDispatch ( )
/ / c o n s t d i s p a t c h = u s e D i s p a t c h ( )
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 [ staff , setStaff ] = useState ( [ ] )
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
}
] ) ;
useEffect ( ( ) => {
apiRequest ( "/project/my-employee" ) . then ( ( el ) => {
setStaff ( el . managerEmployees )
} )
} , [ ] )
/ / c o n s t [ p e r s o n a l I n f o I t e m s ] = u s e S t a t e ( [
/ / {
/ / t i t l e : " B a c k e n d р а з р а б о т ч и к и " ,
/ / l i n k : " / p r o f i l e / c a t e g o r i e s / e m p l o y e e s " ,
/ / d e s c r i p t i o n :
/ / " J a v a P H P P y t h o n C # R e a c t V u e . j s N o d e J s G o l a n g R u b y J a v a S c r i p t " ,
/ / a v a i l a b l e : t r u e ,
/ / i m g : B a c k E n d I m g
/ / } ,
/ / {
/ / t i t l e : " F r o n t e n d р а з р а б о т ч и к и " ,
/ / l i n k : " / p r o f i l e / c a t e g o r i e s / e m p l o y e e s " ,
/ / d e s c r i p t i o n :
/ / " J a v a P H P P y t h o n C # R e a c t V u e . j s N o d e J s G o l a n g R u b y J a v a S c r i p t " ,
/ / a v a i l a b l e : t r u e ,
/ / i m g : F r o n t e n d I m g
/ / } ,
/ / {
/ / t i t l e : " А р х и т е к т у р а п р о е к т о в " ,
/ / l i n k : " / p r o f i l e / c a t e g o r i e s / e m p l o y e e s " ,
/ / d e s c r i p t i o n : " П о т о к и д а н н ы х E R E R P C R M C Q R S U M L B P M N " ,
/ / a v a i l a b l e : t r u e ,
/ / i m g : A r c h i t e c t u r e I m g
/ / } ,
/ / {
/ / t i t l e : " Д и з а й н п р о е к т о в " ,
/ / l i n k : " / p r o f i l e / c a t e g o r i e s / e m p l o y e e s " ,
/ / d e s c r i p t i o n :
/ / " J a v a P H P P y t h o n C # R e a c t V u e . j s N o d e J s G o l a n g R u b y J a v a S c r i p t " ,
/ / a v a i l a b l e : t r u e ,
/ / i m g : D e s i g n I m g
/ / } ,
/ / {
/ / t i t l e : " Т е с т и р о в а н и е п р о е к т о в " ,
/ / l i n k : " / p r o f i l e / a d d - r e q u e s t " ,
/ / d e s c r i p t i o n : " S Q L P o s t m a n T e s t R a i l K i b a n a Р у ч н о е т е с т и р о в а н и е " ,
/ / a v a i l a b l e : f a l s e ,
/ / i m g : T e s t I m g
/ / } ,
/ / {
/ / t i t l e : " А д м и н и с т р и р о в а н и е п р о е к т о в " ,
/ / l i n k : " / p r o f i l e / a d d - r e q u e s t " ,
/ / d e s c r i p t i o n : " D e v O p s E L K K u b e r n e t e s D o c k e r B a s h A p a c h e O r a c l e G i t " ,
/ / a v a i l a b l e : f a l s e ,
/ / i m g : A d m i n I m g
/ / } ,
/ / {
/ / t i t l e : " У п р а в л е н и е п р о е к т о м " ,
/ / l i n k : " / p r o f i l e / a d d - r e q u e s t " ,
/ / d e s c r i p t i o n : " S c r u m K a n b a n A g i l e M i r o C u s t D e v " ,
/ / a v a i l a b l e : f a l s e ,
/ / i m g : M a n a g e I m g
/ / } ,
/ / {
/ / t i t l e : " К о п и р а й т и н г п р о е к т о в " ,
/ / l i n k : " / p r o f i l e / a d d - r e q u e s t " ,
/ / d e s c r i p t i o n : " Т е г и З а г о л о в о к H 1 Д е с к р и п т о р А б з а ц С ц е н а р и й " ,
/ / a v a i l a b l e : f a l s e ,
/ / i m g : C o p y I m g
/ / } ,
/ / {
/ / t i t l e : " Р е к л а м а и S M M " ,
/ / l i n k : " / p r o f i l e / a d d - r e q u e s t " ,
/ / d e s c r i p t i o n :
/ / " J a v a P H P P y t h o n C # R e a c t V u e . j s N o d e J s G o l a n g R u b y J a v a S c r i p t " ,
/ / a v a i l a b l e : f a l s e ,
/ / i m g : S m m I m g
/ / }
/ / ] ) ;
/ / c o n s t [ m o k P e r s o n s ] = u s e S t a t e ( [
/ / {
/ / p e r s o n A v a t a r : a v a t a r I m g ,
/ / n a m e : " М а к а р е н к о Д м и т р и й " ,
/ / q u a l i f i c a t i o n : " P H P B a c k e n d - р а з р а б о т ч и к " ,
/ / l e v e l : " M i d d l e " ,
/ / p r o j e c t : " А д м и н к а Н В Д К о н с а л т и н г " ,
/ / t a s k s _ i n _ p r o g r e s s : 5 ,
/ / m o n t h _ h o u r s : 1 4 0 ,
/ / i d : 1
/ / } ,
/ / {
/ / p e r s o n A v a t a r : a v a t a r I m g ,
/ / n a m e : " М а к а р е н к о Д м и т р и й " ,
/ / q u a l i f i c a t i o n : " P H P B a c k e n d - р а з р а б о т ч и к " ,
/ / l e v e l : " M i d d l e " ,
/ / p r o j e c t : " А д м и н к а Н В Д К о н с а л т и н г " ,
/ / t a s k s _ i n _ p r o g r e s s : 5 ,
/ / m o n t h _ h o u r s : 1 4 0 ,
/ / i d : 2
/ / } ,
/ / {
/ / p e r s o n A v a t a r : a v a t a r I m g ,
/ / n a m e : " М а к а р е н к о Д м и т р и й " ,
/ / q u a l i f i c a t i o n : " P H P B a c k e n d - р а з р а б о т ч и к " ,
/ / l e v e l : " M i d d l e " ,
/ / p r o j e c t : " А д м и н к а Н В Д К о н с а л т и н г " ,
/ / t a s k s _ i n _ p r o g r e s s : 5 ,
/ / m o n t h _ h o u r s : 1 4 0 ,
/ / i d : 3
/ / }
/ / ] ) ;
return (
< div className = "partnerCategories" >
< ProfileHeader / >
@ -145,39 +155,42 @@ export const PartnerCategories = () => {
/ >
< 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 >
) ;
{ staff . map ( ( card ) => {
return < PartnerPersonCard key = { card . id } name = { card . employee . fio } img = { card . employee . avatar } userId = { card . user _id } / >
} ) }
{ /*{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>У }
{ /* <button>Подобрать</button>*/ }
{ /* </div>*/ }
{ /* )}*/ }
{ /* </Link>*/ }
{ /* );*/ }
{ /*})}*/ }
< / div >
< / div >
< Footer / >
Mikola