Martin Macola / autoservicio

Download as
Browse Code »

Commit b695e77f11fd45d9cf23e911ee6ab1e47bb8cb0d

Authored by Marcelo Puebla
1 parent 0b89cb8931
Exists in master

Logica para cargar productos al carrito.

Showing 6 changed files with 140 additions and 85 deletions   Show diff stats
src/app/components/inicio/inicio.component.html
Diff comments   View file @ b695e77
... ... @@ -29,13 +29,16 @@
29 29 <div id="carouselIndicators" class="carousel slide" data-ride="carousel">
30 30 <div class="carousel-inner">
31 31 <div class="carousel-item active">
32   - <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-75 m-auto rounded">
  32 + <img src="{{apiUrl}}/imagenes/beldent.jpg" class="d-block w-75 m-auto rounded">
33 33 </div>
34 34 <div class="carousel-item">
35   - <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-75 m-auto rounded">
  35 + <img src="{{apiUrl}}/imagenes/cafe con leche y medialunas.jpg" class="d-block w-75 m-auto rounded">
36 36 </div>
37 37 <div class="carousel-item">
38   - <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-75 m-auto rounded">
  38 + <img src="{{apiUrl}}/imagenes/Surtido bagley.jpg" class="d-block w-75 m-auto rounded">
  39 + </div>
  40 + <div class="carousel-item">
  41 + <img src="{{apiUrl}}/imagenes/yogurisimo.jpg" class="d-block w-75 m-auto rounded">
39 42 </div>
40 43 </div>
41 44 </div>
... ... @@ -75,7 +78,7 @@
75 78 *ngIf="sinonimos.length > 0"
76 79 [popover]="popoverDirective"
77 80 [popoverContent]="sinonimos"
78   - (sinonimoSeleccionado)="sinonimoSeleccionado($event)"
  81 + (productosPersonalizados)="productosPersonalizados($event)"
79 82 class="text-white rounded-sm border-0">
80 83 </app-popover-sinonimos>
81 84 </ng-template>
... ... @@ -126,16 +129,16 @@
126 129  
127 130 <!-- PROMO A CARGAR -->
128 131 <div class="fade-in m-0" *ngIf="promoAcargar">
129   - <img
  132 + <!-- <img
130 133 class="card-img-top d-block w-100 mx-auto rounded-sm"
131   - src="{{apiUrl}}/imagenes/{{promoAcargar.imagenes[0].imagen}}">
  134 + src="{{apiUrl}}/imagenes/{{promoAcargar. imagenes[0].imagen}}"> -->
132 135  
133 136 <div class="row justify-content-between m-3">
134 137 <div class="col-12 text-left px-1">
135   - <p class="h6 font-weight-bold mb-0">{{promoAcargar.nombrePromo}}</p>
  138 + <p class="h6 font-weight-bold mb-0">{{promoAcargar.DetArt}}</p>
136 139 </div>
137 140 <div class="col-12 text-right mt-2 align-self-end">
138   - <p class="h5 font-weight-bold mb-0">{{promoAcargar.precioTotal | currency}}</p>
  141 + <p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen | currency}}</p>
139 142 </div>
140 143 </div>
141 144 </div>
... ... @@ -154,14 +157,17 @@
154 157 <i class="fa fa-hand-o-up text-purple" aria-hidden="true"></i>
155 158 </button>
156 159 <button
157   - *ngIf="!promoAcargar"
  160 + *ngIf="!promoAcargar || sinonimos.length == 0"
158 161 type="button"
159 162 class="btn btn-primary btn-block shadow-sm"
160 163 (click)="pop.show()">
161 164 <span class="pr-2">Mostrar promociones</span>
162 165 <i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i>
163 166 </button>
164   - <button type="button" class="btn btn-light btn-block shadow-sm my-3">
  167 + <button
  168 + type="button"
  169 + class="btn btn-light btn-block shadow-sm my-3"
  170 + (click)="confirmarProducto()">
