Commit 8c93448006f30cbe6a61273f36c2d5f44ec82ecb

Authored by Marcelo Puebla
Exists in develop

Merge branch 'develop' of git.focasoftware.com:angular/autoservicio-axion into develop

src/app/modules/seleccion-articulos/seleccion-articulos.module.ts
1 import { NgModule } from '@angular/core'; 1 import { NgModule } from '@angular/core';
2 import { CommonModule } from '@angular/common'; 2 import { CommonModule } from '@angular/common';
3 import { SeleccionArticulosRoutingModule } from './seleccion-articulos-routing.module'; 3 import { SeleccionArticulosRoutingModule } from './seleccion-articulos-routing.module';
4 import { SeleccionArticulosComponent } from './seleccion-articulos.component'; 4 import { SeleccionArticulosComponent } from './seleccion-articulos.component';
5 import { HeaderPublicidadComponent } from 'src/app/shared/header-publicidad/header-publicidad.component'; 5 import { HeaderPublicidadComponent } from 'src/app/shared/header-publicidad/header-publicidad.component';
6 import { ModalModule } from 'ngx-bootstrap/modal'; 6 import { ModalModule } from 'ngx-bootstrap/modal';
7 import { CarouselModule } from 'ngx-bootstrap/carousel'; 7 import { CarouselModule } from 'ngx-bootstrap/carousel';
8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component'; 8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 import { SharedModule } from '../shared/shared.module'; 9 import { SharedModule } from '../shared/shared.module';
10 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
10 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component'; 11 import { FormsModule } from '@angular/forms';
11 import { FormsModule } from '@angular/forms'; 12 import { ConfirmacionComponent } from 'src/app/shared/confirmacion/confirmacion.component';
12 13
13 @NgModule({ 14 @NgModule({
14 declarations: [ 15 declarations: [
15 SeleccionArticulosComponent, 16 SeleccionArticulosComponent,
17 HeaderPublicidadComponent,
16 HeaderPublicidadComponent, 18 PromocionComponent,
17 PromocionComponent, 19 SinonimoComponent,
18 SinonimoComponent, 20 ConfirmacionComponent
19 ], 21 ],
20 imports: [ 22 imports: [
21 CommonModule, 23 CommonModule,
22 SeleccionArticulosRoutingModule, 24 SeleccionArticulosRoutingModule,
23 FormsModule, 25 FormsModule,
24 ModalModule.forRoot(), 26 ModalModule.forRoot(),
25 CarouselModule.forRoot(), 27 CarouselModule.forRoot(),
26 SharedModule 28 SharedModule
27 ], 29 ],
28 exports: [HeaderPublicidadComponent], 30 exports: [HeaderPublicidadComponent],
29 entryComponents: [PromocionComponent, SinonimoComponent] 31 entryComponents: [PromocionComponent, ConfirmacionComponent, SinonimoComponent]
30 }) 32 })
31 export class SeleccionArticulosModule { } 33 export class SeleccionArticulosModule { }
32 34
src/app/modules/splash-screen/splash-screen.component.html
1 <div *ngIf="showSplashScreen" class="h-100 bg-splash"> 1 <div *ngIf="showSplashScreen" class="h-100 bg-splash">
2 <div class="row mx-0 h-100"> 2 <div
3 class="row mx-0 h-100"
4 [routerLink]="['/info-formas-pago']">
3 <div class="col-12 px-0 h-30 my-auto"> 5 <div class="col-12 px-0 h-30 my-auto">
4 <img 6 <img
5 draggable="false" 7 draggable="false"
6 ondragstart="return false;" 8 ondragstart="return false;"
7 (contextmenu)="false" 9 (contextmenu)="false"
8 class="d-block mx-auto h-100 focus-in-blur" 10 class="d-block mx-auto h-100 focus-in-blur"
9 src="assets/img/logo-spot.svg"> 11 src="assets/img/logo-spot.svg">
10 </div> 12 </div>
11 </div> 13 </div>
12 </div> 14 </div>
13 15
14 <div *ngIf="!showSplashScreen" class="h-100 bg-primary fade-in"> 16 <div *ngIf="!showSplashScreen" class="h-100 bg-primary fade-in">
15 <div class="row mx-0 h-100"> 17 <div
18 class="row mx-0 h-100"
19 [routerLink]="['/info-formas-pago']">
16 <div class="col-12 px-0 h-100 my-auto"> 20 <div class="col-12 px-0 h-100 my-auto">
17 <div class="row mx-0 h-15"> 21 <div class="row mx-0 h-15">
18 <div class="col-12 px-0 h-80 my-auto"> 22 <div class="col-12 px-0 h-80 my-auto">
19 <img 23 <img
20 draggable="false" 24 draggable="false"
21 ondragstart="return false;" 25 ondragstart="return false;"
22 (contextmenu)="false" 26 (contextmenu)="false"
23 class="d-block mx-auto h-100" 27 class="d-block mx-auto h-100"
24 src="assets/img/negativo-spot.svg"> 28 src="assets/img/negativo-spot.svg">
25 </div> 29 </div>
26 </div> 30 </div>
27 <div class="row mx-0 h-75 justify-content-center text-white text-center"> 31 <div class="row mx-0 h-75 justify-content-center text-white text-center">
28 <div class="col-7 h-auto px-0 py-5 mb-5 align-self-end box"> 32 <div class="col-7 h-auto px-0 py-5 mb-5 align-self-end box">
29 <div class="h6 m-0 welcome-text text-info"> 33 <div class="h6 m-0 welcome-text text-info">
30 <span *ngFor="let letter of textWelcome | split textWelcome">{{letter}}</span> 34 <span *ngFor="let letter of textWelcome | split textWelcome">{{letter}}</span>
31 </div> 35 </div>
32 <div class="h1 m-0 como-estas-text"> 36 <div class="h1 m-0 como-estas-text">
33 <span *ngFor="let letter of textComoEstas | split textComoEstas">{{letter}}</span> 37 <span *ngFor="let letter of textComoEstas | split textComoEstas">{{letter}}</span>
34 </div> 38 </div>
35 </div> 39 </div>
36 <div class="col-7 h-auto px-0 py-5 mt-5 align-self-start box2"> 40 <div class="col-7 h-auto px-0 py-5 mt-5 align-self-start box2">
37 <div class="h6 m-0 invitamos-text text-info"> 41 <div class="h6 m-0 invitamos-text text-info">
38 <span *ngFor="let letter of textInvitamos | split textInvitamos">{{letter}}</span> 42 <span *ngFor="let letter of textInvitamos | split textInvitamos">{{letter}}</span>
39 </div> 43 </div>
40 <div class="h1 m-0 tu-pedido-text"> 44 <div class="h1 m-0 tu-pedido-text">
41 <span *ngFor="let letter of textTuPedido | split textTuPedido">{{letter}}</span> 45 <span *ngFor="let letter of textTuPedido | split textTuPedido">{{letter}}</span>
42 </div> 46 </div>
43 </div> 47 </div>
44 </div> 48 </div>
45 <div 49 <div class="row mx-0 h-10 loop-color cursor-pointer">
46 class="row mx-0 h-10 loop-color cursor-pointer"
47 [routerLink]="['/info-formas-pago']">
48 <div class="col-12 text-center align-self-center px-0"> 50 <div class="col-12 text-center align-self-center px-0">
49 <p class="h6 text-white">TOCA PARA COMENZAR</p> 51 <p class="h6 text-white">TOCA PARA COMENZAR</p>
50 </div> 52 </div>
51 </div> 53 </div>
52 </div> 54 </div>
53 </div> 55 </div>
src/app/shared/confirmacion/confirmacion.component.html
File was created 1 <div class="modal-header bg-primary rounded-top pt-4 px-2">
2 <div class="row mx-0 w-100 justify-content-between">
3 <div class="col-8">
4 <p *ngIf="titleMessage" class="h3 text-white">{{titleMessage}}</p>
5 </div>
6 </div>
7 <div *ngIf="imagenPath" class="col-4 align-self-center">
8 <img
9 draggable="false"
10 ondragstart="return false;"
11 (contextmenu)="false"
12 src="{{urlImagenes}}{{imagenPath}}"
13 onerror="this.src='assets/img/image-not-found.jpg'"
14 class="card-img-top img-fluid rounded-circle">
15 </div>
16 </div>
17 <div class=" col-12 modal-body bg-primary rounded-bottom pb-3 px-2">
18 <div class="row justify-content-between mx-0 w-100">
19 <div class="col-8">
20 <p *ngIf="footerMessageFirst" class="text-white"><small>{{footerMessageFirst}}</small></p >
21 <h1 *ngIf="footerMessageSecond" class="text-white mb-4">{{footerMessageSecond}}</h1>
22 </div>
23 <div class="col-4">
24 <div
25 class="mx-0"
26 (click)="confirmarArticulo()">
27 <div class="col-auto bg-white badge-pill">
28 <div class="row justify-content-between">
29 <div *ngIf="footerConfirmation" class="col-auto px-0 align-self-center text-primary pl-3">
30 <p class="font-weight-bold">{{footerConfirmation | currency}}</p>
31 </div>
32 <div class="col-auto px-0">
33 <img
34 draggable="false"
35 ondragstart="return false;"
36 (contextmenu)="false"
37 class="d-block ml-auto my-1 icon-30 pr-2"
38 src="assets/img/ir-color.svg">
39 </div>
40 </div>
41 </div>
42 </div>
43 <div *ngIf="footerClose" class="bg-white badge-pill mt-2">
44 <div class="row justify-content-between">
45 <div
46 class="col-auto mx-0 "
47 (click)="close()">
48 <p class="font-weight-bold text-center text-primary">{{footerClose}}</p>
49 </div>
50 <i class="fas fa-undo-alt text-info mr-3 my-auto"></i>
51 </div>
52 </div>
53 </div>
54 </div>
55 </div>
56
src/app/shared/confirmacion/confirmacion.component.scss
src/app/shared/confirmacion/confirmacion.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { ConfirmacionComponent } from './confirmacion.component';
4
5 describe('ConfirmacionComponent', () => {
6 let component: ConfirmacionComponent;
7 let fixture: ComponentFixture<ConfirmacionComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ ConfirmacionComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(ConfirmacionComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/shared/confirmacion/confirmacion.component.ts
File was created 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 import { BsModalRef } from 'ngx-bootstrap/modal';
5 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
6 import { Subject } from 'rxjs';
7
8 @Component({
9 selector: 'app-confirmacion',
10 templateUrl: './confirmacion.component.html',
11 styleUrls: ['./confirmacion.component.scss']
12 })
13 export class ConfirmacionComponent implements OnInit {
14 idArticulo: number;
15 imagenArticulo: any;
16 detLarArticulo: string;
17 preVenArticulo: any;
18 onClose: Subject<any>;
19
20 constructor(
21 public modalRef: BsModalRef,
22 private inactiveScreen: InactiveScreenService,
23 ) {
24 this.onClose = new Subject();
25 }
26
27 ngOnInit() {
28 }
29
30 confirmarArticulo() {
31 this.onClose.next();
32 this.modalRef.hide();
33 }
34
35 close() {
36 this.modalRef.hide();
37 }
38
39 @HostListener('document:click', ['$event'])
40 eventListener(event: Event) {
41 clearTimeout(this.inactiveScreen.timerReposo);
42 this.inactiveScreen.startTimeOutInactividad();
43 }
44 }
45
src/app/shared/header-publicidad/header-publicidad.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit, TemplateRef } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { IPublicidad } from 'src/app/interfaces/IPublicidad'; 3 import { IPublicidad } from 'src/app/interfaces/IPublicidad';
4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service'; 4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service';
5 import { IArticulo } from 'src/app/interfaces/IArticulo'; 5 import { IArticulo } from 'src/app/interfaces/IArticulo';
6 import { PromocionComponent } from '../promocion/promocion.component'; 6 import { PromocionComponent } from '../promocion/promocion.component';
7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal'; 7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
8 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 8 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
9 import { ConfirmacionComponent } from '../confirmacion/confirmacion.component';
9 10
10 @Component({ 11 @Component({
11 selector: 'app-header-publicidad', 12 selector: 'app-header-publicidad',
12 templateUrl: './header-publicidad.component.html', 13 templateUrl: './header-publicidad.component.html',
13 styleUrls: ['./header-publicidad.component.scss'] 14 styleUrls: ['./header-publicidad.component.scss']
14 }) 15 })
15 export class HeaderPublicidadComponent implements OnInit { 16 export class HeaderPublicidadComponent implements OnInit {
16 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 17 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
17 publicidades: IPublicidad[] = []; 18 publicidades: IPublicidad[] = [];
18 modalRef: BsModalRef; 19 modalRef: BsModalRef;
19 20
20 constructor( 21 constructor(
21 private publicidadService: PublicidadService, 22 private publicidadService: PublicidadService,
22 private articuloService: ArticuloService, 23 private articuloService: ArticuloService,
23 private modalService: BsModalService, 24 private modalService: BsModalService,
24 ) { } 25 ) { }
25 26
26 ngOnInit() { 27 ngOnInit() {
27 this.getPublicidades(); 28 this.getPublicidades();
28 } 29 }
29 30
30 getPublicidades() { 31 getPublicidades() {
31 this.publicidadService.getAll() 32 this.publicidadService.getAll()
32 .subscribe((res: IPublicidad[]) => { 33 .subscribe((res: IPublicidad[]) => {
33 this.publicidades = res; 34 this.publicidades = res;
34 }, err => console.error(err)); 35 }, err => console.error(err));
35 } 36 }
36 37
37 elegirArticulo(publicidad: IPublicidad) { 38 elegirArticulo(publicidad: IPublicidad) {
38 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo); 39 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo);
39 } 40 }
40 41
41 getByID(id: number) { 42 getByID(id: number) {
42 this.articuloService.getById(id) 43 this.articuloService.getById(id)
43 .subscribe((res: IArticulo) => { 44 .subscribe((res: IArticulo) => {
44 if (res.FPP) { 45 if (res.FPP) {
45 this.openModalPromos(res); 46 this.openModalPromos(res);
46 return; 47 return;
48 } else {
49 this.openModalConfirmacion(res);
50 return;
47 } 51 }
48 res.cantidad = 1;
49 this.articuloService.setArticulo(res);
50 }, err => console.error(err)); 52 }, err => console.error(err));
51 } 53 }
52 54
53 openModalPromos(articulo: IArticulo) { 55 openModalPromos(articulo: IArticulo) {
54 this.modalRef = this.modalService.show(PromocionComponent, 56 this.modalRef = this.modalService.show(PromocionComponent,
55 { 57 {
56 initialState: { 58 initialState: {
57 idArticulo: articulo.id 59 idArticulo: articulo.id
58 }, 60 },
59 class: 'modal-promo modal-dialog-centered' 61 class: 'modal-promo modal-dialog-centered'
60 }); 62 });
61 } 63 }
62 64
65 openModalConfirmacion(articulo: IArticulo) {
66 this.modalRef = this.modalService.show(ConfirmacionComponent,
67 {
68 initialState: {
69 titleMessage: articulo.DET_LAR,
70 imagenPath: articulo.imagenes,
71 footerMessageFirst: `¿DESEA AGREGAR ESTE ARTÍCULO`,
72 footerMessageSecond: `a su carrito?`,
73 footerConfirmation: articulo.PreVen,
74 footerClose: `volver`
75 },
76 class: 'modal-promo modal-dialog-centered'
77 });
78 this.modalRef.content.onClose.subscribe(() => {
79 articulo.cantidad = 1;
80 this.articuloService.setArticulo(articulo);
81 });
82 }
83