Commit 18045edafd4d8ec7bcfaccaebb6976ad66bd8279

Authored by Benjamin Rodriguez
Exists in develop

Merge conflicts

src/app/modules/carrito/carrito.component.ts
1 import { Component, OnInit, OnDestroy, HostListener } from '@angular/core'; 1 import { Component, OnInit, OnDestroy, HostListener } from '@angular/core';
2 import { Location } from '@angular/common'; 2 import { Location } from '@angular/common';
3 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 import { APP_SETTINGS } from 'src/etc/AppSettings'; 4 import { APP_SETTINGS } from 'src/etc/AppSettings';
5 import { Router } from '@angular/router'; 5 import { Router } from '@angular/router';
6 import { BsModalRef } from 'ngx-bootstrap/modal/public_api'; 6 import { BsModalRef } from 'ngx-bootstrap/modal/public_api';
7 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 7 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
8 import { ANIMATIONS } from 'src/app/utils/animations'; 8 import { ANIMATIONS } from 'src/app/utils/animations';
9 9
10 @Component({ 10 @Component({
11 selector: 'app-carrito', 11 selector: 'app-carrito',
12 templateUrl: './carrito.component.html', 12 templateUrl: './carrito.component.html',
13 styleUrls: ['./carrito.component.scss'], 13 styleUrls: ['./carrito.component.scss'],
14 animations: [ANIMATIONS.EnterLeaveX] 14 animations: [ANIMATIONS.EnterLeaveX]
15 }) 15 })
16 export class CarritoComponent implements OnInit, OnDestroy { 16 export class CarritoComponent implements OnInit, OnDestroy {
17 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 17 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
18 maxCantidad = 50; 18 maxCantidad = 50;
19 modalRef: BsModalRef; 19 modalRef: BsModalRef;
20 20
21 constructor( 21 constructor(
22 public articuloService: ArticuloService, 22 public articuloService: ArticuloService,
23 private location: Location, 23 private location: Location,
24 private router: Router, 24 private router: Router,
25 private inactiveScreen: InactiveScreenService, 25 private inactiveScreen: InactiveScreenService,
26 ) { } 26 ) { }
27 27
28 ngOnInit() { 28 ngOnInit() {
29 if (!this.articuloService.carrito.length) { 29 if (!this.articuloService.carrito.length) {
30 this.router.navigate(['']); 30 this.router.navigate(['']);
31 return; 31 return;
32 } 32 }
33 this.mediaPantalla(); 33 this.mediaPantalla();
34 } 34 }
35 35
36 ngOnDestroy() { 36 ngOnDestroy() {
37 if (this.modalRef) this.modalRef.hide(); 37 if (this.modalRef) this.modalRef.hide();
38 } 38 }
39 39
40 deleteArticulo(index: number) { 40 deleteArticulo(index: number) {
41 this.articuloService.deleteArticulo(index); 41 this.articuloService.deleteArticulo(index);
42 } 42 }
43 43
44 goBack() { 44 goBack() {
45 this.location.back(); 45 this.location.back();
46 } 46 }
47 47
48 @HostListener('document:click', ['$event']) 48 @HostListener('document:click', ['$event'])
49 eventListener(event: Event) { 49 eventListener(event: Event) {
50 clearTimeout(this.inactiveScreen.timerReposo); 50 clearTimeout(this.inactiveScreen.timerReposo);
51 this.inactiveScreen.startTimeOutInactividad(); 51 this.inactiveScreen.startTimeOutInactividad();
52 } 52 }
53 53
54 @HostListener('scroll', ['$event']) 54 @HostListener('scroll', ['$event'])
55 scrollEvent(event: Event) { 55 scrollEvent(event: Event) {
56 clearTimeout(this.inactiveScreen.timerReposo); 56 clearTimeout(this.inactiveScreen.timerReposo);
57 this.inactiveScreen.startTimeOutInactividad(); 57 this.inactiveScreen.startTimeOutInactividad();
58 } 58 }
59 59
60 mediaPantalla() { 60 mediaPantalla() {
61 if ($('body').hasClass('media-pantalla')) { 61 if ($('body').hasClass('media-pantalla')) {
62 $(`.carrito-content`).addClass('media-pantalla').addBack('media-pantalla'); 62 $(`.carrito-content`).addClass('media-pantalla').addBack('media-pantalla');
63 } 63 }
64 } 64 }
65 } 65 }
66 66
src/app/modules/info-formas-pago/info-formas-pago.component.ts
1 import { Component, OnInit, TemplateRef, OnDestroy } from '@angular/core'; 1 import { Component, OnInit, TemplateRef, OnDestroy } from '@angular/core';
2 import { BsModalService } from 'ngx-bootstrap/modal'; 2 import { BsModalService } from 'ngx-bootstrap/modal';
3 3
4 @Component({ 4 @Component({
5 selector: 'app-formas-pago', 5 selector: 'app-formas-pago',
6 templateUrl: './info-formas-pago.component.html', 6 templateUrl: './info-formas-pago.component.html',
7 styleUrls: ['./info-formas-pago.component.scss'] 7 styleUrls: ['./info-formas-pago.component.scss']
8 }) 8 })
9 export class InfoFormasPagoComponent implements OnInit, OnDestroy { 9 export class InfoFormasPagoComponent implements OnInit, OnDestroy {
10 timer: any; 10 timer: any;
11 11
12 constructor( 12 constructor(
13 private modalService: BsModalService, 13 private modalService: BsModalService,
14 ) { } 14 ) { }
15 15
16 ngOnInit() { 16 ngOnInit() {
17 this.mediaPantalla(); 17 this.mediaPantalla();
18 } 18 }
19 19
20 ngOnDestroy() { 20 ngOnDestroy() {
21 if (this.timer) clearTimeout(this.timer); 21 if (this.timer) clearTimeout(this.timer);
22 } 22 }
23 23
24 openGoCaja(templateRef: TemplateRef<any>) { 24 openGoCaja(templateRef: TemplateRef<any>) {
25 const modalRef = this.modalService.show(templateRef, { class: 'modal-promo modal-dialog-centered' }); 25 const modalRef = this.modalService.show(templateRef, { class: 'modal-dialog-centered' });
26 this.timer = setTimeout(() => { 26 this.timer = setTimeout(() => {
27 modalRef.hide(); 27 modalRef.hide();
28 }, 3000); 28 }, 3000);
29 } 29 }
30 30
31 mediaPantalla() { 31 mediaPantalla() {
32 if ($('body').hasClass('media-pantalla')) { 32 if ($('body').hasClass('media-pantalla')) {
33 $('.reduce-card-1,.reduce-card-2') 33 $('.reduce-card-1,.reduce-card-2')
34 .addClass('media-pantalla') 34 .addClass('media-pantalla')
35 .addBack('media-pantalla'); 35 .addBack('media-pantalla');
36 } 36 }
37 } 37 }
38 } 38 }
39 39
src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.ts
1 import { Component, OnInit, HostListener, Output, EventEmitter } from '@angular/core'; 1 import { Component, OnInit, HostListener, Output, EventEmitter } from '@angular/core';
2 import { ICategoria } from 'src/app/interfaces/ICategoria'; 2 import { ICategoria } from 'src/app/interfaces/ICategoria';
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 { CategoriaService } from 'src/app/services/categoria/categoria.service'; 4 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
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-filtro-categorias', 8 selector: 'app-filtro-categorias',
9 templateUrl: './filtro-categorias.component.html', 9 templateUrl: './filtro-categorias.component.html',
10 styleUrls: ['./filtro-categorias.component.scss'] 10 styleUrls: ['./filtro-categorias.component.scss']
11 }) 11 })
12 export class FiltroCategoriasComponent implements OnInit { 12 export class FiltroCategoriasComponent implements OnInit {
13 @Output() getProductos = new EventEmitter<any>(); 13 @Output() getProductos = new EventEmitter<any>();
14 @Output() setProductos = new EventEmitter<any>(); 14 @Output() setProductos = new EventEmitter<any>();
15 @Output() filterItems = new EventEmitter<any>(); 15 @Output() filterItems = new EventEmitter<any>();
16 categorias: ICategoria[] = []; 16 categorias: ICategoria[] = [];
17 timeoutHandler: any; 17 timeoutHandler: any;
18 categoriaActive = null; 18 categoriaActive = null;
19 allActive = true; 19 allActive = true;
20 queMostrar = 'todos'; 20 queMostrar = 'todos';
21 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 21 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
22 22
23 constructor( 23 constructor(
24 private categoriaService: CategoriaService, 24 private categoriaService: CategoriaService,
25 private inactiveScreen: InactiveScreenService, 25 private inactiveScreen: InactiveScreenService,
26 ) { } 26 ) { }
27 27
28 ngOnInit() { 28 ngOnInit() {
29 this.mediaPantalla(); 29 this.mediaPantalla();
30 } 30 }
31 31
32 getCategorias() { 32 getCategorias() {
33 this.categoriaService.getAll() 33 this.categoriaService.getAll()
34 .subscribe((categorias: ICategoria[]) => { 34 .subscribe((categorias: ICategoria[]) => {
35 switch (this.queMostrar) { 35 switch (this.queMostrar) {
36 case 'todos': 36 case 'todos':
37 this.categorias = categorias; 37 this.categorias = categorias;
38 this.categoriaActive = 0; 38 this.categoriaActive = 0;
39 break; 39 break;
40 case 'promociones': 40 case 'promociones':
41 this.categorias = categorias; 41 this.categorias = categorias;
42 this.categoriaActive = 19; 42 this.categoriaActive = 19;
43 break; 43 break;
44 case 'ordenar': 44 case 'ordenar':
45 this.categorias = categorias.filter((categoria: ICategoria) => { 45 this.categorias = categorias.filter((categoria: ICategoria) => {
46 return categoria.ES_PEDIDO; 46 return categoria.ES_PEDIDO;
47 }); 47 });
48 this.categoriaActive = 4; 48 this.categoriaActive = 4;
49 break; 49 break;
50 default: 50 default:
51 this.categorias = categorias; 51 this.categorias = categorias;
52 this.categoriaActive = 0; 52 this.categoriaActive = 0;
53 break; 53 break;
54 } 54 }
55 !localStorage.getItem('articulos') ? 55 !localStorage.getItem('articulos') ?
56 this.getProductos.emit() : 56 this.getProductos.emit() :
57 this.setProductos.emit(); 57 this.setProductos.emit();
58 }); 58 });
59 this.mediaPantalla(); 59 this.mediaPantalla();
60 } 60 }
61 61
62 selectCategoria(index: number, idCategoria?: number) { 62 selectCategoria(index: number, idCategoria?: number) {
63 if (this.categoriaActive === idCategoria) return; 63 if (this.categoriaActive === idCategoria) return;
64 this.categoriaActive = idCategoria; 64 this.categoriaActive = idCategoria;
65 this.allActive = idCategoria === 0 ? true : false; 65 this.allActive = idCategoria === 0 ? true : false;
66 this.categorias.forEach((categoria, i) => { 66 this.categorias.forEach((categoria, i) => {
67 categoria.selected = index === i ? true : false; 67 categoria.selected = index === i ? true : false;
68 }); 68 });
69 this.filterItems.emit(); 69 this.filterItems.emit();
70 } 70 }
71 71
72 @HostListener('scroll', ['$event']) 72 @HostListener('scroll', ['$event'])
73 scrollEvent(event: Event) { 73 scrollEvent(event: Event) {
74 clearTimeout(this.inactiveScreen.timerReposo); 74 clearTimeout(this.inactiveScreen.timerReposo);
75 this.inactiveScreen.startTimeOutInactividad(); 75 this.inactiveScreen.startTimeOutInactividad();
76 } 76 }
77 77
78 mouseup() { 78 mouseup() {
79 if (!this.timeoutHandler) return; 79 if (!this.timeoutHandler) return;
80 clearInterval(this.timeoutHandler); 80 clearInterval(this.timeoutHandler);
81 } 81 }
82 82
83 scrollY(el: HTMLElement, value) { 83 scrollY(el: HTMLElement, value) {
84 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 84 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
85 this.timeoutHandler = setInterval(() => { 85 this.timeoutHandler = setInterval(() => {
86 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 86 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
87 }, 500); 87 }, 500);
88 } 88 }
89 89
90 mediaPantalla() { 90 mediaPantalla() {
91 if ($('body').hasClass('media-pantalla')) { 91 if ($('body').hasClass('media-pantalla')) {
92 $('.cat-content,#cat-content') 92 $('.cat-content,#cat-content')
93 .addClass('media-pantalla') 93 .addClass('media-pantalla')
94 .addBack('media-pantalla'); 94 .addBack('media-pantalla');
95 } 95 }
96 } 96 }
97 } 97 }
98 98
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
1 import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit } from '@angular/core'; 1 import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit } from '@angular/core';
2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; 2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 import { IArticulo } from 'src/app/interfaces/IArticulo'; 4 import { IArticulo } from 'src/app/interfaces/IArticulo';
5 import { APP_SETTINGS } from 'src/etc/AppSettings'; 5 import { APP_SETTINGS } from 'src/etc/AppSettings';
6 import { ICategoria } from 'src/app/interfaces/ICategoria'; 6 import { ICategoria } from 'src/app/interfaces/ICategoria';
7 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 7 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component'; 8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 9 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
11 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component'; 11 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
12 import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component'; 12 import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component';
13 import * as _ from 'lodash'; 13 import * as _ from 'lodash';
14 import { ANIMATIONS } from 'src/app/utils/animations'; 14 import { ANIMATIONS } from 'src/app/utils/animations';
15 15
16 @Component({ 16 @Component({
17 selector: 'app-seleccion-articulos', 17 selector: 'app-seleccion-articulos',
18 templateUrl: './seleccion-articulos.component.html', 18 templateUrl: './seleccion-articulos.component.html',
19 styleUrls: ['./seleccion-articulos.component.scss'], 19 styleUrls: ['./seleccion-articulos.component.scss'],
20 animations: [ANIMATIONS.EnterLeaveY] 20 animations: [ANIMATIONS.EnterLeaveY]
21 }) 21 })
22 export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDestroy { 22 export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDestroy {
23 showSpinner = true; 23 showSpinner = true;
24 timeoutHandler: any; 24 timeoutHandler: any;
25 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 25 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
26 articulos: IArticulo[] = []; 26 articulos: IArticulo[] = [];
27 auxArticulos: IArticulo[] = []; 27 auxArticulos: IArticulo[] = [];
28 showQuantity = 100; 28 showQuantity = 100;
29 searchTerm = ''; 29 searchTerm = '';
30 ordenandoByVendidos = true; 30 ordenandoByVendidos = true;
31 modalRef: BsModalRef; 31 modalRef: BsModalRef;
32 total = 0; 32 total = 0;
33 @ViewChild(FiltroCategoriasComponent, { static: false }) filtroCategorias: FiltroCategoriasComponent; 33 @ViewChild(FiltroCategoriasComponent, { static: false }) filtroCategorias: FiltroCategoriasComponent;
34 34
35 constructor( 35 constructor(
36 public articuloService: ArticuloService, 36 public articuloService: ArticuloService,
37 private sinonimoService: SinonimoService, 37 private sinonimoService: SinonimoService,
38 private modalService: BsModalService, 38 private modalService: BsModalService,
39 private inactiveScreen: InactiveScreenService, 39 private inactiveScreen: InactiveScreenService,
40 ) { } 40 ) { }
41 41
42 ngOnInit() { } 42 ngOnInit() { }
43 43
44 ngAfterViewInit(): void { 44 ngAfterViewInit(): void {
45 this.filtroCategorias.getCategorias(); 45 this.filtroCategorias.getCategorias();
46 this.mediaPantalla(); 46 this.mediaPantalla();
47 } 47 }
48 48
49 ngOnDestroy() { 49 ngOnDestroy() {
50 for (let i = 1; i <= this.modalService.getModalsCount(); i++) { 50 for (let i = 1; i <= this.modalService.getModalsCount(); i++) {
51 this.modalService.hide(i); 51 this.modalService.hide(i);
52 } 52 }
53 } 53 }
54 54
55 getProductos() { 55 getProductos() {
56 this.articuloService.getAll() 56 this.articuloService.getAll()
57 .subscribe((result: IArticulo[]) => { 57 .subscribe((result: IArticulo[]) => {
58 this.articuloService.setArticulosSinImagen(result); 58 this.articuloService.setArticulosSinImagen(result);
59 if (this.filtroCategorias.queMostrar === 'ordenar') { 59 if (this.filtroCategorias.queMostrar === 'ordenar') {
60 this.filtroCategorias.categorias.forEach((categoria: ICategoria) => { 60 this.filtroCategorias.categorias.forEach((categoria: ICategoria) => {
61 const tempArticulos = result.filter((articulo: IArticulo) => { 61 const tempArticulos = result.filter((articulo: IArticulo) => {
62 return articulo.categoria_selfservice === categoria.id; 62 return articulo.categoria_selfservice === categoria.id;
63 }); 63 });
64 result = tempArticulos; 64 result = tempArticulos;
65 }); 65 });
66 } 66 }
67 localStorage.setItem('articulos', JSON.stringify(result)); 67 localStorage.setItem('articulos', JSON.stringify(result));
68 this.setProductos(); 68 this.setProductos();
69 }, (error) => { 69 }, (error) => {
70 this.showSpinner = false; 70 this.showSpinner = false;
71 console.error(error); 71 console.error(error);
72 }); 72 });
73 } 73 }
74 74
75 setProductos() { 75 setProductos() {
76 this.articulos = JSON.parse(localStorage.getItem('articulos')); 76 this.articulos = JSON.parse(localStorage.getItem('articulos'));
77 this.filterItems(); 77 this.filterItems();
78 } 78 }
79 79
80 filterItems() { 80 filterItems() {
81 if (this.filtroCategorias.categoriaActive === 0) { 81 if (this.filtroCategorias.categoriaActive === 0) {
82 this.auxArticulos = this.articulos; 82 this.auxArticulos = this.articulos;
83 return; 83 return;
84 } 84 }
85 this.auxArticulos = this.articulos.filter(x => { 85 this.auxArticulos = this.articulos.filter(x => {
86 return x.categoria_selfservice === this.filtroCategorias.categoriaActive; 86 return x.categoria_selfservice === this.filtroCategorias.categoriaActive;
87 }); 87 });
88 this.ordenar(); 88 this.ordenar();
89 } 89 }
90 90
91 ordenar() { 91 ordenar() {
92 if (this.ordenandoByVendidos) { 92 if (this.ordenandoByVendidos) {
93 this.auxArticulos.sort((a, b) => { 93 this.auxArticulos.sort((a, b) => {
94 return b.cantidadVendida - a.cantidadVendida; 94 return b.cantidadVendida - a.cantidadVendida;
95 }); 95 });
96 } 96 }
97 } 97 }
98 98
99 selectArticulo(articulo: IArticulo) { 99 selectArticulo(articulo: IArticulo) {
100 this.getByID(articulo.id); 100 this.getByID(articulo.id);
101 } 101 }
102 102
103 getByID(id: number) { 103 getByID(id: number) {
104 this.articuloService.getById(id) 104 this.articuloService.getById(id)
105 .subscribe((res: IArticulo) => { 105 .subscribe((res: IArticulo) => {
106 if (res.FPP) { 106 if (res.FPP) {
107 this.openModalPromos(res); 107 this.openModalPromos(res);
108 } else { 108 } else {
109 this.getSinonimos(res); 109 this.getSinonimos(res);
110 } 110 }
111 }, err => console.error(err)); 111 }, err => console.error(err));
112 } 112 }
113 113
114 getSinonimos(articulo: IArticulo) { 114 getSinonimos(articulo: IArticulo) {
115 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt) 115 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
116 .subscribe((res: any[]) => { 116 .subscribe((res: any[]) => {
117 if (res.length) { 117 if (res.length) {
118 const sinonimos = []; 118 const sinonimos = [];
119 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 119 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
120 Object.keys(gruposArticulos).forEach(key => { 120 Object.keys(gruposArticulos).forEach(key => {
121 sinonimos.push({ productos: gruposArticulos[key] }); 121 sinonimos.push({ productos: gruposArticulos[key] });
122 }); 122 });
123 res = sinonimos; 123 res = sinonimos;
124 this.openModalSinonimos(res, articulo); 124 this.openModalSinonimos(res, articulo);
125 } else { 125 } else {
126 this.articuloService.setArticulo(articulo); 126 this.articuloService.setArticulo(articulo);
127 } 127 }
128 }); 128 });
129 } 129 }
130 130
131 openModalPromos(articulo: IArticulo) { 131 openModalPromos(articulo: IArticulo) {
132 this.modalRef = this.modalService.show(PromocionComponent, { 132 this.modalRef = this.modalService.show(PromocionComponent, {
133 initialState: { articulosPromo: [articulo] }, 133 initialState: { articulosPromo: [articulo] },
134 class: 'modal-promo modal-dialog-centered' 134 class: 'modal-dialog-centered'
135 }); 135 });
136 this.mediaPantalla(); 136 this.mediaPantalla();
137 } 137 }
138 138
139 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 139 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
140 this.modalRef = this.modalService.show(SinonimoComponent, { 140 this.modalRef = this.modalService.show(SinonimoComponent, {
141 initialState: { 141 initialState: {
142 sinonimos: sinonimosData, 142 sinonimos: sinonimosData,
143 articulo 143 articulo
144 }, 144 },
145 class: 'modal-promo modal-dialog-centered' 145 class: 'modal-dialog-centered'
146 }); 146 });
147 147
148 this.modalRef.content.onClose 148 this.modalRef.content.onClose
149 .subscribe((res: any) => { 149 .subscribe((res: any) => {
150 for (const a of articulo.productos) { 150 for (const a of articulo.productos) {
151 for (const aRes of res.articulos) { 151 for (const aRes of res.articulos) {
152 if (a.idSinonimo === aRes.ID_SIN) { 152 if (a.idSinonimo === aRes.ID_SIN) {
153 a.CODA = aRes.CodArt; 153 a.CODA = aRes.CodArt;
154 a.CodArt = aRes.CodArt; 154 a.CodArt = aRes.CodArt;
155 a.SECA = aRes.CodSec; 155 a.SECA = aRes.CodSec;
156 aRes.CodSec = aRes.CodSec; 156 aRes.CodSec = aRes.CodSec;
157 a.PreVen = aRes.PreVen; 157 a.PreVen = aRes.PreVen;
158 a.id = aRes.id; 158 a.id = aRes.id;
159 a.DET_LAR = aRes.DET_LAR; 159 a.DET_LAR = aRes.DET_LAR;
160 a.DetArt = aRes.DetArt; 160 a.DetArt = aRes.DetArt;
161 } 161 }
162 } 162 }
163 } 163 }
164 this.articuloService.setArticulo(articulo); 164 this.articuloService.setArticulo(articulo);
165 }); 165 });
166 this.mediaPantalla(); 166 this.mediaPantalla();
167 } 167 }
168 168
169 deleteArticulo(index: number) { 169 deleteArticulo(index: number) {
170 this.articuloService.deleteArticulo(index); 170 this.articuloService.deleteArticulo(index);
171 } 171 }
172 172
173 increaseShow() { 173 increaseShow() {
174 this.showQuantity += 100; 174 this.showQuantity += 100;
175 } 175 }
176 176
177 @HostListener('scroll', ['$event']) 177 @HostListener('scroll', ['$event'])
178 scrollEvent(event: Event) { 178 scrollEvent(event: Event) {
179 clearTimeout(this.inactiveScreen.timerReposo); 179 clearTimeout(this.inactiveScreen.timerReposo);
180 this.inactiveScreen.startTimeOutInactividad(); 180 this.inactiveScreen.startTimeOutInactividad();
181 } 181 }
182 182
183 mouseup() { 183 mouseup() {
184 if (!this.timeoutHandler) return; 184 if (!this.timeoutHandler) return;
185 clearInterval(this.timeoutHandler); 185 clearInterval(this.timeoutHandler);
186 } 186 }
187 187
188 scrollY(el: HTMLElement, value) { 188 scrollY(el: HTMLElement, value) {
189 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 189 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
190 this.timeoutHandler = setInterval(() => { 190 this.timeoutHandler = setInterval(() => {
191 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 191 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
192 }, 500); 192 }, 500);
193 } 193 }
194 194
195 scrollX(el: HTMLElement, value) { 195 scrollX(el: HTMLElement, value) {
196 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); 196 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft });
197 this.timeoutHandler = setInterval(() => { 197 this.timeoutHandler = setInterval(() => {
198 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); 198 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft });
199 }, 500); 199 }, 500);
200 } 200 }
201 201
202 mediaPantalla() { 202 mediaPantalla() {
203 if ($('body').hasClass('media-pantalla')) { 203 if ($('body').hasClass('media-pantalla')) {
204 $(`.cat-content,#cat-content,#content,.cat-btn,#boxCarrito, 204 $(`.cat-content,#cat-content,#content,.cat-btn,#boxCarrito,
205 .cat-box,.img-categoria, .modal-content`) 205 .cat-box,.img-categoria, .modal-content`)
206 .addClass('media-pantalla') 206 .addClass('media-pantalla')
207 .addBack('media-pantalla'); 207 .addBack('media-pantalla');
208 } 208 }
209 } 209 }
210 } 210 }
211 211
src/app/shared/confirmacion/confirmacion.component.html
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 mt-n3 icon-30 mr-2 position-absolute right-0"
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
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.apiImagenes}/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
src/app/shared/footer/footer.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { Location } from '@angular/common'; 2 import { Location } from '@angular/common';
3 3
4 @Component({ 4 @Component({
5 selector: 'app-footer', 5 selector: 'app-footer',
6 templateUrl: './footer.component.html', 6 templateUrl: './footer.component.html',
7 styleUrls: ['./footer.component.scss'] 7 styleUrls: ['./footer.component.scss']
8 }) 8 })
9 export class FooterComponent implements OnInit { 9 export class FooterComponent implements OnInit {
10 constructor(private location: Location) { } 10 constructor(private location: Location) { }
11 11
12 ngOnInit() { } 12 ngOnInit() { }
13 13
14 goBack() { 14 goBack() {
15 this.location.back(); 15 this.location.back();
16 } 16 }
17 17
18 reducirPantalla() { 18 reducirPantalla() {
19 $(`body, 19 $(`body,
20 .reduce-card-1, 20 .reduce-card-1,
21 .reduce-card-2, 21 .reduce-card-2,
22 #content, 22 #content,
23 .cat-content, 23 .cat-content,
24 .cat-btn, 24 .cat-btn,
25 .cat-box, 25 .cat-box,
26 #boxCarrito, 26 #boxCarrito,
27 #headerPublicidad, 27 #headerPublicidad,
28 #headerPad, 28 #headerPad,
29 .img-categoria, 29 .img-categoria,
30 .carrito-articulo, 30 .carrito-articulo,
31 .carrito-content, 31 .carrito-content,
32 .pago-tarjeta, 32 .pago-tarjeta,
33 .modal-promo,
34 .modal-content, 33 .modal-content,
35 .qr-mt`) 34 .qr-mt`)
36 .toggleClass('media-pantalla'); 35 .toggleClass('media-pantalla');
37 } 36 }
38 } 37 }
39 38
src/app/shared/header-publicidad/header-publicidad.component.html
1 <div class="row mx-0" id="headerPublicidad" #headerPublicidad 1 <div class="row mx-0 btn-effect" id="headerPublicidad" #headerPublicidad
2 [ngClass]="headerPublicidad.classList.contains('media-pantalla') 2 [ngClass]="headerPublicidad.classList.contains('media-pantalla')
3 ? 'h-31' : 'h-20'" id="boxCarrito"> 3 ? 'h-31' : 'h-20'" id="boxCarrito">
4 <div class="col-12 p-3 h-100" id="headerPad"> 4 <div class="col-12 p-3 h-100" id="headerPad">
5 <div class="h-100"> 5 <div class="h-100">
6 <carousel [showIndicators]="false" [interval]="4000"> 6 <carousel [showIndicators]="false" [interval]="4000">
7 <slide *ngFor="let p of publicidades"> 7 <slide *ngFor="let p of publicidades">
8 <img 8 <img
9 class="h-100 w-100" 9 class="h-100 w-100"
10 draggable="false" 10 draggable="false"
11 ondragstart="return false;" 11 ondragstart="return false;"
12 (contextmenu)="false" 12 (contextmenu)="false"
13 src="{{urlImagenes}}{{p.imagen}}" 13 src="{{urlImagenes}}{{p.imagen}}"
14 (click)="elegirArticulo(p)"> 14 (click)="elegirArticulo(p)">
15 </slide> 15 </slide>
16 </carousel> 16 </carousel>
17 </div> 17 </div>
18 </div> 18 </div>
19 </div> 19 </div>
20 20
src/app/shared/header-publicidad/header-publicidad.component.ts
1 import { Component, OnInit, TemplateRef } 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 import { ConfirmacionComponent } from '../confirmacion/confirmacion.component';
10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
11 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 11 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
12 import { SinonimoComponent } from '../sinonimo/sinonimo.component'; 12 import { SinonimoComponent } from '../sinonimo/sinonimo.component';
13 import * as _ from 'lodash'; 13 import * as _ from 'lodash';
14 14
15 @Component({ 15 @Component({
16 selector: 'app-header-publicidad', 16 selector: 'app-header-publicidad',
17 templateUrl: './header-publicidad.component.html', 17 templateUrl: './header-publicidad.component.html',
18 styleUrls: ['./header-publicidad.component.scss'] 18 styleUrls: ['./header-publicidad.component.scss']
19 }) 19 })
20 export class HeaderPublicidadComponent implements OnInit { 20 export class HeaderPublicidadComponent implements OnInit {
21 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 21 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
22 publicidades: IPublicidad[] = []; 22 publicidades: IPublicidad[] = [];
23 modalRef: BsModalRef; 23 modalRef: BsModalRef;
24 24
25 constructor( 25 constructor(
26 private publicidadService: PublicidadService, 26 private publicidadService: PublicidadService,
27 private articuloService: ArticuloService, 27 private articuloService: ArticuloService,
28 private modalService: BsModalService, 28 private modalService: BsModalService,
29 private sinonimoService: SinonimoService 29 private sinonimoService: SinonimoService
30 ) { } 30 ) { }
31 31
32 ngOnInit() { 32 ngOnInit() {
33 this.getPublicidades(); 33 this.getPublicidades();
34 this.mediaPantalla(); 34 this.mediaPantalla();
35 } 35 }
36 36
37 getPublicidades() { 37 getPublicidades() {
38 this.publicidadService.getAll() 38 this.publicidadService.getAll()
39 .subscribe((res: IPublicidad[]) => { 39 .subscribe((res: IPublicidad[]) => {
40 this.publicidades = res; 40 this.publicidades = res;
41 }, err => console.error(err)); 41 }, err => console.error(err));
42 } 42 }
43 43
44 elegirArticulo(publicidad: IPublicidad) { 44 elegirArticulo(publicidad: IPublicidad) {
45 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo); 45 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo);
46 } 46 }
47 47
48 getByID(id: number) { 48 getByID(id: number) {
49 this.articuloService.getById(id) 49 this.articuloService.getById(id)
50 .subscribe((res: IArticulo) => { 50 .subscribe((res: IArticulo) => {
51 if (res.FPP) { 51 if (res.FPP) {
52 this.openModalPromos(res); 52 this.openModalPromos(res);
53 return; 53 return;
54 } else { 54 } else {
55 this.openModalConfirmacion(res); 55 this.openModalConfirmacion(res);
56 return; 56 return;
57 } 57 }
58 }, err => console.error(err)); 58 }, err => console.error(err));
59 } 59 }
60 60
61 openModalPromos(articulo: IArticulo) { 61 openModalPromos(articulo: IArticulo) {
62 this.modalRef = this.modalService.show(PromocionComponent, 62 this.modalRef = this.modalService.show(PromocionComponent,
63 { 63 {
64 initialState: { 64 initialState: {
65 idArticulo: articulo.id 65 idArticulo: articulo.id
66 }, 66 },
67 class: 'modal-promo modal-dialog-centered' 67 class: 'modal-dialog-centered'
68 }); 68 });
69 } 69 }
70 70
71 openModalConfirmacion(articulo: IArticulo) { 71 openModalConfirmacion(articulo: IArticulo) {
72 this.modalRef = this.modalService.show(ConfirmacionComponent, 72 this.modalRef = this.modalService.show(ConfirmacionComponent,
73 { 73 {
74 initialState: { 74 initialState: {
75 titleMessage: articulo.DET_LAR, 75 titleMessage: articulo.DET_LAR,
76 imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : 'assets/img/imagen-no-encontrada.jpg', 76 imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : 'assets/img/imagen-no-encontrada.jpg',
77 footerMessageFirst: `ยฟDESEA AGREGAR ESTE COMBO`, 77 footerMessageFirst: `ยฟDESEA AGREGAR ESTE COMBO`,
78 footerMessageSecond: `a su carrito?`, 78 footerMessageSecond: `a su carrito?`,
79 footerConfirmation: articulo.PreVen, 79 footerConfirmation: articulo.PreVen,
80 footerClose: `volver` 80 footerClose: `volver`
81 }, 81 },
82 class: 'modal-promo modal-dialog-centered' 82 class: 'modal-dialog-centered'
83 }); 83 });
84 this.modalRef.content.onClose.subscribe(() => { 84 this.modalRef.content.onClose.subscribe(() => {
85 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt) 85 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
86 .subscribe((res: ISinonimo[]) => { 86 .subscribe((res: ISinonimo[]) => {
87 if (res.length) { 87 if (res.length) {
88 const sinonimos = []; 88 const sinonimos = [];
89 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 89 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
90 Object.keys(gruposArticulos).forEach(key => { 90 Object.keys(gruposArticulos).forEach(key => {
91 sinonimos.push({ productos: gruposArticulos[key] }); 91 sinonimos.push({ productos: gruposArticulos[key] });
92 }); 92 });
93 res = sinonimos; 93 res = sinonimos;
94 this.openModalSinonimos(res, articulo); 94 this.openModalSinonimos(res, articulo);
95 } else { 95 } else {
96 articulo.cantidad = 1; 96 articulo.cantidad = 1;
97 this.articuloService.setArticulo(articulo); 97 this.articuloService.setArticulo(articulo);
98 } 98 }
99 }, err => console.error(err)); 99 }, err => console.error(err));
100 }); 100 });
101 this.mediaPantalla(); 101 this.mediaPantalla();
102 } 102 }
103 103
104 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 104 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
105 const modalSinonimo = this.modalService.show(SinonimoComponent, { 105 const modalSinonimo = this.modalService.show(SinonimoComponent, {
106 initialState: { 106 initialState: {
107 sinonimos: sinonimosData, 107 sinonimos: sinonimosData,
108 articulo 108 articulo
109 }, 109 },
110 class: 'modal-promo modal-dialog-centered' 110 class: 'modal-dialog-centered'
111 }); 111 });
112 modalSinonimo.content.onClose 112 modalSinonimo.content.onClose
113 .subscribe((res: any) => { 113 .subscribe((res: any) => {
114 for (const a of articulo.productos) { 114 for (const a of articulo.productos) {
115 for (const aRes of res.articulos) { 115 for (const aRes of res.articulos) {
116 if (a.idSinonimo === aRes.ID_SIN) { 116 if (a.idSinonimo === aRes.ID_SIN) {
117 a.CODA = aRes.CodArt; 117 a.CODA = aRes.CodArt;
118 a.CodArt = aRes.CodArt; 118 a.CodArt = aRes.CodArt;
119 a.SECA = aRes.CodSec; 119 a.SECA = aRes.CodSec;
120 aRes.CodSec = aRes.CodSec; 120 aRes.CodSec = aRes.CodSec;
121 a.PreVen = aRes.PreVen; 121 a.PreVen = aRes.PreVen;
122 a.id = aRes.id; 122 a.id = aRes.id;
123 a.DET_LAR = aRes.DET_LAR; 123 a.DET_LAR = aRes.DET_LAR;
124 a.DetArt = aRes.DetArt; 124 a.DetArt = aRes.DetArt;
125 } 125 }
126 } 126 }
127 } 127 }
128 this.articuloService.setArticulo(articulo); 128 this.articuloService.setArticulo(articulo);
129 }); 129 });
130 } 130 }
131 131
132 mediaPantalla() { 132 mediaPantalla() {
133 if ($('body').hasClass('media-pantalla')) { 133 if ($('body').hasClass('media-pantalla')) {
134 $('#headerPublicidad,#headerPad').addClass('media-pantalla'); 134 $('#headerPublicidad,#headerPad').addClass('media-pantalla');
135 } 135 }
136 } 136 }
137 } 137 }
138 138
src/app/shared/promocion/promocion.component.html
1 <div class="modal-header bg-primary rounded-top pt-4 px-2" *ngIf="articulosPromo.length"> 1 <!-- <div class="d-flex justify-content-center"
2 <img 2 *ngIf="loading">
3 draggable="false" 3 <div class="spinner-border text-primary" role="status">
4 ondragstart="return false;" 4 <span class="sr-only">Loading...</span>
5 (contextmenu)="false" 5 </div>
6 (click)="selectPromo(articulosPromo[0])" 6 </div> -->
7 class="btn-effect mt-n3 icon-30 mr-2 position-absolute right-0" 7 <div class="bg-primary rounded">
8 src="assets/img/icono-cancelar-blanco.svg"> 8 <div class="modal-header" *ngIf="articulosPromo.length">
9 <div class="row mx-0 w-100 justify-content-between mt-3"> 9 <img
10 <div class="col-8"> 10 draggable="false"
11 <p class="h3 mt-n2 text-white">{{articulosPromo[0].DetArt}}</p> 11 ondragstart="return false;"
12 </div> 12 (contextmenu)="false"
13 <div class="col-4 align-self-center"> 13 (click)="selectPromo(articulosPromo[0])"
14 <div 14 class="btn-effect icon-30 mt-2 mr-2 position-absolute top-0 right-0 z-index"
15 class="row mx-0 justify-content-between bg-white badge-pill" 15 src="assets/img/icono-cancelar-blanco.svg">
16 (click)="selectPromo(articulosPromo[0])"> 16 <div class="row w-100 no-gutters justify-content-between">
17 <div class="col px-0 align-self-center text-primary"> 17 <div class="col align-self-center">
18 <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p> 18 <p class="h3 text-white">{{articulosPromo[0].DetArt}}</p>
19 </div>
20 <div class="col-3 px-0">
21 <img
22 draggable="false"
23 ondragstart="return false;"
24 (contextmenu)="false"
25 class="d-block ml-auto py-1 icon-30 mr-2 pt-2"
26 src="assets/img/ir-color.svg">
27 </div>
28 </div>
29 </div>
30 </div>
31 </div>
32 <div class="modal-body bg-primary rounded-bottom pb-3 px-2" *ngIf="articulosPromo.length">
33 <div class="row mx-0 w-100">
34 <div class="col-9"> 19 </div>
35 <p class="text-white"><small>ยฟTE GUSTARรA LLEVAR ESTE ARTรCULO</small></p> 20 <div class="col-auto align-self-center mt-4 pl-2">
36 <h1 class="text-white mb-4">en un combo?</h1>
37 </div>
38 <div class="col-3">
39 <img
40 draggable="false"
41 ondragstart="return false;"
42 (contextmenu)="false"
43 src="{{urlImagenes}}{{articulosPromo[0].imagenes[0].imagen}}"
44 onerror="this.src='assets/img/imagen-no-encontrada.jpg'"
45 class="card-img-top img-fluid rounded-circle">
46 </div>
47 </div>
48 <div class="d-flex justify-content-center"
49 *ngIf="loading">
50 <div class="spinner-border text-primary" role="status">
51 <span class="sr-only">Loading...</span>
52 </div>
53 </div>
54 <div
55 class="row mx-0 lista-promociones scroll-y-visible"
56 (scroll)="scrollEvent($event)">
57 <div class="col-12">
58 <div *ngFor="let promo of promociones">
59 <div 21 <div
60 class="mx-0 mb-2 btn-effect bg-white badge-pill text-primary" 22 class="row mx-0 justify-content-between bg-white badge-pill btn-effect"
61 (click)="selectPromo(promo)"> 23 (click)="selectPromo(articulosPromo[0])">
62 <div class="d-flex"> 24 <div class="col-auto align-self-center text-primary">
63 <p class="text-truncate mr-auto my-auto"><small>{{promo.DetArt}}</small></p> 25 <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p>
64 <p class="font-weight-bold my-auto pr-2"> 26 </div>
65 <span>{{promo.PreVen | currency}}</span> 27 <div class="col-auto px-0">
66 </p>
67 <img 28 <img
68 draggable="false" 29 draggable="false"
69 ondragstart="return false;" 30 ondragstart="return false;"
70 (contextmenu)="false" 31 (contextmenu)="false"
71 class="d-block ml-auto py-1 icon-30 mr-2 pt-2" 32 class="d-block ml-auto my-1 icon-20"
72 src="assets/img/ir-color.svg"> 33 src="assets/img/ir-color.svg">
73 </div> 34 </div>
74 </div> 35 </div>
75 </div> 36 </div>
76 </div> 37 </div>
77 </div> 38 </div>
39 <div class="modal-body" *ngIf="articulosPromo.length">
40 <div class="row no-gutters w-100">
41 <div class="col-9 col-9 align-self-center">
42 <p class="text-white"><small>ยฟTE GUSTARรA LLEVAR ESTE ARTรCULO</small></p>
43 <p class="h1 text-white">en un combo?</p>
src/app/shared/promocion/promocion.component.ts
1 import { Component, OnInit, HostListener } from '@angular/core'; 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; 2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 import { IArticulo } from 'src/app/interfaces/IArticulo'; 3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 4 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
5 import { PromocionService } from 'src/app/services/promocion/promocion.service'; 5 import { PromocionService } from 'src/app/services/promocion/promocion.service';
6 import { Subject } from 'rxjs'; 6 import { Subject } from 'rxjs';
7 import { APP_SETTINGS } from 'src/etc/AppSettings'; 7 import { APP_SETTINGS } from 'src/etc/AppSettings';
8 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 8 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
9 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 9 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
10 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 10 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
11 import { SinonimoComponent } from '../sinonimo/sinonimo.component'; 11 import { SinonimoComponent } from '../sinonimo/sinonimo.component';
12 import * as _ from 'lodash'; 12 import * as _ from 'lodash';
13 13
14 @Component({ 14 @Component({
15 selector: 'app-promocion', 15 selector: 'app-promocion',
16 templateUrl: './promocion.component.html', 16 templateUrl: './promocion.component.html',
17 styleUrls: ['./promocion.component.scss'] 17 styleUrls: ['./promocion.component.scss']
18 }) 18 })
19 export class PromocionComponent implements OnInit { 19 export class PromocionComponent implements OnInit {
20 articulosPromo: IArticulo[] = []; 20 articulosPromo: IArticulo[] = [];
21 promociones: IArticulo[] = []; 21 promociones: IArticulo[] = [];
22 onClose: Subject<any>; 22 onClose: Subject<any>;
23 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 23 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
24 24
25 constructor( 25 constructor(
26 public modalPromocion: BsModalRef, 26 public modalPromocion: BsModalRef,
27 private modalService: BsModalService, 27 private modalService: BsModalService,
28 private articuloService: ArticuloService, 28 private articuloService: ArticuloService,
29 private promocionService: PromocionService, 29 private promocionService: PromocionService,
30 private sinonimoService: SinonimoService, 30 private sinonimoService: SinonimoService,
31 private inactiveScreen: InactiveScreenService, 31 private inactiveScreen: InactiveScreenService,
32 ) { 32 ) {
33 this.onClose = new Subject(); 33 this.onClose = new Subject();
34 } 34 }
35 35
36 ngOnInit() { 36 ngOnInit() {
37 this.getPromociones(); 37 this.getPromociones();
38 } 38 }
39 39
40 selectPromo(promo: IArticulo) { 40 selectPromo(promo: IArticulo) {
41 this.sinonimoService.getSinonimos(promo.CodSec, promo.CodArt) 41 this.sinonimoService.getSinonimos(promo.CodSec, promo.CodArt)
42 .subscribe((res: ISinonimo[]) => { 42 .subscribe((res: ISinonimo[]) => {
43 if (res.length) { 43 if (res.length) {
44 const sinonimos = []; 44 const sinonimos = [];
45 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 45 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
46 Object.keys(gruposArticulos).forEach(key => { 46 Object.keys(gruposArticulos).forEach(key => {
47 sinonimos.push({ productos: gruposArticulos[key] }); 47 sinonimos.push({ productos: gruposArticulos[key] });
48 }); 48 });
49 res = sinonimos; 49 res = sinonimos;
50 this.openModalSinonimos(res, promo); 50 this.openModalSinonimos(res, promo);
51 } else { 51 } else {
52 promo.cantidad = 1; 52 promo.cantidad = 1;
53 this.articuloService.setArticulo(promo); 53 this.articuloService.setArticulo(promo);
54 this.modalPromocion.hide(); 54 this.modalPromocion.hide();
55 } 55 }
56 }, err => console.error(err)); 56 }, err => console.error(err));
57 this.mediaPantalla(); 57 this.mediaPantalla();
58 } 58 }
59 59
60 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 60 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
61 const modalSinonimo = this.modalService.show(SinonimoComponent, { 61 const modalSinonimo = this.modalService.show(SinonimoComponent, {
62 initialState: { 62 initialState: {
63 sinonimos: sinonimosData, 63 sinonimos: sinonimosData,
64 articulo 64 articulo
65 }, 65 },
66 class: 'modal-promo modal-dialog-centered' 66 class: 'modal-dialog-centered'
67 }); 67 });
68 68
69 modalSinonimo.content.onClose 69 modalSinonimo.content.onClose
70 .subscribe((res: any) => { 70 .subscribe((res: any) => {
71 for (const a of articulo.productos) { 71 for (const a of articulo.productos) {
72 for (const aRes of res.articulos) { 72 for (const aRes of res.articulos) {
73 if (a.idSinonimo === aRes.ID_SIN) { 73 if (a.idSinonimo === aRes.ID_SIN) {
74 a.CODA = aRes.CodArt; 74 a.CODA = aRes.CodArt;
75 a.CodArt = aRes.CodArt; 75 a.CodArt = aRes.CodArt;
76 a.SECA = aRes.CodSec; 76 a.SECA = aRes.CodSec;
77 aRes.CodSec = aRes.CodSec; 77 aRes.CodSec = aRes.CodSec;
78 a.PreVen = aRes.PreVen; 78 a.PreVen = aRes.PreVen;
79 a.id = aRes.id; 79 a.id = aRes.id;
80 a.DET_LAR = aRes.DET_LAR; 80 a.DET_LAR = aRes.DET_LAR;
81 a.DetArt = aRes.DetArt; 81 a.DetArt = aRes.DetArt;
82 } 82 }
83 } 83 }
84 } 84 }
85 this.articuloService.setArticulo(articulo); 85 this.articuloService.setArticulo(articulo);
86 this.modalPromocion.hide(); 86 this.modalPromocion.hide();
87 }); 87 });
88 } 88 }
89 89
90 getPromociones() { 90 getPromociones() {
91 const sector = this.articulosPromo[0].CodSec; 91 const sector = this.articulosPromo[0].CodSec;
92 const codigo = this.articulosPromo[0].CodArt; 92 const codigo = this.articulosPromo[0].CodArt;
93 this.promocionService.getPromociones(sector, codigo) 93 this.promocionService.getPromociones(sector, codigo)
94 .subscribe((res: IArticulo[]) => { 94 .subscribe((res: IArticulo[]) => {
95 this.promociones = res; 95 this.promociones = res;
96 }, error => { console.error(error); }); 96 }, error => { console.error(error); });
97 } 97 }
98 98
99 @HostListener('document:click', ['$event']) 99 @HostListener('document:click', ['$event'])
100 eventListener(event: Event) { 100 eventListener(event: Event) {
101 clearTimeout(this.inactiveScreen.timerReposo); 101 clearTimeout(this.inactiveScreen.timerReposo);
102 this.inactiveScreen.startTimeOutInactividad(); 102 this.inactiveScreen.startTimeOutInactividad();
103 } 103 }
104 104
105 @HostListener('scroll', ['$event']) 105 @HostListener('scroll', ['$event'])
106 scrollEvent(event: Event) { 106 scrollEvent(event: Event) {
107 clearTimeout(this.inactiveScreen.timerReposo); 107 clearTimeout(this.inactiveScreen.timerReposo);
108 this.inactiveScreen.startTimeOutInactividad(); 108 this.inactiveScreen.startTimeOutInactividad();
109 } 109 }
110 110
111 mediaPantalla() { 111 mediaPantalla() {
112 if ($('body').hasClass('media-pantalla')) { 112 if ($('body').hasClass('media-pantalla')) {
113 $('.modal-content').addClass('media-pantalla'); 113 $('.modal-content').addClass('media-pantalla');
114 } 114 }
115 } 115 }
116 } 116 }
117 117
src/app/shared/sinonimo/sinonimo.component.html
1 <div class="bg-primary rounded text-white"> 1 <div class="bg-primary rounded text-white">
2 <div class="modal-header"> 2 <div class="modal-header">
3 <img
4 draggable="false"
5 ondragstart="return false;"
6 (contextmenu)="false"
7 (click)="close()"
8 class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
9 src="assets/img/icono-cancelar-blanco.svg">
3 <p class="col-7 h4 px-0 align-self-center">{{articulo.DetArt}}</p> 10 <p class="col-7 h4 px-0 align-self-center">{{articulo.DetArt}}</p>
4 <div class="col-5 pr-0 text-right"> 11 <div class="col-5 pt-4 pr-0 text-right">
5 <p *ngFor="let s of sinonimos; let i = index"> 12 <p *ngFor="let s of sinonimos; let i = index">
6 <span 13 <span
7 class="btn-effect" 14 class="btn-effect"
8 (click)="scrollTo(i)"> 15 (click)="scrollTo(i)">
9 Ir a opciรณn {{i+1}} 16 Ir a opciรณn {{i+1}}
10 <i class="far fa-hand-point-left"></i> 17 <i class="far fa-hand-point-left"></i>
11 </span> 18 </span>
12 </p> 19 </p>
13 </div> 20 </div>
14 </div> 21 </div>
15 22
16 <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2"> 23 <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2">
17 <div *ngFor="let s of sinonimos; let i = index"> 24 <div *ngFor="let s of sinonimos; let i = index">
18 <div [id]="i"></div> 25 <div [id]="i"></div>
19 <hr [hidden]="i === 0" class="bg-white"> 26 <hr [hidden]="i === 0" class="bg-white">
20 <div *ngFor="let articulo of s.productos"> 27 <div *ngFor="let articulo of s.productos">
21 <div class="custom-control custom-checkbox"> 28 <div class="custom-control custom-checkbox">
22 <input 29 <input
23 type="checkbox" 30 type="checkbox"
24 class="custom-control-input" 31 class="custom-control-input"
25 [(ngModel)]="articulo.seleccionado" 32 [(ngModel)]="articulo.seleccionado"
26 (click)="selectSinonimo(i, articulo)" 33 (click)="selectSinonimo(i, articulo)"
27 [id]="articulo.id"> 34 [id]="articulo.id">
28 <label 35 <label
29 class="custom-control-label" 36 class="custom-control-label"
30 [for]="articulo.id"> 37 [for]="articulo.id">
31 {{articulo.DET_LAR.toUpperCase()}} 38 {{articulo.DET_LAR.toUpperCase()}}
32 </label> 39 </label>
33 </div> 40 </div>
34 </div> 41 </div>
35 </div> 42 </div>
36 </div> 43 </div>
37 44
38 <div class="modal-footer"> 45 <div class="modal-footer">
39 <div 46 <div
40 [ngClass]="validate()" 47 [ngClass]="validate()"
41 class="d-inline-block py-1 bg-white badge-pill text-primary" 48 class="d-inline-block py-1 bg-white badge-pill text-primary"
42 (click)="continue()"> 49 (click)="continue()">
43 CONTINUAR 50 CONTINUAR
44 <img 51 <img
45 draggable="false" 52 draggable="false"
46 ondragstart="return false;" 53 ondragstart="return false;"
47 (contextmenu)="false" 54 (contextmenu)="false"
48 class="icon-30" 55 class="icon-30"
49 src="assets/img/ir-color.svg"> 56 src="assets/img/ir-color.svg">
50 </div> 57 </div>
51 </div> 58 </div>
52 </div> 59 </div>
53 60
src/app/shared/sinonimo/sinonimo.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 2 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
3 import { IArticulo } from 'src/app/interfaces/IArticulo'; 3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 import { BsModalRef } from 'ngx-bootstrap/modal'; 4 import { BsModalRef } from 'ngx-bootstrap/modal';
5 import { Subject, forkJoin } from 'rxjs'; 5 import { Subject, forkJoin } from 'rxjs';
6 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 6 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
7 import { element } from 'protractor'; 7 import { element } from 'protractor';
8 8
9 @Component({ 9 @Component({
10 selector: 'app-sinonimo', 10 selector: 'app-sinonimo',
11 templateUrl: './sinonimo.component.html', 11 templateUrl: './sinonimo.component.html',
12 styleUrls: ['./sinonimo.component.scss'] 12 styleUrls: ['./sinonimo.component.scss']
13 }) 13 })
14 export class SinonimoComponent implements OnInit { 14 export class SinonimoComponent implements OnInit {
15 sinonimos: ISinonimo[] = []; 15 sinonimos: ISinonimo[] = [];
16 isValid: boolean; 16 isValid: boolean;
17 onClose: Subject<any>; 17 onClose: Subject<any>;
18 articulosSelected: IArticulo[] = []; 18 articulosSelected: IArticulo[] = [];
19 articulo: IArticulo; 19 articulo: IArticulo;
20 20
21 constructor( 21 constructor(
22 private modalRef: BsModalRef, 22 private modalRef: BsModalRef,
23 private articuloService: ArticuloService, 23 private articuloService: ArticuloService,
24 ) { 24 ) {
25 this.onClose = new Subject(); 25 this.onClose = new Subject();
26 this.articulosSelected.length = this.sinonimos.length; 26 this.articulosSelected.length = this.sinonimos.length;
27 } 27 }
28 28
29 ngOnInit() { } 29 ngOnInit() { }
30 30
31 selectSinonimo(index: number, articulo: IArticulo) { 31 selectSinonimo(index: number, articulo: IArticulo) {
32 for (const a of this.sinonimos[index].productos) { 32 for (const a of this.sinonimos[index].productos) {
33 a.seleccionado = false; 33 a.seleccionado = false;
34 } 34 }
35 articulo.seleccionado = true; 35 articulo.seleccionado = true;
36 this.articulosSelected[index] = articulo; 36 this.articulosSelected[index] = articulo;
37 } 37 }
38 38
39 validate() { 39 validate() {
40 this.isValid = true; 40 this.isValid = true;
41 for (const s of this.sinonimos) { 41 for (const s of this.sinonimos) {
42 for (const a of s.productos) { 42 for (const a of s.productos) {
43 this.isValid = (!a.seleccionado) ? false : true; 43 this.isValid = (!a.seleccionado) ? false : true;
44 if (this.isValid) break; 44 if (this.isValid) break;
45 } 45 }
46 if (!this.isValid) break; 46 if (!this.isValid) break;
47 } 47 }
48 return !this.isValid ? 'disabled' : 'btn-effect'; 48 return !this.isValid ? 'disabled' : 'btn-effect';
49 } 49 }
50 50
51 continue() { 51 continue() {
52 if (!this.isValid) return; 52 if (!this.isValid) return;
53 const ID_SINS = []; 53 const ID_SINS = [];
54 const observables = []; 54 const observables = [];
55 55
56 for (const articulo of this.articulosSelected) { 56 for (const articulo of this.articulosSelected) {
57 ID_SINS.push(articulo.ID_SIN); 57 ID_SINS.push(articulo.ID_SIN);
58 } 58 }
59 59
60 for (const articulo of this.articulosSelected) { 60 for (const articulo of this.articulosSelected) {
61 observables.push(this.articuloService.getById(articulo.id)); 61 observables.push(this.articuloService.getById(articulo.id));
62 } 62 }
63 63
64 forkJoin(observables) 64 forkJoin(observables)
65 .subscribe((res: IArticulo[]) => { 65 .subscribe((res: IArticulo[]) => {
66 for (const articulo of res) { 66 for (const articulo of res) {
67 for (const ID_SIN of ID_SINS) { 67 for (const ID_SIN of ID_SINS) {
68 articulo.ID_SIN = ID_SIN; 68 articulo.ID_SIN = ID_SIN;
69 } 69 }
70 } 70 }
71 this.modalRef.hide(); 71 this.modalRef.hide();
72 this.onClose.next({ 72 this.onClose.next({
73 articulos: res, 73 articulos: res,
74 }); 74 });
75 }, err => console.error(err)); 75 }, err => console.error(err));
76 } 76 }
77 77
78 scrollTo(index: number) { 78 scrollTo(index: number) {
79 const el = document.getElementById(index.toString()); 79 const el = document.getElementById(index.toString());
80 el.scrollIntoView({ behavior: 'smooth', block: 'center' }); 80 el.scrollIntoView({ behavior: 'smooth' });
81 }
82
83 close() {
84 this.modalRef.hide();
81 } 85 }
82 86
83 } 87 }
84 88
src/etc/AppSettings.ejemplo.ts
1 // export const APP_SETTINGS = { 1 // export const APP_SETTINGS = {
2 // apiDeboSuite: 'http://localhost:1515', 2 // apiDeboSuite: 'http://localhost:1515',
3 // apiImagenes: 'http://10.231.45.220:1515',
3 // puntoVenta: 9998, 4 // puntoVenta: 9998,
4 // numeroPlanilla: 1111, 5 // numeroPlanilla: 1111,
5 // codigoP: 99996, 6 // codigoP: 99996,
6 // terminal: 101, 7 // terminal: 101,
7 // deploy: 'dev' 8 // deploy: 'dev'
8 // }; 9 // };
9 10
src/scss/styles-bootstrap.scss
1 @import "node_modules/bootstrap/scss/functions"; 1 @import "node_modules/bootstrap/scss/functions";
2 @import "node_modules/bootstrap/scss/variables"; 2 @import "node_modules/bootstrap/scss/variables";
3 @import "node_modules/bootstrap/scss/mixins"; 3 @import "node_modules/bootstrap/scss/mixins";
4 4
5 $primary: #aa006b; 5 $primary: #aa006b;
6 $secondary: #00acd8; 6 $secondary: #00acd8;
7 $info: #f4b223; 7 $info: #f4b223;
8 $light: #e6e7e9; 8 $light: #e6e7e9;
9 $dark: #61666c; 9 $dark: #61666c;
10 $theme-colors: ( 10 $theme-colors: (
11 primary: $primary, 11 primary: $primary,
12 secondary: $secondary, 12 secondary: $secondary,
13 info: $info, 13 info: $info,
14 light: $light, 14 light: $light,
15 dark: $dark 15 dark: $dark
16 ); 16 );
17 $border-radius: 1.5rem; 17 $border-radius: 1.5rem;
18 $border-radius-lg: 2.5rem; 18 $border-radius-lg: 2.5rem;
19 $border-radius-sm: 0.5rem; 19 $border-radius-sm: 0.5rem;
20 20
21 .custom-modal { 21 .custom-modal {
22 max-width: 90% !important; 22 max-width: 90% !important;
23 & > .modal-content { 23 & > .modal-content {
24 background-color: $primary !important; 24 background-color: $primary !important;
25 color: white; 25 color: white;
26 border: none !important; 26 border: none !important;
27 border-radius: $border-radius !important; 27 border-radius: $border-radius !important;
28 box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; 28 box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
29 } 29 }
30 } 30 }
31 31
32 .carousel-control { 32 .carousel-control {
33 visibility: hidden !important; 33 visibility: hidden !important;
34 } 34 }
35 35
36 .carousel, 36 .carousel,
37 .carousel-inner, 37 .carousel-inner,
38 .carousel-item, 38 .carousel-item,
39 .item { 39 .item {
40 height: 100% !important; 40 height: 100% !important;
41 } 41 }
42 42
43 .custom-checkbox .custom-control-label::before { 43 .custom-checkbox .custom-control-label::before {
44 border-radius: 50% !important; 44 border-radius: 50% !important;
45 } 45 }
46 46
47 .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { 47 .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
48 background-color: $primary !important; 48 background-color: $primary !important;
49 } 49 }
50 50
51 .custom-checkbox .custom-control-input:checked:focus ~ .custom-control-label::before { 51 .custom-checkbox .custom-control-input:checked:focus ~ .custom-control-label::before {
52 box-shadow: none !important; 52 box-shadow: none !important;
53 } 53 }
54 .custom-checkbox .custom-control-input:focus ~ .custom-control-label::before { 54 .custom-checkbox .custom-control-input:focus ~ .custom-control-label::before {
55 box-shadow: none !important; 55 box-shadow: none !important;
56 } 56 }
57 57
58 .custom-control-input:checked ~ .custom-control-label::before { 58 .custom-control-input:checked ~ .custom-control-label::before {
59 background-color: white !important; 59 background-color: white !important;
60 border-color: white !important; 60 border-color: white !important;
61 border-width: 2px; 61 border-width: 2px;
62 } 62 }
63 63
64 .custom-checkbox .custom-control-input:active ~ .custom-control-label::before { 64 .custom-checkbox .custom-control-input:active ~ .custom-control-label::before {
65 background-color: $primary !important; 65 background-color: $primary !important;
66 } 66 }
67 67
68 .modal { 68 .modal {
69 background-color: #0000004d; 69 background-color: #0000004d;
70 } 70 }
71 71
72 .modal-promo > div {
73 border: none !important;
74 border-radius: $border-radius;
75 margin-left: 10px !important;
76 }
77
78 .modal-content.media-pantalla { 72 .modal-content.media-pantalla {
79 margin-top: auto !important; 73 margin-top: auto !important;
80 margin-bottom: 50px !important; 74 margin-bottom: 50px !important;
81 } 75 }
82 76
83 .card { 77 .card {
84 border: none !important; 78 border: none !important;
85 } 79 }
86 80
87 @import "node_modules/bootstrap/scss/bootstrap"; 81 @import "node_modules/bootstrap/scss/bootstrap";
88 82
1 @import "scss/styles-bootstrap.scss"; 1 @import "scss/styles-bootstrap.scss";
2 @import "scss/typography.scss"; 2 @import "scss/typography.scss";
3 @import "scss/height-width.scss"; 3 @import "scss/height-width.scss";
4 @import "scss/animations.scss"; 4 @import "scss/animations.scss";
5 @import "scss/icons.scss"; 5 @import "scss/icons.scss";
6 @import "scss/scroll.scss"; 6 @import "scss/scroll.scss";
7 @import "node_modules/bootstrap/scss/_variables.scss"; 7 @import "node_modules/bootstrap/scss/_variables.scss";
8 8
9 @font-face { 9 @font-face {
10 font-family: "Gotham"; 10 font-family: "Gotham";
11 font-style: normal; 11 font-style: normal;
12 font-weight: normal; 12 font-weight: normal;
13 src: url("assets/fonts/gotham-medium.woff") format("woff"); 13 src: url("assets/fonts/gotham-medium.woff") format("woff");
14 } 14 }
15 15
16 html, 16 html,
17 body { 17 body {
18 max-height: 100vh; 18 max-height: 100vh;
19 height: 100%; 19 height: 100%;
20 font-family: "Gotham"; 20 font-family: "Gotham";
21 overflow: hidden; 21 overflow: hidden;
22 user-select: none; 22 user-select: none;
23 } 23 }
24 24
25 body.media-pantalla { 25 body.media-pantalla {
26 height: calc(50%) !important; 26 height: calc(50%) !important;
27 position: absolute; 27 position: absolute;
28 bottom: 0; 28 bottom: 0;
29 width: 100%; 29 width: 100%;
30 background-color: #3d3d3d; 30 background-color: #3d3d3d;
31 } 31 }
32 32
33 .btn-effect { 33 .btn-effect {
34 transition: all 0.3s !important; 34 transition: all 0.3s !important;
35 &:hover { 35 &:hover {
36 cursor: pointer !important; 36 cursor: pointer !important;
37 opacity: 0.7 !important; 37 opacity: 0.7 !important;
38 } 38 }
39 &:active { 39 &:active {
40 transform: scale(1.02) !important; 40 transform: scale(1.02) !important;
41 } 41 }
42 } 42 }
43 43
44 .cursor-pointer { 44 .cursor-pointer {
45 cursor: pointer; 45 cursor: pointer;
46 } 46 }
47 47
48 p { 48 p {
49 margin: 0 !important; 49 margin: 0 !important;
50 } 50 }
51 51
52 .img-in-top { 52 .img-in-top {
53 position: absolute; 53 position: absolute;
54 top: -35px; 54 top: -35px;
55 left: 50%; 55 left: 50%;
56 height: 70px; 56 height: 70px;
57 -webkit-transform: translateX(-50%); 57 -webkit-transform: translateX(-50%);
58 transform: translateX(-50%); 58 transform: translateX(-50%);
59 } 59 }
60 60
61 .right-0 { 61 .right-0 {
62 right: 0; 62 right: 0;
63 } 63 }
64 64
65 .top-0 {
66 top: 0;
67 }
68
65 .left-0 { 69 .left-0 {
66 left: 0; 70 left: 0;
67 } 71 }
68 72
69 .rotate-45 { 73 .rotate-45 {
70 transform: rotate(45deg); 74 transform: rotate(45deg);
71 } 75 }
72 76
73 .rotate-90 { 77 .rotate-90 {
74 transform: rotate(90deg); 78 transform: rotate(90deg);
75 } 79 }
76 80
77 .rotate-90-neg { 81 .rotate-90-neg {
78 transform: rotate(-90deg); 82 transform: rotate(-90deg);
79 } 83 }
80 84
81 .rotate-180-neg { 85 .rotate-180-neg {
82 transform: rotate(-180deg); 86 transform: rotate(-180deg);
83 } 87 }
84 88
85 .disabled { 89 .disabled {
86 opacity: 0.5; 90 opacity: 0.5;
87 } 91 }
88 92
89 .modal-content.media-pantalla { 93 .modal-content.media-pantalla {
90 margin-top: auto !important; 94 margin-top: auto !important;
91 margin-bottom: 50px !important; 95 margin-bottom: 50px !important;
92 } 96 }
93 97
94 .modal-content { 98 .modal-content {
95 background: transparent !important; 99 background: transparent !important;
96 } 100 }
101
102 .z-index {
103 z-index: 1000;
104 }
97 105