Olá a todos,
em um Post anterior aqui no Forum deste curso eu argumentei quanto a possibilidade de alterar diretamente as quantidades de compra diretamente na página do carrinho. Nessa ocasião o Paulo Alves Junior deu várias sujestões e então eu implementei esta funcionalidade no carrinho de compras e tentei deixar o mais próximo possível do carrinho de compras da casa do código, implementei as funções do botão atualizar e substitui o button de remoção de produto por um link, exatamente como na casa do código, segue o código abaixo`do meu carrinho de compras:
<section class="infoSection container">
<h2 class="infoSection-titulo">Seu carrinho
(${carrinhoCompras.quantidade})</h2>
<form action="${spring:mvcUrl('CCC#update').build()}">
<table class="formularioDoCarrinho-tabela">
<thead class="formularioDoCarrinho-cabecalho">
<tr>
<th></th>
<th class="formularioDoCarrinho-cabecalho-item">Item</th>
<th
class="formularioDoCarrinho-cabecalho-item formularioDoCarrinho-cabecalho-preco">Preço</th>
<th class="formularioDoCarrinho-cabecalho-item">Qtd</th>
<th class="formularioDoCarrinho-cabecalho-item">Total</th>
<th></th>
</tr>
</thead>
<tbody>
<c:forEach items="${carrinhoCompras.itens}" var="item">
<tr>
<td class="formularioDoCarrinho-item"><a
href="/products/livro-apis-nodejs"> <img
class="formularioDoCarrinho-item-imagem"
src="//cdn.shopify.com/s/files/1/0155/7645/products/zGb75MbYhQ0_Rc954-y3OZOq9O169BSqY0WslUDTmBk_size_mode_3_size_1024x768_small.jpeg?v=1453497826" />
</a></td>
<td class="formularioDoCarrinho-item">
<h2 class="formularioDoCarrinho-item-titulo">${item.produto.titulo }</h2>
</td>
<td
class="formularioDoCarrinho-item formularioDoCarrinho-item-preco">${item.preco}</td>
<td class="formularioDoCarrinho-item"><input
class="formularioDoCarrinho-item-quantidade" type="number"
min="0" id="quantidade" name="quantidade"
value="${carrinhoCompras.getQuantidade(item)}"></td>
<td
class="formularioDoCarrinho-item formularioDoCarrinho-item-precoTotal">${carrinhoCompras.getTotal(item)}</td>
<td class="formularioDoCarrinho-item">
<a href="${spring:mvcUrl('CCC#remover').arg(0,item.produto.id).arg(1,item.tipoPreco).build()}">
<img class="formularioDoCarrinho-item-remover-imagem" src="//cdn.shopify.com/s/files/1/0155/7645/t/196/assets/trash.png?10584220066651581615" alt="X" title="Remover">
</a>
</td>
</tr>
</c:forEach>
</tbody>
<tfoot class="formularioDoCarrinho-rodape">
<tr>
<td
class="formularioDoCarrinho-rodape-item formularioDoCarrinho-finalizar"
colspan="3">
</td>
<td class="formularioDoCarrinho-rodape-item">
<button class="formularioDoCarrinho-atualizar" type="submit"
class="update-cart" name="update">Atualizar</button>
</td>
<td class="formularioDoCarrinho-rodape-item">
${carrinhoCompras.total}</td>
<td></td>
</tr>
</tfoot>
</table>
</form>
<form action="${spring:mvcUrl('PC#finalizar').build()}"
method="post">
<button class="formularioDoCarrinho-finalizar-botao"
type="submit" name="checkout">Finalizar<span
class="formularioDoCarrinho-finalizar-botao-texto"
role="presentation"> compra</span>
</button>
</form>
</section>
@Controller
@RequestMapping("/carrinho")
@Scope(value=WebApplicationContext.SCOPE_SESSION)
public class CarrinhoCompraController implements Serializable{
private static final long serialVersionUID = 1L;
@Autowired
private ProdutoDAO produtoDAO;
@Autowired
private CarrinhoCompras carrinho;
@Autowired
private HttpServletRequest request;
@RequestMapping("/add")
public ModelAndView add(Integer produtoId,TipoPreco tipoPreco){
CarrinhoItem carrinhoItem = criaItem(produtoId,tipoPreco);
carrinho.add(carrinhoItem);
ModelAndView modelAndView = new ModelAndView("redirect:/carrinho");
return modelAndView;
}
@RequestMapping(method=RequestMethod.GET)
public ModelAndView itens(){
ModelAndView modelAndView = new ModelAndView("/carrinho/itens");
return modelAndView;
}
@RequestMapping("/remover")
public ModelAndView remover(Integer produtoId,TipoPreco tipoPreco){
carrinho.remover(produtoId,tipoPreco);
return new ModelAndView("redirect:/carrinho");
}
//Método Novo
@RequestMapping("/update")
public ModelAndView update(){
String[] quantidades = request.getParameterValues("quantidade");
Iterator<CarrinhoItem> it = carrinho.getItens().iterator();
int i = 0;
while(it.hasNext()){
CarrinhoItem item =(CarrinhoItem) it.next();
carrinho.remover(item.getProduto().getId(),item.getTipoPreco());
carrinho.add(item, Integer.parseInt(quantidades[i]));
i++;
}
return new ModelAndView("redirect:/carrinho");
}
private CarrinhoItem criaItem(Integer produtoId, TipoPreco tipoPreco) {
Produto produto = produtoDAO.find(produtoId);
CarrinhoItem carrinhoItem = new CarrinhoItem(produto,tipoPreco);
return carrinhoItem;
}
}
@Component
@Scope(value=WebApplicationContext.SCOPE_SESSION)
public class CarrinhoCompras implements Serializable{
private static final long serialVersionUID = 1L;
private Map<CarrinhoItem,Integer> itens = new LinkedHashMap<CarrinhoItem,Integer>();
public void add(CarrinhoItem item) {
itens.put(item, getQuantidade(item) + 1);
}
//Método Novo
public void add(CarrinhoItem item,Integer quantidade) {
itens.put(item, getQuantidade(item) + quantidade);
}
public Integer getQuantidade(CarrinhoItem item) {
if(!itens.containsKey(item)){
itens.put(item, 0);
}
return itens.get(item);
}
public BigDecimal getTotal(CarrinhoItem item){
return item.getTotal(getQuantidade(item));
}
public Integer getQuantidade(){
return itens.values().stream().reduce(0,(proximo,acumulador)-> proximo + acumulador);
}
public Collection<CarrinhoItem> getItens(){
return itens.keySet();
}
public BigDecimal getTotal(){
BigDecimal total= BigDecimal.ZERO;
for(CarrinhoItem item : itens.keySet() ){
total = total.add(getTotal(item));
}
return total;
}
public void remover(Integer produtoId, TipoPreco tipoPreco) {
Produto produto = new Produto();
produto.setId(produtoId);
itens.remove(new CarrinhoItem(produto, tipoPreco));
}
}
Porém ainda existe uma coisa que me incomoda. Se você for no site da casa do código, escolher comprar um livro, alterar a quantidade e logo em seguida clicar em "Finalizar Compra" você será redirecionado para a página de checkout com as quantidades e preços corretos, coisa que não acontece na minha implementação de carrinho, no meu carrinho antes de finalizar a compra, se você alterou a quantidade de produtos, você deve clicar no botão atualizar para que então a quantidade do produto esteja atualizada no carrinho. A pergunta é como automatizar este processo igual ao site da casa do código e eu não precisar atualizar o carrinho antes de prosseguir com a compra?
Outra dúvida, observando a página do carrinho na casa do código, observei que os botões(ambos submit) de "Finalizar Compra" e "Atualizar" estão dentro de um mesmo form, como o Spring vai direfir a action, visto que cada submit vai realizar uma tarefa diferente?
//código do carrinho na casa do código
<section class="infoSection container">
<h2 class="infoSection-titulo">Seu carrinho</h2>
<form class="formularioDoCarrinho" action="/cart" method="post">
<table class="formularioDoCarrinho-tabela">
<thead class="formularioDoCarrinho-cabecalho">
<tr>
<th></th>
<th class="formularioDoCarrinho-cabecalho-item">Item</th>
<th
class="formularioDoCarrinho-cabecalho-item formularioDoCarrinho-cabecalho-preco">Preço</th>
<th class="formularioDoCarrinho-cabecalho-item">Qtd</th>
<th class="formularioDoCarrinho-cabecalho-item">Total</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td class="formularioDoCarrinho-item"><a
href="/products/livro-spring-mvc"> <img
class="formularioDoCarrinho-item-imagem"
src="//cdn.shopify.com/s/files/1/0155/7645/products/spring-mvc-featured_small.png?v=1430247080">
</a></td>
<td class="formularioDoCarrinho-item">
<h2 class="formularioDoCarrinho-item-titulo">Spring MVC:
Domine o principal framework web Java - Impresso</h2>
</td>
<td
class="formularioDoCarrinho-item formularioDoCarrinho-item-preco">R$69,90</td>
<td class="formularioDoCarrinho-item"><input
class="formularioDoCarrinho-item-quantidade" type="number"
min="0" id="updates_1291146305" name="updates[1291146305]"
value="1"></td>
<td
class="formularioDoCarrinho-item formularioDoCarrinho-item-precoTotal"
title="Preço unitário: R$69,90">R$69,90</td>
<td class="formularioDoCarrinho-item"><a
href="/cart/change?id=1291146305&quantity=0"> <img
class="formularioDoCarrinho-item-remover-imagem"
src="//cdn.shopify.com/s/files/1/0155/7645/t/192/assets/trash.png?13499226283805943877"
alt="X" title="Remover">
</a></td>
</tr>
</tbody>
<tfoot class="formularioDoCarrinho-rodape">
<tr>
<td
class="formularioDoCarrinho-rodape-item formularioDoCarrinho-finalizar"
colspan="3">
<button class="formularioDoCarrinho-finalizar-botao"
type="submit" name="checkout">
Finalizar<span
class="formularioDoCarrinho-finalizar-botao-texto"
role="presentation"> compra</span>
</button>
</td>
<td class="formularioDoCarrinho-rodape-item">
<button class="formularioDoCarrinho-atualizar" type="submit"
name="update">Atualizar</button>
</td>
<td class="formularioDoCarrinho-rodape-item">R$69,90</td>
<td></td>
</tr>
</tfoot>
</table>
</form>
</section>