Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5223 | Rev 5228 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 5223 Rev 5225
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { useEffect, useState } from 'react'
 2 
import React, { useEffect, useState } from 'react'
- 
 
 3 
import { useDispatch } from 'react-redux'
- 
 
 4 
import { addNotification } from '../../redux/notification/notification.actions'
3 
import { axios } from '../../utils'
 5 
import { axios } from '../../utils'
4 
import CapsulesList from './CapsulesList'
 6 
import CapsulesList from './CapsulesList'
5 
import RewardsList from './RewardsList'
 7 
import RewardsList from './RewardsList'
Línea 6... Línea -...
6 
 
 - 
 
7 
 
 8 
 
8 
const MarketPlace = () => {
 9 
const MarketPlace = () => {
9 
  const [capsules, setCapsules] = useState([])
 10 
  const [capsules, setCapsules] = useState([])
10 
  const [rewards, setRewards] = useState([])
 11 
  const [rewards, setRewards] = useState([])
11 
  const [categories, setCategories] = useState([])
 12 
  const [categories, setCategories] = useState([])
12 
  const [searchParams, setSearchParams] = useState({
 - 
 
13 
    search: '',
 13 
  const [searchParams, setSearchParams] = useState({ search: '', category: 'rewards' })
14 
    category: 'rewards'
 - 
 
Línea 15... Línea 14...
15 
  })
 14 
  const dispatch = useDispatch()
Línea 16... Línea 15...
16 
 
 15 
 
17 
  const handleChange = ({ target }) => setSearchParams({ ...searchParams, [target.name]: target.value })
 16 
  const handleChange = ({ target }) => setSearchParams({ ...searchParams, [target.name]: target.value })
18 
 
 17 
 
19 
  const load = async (_search = searchParams.search, _entity = searchParams.category) => {
 18 
  const load = async (_search = searchParams.search, _entity = searchParams.category) => {
20 
    try {
 19 
    try {
21 
      const { data } = await axios.get('/marketplace?search=' + _search + '&entity=' + _entity)
 20 
      const { data: response } = await axios.get('/marketplace?search=' + _search + '&entity=' + _entity)
- 
 
 21 
 
22
22 
      if (!response.success) {
- 
 
 23 
        dispatch(addNotification({ style: 'danger', msg: response.data }))
- 
 
 24 
        return
- 
 
 25 
      }
- 
 
 26 
 
23 
      if(_entity == 'capsules') {
 27 
      if (_entity === 'capsules') {
24 
      	if (data.success) setCapsules(data.data)
 28 
        setCapsules(response.data)
25 
      }
 29 
      }
26 
		if(_entity == 'rewards') {
 30 
      if (_entity === 'rewards') {
27 
      	if (data.success) setRewards(data.data)
 31 
        setRewards(response.data)
28 
      }
 32 
      }
29 
    } catch (error) {
 33 
    } catch (error) {
Línea 61... Línea 65...
61 
  useEffect(() => {
 65 
  useEffect(() => {
62 
    load(searchParams.search, searchParams.category)
 66 
    load(searchParams.search, searchParams.category)
63 
  }, [searchParams])
 67 
  }, [searchParams])
Línea 64... Línea 68...
64 
 
 68 
 
65 
  return (
 69 
  return (
66 
        <section className="companies-info container">
 70 
    <section className="companies-info container">
67 
            <div className="market_admin_title_buttons">
 71 
      <div className="market_admin_title_buttons">
68 
                <div className="form-group search_input">
 72 
        <div className="form-group search_input">
69 
                    <input
 73 
          <input
70 
                        type="text"
 74 
            type="text"
71 
                        name="search"
 75 
            name="search"
72 
                        className="form-control"
 76 
            className="form-control"
73 
                        onChange={e => handleChange(e)}
 77 
            onChange={e => handleChange(e)}
74 
                        value={searchParams.search}
 78 
            value={searchParams.search}
75 
                    />
 79 
          />
76 
                    <button className='search-btn'>{LABELS.SEARCH}</button>
 80 
          <button className='search-btn'>{LABELS.SEARCH}</button>
77 
                </div>
 81 
        </div>
78 
                <div className="form-group search_categories">
 82 
        <div className="form-group search_categories">
79 
                    <select
 83 
          <select
80 
                        name="category"
 84 
            name="category"
81 
                        className="form-control"
 85 
            className="form-control"
82 
                        value={searchParams.category}
 86 
            value={searchParams.category}
83 
                        onChange={e => handleChange(e)}
 87 
            onChange={e => handleChange(e)}
84 
                    >
 88 
          >
85 
                        <option value="">{LABELS.SELECT_CATEGORY}</option>
 89 
            <option value="">{LABELS.SELECT_CATEGORY}</option>
86 
                        {categories.map((element, i) =>
 90 
            {categories.map((element, i) =>
87 
                            <option value={element.value} key={i}>{element.label}</option>
 91 
              <option value={element.value} key={i}>{element.label}</option>
88 
                        )}
 92 
            )}
89 
                    </select>
 93 
          </select>
90 
                </div>
 94 
        </div>
91 
            </div>
 - 
 
92 
            {searchParams.category == 'capsules' &&
- 
 
93 
            	<CapsulesList capsules={capsules} onEnroll={load}/>
 95 
      </div>
94 
            }
 96 
        <CapsulesList
95 
            {searchParams.category == 'rewards' &&
97 
        capsules={searchParams.category === 'capsules' ? capsules : rewards}
- 
 
 98 
        onEnroll={load}
96 
            	<RewardsList rewards={rewards} onClaim={load}/>
 99 
 
97 
            	}
 100 
        />
98 
        </section>
 101 
    </section>
99 
  )
 102 
  )
Línea 100... Línea 103...
100 
}
 103 
}