Marcelo Puebla / autoservicio-axion

Download as
Browse Code ยป

Commit 158a2e33ff0bd53ba8ed7ea8f24b70e4fb48fcd3

Authored by Marcelo Puebla
1 parent b4aa9e4f03
Exists in develop

Fix 

Modal confirmacion
Showing 2 changed files with 51 additions and 53 deletions   Show diff stats
src/app/shared/confirmacion/confirmacion.component.html
Diff comments   View file @ 158a2e3
1 <div class="modal-header bg-primary rounded-top pt-4 px-2"> 1 <div class="bg-primary rounded">
2 <img 2 <div class="modal-header">
3 draggable="false"
4 ondragstart="return false;"
5 (contextmenu)="false"
6 (click)="close()"
7 class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
8 src="assets/img/icono-cancelar-blanco.svg">
9 <div class="row mx-0 w-100 justify-content-between">
10 <div class="col-8">
11 <p *ngIf="titleMessage" class="h3 text-white">{{titleMessage}}</p>
12 </div>
13 </div>
14 <div *ngIf="imagenPath" class="col-4 align-self-center">
15 <img 3 <img
16 draggable="false" 4 draggable="false"
17 ondragstart="return false;" 5 ondragstart="return false;"
18 (contextmenu)="false" 6 (contextmenu)="false"
19 src="{{urlImagenes}}{{imagenPath}}" 7 (click)="close()"
20 onerror="this.src='assets/img/imagen-no-encontrada.jpg'" 8 class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
21 class="card-img-top img-fluid rounded-circle"> 9 src="assets/img/icono-cancelar-blanco.svg">
22 </div> 10 <div class="row no-gutters w-100 justify-content-between">
23 </div> 11 <div class="col align-self-center">
24 <div class=" col-12 modal-body bg-primary rounded-bottom pb-3 px-2"> 12 <p *ngIf="titleMessage" class="h3 text-white">{{titleMessage}}</p>
25 <div class="row justify-content-between mx-0 w-100"> 13 </div>
26 <div class="col-8"> 14 <div *ngIf="imagenPath" class="col-4 px-3 pt-3 align-self-center">
27 <p *ngIf="footerMessageFirst" class="text-white"><small>{{footerMessageFirst}}</small></p > 15 <img
28 <h1 *ngIf="footerMessageSecond" class="text-white mb-4">{{footerMessageSecond}}</h1> 16 draggable="false"
17 ondragstart="return false;"
18 (contextmenu)="false"
19 src="{{urlImagenes}}{{imagenPath}}"
20 onerror="this.src='assets/img/imagen-no-encontrada.jpg'"
21 class="d-block mx-auto img-fluid rounded-circle">
22 </div>
29 </div> 23 </div>
30 <div class="col-4"> 24 </div>
31 <div 25 <div class="modal-body">
32 class="mx-0" 26 <div class="row justify-content-between mx-0 w-100">
33 (click)="confirmarArticulo()"> 27 <div class="col-7 col-md-8 pl-0 align-self-center">
34 <div class="col-auto bg-white badge-pill"> 28 <p *ngIf="footerMessageFirst" class="text-white"><small>{{footerMessageFirst}}</small></p >
35 <div class="row justify-content-between"> 29 <p *ngIf="footerMessageSecond" class="h1 text-white">{{footerMessageSecond}}</p>
36 <div *ngIf="footerConfirmation" class="col-auto px-0 align-self-center text-primary pl-3"> 30 </div>
37 <p class="font-weight-bold">{{footerConfirmation | currency}}</p> 31 <div class="col-5 col-md-4 align-self-center">
38 </div> 32 <div
39 <div class="col-auto px-0"> 33 class="row justify-content-between bg-white badge-pill btn-effect"
40 <img 34 *ngIf="footerConfirmation"
41 draggable="false" 35 (click)="confirmar()">
42 ondragstart="return false;" 36 <div class="col-auto px-0 align-self-center text-primary pl-3">
43 (contextmenu)="false" 37 <p class="font-weight-bold">{{footerConfirmation | currency}}</p>
44 class="d-block ml-auto my-1 icon-30 pr-2" 38 </div>
45 src="assets/img/ir-color.svg"> 39 <div class="col-auto px-0">
46 </div> 40 <img
41 draggable="false"
42 ondragstart="return false;"
43 (contextmenu)="false"
44 class="d-block ml-auto my-1 icon-20"
45 src="assets/img/ir-color.svg">
47 </div> 46 </div>
48 </div> 47 </div>
49 </div> 48 <div
50 <div *ngIf="footerClose" class="bg-white badge-pill mt-2"> 49 *ngIf="footerClose"
51 <div class="row justify-content-between"> 50 class="row justify-content-center bg-white badge-pill btn-effect mt-2"
52 <div 51 (click)="close()">
src/app/shared/confirmacion/confirmacion.component.ts
Diff comments   View file @ 158a2e3
1 import { Component, OnInit, HostListener } from '@angular/core'; 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { BsModalRef } from 'ngx-bootstrap/modal'; 2 import { BsModalRef } from 'ngx-bootstrap/modal';
3 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 3 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
4 import { Subject } from 'rxjs'; 4 import { Subject } from 'rxjs';
5 import { APP_SETTINGS } from 'src/etc/AppSettings'; 5 import { APP_SETTINGS } from 'src/etc/AppSettings';
6 6
7 @Component({ 7 @Component({
8 selector: 'app-confirmacion', 8 selector: 'app-confirmacion',
9 templateUrl: './confirmacion.component.html', 9 templateUrl: './confirmacion.component.html',
10 styleUrls: ['./confirmacion.component.scss'] 10 styleUrls: ['./confirmacion.component.scss']
11 }) 11 })
12 export class ConfirmacionComponent implements OnInit { 12 export class ConfirmacionComponent implements OnInit {
13 titleMessage: string; 13 titleMessage: string;
14 imagenPath: any; 14 imagenPath: any;
15 footerMessageFirst: string; 15 footerMessageFirst: string;
16 footerMessageSecond: string; 16 footerMessageSecond: string;
17 footerConfirmation: number; 17 footerConfirmation: number;
18 footerClose: string; 18 footerClose: string;
19 onClose: Subject<any>; 19 onClose: Subject<any>;
20 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 20 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
21 21
22 constructor( 22 constructor(
23 public modalRef: BsModalRef, 23 public modalRef: BsModalRef,
24 private inactiveScreen: InactiveScreenService, 24 private inactiveScreen: InactiveScreenService,
25 ) { 25 ) {
26 this.onClose = new Subject(); 26 this.onClose = new Subject();
27 } 27 }
28 28
29 ngOnInit() { 29 ngOnInit() {
30 } 30 }
31 31
32 confirmarArticulo() { 32 confirmar() {
33 this.onClose.next(); 33 this.onClose.next();
34 this.modalRef.hide(); 34 this.modalRef.hide();
35 } 35 }
36 36
37 close() { 37 close() {
38 this.modalRef.hide(); 38 this.modalRef.hide();
39 } 39 }
40 40
41 @HostListener('document:click', ['$event']) 41 @HostListener('document:click', ['$event'])
42 eventListener(event: Event) { 42 eventListener(event: Event) {
43 clearTimeout(this.inactiveScreen.timerReposo); 43 clearTimeout(this.inactiveScreen.timerReposo);
44 this.inactiveScreen.startTimeOutInactividad(); 44 this.inactiveScreen.startTimeOutInactividad();
45 } 45 }
46 } 46 }
47 47