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

add async requests

Browse Source
This commit is contained in:
Hope87
2021-06-15 17:08:06 +03:00
parent b277082497
commit 1fac7bf50e
4 changed files with 41 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,16 +3,13 @@ import style from './Outstaffing.module.css';
import OutstaffingBlock from './OutstaffingBlock';
import TagSelect from '../Select/TagSelect';
const Outstaffing = ({ onhandleTabBar, selected, tabs }) => {
const Outstaffing = ({ onhandleTabBar, selected, tabs, tags }) => {
const [selectedItems, setSelectedItems] = useState([]);
const handleBlockClick = (item) => {
if (!selectedItems.find((el) => item === el.value)) {
setSelectedItems([...selectedItems, { value: item, label: item }]);
}
// else {
// setSelectedItems(selectedItems.filter((el) => item !== el.value));
// }
};
const handleSubmit = () => {
@ -41,6 +38,7 @@ const Outstaffing = ({ onhandleTabBar, selected, tabs }) => {
<div className="col-12 col-xl-4">
<OutstaffingBlock
data={tabs.find((item) => item.name === 'Frontend')}
dataTags={tags.flat().filter((tag) => tag.name === 'skills_front')}
onClick={(item) => handleBlockClick(item)}
onTabBarClick={(name) => onhandleTabBar(name)}
selected={selected === 'Frontend'}
@ -49,6 +47,7 @@ const Outstaffing = ({ onhandleTabBar, selected, tabs }) => {
<div className="col-12 col-xl-4">
<OutstaffingBlock
data={tabs.find((item) => item.name === 'Backend')}
dataTags={tags.flat().filter((tag) => tag.name === 'skills_back')}
onClick={(item) => handleBlockClick(item)}
onTabBarClick={(name) => onhandleTabBar(name)}
selected={selected === 'Backend'}
@ -57,6 +56,7 @@ const Outstaffing = ({ onhandleTabBar, selected, tabs }) => {
<div className="col-12 col-xl-4">
<OutstaffingBlock
data={tabs.find((item) => item.name === 'Design')}
dataTags={tags.flat().filter((tag) => tag.name === 'skills_design')}
onClick={(item) => handleBlockClick(item)}
onTabBarClick={(name) => onhandleTabBar(name)}
selected={selected === 'Design'}
@ -66,7 +66,7 @@ const Outstaffing = ({ onhandleTabBar, selected, tabs }) => {
</div>
</section>
<TagSelect
options={tabs}
options={tags}
selectedItems={selectedItems}
tagSubmit={handleSubmit}
setSelectedItems={setSelectedItems}

29
src/components/Outstaffing/OutstaffingBlock.js
View File

@ -1,17 +1,20 @@
import React from 'react';
import style from './Outstaffing.module.css';
const OutstaffingBlock = ({ data = {}, onClick, onTabBarClick, selected }) => {
const { img, text, tags, name, header } = data;
const OutstaffingBlock = ({ dataTags = [], data = {}, onClick, onTabBarClick, selected }) => {
const { header, img, text, name } = data;
let classes;
if (name === 'Backend') {
classes = style.back;
} else if (name === 'Design') {
classes = style.des;
} else if (name === 'Frontend') {
classes = style.front;
}
dataTags.forEach((el) => {
if (el.name === 'skills_back') {
classes = style.back;
} else if (el.name === 'skills_design') {
classes = style.des;
} else if (el.name === 'skills_front') {
classes = style.front;
}
});
return (
<div className={style.outstaffing__box}>
@ -24,11 +27,11 @@ const OutstaffingBlock = ({ data = {}, onClick, onTabBarClick, selected }) => {
</div>
<div className={`${selected ? style.mobile__block : style.mobile__none}`}>
<p className={style.outstaffing__box__text}>{text}</p>
{tags && (
{dataTags && (
<ul className={style.items}>
{tags.map((item) => (
<li key={item} onClick={() => onClick(item)}>
{item}
{dataTags.map((item) => (
<li key={item.id} onClick={() => onClick(item.value)}>
{item.value}
</li>
))}
</ul>