Martin Macola / autoservicio

Download as
Browse Code ยป

Commit 8467eb3d10d2c2b44c95bed514adb447fb2cc326

Authored by =
1 parent 45a6a13ed1
Exists in master

Funciones aumentar y decrementar

Showing 2 changed files with 85 additions and 10 deletions   Show diff stats
src/app/sidebar/sidebar.component.html
Diff comments   View file @ 8467eb3
... ... @@ -2,25 +2,25 @@
2 2  
3 3 <h4 class="border-bottom border-white"> Mi compra </h4>
4 4 <div class="overflow-auto mb-2">
5   - <div class="card my-2 bg-primary border-0">
6   - <img src="../../assets/descarga.jpg" class="card-img-top" alt="...">
  5 + <div class="card my-2 bg-primary border-0" *ngFor="let prod of productos; let i = index">
  6 + <img src="{{prod.img}}" class="card-img-top" alt="...">
7 7 <div class="card-body row m-0 p-0 px-1 py-1 shadow rounded">
8 8 <div class="col-8 p-0 text-left my-auto">
9   - <p class="m-0 card-description">Galleta oreo x 199 gs Chocolate</p>
10   - <p class="m-0 card-description"><small>COD: 1234567</small></p>
  9 + <p class="m-0 card-description">{{prod.desc}}</p>
  10 + <p class="m-0 card-description">COD: {{prod.cod}}</p>
11 11 </div>
12 12 <div class="col-4 p-1 text-center my-auto">
13   - {{90 | currency}}
  13 + {{prod.precio | currency}}
14 14 </div>
15 15 </div>
16 16 <div class="row m-0 p-0">
17 17 <div class="col p-1 pb-1 mt-2">
18   - <button type="button" class="btn btn-light btn-sm float-left my-auto">X</button>
19   - <button type="button" class="btn btn-light btn-sm my-auto">X</button>
  18 + <button type="button" class="btn btn-light btn-sm float-left my-auto" (click)="deleteProducto(i)">X</button>
  19 + <button type="button" class="btn btn-light btn-sm my-auto">Y</button>
20 20 <div class="btn-group-sm btn-group float-right my-auto" role="group" aria-label="Basic example">
21   - <button type="button" class="btn btn-light btn-sm mb-2">+</button>
22   - <label for="" class="border border.white px-1">12</label>
23   - <button type="button" class="btn btn-light btn-sm mb-2">-</button>
  21 + <button type="button" class="btn btn-light btn-sm mb-2" (click)="aumentarContador(prod.cantidad)">+</button>
  22 + <label for="" class="border border.white px-1">{{prod.cantidad}}</label>
  23 + <button type="button" class="btn btn-light btn-sm mb-2" (click)="decrementarContador()">-</button>
24 24 </div>
25 25 </div>
26 26 </div>
src/app/sidebar/sidebar.component.ts
Diff comments   View file @ 8467eb3
... ... @@ -7,9 +7,84 @@ import { Component, OnInit } from &#39;@angular/core&#39;;
7 7 })
8 8 export class SidebarComponent implements OnInit {
9 9  
  10 + private cont: number = 1;
  11 + private min: number = 1;
  12 + private max: number =50;
  13 +
  14 + private productos = [
  15 + {
  16 + "id": 1,
  17 + "desc": "Galletas Oreo",
  18 + "cod": 225412,
  19 + "precio": 15,
  20 + "img": "./assets/descarga.jpg",
  21 + "cantidad": 1
  22 + },
  23 + {
  24 + "id": 2,
  25 + "desc": "Coca cola 500ml",
  26 + "cod": 512632,
  27 + "precio": 40,
  28 + "img": "./assets/descarga.jpg",
  29 + "cantidad": 1
  30 + },
  31 + {
  32 + "id": 3,
  33 + "desc": "Pancho grande",
  34 + "cod": 775987,
  35 + "precio": 45,
  36 + "img": "./assets/descarga.jpg",
  37 + "cantidad": 1
  38 + }
  39 + ];
  40 +
10 41 constructor() { }
11 42  
12 43 ngOnInit() {
  44 + this.getProductosCarrito();
  45 + }
  46 +
  47 + getProductosCarrito(){
  48 + return this.productos;
  49 +
  50 + }
  51 +
  52 + public aumentarContador(cant){
  53 + console.log("llego");
  54 + for (const i of this.productos) {
  55 + if (cant === this.max) {
  56 + return i.cantidad;
  57 + } else{
  58 + ++i.cantidad
  59 + return i.cantidad;
  60 + }
  61 + }
  62 + // if (this.cont === this.max) {
  63 + // this.cont;
  64 + // return this.cont;
  65 + // } else {
  66 + // ++this.cont;
  67 + // return this.cont;
  68 + // }
  69 +
  70 + }
  71 +
  72 + decrementarContador(){
  73 + if (this.cont === this.min) {
  74 + this.cont;
  75 + return this.cont;
  76 + } else {
  77 + --this.cont;
  78 + return this.cont;
  79 + }
13 80 }
14 81  
  82 + deleteProducto(index){
  83 + for (let i = 0; i < this.productos.length; i++)
  84 + if (i === index) {
  85 + this.productos.splice(i,1);
  86 + return this.productos ;
  87 + }
  88 +
  89 + }
15 90 }