Atualizar Carrinho Automaticamente quando altera itens no carrinho

[diogosp]

Na página CART:

• quando o usuário alterar a QUANTIDADE de cada item o valor deve atualizar automaticamente na linha e no total geral.
• temos que ver o que aacontecerá com o botão ATUALIZAR CARRINHO. Se tem outra função ou se eliminamos.

[diogosp]

@matheusgimenez temos esta issue pra concluir até sexta. bom trabalho.

[matheusgimenez]

Envie pro DEV essa já.

A questão aqui é a seguinte: o approach que eu fiz no desktop acredito ter ficado perfeito, utilizei mouseout para mandar o update só quando o mouse sai dos botões. O problema é no mobile, no mobile nao existe eventos de mouse.. então a solução que eu usei foi atualizar sempre que existe alteração, então atualiza sempre que o valor é trocado.

Teste bastante no mobile e veja se tem uma solução melhor pra isso.

[diogosp]

@matheusgimenez sinceramente não saberia dizer qual outra forma poderia se construir isso. Não sei boas práticas deste tipo de coisa. Talvez o @LuwkasLima possa dar uma revisada nisso e apontar alguma coisa.

Por mim tá ótima a saída que você achou.

[LuwkasLima]

Oi Pessoal,

Meus "2 cents" aqui...

Eu gosto de usar a Amazom.com como referencia por se tratar de um lider no mercado de plataformas de e-commerce e investe bastante em usabilidade e atualizacao da sua ferramenta.

Bom, na Amazon nao existe um botao "Atualizar Carrinho", pois imagino que eles tenha percebido esse problema assim como nos e o sitio perceberam tbm. Na Amazon o carrinho eh atualizado quando modificamos a quantidade (em um dropbox), tanto no Desktop como no Mobile:

Coloco o produto no carrinho:

Voce percebe que a atualizacao ocorre somente em uma area da pagina (nao eh um refresh da pagina toda):

Por fim, a quantidade eh atualizada, bem como o total da compra:

Portanto, nao sei se faz sentido, mas eu deixaria a logica do Mobile e do Desktop iguais ("atualizar sempre que existe alteração, então atualiza sempre que o valor é trocado.")

Faz sentido pessoal?

[diogosp]

@LuwkasLima obrigado! olhar a solução da Amazon foi ótimo. E realmente o dropdown proposto por eles é MUITO funcional.

@matheusgimenez vamos fechar com este dropdown no MOBILE? pq agora tá o campo onde a pessoa precisa preencher o número via teclado e é ruim pacas. No Desktop eu deixaria os botões MAIS e MENOS pq já é padrão do site.

O que acham da saída? Valeu gente.

[matheusgimenez]

Apliquei o dropdown no mobile.

Teste no DEV.

[diogosp]

@matheusgimenez ordem dos botões que deve ficar no CART

Pro celular ser: Fechar pedido Continuar comprando Esvaziar carrinho

Para o site : (Lado esquerdo) Continuar comprando Esvaziar carrinho ( lado direito) Fechar pedido

[diogosp]

Botão Fechar Pedido - laranja outros botões: cinza

[matheusgimenez]

Feito! Está no DEV

Eu fiz a ordem dos mobiles pela função wp_is_mobile(), então se for testar o mobile no PC, vc vai precisar alterar o user-agent. Ou siga pelo caminho mais fácil, teste pelo celular, rs.