diff --git a/css/styles.css b/css/styles.css index 1c4a8e9..3331996 100644 --- a/css/styles.css +++ b/css/styles.css @@ -218,7 +218,7 @@ section .conteudo { .nosso-cardapio .conteudo .cardapio-opcao .opcao h2 { width: 187px; text-align: center; - background-image: url(/image/opcoesfundo.png); + background-image: url(../image/opcoesfundo.png); background-position: center; background-size: cover; background-repeat: no-repeat; diff --git a/index.html b/index.html index 6d69796..b1b4e9f 100644 --- a/index.html +++ b/index.html @@ -484,7 +484,7 @@

Resumo

Desconto -R$ 10,00

Total da compra R$ 27,00

- + diff --git a/js/script.js b/js/script.js index 44b9e3c..582db40 100644 --- a/js/script.js +++ b/js/script.js @@ -1,3 +1,10 @@ +let dadosUsuarioCep = { + localidade: ``, + bairro: ``, + logradouro: ``, + numero: `` +} + const modalOn = () => { const modal = document.querySelector('.modal-off') const navbar = document.querySelector('.nav-bar') @@ -23,16 +30,19 @@ const buscaCep = () => { return res.json(); }) .then((data) => { - /* criar um objeto global e depois passar aqui para pegar os dados do cliente - */ + const { localidade, bairro, logradouro } = data; + dadosUsuarioCep.localidade = localidade; + dadosUsuarioCep.bairro = bairro; + dadosUsuarioCep.logradouro = logradouro; - /* falta pegar o numero da casa */ resumoCep.innerHTML = ` -

${data.localidade}

-

${data.bairro}

-

${data.logradouro}

+

${localidade}

+

${bairro}

+

${logradouro}

`; + + document.querySelector('#numero').addEventListener('input', pegarNumeroCasa) }) .catch((error) => { console.error(error); @@ -40,9 +50,29 @@ const buscaCep = () => { }); } +const pegarNumeroCasa = (event) => { + dadosUsuarioCep.numero = event.target.value +} + +const finalizarPedido = () => { + alert(` + Pedido Finalizado com Sucesso! + ========================================= + Cidade: ${dadosUsuarioCep.localidade} + bairro: ${dadosUsuarioCep.bairro} + rua: ${dadosUsuarioCep.logradouro} n: ${dadosUsuarioCep.numero} + ========================================= + + Volte sempre :) + `) +} + const carrinhoCompra = document.querySelector('.carrinho-compras') carrinhoCompra.addEventListener('click', modalOn) const botaoCep = document.querySelector('#botao-cep') -botaoCep.addEventListener('click', buscaCep) \ No newline at end of file +botaoCep.addEventListener('click', buscaCep) + +const botaoFinalizarPedido = document.querySelector('#finalizar-pedido') +botaoFinalizarPedido.addEventListener('click', finalizarPedido) \ No newline at end of file