Mauricio Cattafi / autoservicio

Browse Code »

Commit 55a68043f082c9f0ee76b9b2a8555d7e2380fbee

Authored by Marcelo Puebla 2019-08-20 17:55:13 -0300

1 parent b695e77f11

Exists in master and in 1 other branch

Logica empezada para poder personalizar un producto en el carrito,

Showing 2 changed files with 17 additions and 3 deletions Show diff stats

src/app/components/sidebar/sidebar.component.html

Diff comments View file @ 55a6804

 <div class="disable-user-select d-flex align-items-center flex-column h-100 pt-2 text-center">
   <p class="h4 border-bottom border-white text-white mt-4 pb-2">
     Mi compra
     <i class="fa fa-shopping-cart" aria-hidden="true"></i>
   </p>
   <div class="overflow-auto overflow-scroll mb-2 w-100">
     <!-- PRODUCTOS CARRITO -->
     <div
       class="slide-in-bl my-2 bg-white border-0 rounded-sm"
       *ngFor="let producto of productosCarrito.slice().reverse(); let i = index">
-      <img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}">
+      <!-- <img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}"> -->
       <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">
         <div class="col-12 p-0 pt-2 text-left my-auto">
           <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
           <p class="m-0 h6"><small>COD: {{producto.CodRub}}</small></p>
         </div>
         <div class="col-12 pr-1 text-right h6 my-auto ">
           <p class="m-0">{{producto.PreVen | currency}}</p>
         </div>
       </div>
       <div class="row m-0 p-0">
         <div class="col-6 px-2 my-2">
           <div class="btn-group-sm btn-group float-left my-auto" role="group">
             <button type="button" class="btn btn-light btn-sm my-auto border" (click)="aumentarContador(i)">
               <i class="fa fa-plus" aria-hidden="true"></i>
             </button>
             <div class="bg-white border border-white px-3 my-auto text-dark h5">
               <small>{{producto.cantidad}}</small>
             </div>
             <button type="button" class="btn btn-light btn-sm my-auto border" (click)="decrementarContador(i)">
               <i class="fa fa-minus" aria-hidden="true"></i>
             </button>
           </div>
         </div>
         <div class="col-6 px-2 my-2">
           <div class="btn-group-sm btn-group float-right my-auto" role="group">
-            <button type="button" class="btn btn-light btn-sm my-auto float-left border mr-2">
+            <button
+              *ngIf="esPersonalizable(producto)"
+              type="button"
+              class="btn btn-light btn-sm my-auto float-left border mr-2"
+              (click)="personalizarPromo">
               <i class="fa fa-hand-o-up" aria-hidden="true"></i>
             </button>
             <button type="button" class="btn btn-secondary btn-sm my-auto ml-2" (click)="deleteProducto(i)">
               <i class="fa fa-times" aria-hidden="true"></i>
             </button>
           </div>
         </div>
       </div>
     </div>
   </div>
   <!-- TOTAL -->
   <div class="card rounded-top-sm mt-auto blue-gradient border-0">
     <div class="card-body row">
       <div class="col-12">
         <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont === 1">({{cont}}) item</p>
         <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont > 1">({{cont}}) items</p>
         <p class="h3 text-secondary">Total</p>
         <p class="h3 font-weight-bold">{{getTotal() | currency}}</p>
       </div>
       <div class="col-12">
         <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1" routerLink="/confirmacion-carrito">
           <span class="font-weight-bold pr-1">Finalizar y Pagar</span>
           <i class="fa fa-check text-success" aria-hidden="true"></i>
         </button>
         <button
           type="button"
           class="btn btn-block btn-light shadow btn-sm shadow"
           [routerLink]="['/cancelar-compra']">
           <span class="pr-1">Cancelar</span>
           <i class="fa fa-times text-danger" aria-hidden="true"></i>
         </button>
       </div>
     </div>
   </div>
 </div>

src/app/components/sidebar/sidebar.component.ts

Diff comments View file @ 55a6804

 import { Component, OnInit } from '@angular/core';
 import { Producto } from 'src/app/wrappers/producto';
 import { appSettings } from 'src/etc/AppSettings';
 import { ProductoService } from 'src/app/services/producto.service';
 @Component({
   selector: 'app-sidebar',
   templateUrl: './sidebar.component.html',
   styleUrls: ['./sidebar.component.scss'],
 })
 export class SidebarComponent implements OnInit {
   private cont: number = 1;
   private min: number = 1;
   private max: number = 50;
   private total: number = 0;
   private apiUrl: string = appSettings.apiUrl;
   public productosCarrito: Producto[] = [];
   constructor(private productoService: ProductoService) {
     this.productosCarrito = this.productoService.productos;
   }
   ngOnInit() {
   }
   getCantidadProductos() {
     for (let i = 0; i < this.productosCarrito.length; i++) {
       this.productosCarrito[i].cantidad = 1
       this.cont++;
     }
     return this.cont;
   }
   getTotal() {
     let subTotal = 0;
     for (let i = 0; i < this.productosCarrito.length; i++) {
       subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
     }
     return this.total = subTotal;
   }
   public aumentarContador(index) {
     this.cont++;
     for (let i = 0; i < this.productosCarrito.length; i++) {
       if (i === index) {
         this.total = this.total + this.productosCarrito[i].PreVen;
         return (this.productosCarrito[i].cantidad === this.max) ?
           this.productosCarrito[i].cantidad : this.productosCarrito[i].cantidad++;
       }
     }
   }
   decrementarContador(index) {
     for (let i = 0; i < this.productosCarrito.length; i++) {
       if (i === index && this.productosCarrito[i].cantidad > this.min) {
         this.productosCarrito[i].cantidad--;
         this.cont--;
         break;
       }
     }
     this.getTotal()
   }
   setCantidadItems() {
     this.cont = 0;
     for (let i = 0; i < this.productosCarrito.length; i++) {
       this.cont += this.productosCarrito[i].cantidad;
     }
   }
   deleteProducto(index: number) {
     for (let i = 0; i < this.productosCarrito.length; i++) {
       if (i === index) {
         this.cont -= this.productosCarrito[i].cantidad;
         //Elimina del total el PreVen de todo el item
         this.total = this.total - (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
         this.productosCarrito.reverse().splice(i, 1);
         return;
       }
     }
   }
   cleanCarrito() {
     this.productoService.productos = this.productosCarrito = [];
     this.total = 0;
     this.cont = 0;
   }
+  esPersonalizable(producto: Producto) {
+    var esPersonalizable: boolean = false;
+    if (producto.tieneSinonimos)
+      esPersonalizable = true;
+    return esPersonalizable;
+  }
 }