165 171 <span class="pr-2 font-weight-bold">Confirmar</span>
166 172 <i class="fa fa-check text-success" aria-hidden="true"></i>
167 173 </button>
src/app/components/inicio/inicio.component.ts
Diff comments   View file @ b695e77
1   -import { Component, OnInit, ViewChild } from '@angular/core';
  1 +import { Component, OnInit, ViewChild, HostListener } from '@angular/core';
2 2 import { PopoverDirective } from 'ngx-bootstrap';
3 3 import { appSettings } from 'src/etc/AppSettings';
4   -import { Producto } from 'src/app/wrappers/producto';
5   -import { ProductoService } from 'src/app/services/producto.service';
6 4 import { Router } from '@angular/router';
7   -import { Promocion } from 'src/app/wrappers/promocion';
  5 +import { ProductoService } from 'src/app/services/producto.service';
  6 +import { Producto } from 'src/app/wrappers/producto';
8 7 import { Sinonimo } from 'src/app/wrappers/sinonimo';
9   -import { HostListener } from '@angular/core';
10 8  
11 9 @Component({
12 10 selector: 'app-inicio',
... ... @@ -27,15 +25,15 @@ export class InicioComponent implements OnInit {
27 25 };
28 26  
29 27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;
30   - private productoAcargar: Producto;
31   - private productos: Producto[];
32   - private promoAcargar: Promocion;
33 28 private tienePromo = false;
34 29 private productoEsPromo = false;
35 30 private busqueda: string = '';
36   - private sinonimoAcargar: Sinonimo;
37 31  
38   - promociones: Promocion[] = [];
  32 + private productoAcargar: Producto;
  33 + private promoAcargar: Producto;
  34 +
  35 + productos: Producto[] = [];
  36 + promociones: Producto[] = [];
39 37 sinonimos: Sinonimo[] = [];
40 38 apiUrl: string = appSettings.apiUrl
41 39  
... ... @@ -46,30 +44,36 @@ export class InicioComponent implements OnInit {
46 44 ngOnInit() {
47 45  
48 46 this.productoAcargar = this.productoService.productoAcargar;
49   - this.getPromociones();
  47 + if (this.productoAcargar) {
  48 + if (this.productoAcargar.PRO) {
  49 + this.promociones.push(this.productoAcargar);
  50 + this.promoSeleccionada(this.productoAcargar);
  51 + }
  52 + else
  53 + this.getPromociones();
  54 + }
50 55 this.getProductos();
51 56 }
52 57  
53 58 getPromociones() {
54   - if (this.productoAcargar) {
55   - var sector = this.productoAcargar.CodSec;
56   - var codigo = this.productoAcargar.CodArt;
57   - this.productoService.getPromocion(sector, codigo)
58   - .subscribe((res: Promocion[]) => {
59   -
60   - if (res.length === 0) {
61   - //Si no tiene promociones la cargará al carrito despues de un tiempo
62   - setTimeout(() => {
63   - this.productoService.productos.push(this.productoAcargar);
64   - this.productoAcargar = this.productoService.productoAcargar = undefined;
65   - }, 2000)
66   - } else {
67   -
68   - this.promociones = res;
69   - this.popoverDirective.show();
70   - }
71   - }, error => { console.error(error); })
72   - }
  59 +
  60 + var sector = this.productoAcargar.CodSec;
  61 + var codigo = this.productoAcargar.CodArt;
  62 + this.productoService.getPromociones(sector, codigo)
  63 + .subscribe((res: Producto[]) => {
  64 +
  65 + if (res.length === 0) {
  66 + //Si no tiene promociones la cargará al carrito despues de un tiempo
  67 + setTimeout(() => {
  68 + this.productoService.productos.push(this.productoAcargar);
  69 + this.productoAcargar = this.productoService.productoAcargar = undefined;
  70 + }, 2000)
  71 + } else {
  72 +
  73 + this.promociones = res;
  74 + this.popoverDirective.show();
  75 + }
  76 + }, error => { console.error(error); })
73 77 }
74 78  
75 79 showPopover() {
... ... @@ -84,23 +88,37 @@ export class InicioComponent implements OnInit {
84 88 });
85 89 }
86 90  
87   - private irBusquedaProductos(verPromociones) {
  91 + irBusquedaProductos(verPromociones) {
88 92  
89 93 this.productoService.verCategoriasProductos = verPromociones;
90 94 this.router.navigate(['busqueda-productos']);
91 95 }
92 96  
  97 + confirmarProducto() {
  98 +
  99 + this.productoService.productos.push(this.promoAcargar);
  100 + this.promoAcargar = undefined;
  101 + this.productoAcargar = undefined;
  102 + this.promociones = [];
  103 + this.popoverDirective.hide();
  104 + }
  105 +
93 106 deshacerCarga() {
94 107  
95   - if (this.sinonimoAcargar || this.sinonimos.length > 0) {
  108 + if (this.sinonimos.length > 0) {
96 109 this.sinonimos = [];
97   - this.sinonimoAcargar = undefined;
98 110 this.popoverDirective.hide();
99 111 }
100 112  
101 113 if (this.promoAcargar) {
102 114 this.promoAcargar = undefined;
103   - this.popoverDirective.show();
  115 + if(this.productoAcargar.PRO){
  116 + this.productoAcargar = undefined;
  117 + this.promociones = [];
  118 + this.popoverDirective.hide();
  119 + }else{
  120 + this.popoverDirective.show();
  121 + }
104 122 } else {
105 123 this.productoAcargar = undefined;
106 124 this.promociones = [];
... ... @@ -108,37 +126,49 @@ export class InicioComponent implements OnInit {
108 126 }
109 127 }
110 128  
111   - promoSeleccionada($event: Promocion) {
  129 + promoSeleccionada($event: Producto) {
112 130  
113 131 this.promoAcargar = $event;
114   - this.popoverDirective.hide();
115   - if (this.promoAcargar.sinonimos) {
116   - var sector = this.promoAcargar.sector;
117   - var codigo = this.promoAcargar.codigo;
  132 + this.promoAcargar.tieneSinonimos = true;
  133 + if (this.promoAcargar.tieneSinonimos) {
  134 + var sector = this.promoAcargar.CodSec;
  135 + var codigo = this.promoAcargar.CodArt;
118 136 this.productoService.getPromocionSinonimos(sector, codigo)
119 137 .subscribe((res: Sinonimo[]) => {
120 138  
121   - res.forEach(resSinonimo => {
  139 + res.forEach(sinonimo => {
122 140  
123   - this.promoAcargar.productos.forEach(productoPromo => {
  141 + sinonimo.productos.forEach(productoSinonimo => {
124 142  
125   - if (productoPromo.idSinonimo === resSinonimo.ID_SIN) {
126   - resSinonimo.cantidad = productoPromo.cantidad;
127   - resSinonimo.productoPadre = productoPromo.id;
128   - }
129   - });
  143 + this.promoAcargar.productos.forEach(productoPromo => {
130 144  
  145 + if (productoSinonimo.id === productoPromo.id) {
  146 + sinonimo.cantidad = productoPromo.cantidad;
  147 + sinonimo.productoPadre = productoPromo.id;
  148 + }
  149 + })
  150 + })
131 151 })
  152 +
132 153 this.sinonimos = res;
133   - this.showPopover();
  154 + if (res.length > 0)
  155 + this.showPopover();
134 156 })
  157 + } else {
  158 + this.popoverDirective.hide();
135 159 }
136 160 }
137 161  
138   - sinonimoSeleccionado($event: Sinonimo) {
  162 + productosPersonalizados($event: Producto[]) {
  163 +
  164 + var productosPersonalizados = $event;
  165 +
  166 + this.promoAcargar.productos.forEach(productoPromo => {
  167 +
  168 + if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo);
  169 + })
139 170  
140   - console.log($event);
141   - this.sinonimoAcargar = $event;
  171 + this.promoAcargar.productos = productosPersonalizados;
142 172 }
143 173  
144 174 buscarByCodigoBarras(busqueda) {
src/app/components/popover-promos/popover-promos.component.html
Diff comments   View file @ b695e77
... ... @@ -19,12 +19,12 @@
19 19 <div class="row justify-content-between">
20 20 <div class="col-12 text-left">
21 21 <p class="h5 mb-0">
22   - <small class="font-weight-bold">{{promo.nombrePromo}}</small>
  22 + <small class="font-weight-bold">{{promo.DetArt}}</small>
23 23 </p>
24 24 </div>
25 25 <div class="col-12 text-right mt-2">
26 26 <p class="h4 font-weight-bold mb-0">
27   - {{calcularPrecioDePromo(promo) | currency}}
  27 + {{promo.PreVen | currency}}
28 28 </p>
29 29 </div>
30 30 </div>
src/app/components/popover-promos/popover-promos.component.ts
Diff comments   View file @ b695e77
1 1 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
2 2 import { PopoverDirective } from 'ngx-bootstrap/popover';
3   -import { Promocion } from 'src/app/wrappers/promocion';
4 3 import { Producto } from 'src/app/wrappers/producto';
5 4  
6 5 @Component({
... ... @@ -11,8 +10,8 @@ import { Producto } from &#39;src/app/wrappers/producto&#39;;
11 10 export class PopoverPromosComponent implements OnInit {
12 11  
13 12 @Input() popover: PopoverDirective;
14   - @Input() popoverContent: Promocion[];
15   - @Output() promoSeleccionada = new EventEmitter<Promocion>();
  13 + @Input() popoverContent: Producto[];
  14 + @Output() promoSeleccionada = new EventEmitter<Producto>();
16 15  
17 16 constructor() { }
18 17  
... ... @@ -23,18 +22,18 @@ export class PopoverPromosComponent implements OnInit {
23 22 this.popover.hide();
24 23 }
25 24  
26   - seleccionarPromo(promo: Promocion) {
  25 + seleccionarPromo(promo: Producto) {
27 26  
28 27 this.promoSeleccionada.emit(promo);
29 28 }
30 29  
31   - calcularPrecioDePromo(promo: Promocion) {
  30 + calcularPrecioDePromo(promo: Producto) {
32 31  
33   - promo.precioTotal = 0;
  32 + promo.PreVen = 0;
34 33 promo.productos.forEach(producto => {
35   - promo.precioTotal += producto.PreVen;
  34 + promo.PreVen += producto.PreVen;
36 35 })
37   - return promo.precioTotal;
  36 + return promo.PreVen;
38 37 }
39 38  
40 39 }
src/app/components/popover-sinonimos/popover-sinonimos.component.html
Diff comments   View file @ b695e77
... ... @@ -22,16 +22,16 @@
22 22 </div>
23 23  
24 24 <div class="row my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos">
25   - <div class="col-7 pl-4 h6 text-right">
  25 + <div class="col-7 pl-2 h6 text-right">
26 26 <p class="m-0 font-weight-normal">
27 27 {{producto.DetArt}}
28 28 </p>
29 29 </div>
30   - <div class="col-auto">
  30 + <div class="col-5">
31 31 <div class="btn-group float-left my-auto" role="group">
32 32 <button
33 33 type="button"
34   - class="btn btn-light my-auto border"
  34 + class="btn btn-light my-auto border shadow"
35 35 (click)="sumarCantidad(producto, i)">
36 36 <i class="fa fa-plus" aria-hidden="true"></i>
37 37 </button>
... ... @@ -43,7 +43,7 @@
43 43 </div>
44 44 <button
45 45 type="button"
46   - class="btn btn-light my-auto border"
  46 + class="btn btn-light my-auto border shadow"
47 47 (click)="restarCantidad(producto, i)">
48 48 <i class="fa fa-minus" aria-hidden="true"></i>
49 49 </button>
... ... @@ -58,7 +58,10 @@
58 58  
59 59 <div class="row mt-3 justify-content-end">
60 60 <div class="col-auto">
61   - <button type="button" class="btn btn-sm btn-light shadow" (click)="hidePopover()">
  61 + <button
  62 + type="button"
  63 + class="btn btn-sm btn-light shadow"
  64 + (click)="continuar()">
62 65 <span class="font-weight-bold pr-2">Continuar</span>
63 66 <i class="fa fa-check text-success" aria-hidden="true"></i>
64 67 </button>
src/app/components/popover-sinonimos/popover-sinonimos.component.ts
Diff comments   View file @ b695e77
... ... @@ -2,6 +2,7 @@ import { Component, OnInit, Input, EventEmitter, Output } from &#39;@angular/core&#39;;
2 2 import { PopoverDirective } from 'ngx-bootstrap';
3 3 import { Producto } from 'src/app/wrappers/producto';
4 4 import { Sinonimo } from 'src/app/wrappers/sinonimo';
  5 +import { ProductoService } from 'src/app/services/producto.service';
5 6  
6 7 @Component({
7 8 selector: 'app-popover-sinonimos',
... ... @@ -13,12 +14,12 @@ export class PopoverSinonimosComponent implements OnInit {
13 14 //Directiva del popover, para poder cerrarlo desde este componente
14 15 @Input() popover: PopoverDirective;
15 16 @Input() popoverContent: Sinonimo[];
16   - @Output() sinonimoSeleccionado = new EventEmitter<Sinonimo>();
17   - sinonimo: Sinonimo;
  17 + @Output() productosPersonalizados = new EventEmitter<Producto[]>();
  18 + // sinonimo: Sinonimo;
18 19  
19 20 private cantidadRestanteSinonimos: number[] = [];
20 21  
21   - constructor() { }
  22 + constructor(private productoService: ProductoService) { }
22 23  
23 24 ngOnInit() {
24 25  
... ... @@ -26,7 +27,8 @@ export class PopoverSinonimosComponent implements OnInit {
26 27 this.popoverContent.forEach(sinonimo => {
27 28  
28 29 this.cantidadRestanteSinonimos.push(0);
29   - this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined;
  30 + // this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined;
  31 +
30 32 sinonimo.productos.forEach(producto => {
31 33  
32 34 producto.cantidad = (producto.id === sinonimo.productoPadre) ? sinonimo.cantidad : 0;
... ... @@ -34,15 +36,30 @@ export class PopoverSinonimosComponent implements OnInit {
34 36 })
35 37 }
36 38  
37   - hidePopover() {
  39 + continuar() {
38 40  
39   - this.sinonimoSeleccionado.emit(this.sinonimo);
40   - this.popover.hide();
41   - }
  41 + //Si aún quedan articulos que agregar no deja continuar.
  42 + for (let i = 0; i < this.cantidadRestanteSinonimos.length; i++) {
  43 +
  44 + if (this.cantidadRestanteSinonimos[i] > 0) return;
  45 + }
42 46  
43   - setSinonimo(sinonimo: Sinonimo) {
  47 + var productosAenviar: Producto[] = [];
44 48  
45   - this.sinonimo = sinonimo;
  49 + this.popoverContent.forEach(sinonimo => {
  50 +
  51 + sinonimo.productos.forEach(producto => {
  52 +
  53 + if (producto.cantidad > 0) {
  54 + producto.idSinonimo = sinonimo.ID_SIN;
  55 + productosAenviar.push(producto);
  56 + }
  57 + })
  58 +
  59 + })
  60 +
  61 + this.productosPersonalizados.emit(productosAenviar);
  62 + this.popover.hide();
46 63 }
47 64  
48 65 sumarCantidad(producto: Producto, i: number) {