Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 2723 Rev 3572
Línea -... Línea 1...
- 
 
 1 
/* eslint-disable react/prop-types */
1 
import React from 'react'
 2 
import React from 'react'
2 
import { axios } from '../../utils'
 3 
import { axios } from '../../utils'
3 
import Slider from "react-slick";
 4 
import Slider from "react-slick";
4 
import styled from 'styled-components';
 5 
import styled from 'styled-components';
5 
// import "slick-carousel/slick/slick.css";
- 
 
6 
// import "slick-carousel/slick/slick-theme.css";
 - 
 
Línea 7... Línea 6...
7 
 
 6 
 
8 
const StyledSlider = styled(Slider)`c
 7 
const StyledSlider = styled(Slider)`c
9 
    .slick-list {
 8 
    .slick-list {
10 
        padding: 0 !important;
 9 
        padding: 0 !important;
Línea 58... Línea 57...
58 
            onClick={onClick}
 57 
            onClick={onClick}
59 
        />
 58 
        />
60 
    );
 59 
    );
61 
}
 60 
}
Línea 62... Línea 61...
62 
 
 61 
 
63 
export default props => {
 62 
const MarketPlace = props => {
64 
    const [categories, setCategories] = React.useState([])
 63 
    const [categories, setCategories] = React.useState([])
65 
    const [category, setCategory] = React.useState('capsules')
 64 
    const [category, setCategory] = React.useState('capsules')
66 
    const [title, setTitle] = React.useState('Cápsulas de Microaprendizaje')
 65 
    const [title, setTitle] = React.useState('Cápsulas de Microaprendizaje')
67 
    const [capsules, setCapsules] = React.useState([])
 66 
    const [capsules, setCapsules] = React.useState([])
Línea 103... Línea 102...
103 
        checkParams()
 102 
        checkParams()
104 
    }, [])
 103 
    }, [])
Línea 105... Línea 104...
105 
 
 104 
 
106 
    const enroll = async url => {
 105 
    const enroll = async url => {
107 
        try {
 106 
        try {
108 
            const res = await axios.post(url)
 107 
            await axios.post(url)
109 
            load()
 108 
            load()
110 
        } catch (error) {
 109 
        } catch (error) {
111 
            console.log('>>: error > ', error)
 110 
            console.log('>>: error > ', error)
112 
        }
 111 
        }
Línea 172... Línea 171...
172 
                                            setCategory(e.target.value)
 171 
                                            setCategory(e.target.value)
173 
                                            load(search, e.target.value)
 172 
                                            load(search, e.target.value)
174 
                                        }}
 173 
                                        }}
175 
                                    >
 174 
                                    >
176 
                                        <option value="">Seleccione una categoria</option>
 175 
                                        <option value="">Seleccione una categoria</option>
177 
                                        {
 - 
 
178 
                                            categories.map((element, i) =>
 176 
                                        {categories.map((element, i) =>
179 
                                                <option value={element.value} key={i.toString()}>
 177 
                                            <option value={element.value} key={i.toString()}>
180 
                                                    {element.label}
 178 
                                                {element.label}
181 
                                                </option>
 179 
                                            </option>
182 
                                            )
 - 
 
183 
                                        }
 180 
                                        )}
184 
                                    </select>
 181 
                                    </select>
185 
                                </div>
 182 
                                </div>
186 
                            </div>
 183 
                            </div>
187 
                        </form>
 184 
                        </form>
188 
                    </div>
 185 
                    </div>
189 
                    <div className="list-col">
 186 
                    <div className="list-col">
190 
                        <h3 className="p-2" style={{ fontWeight: '700' }}>{title}</h3>
 187 
                        <h3 className="p-2" style={{ fontWeight: '700' }}>{title}</h3>
191 
                        <StyledSlider {...settings}>
 188 
                        <StyledSlider {...settings}>
192 
                            {
 - 
 
193 
                                capsules.map((element, i) => {
 189 
                            {capsules.map((element) =>
194 
                                    return (
 - 
 
195 
                                        <div className="w-100" key={element.name}>
 190 
                                <div className="w-100" key={element.name}>
196 
                                            <div className="marketplace_card">
 191 
                                    <div className="marketplace_card">
197 
                                                <div className="microlearning-up-info">
 192 
                                        <div className="microlearning-up-info">
198 
                                                    <img src={element.image} alt={element.name} />
 193 
                                            <img src={element.image} alt={element.name} />
199 
                                                    <h3>{element.name}</h3>
 194 
                                            <h3>{element.name}</h3>
200 
                                                    <h4>{props.backendVars.labelStatus} : {element.status}</h4>
 195 
                                            <h4>{props.backendVars.labelStatus} : {element.status}</h4>
201 
                                                    {
 196 
                                            {element.link_enroll &&
202 
                                                        element.link_enroll &&
 197 
                                                <ul>
203 
                                                        <ul>
 198 
                                                    <li>
204 
                                                            <li>
 199 
                                                        <a
205 
                                                                <a
 200 
                                                            href='#'
206 
                                                                    onClick={() => enroll(element.link_enroll)}
 201 
                                                            onClick={(e) => {
207 
                                                                    title={'Seleccionar: ' + element.name}
 202 
                                                                e.preventDefault()
208 
                                                                    className="btn btn-primary cursor-pointer"
 203 
                                                                enroll(element.link_enroll)
209 
                                                                >
 204 
                                                            }}
210 
                                                                    {props.backendVars.labelEnroll}
 205 
                                                            title={'Seleccionar: ' + element.name}
211 
                                                                </a>
 206 
                                                            className="btn btn-primary cursor-pointer">
212 
                                                            </li>
 207 
                                                            {props.backendVars.labelEnroll}
213 
                                                        </ul>
 208 
                                                        </a>
214 
                                                    }
 209 
                                                    </li>
215 
                                                </div>
 210 
                                                </ul>
216 
                                            </div>
 211 
                                            }
217 
                                        </div>
 212 
                                        </div>
218 
                                    )
 213 
                                    </div>
219 
                                })
 214 
                                </div>
220 
                            }
 215 
                            )}
221 
                        </StyledSlider>
 216 
                        </StyledSlider>
222 
                    </div>
 217 
                    </div>
223 
                </div>
 218 
                </div>
224 
            </section>
 219 
            </section>
225 
        </React.Fragment>
 220 
        </React.Fragment>
226 
    );
 221 
    );
227 
}
 - 
 
228 

            222
            
}

          

          

            -
            
 

            223
            
 

          

          

            -
            
 

            224
            
export default MarketPlace;

          

          

            -
            
 

            225
            

          

          

            229
            

            226