Marcelo Puebla / autoservicio-axion

Download as
Browse Code »

Commit c5c1df3b3c69fcfcefb681d3a98b48ba1f90697d

Authored by Marcelo Puebla
2 parents f612ee2741 282e37b43f
Exists in develop

Merge branch 'develop' into 'develop' 

Develop

See merge request !24
Showing 21 changed files   Show diff stats
src/app/app.component.html
Diff comments   View file @ c5c1df3
1 <router-outlet></router-outlet> 1 <router-outlet></router-outlet>
2
src/app/interfaces/ICategoria.ts
Diff comments   View file @ c5c1df3
1 export interface ICategoria { 1 export interface ICategoria {
2 id: number; 2 id: number;
3 detalle: string; 3 detalle: string;
4 es_promocion: boolean; 4 es_promocion: boolean;
5 vigencia_desde: Date; 5 vigencia_desde: Date;
6 vigencia_hasta: Date; 6 vigencia_hasta: Date;
7 ES_PEDIDO: boolean; 7 ES_PEDIDO: boolean;
8 selected?: boolean; 8 selected?: boolean;
9 path_imagen?: string;
9 } 10 }
10 11
src/app/interfaces/IPublicidad.ts
Diff comments   View file @ c5c1df3
File was created 1 export interface IPublicidad {
2 imagen?: string;
3 relaciona_producto?: boolean;
4 CodSec?: number;
5 CodArt?: number;
6 DET_LAR?: string;
7 id?: number;
8 base64?: any;
9 id_articulo?: number;
10 }
11
12 export class Publicidad {
13 imagen?: string;
14 relaciona_producto?: boolean;
15 CodSec?: number;
16 CodArt?: number;
17 DET_LAR?: string;
18 id?: number;
19 base64?: any;
20 id_articulo?: number;
21
22 constructor(publicidad?: Partial<Publicidad>) {
23 if (publicidad) {
24 Object.assign(this, publicidad);
25 return;
26 }
27 this.imagen = '';
28 this.DET_LAR = '';
29 this.relaciona_producto = false;
30 }
31 }
32
src/app/modules/admin/admin.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit, HostListener } from '@angular/core'; 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { Router } from '@angular/router'; 2 import { Router } from '@angular/router';
3 import { BsModalRef } from 'ngx-bootstrap/modal';
4 3
5 @Component({ 4 @Component({
6 selector: 'app-admin', 5 selector: 'app-admin',
7 templateUrl: './admin.component.html', 6 templateUrl: './admin.component.html',
8 styleUrls: ['./admin.component.scss'] 7 styleUrls: ['./admin.component.scss']
9 }) 8 })
10 9
11 export class AdminComponent implements OnInit { 10 export class AdminComponent implements OnInit {
12 timerReposo: any; 11 timerReposo: any;
13 12
14 constructor( 13 constructor(
15 private router: Router, 14 private router: Router,
16 // private modalRef: BsModalRef 15 ) { }
17 ) { } 16
18
19 ngOnInit() { 17 ngOnInit() {
20 this.startTimeOutInactividad(); 18 this.startTimeOutInactividad();
21 } 19 }
22 20
23 @HostListener('document:click', ['$event']) 21 @HostListener('document:click', ['$event'])
24 22
25 documentClick(event: MouseEvent) { 23 documentClick(event: MouseEvent) {
26 if (event) { 24 if (event) {
27 this.restartTimer(); 25 this.restartTimer();
28 } 26 }
29 } 27 }
30 28
31 restartTimer() { 29 restartTimer() {
32 clearTimeout(this.timerReposo); 30 clearTimeout(this.timerReposo);
33 this.startTimeOutInactividad(); 31 this.startTimeOutInactividad();
34 } 32 }
35 33
36 startTimeOutInactividad() { 34 startTimeOutInactividad() {
37 this.timerReposo = setTimeout(() => { 35 this.timerReposo = setTimeout(() => {
38 // this.modalRef.hide();
39 this.router.navigate(['cancelar-compra']); 36 this.router.navigate(['cancelar-compra']);
40 }, 90000); 37 }, 90000);
41 } 38 }
42 39
43 } 40 }
44 41
src/app/modules/carrito/carrito.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit, OnDestroy } 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 { trigger, state, style, transition, animate } from '@angular/animations'; 5 import { trigger, state, style, transition, animate } from '@angular/animations';
6 import { IArticulo } from 'src/app/interfaces/IArticulo'; 6 import { IArticulo } from 'src/app/interfaces/IArticulo';
7 import { Router } from '@angular/router'; 7 import { Router } from '@angular/router';
8 import { BsModalRef } from 'ngx-bootstrap/modal/public_api';
8 9
9 @Component({ 10 @Component({
10 selector: 'app-carrito', 11 selector: 'app-carrito',
11 templateUrl: './carrito.component.html', 12 templateUrl: './carrito.component.html',
12 styleUrls: ['./carrito.component.scss'], 13 styleUrls: ['./carrito.component.scss'],
13 animations: [ 14 animations: [
14 trigger('EnterLeave', [ 15 trigger('EnterLeave', [
15 state('flyIn', style({ transform: 'translateX(0)' })), 16 state('flyIn', style({ transform: 'translateX(0)' })),
16 transition(':enter', [ 17 transition(':enter', [
17 style({ transform: 'translateX(-100%)' }), 18 style({ transform: 'translateX(-100%)' }),
18 animate('1s ease-in') 19 animate('1s ease-in')
19 ]), 20 ]),
20 transition(':leave', [ 21 transition(':leave', [
21 animate('1s ease-out', style({ transform: 'translateX(-100%)' })) 22 animate('1s ease-out', style({ transform: 'translateX(-100%)' }))
22 ]) 23 ])
23 ]) 24 ])
24 ] 25 ]
25 }) 26 })
26 export class CarritoComponent implements OnInit { 27 export class CarritoComponent implements OnInit, OnDestroy {
27 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 28 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
28 maxCantidad = 50; 29 maxCantidad = 50;
30 modalRef: BsModalRef;
29 31
30 constructor( 32 constructor(
31 public articuloService: ArticuloService, 33 public articuloService: ArticuloService,
32 private location: Location, 34 private location: Location,
33 private router: Router, 35 private router: Router,
34 ) { } 36 ) { }
35 37
36 ngOnInit() { 38 ngOnInit() {
37 if (!this.articuloService.carrito.length) { 39 if (!this.articuloService.carrito.length) {
38 this.router.navigate(['']); 40 this.router.navigate(['']);
39 return; 41 return;
40 } 42 }
41 } 43 }
42 44
45 ngOnDestroy() {
46 if (this.modalRef) this.modalRef.hide();
47 }
48
43 deleteArticulo(index: number) { 49 deleteArticulo(index: number) {
44 this.articuloService.carrito.splice(index, 1); 50 this.articuloService.carrito.splice(index, 1);
45 this.articuloService.calcularTotal(); 51 this.articuloService.calcularTotal();
46 } 52 }
47 53
48 substractCant(articulo: IArticulo) { 54 substractCant(articulo: IArticulo) {
49 if (articulo.cantidad === 1) return; 55 if (articulo.cantidad === 1) return;
50 articulo.cantidad--; 56 articulo.cantidad--;
51 this.articuloService.calcularTotal(); 57 this.articuloService.calcularTotal();
52 } 58 }
53 59
54 addCant(articulo: IArticulo) { 60 addCant(articulo: IArticulo) {
55 if (articulo.cantidad >= this.maxCantidad) return; 61 if (articulo.cantidad >= this.maxCantidad) return;
56 articulo.cantidad++; 62 articulo.cantidad++;
57 this.articuloService.calcularTotal(); 63 this.articuloService.calcularTotal();
58 } 64 }
59 65
60 goBack() { 66 goBack() {
61 this.location.back(); 67 this.location.back();
62 } 68 }
63 69
64 } 70 }
65 71
src/app/modules/comanda/comanda.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { IComanda, IComandaDetalle, IComponente } from 'src/app/interfaces/IComanda'; 2 import { IComanda, IComandaDetalle, IComponente } from 'src/app/interfaces/IComanda';
3 import { ComandaService } from 'src/app/services/comanda/comanda.service'; 3 import { ComandaService } from 'src/app/services/comanda/comanda.service';
4 import * as _ from 'lodash'; 4 import * as _ from 'lodash';
5 5
6 @Component({ 6 @Component({
7 selector: 'app-comanda', 7 selector: 'app-comanda',
8 templateUrl: './comanda.component.html', 8 templateUrl: './comanda.component.html',
9 styleUrls: ['./comanda.component.scss'] 9 styleUrls: ['./comanda.component.scss']
10 }) 10 })
11 export class ComandaComponent implements OnInit { 11 export class ComandaComponent implements OnInit {
12 comandas: IComanda[] = []; 12 comandas: IComanda[] = [];
13 cicloTime: any; 13 cicloTime: any;
14 14
15 constructor( 15 constructor(
16 private comandaService: ComandaService, 16 private comandaService: ComandaService,
17 ) { } 17 ) { }
18 18
19 ngOnInit() { 19 ngOnInit() {
20 this.getComandas(); 20 this.getComandas();
21 this.timerGetComandas(); 21 this.timerGetComandas();
22 } 22 }
23 23
24 ngOnDestroy() { 24 OnDestroy() {
25 clearInterval(this.cicloTime); 25 clearInterval(this.cicloTime);
26 } 26 }
27 27
28 timerGetComandas() { 28 timerGetComandas() {
29 this.cicloTime = setInterval(() => { 29 this.cicloTime = setInterval(() => {
30 this.getComandas(); 30 this.getComandas();
31 }, 5000); 31 }, 5000);
32 } 32 }
33 33
34 getComandas() { 34 getComandas() {
35 this.comandaService.getAll() 35 this.comandaService.getAll()
36 .subscribe((resComandas: IComanda[]) => { 36 .subscribe((resComandas: IComanda[]) => {
37 this.addNewComandas(resComandas); 37 this.addNewComandas(resComandas);
38 }, e => console.error(e)); 38 }, e => console.error(e));
39 } 39 }
40 40
41 addNewComandas(resComandas: IComanda[]) { 41 addNewComandas(resComandas: IComanda[]) {
42 for (let j = 0; j < resComandas.length; j++) { 42 for (let j = 0; j < resComandas.length; j++) {
43 for (let i = 0; i < this.comandas.length; i++) { 43 for (const comanda of this.comandas) {
44 if (this.comandas[i].id === resComandas[j].id) { 44 if (comanda.id === resComandas[j].id) {
45 resComandas.splice(j, 1); 45 resComandas.splice(j, 1);
46 } 46 }
47 } 47 }
48 } 48 }
49 if (!resComandas.length) return; 49 if (!resComandas.length) return;
50 Array.prototype.push.apply(this.comandas, resComandas); 50 Array.prototype.push.apply(this.comandas, resComandas);
51 this.startTimersPedido(resComandas); 51 this.startTimersPedido(resComandas);
52 } 52 }
53 53
54 updateComanda(comanda: IComanda, estadoNuevo: number, observacionNueva: string) { 54 updateComanda(comanda: IComanda, estadoNuevo: number, observacionNueva: string) {
55 const data = { 55 const data = {
56 idComanda: comanda.id, 56 idComanda: comanda.id,
57 estado: estadoNuevo, 57 estado: estadoNuevo,
58 observacion: observacionNueva, 58 observacion: observacionNueva,
59 tiempoEspera: `${comanda.hoursPedido}:${comanda.secondsPedido}:${comanda.secondsPedido}`, 59 tiempoEspera: `${comanda.hoursPedido}:${comanda.secondsPedido}:${comanda.secondsPedido}`,
60 tiempoElaboracion: `${comanda.hoursElaboracion}:${comanda.secondsElaboracion}:${comanda.secondsElaboracion}`, 60 tiempoElaboracion: `${comanda.hoursElaboracion}:${comanda.secondsElaboracion}:${comanda.secondsElaboracion}`,
61 }; 61 };
62 if (data.estado === 3) { 62 if (data.estado === 3) {
63 this.comandaService.imprimirComandaCocina(parseInt(data.idComanda)) 63 this.comandaService.imprimirComandaCocina(parseInt(data.idComanda, 10))
64 .subscribe(res => { }, err => console.error(err) 64 .subscribe(res => { }, err => console.error(err)
65 ); 65 );
66 } 66 }
67 67
68 if (estadoNuevo !== 2) comanda.detalles.forEach(d => d.seeDetalle = false); 68 if (estadoNuevo !== 2) comanda.detalles.forEach(d => d.seeDetalle = false);
69 69
70 this.comandaService.update(data) 70 this.comandaService.update(data)
71 .subscribe((res: any) => { 71 .subscribe((res: any) => {
72 if (res.data) { 72 if (res.data) {
73 comanda.estado = estadoNuevo; 73 comanda.estado = estadoNuevo;
74 comanda.observacion = observacionNueva; 74 comanda.observacion = observacionNueva;
75 if (estadoNuevo === 2) { 75 if (estadoNuevo === 2) {
76 this.startTimerElaboracion(comanda); 76 this.startTimerElaboracion(comanda);
77 } else if (comanda.timerElaboracion) { 77 } else if (comanda.timerElaboracion) {
78 clearInterval(comanda.timerElaboracion); 78 clearInterval(comanda.timerElaboracion);
79 } 79 }
80 } 80 }
81 }, e => console.error(e)); 81 }, e => console.error(e));
82 } 82 }
83 83
84 rellenar(relleno, longitud) { 84 rellenar(relleno, longitud) {
85 relleno = '' + relleno; 85 relleno = '' + relleno;
86 while (relleno.length < longitud) { 86 while (relleno.length < longitud) {
87 relleno = '0' + relleno; 87 relleno = '0' + relleno;
88 } 88 }
89 return relleno; 89 return relleno;
90 } 90 }
91 91
92 toggleVerComponentes(detalle: IComandaDetalle, comanda: IComanda) { 92 toggleVerComponentes(detalle: IComandaDetalle, comanda: IComanda) {
93 detalle.seeDetalle = !detalle.seeDetalle; 93 detalle.seeDetalle = !detalle.seeDetalle;
94 } 94 }
95 95
96 hasTipo(componentes: IComponente[]) { 96 hasTipo(componentes: IComponente[]) {
97 return componentes.some(c => c.tipoArticulo === 6); 97 return componentes.some(c => c.tipoArticulo === 6);
98 } 98 }
99 99
100 //#region TIMERS 100 //#region TIMERS
101 startTimersPedido(comandas) { 101 startTimersPedido(comandas) {
102 comandas.forEach((comanda: IComanda) => { 102 comandas.forEach((comanda: IComanda) => {
103 this.comandaService.startTimerComanda(comanda, 'Pedido'); 103 this.comandaService.startTimerComanda(comanda, 'Pedido');
104 if (comanda.estado === 2) { 104 if (comanda.estado === 2) {
105 this.startTimerElaboracion(comanda); 105 this.startTimerElaboracion(comanda);
106 } 106 }
107 }); 107 });
108 } 108 }
109 109
110 startTimerElaboracion(comanda: IComanda) { 110 startTimerElaboracion(comanda: IComanda) {
111 this.comandaService.startTimerComanda(comanda, 'Elaboracion'); 111 this.comandaService.startTimerComanda(comanda, 'Elaboracion');
112 } 112 }
113 //#endregion 113 //#endregion
114 114
115 } 115 }
116 116
src/app/modules/mensaje-final/mensaje-final.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 2 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3 import { Router } from '@angular/router'; 3 import { Router } from '@angular/router';
4 4
5 @Component({ 5 @Component({
6 selector: 'app-mensaje-final', 6 selector: 'app-mensaje-final',
7 templateUrl: './mensaje-final.component.html', 7 templateUrl: './mensaje-final.component.html',
8 styleUrls: ['./mensaje-final.component.scss'] 8 styleUrls: ['./mensaje-final.component.scss']
9 }) 9 })
10 export class MensajeFinalComponent implements OnInit { 10 export class MensajeFinalComponent implements OnInit {
11 timer: any; 11 timer: any;
12 12
13 constructor( 13 constructor(
14 public articuloService: ArticuloService, 14 public articuloService: ArticuloService,
15 private router: Router, 15 private router: Router,
16 ) { } 16 ) { }
17 17
18 ngOnInit() { 18 ngOnInit() {
19 this.timer = setTimeout(() => { 19 this.timer = setTimeout(() => {
20 this.goToSplash(); 20 this.goToSplash();
21 }, 10000); 21 }, 10000);
22 } 22 }
23 23
24 ngOnDestroy() { 24 OnDestroy() {
25 clearTimeout(this.timer); 25 clearTimeout(this.timer);
26 } 26 }
27 27
28 goToSplash() { 28 goToSplash() {
29 this.articuloService.cleanShoppingCar(); 29 this.articuloService.cleanShoppingCar();
30 this.router.navigate(['']); 30 this.router.navigate(['']);
31 } 31 }
32 32
33 } 33 }
34 34
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ c5c1df3
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <!-- PUBLICIDADES --> 2 <!-- PUBLICIDADES -->
3 <app-header-publicidad></app-header-publicidad> 3 <app-header-publicidad></app-header-publicidad>
4 4
5 <div class="row mx-0 h-80 align-items-end"> 5 <div class="row mx-0 h-80 align-items-end">
6 <!-- CABECERA --> 6 <!-- CABECERA -->
7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm"> 7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 p-2 align-self-center"> 8 <div class="col-12 p-2 align-self-center">
9 <div class="px-3"> 9 <div class="px-3">
10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p> 10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p>
11 </div> 11 </div>
12 </div> 12 </div>
13 </div> 13 </div>
14 <!-- CUERPO --> 14 <!-- CUERPO -->
15 <div class="row w-100 mr-4 h-70"> 15 <div class="row w-100 mr-4 h-70">
16 <div class="col-12 h-100 px-0 py-3"> 16 <div class="col-12 h-100 px-0 py-3">
17 <div class="row mx-0 h-100"> 17 <div class="row mx-0 h-100">
18 <!-- FILTRO CATEGORIAS --> 18 <!-- FILTRO CATEGORIAS -->
19 <div class="col-5 col-sm-3 col-xl-2 h-100"> 19 <div class="col-5 col-sm-3 col-xl-2 h-100">
20 <p class="h6 h-6 m-0 text-center"><small>CATEGORÍAS</small></p> 20 <p class="h6 h-6 m-0 text-center"><small>CATEGORÍAS</small></p>
21 <div class="row mx-0 h-94 justify-content-center align-items-center"> 21 <div class="row mx-0 h-94 justify-content-center align-items-center">
22 <div class="col-auto btn-effect h-5"> 22 <div class="col-auto btn-effect h-5">
23 <img 23 <img
24 draggable="false" 24 draggable="false"
25 ondragstart="return false;" 25 ondragstart="return false;"
26 (contextmenu)="false" 26 (contextmenu)="false"
27 class="h-100 d-block mx-auto rotate-90-neg" 27 class="h-100 d-block mx-auto rotate-90-neg"
28 src="assets/img/ir-color.svg" 28 src="assets/img/ir-color.svg"
29 (mousedown)="scrollY(templateCategorias, -100)" 29 (mousedown)="scrollY(templateCategorias, -100)"
30 (mouseup)="mouseup()" 30 (mouseup)="mouseup()"
31 (mouseleave)="mouseup()"> 31 (mouseleave)="mouseup()">
32 </div> 32 </div>
33 <!-- CATEGORIAS --> 33 <!-- CATEGORIAS -->
34 <div 34 <div
35 #templateCategorias 35 #templateCategorias
36 class="col-12 px-0 box-categorias border border-primary border-left-0 rounded-right scroll-y"> 36 class="col-12 px-0 box-categorias border border-primary border-left-0 rounded-right scroll-y">
37 <div 37 <div
38 class="row mx-4 mb-2 h-32 justify-content-center tab" 38 class="row mx-4 mb-2 h-32 justify-content-center tab"
39 [ngClass]="{ 'active': allActive, 'border-bottom-effect': !allActive }" 39 [ngClass]="{ 'active': allActive, 'border-bottom-effect': !allActive }"
40 (click)="selectCategoria(-1, 0)"> 40 (click)="selectCategoria(-1, 0)">
41 <img 41 <img
42 draggable="false" 42 draggable="false"
43 ondragstart="return false;" 43 ondragstart="return false;"
44 (contextmenu)="false" 44 (contextmenu)="false"
45 class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle" 45 class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle"
46 src="assets/img/ir-color.svg"> 46 src="assets/img/logo-spot.svg">
47 <small class="col-12 px-0 my-1 h-25 align-self-end text-center text-truncate">Todos</small> 47 <small class="col-12 px-0 my-1 h-25 align-self-end text-center text-truncate">Todos</small>
48 </div> 48 </div>
49 <div 49 <div
50 class="row mx-4 mb-2 h-32 justify-content-center tab" 50 class="row mx-4 mb-2 h-32 justify-content-center tab"
51 [ngClass]="{ 'active': categoria.selected, 'border-bottom-effect': !categoria.selected }" 51 [ngClass]="{ 'active': categoria.selected, 'border-bottom-effect': !categoria.selected }"
52 (click)="selectCategoria(i, categoria.id)" 52 (click)="selectCategoria(i, categoria.id)"
53 *ngFor="let categoria of categorias; let i = index;"> 53 *ngFor="let categoria of categorias; let i = index;">
54 <img 54 <img
55 draggable="false" 55 draggable="false"
56 ondragstart="return false;" 56 ondragstart="return false;"
57 (contextmenu)="false" 57 (contextmenu)="false"
58 class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle" 58 class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle"
59 src="assets/img/ir-color.svg"> 59 src="{{urlImagenes}}{{categoria.path_imagen}}">
60 <small class="col-12 px-0 my-1 h-25 align-self-end text-center text-truncate">{{categoria.detalle}}</small> 60 <small class="col-12 px-0 my-1 h-25 align-self-end text-center text-truncate">{{categoria.detalle}}</small>
61 </div> 61 </div>
62 </div> 62 </div>
63 <div class="col-auto btn-effect h-5"> 63 <div class="col-auto btn-effect h-5">
64 <img 64 <img
65 draggable="false" 65 draggable="false"
66 ondragstart="return false;" 66 ondragstart="return false;"
67 (contextmenu)="false" 67 (contextmenu)="false"
68 class="h-100 d-block mx-auto rotate-90" 68 class="h-100 d-block mx-auto rotate-90"
69 src="assets/img/ir-color.svg" 69 src="assets/img/ir-color.svg"
70 (mousedown)="scrollY(templateCategorias, 100)" 70 (mousedown)="scrollY(templateCategorias, 100)"
71 (mouseup)="mouseup()" 71 (mouseup)="mouseup()"
72 (mouseleave)="mouseup()"> 72 (mouseleave)="mouseup()">
73 </div> 73 </div>
74 </div> 74 </div>
75 </div> 75 </div>
76 <!-- LISTA DE ARTICULOS --> 76 <!-- LISTA DE ARTICULOS -->
77 <div class="col-7 col-sm-9 col-xl-10 pb-3 h-80 align-self-center scroll-y-visible"> 77 <div class="col-7 col-sm-9 col-xl-10 pb-3 h-80 align-self-center scroll-y-visible">
78 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6"> 78 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6">
79 <!-- ARTICULO --> 79 <!-- ARTICULO -->
80 <div 80 <div
81 class="col px-2 my-1 my-md-3 h-auto" 81 class="col px-2 my-1 my-md-3 h-auto"
82 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;"> 82 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
83 <div class="swing-in-top-fwd card h-auto"> 83 <div class="swing-in-top-fwd card h-auto">
84 <div *ngIf="articulo.PRO"> 84 <div *ngIf="articulo.PRO">
85 <i class="fas fa-piggy-bank"></i> 85 <i class="fas fa-piggy-bank"></i>
86 </div> 86 </div>
87 <img 87 <img
88 draggable="false" 88 draggable="false"
89 ondragstart="return false;" 89 ondragstart="return false;"
90 (contextmenu)="false" 90 (contextmenu)="false"
91 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 91 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
92 onerror="this.src='assets/img/image-not-found.jpg'" 92 onerror="this.src='assets/img/image-not-found.jpg'"
93 class="card-img-top h-55 rounded-sm"> 93 class="card-img-top h-55 rounded-sm">
94 <div class="row mx-0 py-1 h-auto justify-content-center"> 94 <div class="row mx-0 py-1 h-auto justify-content-center">
95 <p class="col-12 px-1 h6 h-auto text-primary text-center min-h-60">{{articulo.DetArt}}</p> 95 <p class="col-12 px-1 h6 h-auto text-primary text-center min-h-60">{{articulo.DetArt}}</p>
96 <p class="col-12 px-1 h-auto text-center line-height-sm min-h-50"> 96 <p class="col-12 px-1 h-auto text-center line-height-sm min-h-50">
97 <small>{{articulo.DET_LAR}}</small> 97 <small>{{articulo.DET_LAR}}</small>
98 </p> 98 </p>
99 <div class="col-12 px-1 align-self-end btn-effect h-auto"> 99 <div class="col-12 px-1 align-self-end btn-effect h-auto">
100 <div 100 <div
101 [ngClass]="{'bg-secondary': articulo.promo}" 101 [ngClass]="{'bg-secondary': articulo.promo}"
102 class="row mx-0 justify-content-between bg-primary badge-pill" 102 class="row mx-0 justify-content-between bg-primary badge-pill"
103 (click)="!articulo.FPP ? elegirArticulo(articulo) : openModalPromos(articulo, templatePromos)"> 103 (click)="elegirArticulo(articulo)">
104 <div class="col px-0 align-self-center text-white text-right"> 104 <div class="col px-0 align-self-center text-white text-right">
105 {{articulo.PreVen | currency}} 105 {{articulo.PreVen | currency}}
106 </div> 106 </div>
107 <div class="col-5 px-0"> 107 <div class="col-5 px-0">
108 <img 108 <img
109 draggable="false" 109 draggable="false"
110 ondragstart="return false;" 110 ondragstart="return false;"
111 (contextmenu)="false" 111 (contextmenu)="false"
112 class="d-block ml-auto py-1 icon-30" 112 class="d-block ml-auto py-1 icon-30"
113 src="assets/img/ir.svg"> 113 src="assets/img/ir.svg">
114 </div> 114 </div>
115 </div> 115 </div>
116 </div> 116 </div>
117 </div> 117 </div>
118 </div> 118 </div>
119 </div> 119 </div>
120 </div> 120 </div>
121 <!-- BOTON VER MAS --> 121 <!-- BOTON VER MAS -->
122 <div class="row mx-0"> 122 <div class="row mx-0">
123 <div 123 <div
124 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length" 124 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length"
125 class="col-12 px-0 mb-2"> 125 class="col-12 px-0 mb-2">
126 <button 126 <button
127 (click)="increaseShow()" 127 (click)="increaseShow()"
128 class="btn btn-block btn-outline-primary"> 128 class="btn btn-block btn-outline-primary">
129 Ver Más 129 Ver Más
130 </button> 130 </button>
131 </div> 131 </div>
132 </div> 132 </div>
133 </div> 133 </div>
134 </div> 134 </div>
135 </div> 135 </div>
136 </div> 136 </div>
137 <!-- FOOTER CARRITO DE COMPRAS --> 137 <!-- FOOTER CARRITO DE COMPRAS -->
138 <div class="row w-90 mx-auto h-auto justify-content-center"> 138 <div class="row w-90 mx-auto h-auto justify-content-center">
139 <div class="col-12 h-75 px-0 border border-primary rounded"> 139 <div class="col-12 h-75 px-0 border border-primary rounded">
140 <!-- CABECERA --> 140 <!-- CABECERA -->
141 <div class="row mx-0 h-15 border-bottom border-primary"> 141 <div class="row mx-0 h-15 border-bottom border-primary">
142 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p> 142 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p>
143 </div> 143 </div>
144 <!-- CUERPO --> 144 <!-- CUERPO -->
145 <div class="row h-85 mx-0 justify-content-around"> 145 <div class="row h-85 mx-0 justify-content-around">
146 <!-- BOTON SCROLL IZQUIERDA --> 146 <!-- BOTON SCROLL IZQUIERDA -->
147 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 147 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
148 <img 148 <img
149 draggable="false" 149 draggable="false"
150 ondragstart="return false;" 150 ondragstart="return false;"
151 (contextmenu)="false" 151 (contextmenu)="false"
152 class="icon-30 rotate-180-neg" 152 class="icon-30 rotate-180-neg"
153 src="assets/img/ir-fondo-color.svg" 153 src="assets/img/ir-fondo-color.svg"
154 (mousedown)="scrollX(templateCarrito, -100)" 154 (mousedown)="scrollX(templateCarrito, -100)"
155 (mouseup)="mouseup()" 155 (mouseup)="mouseup()"
156 (mouseleave)="mouseup()"> 156 (mouseleave)="mouseup()">
157 </div> 157 </div>
158 <!-- CARRITO --> 158 <!-- CARRITO -->
159 <div class="col-6 col-sm-8 col-md-9 col-lg-10 h-100"> 159 <div class="col-6 col-sm-8 col-md-9 col-lg-10 h-100">
160 <div #templateCarrito class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"> 160 <div #templateCarrito class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x">
161 <!-- MENSAJE DE ADVERTENCIA --> 161 <!-- MENSAJE DE ADVERTENCIA -->
162 <div *ngIf="!articuloService.carrito.length" class="col h-100"> 162 <div *ngIf="!articuloService.carrito.length" class="col h-100">
163 <p class="text-center py-5">No hay articulos en el carrito</p> 163 <p class="text-center py-5">No hay articulos en el carrito</p>
164 </div> 164 </div>
165 <!-- ARTICULOS --> 165 <!-- ARTICULOS -->
166 <div 166 <div
167 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary" 167 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
168 *ngFor="let articulo of articuloService.carrito; let i = index;"> 168 *ngFor="let articulo of articuloService.carrito; let i = index;">
169 <div class="swing-in-top-fwd"> 169 <div class="swing-in-top-fwd">
170 <img 170 <img
171 draggable="false" 171 draggable="false"
172 ondragstart="return false;" 172 ondragstart="return false;"
173 (contextmenu)="false" 173 (contextmenu)="false"
174 class="d-block img-fluid p-2 mx-auto rounded" 174 class="d-block img-fluid p-2 mx-auto rounded"
175 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 175 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
176 onerror="this.src='assets/img/image-not-found.jpg'"> 176 onerror="this.src='assets/img/image-not-found.jpg'">
177 <p class="d-block mt-auto text-center text-primary text-truncate"> 177 <p class="d-block mt-auto text-center text-primary text-truncate">
178 <small>{{articulo.DetArt}}</small> 178 <small>{{articulo.DetArt}}</small>
179 </p> 179 </p>
180 </div> 180 </div>
181 </div> 181 </div>
182 </div> 182 </div>
183 </div> 183 </div>
184 <!-- BOTON SCROLL DERECHA --> 184 <!-- BOTON SCROLL DERECHA -->
185 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 185 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
186 <img 186 <img
187 draggable="false" 187 draggable="false"
188 ondragstart="return false;" 188 ondragstart="return false;"
189 (contextmenu)="false" 189 (contextmenu)="false"
190 class="icon-30" 190 class="icon-30"
191 src="assets/img/ir-fondo-color.svg" 191 src="assets/img/ir-fondo-color.svg"
192 (mousedown)="scrollX(templateCarrito, 100)" 192 (mousedown)="scrollX(templateCarrito, 100)"
193 (mouseup)="mouseup()" 193 (mouseup)="mouseup()"
194 (mouseleave)="mouseup()"> 194 (mouseleave)="mouseup()">
195 </div> 195 </div>
196 </div> 196 </div>
197 </div> 197 </div>
198 <!-- VER CARRITO Y TOTAL--> 198 <!-- VER CARRITO Y TOTAL-->
199 <div 199 <div
200 class="col-auto p-0 mt-2 ml-auto h-20" 200 class="col-auto p-0 mt-2 ml-auto h-20"
201 *ngIf="articuloService.carrito.length"> 201 *ngIf="articuloService.carrito.length">
202 <div 202 <div
203 class="btn-effect col-auto align-self-center px-0 bg-white" 203 class="btn-effect col-auto align-self-center px-0 bg-white"
204 [routerLink]="['/carrito']"> 204 [routerLink]="['/carrito']">
205 <div class="row justify-content-between mx-0"> 205 <div class="row justify-content-between mx-0">
206 <div class="col-auto align-self-center text-primary">TOTAL</div> 206 <div class="col-auto align-self-center text-primary">TOTAL</div>
207 <div class="col-auto p-0 bg-primary d-none d-sm-block bg-total"> 207 <div class="col-auto p-0 bg-primary d-none d-sm-block bg-total">
208 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p> 208 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p>
209 </div> 209 </div>
210 <div class="col-auto align-self-center text-primary ml-2 bg-light">VER CARRITO</div> 210 <div class="col-auto align-self-center text-primary ml-2 bg-light">VER CARRITO</div>
211 <div class="col-auto p-0 bg-primary d-none d-sm-block"> 211 <div class="col-auto p-0 bg-primary d-none d-sm-block">
212 <img 212 <img
213 draggable="false" 213 draggable="false"
214 ondragstart="return false;" 214 ondragstart="return false;"
215 (contextmenu)="false" 215 (contextmenu)="false"
216 class="p-2 icon-40" 216 class="p-2 icon-40"
217 src="assets/img/carrito.svg"> 217 src="assets/img/carrito.svg">
218 </div> 218 </div>
219 </div> 219 </div>
220 </div> 220 </div>
221 </div> 221 </div>
222 222
223 </div> 223 </div>
224 </div> 224 </div>
225 225
226 </div> 226 </div>
227
228 <ng-template #templatePromos>
229 <div class="modal-header bg-primary">
230 <div class="col-12">
231 <div class="row justify-content-between" *ngIf="articuloPromo.length">
232 <div>
233 <h3 class="ml-2 text-white mt-2">{{articuloPromo[0].DetArt}}</h3>
234 </div>
235 <div class="row"(click)="elegirArticulo(articuloPromo[0]); modalRef.hide()">
236 <div
237 class="row mr-3 justify-content-between bg-white badge-pill">
238 <div class="col px-0 align-self-center text-primary">
239 <p class="font-weight-bold">{{articuloPromo[0].PreVen | currency}}</p>
240 </div>
241 <div class="col-3 px-0">
242 <img
243 draggable="false"
244 ondragstart="return false;"
245 (contextmenu)="false"
246 class="d-block ml-auto py-1 icon-30 mr-2 pt-2"
247 src="assets/img/ir-color.svg">
248 </div>
249 </div>
250 </div>
251 </div>
252 <div class="col-12 border-bottom mt-3 mx-n3"></div>
253 </div>
254 </div>
255 <div class="modal-body bg-primary" *ngIf="articuloPromo.length">
256 <div class="row">
257 <div class="col-9">
258 <p class="text-white"><small>¿TE GUSTARIA LLEVAR ESTE ARTÍCULO</small></p>
259 <h1 class="text-white mb-4">en un combo?</h1>
260 <div *ngFor="let promo of promociones">
261 <div class="mx-0 bg-white badge-pill text-primary" (click)="elegirArticulo(promo); modalRef.hide()">
262 <div class="row justify-content-between">
263 <p class="ml-4 text-truncate">{{promo.DetArt}}</p>
264 <p class="mr-4 font-weight-bold">{{promo.PreVen | currency}}</p>
265 </div>
266 </div>
267 </div>
268 </div>
269 <div class="col-3 rounded-circle">
270 <img
271 draggable="false"
272 ondragstart="return false;"
273 (contextmenu)="false"
274 src="{{urlImagenes}}{{articuloPromo[0].imagenes[0].imagen}}"
275 onerror="this.src='assets/img/image-not-found.jpg'"
276 class="card-img-top h-90 w-90 rounded-circle">
277 </div>
278 </div>
279 </div>
280 </ng-template>
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit, TemplateRef } from '@angular/core'; 1 import { Component, OnInit, TemplateRef, OnDestroy } 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 { CategoriaService } from 'src/app/services/categoria/categoria.service'; 7 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
8 import { PromocionService } from 'src/app/services/promocion/promocion.service'; 8 import { PromocionService } from 'src/app/services/promocion/promocion.service';
9 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 10
10 @Component({ 11 @Component({
11 selector: 'app-seleccion-articulos', 12 selector: 'app-seleccion-articulos',
12 templateUrl: './seleccion-articulos.component.html', 13 templateUrl: './seleccion-articulos.component.html',
13 styleUrls: ['./seleccion-articulos.component.scss'] 14 styleUrls: ['./seleccion-articulos.component.scss']
14 }) 15 })
15 export class SeleccionArticulosComponent implements OnInit { 16 export class SeleccionArticulosComponent implements OnInit, OnDestroy {
16 showSpinner = true; 17 showSpinner = true;
17 timeoutHandler: any; 18 timeoutHandler: any;
18 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 19 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
19 articulos: IArticulo[] = []; 20 articulos: IArticulo[] = [];
20 auxArticulos: IArticulo[] = []; 21 auxArticulos: IArticulo[] = [];
21 showQuantity = 100; 22 showQuantity = 100;
22 queMostrar = 'todos'; 23 queMostrar = 'todos';
23 categoriaActive: number = null; 24 categoriaActive = null;
24 categorias: ICategoria[] = []; 25 categorias: ICategoria[] = [];
25 searchTerm = ''; 26 searchTerm = '';
26 ordenandoByVendidos = true; 27 ordenandoByVendidos = true;
27 allActive = true; 28 allActive = true;
28 modalRef: BsModalRef; 29 modalRef: BsModalRef;
29 total: number = 0; 30 total = 0;
30 articuloPromo: IArticulo[] = [];
31 promociones: IArticulo[] = [];
32 31
33 constructor( 32 constructor(
34 public articuloService: ArticuloService, 33 public articuloService: ArticuloService,
35 private categoriaService: CategoriaService, 34 private categoriaService: CategoriaService,
36 private modalService: BsModalService, 35 private modalService: BsModalService,
37 private promocionService: PromocionService
38 ) { } 36 ) { }
39 37
40 ngOnInit() { 38 ngOnInit() {
41 this.getCategorias(); 39 this.getCategorias();
42 } 40 }
43 41
42 ngOnDestroy() {
43 if (this.modalRef) this.modalRef.hide();
44 }
45
44 getCategorias() { 46 getCategorias() {
45 this.categoriaService.getCategorias() 47 this.categoriaService.getAll()
46 .subscribe((categorias: ICategoria[]) => { 48 .subscribe((categorias: ICategoria[]) => {
47 switch (this.queMostrar) { 49 switch (this.queMostrar) {
48 case 'todos': 50 case 'todos':
49 this.categorias = categorias; 51 this.categorias = categorias;
50 this.categoriaActive = 0; 52 this.categoriaActive = 0;
51 break; 53 break;
52 case 'promociones': 54 case 'promociones':
53 this.categorias = categorias; 55 this.categorias = categorias;
54 this.categoriaActive = 19; 56 this.categoriaActive = 19;
55 break; 57 break;
56 case 'ordenar': 58 case 'ordenar':
57 this.categorias = categorias.filter((categoria: ICategoria) => { 59 this.categorias = categorias.filter((categoria: ICategoria) => {
58 return categoria.ES_PEDIDO; 60 return categoria.ES_PEDIDO;
59 }); 61 });
60 this.categoriaActive = 4; 62 this.categoriaActive = 4;
61 break; 63 break;
62 default: 64 default:
63 this.categorias = categorias; 65 this.categorias = categorias;
64 this.categoriaActive = 0; 66 this.categoriaActive = 0;
65 break; 67 break;
66 } 68 }
67 !localStorage.getItem('articulos') ? 69 !localStorage.getItem('articulos') ?
68 this.getProductos() : 70 this.getProductos() :
69 this.setProductos(); 71 this.setProductos();
70 }); 72 });
71 } 73 }
72 74
73 getProductos() { 75 getProductos() {
74 this.articuloService.getAll() 76 this.articuloService.getAll()
75 .subscribe((result: IArticulo[]) => { 77 .subscribe((result: IArticulo[]) => {
76 this.articuloService.setArticulosSinImagen(result); 78 this.articuloService.setArticulosSinImagen(result);
77 if (this.queMostrar === 'ordenar') { 79 if (this.queMostrar === 'ordenar') {
78 this.categorias.forEach((categoria: ICategoria) => { 80 this.categorias.forEach((categoria: ICategoria) => {
79 const tempArticulos = result.filter((articulo: IArticulo) => { 81 const tempArticulos = result.filter((articulo: IArticulo) => {
80 return articulo.categoria_selfservice === categoria.id; 82 return articulo.categoria_selfservice === categoria.id;
81 }); 83 });
82 result = tempArticulos; 84 result = tempArticulos;
83 }); 85 });
84 } 86 }
85 localStorage.setItem('articulos', JSON.stringify(result)); 87 localStorage.setItem('articulos', JSON.stringify(result));
86 this.setProductos(); 88 this.setProductos();
87 }, (error) => { 89 }, (error) => {
88 this.showSpinner = false; 90 this.showSpinner = false;
89 console.error(error); 91 console.error(error);
90 }); 92 });
91 } 93 }
92 94
93 setProductos() { 95 setProductos() {
94 this.articulos = JSON.parse(localStorage.getItem('articulos')); 96 this.articulos = JSON.parse(localStorage.getItem('articulos'));
95 this.filterItems(); 97 this.filterItems();
96 } 98 }
97 99
98 filterItems() { 100 filterItems() {
99 if (this.categoriaActive === 0) { 101 if (this.categoriaActive === 0) {
100 this.auxArticulos = this.articulos; 102 this.auxArticulos = this.articulos;
101 return; 103 return;
102 } 104 }
103 this.auxArticulos = this.articulos.filter(x => { 105 this.auxArticulos = this.articulos.filter(x => {
104 return x.categoria_selfservice === this.categoriaActive; 106 return x.categoria_selfservice === this.categoriaActive;
105 }); 107 });
106 this.ordenar(); 108 this.ordenar();
107 } 109 }
108 110
109 ordenar() { 111 ordenar() {
110 if (this.ordenandoByVendidos) { 112 if (this.ordenandoByVendidos) {
111 this.auxArticulos.sort((a, b) => { 113 this.auxArticulos.sort((a, b) => {
112 return b.cantidadVendida - a.cantidadVendida; 114 return b.cantidadVendida - a.cantidadVendida;
113 }); 115 });
114 } 116 }
115 } 117 }
116 118
117 selectCategoria(index: number, idCategoria?: number) { 119 selectCategoria(index: number, idCategoria?: number) {
118 if (this.categoriaActive === idCategoria) return; 120 if (this.categoriaActive === idCategoria) return;
119 this.categoriaActive = idCategoria; 121 this.categoriaActive = idCategoria;
120 this.allActive = idCategoria === 0 ? true : false; 122 this.allActive = idCategoria === 0 ? true : false;
121 this.categorias.forEach((categoria, i) => { 123 this.categorias.forEach((categoria, i) => {
122 categoria.selected = index === i ? true : false; 124 categoria.selected = index === i ? true : false;
123 }); 125 });
124 this.filterItems(); 126 this.filterItems();
125 } 127 }
126 128
127 elegirArticulo(articulo: IArticulo) { 129 elegirArticulo(articulo: IArticulo) {
128 this.articuloService.getById(articulo.id) 130 if (!articulo.FPP) {
131 this.getByID(articulo.id);
132 } else {
133 this.openModalPromos(articulo);
134 }
135 }
136
137 getByID(id: number) {
138 this.articuloService.getById(id)
129 .subscribe((res: IArticulo) => { 139 .subscribe((res: IArticulo) => {
130 res.cantidad = 1; 140 res.cantidad = 1;
131 this.articuloService.setArticulo(res); 141 this.articuloService.setArticulo(res);
132 }, err => console.error(err)); 142 }, err => console.error(err));
133 } 143 }
134 144
135 openModalPromos(articulo: IArticulo, templatePromos: TemplateRef<any>) { 145 openModalPromos(articulo: IArticulo) {
136 this.articuloService.getById(articulo.id) 146 this.modalRef = this.modalService.show(PromocionComponent,
137 .subscribe((res: IArticulo) => { 147 {
138 this.articuloPromo[0] = res; 148 initialState: {
139 this.getPromociones(); 149 idArticulo: articulo.id
140 }, err => console.error(err)); 150 },
141 this.modalRef = this.modalService.show(templatePromos, { class: 'custom-modal modal-dialog-centered', backdrop: 'static' }); 151 class: 'modal-promo modal-dialog-centered'
142 setTimeout(() => { 152 });
143 this.modalRef.hide();
144 }, 80000);
145 }
146
147 getPromociones() {
148 var sector = this.articuloPromo[0].CodSec;
149 var codigo = this.articuloPromo[0].CodArt;
150 this.promocionService.getPromociones(sector, codigo)
151 .subscribe((res: IArticulo[]) => {
152 this.promociones = res;
153 }, error => { console.error(error); })
154 } 153 }
155 154
156 increaseShow() { 155 increaseShow() {
157 this.showQuantity += 100; 156 this.showQuantity += 100;
158 } 157 }
159 158
160 mouseup() { 159 mouseup() {
161 if (!this.timeoutHandler) return; 160 if (!this.timeoutHandler) return;
162 clearInterval(this.timeoutHandler); 161 clearInterval(this.timeoutHandler);
163 } 162 }
164 163
165 scrollY(el: HTMLElement, value) { 164 scrollY(el: HTMLElement, value) {
166 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 165 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
src/app/services/articulo/articulo.service.ts
Diff comments   View file @ c5c1df3
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http'; 2 import { HttpClient } from '@angular/common/http';
3 import { APP_SETTINGS } from '../../../etc/AppSettings'; 3 import { APP_SETTINGS } from '../../../etc/AppSettings';
4 import { IArticulo } from '../../interfaces/IArticulo'; 4 import { IArticulo } from '../../interfaces/IArticulo';
5 import { ClienteService } from '../cliente/cliente.service'; 5 import { ClienteService } from '../cliente/cliente.service';
6 import { Observable } from 'rxjs'; 6 import { Observable } from 'rxjs';
7 7
8 @Injectable() 8 @Injectable()
9 export class ArticuloService { 9 export class ArticuloService {
10 carrito: IArticulo[] = []; 10 carrito: IArticulo[] = [];
11 articuloAcargar: IArticulo; 11 articuloAcargar: IArticulo;
12 promoAcargar: IArticulo; 12 promoAcargar: IArticulo;
13 mostrar: string; 13 mostrar: string;
14 esPromoPersonalizada = false; 14 esPromoPersonalizada = false;
15 urlDeboSuite = APP_SETTINGS.apiDeboSuite; 15 urlDeboSuite = APP_SETTINGS.apiDeboSuite;
16 medioPago: number; 16 medioPago: number;
17 idComanda: number; 17 idComanda: number;
18 subTotal: number = 0; 18 subTotal = 0;
19 19
20 constructor( 20 constructor(
21 private http: HttpClient, 21 private http: HttpClient,
22 private clienteService: ClienteService, 22 private clienteService: ClienteService,
23 ) { } 23 ) { }
24 24
25 getById(id) { 25 getById(id) {
26 return this.http.get(`${this.urlDeboSuite}/articulos/${id}`); 26 return this.http.get(`${this.urlDeboSuite}/articulos/${id}`);
27 } 27 }
28 28
29 getAll() { 29 getAll() {
30 return this.http.get(`${this.urlDeboSuite}/articulos/`); 30 return this.http.get(`${this.urlDeboSuite}/articulos/`);
31 } 31 }
32 32
33 getAllWithPaginator(page: number = 1) { 33 getAllWithPaginator(page: number = 1) {
34 return this.http.get(`${this.urlDeboSuite}/articulos/${page}`); 34 return this.http.get(`${this.urlDeboSuite}/articulos/${page}`);
35 } 35 }
36 36
37 calcularTotal() { 37 calcularTotal() {
38 this.subTotal = 0; 38 this.subTotal = 0;
39 this.carrito.forEach(articulo => { 39 this.carrito.forEach(articulo => {
40 this.subTotal += (articulo.PreVen * articulo.cantidad); 40 this.subTotal += (articulo.PreVen * articulo.cantidad);
41 }); 41 });
42 } 42 }
43 43
44 setArticulo(articulo: IArticulo) { 44 setArticulo(articulo: IArticulo) {
45 for (const articuloCarrito of this.carrito) { 45 for (const articuloCarrito of this.carrito) {
46 if (articuloCarrito.id === articulo.id) { 46 if (articuloCarrito.id === articulo.id) {
47 if (articulo.PRO) break; 47 if (articulo.PRO) break;
48 articuloCarrito.cantidad++; 48 articuloCarrito.cantidad++;
49 return; 49 return;
50 } 50 }
51 } 51 }
52 this.setArticulosSinImagen([articulo]); 52 this.setArticulosSinImagen([articulo]);
53 this.carrito.unshift(articulo); 53 this.carrito.unshift(articulo);
54 this.calcularTotal(); 54 this.calcularTotal();
55 } 55 }
56 56
57 pay(dataPago: any) { 57 pay(dataPago: any) {
58 return new Observable((observer) => { 58 return new Observable((observer) => {
59 this.clienteService.getById(-1) 59 this.clienteService.getById(-1)
60 .subscribe(cliente => { 60 .subscribe(cliente => {
61 this.markArticuloInPromoAsRemoved(); 61 this.markArticuloInPromoAsRemoved();
62 this.http.post(`${this.urlDeboSuite}/comprobante/guardar/${this.medioPago}`, { 62 this.http.post(`${this.urlDeboSuite}/comprobante/guardar/${this.medioPago}`, {
63 productos: this.carrito, 63 productos: this.carrito,
64 cliente, 64 cliente,
65 origen: 'autoservicio', 65 origen: 'autoservicio',
66 codigoVendedor: 5, 66 codigoVendedor: 5,
67 puntoVenta: APP_SETTINGS.puntoVenta, 67 puntoVenta: APP_SETTINGS.puntoVenta,
68 pedidoAnombreDe: dataPago.pedidoAnombreDe, 68 pedidoAnombreDe: dataPago.pedidoAnombreDe,
69 numeroPlanilla: APP_SETTINGS.numeroPlanilla, 69 numeroPlanilla: APP_SETTINGS.numeroPlanilla,
70 }) 70 })
71 .subscribe((data) => { 71 .subscribe((data) => {
72 observer.next(data); 72 observer.next(data);
73 observer.complete(); 73 observer.complete();
74 }); 74 });
75 }); 75 });
76 }); 76 });
77 } 77 }
78 78
79 cleanShoppingCar() { 79 cleanShoppingCar() {
80 this.articuloAcargar = undefined; 80 this.articuloAcargar = undefined;
81 this.promoAcargar = undefined; 81 this.promoAcargar = undefined;
82 this.carrito = []; 82 this.carrito = [];
83 } 83 }
84 84
85 setArticulosSinImagen(articulos: IArticulo[]) { 85 setArticulosSinImagen(articulos: IArticulo[]) {
86 articulos.forEach((articulo: IArticulo) => { 86 articulos.forEach((articulo: IArticulo) => {
87 articulo.imagenes = !articulo.imagenes ? [{ imagen: 'noImage.jpg' }] : 87 articulo.imagenes = !articulo.imagenes ? [{ imagen: 'noImage.jpg' }] :
88 !articulo.imagenes.length ? [{ imagen: 'noImage.jpg' }] : articulo.imagenes; 88 !articulo.imagenes.length ? [{ imagen: 'noImage.jpg' }] : articulo.imagenes;
89 }); 89 });
90 } 90 }
91 91
92 markArticuloInPromoAsRemoved() { 92 markArticuloInPromoAsRemoved() {
93 this.carrito.forEach((articuloCarrito: IArticulo) => { 93 this.carrito.forEach((articuloCarrito: IArticulo) => {
94 if (articuloCarrito.PRO) { 94 if (articuloCarrito.PRO) {
95 articuloCarrito.productos.forEach((articulo: IArticulo) => { 95 articuloCarrito.productos.forEach((articulo: IArticulo) => {
96 if (articulo.cantidadAdicionada === 0) { 96 if (articulo.cantidadAdicionada === 0) {
97 articulo.cantidad = 0; 97 articulo.cantidad = 0;
98 articulo.importeValorExtra = 0; 98 articulo.importeValorExtra = 0;
99 } 99 }
100 }); 100 });
101 } 101 }
102 }); 102 });
103 } 103 }
104 } 104 }
105 105
src/app/services/categoria/categoria.service.ts
Diff comments   View file @ c5c1df3
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http'; 2 import { HttpClient } from '@angular/common/http';
3 import { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 4
5 @Injectable({ 5 @Injectable({
6 providedIn: 'root' 6 providedIn: 'root'
7 }) 7 })
8 export class CategoriaService { 8 export class CategoriaService {
9 urlDeboSuite = APP_SETTINGS.apiDeboSuite; 9 urlDeboSuite = APP_SETTINGS.apiDeboSuite;
10 10
11 constructor( 11 constructor(
12 private http: HttpClient, 12 private http: HttpClient,
13 ) { } 13 ) { }
14 14
15 getCategorias() { 15 getAll() {
16 return this.http.get(`${this.urlDeboSuite}/categorias`); 16 return this.http.get(`${this.urlDeboSuite}/categorias`);
17 } 17 }
18 } 18 }
19 19
src/app/services/comanda/comanda.service.ts
Diff comments   View file @ c5c1df3
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http'; 2 import { HttpClient } from '@angular/common/http';
3 import { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 import { IComanda } from 'src/app/interfaces/IComanda'; 4 import { IComanda } from 'src/app/interfaces/IComanda';
5 5
6 @Injectable({ 6 @Injectable({
7 providedIn: 'root' 7 providedIn: 'root'
8 }) 8 })
9 export class ComandaService { 9 export class ComandaService {
10 urlDeboSuite = APP_SETTINGS.apiDeboSuite; 10 urlDeboSuite = APP_SETTINGS.apiDeboSuite;
11 11
12 constructor( 12 constructor(
13 private http: HttpClient, 13 private http: HttpClient,
14 ) { } 14 ) { }
15 15
16 getPendientesEntrega() { 16 getPendientesEntrega() {
17 return this.http.get(`${this.urlDeboSuite}/comandas/pendientes-entrega`); 17 return this.http.get(`${this.urlDeboSuite}/comandas/pendientes-entrega`);
18 } 18 }
19 19
20 update(data: object) { 20 update(object: object) {
21 return this.http.post(`${this.urlDeboSuite}/comandas/update`, { data: data }); 21 return this.http.post(`${this.urlDeboSuite}/comandas/update`, { data: object });
22 } 22 }
23 23
24 getAll() { 24 getAll() {
25 return this.http.get(`${this.urlDeboSuite}/comandas`); 25 return this.http.get(`${this.urlDeboSuite}/comandas`);
26 } 26 }
27 27
28 imprimirComandaCocina(idComanda: number) { 28 imprimirComandaCocina(idComanda: number) {
29 return this.http.get(`${this.urlDeboSuite}/comandas/imprimir/${idComanda}`); 29 return this.http.get(`${this.urlDeboSuite}/comandas/imprimir/${idComanda}`);
30 } 30 }
31 31
32 startTimerComanda(comanda: IComanda, tipo: string) { 32 startTimerComanda(comanda: IComanda, tipo: string) {
33 let hours = 0; 33 let hours = 0;
34 let minutes = 0; 34 let minutes = 0;
35 let seconds = 0; 35 let seconds = 0;
36 comanda[`hours${tipo}`] = '0'; 36 comanda[`hours${tipo}`] = '0';
37 comanda[`seconds${tipo}`] = comanda[`minutes${tipo}`] = '00'; 37 comanda[`seconds${tipo}`] = comanda[`minutes${tipo}`] = '00';
38 comanda[`timer${tipo}`] = setInterval(() => { 38 comanda[`timer${tipo}`] = setInterval(() => {
39 seconds++; 39 seconds++;
40 comanda[`seconds${tipo}`] = seconds < 10 ? `0${seconds}` : seconds.toString(); 40 comanda[`seconds${tipo}`] = seconds < 10 ? `0${seconds}` : seconds.toString();
41 if (seconds === 60) { 41 if (seconds === 60) {
42 minutes++; 42 minutes++;
43 comanda[`minutes${tipo}`] = minutes < 10 ? `0${minutes}` : minutes.toString(); 43 comanda[`minutes${tipo}`] = minutes < 10 ? `0${minutes}` : minutes.toString();
44 seconds = 0; 44 seconds = 0;
45 comanda[`seconds${tipo}`] = '00'; 45 comanda[`seconds${tipo}`] = '00';
46 } 46 }
47 if (minutes === 60) { 47 if (minutes === 60) {
48 hours++; 48 hours++;
49 minutes = 0; 49 minutes = 0;
50 comanda[`hours${tipo}`] = hours.toString(); 50 comanda[`hours${tipo}`] = hours.toString();
51 comanda[`minutes${tipo}`] = '00'; 51 comanda[`minutes${tipo}`] = '00';
52 } 52 }
53 }, 1000); 53 }, 1000);
54 } 54 }
55 55
56 } 56 }
57 57
src/app/services/publicidad/publicidad.service.spec.ts
Diff comments   View file @ c5c1df3
File was created 1 import { TestBed } from '@angular/core/testing';
2
3 import { PublicidadService } from './publicidad.service';
4
5 describe('PublicidadService', () => {
6 beforeEach(() => TestBed.configureTestingModule({}));
7
8 it('should be created', () => {
9 const service: PublicidadService = TestBed.get(PublicidadService);
10 expect(service).toBeTruthy();
11 });
12 });
13
src/app/services/publicidad/publicidad.service.ts
Diff comments   View file @ c5c1df3
File was created 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http';
3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 import { IPublicidad } from 'src/app/interfaces/IPublicidad';
5
6 @Injectable({
7 providedIn: 'root'
8 })
9 export class PublicidadService {
10 urlDeboSuite = APP_SETTINGS.apiDeboSuite;
11 imagenes: any[] = [];
12
13 constructor(
14 private http: HttpClient,
15 ) { }
16
17 getAll() {
18 return this.http.get(`${this.urlDeboSuite}/publicidad`);
19 }
20
21 update(publicidad: IPublicidad) {
22 delete publicidad.DET_LAR;
23 return this.http.put(`${this.urlDeboSuite}/publicidad`, publicidad);
24 }
25
26 create(publicidad: IPublicidad) {
27 delete publicidad.DET_LAR;
28 return this.http.post(`${this.urlDeboSuite}/publicidad`, publicidad);
29 }
30
31 delete(id: any) {
32 return this.http.delete(`${this.urlDeboSuite}/publicidad/${id}`);
33 }
34 }
35
src/app/shared/header-publicidad/header-publicidad.component.html
Diff comments   View file @ c5c1df3
1 <div class="row mx-0 h-20"> 1 <div class="row mx-0 h-20">
2 <div class="col-12 p-3 h-100"> 2 <div class="col-12 p-3 h-100">
3 <div class="h-100"> 3 <div class="h-100">
4 <carousel [showIndicators]="false" [interval]="4000"> 4 <carousel [showIndicators]="false" [interval]="4000">
5 <slide> 5 <slide *ngFor="let p of publicidades">
6 <img 6 <img
7 class="d-block h-100 w-auto mx-auto" 7 class="d-block h-100 w-auto mx-auto"
8 draggable="false" 8 draggable="false"
9 ondragstart="return false;" 9 ondragstart="return false;"
10 (contextmenu)="false" 10 (contextmenu)="false"
11 src="{{urlImagenes}}spot-promos-combos-02.png"> 11 src="{{urlImagenes}}{{p.imagen}}"
12 </slide> 12 (click)="elegirArticulo(p)">
13 <slide>
14 <img
15 class="d-block h-100 w-auto mx-auto"
16 draggable="false"
17 ondragstart="return false;"
18 (contextmenu)="false"
19 src="{{urlImagenes}}spot-promos-combos-03.png">
20 </slide>
21 <slide>
22 <img
23 class="d-block h-100 w-auto mx-auto"
24 draggable="false"
25 ondragstart="return false;"
26 (contextmenu)="false"
27 src="{{urlImagenes}}spot-promos-combos-04.png">
28 </slide>
29 <slide>
30 <img
31 class="d-block h-100 w-auto mx-auto"
32 draggable="false"
33 ondragstart="return false;"
34 (contextmenu)="false"
35 src="{{urlImagenes}}spot-promos-combos-05.png">
36 </slide> 13 </slide>
37 </carousel> 14 </carousel>
38 </div> 15 </div>
39 </div> 16 </div>
40 </div> 17 </div>
41 18
src/app/shared/header-publicidad/header-publicidad.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } 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';
4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service';
5 import { IArticulo } from 'src/app/interfaces/IArticulo';
6 import { PromocionComponent } from '../promocion/promocion.component';
7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
8 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3 9
4 @Component({ 10 @Component({
5 selector: 'app-header-publicidad', 11 selector: 'app-header-publicidad',
6 templateUrl: './header-publicidad.component.html', 12 templateUrl: './header-publicidad.component.html',
7 styleUrls: ['./header-publicidad.component.scss'] 13 styleUrls: ['./header-publicidad.component.scss']
8 }) 14 })
9 export class HeaderPublicidadComponent implements OnInit { 15 export class HeaderPublicidadComponent implements OnInit {
10 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; 16 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
17 publicidades: IPublicidad[] = [];
18 modalRef: BsModalRef;
11 19
12 constructor() { } 20 constructor(
21 private publicidadService: PublicidadService,
22 private articuloService: ArticuloService,
23 private modalService: BsModalService,
24 ) { }
13 25
14 ngOnInit() { 26 ngOnInit() {
27 this.getPublicidades();
28 }
29
30 getPublicidades() {
31 this.publicidadService.getAll()
32 .subscribe((res: IPublicidad[]) => {
33 this.publicidades = res;
34 }, err => console.error(err));
35 }
36
37 elegirArticulo(publicidad: IPublicidad) {
38 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo);
39 }
40
41
42 getByID(id: number) {
43 this.articuloService.getById(id)
44 .subscribe((res: IArticulo) => {
45 if (res.FPP) {
46 this.openModalPromos(res);
47 return;
48 }
49 res.cantidad = 1;
50 this.articuloService.setArticulo(res);
51 }, err => console.error(err));
52 }
53
54 openModalPromos(articulo: IArticulo) {
55 this.modalRef = this.modalService.show(PromocionComponent,
56 {
57 initialState: {
58 idArticulo: articulo.id
59 },
60 class: 'modal-promo modal-dialog-centered'
61 });
15 } 62 }
16 63
17 } 64 }
18 65
src/app/shared/promocion/promocion.component.html
Diff comments   View file @ c5c1df3
1 <div class="p-3"> 1 <div class="modal-header bg-primary">
2 <div class="row mx-0 justify-content-end"> 2 <div class="col-12">
3 <div 3 <div class="row justify-content-between" *ngIf="articulosPromo.length">
4 class="col-auto px-0 btn-effect" 4 <div>
5 (click)="modalRef.hide()"> 5 <h3 class="ml-2 text-white mt-2">{{articulosPromo[0].DetArt}}</h3>
6 <img 6 </div>
7 draggable="false" 7 <div>
8 ondragstart="return false;" 8 <div
9 (contextmenu)="false" 9 class="row mr-3 justify-content-between bg-white badge-pill"
10 class="icon-30 rotate-45" 10 (click)="elegirPromo(articulosPromo[0])">
11 src="assets/img/mas-blanco.svg"> 11 <div class="col px-0 align-self-center text-primary">
12 </div> 12 <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p>
13 </div> 13 </div>
14 <div class="row mb-4 mx-0 text-center"> 14 <div class="col-3 px-0">
15 <div class="col-7 align-self-center"> 15 <img
16 <p class="h6 text-muted mb-2"><small>{{'ENSALADA CAESAR'}}</small></p> 16 draggable="false"
17 <p class="h6"><small>¿QUERÉS LLEVAR ESTA ENSALADA</small></p> 17 ondragstart="return false;"
18 <p class="h4 mb-2 font-weight-bold">en combo con 1 bebida?</p> 18 (contextmenu)="false"
19 <div class="row"> 19 class="d-block ml-auto py-1 icon-30 mr-2 pt-2"
20 <div class="col-6 pl-0"> 20 src="assets/img/ir-color.svg">
21 <div
22 class="row mx-0 justify-content-between bg-light badge-pill btn-effect">
23 <div class="col px-0 align-self-center text-primary">
24 <p class="d-block">
25 <small class="pr-2">{{'Sola'}} {{155 | currency}}</small>
26 <img
27 draggable="false"
28 ondragstart="return false;"
29 (contextmenu)="false"
30 class="icon-20"
31 src="assets/img/ir-color.svg">
32 </p>
33 </div>
34 </div> 21 </div>
35 </div> 22 </div>
36 <div class="col-6 px-0"> 23 </div>
37 <div 24 </div>
38 class="row mx-0 justify-content-between bg-light badge-pill btn-effect"> 25 </div>
39 <div class="col px-0 align-self-center text-primary"> 26 </div>
40 <p class="d-block"> 27 <div class="modal-body bg-primary" *ngIf="articulosPromo.length">
41 <small class="pr-2">{{'Con bebida'}} {{155 | currency}}</small> 28 <div class="row">
42 <img 29 <div class="col-9">
43 draggable="false" 30 <p class="text-white"><small>¿TE GUSTARÍA LLEVAR ESTE ARTÍCULO</small></p>
44 ondragstart="return false;" 31 <h1 class="text-white mb-4">en un combo?</h1>
45 (contextmenu)="false" 32 <div *ngFor="let promo of promociones">
46 class="icon-20" 33 <div class="mx-0 mb-2 bg-white badge-pill text-primary" (click)="elegirPromo(promo)">
47 src="assets/img/ir-color.svg"> 34 <div class="row mx-0 justify-content-between">
48 </p> 35 <p class="ml-4 text-truncate">{{promo.DetArt}}</p>
49 </div> 36 <p class="mr-4 font-weight-bold">{{promo.PreVen | currency}}</p>
50 </div> 37 </div>
51 </div> 38 </div>
52 </div> 39 </div>
53 </div> 40 </div>
54 <div class="col-5 align-self-center"> 41 <div class="col-3 rounded-circle">
55 <img 42 <img
56 draggable="false" 43 draggable="false"
57 ondragstart="return false;" 44 ondragstart="return false;"
58 (contextmenu)="false" 45 (contextmenu)="false"
59 class="icon-150 rounded-circle" 46 src="{{urlImagenes}}{{articulosPromo[0].imagenes[0].imagen}}"
60 src="assets/img/icono-volver.svg"> 47 onerror="this.src='assets/img/image-not-found.jpg'"
48 class="card-img-top img-fluid rounded-circle">
61 </div> 49 </div>
62 </div> 50 </div>
src/app/shared/promocion/promocion.component.ts
Diff comments   View file @ c5c1df3
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { BsModalRef } from 'ngx-bootstrap/modal'; 2 import { BsModalRef } from 'ngx-bootstrap/modal';
3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
5 import { PromocionService } from 'src/app/services/promocion/promocion.service';
6 import { Subject } from 'rxjs';
7 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 8
4 @Component({ 9 @Component({
5 selector: 'app-promocion', 10 selector: 'app-promocion',
6 templateUrl: './promocion.component.html', 11 templateUrl: './promocion.component.html',
7 styleUrls: ['./promocion.component.scss'] 12 styleUrls: ['./promocion.component.scss']
8 }) 13 })
9 export class PromocionComponent implements OnInit { 14 export class PromocionComponent implements OnInit {
15 idArticulo: number;
16 articulosPromo: IArticulo[] = [];
17 promociones: IArticulo[] = [];
18 onClose: Subject<any>;
19 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
10 20
11 constructor( 21 constructor(
12 public modalRef: BsModalRef, 22 public modalRef: BsModalRef,
13 ) { } 23 private articuloService: ArticuloService,
24 private promocionService: PromocionService,
25 ) {
26 this.onClose = new Subject();
27 }
14 28
15 ngOnInit() { 29 ngOnInit() {
30 this.articuloService.getById(this.idArticulo)
31 .subscribe((res: IArticulo) => {
32 this.articulosPromo[0] = res;
33 this.getPromociones();
34 }, err => console.error(err));
35 }
36
37 elegirPromo(promo: IArticulo) {
38 promo.cantidad = 1;
39 this.articuloService.setArticulo(promo);
40 this.modalRef.hide();
41 }
42
43 getPromociones() {
44 const sector = this.articulosPromo[0].CodSec;
45 const codigo = this.articulosPromo[0].CodArt;
46 this.promocionService.getPromociones(sector, codigo)
47 .subscribe((res: IArticulo[]) => {
48 this.promociones = res;
49 }, error => { console.error(error); });
16 } 50 }
17 51
18 } 52 }
19 53
src/scss/height-width.scss
Diff comments   View file @ c5c1df3
1 @for $i from 1 through 100 { 1 @for $i from 1 through 100 {
2 $heightValue: 1% * $i; 2 $heightValue: 1% * $i;
3 .h-#{$i} { 3 .h-#{$i} {
4 height: $heightValue !important; 4 height: $heightValue !important;
5 } 5 }
6 } 6 }
7 7
8 @for $i from 1 through 100 { 8 @for $i from 1 through 100 {
9 $widthValue: 1% * $i; 9 $widthValue: 1% * $i;
10 .w-#{$i} { 10 .w-#{$i} {
11 width: $widthValue !important; 11 width: $widthValue !important;
12 } 12 }
13 } 13 }
14
15 .min-h-50 {
16 min-height: 50px;
17 }
18
19 .min-h-60 {
20 min-height: 60px;
21 }
14 22
src/scss/styles-bootstrap.scss
Diff comments   View file @ c5c1df3
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 @import "node_modules/bootstrap/scss/bootstrap"; 43 .modal-promo > div {
44
45 .min-h-50 {
46 min-height: 50px;
47 }
48
49 .min-h-60 {
50 min-height: 60px;
51 }
52
53 .custom-modal > div > div {
54 background-color: $primary !important; 44 background-color: $primary !important;
55 border: none !important; 45 border: none !important;
56 border-radius: 10rem; 46 border-radius: 10rem;
57 margin-left: 10px !important; 47 margin-left: 10px !important;
58 } 48 }
49
1 { 1 {
2 "extends": "tslint:recommended", 2 "extends": "tslint:recommended",
3 "rules": { 3 "rules": {
4 "array-type": false, 4 "array-type": false,
5 "arrow-parens": false, 5 "arrow-parens": false,
6 "deprecation": { 6 "deprecation": {
7 "severity": "warning" 7 "severity": "warning"
8 }, 8 },
9 "component-class-suffix": true, 9 "component-class-suffix": true,
10 "contextual-lifecycle": true, 10 "contextual-lifecycle": true,
11 "curly": [ 11 "curly": [
12 true, 12 true,
13 "ignore-same-line" 13 "ignore-same-line"
14 ], 14 ],
15 "directive-class-suffix": true, 15 "directive-class-suffix": true,
16 "directive-selector": [ 16 "directive-selector": [
17 true, 17 true,
18 "attribute", 18 "attribute",
19 "app", 19 "app",
20 "camelCase" 20 "camelCase"
21 ], 21 ],
22 "component-selector": [ 22 "component-selector": [
23 true, 23 true,
24 "element", 24 "element",
25 "app", 25 "app",
26 "kebab-case" 26 "kebab-case"
27 ], 27 ],
28 "import-blacklist": [ 28 "import-blacklist": [
29 true, 29 true,
30 "rxjs/Rx" 30 "rxjs/Rx"
31 ], 31 ],
32 "interface-name": false, 32 "interface-name": false,
33 "max-classes-per-file": false, 33 "max-classes-per-file": false,
34 "max-line-length": [ 34 "max-line-length": [
35 true, 35 true,
36 140 36 140
37 ], 37 ],
38 "member-access": false, 38 "member-access": false,
39 "member-ordering": [ 39 "member-ordering": [
40 true, 40 true,
41 { 41 {
42 "order": [ 42 "order": [
43 "static-field", 43 "static-field",
44 "instance-field", 44 "instance-field",
45 "static-method", 45 "static-method",
46 "instance-method" 46 "instance-method"
47 ] 47 ]
48 } 48 }
49 ], 49 ],
50 "no-consecutive-blank-lines": false, 50 "no-consecutive-blank-lines": false,
51 "no-console": [ 51 "no-console": [
52 true, 52 true,
53 "debug", 53 "debug",
54 "info", 54 "info",
55 "time", 55 "time",
56 "timeEnd", 56 "timeEnd",
57 "trace", 57 "trace",
58 "log" 58 "log"
59 ], 59 ],
60 "no-empty": false, 60 "no-empty": false,
61 "no-inferrable-types": [ 61 "no-inferrable-types": [
62 true, 62 true,
63 "ignore-params" 63 "ignore-params"
64 ], 64 ],
65 "no-non-null-assertion": true, 65 "no-non-null-assertion": true,
66 "no-redundant-jsdoc": true, 66 "no-redundant-jsdoc": true,
67 "no-switch-case-fall-through": true, 67 "no-switch-case-fall-through": true,
68 "no-var-requires": false, 68 "no-var-requires": false,
69 "object-literal-key-quotes": [ 69 "object-literal-key-quotes": [
70 true, 70 true,
71 "as-needed" 71 "as-needed"
72 ], 72 ],
73 "variable-name": {
74 "options": [
75 "require-const-for-all-caps",
76 "ban-keywords",
77 "check-format",
78 "allow-leading-underscore",
79 "allow-snake-case",
80 "allow-pascal-case"
81 ]
82 },
73 "object-literal-sort-keys": false, 83 "object-literal-sort-keys": false,
74 "ordered-imports": false, 84 "ordered-imports": false,
75 "quotemark": [ 85 "quotemark": [
76 true, 86 true,
77 "single" 87 "single"
78 ], 88 ],
79 "trailing-comma": false, 89 "trailing-comma": false,
80 "no-conflicting-lifecycle": true, 90 "no-conflicting-lifecycle": true,
81 "no-host-metadata-property": true, 91 "no-host-metadata-property": true,
82 "no-input-rename": true, 92 "no-input-rename": true,
83 "no-inputs-metadata-property": true, 93 "no-inputs-metadata-property": true,
84 "no-output-native": true, 94 "no-output-native": true,
85 "no-output-on-prefix": true, 95 "no-output-on-prefix": true,
86 "no-output-rename": true, 96 "no-output-rename": true,
87 "no-outputs-metadata-property": true, 97 "no-outputs-metadata-property": true,
88 "template-banana-in-box": true, 98 "template-banana-in-box": true,
89 "template-no-negated-async": true, 99 "template-no-negated-async": true,
90 "use-lifecycle-interface": true, 100 "use-lifecycle-interface": true,
91 "use-pipe-transform-interface": true 101 "use-pipe-transform-interface": true
92 }, 102 },
93 "rulesDirectory": [ 103 "rulesDirectory": [
94 "codelyzer" 104 "codelyzer"
95 ] 105 ]
96 } 106 }