Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5182 | Rev 5225 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3572 stevensc 1 
/* eslint-disable react/prop-types */
5182 stevensc 2 
import React, { useEffect, useState } from 'react'
2616 stevensc 3 
import { axios } from '../../utils'
5182 stevensc 4 
import CapsulesList from './CapsulesList'
5223 efrain 5 
import RewardsList from './RewardsList'
1 www 6 
 
5223 efrain 7 
 
5182 stevensc 8 
const MarketPlace = () => {
9 
  const [capsules, setCapsules] = useState([])
5223 efrain 10 
  const [rewards, setRewards] = useState([])
5182 stevensc 11 
  const [categories, setCategories] = useState([])
12 
  const [searchParams, setSearchParams] = useState({
13 
    search: '',
5223 efrain 14 
    category: 'rewards'
5182 stevensc 15 
  })
2620 stevensc 16 
 
5182 stevensc 17 
  const handleChange = ({ target }) => setSearchParams({ ...searchParams, [target.name]: target.value })
1 www 18 
 
5182 stevensc 19 
  const load = async (_search = searchParams.search, _entity = searchParams.category) => {
20 
    try {
21 
      const { data } = await axios.get('/marketplace?search=' + _search + '&entity=' + _entity)
5223 efrain 22 
 
23 
      if(_entity == 'capsules') {
24 
      	if (data.success) setCapsules(data.data)
25 
      }
26 
		if(_entity == 'rewards') {
27 
      	if (data.success) setRewards(data.data)
28 
      }
5182 stevensc 29 
    } catch (error) {
30 
      console.log('>>: error > ', error)
3753 stevensc 31 
    }
5182 stevensc 32 
  }
3753 stevensc 33 
 
5182 stevensc 34 
  const getCategories = async () => {
35 
    const categories = await axios.get('/marketplace/categories')
36 
    if (categories.data.data) {
37 
      const _categories = Object.keys(categories.data.data).map(element => {
38 
        return {
39 
          label: categories.data.data[element],
40 
          value: element
1 www 41 
        }
5182 stevensc 42 
      })
43 
      setCategories(_categories)
1 www 44 
    }
5182 stevensc 45 
  }
3753 stevensc 46 
 
5182 stevensc 47 
  const checkParams = () => {
48 
    const url = window.location.href
49 
    const hasEntity = url.includes('?entity=')
50 
    if (hasEntity) {
51 
      const value = url.split('?entity=')[1]
52 
      if (value) { setSearchParams({ ...searchParams, category: value }) }
1 www 53 
    }
5182 stevensc 54 
  }
3753 stevensc 55 
 
5182 stevensc 56 
  useEffect(() => {
57 
    getCategories()
58 
    checkParams()
59 
  }, [])
3753 stevensc 60 
 
5182 stevensc 61 
  useEffect(() => {
62 
    load(searchParams.search, searchParams.category)
63 
  }, [searchParams])
1 www 64 
 
5182 stevensc 65 
  return (
66 
        <section className="companies-info container">
67 
            <div className="market_admin_title_buttons">
68 
                <div className="form-group search_input">
69 
                    <input
70 
                        type="text"
71 
                        name="search"
72 
                        className="form-control"
73 
                        onChange={e => handleChange(e)}
74 
                        value={searchParams.search}
75 
                    />
76 
                    <button className='search-btn'>{LABELS.SEARCH}</button>
2616 stevensc 77 
                </div>
5182 stevensc 78 
                <div className="form-group search_categories">
79 
                    <select
5223 efrain 80 
                        name="category"
5182 stevensc 81 
                        className="form-control"
82 
                        value={searchParams.category}
83 
                        onChange={e => handleChange(e)}
84 
                    >
85 
                        <option value="">{LABELS.SELECT_CATEGORY}</option>
86 
                        {categories.map((element, i) =>
87 
                            <option value={element.value} key={i}>{element.label}</option>
88 
                        )}
89 
                    </select>
90 
                </div>
91 
            </div>
5223 efrain 92 
            {searchParams.category == 'capsules' &&
93 
            	<CapsulesList capsules={capsules} onEnroll={load}/>
94 
            }
95 
            {searchParams.category == 'rewards' &&
96 
            	<RewardsList rewards={rewards} onClaim={load}/>
97 
            	}
5182 stevensc 98 
        </section>
99 
  )
3572 stevensc 100 
}
101 
 
5182 stevensc 102 
export default MarketPlace