Commit 8c93448006f30cbe6a61273f36c2d5f44ec82ecb
Exists in
develop
Merge branch 'develop' of git.focasoftware.com:angular/autoservicio-axion into develop
Showing
7 changed files
Show diff stats
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 |