Luis Suarez / autoservicio-axion

Download as
Browse Code ยป

Commit 8ee1c6e43be4cc61ffd10c988f1a0d612ca87461

Authored by Benjamin Rodriguez
1 parent 589c8efc64
Exists in develop

agrando modal pago efectivo y creo modal de espera en pago con tarjeta

Showing 4 changed files with 35 additions and 3 deletions   Show diff stats
src/app/modules/info-formas-pago/info-formas-pago.component.ts
Diff comments   View file @ 8ee1c6e
... ... @@ -22,7 +22,7 @@ export class InfoFormasPagoComponent implements OnInit, OnDestroy {
22 22 }
23 23  
24 24 openGoCaja(templateRef: TemplateRef<any>) {
25   - const modalRef = this.modalService.show(templateRef, { class: 'modal-dialog-centered' });
  25 + const modalRef = this.modalService.show(templateRef, { class: 'modal-lg modal-dialog-centered' });
26 26 this.timer = setTimeout(() => {
27 27 modalRef.hide();
28 28 }, 3000);
src/app/modules/pago-tarjeta/pago-tarjeta.component.html
Diff comments   View file @ 8ee1c6e
... ... @@ -57,3 +57,14 @@
57 57 </div>
58 58 </div>
59 59 </div>
  60 +
  61 +<ng-template #template>
  62 + <div class="modal-body rounded bg-primary">
  63 + <h1 class="text-white text-center my-4">Por favor,<br>espera un momento</h1>
  64 + <div class="d-flex justify-content-center mt-2 mb-4">
  65 + <div class="spinner-border text-white text-center" role="status">
  66 + <span class="sr-only">Loading...</span>
  67 + </div>
  68 + </div>
  69 + </div>
  70 +</ng-template>
60 71 \ No newline at end of file
src/app/modules/pago-tarjeta/pago-tarjeta.component.scss
Diff comments   View file @ 8ee1c6e
... ... @@ -52,3 +52,8 @@
52 52 .pago-tarjeta.media-pantalla{
53 53 margin-top: 50px !important;
54 54 }
  55 +
  56 +.spinner-border {
  57 + width: 5rem;
  58 + height: 5rem;
  59 +}
src/app/modules/pago-tarjeta/pago-tarjeta.component.ts
Diff comments   View file @ 8ee1c6e
1   -import { Component, OnInit } from '@angular/core';
  1 +import { Component, OnInit, TemplateRef, OnDestroy, ViewChild } from '@angular/core';
2 2 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3 3 import { Router } from '@angular/router';
  4 +import { BsModalService } from 'ngx-bootstrap/modal';
4 5  
5 6 @Component({
6 7 selector: 'app-pago-tarjeta',
7 8 templateUrl: './pago-tarjeta.component.html',
8 9 styleUrls: ['./pago-tarjeta.component.scss']
9 10 })
10   -export class PagoTarjetaComponent implements OnInit {
  11 +export class PagoTarjetaComponent implements OnInit, OnDestroy {
  12 + timer: any;
  13 + @ViewChild('template', {static: true}) public template: TemplateRef<any>;
11 14  
12 15 constructor(
13 16 private articuloService: ArticuloService,
14 17 private router: Router,
  18 + private modalService: BsModalService
15 19 ) { }
16 20  
17 21 ngOnInit() {
... ... @@ -19,6 +23,7 @@ export class PagoTarjetaComponent implements OnInit {
19 23 this.router.navigate(['']);
20 24 return;
21 25 }
  26 + this.openModalEspera(this.template);
22 27 const dataPago = {
23 28 pedidoAnombreDe: ''
24 29 };
... ... @@ -30,9 +35,20 @@ export class PagoTarjetaComponent implements OnInit {
30 35 this.mediaPantalla();
31 36 }
32 37  
  38 + ngOnDestroy() {
  39 + if (this.timer) clearTimeout(this.timer);
  40 + }
  41 +
33 42 mediaPantalla() {
34 43 if ($('body').hasClass('media-pantalla')) {
35 44 $('.pago-tarjeta').addClass('media-pantalla');
36 45 }
37 46 }
  47 +
  48 + openModalEspera(templateRef: TemplateRef<any>) {
  49 + const modalRef = this.modalService.show(templateRef, { class: 'modal-lg modal-dialog-centered' });
  50 + this.timer = setTimeout(() => {
  51 + modalRef.hide();
  52 + }, 5000);
  53 + }
38 54 }