From fa1be4af89102e9175c4286836acb9ca055ad6ac Mon Sep 17 00:00:00 2001 From: marcusluis Date: Wed, 2 Feb 2022 09:23:44 -0300 Subject: [PATCH 1/5] commit --- .../src/components/Dropdown/Dropdown.jsx | 30 ------------------- 1 file changed, 30 deletions(-) diff --git a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx index d63bce8..bc8c12d 100644 --- a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx +++ b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx @@ -21,36 +21,6 @@ const Dropdown = () => { Mega-sena - -
  • - - Quina - -
    • - -
  • - - Lotofácil - -
    • - -
  • - - Lotomania - -
    • - -
  • - - Timemania - -
    • - -
  • - - Dia de sorte - -
    • From 341a96346f808bb92dac5c9061b99dd1a4273a71 Mon Sep 17 00:00:00 2001 From: marcusluis Date: Wed, 2 Feb 2022 18:43:32 -0300 Subject: [PATCH 2/5] endpoints criados --- .../src/components/Dropdown/Dropdown.jsx | 81 +++++++++++++++++-- .../RandomNumbers/RandomNumbers.jsx | 37 +-------- .../src/components/RandomNumbers/styled.jsx | 4 + .../src/constants/urls.jsx | 8 ++ 4 files changed, 92 insertions(+), 38 deletions(-) create mode 100644 semana23/brainn-front-end-challenge/src/constants/urls.jsx diff --git a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx index bc8c12d..8eb124b 100644 --- a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx +++ b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx @@ -1,4 +1,64 @@ +import axios from "axios"; +import { useEffect, useState } from "react"; +import { + BASE_URL, + CONCURSO_URL, + LOTERIA_CONCURSOS_URL, +} from "../../constants/urls"; +import { Circle } from "../RandomNumbers/styled"; + const Dropdown = () => { + const [selected, setSelected] = useState([]); + const [id, setId] = useState(); + const [concursos, setConcursos] = useState([]); + const [concursoSelecionado, setConcursoSelecionado] = useState({}); + + useEffect(() => { + axios + .get(`${BASE_URL}`) + .then((res) => { + setSelected(res.data); + }) + .catch((err) => { + console.error(err.message); + }); + }, []); + + useEffect(() => { + axios + .get(`${LOTERIA_CONCURSOS_URL}`) + .then((res) => { + setConcursos(res.data); + }) + .catch((err) => { + console.error(err.message); + }); + }, []); + + useEffect(() => { + console.log(id); + if (id !== undefined) { + console.log(concursos); + const concurso = concursos.find((item) => { + return item.loteriaId === id; + }); + + axios + .get(`${CONCURSO_URL}${concurso.concursoId}`) + .then((res) => { + console.log(res.data); + setConcursoSelecionado(res.data); + }) + .catch((err) => { + console.error(err.message); + }); + } + }, [id]); + + const onChangeValue = (id) => { + setId(id); + }; + return (
    @@ -16,14 +76,25 @@ const Dropdown = () => { className="dropdown-menu" aria-labelledby="dropdownMenuButton1" > -
  • - - Mega-sena - -
    • + {selected.map((item, index) => { + return ( +
  • onChangeValue(item.id)} + > + + {item.nome} + +
    • + ); + })}
    + + {concursoSelecionado.numeros} + +

    Mega-sena

    diff --git a/semana23/brainn-front-end-challenge/src/components/RandomNumbers/RandomNumbers.jsx b/semana23/brainn-front-end-challenge/src/components/RandomNumbers/RandomNumbers.jsx index 82debf0..d147129 100644 --- a/semana23/brainn-front-end-challenge/src/components/RandomNumbers/RandomNumbers.jsx +++ b/semana23/brainn-front-end-challenge/src/components/RandomNumbers/RandomNumbers.jsx @@ -1,40 +1,11 @@ -import { useState } from "react"; -import { Circle } from "./styled"; +import { Circle, Span } from "./styled"; const RandomNumbers = () => { - const [random, setRandom] = useState([]); - - const handleRandomNumber = () => { - const arr = []; - - while (arr.length < 6) { - const randomNumber = Math.floor(Math.random() * 60) + 1; - - if (arr.indexOf(randomNumber) === -1) { - arr.push(randomNumber); - } - } - - setRandom(arr); - }; - - const generate = random.map((num, index) => { - return ( -
    - -

    {num}

    -     -
    - ); - }); - return (
    -
    - -
    - -
    {generate}
    + + 00 +
    ); }; diff --git a/semana23/brainn-front-end-challenge/src/components/RandomNumbers/styled.jsx b/semana23/brainn-front-end-challenge/src/components/RandomNumbers/styled.jsx index 807dc1f..e213f79 100644 --- a/semana23/brainn-front-end-challenge/src/components/RandomNumbers/styled.jsx +++ b/semana23/brainn-front-end-challenge/src/components/RandomNumbers/styled.jsx @@ -9,3 +9,7 @@ export const Circle = styled.div` align-items: center; justify-content: center; `; + +export const Span = styled.span` + font-size: 2rem; +`; diff --git a/semana23/brainn-front-end-challenge/src/constants/urls.jsx b/semana23/brainn-front-end-challenge/src/constants/urls.jsx new file mode 100644 index 0000000..358e883 --- /dev/null +++ b/semana23/brainn-front-end-challenge/src/constants/urls.jsx @@ -0,0 +1,8 @@ +export const BASE_URL = + "https://brainn-api-loterias.herokuapp.com/api/v1/loterias"; + +export const LOTERIA_CONCURSOS_URL = + "https://brainn-api-loterias.herokuapp.com/api/v1/loterias-concursos"; + +export const CONCURSO_URL = + "https://brainn-api-loterias.herokuapp.com/api/v1/concursos/"; From 649176a49effd2d9bc1f04e4b85ad8067f686993 Mon Sep 17 00:00:00 2001 From: marcusluis Date: Thu, 3 Feb 2022 13:03:18 -0300 Subject: [PATCH 3/5] renderiza numeros na tela nao funciona --- .../src/components/Dropdown/Dropdown.jsx | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx index 8eb124b..2f26a08 100644 --- a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx +++ b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx @@ -5,7 +5,7 @@ import { CONCURSO_URL, LOTERIA_CONCURSOS_URL, } from "../../constants/urls"; -import { Circle } from "../RandomNumbers/styled"; +import { Circle, Span } from "../RandomNumbers/styled"; const Dropdown = () => { const [selected, setSelected] = useState([]); @@ -91,9 +91,14 @@ const Dropdown = () => {
    - - {concursoSelecionado.numeros} - + {concursoSelecionado.numeros && + concursoSelecionado.numeros.map((item, index) => { + return ( + + {item.numeros} + + ); + })}

    Mega-sena

    From 26742b7a2596a42c12013a0decdf81b1264100dd Mon Sep 17 00:00:00 2001 From: marcusluis Date: Thu, 3 Feb 2022 17:14:14 -0300 Subject: [PATCH 4/5] numeros estao sendo renderizados na tela --- .../src/components/Dropdown/Dropdown.jsx | 23 ++++++++++--------- 1 file changed, 12 insertions(+), 11 deletions(-) diff --git a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx index 2f26a08..b276754 100644 --- a/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx +++ b/semana23/brainn-front-end-challenge/src/components/Dropdown/Dropdown.jsx @@ -9,7 +9,7 @@ import { Circle, Span } from "../RandomNumbers/styled"; const Dropdown = () => { const [selected, setSelected] = useState([]); - const [id, setId] = useState(); + const [mostraConcurso, setMostraConcurso] = useState({}); const [concursos, setConcursos] = useState([]); const [concursoSelecionado, setConcursoSelecionado] = useState({}); @@ -36,11 +36,11 @@ const Dropdown = () => { }, []); useEffect(() => { - console.log(id); - if (id !== undefined) { + console.log(mostraConcurso); + if (mostraConcurso.id !== undefined) { console.log(concursos); const concurso = concursos.find((item) => { - return item.loteriaId === id; + return item.loteriaId === mostraConcurso.id; }); axios @@ -53,10 +53,10 @@ const Dropdown = () => { console.error(err.message); }); } - }, [id]); + }, [mostraConcurso]); - const onChangeValue = (id) => { - setId(id); + const onChangeValue = (mostraConcurso) => { + setMostraConcurso(mostraConcurso); }; return ( @@ -69,7 +69,7 @@ const Dropdown = () => { data-bs-toggle="dropdown" aria-expanded="false" > - Selecione uma opção + {mostraConcurso.nome || "Selecione uma opção"}