Commit c619abbde92d5f48b94406be6c8fa18496b89e92

Authored by Marcelo Puebla
1 parent 7c1dd88367
Exists in master

Cambiada logica para manejar el total en el carrito/sidebar.

src/app/components/sidebar/sidebar.component.html
... ... @@ -31,7 +31,7 @@
31 31 <button
32 32 type="button"
33 33 class="btn btn-light btn-sm my-auto border shadow"
34   - (click)="aumentarContador(i)">
  34 + (click)="aumentarCantidad(producto)">
35 35 <i class="fa fa-plus" aria-hidden="true"></i>
36 36 </button>
37 37 <div class="bg-white border border-white px-3 my-auto text-dark h5 shadow">
... ... @@ -40,7 +40,7 @@
40 40 <button
41 41 type="button"
42 42 class="btn btn-light btn-sm my-auto border shadow"
43   - (click)="decrementarContador(i)">
  43 + (click)="restarCantidad(producto)">
44 44 <i class="fa fa-minus" aria-hidden="true"></i>
45 45 </button>
46 46 </div>
... ... @@ -62,7 +62,7 @@
62 62 <button
63 63 type="button"
64 64 class="btn btn-secondary btn-sm my-auto shadow"
65   - (click)="deleteProducto(i)">
  65 + (click)="deleteProducto(producto, i)">
66 66 <i class="fa fa-trash" aria-hidden="true"></i>
67 67 </button>
68 68 </div>
... ... @@ -74,13 +74,19 @@
74 74 <div class="card rounded-top-sm mt-auto blue-gradient border-0">
75 75 <div class="card-body row">
76 76 <div class="col-12">
77   - <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont === 1">({{cont}}) item</p>
78   - <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont > 1">({{cont}}) items</p>
  77 + <p
  78 + class="h4 border-bottom border-secondary text-secondary pb-2">
  79 + ({{getCantidadProductos()}}) items
  80 + </p>
79 81 <p class="h3 text-secondary">Total</p>
80 82 <p class="h3 font-weight-bold">{{getTotal() | currency}}</p>
81 83 </div>
82 84 <div class="col-12">
83   - <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1" routerLink="/confirmacion-carrito">
  85 + <button
  86 + *ngIf="cantTotal > 0"
  87 + type="button"
  88 + class="btn btn-block btn-light btn-lg shadow mb-2 p-1"
  89 + routerLink="/confirmacion-carrito">
84 90 <span class="font-weight-bold pr-1">Finalizar y Pagar</span>
85 91 <i class="fa fa-check text-success" aria-hidden="true"></i>
86 92 </button>
src/app/components/sidebar/sidebar.component.ts
... ... @@ -3,7 +3,6 @@ import { Producto } from &#39;src/app/wrappers/producto&#39;;
3 3 import { appSettings } from 'src/etc/AppSettings';
4 4 import { ProductoService } from 'src/app/services/producto.service';
5 5  
6   -
7 6 @Component({
8 7 selector: 'app-sidebar',
9 8 templateUrl: './sidebar.component.html',
... ... @@ -11,93 +10,65 @@ import { ProductoService } from &#39;src/app/services/producto.service&#39;;
11 10 })
12 11 export class SidebarComponent implements OnInit {
13 12  
14   - private cont: number = 1;
15   - private min: number = 1;
16   - private max: number = 50;
  13 + private cantTotal: number = 0;
  14 + private cantMin: number = 1;
  15 + private cantMax: number = 50;
17 16 private total: number = 0;
18 17 private apiUrl: string = appSettings.apiUrl;
19 18  
20 19 public productosCarrito: Producto[] = [];
21 20  
22   - constructor(private productoService: ProductoService) {
23   -
24   - this.productosCarrito = this.productoService.productos;
25   - }
  21 + constructor(private productoService: ProductoService) { }
26 22  
27 23 ngOnInit() {
28 24  
  25 + this.productosCarrito = this.productoService.productos;
29 26 }
30 27  
31 28 getCantidadProductos() {
32 29  
33   - for (let i = 0; i < this.productosCarrito.length; i++) {
34   - this.productosCarrito[i].cantidad = 1
35   - this.cont++;
36   - }
37   - return this.cont;
  30 + setTimeout(() => {
  31 + var cantTotalAux = 0;
  32 + this.productosCarrito.forEach(producto => {
  33 +
  34 + cantTotalAux += producto.cantidad;
  35 + }, 250);
  36 + this.cantTotal = cantTotalAux;
  37 + })
  38 + return this.cantTotal;
38 39 }
39 40  
40 41 getTotal() {
41 42  
42   - let subTotal = 0;
  43 + var subTotal = 0;
43 44 for (let i = 0; i < this.productosCarrito.length; i++) {
44 45 subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
45 46 }
46 47 return this.total = subTotal;
47 48 }
48 49  
49   - public aumentarContador(index) {
50   -
51   - this.cont++;
52   - for (let i = 0; i < this.productosCarrito.length; i++) {
53   - if (i === index) {
54   - this.total = this.total + this.productosCarrito[i].PreVen;
55   - return (this.productosCarrito[i].cantidad === this.max) ?
56   - this.productosCarrito[i].cantidad : this.productosCarrito[i].cantidad++;
57   -
58   - }
59   - }
60   - }
61   -
62   - decrementarContador(index) {
  50 + aumentarCantidad(producto: Producto) {
63 51  
64   - for (let i = 0; i < this.productosCarrito.length; i++) {
65   - if (i === index && this.productosCarrito[i].cantidad > this.min) {
66   - this.productosCarrito[i].cantidad--;
67   - this.cont--;
68   - break;
69   - }
  52 + if (producto.cantidad < this.cantMax) {
  53 + producto.cantidad++;
  54 + this.cantTotal++
70 55 }
71   -
72   - this.getTotal()
73 56 }
74 57  
75   - setCantidadItems() {
  58 + restarCantidad(producto: Producto) {
76 59  
77   - this.cont = 0;
78   - for (let i = 0; i < this.productosCarrito.length; i++) {
79   - this.cont += this.productosCarrito[i].cantidad;
80   - }
81   - }
82   -
83   - deleteProducto(index: number) {
84   -
85   - for (let i = 0; i < this.productosCarrito.length; i++) {
86   - if (i === index) {
87   - this.cont -= this.productosCarrito[i].cantidad;
88   - //Elimina del total el PreVen de todo el item
89   - this.total = this.total - (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
90   - this.productosCarrito.reverse().splice(i, 1);
91   - return;
92   - }
  60 + if (producto.cantidad > this.cantMin) {
  61 + producto.cantidad--;
  62 + this.cantTotal--;
93 63 }
94 64 }
95 65  
96   - cleanCarrito() {
  66 + deleteProducto(producto: Producto, index: number) {
97 67  
98   - this.productoService.productos = this.productosCarrito = [];
99   - this.total = 0;
100   - this.cont = 0;
  68 + this.cantTotal -= producto.cantidad;
  69 + this.total -= producto.PreVen * producto.cantidad;
  70 + this.productosCarrito.reverse().splice(index, 1);
  71 + return;
101 72 }
102 73  
103 74 esPersonalizable(producto: Producto) {