diff --git a/src/Components/Seats.js b/src/Components/Seats.js index f37e4b8..0def3e4 100644 --- a/src/Components/Seats.js +++ b/src/Components/Seats.js @@ -3,7 +3,7 @@ import selecionado from "../assets/img/selecionado.png"; import disponivel from "../assets/img/disponivel.png"; import indisponivel from "../assets/img/indisponivel.png"; import { useEffect, useState } from "react"; -import { useParams } from "react-router-dom"; +import { useNavigate, useParams } from "react-router-dom"; import axios from "axios"; import Seat from "./Seat"; @@ -14,13 +14,19 @@ export default function Seats() { const [nameSeat, SetNameseat] = useState([]) const [nameClient, setNameclient] = useState("") const [cpf, setCpf] = useState("") + const [title, setTitle] = useState("") + const [day, setDay] = useState("") + const [time, setTime] = useState("") + const navegate = useNavigate() useEffect(() => { const promisse = axios.get(`https://mock-api.driven.com.br/api/v5/cineflex/showtimes/${sessionId}/seats`) promisse.then((res) => { setSeats(res.data) - console.log(seat) + setTitle(res.data.movie.title) + setDay(res.data.day.date) + setTime(res.data.name) }) promisse.catch((error) => { @@ -31,7 +37,8 @@ export default function Seats() { function SubmitForm(e){ e.preventDefault() - + + const body = { ids: places, name: nameClient, @@ -42,7 +49,11 @@ export default function Seats() { const promisse = axios.post("https://mock-api.driven.com.br/api/v5/cineflex/seats/book-many", body) - promisse.then(() => console.log('deu certo') ) + promisse.then(() => { + navegate("/sucess", {state: nameClient, cpf, title, time, day, nameSeat}) + }) + + } return ( @@ -90,14 +101,14 @@ export default function Seats() { value={cpf} required /> + - diff --git a/src/Components/Sucess.js b/src/Components/Sucess.js index 05c1ca8..fc754da 100644 --- a/src/Components/Sucess.js +++ b/src/Components/Sucess.js @@ -1,6 +1,9 @@ +import { useLocation } from "react-router-dom" import styled from "styled-components" +import { Link } from "react-router-dom" export default function Sucess(){ + const {nameClient, cpf, title, time, day, nameSeat} = useLocation().state return( <> @@ -9,22 +12,24 @@ export default function Sucess(){

Filme e Sessão

-

Filme escolhido

-

DD/MM/AAAA 00:00

+

{title}

+

{day} - {time}

Ingressos

-

Assento 00

+ {nameSeat?.map((s, i) => ( +

Assento {s}

+ ))}

Comprador

-

Nome:

-

Cpf:

+

Nome: {nameClient}

+

CPF: {cpf}

- + + + ) } @@ -52,6 +57,3 @@ const DefaultSucess = styled.p` margin-bottom: 8px; } ` -const Button = styled.button` - -` \ No newline at end of file