Mauricio Cattafi / autoservicio

Download as
Browse Code »

Commit 5a8d8acb7489f08282472f959205b6462de9251c

Authored by Eric Fernandez
2 parents edcb94a1a3 d494d55e1a
Exists in master and in 1 other branch validar_pve

Merge branch 'master' of http://git.focasoftware.com/angular/autoservicio

Showing 16 changed files   Show diff stats
src/app/app-routing.module.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -8,6 +8,7 @@ import { MasterComponent } from './components/master/master.component';
8 8 import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
9 9 import { PagoComponent } from './components/pago/pago.component';
10 10 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
  11 +import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
11 12  
12 13 const routes: Routes = [
13 14 { path: '', component: HomeComponent },
... ... @@ -16,6 +17,7 @@ const routes: Routes = [
16 17 { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
17 18 { path: 'pago', component: PagoComponent },
18 19 { path: 'cancelar-compra', component: CancelarCompraComponent },
  20 + { path: 'mensaje-final', component: MensajeFinalComponent },
19 21 {
20 22 path: '',
21 23 component: MasterComponent,
src/app/app.module.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -22,6 +22,7 @@ import { PopoverSinonimosComponent } from './components/popover-sinonimos/popove
22 22 import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
23 23 import { PagoComponent } from './components/pago/pago.component';
24 24 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
  25 +import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
25 26 //#endregion
26 27  
27 28 @NgModule({
... ... @@ -38,7 +39,8 @@ import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-c
38 39 PopoverSinonimosComponent,
39 40 AmbImagenesComponent,
40 41 PagoComponent,
41   - CancelarCompraComponent
  42 + CancelarCompraComponent,
  43 + MensajeFinalComponent
42 44 ],
43 45 imports: [
44 46 BrowserModule,
src/app/components/cancelar-compra/cancelar-compra.component.ts
Diff comments   View file @ 5a8d8ac
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;
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
Diff comments   View file @ 5a8d8ac
... ... @@ -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 px-2 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>
src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -2,6 +2,7 @@ import { Component, OnInit } from &#39;@angular/core&#39;;
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 &#39;src/app/services/producto.service&#39;;
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 }
src/app/components/header/header.component.html
Diff comments   View file @ 5a8d8ac
1 1 <div class="row m-0 bg-light p-4 justify-content-between">
2   - <div class="col-auto">
3   - <img src="{{apiUrl}}/imagenes/logoaxion.png">
  2 + <div class="col-6">
  3 + <img class="w-25 float-left" src="{{apiUrl}}/imagenes/logoempresa.png">
4 4 </div>
5   - <div class="col-auto">
6   - <img src="{{apiUrl}}/imagenes/logodebo.png">
  5 + <div class="col-6">
  6 + <img class="w-25 float-right" src="{{apiUrl}}/imagenes/logodebo.png">
7 7 </div>
8 8 </div>
src/app/components/home/home.component.html
Diff comments   View file @ 5a8d8ac
1 1 <div class="container-fluid p-0">
2   - <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100 w-100">
  2 + <img
  3 + src="{{apiUrl}}/imagenes/homeBackground.jpg"
  4 + class="background-image vh-100 w-100">
3 5 <div class="row m-0">
4 6 <div class="col p-0">
5 7 <div
... ... @@ -9,14 +11,34 @@
9 11 <!-- HEADER -->
10 12 <div class="row m-0 w-100 bg-primary-gradient-horizontal">
11 13 <div class="col-6 bg-white p-3 rounded-bottom-right">
12   - <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoaxion.png">
  14 + <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png">
13 15 </div>
14 16 </div>
15 17  
16 18 <!-- INFO DE BIENVENIDA -->
17 19 <div class="row w-100">
18 20 <div class="col-4 offset-2">
19   - <img src="{{apiUrl}}/imagenes/accesoPLAYA.png" class="w-100">
  21 +
  22 + <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
  23 + <div class="carousel-inner">
  24 + <div class="carousel-item active">
  25 + <img
  26 + src="{{apiUrl}}/imagenes/coca1.jpg"
  27 + class="d-block rounded-sm shadow w-100">
  28 + </div>
  29 + <div class="carousel-item">
  30 + <img
  31 + src="{{apiUrl}}/imagenes/coca2.jpg"
  32 + class="d-block rounded-sm shadow w-100">
  33 + </div>
  34 + <div class="carousel-item">
  35 + <img
  36 + src="{{apiUrl}}/imagenes/coca3.jpg"
  37 + class="d-block rounded-sm shadow w-100">
  38 + </div>
  39 + </div>
  40 + </div>
  41 +
20 42 </div>
21 43 <div class="col-6 text-center text-white my-auto">
22 44 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
src/app/components/mensaje-final/mensaje-final.component.html
Diff comments   View file @ 5a8d8ac
... ... @@ -0,0 +1,43 @@
  1 +<div class="container-fluid fade-in p-0 disable-user-select">
  2 + <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100 w-100">
  3 + <div class="row m-0">
  4 + <div class="col p-0">
  5 + <div class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select">
  6 +
  7 + <!-- HEADER -->
  8 + <div class="row m-0 w-100 bg-primary-gradient-horizontal">
  9 + <div class="col-6 bg-white p-3 rounded-bottom-right">
  10 + <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png">
  11 + </div>
  12 + </div>
  13 +
  14 + <div class="row py-5 m-0 w-100">
  15 + <div class="col-6 offset-3">
  16 + <div class="row h-100">
  17 + <div class="col-12 my-auto">
  18 + <div>
  19 + <div class="mb-5 mt-4">
  20 + <p class="display-1 card-text text-center text-white font-weight-bold">
  21 + Gracias
  22 + </p>
  23 + <p class="display-4 card-text text-center text-white font-weight-bold">
  24 + Por su compra
  25 + </p>
  26 + </div>
  27 + </div>
  28 + </div>
  29 + </div>
  30 + </div>
  31 + </div>
  32 +
  33 + <!-- FOOTER -->
  34 + <div class="row m-0 w-100 bg-gray">
  35 + <div class="col-6 bg-white offset-6 p-3 rounded-top-left">
  36 + <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">
  37 + </div>
  38 + </div>
  39 +
  40 + </div>
  41 + </div>
  42 + </div>
  43 +</div>
src/app/components/mensaje-final/mensaje-final.component.scss
Diff comments   View file @ 5a8d8ac
src/app/components/mensaje-final/mensaje-final.component.spec.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { MensajeFinalComponent } from './mensaje-final.component';
  4 +
  5 +describe('MensajeFinalComponent', () => {
  6 + let component: MensajeFinalComponent;
  7 + let fixture: ComponentFixture<MensajeFinalComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ MensajeFinalComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(MensajeFinalComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/components/mensaje-final/mensaje-final.component.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -0,0 +1,42 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +import { appSettings } from 'src/etc/AppSettings';
  3 +import { ProductoService } from 'src/app/services/producto.service';
  4 +import { Router } from '@angular/router';
  5 +
  6 +@Component({
  7 + selector: 'app-mensaje-final',
  8 + templateUrl: './mensaje-final.component.html',
  9 + styleUrls: ['./mensaje-final.component.scss']
  10 +})
  11 +export class MensajeFinalComponent implements OnInit {
  12 +
  13 + private apiUrl: string = appSettings.apiUrl;
  14 + private timer: any;
  15 +
  16 + constructor(
  17 + private productoService: ProductoService,
  18 + private router: Router
  19 + ) { }
  20 +
  21 + ngOnInit() {
  22 +
  23 + this.timer = setTimeout(() => {
  24 +
  25 + this.limpiarCarritoYvolver();
  26 + }, 3000)
  27 + }
  28 +
  29 + ngOnDestroy() {
  30 +
  31 + clearTimeout(this.timer);
  32 + }
  33 +
  34 + limpiarCarritoYvolver() {
  35 +
  36 + this.productoService.productoAcargar = undefined;
  37 + this.productoService.promoAcargar = undefined;
  38 + this.productoService.productos = [];
  39 + this.router.navigate(['/home']);
  40 + }
  41 +
  42 +}
src/app/components/pago/pago.component.html
Diff comments   View file @ 5a8d8ac
1   -<div class="row">
  1 +<div
  2 + *ngIf="!compraConEfectivofinalizada && !compraConQRfinalizada"
  3 + class="row m-0 fade-in bg-primary-gradient disable-user-select">
  4 +
  5 + <div class="col-12 p-0 vh-100">
2 6  
3   - <app-header></app-header>
4   -
5   - <div class="col-12">
  7 + <app-header></app-header>
6 8  
7 9 <!-- NOMBRE DE SECCION -->
8 10 <div class="row m-0">
9 11 <div class="col-12 p-0">
10   - <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p>
  12 + <p class="h5 py-1 bg-gray text-muted text-center m-0">
  13 + Pagar
  14 + <i class="fa fa-usd"></i>
  15 + </p>
11 16 </div>
12 17 </div>
13 18  
14   - <div class="row m-3 d-flex align-items-center">
15   - <div class="col-4">
16   - <h1>Mi Compra <i class="fa fa-shopping-cart"></i></h1>
17   - </div>
18   - <div class="col-8">
19   - <h2 *ngIf="!verQR">Seleccione medio de pago</h2>
20   - <h2 *ngIf="verQR">Escane QR</h2>
  19 + <div *ngIf="!verQR" class="row mt-4 m-3 d-flex align-items-center">
  20 + <div class="col-7 text-center">
  21 + <p class="text-white h2" *ngIf="!verQR">Elija forma de pago</p>
21 22 </div>
22 23 </div>
23 24  
24   - </div>
  25 + <div *ngIf="!verQR" class="row fade-in mt-3">
  26 + <!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
  27 + <div class="col-sm-7">
  28 + <div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">
  29 + <div class="col-4 p-2">
  30 + <div class="bg-white rounded-sm shadow border-0">
  31 + <img src="{{apiUrl}}/imagenes/efectivo.png" class="rounded-sm w-75 py-2 mx-auto d-block">
  32 + <div class="p-2 card-text text-center">
  33 + <p class="h6 text-center m-0">Efectivo</p>
  34 + </div>
  35 + </div>
  36 + </div>
  37 + <div class="col-4 p-2">
  38 + <div class="bg-white rounded-sm shadow border-0">
  39 + <img src="{{apiUrl}}/imagenes/tarjeta.png" class="rounded-sm w-75 py-2 mx-auto d-block">
  40 + <div class="p-2 card-text text-center">
  41 + <p class="h6 text-center m-0">Tarjeta</p>
  42 + </div>
  43 + </div>
  44 + </div>
  45 + <div class="col-4 p-2">
  46 + <div
  47 + class="bg-white rounded-sm shadow border-0"
  48 + (click)="pagar()">
  49 + <img src="{{apiUrl}}/imagenes/qr.png" class="rounded-sm w-75 py-2 mx-auto d-block">
  50 + <div class="p-2 card-text text-center">
  51 + <p class="h6 text-center m-0">Pago Electrónico</p>
  52 + </div>
  53 + </div>
  54 + </div>
  55 + </div>
  56 + </div>
25 57  
26   - <div *ngIf="!verQR" class="col-6 card bg-white border-0 shadow rounded mb-auto">
27   - <input type="radio">
28   - <label>Mercado Pago</label>
29   - </div>
  58 + <div class="col-sm-5 pl-0">
  59 + <div class="row ml-3">
  60 + <!-- TICKET -->
  61 + <div class="col-sm-7 p-0">
  62 + <div class="card rounded-sm shadow">
  63 + <div class="card-body">
  64 + <p class="h5 card-title">Su Ticket</p>
  65 + <div class="row mt-4 m-0">
  66 + <div class="col-12 p-0 mb-2">
  67 + <p class="h6 m-0 card-text text-left">
  68 + <small class="font-weight-bold">DESCRIPCIÓN</small>
  69 + </p>
  70 + <p class="h6 m-0 card-text text-left">
  71 + <small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
  72 + </p>
  73 + </div>
  74 + </div>
  75 + <div class="row px-2 vh-50 overflow-scroll m-0">
  76 + <div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
  77 + <p class="h6 m-0 card-text text-left">
  78 + <small>{{producto.DetArt}}</small>
  79 + </p>
  80 + <div class="row d-flex justify-content-between m-0">
  81 + <div class="col p-0">
  82 + <p class="h6 m-0 card-text text-left">
  83 + <small>{{producto.cantidad}} x {{producto.PreVen | currency}}</small>
  84 + </p>
  85 + </div>
  86 + <div class="col p-0">
  87 + <p class="h6 m-0 card-text text-right">
  88 + <small>{{(producto.PreVen) * (producto.cantidad) | currency}}</small>
  89 + </p>
  90 + </div>
  91 + </div>
  92 + </div>
  93 + </div>
  94 + <p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
  95 + Total {{getTotal() | currency}}
  96 + </p>
  97 + </div>
  98 + </div>
  99 + </div>
  100 + </div>
  101 + </div>
  102 + </div>
30 103  
31   - <div *ngIf="verQR" class="col-6 card bg-white border-0 shadow rounded mb-auto">
32   - <h3>Pago con QR mercado pago</h3>
33   - <div class="card-body">
34   - <img src="{{apiUrl}}/imagenes/qrmp.jpg" alt="">
  104 + <div *ngIf="verQR" class="row fade-in mt-5">
  105 + <div class="col-6 offset-3 border-0 mb-auto">
  106 + <img src="{{apiUrl}}/imagenes/qrmp.jpg" class="w-50 mx-auto d-block shadow rounded-sm">
  107 + </div>
35 108 </div>
36   - </div>
37 109  
38   - <!-- OPCIONES ABAJO DERECHA -->
39   - <div class="row m-0 fixed-bottom" >
40   - <div class="col-sm-2 offset-sm-10 p-0 mt-auto">
41   - <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
42   - <div class="card-body row m-0">
43   - <div class="col-12 p-3">
44   - <button
45   - type="button"
46   - class="btn btn-block btn-light shadow btn-sm shadow"
47   - (click)="volverPreviousPage()">
48   - <span class="pr-2">Volver</span>
49   - <i class="fa fa-undo text-warning"></i>
50   - </button>
51   - <button *ngIf="!verQR" (click)="pagar()" type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1">
52   - <span class="font-weight-bold pr-2">Finalizar y Pagar</span>
53   - <i class="fa fa-check text-success"></i>
54   - </button>
55   - <button *ngIf="!verQR"
56   - type="button"
57   - class="btn btn-block btn-light shadow btn-sm shadow"
58   - [routerLink]="['/cancelar-compra']">
59   - <span class="pr-2">Cancelar</span>
60   - <i class="fa fa-times text-danger"></i>
61   - </button>
  110 + <!-- OPCIONES ABAJO DERECHA -->
  111 + <div class="row m-0 fixed-bottom" >
  112 + <div class="col-sm-2 offset-sm-10 p-0 mt-auto">
  113 + <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
  114 + <div class="card-body row m-0">
  115 + <div class="col-12 p-3">
  116 + <button
  117 + type="button"
  118 + class="btn btn-block btn-light shadow btn-sm shadow"
  119 + (click)="volverPreviousPage()">
  120 + <span class="pr-2">Volver</span>
  121 + <i class="fa fa-undo text-warning"></i>
  122 + </button>
  123 + <button
  124 + type="button"
  125 + class="btn btn-block btn-light shadow btn-sm shadow"
  126 + [routerLink]="['/cancelar-compra']">
  127 + <span class="pr-2">Cancelar</span>
  128 + <i class="fa fa-times text-danger"></i>
  129 + </button>
  130 + </div>
62 131 </div>
63 132 </div>
64 133 </div>
65 134 </div>
  135 +
66 136 </div>
67 137  
68 138 </div>
  139 +
  140 +<div
  141 + *ngIf="compraConQRfinalizada"
  142 + class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
  143 + <div class="col-12 text-center text-white my-auto">
  144 + <p class="font-weight-bold display-4">
  145 + Su pago fue<br>
  146 + acreditado
  147 + exitosamente
  148 + </p>
  149 + <p class="font-weight-bold display-4">Recuerde retirar su ticket</p>
  150 + </div>
  151 +</div>
  152 +
  153 +<div
  154 + *ngIf="compraConEfectivofinalizada"
  155 + class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
  156 + <div class="col-12 text-center text-white my-auto">
  157 + <p class="font-weight-bold display-4">
  158 + Retire su ticket<br>
  159 + y diríjase a caja para<br>
  160 + efectuar el pago.
  161 + </p>
  162 + </div>
  163 +</div>
src/app/components/pago/pago.component.ts
Diff comments   View file @ 5a8d8ac
1 1 import { Component, OnInit } from '@angular/core';
2 2 import { appSettings } from 'src/etc/AppSettings';
  3 +import { Location } from '@angular/common';
3 4 import { ProductoService } from 'src/app/services/producto.service';
4   -import { RouterLink } from '@angular/router';
  5 +import { RouterLink, Router } from '@angular/router';
  6 +import { Producto } from 'src/app/wrappers/producto';
5 7  
6 8 @Component({
7 9 selector: 'app-pago',
... ... @@ -12,10 +14,20 @@ export class PagoComponent implements OnInit {
12 14  
13 15 private apiUrl: string = appSettings.apiUrl;
14 16 private verQR: boolean = false;
  17 + private productos: Producto[] = [];
  18 + private total: number = 0;
15 19  
16   - constructor(private productoService: ProductoService) { }
  20 + private compraConQRfinalizada: boolean = false;
  21 + private compraConEfectivofinalizada: boolean = false;
  22 +
  23 + constructor(
  24 + private productoService: ProductoService,
  25 + private location: Location,
  26 + private router: Router,
  27 + ) { }
17 28  
18 29 ngOnInit() {
  30 + this.productos = this.productoService.productos;
19 31 }
20 32  
21 33 pagar() {
... ... @@ -25,11 +37,35 @@ export class PagoComponent implements OnInit {
25 37  
26 38 this.productoService.pagar()
27 39 .subscribe(() => {
28   - alert('Compra finalizada');
  40 + // alert('Compra finalizada');
  41 + this.compraConQRfinalizada = true;
  42 + setTimeout(() => {
  43 +
  44 + this.router.navigate(['mensaje-final']);
  45 + }, 1000);
29 46 }, err => {
30 47 console.log(err);
31 48 alert('algo salió mal');
32 49 })
33 50 }
34 51  
  52 + volverPreviousPage() {
  53 +
  54 + if (this.verQR) {
  55 + this.verQR = false;
  56 + return;
  57 + }
  58 + this.location.back();
  59 + }
  60 +
  61 + getTotal() {
  62 +
  63 + var subTotal = 0;
  64 + this.productos.forEach(producto => {
  65 +
  66 + subTotal = subTotal + (producto.PreVen * producto.cantidad);
  67 + });
  68 + return this.total = subTotal;
  69 + }
  70 +
35 71 }
src/app/components/sidebar/sidebar.component.html
Diff comments   View file @ 5a8d8ac
... ... @@ -15,7 +15,6 @@
15 15 <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">
16 16 <div class="col-12 p-0 pt-2 text-left my-auto">
17 17 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
18   - <p class="m-0 h6"><small>COD: {{producto.CodRub}}</small></p>
19 18 </div>
20 19 <div class="col-12 pr-1 text-right h6 my-auto ">
21 20 <p class="m-0">{{producto.PreVen | currency}}</p>
... ... @@ -49,7 +48,7 @@
49 48 <!-- PERSONALIZAR -->
50 49 <div class="col-auto px-1 my-2">
51 50 <button
52   - *ngIf="esPersonalizable(producto)"
  51 + *ngIf="producto.tieneSinonimos"
53 52 type="button"
54 53 class="btn btn-light btn-sm my-auto float-left border shadow"
55 54 (click)="personalizarPromo(producto, i)">
src/app/components/sidebar/sidebar.component.ts
Diff comments   View file @ 5a8d8ac
... ... @@ -77,15 +77,6 @@ export class SidebarComponent implements OnInit {
77 77 return;
78 78 }
79 79  
80   - esPersonalizable(producto: Producto) {
81   -
82   - var esPersonalizable: boolean = false;
83   - if (producto.tieneSinonimos)
84   - esPersonalizable = true;
85   -
86   - return esPersonalizable;
87   - }
88   -
89 80 personalizarPromo(producto: Producto, index) {
90 81  
91 82 this.productoService.productoAcargar = producto;
... ... @@ -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;