Achei beeem dificil e quebrei a cabeça varias vezes, no final deu tudo certo mas acho que o código ficou desnecessariamente grande e meio bagunçado
let produtosNoCarrinho = [];
function adicionar() {
let produto = document.getElementById("produto").value;
let dividindoProduto = produto.split(" - ", 2);
let valorProduto = dividindoProduto[1];
valorProduto = replace(valorProduto);
let nomeProduto = dividindoProduto[0];
let totalelemento = document.getElementById("valor-total");
let total = replace(totalelemento.textContent);
let quantidade = parseInt(document.getElementById("quantidade").value);
if (isNaN(quantidade)) {
quantidade = 1;
}
let produtoExistente = produtosNoCarrinho.find(p => p.nome === nomeProduto);
if (produtoExistente) {
produtoExistente.quantidade += quantidade;
} else {
let novoProduto = {
nome: nomeProduto,
quantidade: quantidade,
valor: valorProduto
};
produtosNoCarrinho.push(novoProduto);
}
let listaProdutosElemento = document.getElementById("lista-produtos");
listaProdutosElemento.innerHTML = "";
produtosNoCarrinho.forEach(prod => {
let novoProdutoElemento = document.createElement("section");
novoProdutoElemento.classList.add("carrinho__produtos__produto");
let quantidadeElemento = document.createElement("span");
quantidadeElemento.textContent = `${prod.quantidade}x `;
textoAzul(quantidadeElemento);
novoProdutoElemento.appendChild(quantidadeElemento);
let nomeElemento = document.createElement("span");
nomeElemento.textContent = `${prod.nome} `;
novoProdutoElemento.appendChild(nomeElemento);
let valorElemento = document.createElement("span");
valorElemento.textContent = `R$${(prod.valor * prod.quantidade)}`;
textoAzul(valorElemento);
novoProdutoElemento.appendChild(valorElemento);
listaProdutosElemento.appendChild(novoProdutoElemento);
});
let novoTotal = produtosNoCarrinho.reduce((acc, prod) => acc + (prod.valor * prod.quantidade), 0);
let totalFormatado = "R$" + novoTotal;
totalelemento.textContent = totalFormatado;
}
function limpar() {
let limpandoProdutosCarrinho = document.getElementById("lista-produtos");
while (limpandoProdutosCarrinho.firstChild) {
limpandoProdutosCarrinho.removeChild(limpandoProdutosCarrinho.firstChild);
}
let limpandoTotal = document.getElementById("valor-total");
limpandoTotal.innerHTML = "R$0,00";
let limpandoQuantidade = document.getElementById("quantidade").value = "";
produtosNoCarrinho = [];
}
a
function replace(variavel) {
variavel = variavel.replace("R$", "");
variavel = parseFloat(variavel);
return variavel;
}
function textoAzul(elemento) {
elemento.classList.add("texto-azul");
}