Merge branch 'master' into 'master'

Master(mpuebla) See merge request !44

Merge branch 'master' into 'master'
Master(mpuebla) See merge request !44
Eric Fernandez
2 parents d76e352cd7 160083b908
Showing 4 changed files Show diff stats
src/app/components/cancelar-compra/cancelar-compra.component.ts
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
src/styles.scss
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { appSettings } from 'src/etc/AppSettings';
 import { Location } from '@angular/common';
 import { Router } from '@angular/router';
@@ -9,29 +9,35 @@ import { ProductoService } from &#39;src/app/services/producto.service&#39;;
   templateUrl: './cancelar-compra.component.html',
   styleUrls: ['./cancelar-compra.component.scss']
 })
-export class CancelarCompraComponent implements OnInit {
+export class CancelarCompraComponent implements OnInit, OnDestroy {
  
   private apiUrl: string = appSettings.apiUrl;
+  private timer: any;
  
   constructor(
     private location: Location,
     private router: Router,
-    private productoService : ProductoService
-    ) { }
+    private productoService: ProductoService
+  ) { }
  
   ngOnInit() {
  
-    setTimeout(() => {
+    this.timer = setTimeout(() => {
       this.limpiarCarritoYvolver();
     }, 30000)
   }
  
+  ngOnDestroy() {
+
+    clearTimeout(this.timer);
+  }
+
   volverPreviousPage() {
  
     this.location.back();
   }
  
-  limpiarCarritoYvolver(){
+  limpiarCarritoYvolver() {
  
     this.productoService.productoAcargar = undefined;
     this.productoService.promoAcargar = undefined;
@@ -56,18 +56,44 @@
             </div>
           </div>
  
-          <div class="col-sm-5">
+          <div class="col-sm-5 pl-0">
             <div class="row ml-3">
               <!-- TICKET -->
-              <div class="col-sm-7">
+              <div class="col-sm-7 p-0">
                 <div class="card rounded-sm shadow">
                   <div class="card-body">
                     <p class="h5 card-title">Su Ticket</p>
-                    <p class="h6 card-text text-left mt-4 pr-2 vh-60 overflow-scroll">
-                      Ticket detalle.
-                    </p>
-                    <p class="h4 card-text text-right mt-3 mb-0">
-                      Total {{230 | currency}}
+                    <div class="row mt-4 m-0">
+                      <div class="col-12 p-0 mb-2">
+                        <p class="h6 m-0 card-text text-left">
+                          <small class="font-weight-bold">DESCRIPCIÓN</small>
+                        </p>
+                        <p class="h6 m-0 card-text text-left">
+                          <small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
+                        </p>
+                      </div>
+                    </div>
+                    <div class="row vh-50 overflow-scroll m-0">
+                      <div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
+                        <p class="h6 m-0 card-text text-left">
+                          <small>{{producto.DetArt}}</small>
+                        </p>
+                        <div class="row d-flex justify-content-between m-0">
+                          <div class="col p-0">
+                            <p class="h6 m-0 card-text text-left">
+                              <small>{{producto.cantidad}} x {{producto.PreVen | currency}}</small>
+                            </p>
+                          </div>
+                          <div class="col p-0">
+                            <p class="h6 m-0 card-text text-right">
+                              <small>{{(producto.PreVen) * (producto.cantidad) | currency}}</small>
+                            </p>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
+                      Total {{getTotal() | currency}}
                     </p>
                   </div>
                 </div>
@@ -2,6 +2,7 @@ import { Component, OnInit } from &#39;@angular/core&#39;;
 import { appSettings } from 'src/etc/AppSettings';
 import { Location } from '@angular/common';
 import { ProductoService } from 'src/app/services/producto.service';
+import { Producto } from 'src/app/wrappers/producto';
  
 @Component({
   selector: 'app-confirmacion-carrito',
@@ -10,17 +11,33 @@ import { ProductoService } from &#39;src/app/services/producto.service&#39;;
 })
 export class ConfirmacionCarritoComponent implements OnInit {
  
-  productos = [];
+  productos: Producto[] = [];
+  total: number = 0;
   private apiUrl: string = appSettings.apiUrl;
  
-  constructor(private location: Location, private productoService: ProductoService) { }
+  constructor(
+    private location: Location,
+    private productoService: ProductoService
+  ) { }
  
   ngOnInit() {
+
     this.productos = this.productoService.productos;
   }
  
   volverPreviousPage() {
+
     this.location.back();
   }
  
+  getTotal() {
+
+    var subTotal = 0;
+    this.productos.forEach(producto => {
+
+      subTotal = subTotal + (producto.PreVen * producto.cantidad);
+    });
+    return this.total = subTotal;
+  }
+
 }
@@ -109,6 +109,11 @@ body {
   max-height: 60vh !important;
 }
  
+.vh-50 {
+  min-height: auto !important;
+  max-height: 50vh !important;
+}
+
 .spinner-lg {
   width: 3rem !important;
   height: 3rem !important;
1		-import { Component, OnInit } from '@angular/core';
	1	+import { Component, OnInit, OnDestroy } from '@angular/core';
2	2	import { appSettings } from 'src/etc/AppSettings';
3	3	import { Location } from '@angular/common';
4	4	import { Router } from '@angular/router';
...	...	@@ -9,29 +9,35 @@ import { ProductoService } from 'src/app/services/producto.service';
9	9	templateUrl: './cancelar-compra.component.html',
10	10	styleUrls: ['./cancelar-compra.component.scss']
11	11	})
12		-export class CancelarCompraComponent implements OnInit {
	12	+export class CancelarCompraComponent implements OnInit, OnDestroy {
13	13
14	14	private apiUrl: string = appSettings.apiUrl;
	15	+ private timer: any;
15	16
16	17	constructor(
17	18	private location: Location,
18	19	private router: Router,
19		- private productoService : ProductoService
20		- ) { }
	20	+ private productoService: ProductoService
	21	+ ) { }
21	22
22	23	ngOnInit() {
23	24
24		- setTimeout(() => {
	25	+ this.timer = setTimeout(() => {
25	26	this.limpiarCarritoYvolver();
26	27	}, 30000)
27	28	}
28	29
	30	+ ngOnDestroy() {
	31	+
	32	+ clearTimeout(this.timer);
	33	+ }
	34	+
29	35	volverPreviousPage() {
30	36
31	37	this.location.back();
32	38	}
33	39
34		- limpiarCarritoYvolver(){
	40	+ limpiarCarritoYvolver() {
35	41
36	42	this.productoService.productoAcargar = undefined;
37	43	this.productoService.promoAcargar = undefined;
...	...	@@ -56,18 +56,44 @@
56	56	</div>
57	57	</div>
58	58
59		- <div class="col-sm-5">
	59	+ <div class="col-sm-5 pl-0">
60	60	<div class="row ml-3">
61	61	<!-- TICKET -->
62		- <div class="col-sm-7">
	62	+ <div class="col-sm-7 p-0">
63	63	<div class="card rounded-sm shadow">
64	64	<div class="card-body">
65	65	<p class="h5 card-title">Su Ticket</p>
66		- <p class="h6 card-text text-left mt-4 pr-2 vh-60 overflow-scroll">
67		- Ticket detalle.
68		- </p>
69		- <p class="h4 card-text text-right mt-3 mb-0">
70		- Total {{230 \| currency}}
	66	+ <div class="row mt-4 m-0">
	67	+ <div class="col-12 p-0 mb-2">
	68	+ <p class="h6 m-0 card-text text-left">
	69	+ <small class="font-weight-bold">DESCRIPCIÓN</small>
	70	+ </p>
	71	+ <p class="h6 m-0 card-text text-left">
	72	+ <small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
	73	+ </p>
	74	+ </div>
	75	+ </div>
	76	+ <div class="row vh-50 overflow-scroll m-0">
	77	+ <div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
	78	+ <p class="h6 m-0 card-text text-left">
	79	+ <small>{{producto.DetArt}}</small>
	80	+ </p>
	81	+ <div class="row d-flex justify-content-between m-0">
	82	+ <div class="col p-0">
	83	+ <p class="h6 m-0 card-text text-left">
	84	+ <small>{{producto.cantidad}} x {{producto.PreVen \| currency}}</small>
	85	+ </p>
	86	+ </div>
	87	+ <div class="col p-0">
	88	+ <p class="h6 m-0 card-text text-right">
	89	+ <small>{{(producto.PreVen) * (producto.cantidad) \| currency}}</small>
	90	+ </p>
	91	+ </div>
	92	+ </div>
	93	+ </div>
	94	+ </div>
	95	+ <p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
	96	+ Total {{getTotal() \| currency}}
71	97	</p>
72	98	</div>
73	99	</div>
...	...	@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
2	2	import { appSettings } from 'src/etc/AppSettings';
3	3	import { Location } from '@angular/common';
4	4	import { ProductoService } from 'src/app/services/producto.service';
	5	+import { Producto } from 'src/app/wrappers/producto';
5	6
6	7	@Component({
7	8	selector: 'app-confirmacion-carrito',
...	...	@@ -10,17 +11,33 @@ import { ProductoService } from 'src/app/services/producto.service';
10	11	})
11	12	export class ConfirmacionCarritoComponent implements OnInit {
12	13
13		- productos = [];
	14	+ productos: Producto[] = [];
	15	+ total: number = 0;
14	16	private apiUrl: string = appSettings.apiUrl;
15	17
16		- constructor(private location: Location, private productoService: ProductoService) { }
	18	+ constructor(
	19	+ private location: Location,
	20	+ private productoService: ProductoService
	21	+ ) { }
17	22
18	23	ngOnInit() {
	24	+
19	25	this.productos = this.productoService.productos;
20	26	}
21	27
22	28	volverPreviousPage() {
	29	+
23	30	this.location.back();
24	31	}
25	32
	33	+ getTotal() {
	34	+
	35	+ var subTotal = 0;
	36	+ this.productos.forEach(producto => {
	37	+
	38	+ subTotal = subTotal + (producto.PreVen * producto.cantidad);
	39	+ });
	40	+ return this.total = subTotal;
	41	+ }
	42	+
26	43	}
...	...	@@ -109,6 +109,11 @@ body {
109	109	max-height: 60vh !important;
110	110	}
111	111
	112	+.vh-50 {
	113	+ min-height: auto !important;
	114	+ max-height: 50vh !important;
	115	+}
	116	+
112	117	.spinner-lg {
113	118	width: 3rem !important;
114	119	height: 3rem !important;