Compare View

switch
from
...
to
 
Commits (19)
1 { 1 {
2 "name": "autoservicio", 2 "name": "autoservicio",
3 "version": "0.0.0", 3 "version": "0.0.0",
4 "scripts": { 4 "scripts": {
5 "ng": "ng", 5 "ng": "ng",
6 "start": "ng serve --port 4202 --host 0.0.0.0", 6 "start": "ng serve --port 4202 --host 0.0.0.0",
7 "build": "ng build", 7 "build": "ng build",
8 "test": "ng test", 8 "test": "ng test",
9 "lint": "ng lint", 9 "lint": "ng lint",
10 "e2e": "ng e2e" 10 "e2e": "ng e2e"
11 }, 11 },
12 "private": true, 12 "private": true,
13 "dependencies": { 13 "dependencies": {
14 "@angular/animations": "^8.2.3", 14 "@angular/animations": "^8.2.3",
15 "@angular/cdk": "^8.1.3", 15 "@angular/cdk": "^8.1.3",
16 "@angular/common": "~8.0.0", 16 "@angular/common": "~8.0.0",
17 "@angular/compiler": "~8.0.0", 17 "@angular/compiler": "~8.0.0",
18 "@angular/core": "~8.0.0", 18 "@angular/core": "~8.0.0",
19 "@angular/forms": "~8.0.0", 19 "@angular/forms": "~8.0.0",
20 "@angular/material": "^8.1.3", 20 "@angular/material": "^8.1.3",
21 "@angular/platform-browser": "~8.0.0", 21 "@angular/platform-browser": "~8.0.0",
22 "@angular/platform-browser-dynamic": "~8.0.0", 22 "@angular/platform-browser-dynamic": "~8.0.0",
23 "@angular/router": "~8.0.0", 23 "@angular/router": "~8.0.0",
24 "@ngx-material-keyboard/core": "^0.1.1", 24 "@ngx-material-keyboard/core": "^0.1.1",
25 "bootstrap": "^4.3.1", 25 "bootstrap": "^4.3.1",
26 "font-awesome": "^4.7.0", 26 "font-awesome": "^4.7.0",
27 "hammerjs": "^2.0.8", 27 "hammerjs": "^2.0.8",
28 "jquery": "^1.12.4", 28 "jquery": "^1.12.4",
29 "lodash": "^4.17.15", 29 "lodash": "^4.17.15",
30 "material-design-icons": "^3.0.1", 30 "material-design-icons": "^3.0.1",
31 "ngx-bootstrap": "^5.1.1", 31 "ngx-bootstrap": "^5.1.1",
32 "popper.js": "^1.15.0", 32 "popper.js": "^1.15.0",
33 "rxjs": "~6.4.0", 33 "rxjs": "~6.4.0",
34 "rxjs-compat": "^6.5.2", 34 "rxjs-compat": "^6.5.2",
35 "simple-keyboard": "^2.26.2", 35 "simple-keyboard": "^2.26.2",
36 "tslib": "^1.9.0", 36 "tslib": "^1.9.0",
37 "zone.js": "~0.9.1" 37 "zone.js": "~0.9.1"
38 }, 38 },
39 "devDependencies": { 39 "devDependencies": {
40 "@angular-devkit/build-angular": "~0.800.0", 40 "@angular-devkit/build-angular": "~0.800.0",
41 "@angular/cli": "^8.3.2", 41 "@angular/cli": "^8.3.2",
42 "@angular/compiler-cli": "~8.0.0", 42 "@angular/compiler-cli": "~8.0.0",
43 "@angular/language-service": "~8.0.0", 43 "@angular/language-service": "~8.0.0",
44 "@types/jasmine": "~3.3.8", 44 "@types/jasmine": "~3.3.8",
45 "@types/jasminewd2": "~2.0.3", 45 "@types/jasminewd2": "~2.0.3",
46 "@types/lodash": "^4.14.138", 46 "@types/lodash": "^4.14.138",
47 "@types/node": "~8.9.4", 47 "@types/node": "~8.9.4",
48 "codelyzer": "^5.0.0", 48 "codelyzer": "^5.0.0",
49 "jasmine-core": "~3.4.0", 49 "jasmine-core": "~3.4.0",
50 "jasmine-spec-reporter": "~4.2.1", 50 "jasmine-spec-reporter": "~4.2.1",
51 "karma": "~4.1.0", 51 "karma": "~4.1.0",
52 "karma-chrome-launcher": "~2.2.0", 52 "karma-chrome-launcher": "~2.2.0",
53 "karma-coverage-istanbul-reporter": "~2.0.1", 53 "karma-coverage-istanbul-reporter": "~2.0.1",
54 "karma-jasmine": "~2.0.1", 54 "karma-jasmine": "~2.0.1",
55 "karma-jasmine-html-reporter": "^1.4.0", 55 "karma-jasmine-html-reporter": "^1.4.0",
56 "protractor": "~5.4.0", 56 "protractor": "~5.4.0",
57 "ts-node": "~7.0.0", 57 "ts-node": "~7.0.0",
58 "tslint": "~5.15.0", 58 "tslint": "~5.15.0",
59 "typescript": "~3.4.3" 59 "typescript": "~3.4.3"
60 } 60 }
61 } 61 }
62 62
src/app/components/busqueda-productos/busqueda-productos.component.ts
1 import { Component, OnInit, EventEmitter } from '@angular/core'; 1 import { Component, OnInit, EventEmitter } from '@angular/core';
2 import { ProductoService } from 'src/app/services/producto.service'; 2 import { ProductoService } from 'src/app/services/producto.service';
3 import { Producto } from 'src/app/wrappers/producto'; 3 import { Producto } from 'src/app/wrappers/producto';
4 import { Categoria } from 'src/app/wrappers/categoria'; 4 import { Categoria } from 'src/app/wrappers/categoria';
5 import { APP_SETTINGS } from 'src/etc/AppSettings'; 5 import { APP_SETTINGS } from 'src/etc/AppSettings';
6 import { Router } from '@angular/router'; 6 import { Router } from '@angular/router';
7 7
8 @Component({ 8 @Component({
9 selector: 'app-busqueda-productos', 9 selector: 'app-busqueda-productos',
10 templateUrl: './busqueda-productos.component.html', 10 templateUrl: './busqueda-productos.component.html',
11 styleUrls: ['./busqueda-productos.component.scss'] 11 styleUrls: ['./busqueda-productos.component.scss']
12 }) 12 })
13 export class BusquedaProductosComponent implements OnInit { 13 export class BusquedaProductosComponent implements OnInit {
14 14
15 private productos: Producto[] = []; 15 private productos: Producto[] = [];
16 private auxProductos: Producto[] = []; 16 private auxProductos: Producto[] = [];
17 private searchTerm: string = ''; 17 private searchTerm: string = '';
18 private categoriaActive: number = null; 18 private categoriaActive: number = null;
19 private showSpinner: boolean = true; 19 private showSpinner: boolean = true;
20 private queMostrar: string = 'todos'; 20 private queMostrar: string = 'todos';
21 private apiImagenes: string = APP_SETTINGS.apiImagenes; 21 private apiImagenes: string = APP_SETTINGS.apiImagenes;
22 private categorias: Categoria[] = []; 22 private categorias: Categoria[] = [];
23 private blurFocus = new EventEmitter(); 23 private blurFocus = new EventEmitter();
24 private ordenandoByVendidos = true; 24 private ordenandoByVendidos = true;
25 private title: string = 'Búsqueda' 25 private title: string = 'Búsqueda'
26 26
27 constructor( 27 constructor(
28 private productoService: ProductoService, 28 private productoService: ProductoService,
29 private router: Router) { } 29 private router: Router) { }
30 30
31 ngOnInit() { 31 ngOnInit() {
32 32
33 this.queMostrar = this.productoService.mostrar; 33 this.queMostrar = this.productoService.mostrar;
34 34
35 this.productoService.getCategorias() 35 this.productoService.getCategorias()
36 .subscribe((categorias: Categoria[]) => { 36 .subscribe((categorias: Categoria[]) => {
37 37
38 switch (this.queMostrar) { 38 switch (this.queMostrar) {
39 case 'todos': 39 case 'todos':
40 this.categorias = categorias; 40 this.categorias = categorias;
41 this.categoriaActive = 0; 41 this.categoriaActive = 0;
42 this.title = 'Búsqueda'; 42 this.title = 'Búsqueda';
43 break; 43 break;
44 case 'promociones': 44 case 'promociones':
45 this.categorias = categorias; 45 this.categorias = categorias;
46 this.categoriaActive = 1; 46 this.categoriaActive = 1;
47 this.title = 'Promociones'; 47 this.title = 'Promociones';
48 break; 48 break;
49 case 'ordenar': 49 case 'ordenar':
50 this.categorias = categorias.filter((categoria: Categoria) => { 50 this.categorias = categorias.filter((categoria: Categoria) => {
51 return categoria.ES_PEDIDO; 51 return categoria.ES_PEDIDO;
52 }); 52 });
53 this.categoriaActive = 0; 53 this.categoriaActive = 0;
54 this.title = 'Ordenar'; 54 this.title = 'Ordenar';
55 break; 55 break;
56 default: 56 default:
57 this.categorias = categorias; 57 this.categorias = categorias;
58 this.categoriaActive = 0; 58 this.categoriaActive = 0;
59 this.title = 'Búsqueda'; 59 this.title = 'Búsqueda';
60 break; 60 break;
61 } 61 }
62 }); 62 });
63 63
64 this.productoService.productoAcargar = undefined; 64 this.productoService.productoAcargar = undefined;
65 this.productoService.getAll() 65 this.productoService.getAll()
66 .subscribe((data: Producto[]) => { 66 .subscribe((data: Producto[]) => {
67 67
68 this.setProductosSinImagen(data); 68 this.setProductosSinImagen(data);
69 69
70 if (this.queMostrar == 'ordenar') { 70 if (this.queMostrar == 'ordenar') {
71 71
72 this.categorias.forEach((categoria: Categoria) => { 72 this.categorias.forEach((categoria: Categoria) => {
73 73
74 let tempProductos = data.filter((producto: Producto) => { 74 let tempProductos = data.filter((producto: Producto) => {
75 return producto.categoria_selfservice == categoria.id; 75 return producto.categoria_selfservice == categoria.id;
76 }); 76 });
77 77
78 this.productos = this.productos.concat(tempProductos); 78 this.productos = this.productos.concat(tempProductos);
79 79
80 }); 80 });
81 } else { 81 } else {
82 this.productos = data; 82 this.productos = data;
83 } 83 }
84 this.filterItems(); 84 this.filterItems();
85 }, (error) => { 85 }, (error) => {
86 this.showSpinner = false; 86 this.showSpinner = false;
87 console.error(error); 87 console.error(error);
88 }); 88 });
89 } 89 }
90 90
91 filterItems() { 91 filterItems() {
92 92
93 this.auxProductos = this.productos.filter(x => { 93 this.auxProductos = this.productos.filter(x => {
94 if (this.categoriaActive === 0) { 94 if (this.categoriaActive === 0) {
95 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()); 95 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase());
96 } 96 }
97 else { 97 else {
98 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) && 98 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) &&
99 x.categoria_selfservice === this.categoriaActive; 99 x.categoria_selfservice === this.categoriaActive;
100 } 100 }
101 }); 101 });
102 102
103 this.ordenar(); 103 this.ordenar();
104 104
105 } 105 }
106 106
107 agregarAlCarrito(producto: Producto) { 107 agregarAlCarrito(producto: Producto) {
108 108
109 producto.cantidad = 1; 109 producto.cantidad = 1;
110 this.productoService.productos.push(producto); 110 this.productoService.productos.push(producto);
111 } 111 }
112 112
113 ordenar() { 113 ordenar() {
114 114
115 if (this.ordenandoByVendidos) { 115 if (this.ordenandoByVendidos) {
116 116
117 this.auxProductos.sort((a, b) => { 117 this.auxProductos.sort((a, b) => {
118 return b.cantidadVendida - a.cantidadVendida; 118 return b.cantidadVendida - a.cantidadVendida;
119 }); 119 });
120 } 120 }
121 121
122 } 122 }
123 123
124 private elegirProducto(producto: Producto) { 124 private elegirProducto(producto: Producto) {
125 125
126 if (producto.PRO) { 126 if (producto.PRO) {
127 127
128 let imagenes = producto.imagenes; 128 let imagenes = producto.imagenes;
129 this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt) 129 this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)
130 .subscribe(res => { 130 .subscribe(res => {
131 131
132 this.productoService.productoAcargar = res[0]; 132 this.productoService.productoAcargar = res[0];
133 this.productoService.productoAcargar.imagenes = imagenes; 133 this.productoService.productoAcargar.imagenes = imagenes;
134 this.router.navigate(['inicio']); 134 this.router.navigate(['inicio']);
135 }, 135 },
136 error => { console.error(error); } 136 error => { console.error(error); }
137 ); 137 );
138 } else { 138 } else {
139 139
140 this.productoService.productoAcargar = producto; 140 this.productoService.productoAcargar = producto;
141 this.router.navigate(['inicio']); 141 this.router.navigate(['inicio']);
142 } 142 }
143 143
144 } 144 }
145 145
146 private setProductosSinImagen(productos: Producto[]) { 146 private setProductosSinImagen(productos: Producto[]) {
147 147
148 productos.forEach((producto: Producto) => { 148 productos.forEach((producto: Producto) => {
149 producto.imagenes = producto.imagenes.length == 0 ? 149 producto.imagenes = producto.imagenes.length == 0 ?
150 [{ imagen: 'noImage.jpg' }] : producto.imagenes; 150 [{ imagen: 'noImage.jpg' }] : producto.imagenes;
151 }) 151 })
152 } 152 }
153 } 153 }
154 154
src/app/components/cancelar-compra/cancelar-compra.component.ts
1 import { Component, OnInit, OnDestroy } from '@angular/core'; 1 import { Component, OnInit, OnDestroy } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { Location } from '@angular/common'; 3 import { Location } from '@angular/common';
4 import { Router } from '@angular/router'; 4 import { Router } from '@angular/router';
5 import { ProductoService } from 'src/app/services/producto.service'; 5 import { ProductoService } from 'src/app/services/producto.service';
6 6
7 @Component({ 7 @Component({
8 selector: 'app-cancelar-compra', 8 selector: 'app-cancelar-compra',
9 templateUrl: './cancelar-compra.component.html', 9 templateUrl: './cancelar-compra.component.html',
10 styleUrls: ['./cancelar-compra.component.scss'] 10 styleUrls: ['./cancelar-compra.component.scss']
11 }) 11 })
12 export class CancelarCompraComponent implements OnInit, OnDestroy { 12 export class CancelarCompraComponent implements OnInit, OnDestroy {
13 13
14 private apiImagenes: string = APP_SETTINGS.apiImagenes; 14 private apiImagenes: string = APP_SETTINGS.apiImagenes;
15 private timer: any; 15 private timer: any;
16 16
17 constructor( 17 constructor(
18 private location: Location, 18 private location: Location,
19 private router: Router, 19 private router: Router,
20 private productoService: ProductoService 20 private productoService: ProductoService
21 ) { } 21 ) { }
22 22
23 ngOnInit() { 23 ngOnInit() {
24 24
25 this.timer = setTimeout(() => { 25 this.timer = setTimeout(() => {
26 this.limpiarCarritoYvolver(); 26 this.limpiarCarritoYvolver();
27 }, 30000) 27 }, 30000)
28 } 28 }
29 29
30 ngOnDestroy() { 30 ngOnDestroy() {
31 31
32 clearTimeout(this.timer); 32 clearTimeout(this.timer);
33 } 33 }
34 34
35 volverPreviousPage() { 35 volverPreviousPage() {
36 36
37 this.location.back(); 37 this.location.back();
38 } 38 }
39 39
40 limpiarCarritoYvolver() { 40 limpiarCarritoYvolver() {
41 41
42 this.productoService.productoAcargar = undefined; 42 this.productoService.productoAcargar = undefined;
43 this.productoService.promoAcargar = undefined; 43 this.productoService.promoAcargar = undefined;
44 this.productoService.productos = []; 44 this.productoService.productos = [];
45 this.router.navigate(['/home']); 45 this.router.navigate(['/home']);
46 } 46 }
47 47
48 } 48 }
49 49
src/app/components/configuracion/configuracion.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { BsModalRef } from 'ngx-bootstrap'; 2 import { BsModalRef } from 'ngx-bootstrap';
3 import { PuntoVentaService } from 'src/app/services/punto-venta.service'; 3 import { PuntoVentaService } from 'src/app/services/punto-venta.service';
4 import { PuntoVenta } from 'src/app/wrappers/puntoVenta'; 4 import { PuntoVenta } from 'src/app/wrappers/puntoVenta';
5 import { ImpresoraService } from 'src/app/services/impresora.service'; 5 import { ImpresoraService } from 'src/app/services/impresora.service';
6 import { Impresora } from 'src/app/wrappers/impresora'; 6 import { Impresora } from 'src/app/wrappers/impresora';
7 import { FormGroup, FormControl } from '@angular/forms'; 7 import { FormGroup, FormControl } from '@angular/forms';
8 import { Router } from '@angular/router';
8 import { Router } from '@angular/router'; 9
9 10 @Component({
10 @Component({ 11 selector: 'app-configuracion',
11 selector: 'app-configuracion', 12 templateUrl: './configuracion.component.html',
12 templateUrl: './configuracion.component.html', 13 styleUrls: ['./configuracion.component.scss']
13 styleUrls: ['./configuracion.component.scss'] 14 })
14 }) 15 export class ConfiguracionComponent implements OnInit {
15 export class ConfiguracionComponent implements OnInit { 16
16 17 puntosVenta: PuntoVenta[] = [];
17 puntosVenta: PuntoVenta[] = []; 18 impresoras: Impresora[] = [];
18 impresoras: Impresora[] = []; 19 form: FormGroup;
20 reiniciar: boolean = false;
19 form: FormGroup; 21
20 reiniciar: boolean = false; 22 constructor(
21 23 private activeModal: BsModalRef,
22 constructor( 24 private puntoVentaService: PuntoVentaService,
23 private activeModal: BsModalRef, 25 private impresoraService: ImpresoraService,
26 private router: Router
24 private puntoVentaService: PuntoVentaService, 27 ) { }
25 private impresoraService: ImpresoraService, 28
26 private router: Router 29 ngOnInit() {
27 ) { } 30
28 31 this.form = new FormGroup({
29 ngOnInit() { 32 usePlanillaPropia: new FormControl(false, []),
30 33 puntoVenta: new FormControl(null, []),
31 this.form = new FormGroup({ 34 impresora: new FormControl(null, []),
32 usePlanillaPropia: new FormControl(false, []), 35 })
33 puntoVenta: new FormControl(null, []), 36
34 impresora: new FormControl(null, []), 37 this.puntoVentaService.getAll()
35 }) 38 .subscribe((res: PuntoVenta[]) => {
36 39
37 this.puntoVentaService.getAll() 40 this.puntosVenta = res;
38 .subscribe((res: PuntoVenta[]) => { 41 this.setPuntoVenta();
39 42 }, console.error);
40 this.puntosVenta = res; 43
41 this.setPuntoVenta(); 44 this.impresoraService.getAll()
42 }, console.error); 45 .subscribe((res: Impresora[]) => {
43 46
44 this.impresoraService.getAll() 47 this.impresoras = res;
45 .subscribe((res: Impresora[]) => { 48 this.setImpresora();
46 49 }, console.error);
47 this.impresoras = res; 50
48 this.setImpresora(); 51 }
49 }, console.error); 52
50 53 close() {
51 } 54
52 55 this.activeModal.hide();
56 if (this.reiniciar) {
57 this.router.navigate(['inicio']);
58 }
53 close() { 59 }
54 60
55 this.activeModal.hide(); 61 acept() {
62 this.reiniciar = !localStorage.getItem('impresoraPVE') ? true : false;
56 if (this.reiniciar) { 63
57 this.router.navigate(['inicio']); 64 let auxPuntoVenta = this.puntosVenta.find(p => p.ID === this.form.get('puntoVenta').value);
58 } 65 let auxImpresora = this.impresoras.find(p => p.PVE === this.form.get('impresora').value);
59 } 66 localStorage.setItem('pve', auxPuntoVenta ? auxPuntoVenta.ID.toString() : null);
60 67 localStorage.setItem('impresoraPVE', auxImpresora ? auxImpresora.PVE.toString() : null);
61 acept() { 68 this.close();
62 this.reiniciar = !localStorage.getItem('impresoraPVE') ? true : false; 69 }
63 70
64 let auxPuntoVenta = this.puntosVenta.find(p => p.ID === this.form.get('puntoVenta').value); 71 setPuntoVenta() {
65 let auxImpresora = this.impresoras.find(p => p.PVE === this.form.get('impresora').value); 72
66 localStorage.setItem('pve', auxPuntoVenta ? auxPuntoVenta.ID.toString() : null); 73 let pve = parseInt(localStorage.getItem('pve'));
67 localStorage.setItem('impresoraPVE', auxImpresora ? auxImpresora.PVE.toString() : null); 74 let auxPuntoVenta = this.puntosVenta.find(x => x.ID === pve);
68 this.close(); 75 this.form.get('puntoVenta').setValue(auxPuntoVenta ? auxPuntoVenta.ID : null);
69 } 76 }
70 77
71 setPuntoVenta() { 78 setImpresora() {
72 79
73 let pve = parseInt(localStorage.getItem('pve')); 80 let impresoraPVE = parseInt(localStorage.getItem('impresoraPVE'));
74 let auxPuntoVenta = this.puntosVenta.find(x => x.ID === pve); 81 let auxImpresora = this.impresoras.find(x => x.PVE === impresoraPVE);
75 this.form.get('puntoVenta').setValue(auxPuntoVenta ? auxPuntoVenta.ID : null); 82 this.form.get('impresora').setValue(auxImpresora ? auxImpresora.PVE : null);
76 } 83 }
77 84
78 setImpresora() { 85 }
79 86
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
1 <div 1 <div
2 *ngIf="!compraConEfectivofinalizada && !compraConQRfinalizada" 2 *ngIf="!compraConEfectivofinalizada && !compraConQRfinalizada"
3 class="row m-0 fade-in bg-primary-gradient disable-user-select" 3 class="row m-0 fade-in bg-primary-gradient disable-user-select"
4 (click)="reiniciarTimer()"> 4 (click)="reiniciarTimer()">
5 <div class="col-12 p-0 vh-100"> 5 <div class="col-12 p-0 vh-100">
6 <!-- TOP HEADER --> 6 <!-- TOP HEADER -->
7 <app-header></app-header> 7 <app-header></app-header>
8 8
9 <!-- NOMBRE DE SECCION --> 9 <!-- NOMBRE DE SECCION -->
10 <div class="row m-0"> 10 <div class="row m-0">
11 <div class="col-12 p-0"> 11 <div class="col-12 p-0">
12 <p class="h5 py-1 bg-gray text-muted text-center m-0"> 12 <p class="h5 py-1 bg-gray text-muted text-center m-0">
13 &nbsp; 13 &nbsp;
14 </p> 14 </p>
15 </div> 15 </div>
16 </div> 16 </div>
17 17
18 <div class="row m-0"> 18 <div class="row m-0">
19 <div class="col-10 px-1"> 19 <div class="col-10 px-1">
20 <!-- TEXTO DE IZQUIERDA --> 20 <!-- TEXTO DE IZQUIERDA -->
21 <div *ngIf="!verQR" class="row mx-2 mt-4 text-white"> 21 <div *ngIf="!verQR" class="row mx-2 mt-4 text-white">
22 <div class="col-sm-auto my-auto"> 22 <div class="col-sm-auto my-auto">
23 <p class="h2">Mi Compra 23 <p class="h2">Mi Compra
24 <i class="fa fa-shopping-cart "></i> 24 <i class="fa fa-shopping-cart "></i>
25 </p> 25 </p>
26 </div> 26 </div>
27 <div class="col-sm-9 my-auto"> 27 <div class="col-sm-9 my-auto">
28 <p class="h4">Por favor, controle y confirme su compra.</p> 28 <p class="h4">Por favor, controle y confirme su compra.</p>
29 </div> 29 </div>
30 <label for="customLabel" class="col-auto font-weight-bold h4 m-0"> 30 <label for="customLabel" class="col-auto font-weight-bold h4 m-0">
31 Pedido a nombre de: 31 Pedido a nombre de:
32 </label> 32 </label>
33 <div class="col-12 col-sm-6 col-md-5 col-lg-5"> 33 <div class="col-12 col-sm-6 col-md-5 col-lg-5">
34 <input 34 <input
35 [matKeyboard]="'spanish'"
35 [matKeyboard]="'spanish'" 36 type="text"
36 type="text" 37 class="form-control text-center"
37 class="form-control text-center" 38 id="customLabel"
38 id="customLabel" 39 maxlength="24"
39 maxlength="24" 40 [(ngModel)]="pedidoAnombreDe"
40 [(ngModel)]="pedidoAnombreDe" 41 autofocus
41 autofocus 42 >
42 > 43 </div>
43 </div> 44 </div>
44 </div> 45
45 46 <div [ngClass]="{'mt-5': verQR}" class="row m-0">
46 <div [ngClass]="{'mt-5': verQR}" class="row m-0"> 47 <!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
47 <!-- GRILLA DE PRODUCTOS DE MI COMPRA --> 48 <div *ngIf="!verQR" class="col-sm-9 pr-1">
48 <div *ngIf="!verQR" class="col-sm-9 pr-1"> 49 <div class="row mx-1 pr-1 vh-70 overflow-scroll text-dark">
49 <div class="row mx-1 pr-1 vh-70 overflow-scroll text-dark"> 50 <div class="mh-100 col-4 p-2" *ngFor="let producto of productos">
50 <div class="mh-100 col-4 p-2" *ngFor="let producto of productos"> 51 <div class="row m-0 h-100 bg-white rounded-sm shadow border-0">
51 <div class="row m-0 h-100 bg-white rounded-sm shadow border-0"> 52 <div class="d-flex align-items-end flex-column">
52 <div class="d-flex align-items-end flex-column"> 53 <div class="w-100">
53 <div class="w-100"> 54 <img
54 <img 55 src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}"
55 src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}" 56 class="shadow rounded-sm w-100 m-auto">
56 class="shadow rounded-sm w-100 m-auto"> 57 </div>
57 </div> 58 <div class="w-100 pt-2 px-2">
58 <div class="w-100 pt-2 px-2"> 59 <p class="h6 text-left">
59 <p class="h6 text-left"> 60 <small class="font-weight-bold">
60 <small class="font-weight-bold"> 61 {{producto.DET_LAR}}
61 {{producto.DET_LAR}} 62 </small>
62 </small> 63 </p>
63 </p> 64 <div *ngIf="producto.tieneSinonimos">
64 <div *ngIf="producto.tieneSinonimos"> 65 <p *ngFor="let p of producto.productos" class="h6 text-left m-0">
65 <p *ngFor="let p of producto.productos" class="h6 text-left m-0"> 66 <small>
66 <small> 67 - {{p.cantidad * producto.cantidad}} {{p.DET_LAR}}
67 - {{producto.cantidad}} {{p.DET_LAR}} 68 </small>
68 </small> 69 </p>
69 </p> 70 </div>
70 </div> 71 </div>
71 </div> 72 <div class="w-100 d-flex justify-content-between mt-auto mb-1 px-2">
72 <div class="w-100 d-flex justify-content-between mt-auto mb-1 px-2"> 73 <span class="text-left m-0 px-1 h6">
73 <span class="text-left m-0 px-1 h6"> 74 {{producto.cantidad}} x {{producto.PreVen | currency}}
74 {{producto.cantidad}} x {{producto.PreVen | currency}} 75 </span>
75 </span> 76 <span class="text-right m-0 px-1 h6">
76 <span class="text-right m-0 px-1 h6"> 77 {{producto.cantidad * producto.PreVen | currency}}
77 {{producto.cantidad * producto.PreVen | currency}} 78 </span>
78 </span> 79 </div>
79 </div> 80 </div>
80 </div> 81 </div>
81 </div> 82 </div>
82 </div> 83 </div>
83 </div> 84 </div>
84 </div> 85
85 86 <!-- CODIGO QR -->
86 <!-- CODIGO QR --> 87 <div *ngIf="verQR" class="col-sm-9">
87 <div *ngIf="verQR" class="col-sm-9"> 88 <div class="col-6 offset-3 border-0 mb-auto">
88 <div class="col-6 offset-3 border-0 mb-auto"> 89 <img
89 <img 90 src="../../../assets/img/qrmp.jpg"
90 src="../../../assets/img/qrmp.jpg" 91 class="w-100 mx-auto d-block shadow rounded-sm">
91 class="w-100 mx-auto d-block shadow rounded-sm"> 92 </div>
92 </div> 93 </div>
93 </div> 94
94 95 <!-- TICKET -->
95 <!-- TICKET --> 96 <div class="col-sm-3 px-1">
96 <div class="col-sm-3 px-1"> 97 <div class="card shadow">
97 <div class="card shadow"> 98 <div class="card-body">
98 <div class="card-body"> 99 <p class="h5 card-title">Su Ticket</p>
99 <p class="h5 card-title">Su Ticket</p> 100 <div class="row mt-4 m-0">
100 <div class="row mt-4 m-0"> 101 <div class="col-12 p-0 mb-2">
101 <div class="col-12 p-0 mb-2"> 102 <p class="h6 m-0 card-text text-left">
102 <p class="h6 m-0 card-text text-left"> 103 <small class="font-weight-bold">DESCRIPCIÓN</small>
103 <small class="font-weight-bold">DESCRIPCIÓN</small> 104 </p>
104 </p> 105 <p class="h6 m-0 card-text text-left">
105 <p class="h6 m-0 card-text text-left"> 106 <small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
106 <small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small> 107 </p>
107 </p> 108 </div>
108 </div> 109 </div>
109 </div> 110 <div class="row vh-50 px-2 overflow-scroll m-0">
110 <div class="row vh-50 px-2 overflow-scroll m-0"> 111 <div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
111 <div class="col-12 p-0 mb-2" *ngFor="let producto of productos"> 112 <p class="h6 m-0 card-text text-left">
112 <p class="h6 m-0 card-text text-left"> 113 <small>{{producto.DET_LAR}}</small>
113 <small>{{producto.DET_LAR}}</small> 114 </p>
114 </p> 115 <div class="row d-flex justify-content-between m-0">
115 <div class="row d-flex justify-content-between m-0"> 116 <div class="col p-0">
116 <div class="col p-0"> 117 <p class="h6 m-0 card-text text-left">
117 <p class="h6 m-0 card-text text-left"> 118 <small>{{producto.cantidad}} x {{producto.PreVen | currency}}</small>
118 <small>{{producto.cantidad}} x {{producto.PreVen | currency}}</small> 119 </p>
119 </p> 120 </div>
120 </div> 121 <div class="col p-0">
121 <div class="col p-0"> 122 <p class="h6 m-0 card-text text-right">
122 <p class="h6 m-0 card-text text-right"> 123 <small>{{(producto.PreVen) * (producto.cantidad) | currency}}</small>
123 <small>{{(producto.PreVen) * (producto.cantidad) | currency}}</small> 124 </p>
124 </p> 125 </div>
125 </div> 126 </div>
126 </div> 127 </div>
127 </div> 128 </div>
128 </div> 129 <p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
129 <p class="h4 font-weight-bold card-text text-right mt-3 mb-0"> 130 Total {{getTotal() | currency}}
130 Total {{getTotal() | currency}} 131 </p>
131 </p> 132 </div>
132 </div> 133 </div>
133 </div> 134 </div>
134 </div> 135 </div>
135 </div> 136
136 137 <!-- OPCIONES ABAJO DERECHA -->
137 <!-- OPCIONES ABAJO DERECHA --> 138 <div class="row m-0 fixed-bottom">
138 <div class="row m-0 fixed-bottom"> 139 <div class="col-sm-2 offset-sm-10 p-0 mt-auto">
139 <div class="col-sm-2 offset-sm-10 p-0 mt-auto"> 140 <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
140 <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0"> 141 <div class="card-body row m-0 p-1">
141 <div class="card-body row m-0 p-1"> 142 <div class="col-12 p-3">
142 <div class="col-12 p-3"> 143 <button
143 <button 144 type="button"
144 type="button" 145 class="btn btn-block btn-light shadow btn-sm shadow"
145 class="btn btn-block btn-light shadow btn-sm shadow" 146 (click)="volverPreviousPage()">
146 (click)="volverPreviousPage()"> 147 <span class="pr-2">Volver</span>
147 <span class="pr-2">Volver</span> 148 <i class="fa fa-undo text-warning"></i>
148 <i class="fa fa-undo text-warning"></i> 149 </button>
149 </button> 150 <button
150 <button 151 type="button"
151 type="button" 152 class="btn btn-block btn-light shadow btn-sm shadow"
152 class="btn btn-block btn-light shadow btn-sm shadow" 153 [routerLink]="['/cancelar-compra']">
153 [routerLink]="['/cancelar-compra']"> 154 <span class="pr-2">Cancelar</span>
154 <span class="pr-2">Cancelar</span> 155 <i class="fa fa-times text-danger"></i>
155 <i class="fa fa-times text-danger"></i> 156 </button>
156 </button> 157 </div>
157 </div> 158 </div>
158 </div> 159 </div>
159 </div> 160 </div>
160 </div> 161 </div>
161 </div> 162 </div>
162 </div> 163
163 164 <!-- FORMAS DE PAGO -->
164 <!-- FORMAS DE PAGO --> 165 <div *ngIf="!verQR" class="col-2 px-1">
165 <div *ngIf="!verQR" class="col-2 px-1"> 166 <p class="h4 text-white text-center mt-4 mx-2 pb-2 border-bottom border-white">
166 <p class="h4 text-white text-center mt-4 mx-2 pb-2 border-bottom border-white"> 167 Forma de pago
167 Forma de pago 168 </p>
168 </p> 169
169 170 <!-- EFECTIVO -->
170 <!-- EFECTIVO --> 171 <div
171 <div 172 class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white"
172 class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white" 173 (click)="pagar(1)">
173 (click)="pagar(1)"> 174 <div class="col-7 text-center my-auto px-2">
174 <div class="col-7 text-center my-auto px-2"> 175 <span class="h5 font-weight-bold">Efectivo</span>
175 <span class="h5 font-weight-bold">Efectivo</span> 176 </div>
176 </div> 177 <div class="col-5 my-auto p-0">
177 <div class="col-5 my-auto p-0"> 178 <img
178 <img 179 src="../../../assets/img/efectivo.png"
179 src="../../../assets/img/efectivo.png" 180 class="w-100 float-right">
180 class="w-100 float-right"> 181 </div>
181 </div> 182 </div>
182 </div> 183
183 184 <!-- TARJETA -->
184 <!-- TARJETA --> 185 <div class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white"
185 <div class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white" 186 (click)="abrirPagoConTarjeta()">
186 (click)="abrirPagoConTarjeta()"> 187 <div class="col-7 text-center my-auto px-2">
187 <div class="col-7 text-center my-auto px-2"> 188 <span class="h5 font-weight-bold">Tarjeta</span>
188 <span class="h5 font-weight-bold">Tarjeta</span> 189 </div>
189 </div> 190 <div class="col-5 my-auto p-0">
190 <div class="col-5 my-auto p-0"> 191 <img
191 <img 192 src="../../../assets/img/tarjeta.png"
192 src="../../../assets/img/tarjeta.png" 193 class="w-100 float-right">
193 class="w-100 float-right"> 194 </div>
194 </div> 195 </div>
195 </div> 196
196 197 <!-- QR -->
197 <!-- QR --> 198 <div
198 <div 199 class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white"
199 class="row card-effect card-forma-pago mx-1 my-3 rounded-sm shadow-sm bg-white" 200 (click)="pagar(9)">
200 (click)="pagar(9)"> 201 <div class="col-7 text-center my-auto px-2">
201 <div class="col-7 text-center my-auto px-2"> 202 <span class="h5 font-weight-bold">Pago Electrónico</span>
202 <span class="h5 font-weight-bold">Pago Electrónico</span> 203 </div>
203 </div> 204 <div class="col-5 my-auto p-0">
204 <div class="col-5 my-auto p-0"> 205 <img
205 <img 206 src="../../../assets/img/qr.png"
206 src="../../../assets/img/qr.png" 207 class="w-100 float-right">
207 class="w-100 float-right"> 208 </div>
208 </div> 209 </div>
209 </div> 210 </div>
210 </div> 211 </div>
211 </div> 212
212 213 </div>
213 </div> 214 </div>
214 </div> 215
215 216 <div
216 <div 217 *ngIf="compraConQRfinalizada"
217 *ngIf="compraConQRfinalizada" 218 [routerLink]="['/mensaje-final']"
218 [routerLink]="['/mensaje-final']" 219 class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
219 class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100"> 220 <div class="col-12 text-center text-white my-auto">
220 <div class="col-12 text-center text-white my-auto"> 221 <p class="font-weight-bold display-4">
221 <p class="font-weight-bold display-4"> 222 Su pago fue<br>
222 Su pago fue<br> 223 acreditado
223 acreditado 224 exitosamente
224 exitosamente 225 </p>
225 </p> 226 <p class="font-weight-bold display-4">Recuerde retirar su ticket</p>
226 <p class="font-weight-bold display-4">Recuerde retirar su ticket</p> 227 </div>
227 </div> 228 <div class="row z-index-0 fixed-top m-0 w-100">
228 <div class="row z-index-0 fixed-top m-0 w-100"> 229 <div class="col-12 p-3">
229 <div class="col-12 p-3"> 230 <img class="w-15 float-right" src="../../../assets/img/debo-gray.png">
230 <img class="w-15 float-right" src="../../../assets/img/debo-gray.png"> 231 </div>
231 </div> 232 </div>
232 </div> 233 </div>
233 </div> 234
234 235 <div
235 <div 236 *ngIf="compraConEfectivofinalizada"
236 *ngIf="compraConEfectivofinalizada" 237 [routerLink]="['/mensaje-final']"
237 [routerLink]="['/mensaje-final']" 238 class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
238 class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100"> 239 <div class="col-12 text-center text-white my-auto">
239 <div class="col-12 text-center text-white my-auto"> 240 <p class="font-weight-bold display-4">
240 <p class="font-weight-bold display-4"> 241 Retire su ticket<br>
241 Retire su ticket<br> 242 y diríjase a caja para<br>
242 y diríjase a caja para<br> 243 efectuar el pago.
243 efectuar el pago. 244 </p>
244 </p> 245 </div>
245 </div> 246 <div class="row z-index-0 fixed-top m-0 w-100">
246 <div class="row z-index-0 fixed-top m-0 w-100"> 247 <div class="col-12 p-3">
247 <div class="col-12 p-3"> 248 <img class="w-15 float-right" src="../../../assets/img/debo-gray.png">
248 <img class="w-15 float-right" src="../../../assets/img/debo-gray.png"> 249 </div>
249 </div> 250 </div>
250 </div> 251 </div>
251 </div> 252
src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
1 import { Component, OnInit, OnDestroy } from '@angular/core'; 1 import { Component, OnInit, OnDestroy } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { Location } from '@angular/common'; 3 import { Location } from '@angular/common';
4 import { ProductoService } from 'src/app/services/producto.service'; 4 import { ProductoService } from 'src/app/services/producto.service';
5 import { Producto } from 'src/app/wrappers/producto'; 5 import { Producto } from 'src/app/wrappers/producto';
6 import { Router } from '@angular/router'; 6 import { Router } from '@angular/router';
7 import { Subscription } from 'rxjs'; 7 import { Subscription } from 'rxjs';
8 import { BsModalService } from 'ngx-bootstrap'; 8 import { BsModalService } from 'ngx-bootstrap';
9 import { PagoConTarjetaComponent } from '../pago-con-tarjeta/pago-con-tarjeta.component'; 9 import { PagoConTarjetaComponent } from '../pago-con-tarjeta/pago-con-tarjeta.component';
10 10
11 @Component({ 11 @Component({
12 selector: 'app-confirmacion-carrito', 12 selector: 'app-confirmacion-carrito',
13 templateUrl: './confirmacion-carrito.component.html', 13 templateUrl: './confirmacion-carrito.component.html',
14 styleUrls: ['./confirmacion-carrito.component.scss'] 14 styleUrls: ['./confirmacion-carrito.component.scss']
15 }) 15 })
16 export class ConfirmacionCarritoComponent implements OnInit, OnDestroy { 16 export class ConfirmacionCarritoComponent implements OnInit, OnDestroy {
17 17
18 private apiImagenes: string = APP_SETTINGS.apiImagenes; 18 private apiImagenes: string = APP_SETTINGS.apiImagenes;
19 private compraConEfectivofinalizada: boolean = false; 19 private compraConEfectivofinalizada: boolean = false;
20 private compraConQRfinalizada: boolean = false; 20 private compraConQRfinalizada: boolean = false;
21 private productos: Producto[] = []; 21 private productos: Producto[] = [];
22 private total: number = 0; 22 private total: number = 0;
23 private timerReposo: any; 23 private timerReposo: any;
24 private verQR: boolean = false; 24 private verQR: boolean = false;
25 private subscribePago: Subscription; 25 private subscribePago: Subscription;
26 private pedidoAnombreDe: string = ''; 26 private pedidoAnombreDe: string = '';
27 27
28 constructor( 28 constructor(
29 private location: Location, 29 private location: Location,
30 private productoService: ProductoService, 30 private productoService: ProductoService,
31 private router: Router, 31 private router: Router,
32 private modalService: BsModalService, 32 private modalService: BsModalService,
33 ) { } 33 ) { }
34 34
35 ngOnInit() { 35 ngOnInit() {
36 36
37 this.timerReposo = setTimeout(() => { 37 this.timerReposo = setTimeout(() => {
38 38
39 this.router.navigate(['cancelar-compra']); 39 this.router.navigate(['cancelar-compra']);
40 }, 90000) 40 }, 90000)
41 this.productos = this.productoService.productos; 41 this.productos = this.productoService.productos;
42 } 42 }
43 43
44 ngOnDestroy() { 44 ngOnDestroy() {
45 45
46 if (this.subscribePago !== undefined) { 46 if (this.subscribePago !== undefined) {
47 this.subscribePago.unsubscribe(); 47 this.subscribePago.unsubscribe();
48 } 48 }
49 clearTimeout(this.timerReposo); 49 clearTimeout(this.timerReposo);
50 } 50 }
51 51
52 volverPreviousPage() { 52 volverPreviousPage() {
53 53
54 if (this.subscribePago !== undefined) { 54 if (this.subscribePago !== undefined) {
55 this.subscribePago.unsubscribe(); 55 this.subscribePago.unsubscribe();
56 } 56 }
57 57
58 if (this.verQR) { 58 if (this.verQR) {
59 this.verQR = !this.verQR; 59 this.verQR = !this.verQR;
60 return; 60 return;
61 } 61 }
62 62
63 this.location.back(); 63 this.location.back();
64 } 64 }
65 65
66 getTotal() { 66 getTotal() {
67 67
68 var subTotal = 0; 68 var subTotal = 0;
69 this.productos.forEach(producto => { 69 this.productos.forEach(producto => {
70 70
71 subTotal = subTotal + (producto.PreVen * producto.cantidad); 71 subTotal = subTotal + (producto.PreVen * producto.cantidad);
72 }); 72 });
73 return this.total = subTotal; 73 return this.total = subTotal;
74 } 74 }
75 75
76 reiniciarTimer() { 76 reiniciarTimer() {
77 77
78 clearTimeout(this.timerReposo); 78 clearTimeout(this.timerReposo);
79 this.timerReposo = setTimeout(() => { 79 this.timerReposo = setTimeout(() => {
80 80
81 this.router.navigate(['cancelar-compra']); 81 this.router.navigate(['cancelar-compra']);
82 }, 90000) 82 }, 90000)
83 } 83 }
84 84
85 //#region METODOS PARA LA FORMA DE PAGO 85 //#region METODOS PARA LA FORMA DE PAGO
86 pagar(medioPago: number) { 86 pagar(medioPago: number) {
87 87
88 this.verQR = medioPago === 9 ? true : false; 88 this.verQR = medioPago === 9 ? true : false;
89 let dataPago = { 89 let dataPago = {
90 medioPago: medioPago, 90 medioPago: medioPago,
91 pedidoAnombreDe: this.pedidoAnombreDe 91 pedidoAnombreDe: this.pedidoAnombreDe
92 } 92 }
93 this.subscribePago = this.productoService.pagar(dataPago) 93 this.subscribePago = this.productoService.pagar(dataPago)
94 .subscribe((res: any) => { 94 .subscribe((res: any) => {
95 95
96 clearTimeout(this.timerReposo); 96 clearTimeout(this.timerReposo);
97 97
98 if (medioPago === 1) { 98 if (medioPago === 1) {
99 this.compraConEfectivofinalizada = true; 99 this.compraConEfectivofinalizada = true;
100 } else if (medioPago === 9) { 100 } else if (medioPago === 9) {
101 this.compraConQRfinalizada = true; 101 this.compraConQRfinalizada = true;
102 } 102 }
103 103
104 setTimeout(() => { 104 setTimeout(() => {
105 105
106 this.router.navigate(['mensaje-final']); 106 this.router.navigate(['mensaje-final']);
107 }, 10000); 107 }, 10000);
108 }, err => { 108 }, err => {
109 109
110 console.error(err); 110 console.error(err);
111 alert('Algo salió mal'); 111 alert('Algo salió mal');
112 }) 112 })
113 } 113 }
114 //#endregion 114 //#endregion
115 115
116 abrirPagoConTarjeta() { 116 abrirPagoConTarjeta() {
117 117
118 this.modalService.show(PagoConTarjetaComponent, { 118 this.modalService.show(PagoConTarjetaComponent, {
119 class: 'modal-lg', 119 class: 'modal-lg',
120 ignoreBackdropClick: true, 120 ignoreBackdropClick: true,
121 initialState: { importeTotal: this.total }, 121 initialState: { importeTotal: this.total },
122 }); 122 });
123 } 123 }
124 } 124 }
125 125
src/app/components/header/header.component.ts
1 import { Component, OnInit, HostListener } from '@angular/core'; 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { BsModalService } from 'ngx-bootstrap'; 3 import { BsModalService } from 'ngx-bootstrap';
4 import { ConfiguracionComponent } from '../configuracion/configuracion.component'; 4 import { ConfiguracionComponent } from '../configuracion/configuracion.component';
5 5
6 @Component({ 6 @Component({
7 selector: 'app-header', 7 selector: 'app-header',
8 templateUrl: './header.component.html', 8 templateUrl: './header.component.html',
9 styleUrls: ['./header.component.scss'] 9 styleUrls: ['./header.component.scss']
10 }) 10 })
11 export class HeaderComponent implements OnInit { 11 export class HeaderComponent implements OnInit {
12 12
13 private apiImagenes : string = APP_SETTINGS.apiImagenes; 13 private apiImagenes : string = APP_SETTINGS.apiImagenes;
14 timer: any; 14 timer: any;
15 isShowModalConfiguration = false; 15 isShowModalConfiguration = false;
16 16
17 constructor( 17 constructor(
18 private modalService: BsModalService, 18 private modalService: BsModalService,
19 ) { } 19 ) { }
20 20
21 ngOnInit() { 21 ngOnInit() {
22 } 22 }
23 23
24 @HostListener('document:keydown.Control.Shift.A', ['$event']) 24 @HostListener('document:keydown.Control.Shift.A', ['$event'])
25 openConfigurationScreen(delay: number = 3000) { 25 openConfigurationScreen(delay: number = 3000) {
26 26
27 if (this.isShowModalConfiguration) return; 27 if (this.isShowModalConfiguration) return;
28 28
29 this.modalService.onHide 29 this.modalService.onHide
30 .subscribe(() => this.isShowModalConfiguration = false); 30 .subscribe(() => this.isShowModalConfiguration = false);
31 31
32 this.timer = setTimeout(() => { 32 this.timer = setTimeout(() => {
33 33
34 this.isShowModalConfiguration = true; 34 this.isShowModalConfiguration = true;
35 this.modalService.show(ConfiguracionComponent, { 35 this.modalService.show(ConfiguracionComponent, {
36 class: 'modal-md', 36 class: 'modal-md',
37 ignoreBackdropClick: true, 37 ignoreBackdropClick: true,
38 }); 38 });
39 }, delay); 39 }, delay);
40 } 40 }
41 41
42 resetCountDown() { 42 resetCountDown() {
43 43
44 clearTimeout(this.timer); 44 clearTimeout(this.timer);
45 } 45 }
46 46
47 } 47 }
48 48
src/app/components/home/home.component.ts
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 { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 4
5 @Component({ 5 @Component({
6 selector: 'app-home', 6 selector: 'app-home',
7 templateUrl: './home.component.html', 7 templateUrl: './home.component.html',
8 styleUrls: ['./home.component.scss'] 8 styleUrls: ['./home.component.scss']
9 }) 9 })
10 export class HomeComponent implements OnInit { 10 export class HomeComponent implements OnInit {
11 11
12 private apiImagenes: string = APP_SETTINGS.apiImagenes; 12 private apiImagenes: string = APP_SETTINGS.apiImagenes;
13 13
14 constructor() { } 14 constructor() { }
15 15
16 ngOnInit() { 16 ngOnInit() {
17 } 17 }
18 18
19 } 19 }
20 20
src/app/components/inicio/inicio.component.html
1 <div class="row m-0 fade-in" [hidden]="!mostrarPantalla"> 1 <div class="row m-0 fade-in" [hidden]="!mostrarPantalla">
2 <div class="col-12 p-0"> 2 <div class="col-12 p-0">
3 3
4 <!-- NOMBRE DE SECCION --> 4 <!-- NOMBRE DE SECCION -->
5 <div class="row m-0"> 5 <div class="row m-0">
6 <div class="col-12 p-0"> 6 <div class="col-12 p-0">
7 <p class="h5 m-0 py-1 bg-gray text-muted text-center">Inicio</p> 7 <p class="h5 m-0 py-1 bg-gray text-muted text-center">Inicio</p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="row m-0 d-flex align-items-start disable-user-select"> 11 <div class="row m-0 d-flex align-items-start disable-user-select">
12 <div class="col-md-5 py-3 pr-0 d-flex align-items-end flex-column"> 12 <div class="col-md-5 py-3 pr-0 d-flex align-items-end flex-column">
13 13
14 <!-- PROMOCIONES --> 14 <!-- PROMOCIONES -->
15 <div 15 <div
16 (click)="irBusquedaProductos('promociones')" 16 (click)="irBusquedaProductos('promociones')"
17 class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto"> 17 class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
18 <div class="card-body text-left px-4 py-3"> 18 <div class="card-body text-left px-4 py-3">
19 <div class="row"> 19 <div class="row">
20 <div class="col-auto"> 20 <div class="col-auto">
21 <p class="m-0 h3 card-title">Promociones</p> 21 <p class="m-0 h3 card-title">Promociones</p>
22 </div> 22 </div>
23 <div class="col-auto p-0"> 23 <div class="col-auto p-0">
24 <img src="{{apiImagenes}}/imagenes/primario.promociones.png" class="w-15 m-0"> 24 <img src="{{apiImagenes}}/imagenes/primario.promociones.png" class="w-15 m-0">
25 </div> 25 </div>
26 </div> 26 </div>
27 <p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p> 27 <p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>
28 </div> 28 </div>
29 <!-- CAROUSEL --> 29 <!-- CAROUSEL -->
30 <carousel [showIndicators]="false" [interval]="1500"> 30 <carousel [showIndicators]="false" [interval]="1500">
31 <slide class="h-100"> 31 <slide class="h-100">
32 <img 32 <img
33 src="{{apiImagenes}}/imagenes/beldent.jpg" 33 src="{{apiImagenes}}/imagenes/beldent.jpg"
34 class="fade-in d-block w-75 m-auto rounded"> 34 class="fade-in d-block w-75 m-auto rounded">
35 </slide> 35 </slide>
36 <slide class="h-100"> 36 <slide class="h-100">
37 <img 37 <img
38 src="{{apiImagenes}}/imagenes/cafe con leche y medialunas.jpg" 38 src="{{apiImagenes}}/imagenes/cafe con leche y medialunas.jpg"
39 class="fade-in d-block w-75 m-auto rounded"> 39 class="fade-in d-block w-75 m-auto rounded">
40 </slide> 40 </slide>
41 <slide class="h-100"> 41 <slide class="h-100">
42 <img 42 <img
43 src="{{apiImagenes}}/imagenes/Surtido bagley.jpg" 43 src="{{apiImagenes}}/imagenes/Surtido bagley.jpg"
44 class="fade-in d-block w-75 m-auto rounded"> 44 class="fade-in d-block w-75 m-auto rounded">
45 </slide> 45 </slide>
46 <slide class="h-100"> 46 <slide class="h-100">
47 <img 47 <img
48 src="{{apiImagenes}}/imagenes/yogurisimo.jpg" 48 src="{{apiImagenes}}/imagenes/yogurisimo.jpg"
49 class="fade-in d-block w-75 m-auto rounded"> 49 class="fade-in d-block w-75 m-auto rounded">
50 </slide> 50 </slide>
51 </carousel> 51 </carousel>
52 </div> 52 </div>
53 53
54 <!-- ORDENAR --> 54 <!-- ORDENAR -->
55 <div (click)="irBusquedaProductos('ordenar')" 55 <div (click)="irBusquedaProductos('ordenar')"
56 class="card card-effect bg-white border-0 shadow rounded w-100 mt-3"> 56 class="card card-effect bg-white border-0 shadow rounded w-100 mt-3">
57 <div class="card-body text-left px-4 py-3"> 57 <div class="card-body text-left px-4 py-3">
58 <div class="row"> 58 <div class="row">
59 <div class="col-auto"> 59 <div class="col-auto">
60 <p class="m-0 h3 card-title">Ordenar Pedido</p> 60 <p class="m-0 h3 card-title">Ordenar Pedido</p>
61 </div> 61 </div>
62 <div class="col-auto p-0"> 62 <div class="col-auto p-0">
63 <img src="{{apiImagenes}}/imagenes/primario.ordenar.png" class="w-15"> 63 <img src="{{apiImagenes}}/imagenes/primario.ordenar.png" class="w-15">
64 </div> 64 </div>
65 </div> 65 </div>
66 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p> 66 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>
67 </div> 67 </div>
68 <img 68 <img
69 class="card-img-bottom d-block w-100 mx-auto rounded" 69 class="card-img-bottom d-block w-100 mx-auto rounded"
70 src="{{apiImagenes}}/imagenes/cafe.jpg"> 70 src="{{apiImagenes}}/imagenes/cafe.jpg">
71 </div> 71 </div>
72 </div> 72 </div>
73 73
74 <div class="col-md-7 py-3 d-flex align-items-end flex-column mt-4 mt-md-0"> 74 <div class="col-md-7 py-3 d-flex align-items-end flex-column mt-4 mt-md-0">
75 75
76 <!-- CARGAR PRODUCTOS --> 76 <!-- CARGAR PRODUCTOS -->
77 <ng-template #popTemplate> 77 <ng-template #popTemplate>
78 <app-popover-promos 78 <app-popover-promos
79 *ngIf="promociones.length > 0 && sinonimos.length === 0" 79 *ngIf="promociones.length > 0 && sinonimos.length === 0"
80 [popover]="popoverDirective" 80 [popover]="popoverDirective"
81 [popoverContent]="promociones" 81 [popoverContent]="promociones"
82 (promoSeleccionada)="promoSeleccionada($event, false)" 82 (promoSeleccionada)="promoSeleccionada($event, false)"
83 class="text-white rounded-sm border-0"> 83 class="text-white rounded-sm border-0">
84 </app-popover-promos> 84 </app-popover-promos>
85 <app-popover-sinonimos 85 <app-popover-sinonimos
86 *ngIf="sinonimos.length > 0" 86 *ngIf="sinonimos.length > 0"
87 [popover]="popoverDirective" 87 [popover]="popoverDirective"
88 [popoverContent]="sinonimos" 88 [popoverContent]="sinonimos"
89 (productosPersonalizados)="productosPersonalizados($event)" 89 (productosPersonalizados)="productosPersonalizados($event)"
90 class="text-white rounded-sm border-0"> 90 class="text-white rounded-sm border-0">
91 </app-popover-sinonimos> 91 </app-popover-sinonimos>
92 </ng-template> 92 </ng-template>
93 <div 93 <div
94 placement="left" 94 placement="left"
95 triggers="" 95 triggers=""
96 [popover]="popTemplate" 96 [popover]="popTemplate"
97 class="w-100" 97 class="w-100"
98 #pop="bs-popover"> 98 #pop="bs-popover">
99 <div class="card bg-white border-0 shadow rounded mb-auto"> 99 <div class="card bg-white border-0 shadow rounded mb-auto">
100 <div class="card-body text-left px-4 py-3"> 100 <div class="card-body text-left px-4 py-3">
101 <div class="row"> 101 <div class="row">
102 <div class="col-auto"> 102 <div class="col-auto">
103 <p class="m-0 h3 card-title">Cargar Productos</p> 103 <p class="m-0 h3 card-title">Cargar Productos</p>
104 </div> 104 </div>
105 <div class="col-auto p-0"> 105 <div class="col-auto p-0">
106 <img src="../../../assets/img/escanear.png" class="w-15"> 106 <img src="../../../assets/img/escanear.png" class="w-15">
107 </div> 107 </div>
108 </div> 108 </div>
109 <p class="h5 card-text text-muted font-weight-light"> 109 <p class="h5 card-text text-muted font-weight-light">
110 Coloque un producto frente<br> 110 Coloque un producto frente<br>
111 al lector de códigos o selecciónelo en pantalla. 111 al lector de códigos o selecciónelo en pantalla.
112 </p> 112 </p>
113 </div> 113 </div>
114 <div class="row mx-3 mb-3"> 114 <div class="row mx-3 mb-3">
115 <div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm"> 115 <div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm">
116 <!-- IMAGEN DE ESCANER --> 116 <!-- IMAGEN DE ESCANER -->
117 <img 117 <img
118 *ngIf="!productoAcargar" 118 *ngIf="!productoAcargar"
119 class="card-img-top d-block w-100 mx-auto rounded-sm" 119 class="card-img-top d-block w-100 mx-auto rounded-sm"
120 src="../../../assets/img/escanner.jpg"> 120 src="../../../assets/img/escanner.jpg">
121 121
122 <!-- PRODUCTO A CARGAR --> 122 <!-- PRODUCTO A CARGAR -->
123 <div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar"> 123 <div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar">
124 <img 124 <img
125 class="card-img-top d-block w-75 shadow mx-auto rounded-sm" 125 class="card-img-top d-block w-75 shadow mx-auto rounded-sm"
126 src="{{apiImagenes}}/imagenes/{{productoAcargar.imagenes[0].imagen}}"> 126 src="{{apiImagenes}}/imagenes/{{productoAcargar.imagenes[0].imagen}}">
127 127
128 <div class="row justify-content-between m-3"> 128 <div class="row justify-content-between m-3">
129 <div class="col-12 text-left px-1"> 129 <div class="col-12 text-left px-1">
130 <p class="h6 font-weight-bold mb-0">{{productoAcargar.DET_LAR}}</p> 130 <p class="h6 font-weight-bold mb-0">{{productoAcargar.DET_LAR}}</p>
131 </div> 131 </div>
132 <div class="col-12 text-right mt-2"> 132 <div class="col-12 text-right mt-2">
133 <p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen | currency}}</p> 133 <p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen | currency}}</p>
134 </div> 134 </div>
135 </div> 135 </div>
136 </div> 136 </div>
137 137
138 <!-- PROMO A CARGAR --> 138 <!-- PROMO A CARGAR -->
139 <div class="fade-in m-0" *ngIf="promoAcargar"> 139 <div class="fade-in m-0" *ngIf="promoAcargar">
140 <img 140 <img
141 class="card-img-top d-block w-100 mx-auto rounded-sm" 141 class="card-img-top d-block w-100 mx-auto rounded-sm"
142 src="{{apiImagenes}}/imagenes/{{promoAcargar.imagenes[0].imagen}}"> 142 src="{{apiImagenes}}/imagenes/{{promoAcargar.imagenes[0].imagen}}">
143 143
144 <div class="row justify-content-between m-3"> 144 <div class="row justify-content-between m-3">
145 <div class="col-12 text-left px-1"> 145 <div class="col-12 text-left px-1">
146 <p class="h6 font-weight-bold mb-0">{{promoAcargar.DET_LAR}}</p> 146 <p class="h6 font-weight-bold mb-0">{{promoAcargar.DET_LAR}}</p>
147 </div> 147 </div>
148 <div class="col-12 text-right mt-2 align-self-end"> 148 <div class="col-12 text-right mt-2 align-self-end">
149 <p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen | currency}}</p> 149 <p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen | currency}}</p>
150 </div> 150 </div>
151 </div> 151 </div>
152 </div> 152 </div>
153 153
154 </div> 154 </div>
155 <!-- BOTONES DE CARGAR PRODUCTOS--> 155 <!-- BOTONES DE CARGAR PRODUCTOS-->
156 <div 156 <div
157 class="col-5 pr-0" 157 class="col-5 pr-0"
158 *ngIf="promociones.length > 0"> 158 *ngIf="promociones.length > 0">
159 <button 159 <button
160 *ngIf="!promoAcargar || sinonimos.length == 0" 160 *ngIf="!promoAcargar || sinonimos.length == 0"
161 type="button" 161 type="button"
162 class="btn btn-primary btn-block shadow-sm" 162 class="btn btn-primary btn-block shadow-sm"
163 (click)="pop.show()"> 163 (click)="pop.show()">
164 <span class="pr-2">Mostrar promociones</span> 164 <span class="pr-2">Mostrar promociones</span>
165 <i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i> 165 <i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i>
166 </button> 166 </button>
167 <button 167 <button
168 *ngIf="sinonimos.length == 0" 168 *ngIf="sinonimos.length == 0"
169 type="button" 169 type="button"
170 class="btn btn-light btn-block shadow-sm my-3" 170 class="btn btn-light btn-block shadow-sm my-3"
171 (click)="confirmarProducto()"> 171 (click)="confirmarProducto()">
172 <span class="pr-2 font-weight-bold">Confirmar</span> 172 <span class="pr-2 font-weight-bold">Confirmar</span>
173 <i class="fa fa-check text-success" aria-hidden="true"></i> 173 <i class="fa fa-check text-success" aria-hidden="true"></i>
174 </button> 174 </button>
175 <button 175 <button
176 type="button" 176 type="button"
177 class="btn btn-light btn-block shadow-sm" 177 class="btn btn-light btn-block shadow-sm"
178 (click)="deshacerCarga()"> 178 (click)="deshacerCarga()">
179 <span class="pr-2">Deshacer</span> 179 <span class="pr-2">Deshacer</span>
180 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 180 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
181 </button> 181 </button>
182 </div> 182 </div>
183 </div> 183 </div>
184 </div> 184 </div>
185 </div> 185 </div>
186 186
187 <!-- BUSCAR PRODUCTOS --> 187 <!-- BUSCAR PRODUCTOS -->
188 <div (click)="irBusquedaProductos('todos')" 188 <div (click)="irBusquedaProductos('todos')"
189 class="card card-effect bg-white border-0 shadow rounded w-100 mt-3"> 189 class="card card-effect bg-white border-0 shadow rounded w-100 mt-3">
190 <div class="card-body text-left px-4 py-3"> 190 <div class="card-body text-left px-4 py-3">
191 <div class="row"> 191 <div class="row">
192 <div class="col-auto"> 192 <div class="col-auto">
193 <p class="m-0 h3 card-title">Buscar Productos</p> 193 <p class="m-0 h3 card-title">Buscar Productos</p>
194 <p class="h5 card-text text-muted font-weight-light"> 194 <p class="h5 card-text text-muted font-weight-light">
195 Busque aquí los productos<br> 195 Busque aquí los productos<br>
196 que no tienen código.</p> 196 que no tienen código.</p>
197 </div> 197 </div>
198 <div class="col-auto p-0"> 198 <div class="col-auto p-0">
199 <img src="../../../assets/img/primario.buscar.png" class="w-15"> 199 <img src="../../../assets/img/primario.buscar.png" class="w-15">
200 </div> 200 </div>
201 </div> 201 </div>
202 202
203 </div> 203 </div>
204 </div> 204 </div>
205 205
206 </div> 206 </div>
207 207
208 </div> 208 </div>
209 209
210 </div> 210 </div>
211 </div> 211 </div>
212
213 <div class="row m-0 fade-in" [hidden]="mostrarPantalla">
214 <p class="w-100 text-center">No está configurado el punto de venta</p>
215 </div>
212 216
src/app/components/inicio/inicio.component.ts
1 import { Component, OnInit, ViewChild, HostListener, AfterViewInit } from '@angular/core'; 1 import { Component, OnInit, ViewChild, HostListener, AfterViewInit } from '@angular/core';
2 import { PopoverDirective } from 'ngx-bootstrap'; 2 import { PopoverDirective } from 'ngx-bootstrap';
3 import { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 import { Router } from '@angular/router'; 4 import { Router } from '@angular/router';
5 import { ProductoService } from 'src/app/services/producto.service'; 5 import { ProductoService } from 'src/app/services/producto.service';
6 import { Producto } from 'src/app/wrappers/producto'; 6 import { Producto } from 'src/app/wrappers/producto';
7 import { Sinonimo } from 'src/app/wrappers/sinonimo'; 7 import { Sinonimo } from 'src/app/wrappers/sinonimo';
8 8
9 @Component({ 9 @Component({
10 selector: 'app-inicio', 10 selector: 'app-inicio',
11 templateUrl: './inicio.component.html', 11 templateUrl: './inicio.component.html',
12 styleUrls: ['./inicio.component.scss'] 12 styleUrls: ['./inicio.component.scss']
13 }) 13 })
14 export class InicioComponent implements OnInit, AfterViewInit { 14 export class InicioComponent implements OnInit, AfterViewInit {
15 15
16 private tienePromo = false; 16 private tienePromo = false;
17 private productoEsPromo = false; 17 private productoEsPromo = false;
18 private busqueda: string = ''; 18 private busqueda: string = '';
19 private productoAcargar: Producto; 19 private productoAcargar: Producto;
20 private promoAcargar: Producto; 20 private promoAcargar: Producto;
21 private productos: Producto[] = []; 21 private productos: Producto[] = [];
22 private promociones: Producto[] = []; 22 private promociones: Producto[] = [];
23 private sinonimos: Sinonimo[] = []; 23 private sinonimos: Sinonimo[] = [];
24 private apiImagenes: string = APP_SETTINGS.apiImagenes; 24 private apiImagenes: string = APP_SETTINGS.apiImagenes;
25 private mostrarPantalla : boolean = false;
25 private mostrarPantalla : boolean = false; 26
26 27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;
27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective; 28
28 29 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) {
29 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) { 30
30 31 if (e.keyCode == 13) {
31 if (e.keyCode == 13) { 32 this.buscarByCodigoBarras(this.busqueda);
32 this.buscarByCodigoBarras(this.busqueda); 33 this.busqueda = '';
33 this.busqueda = ''; 34 } else {
34 } else { 35 this.busqueda += e.key;
35 this.busqueda += e.key; 36 }
36 } 37 };
37 }; 38
38 39 constructor(
39 constructor( 40 private router: Router,
40 private router: Router, 41 private productoService: ProductoService
41 private productoService: ProductoService 42 ) { }
42 ) { } 43
43 44 ngOnInit() {
44 ngOnInit() { 45
45 46 this.productoAcargar = this.productoService.productoAcargar;
46 this.productoAcargar = this.productoService.productoAcargar; 47 this.getProductos();
48 this.mostrarPantalla = localStorage.getItem('impresoraPVE') ? true : false;
47 this.getProductos(); 49 }
48 this.mostrarPantalla = localStorage.getItem('impresoraPVE') ? true : false; 50
49 } 51 ngAfterViewInit() {
50 52
51 ngAfterViewInit() { 53 setTimeout(() => {
52 54 if (!this.productoAcargar) return;
53 setTimeout(() => { 55
54 if (!this.productoAcargar) return; 56 if (this.productoAcargar.PRO) {
55 57 this.promociones.push(this.productoAcargar);
56 if (this.productoAcargar.PRO) { 58 this.promoSeleccionada(this.productoAcargar, true);
57 this.promociones.push(this.productoAcargar); 59 }
58 this.promoSeleccionada(this.productoAcargar, true); 60 else {
59 } 61 this.getPromociones();
60 else { 62 }
61 this.getPromociones(); 63 })
62 } 64 }
63 }) 65
64 } 66 getProductos() {
65 67
66 getProductos() { 68 this.productoService.getAll()
67 69 .subscribe((productos: Producto[]) => {
68 this.productoService.getAll() 70 this.productos = productos;
69 .subscribe((productos: Producto[]) => { 71 });
70 this.productos = productos; 72 }
71 }); 73
72 } 74 getPromociones() {
73 75
74 getPromociones() { 76 var sector = this.productoAcargar.CodSec;
75 77 var codigo = this.productoAcargar.CodArt;
76 var sector = this.productoAcargar.CodSec; 78 this.productoService.getPromociones(sector, codigo)
77 var codigo = this.productoAcargar.CodArt; 79 .subscribe((res: Producto[]) => {
78 this.productoService.getPromociones(sector, codigo) 80
79 .subscribe((res: Producto[]) => { 81 if (res.length === 0) {
80 82
81 if (res.length === 0) { 83 this.productoAcargar.cantidad ? false : this.productoAcargar.cantidad = 1;
82 84 this.productoService.setProductos(this.productoAcargar);
83 this.productoAcargar.cantidad ? false : this.productoAcargar.cantidad = 1; 85 this.productoAcargar = this.productoService.productoAcargar = undefined;
84 this.productoService.setProductos(this.productoAcargar); 86 } else {
85 this.productoAcargar = this.productoService.productoAcargar = undefined; 87
86 } else { 88 this.promociones = res;
87 89 this.popoverDirective.show();
88 this.promociones = res; 90 }
89 this.popoverDirective.show(); 91 }, error => { console.error(error); })
90 } 92 }
91 }, error => { console.error(error); }) 93
92 } 94 confirmarProducto() {
93 95
94 confirmarProducto(cantidad?: number) { 96 let producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar;
95 97
96 let producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar; 98 producto.cantidad = producto.cantidad ? producto.cantidad : 1;
97
98 if (cantidad) {
99 producto.cantidad = cantidad;
100 } else {
101 producto.cantidad = producto.cantidad ? producto.cantidad : 1; 99
102 } 100 this.productoService.setProductos(producto);
103 101 this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined;
104 this.productoService.setProductos(producto); 102 this.productoService.esPromoPersonalizada = false;
105 this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined; 103 this.promociones = [];
106 this.productoService.esPromoPersonalizada = false; 104 this.popoverDirective.hide();
107 this.promociones = []; 105 }
108 this.popoverDirective.hide(); 106
109 } 107 promoSeleccionada($event: Producto, showPopover: boolean) {
110 108
111 promoSeleccionada($event: Producto, showPopover: boolean) { 109 this.productoService.getProductoById($event.id)
112 110 .subscribe((res: Producto) => {
113 this.productoService.getProductoById($event.id) 111
114 .subscribe((res: Producto) => { 112 $event.imagenes = res.imagenes.length == 0 ? [{ imagen: 'noImage.jpg' }] : res.imagenes;
115 113 this.promoAcargar = $event;
116 $event.imagenes = res.imagenes.length == 0 ? [{ imagen: 'noImage.jpg' }] : res.imagenes; 114
117 this.promoAcargar = $event; 115 if ($event.tieneSinonimos) {
118 116 this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt);
119 if ($event.tieneSinonimos) { 117 } else if (showPopover) {
120 this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt); 118 this.popoverDirective.show();
121 } else if (showPopover) { 119 } else {
122 this.popoverDirective.show(); 120 this.popoverDirective.hide();
123 } else { 121 }
124 this.popoverDirective.hide(); 122
125 } 123 },
126 124 error => { console.log(error); })
127 }, 125 }
128 error => { console.log(error); }) 126
129 } 127 getSinonimos(sector, codigo) {
130 128
131 getSinonimos(sector, codigo) { 129 this.productoService.getPromocionSinonimos(sector, codigo)
132 130 .subscribe((res: Sinonimo[]) => {
133 this.productoService.getPromocionSinonimos(sector, codigo) 131
134 .subscribe((res: Sinonimo[]) => { 132 res.forEach(sinonimo => {
135 133
136 res.forEach(sinonimo => { 134 sinonimo.cantidad = 0;
137 135 this.promoAcargar.productos.forEach(productoPromo => {
138 sinonimo.cantidad = 0; 136
139 this.promoAcargar.productos.forEach(productoPromo => { 137 sinonimo.productos.forEach(productoSinonimo => {
140 138
141 sinonimo.productos.forEach(productoSinonimo => { 139 if (productoSinonimo.id === productoPromo.id) {
142 140 productoSinonimo.cantidad = productoPromo.cantidad;
143 if (productoSinonimo.id === productoPromo.id) { 141 sinonimo.cantidad += productoPromo.cantidad;
144 productoSinonimo.cantidad = productoPromo.cantidad; 142 }
145 sinonimo.cantidad += productoPromo.cantidad; 143 })
146 } 144 })
147 }) 145 })
148 }) 146 this.sinonimos = res;
149 }) 147 (this.sinonimos.length > 0) ? this.popoverDirective.show() : this.popoverDirective.hide();
150 this.sinonimos = res; 148 })
151 (this.sinonimos.length > 0) ? this.popoverDirective.show() : this.popoverDirective.hide(); 149 }
152 }) 150
153 } 151 productosPersonalizados($event: Producto[]) {
154 152
155 productosPersonalizados($event: any) { 153 let productosPersonalizados = $event;
156 154
157 let productosPersonalizados = $event.productosAenviar; 155 productosPersonalizados.forEach(productoElegido => {
158 156
159 productosPersonalizados.forEach(productoElegido => { 157 this.promoAcargar.productos = this.promoAcargar.productos.filter(productoPromo => {
160 158 return productoPromo.idSinonimo != productoElegido.idSinonimo;
161 this.promoAcargar.productos = this.promoAcargar.productos.filter(productoPromo => { 159 });
162 return productoPromo.idSinonimo != productoElegido.idSinonimo; 160 });
163 }); 161
164 }); 162 this.promoAcargar.productos = this.promoAcargar.productos.concat(productosPersonalizados);
165 163
164 this.confirmarProducto();
166 this.promoAcargar.productos = this.promoAcargar.productos.concat(productosPersonalizados); 165 }
167 this.confirmarProducto($event.cantidadPromo); 166
168 } 167 buscarByCodigoBarras(busqueda) {
169 168
170 buscarByCodigoBarras(busqueda) { 169 let producto = this.productos.filter(producto => {
171 170 return producto.codigoBarra == busqueda;
172 let producto = this.productos.filter(producto => { 171 });
173 return producto.codigoBarra == busqueda; 172
174 }); 173 if (producto.length) {
175 174
176 if (producto.length) { 175 this.productoAcargar = producto[0];
177 176 this.getPromociones();
178 this.productoAcargar = producto[0]; 177
179 this.getPromociones(); 178 } else {
180 179 alert('No se encuentra el producto');
181 } else { 180 }
182 alert('No se encuentra el producto'); 181
183 } 182 }
184 183
185 } 184 irBusquedaProductos(value) {
186 185
187 irBusquedaProductos(value) { 186 this.productoService.mostrar = value;
188 187 this.router.navigate(['busqueda-productos']);
189 this.productoService.mostrar = value; 188 }
190 this.router.navigate(['busqueda-productos']); 189
191 } 190 deshacerCarga() {
192 191
193 deshacerCarga() { 192 if (this.sinonimos.length > 0) {
194 193 this.sinonimos = [];
195 if (this.sinonimos.length > 0) { 194 this.productoService.esPromoPersonalizada = false;
196 this.sinonimos = []; 195 this.popoverDirective.hide();
197 this.productoService.esPromoPersonalizada = false; 196 }
198 this.popoverDirective.hide(); 197
199 } 198 if (this.promoAcargar) {
200 199 this.promoAcargar = undefined;
201 if (this.promoAcargar) { 200 if (this.productoAcargar.PRO) {
202 this.promoAcargar = undefined; 201 this.productoAcargar = undefined;
203 if (this.productoAcargar.PRO) { 202 this.promociones = [];
204 this.productoAcargar = undefined; 203 this.popoverDirective.hide();
205 this.promociones = []; 204 } else {
206 this.popoverDirective.hide(); 205 this.popoverDirective.show();
207 } else { 206 }
208 this.popoverDirective.show(); 207 } else {
209 } 208 this.productoAcargar = undefined;
210 } else { 209 this.promociones = [];
211 this.productoAcargar = undefined; 210 this.popoverDirective.hide();
212 this.promociones = []; 211 }
213 this.popoverDirective.hide(); 212 }
214 } 213
215 } 214 }
src/app/components/mensaje-final/mensaje-final.component.ts
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 { ProductoService } from 'src/app/services/producto.service'; 3 import { ProductoService } from 'src/app/services/producto.service';
4 import { Router } from '@angular/router'; 4 import { Router } from '@angular/router';
5 5
6 @Component({ 6 @Component({
7 selector: 'app-mensaje-final', 7 selector: 'app-mensaje-final',
8 templateUrl: './mensaje-final.component.html', 8 templateUrl: './mensaje-final.component.html',
9 styleUrls: ['./mensaje-final.component.scss'] 9 styleUrls: ['./mensaje-final.component.scss']
10 }) 10 })
11 export class MensajeFinalComponent implements OnInit { 11 export class MensajeFinalComponent implements OnInit {
12 12
13 private apiImagenes: string = APP_SETTINGS.apiImagenes; 13 private apiImagenes: string = APP_SETTINGS.apiImagenes;
14 private timer: any; 14 private timer: any;
15 15
16 constructor( 16 constructor(
17 private productoService: ProductoService, 17 private productoService: ProductoService,
18 private router: Router 18 private router: Router
19 ) { } 19 ) { }
20 20
21 ngOnInit() { 21 ngOnInit() {
22 22
23 this.timer = setTimeout(() => { 23 this.timer = setTimeout(() => {
24 24
25 this.limpiarCarritoYvolver(); 25 this.limpiarCarritoYvolver();
26 }, 3000) 26 }, 3000)
27 } 27 }
28 28
29 ngOnDestroy() { 29 ngOnDestroy() {
30 30
31 clearTimeout(this.timer); 31 clearTimeout(this.timer);
32 } 32 }
33 33
34 limpiarCarritoYvolver() { 34 limpiarCarritoYvolver() {
35 35
36 this.productoService.productoAcargar = undefined; 36 this.productoService.productoAcargar = undefined;
37 this.productoService.promoAcargar = undefined; 37 this.productoService.promoAcargar = undefined;
38 this.productoService.productos = []; 38 this.productoService.productos = [];
39 this.router.navigate(['/home']); 39 this.router.navigate(['/home']);
40 } 40 }
41 41
42 } 42 }
43 43
src/app/components/popover-sinonimos/popover-sinonimos.component.html
1 <div class="card-body fade-left"> 1 <div class="card-body fade-left">
2 2
3 <div class="row m-0"> 3 <div class="row m-0">
4 <div class="col text-left"> 4 <div class="col text-left">
5 <p class="h4 card-title"> 5 <p class="h4 card-title">
6 Personalice su pedido 6 Personalice su pedido
7 </p> 7 </p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="row m-0 pr-2"> 11 <div class="row m-0 pr-2">
12 <div class="col"> 12 <div class="col">
13 <div class="row" *ngFor="let sinonimo of popoverContent; let i = index"> 13 <div class="row" *ngFor="let sinonimo of popoverContent; let i = index">
14 <div class="col p-0"> 14 <div class="col p-0">
15 15
16 <div class="row py-2">
17 <div class="col-12">
18 <div class="btn-group float-right my-auto" role="group">
19 <button
20 type="button"
21 class="btn btn-light my-auto border shadow"
22 (click)="sumarCantidadPromo()">
23 <i class="fa fa-plus" aria-hidden="true"></i>
24 </button>
25 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5">
26 <small
27 class="font-weight-bold">
28 {{cantidadPromo}}
29 </small>
30 </div>
31 <button
32 type="button"
33 class="btn btn-light my-auto border shadow"
34 (click)="restarCantidadPromo()"
35 [disabled]="cantidadRestanteSinonimos < cantidadOriginal || cantidadPromo === 1">
36 <i class="fa fa-minus" aria-hidden="true"></i>
37 </button>
38 </div>
39 </div>
40 </div>
41
42 <div class="row bg-white text-dark m-0 py-1 shadow"> 16 <div class="row bg-white text-dark m-0 py-1 shadow">
43 <div class="col text-left"> 17 <div class="col text-left">
44 <p class="h5 m-0 card-title"> 18 <p class="h5 m-0 card-title">
45 Elija opción - 19 Elija opción -
46 <span [ngClass]=" 20 <span [ngClass]="
47 { 21 {
48 'text-success': cantidadRestanteSinonimos == 0, 22 'text-success': cantidadRestanteSinonimos == 0,
49 'text-danger': cantidadRestanteSinonimos > 0 23 'text-danger': cantidadRestanteSinonimos > 0
50 }"> 24 }">
51 Cantidad Restante {{cantidadRestanteSinonimos}} 25 Cantidad Restante {{cantidadRestanteSinonimos}}
52 </span> 26 </span>
53 </p> 27 </p>
54 </div> 28 </div>
55 </div> 29 </div>
56 30
57 <div class="row m-0 popover-size overflow-scroll"> 31 <div class="row m-0 popover-size overflow-scroll">
58 <div class="col-12 p-0"> 32 <div class="col-12 p-0">
59 <div class="row m-0 my-2 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos"> 33 <div class="row m-0 my-2 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos">
60 <div class="col-7 p-0 h6 text-right"> 34 <div class="col-7 p-0 h6 text-right">
61 <p class="m-0 font-weight-normal"> 35 <p class="m-0 font-weight-normal">
62 {{producto.DetArt}} 36 {{producto.DetArt}}
63 </p> 37 </p>
64 </div> 38 </div>
65 <!-- SUMA -RESTA CANTIDAD DE PRODUCTOS --> 39 <!-- SUMA -RESTA CANTIDAD DE PRODUCTOS -->
66 <div class="col-5 pr-0"> 40 <div class="col-5 pr-0">
67 <div class="btn-group float-right my-auto" role="group"> 41 <div class="btn-group float-right my-auto" role="group">
68 <button 42 <button
69 type="button" 43 type="button"
70 class="btn btn-light my-auto border shadow" 44 class="btn btn-light my-auto border shadow"
71 (click)="sumarCantidad(producto, i)"> 45 (click)="sumarCantidad(producto, i)">
72 <i class="fa fa-plus" aria-hidden="true"></i> 46 <i class="fa fa-plus" aria-hidden="true"></i>
73 </button> 47 </button>
74 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5"> 48 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5">
75 <small 49 <small
76 [ngClass]="{'font-weight-bold': producto.cantidad > 0}"> 50 [ngClass]="{'font-weight-bold': producto.cantidad > 0}">
77 {{producto.cantidad}} 51 {{producto.cantidad}}
78 </small> 52 </small>
79 </div> 53 </div>
80 <button 54 <button
81 type="button" 55 type="button"
82 class="btn btn-light my-auto border shadow" 56 class="btn btn-light my-auto border shadow"
83 (click)="restarCantidad(producto, i)"> 57 (click)="restarCantidad(producto, i)">
84 <i class="fa fa-minus" aria-hidden="true"></i> 58 <i class="fa fa-minus" aria-hidden="true"></i>
85 </button> 59 </button>
86 </div> 60 </div>
87 </div> 61 </div>
88 </div> 62 </div>
89 </div> 63 </div>
90 </div> 64 </div>
91 65
92 </div> 66 </div>
93 </div> 67 </div>
94 </div> 68 </div>
95 </div> 69 </div>
96 70
97 <div class="row m-0"> 71 <div class="row m-0">
98 <div class="col"> 72 <div class="col">
99 <button 73 <button
100 [disabled]="cantidadRestanteSinonimos > 0" 74 [disabled]="cantidadRestanteSinonimos > 0"
101 type="button" 75 type="button"
102 class="btn btn-block btn-light shadow" 76 class="btn btn-block btn-light shadow"
103 (click)="continuar()"> 77 (click)="continuar()">
104 <span class="font-weight-bold pr-2">Continuar</span> 78 <span class="font-weight-bold pr-2">Continuar</span>
105 <i class="fa fa-check text-success" aria-hidden="true"></i> 79 <i class="fa fa-check text-success" aria-hidden="true"></i>
106 </button> 80 </button>
107 </div> 81 </div>
108 </div> 82 </div>
109 83
110 </div> 84 </div>
src/app/components/popover-sinonimos/popover-sinonimos.component.ts
1 import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core'; 1 import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core';
2 import { PopoverDirective } from 'ngx-bootstrap'; 2 import { PopoverDirective } from 'ngx-bootstrap';
3 import { Producto } from 'src/app/wrappers/producto'; 3 import { Producto } from 'src/app/wrappers/producto';
4 import { Sinonimo } from 'src/app/wrappers/sinonimo'; 4 import { Sinonimo } from 'src/app/wrappers/sinonimo';
5 import { ProductoService } from 'src/app/services/producto.service'; 5 import { ProductoService } from 'src/app/services/producto.service';
6 6
7 @Component({ 7 @Component({
8 selector: 'app-popover-sinonimos', 8 selector: 'app-popover-sinonimos',
9 templateUrl: './popover-sinonimos.component.html', 9 templateUrl: './popover-sinonimos.component.html',
10 styleUrls: ['./popover-sinonimos.component.scss'] 10 styleUrls: ['./popover-sinonimos.component.scss']
11 }) 11 })
12 export class PopoverSinonimosComponent implements OnInit { 12 export class PopoverSinonimosComponent implements OnInit {
13 13
14 //Directiva del popover, para poder cerrarlo desde este componente 14 //Directiva del popover, para poder cerrarlo desde este componente
15 @Input() popover: PopoverDirective; 15 @Input() popover: PopoverDirective;
16 @Input() popoverContent: Sinonimo[]; 16 @Input() popoverContent: Sinonimo[];
17 @Output() productosPersonalizados = new EventEmitter<any>(); 17 @Output() productosPersonalizados = new EventEmitter<Producto[]>();
18 private cantMin: number = 1;
19 private cantMax: number = 50;
20 private cantidadRestanteSinonimos: number = 0; 18 private cantidadRestanteSinonimos: number = 0;
21 private cantidadOriginal: number = 0;
22 private cantidadPromo: number = 1;
23 19
24 constructor(private productoService: ProductoService) { } 20 constructor(private productoService: ProductoService) { }
25 21
26 ngOnInit() { 22 ngOnInit() {
27 23
28 this.popoverContent.forEach(sinonimo => { 24 this.popoverContent.forEach(sinonimo => {
29 25
30 sinonimo.productos.forEach((producto, index) => { 26 sinonimo.productos.forEach((producto, index) => {
31 27
32 if (this.productoService.esPromoPersonalizada) { 28 if (this.productoService.esPromoPersonalizada) {
33 producto.cantidad = producto.cantidad ? producto.cantidad : 0; 29 producto.cantidad = producto.cantidad ? producto.cantidad : 0;
34 this.cantidadRestanteSinonimos = 0; 30 this.cantidadRestanteSinonimos = 0;
35 this.cantidadOriginal = 0;
36 } else { 31 } else {
37 this.cantidadRestanteSinonimos += producto.cantidad ? producto.cantidad : 0; 32 this.cantidadRestanteSinonimos += producto.cantidad ? producto.cantidad : 0;
38 this.cantidadOriginal += producto.cantidad ? producto.cantidad : 0;
39 producto.cantidad = 0; 33 producto.cantidad = 0;
40 } 34 }
41 35
42 }) 36 })
43 }) 37 })
44 } 38 }
45 39
46 continuar() { 40 continuar() {
47 41
48 //Si aún quedan articulos que agregar no deja continuar. 42 //Si aún quedan articulos que agregar no deja continuar.
49 if (this.cantidadRestanteSinonimos > 0) return; 43 if (this.cantidadRestanteSinonimos > 0) return;
50 var productosAenviar: Producto[] = []; 44 var productosAenviar: Producto[] = [];
51 45
52 this.popoverContent.forEach(sinonimo => { 46 this.popoverContent.forEach(sinonimo => {
53 47
54 sinonimo.productos.forEach(producto => { 48 sinonimo.productos.forEach(producto => {
55 49
56 if (producto.cantidad > 0) { 50 if (producto.cantidad > 0) {
57 producto.idSinonimo = sinonimo.ID_SIN; 51 producto.idSinonimo = sinonimo.ID_SIN;
58
59 productosAenviar.push(producto); 52 productosAenviar.push(producto);
60 } 53 }
61 }) 54 })
62 }) 55 })
63 56
64 this.productosPersonalizados.emit({productosAenviar: productosAenviar, cantidadPromo: this.cantidadPromo}); 57 this.productosPersonalizados.emit(productosAenviar);
65 this.popover.hide(); 58 this.popover.hide();
66 } 59 }
67 60
68 sumarCantidad(producto: Producto, i: number) { 61 sumarCantidad(producto: Producto, i: number) {
69 62
70 if (this.cantidadRestanteSinonimos === 0) return; 63 if (this.cantidadRestanteSinonimos === 0) return;
71 producto.cantidad++; 64 producto.cantidad++;
72 this.cantidadRestanteSinonimos--; 65 this.cantidadRestanteSinonimos--;
73 } 66 }
74 67
75 restarCantidad(producto: Producto, i: number) { 68 restarCantidad(producto: Producto, i: number) {
76 69
77 if (this.cantidadRestanteSinonimos === this.popoverContent[i].cantidad) return; 70 if (this.cantidadRestanteSinonimos === this.popoverContent[i].cantidad) return;
78 if (producto.cantidad === 0) return; 71 if (producto.cantidad === 0) return;
79 producto.cantidad--; 72 producto.cantidad--;
80 this.cantidadRestanteSinonimos++; 73 this.cantidadRestanteSinonimos++;
81 } 74 }
82
83 sumarCantidadPromo() {
84
85 if (this.cantidadPromo < this.cantMax) {
86 this.cantidadPromo++;
87 this.cantidadRestanteSinonimos += this.cantidadOriginal;
88 }
89 }
90
91 restarCantidadPromo() {
92
93 if (this.cantidadPromo > this.cantMin) {
94 this.cantidadPromo--;
95 this.cantidadRestanteSinonimos -= this.cantidadOriginal;
96 }
97 }
98
99 } 75 }
100 76
src/app/components/sidebar/sidebar.component.html
1 <div class="disable-user-select d-flex align-items-center flex-column h-100 text-center"> 1 <div class="disable-user-select d-flex align-items-center flex-column h-100 text-center">
2 2
3 <!-- ENCABEZADO --> 3 <!-- ENCABEZADO -->
4 <p class="h4 border-bottom border-white text-white pb-2"> 4 <p class="h4 border-bottom border-white text-white pb-2">
5 Mi compra 5 Mi compra
6 <i class="fa fa-shopping-cart" aria-hidden="true"></i> 6 <i class="fa fa-shopping-cart" aria-hidden="true"></i>
7 </p> 7 </p>
8 8
9 <div class="overflow-scroll px-1 mb-1 w-100"> 9 <div class="overflow-scroll px-1 mb-1 w-100">
10 <!-- PRODUCTOS CARRITO --> 10 <!-- PRODUCTOS CARRITO -->
11 <div class="row m-0" 11 <div class="row m-0"
12 *ngFor="let producto of productosCarrito; let i = index" 12 *ngFor="let producto of productosCarrito; let i = index"
13 [@EnterLeave]="flyIn"> 13 [@EnterLeave]="flyIn">
14 <div class="col p-0 my-1 bg-white border-0 rounded-sm"> 14 <div class="col p-0 my-1 bg-white border-0 rounded-sm">
15 <div class="row m-0"> 15 <div class="row m-0">
16 <div class="col-6 pl-1 pr-0 my-auto"> 16 <div class="col-6 pl-1 pr-0 my-auto">
17 <img 17 <img
18 class="w-100 float-left rounded-sm shadow" 18 class="w-100 float-left rounded-sm shadow"
19 src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}"> 19 src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}">
20 </div> 20 </div>
21 <div class="col-6 px-1"> 21 <div class="col-6 px-1">
22 <!-- BOTONES --> 22 <!-- BOTONES -->
23 <div class="row m-0 d-flex justify-content-between"> 23 <div class="row m-0 d-flex justify-content-between">
24 24
25 <!-- SUMAR - RESTAR CANTIDAD --> 25 <!-- SUMAR - RESTAR CANTIDAD -->
26 <div class="col p-1"> 26 <div class="col p-1">
27 <div class="btn-group-sm btn-group float-left" role="group"> 27 <div class="btn-group-sm btn-group float-left" role="group">
28 <button 28 <button
29 type="button" 29 type="button"
30 class="btn btn-light btn-sm border shadow" 30 class="btn btn-light btn-sm border shadow"
31 (click)="aumentarCantidad(producto)" 31 (click)="aumentarCantidad(producto)">
32 [hidden]="producto.PRO">
33 <i class="fa fa-plus" aria-hidden="true"></i> 32 <i class="fa fa-plus" aria-hidden="true"></i>
34 </button> 33 </button>
35 <div class="bg-white border border-white my-auto px-2 text-dark h5 shadow"> 34 <div class="bg-white border border-white my-auto px-2 text-dark h5 shadow">
36 <small>{{producto.cantidad}}</small> 35 <small>{{producto.cantidad}}</small>
37 </div> 36 </div>
38 <button 37 <button
39 type="button" 38 type="button"
40 class="btn btn-light btn-sm border shadow" 39 class="btn btn-light btn-sm border shadow"
41 (click)="restarCantidad(producto)" 40 (click)="restarCantidad(producto)">
42 [hidden]="producto.PRO">
43 <i class="fa fa-minus" aria-hidden="true"></i> 41 <i class="fa fa-minus" aria-hidden="true"></i>
44 </button> 42 </button>
45 </div> 43 </div>
46 </div> 44 </div>
47 45
48 <!-- PERSONALIZAR --> 46 <!-- PERSONALIZAR -->
49 <div class="col p-1"> 47 <div class="col p-1">
50 <button 48 <button
51 *ngIf="producto.tieneSinonimos" 49 *ngIf="producto.tieneSinonimos"
52 type="button" 50 type="button"
53 class="btn btn-light btn-sm float-left border shadow" 51 class="btn btn-light btn-sm float-left border shadow"
54 (click)="personalizarPromo(producto, i)"> 52 (click)="personalizarPromo(producto, i)">
55 <i class="fa fa-refresh text-purple" aria-hidden="true"></i> 53 <i class="fa fa-refresh text-purple" aria-hidden="true"></i>
56 </button> 54 </button>
57 </div> 55 </div>
58 56
59 <!-- BORRAR --> 57 <!-- BORRAR -->
60 <div class="col p-1"> 58 <div class="col p-1">
61 <button 59 <button
62 type="button" 60 type="button"
63 class="btn btn-secondary btn-sm float-right shadow" 61 class="btn btn-secondary btn-sm float-right shadow"
64 (click)="deleteProducto(producto, i)"> 62 (click)="deleteProducto(producto, i)">
65 <i class="fa fa-trash" aria-hidden="true"></i> 63 <i class="fa fa-trash" aria-hidden="true"></i>
66 </button> 64 </button>
67 </div> 65 </div>
68 </div> 66 </div>
69 </div> 67 </div>
70 </div> 68 </div>
71 <div class="row m-0 shadow rounded-sm"> 69 <div class="row m-0 shadow rounded-sm">
72 <div class="col px-2"> 70 <div class="col px-2">
73 <p class="m-0 text-left h6"><small>{{producto.DetArt}}</small></p> 71 <p class="m-0 text-left h6"><small>{{producto.DetArt}}</small></p>
74 <p class="m-0 text-right font-weight-bold h6">{{producto.PreVen | currency}}</p> 72 <p class="m-0 text-right font-weight-bold h6">{{producto.PreVen | currency}}</p>
75 </div> 73 </div>
76 </div> 74 </div>
77 </div> 75 </div>
78 </div> 76 </div>
79 </div> 77 </div>
80 78
81 <!-- TOTAL --> 79 <!-- TOTAL -->
82 <div class="card rounded-top-sm mx-2 mt-auto blue-gradient border-0"> 80 <div class="card rounded-top-sm mx-2 mt-auto blue-gradient border-0">
83 <div class="card-body p-2 pt-3 row m-0"> 81 <div class="card-body p-2 pt-3 row m-0">
84 <div class="col-12 p-0"> 82 <div class="col-12 p-0">
85 <p 83 <p
86 class="h4 border-bottom border-secondary text-secondary pb-2"> 84 class="h4 border-bottom border-secondary text-secondary pb-2">
87 ({{getCantidadProductos()}}) artículos 85 ({{getCantidadProductos()}}) artículos
88 </p> 86 </p>
89 <p class="h4 text-secondary">Total</p> 87 <p class="h4 text-secondary">Total</p>
90 <p class="h2 font-weight-bold">{{getTotal() | currency}}</p> 88 <p class="h2 font-weight-bold">{{getTotal() | currency}}</p>
91 </div> 89 </div>
92 <div class="col-12 p-0"> 90 <div class="col-12 p-0">
93 <button 91 <button
94 *ngIf="getCantidadProductos() > 0" 92 *ngIf="getCantidadProductos() > 0"
95 type="button" 93 type="button"
96 class="btn btn-block btn-light btn-lg shadow mb-2 p-1" 94 class="btn btn-block btn-light btn-lg shadow mb-2 p-1"
97 routerLink="/confirmacion-carrito"> 95 routerLink="/confirmacion-carrito">
98 <span class="font-weight-bold pr-1">Pagar</span> 96 <span class="font-weight-bold pr-1">Pagar</span>
99 <i class="fa fa-check text-success" aria-hidden="true"></i> 97 <i class="fa fa-check text-success" aria-hidden="true"></i>
100 </button> 98 </button>
101 <button 99 <button
102 type="button" 100 type="button"
103 class="btn btn-block btn-light shadow btn-sm shadow" 101 class="btn btn-block btn-light shadow btn-sm shadow"
104 [routerLink]="['/cancelar-compra']"> 102 [routerLink]="['/cancelar-compra']">
105 <span class="pr-1">Cancelar</span> 103 <span class="pr-1">Cancelar</span>
106 <i class="fa fa-times text-danger" aria-hidden="true"></i> 104 <i class="fa fa-times text-danger" aria-hidden="true"></i>
107 </button> 105 </button>
108 </div> 106 </div>
109 </div> 107 </div>
110 </div> 108 </div>
111 </div> 109 </div>
112 110
src/app/components/sidebar/sidebar.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { Producto } from 'src/app/wrappers/producto'; 2 import { Producto } from 'src/app/wrappers/producto';
3 import { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 import { ProductoService } from 'src/app/services/producto.service'; 4 import { ProductoService } from 'src/app/services/producto.service';
5 import { Router } from '@angular/router'; 5 import { Router } from '@angular/router';
6 import { trigger, state, style, transition, animate } from '@angular/animations'; 6 import { trigger, state, style, transition, animate } from '@angular/animations';
7 7
8 @Component({ 8 @Component({
9 selector: 'app-sidebar', 9 selector: 'app-sidebar',
10 templateUrl: './sidebar.component.html', 10 templateUrl: './sidebar.component.html',
11 styleUrls: ['./sidebar.component.scss'], 11 styleUrls: ['./sidebar.component.scss'],
12 animations: [ 12 animations: [
13 trigger('EnterLeave', [ 13 trigger('EnterLeave', [
14 state('flyIn', style({ transform: 'translateX(0)' })), 14 state('flyIn', style({ transform: 'translateX(0)' })),
15 transition(':enter', [ 15 transition(':enter', [
16 style({ transform: 'translateX(-100%)' }), 16 style({ transform: 'translateX(-100%)' }),
17 animate('0.3s ease-in') 17 animate('0.3s ease-in')
18 ]), 18 ]),
19 transition(':leave', [ 19 transition(':leave', [
20 animate('0.3s ease-out', style({ transform: 'translateX(-100%)' })) 20 animate('0.3s ease-out', style({ transform: 'translateX(-100%)' }))
21 ]) 21 ])
22 ]) 22 ])
23 ] 23 ]
24 }) 24 })
25 export class SidebarComponent implements OnInit { 25 export class SidebarComponent implements OnInit {
26 26
27 private cantTotal: number = 0; 27 private cantTotal: number = 0;
28 private cantMin: number = 1; 28 private cantMin: number = 1;
29 private cantMax: number = 50; 29 private cantMax: number = 50;
30 private total: number = 0; 30 private total: number = 0;
31 private apiImagenes: string = APP_SETTINGS.apiImagenes; 31 private apiImagenes: string = APP_SETTINGS.apiImagenes;
32 32
33 public productosCarrito: Producto[] = []; 33 public productosCarrito: Producto[] = [];
34 34
35 constructor( 35 constructor(
36 private productoService: ProductoService, 36 private productoService: ProductoService,
37 private router: Router) { 37 private router: Router) {
38 this.router.routeReuseStrategy.shouldReuseRoute = function () { 38 this.router.routeReuseStrategy.shouldReuseRoute = function () {
39 return false; 39 return false;
40 } 40 }
41 } 41 }
42 42
43 ngOnInit() { 43 ngOnInit() {
44 44
45 this.productosCarrito = this.productoService.productos; 45 this.productosCarrito = this.productoService.productos;
46 } 46 }
47 47
48 getCantidadProductos() { 48 getCantidadProductos() {
49 49
50 var cantTotalAux = 0; 50 var cantTotalAux = 0;
51 this.productosCarrito.forEach(producto => { 51 this.productosCarrito.forEach(producto => {
52 52
53 cantTotalAux += producto.cantidad; 53 cantTotalAux += producto.cantidad;
54 }); 54 });
55 this.cantTotal = cantTotalAux; 55 this.cantTotal = cantTotalAux;
56 56
57 return this.cantTotal; 57 return this.cantTotal;
58 } 58 }
59 59
60 getTotal() { 60 getTotal() {
61 61
62 var subTotal = 0; 62 var subTotal = 0;
63 for (let i = 0; i < this.productosCarrito.length; i++) { 63 for (let i = 0; i < this.productosCarrito.length; i++) {
64 subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad); 64 subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
65 } 65 }
66 return this.total = subTotal; 66 return this.total = subTotal;
67 } 67 }
68 68
69 aumentarCantidad(producto: Producto) { 69 aumentarCantidad(producto: Producto) {
70 70
71 if (producto.cantidad < this.cantMax) { 71 if (producto.cantidad < this.cantMax) {
72 producto.cantidad++; 72 producto.cantidad++;
73 this.cantTotal++ 73 this.cantTotal++
74 } 74 }
75 } 75 }
76 76
77 restarCantidad(producto: Producto) { 77 restarCantidad(producto: Producto) {
78 78
79 if (producto.cantidad > this.cantMin) { 79 if (producto.cantidad > this.cantMin) {
80 producto.cantidad--; 80 producto.cantidad--;
81 this.cantTotal--; 81 this.cantTotal--;
82 } 82 }
83 } 83 }
84 84
85 deleteProducto(producto: Producto, index: number) { 85 deleteProducto(producto: Producto, index: number) {
86 86
87 this.cantTotal -= producto.cantidad; 87 this.cantTotal -= producto.cantidad;
88 this.total -= producto.PreVen * producto.cantidad; 88 this.total -= producto.PreVen * producto.cantidad;
89 delete producto.cantidad; 89 delete producto.cantidad;
90 this.productosCarrito.splice(index, 1); 90 this.productosCarrito.splice(index, 1);
91 } 91 }
92 92
93 personalizarPromo(producto: Producto, index) { 93 personalizarPromo(producto: Producto, index) {
94 94
95 this.productoService.productoAcargar = producto; 95 this.productoService.productoAcargar = producto;
96 this.productoService.esPromoPersonalizada = true; 96 this.productoService.esPromoPersonalizada = true;
97 this.deleteProducto(producto, index); 97 this.deleteProducto(producto, index);
98 this.router.navigate(['inicio']); 98 this.router.navigate(['inicio']);
99 } 99 }
100 100
101 } 101 }
102 102
src/app/services/cliente.service.ts
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 ClienteService { 8 export class ClienteService {
9 9
10 private urlCliente = APP_SETTINGS.apiClientes; 10 private urlCliente = APP_SETTINGS.apiClientes;
11 11
12 constructor(private http: HttpClient) { } 12 constructor(private http: HttpClient) { }
13 13
14 getClienteById(id: number) { 14 getClienteById(id: number) {
15 return this.http.get(`${this.urlCliente}/get/${id}`); 15 return this.http.get(`${this.urlCliente}/get/${id}`);
16 } 16 }
17 } 17 }
18 18
src/app/services/comanda.service.ts
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 { Observable } from "rxjs"; 4 import { Observable } from "rxjs";
5 5
6 @Injectable({ 6 @Injectable({
7 providedIn: "root" 7 providedIn: "root"
8 }) 8 })
9 export class ComandaService { 9 export class ComandaService {
10 private urlAutoservicio: string = APP_SETTINGS.apiAutoservicio; 10 private urlAutoservicio: string = APP_SETTINGS.apiAutoservicio;
11 11
12 constructor(private http: HttpClient) { } 12 constructor(private http: HttpClient) { }
13 13
14 getAll(): Observable<any> { 14 getAll(): Observable<any> {
15 15
16 return this.http.get(`${this.urlAutoservicio}/comandas`); 16 return this.http.get(`${this.urlAutoservicio}/comandas`);
17 } 17 }
18 18
19 updateComanda(id: number, estado: number, observacion: string): Observable<any> { 19 updateComanda(id: number, estado: number, observacion: string): Observable<any> {
20 20
21 return this.http.get(`${this.urlAutoservicio}/comandas/update/${id}/${estado}/${observacion}`); 21 return this.http.get(`${this.urlAutoservicio}/comandas/update/${id}/${estado}/${observacion}`);
22 } 22 }
23 23
24 getPendientesEntrega() { 24 getPendientesEntrega() {
25 25
26 return this.http.get(`${this.urlAutoservicio}/comandas/pendientes-entrega`);
26 return this.http.get(`${this.urlAutoservicio}/comandas/pendientes-entrega`); 27 }
27 } 28 }
28 } 29
src/app/services/impresora.service.ts
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { HttpClient } from '@angular/common/http'; 3 import { HttpClient } from '@angular/common/http';
4 import { Observable } from 'rxjs/internal/Observable'; 4 import { Observable } from 'rxjs/internal/Observable';
5 5
6 @Injectable({ 6 @Injectable({
7 providedIn: 'root' 7 providedIn: 'root'
8 }) 8 })
9 export class ImpresoraService { 9 export class ImpresoraService {
10 10
11 private urlDeboSuite = APP_SETTINGS.apiDeboSuite; 11 private urlDeboSuite = APP_SETTINGS.apiDeboSuite;
12 12
13 constructor( 13 constructor(
14 private http: HttpClient, 14 private http: HttpClient,
15 ) { } 15 ) { }
16 16
17 getAll(): Observable<any> { 17 getAll(): Observable<any> {
18 18
19 return this.http.get(`${this.urlDeboSuite}/get/impresoras`); 19 return this.http.get(`${this.urlDeboSuite}/get/impresoras`);
20 } 20 }
21 21
22 } 22 }
23 23
src/app/services/producto.service.ts
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 { Observable } from 'rxjs'; 3 import { Observable } from 'rxjs';
4 import { APP_SETTINGS } from 'src/etc/AppSettings'; 4 import { APP_SETTINGS } from 'src/etc/AppSettings';
5 import { Producto } from '../wrappers/producto'; 5 import { Producto } from '../wrappers/producto';
6 import { ClienteService } from './cliente.service'; 6 import { ClienteService } from './cliente.service';
7 7
8 @Injectable({ 8 @Injectable({
9 providedIn: 'root' 9 providedIn: 'root'
10 }) 10 })
11 export class ProductoService { 11 export class ProductoService {
12 12
13 productos: Producto[] = []; 13 productos: Producto[] = [];
14 productoAcargar: Producto; 14 productoAcargar: Producto;
15 promoAcargar: Producto; 15 promoAcargar: Producto;
16 mostrar: string; 16 mostrar: string;
17 esPromoPersonalizada: boolean = false; 17 esPromoPersonalizada: boolean = false;
18 18
19 constructor(private http: HttpClient, private clienteService: ClienteService) { } 19 constructor(private http: HttpClient, private clienteService: ClienteService) { }
20 20
21 getProductoById(id): Observable<any> { 21 getProductoById(id): Observable<any> {
22 22
23 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/${id}`); 23 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/${id}`);
24 } 24 }
25 25
26 getAll(): Observable<any> { 26 getAll(): Observable<any> {
27 27
28 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/`); 28 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/`);
29 } 29 }
30 30
31 getAllWithPaginator(page: number = 1): Observable<any> { 31 getAllWithPaginator(page: number = 1): Observable<any> {
32 32
33 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/${page}`); 33 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/articulos/${page}`);
34 } 34 }
35 35
36 setProductos(producto: Producto) { 36 setProductos(producto: Producto) {
37 37
38 for (let i = 0; i < this.productos.length; i++) { 38 for (let i = 0; i < this.productos.length; i++) {
39 39
40 if (this.productos[i].id === producto.id) { 40 if (this.productos[i].id === producto.id) {
41 41
42 if (producto.PRO) { 42 if (producto.PRO) {
43 if (this.promosIdenticas(this.productos[i], producto)) { 43 if (this.promosIdenticas(this.productos[i], producto)) {
44 this.productos[i].cantidad++; 44 this.productos[i].cantidad++;
45 return; 45 return;
46 } else { 46 } else {
47 break; 47 break;
48 } 48 }
49 } 49 }
50 this.productos[i].cantidad++; 50 this.productos[i].cantidad++;
51 return; 51 return;
52 } 52 }
53 } 53 }
54 54
55 this.productos.unshift(producto); 55 this.productos.unshift(producto);
56 } 56 }
57 57
58 getPromocionByCodigos(sector, codigo): Observable<any> { 58 getPromocionByCodigos(sector, codigo): Observable<any> {
59 59
60 var url = `${APP_SETTINGS.apiAutoservicio}/promociones/by-codigos/${sector}/${codigo}`; 60 var url = `${APP_SETTINGS.apiAutoservicio}/promociones/by-codigos/${sector}/${codigo}`;
61 // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`; 61 // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`;
62 return this.http.get(url); 62 return this.http.get(url);
63 } 63 }
64 64
65 getPromociones(sector, codigo): Observable<any> { 65 getPromociones(sector, codigo): Observable<any> {
66 66
67 var url = `${APP_SETTINGS.apiAutoservicio}/promociones/incluir-articulo/${sector}/${codigo}`; 67 var url = `${APP_SETTINGS.apiAutoservicio}/promociones/incluir-articulo/${sector}/${codigo}`;
68 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; 68 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`;
69 return this.http.get(url); 69 return this.http.get(url);
70 } 70 }
71 71
72 getPromocionSinonimos(sector, codigo): Observable<any> { 72 getPromocionSinonimos(sector, codigo): Observable<any> {
73 73
74 var url = `${APP_SETTINGS.apiAutoservicio}/sinonimos/promo/${sector}/${codigo}`; 74 var url = `${APP_SETTINGS.apiAutoservicio}/sinonimos/promo/${sector}/${codigo}`;
75 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; 75 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`;
76 return this.http.get(url); 76 return this.http.get(url);
77 } 77 }
78 78
79 getCategorias() { 79 getCategorias() {
80 80
81 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/categorias`); 81 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/categorias`);
82 } 82 }
83 83
84 pagar(dataPago: any) { 84 pagar(dataPago: any) {
85 85
86 return new Observable((observer) => { 86 return new Observable((observer) => {
87 87
88 this.clienteService.getClienteById(-1).subscribe(cliente => { 88 this.clienteService.getClienteById(-1).subscribe(cliente => {
89 89
90 let puntoVenta = parseInt(localStorage.getItem('impresoraPVE')); 90 let puntoVenta = parseInt(localStorage.getItem('impresoraPVE'));
91 this.http.post(`${APP_SETTINGS.apiAutoservicio}/comprobante/guardar/${dataPago.medioPago}`, {
91 this.http.post(`${APP_SETTINGS.apiAutoservicio}/comprobante/guardar/${dataPago.medioPago}`, { 92 productos: this.productos,
92 productos: this.productos, 93 cliente: cliente,
93 cliente: cliente, 94 origen: 'autoservicio',
94 origen: 'autoservicio', 95 codigoVendedor: 5,
95 codigoVendedor: 5, 96 puntoVenta: dataPago.medioPago === 9 ? -1 * puntoVenta : puntoVenta,
96 puntoVenta: dataPago.medioPago === 9 ? -1 * puntoVenta : puntoVenta, 97 pedidoAnombreDe: dataPago.pedidoAnombreDe,
97 pedidoAnombreDe: dataPago.pedidoAnombreDe, 98 }).subscribe((data) => {
98 }).subscribe((data) => { 99
99 100 observer.next(data);
100 observer.next(data); 101 observer.complete();
101 observer.complete(); 102 });
102 }); 103 });
103 }); 104 });
104 }); 105 }
105 } 106
106 107 private promosIdenticas(promoEnCarrito: Producto, promo: Producto) {
107 private promosIdenticas(promoEnCarrito: Producto, promo: Producto) { 108
108 109 var sonIdenticas = true;
109 var sonIdenticas = true; 110 var productosPromoCarrito = promoEnCarrito.productos;
110 var productosPromoCarrito = promoEnCarrito.productos; 111 var productosPromoAcargar = promo.productos;
111 var productosPromoAcargar = promo.productos; 112
112 113 if (productosPromoCarrito.length !== productosPromoAcargar.length) {
113 if (productosPromoCarrito.length !== productosPromoAcargar.length) { 114 return false;
114 return false; 115 }
115 } 116
116 117 for (let i = 0; i < productosPromoCarrito.length; i++) {
117 for (let i = 0; i < productosPromoCarrito.length; i++) { 118
118 119 if (productosPromoCarrito[i].id !== productosPromoAcargar[i].id) {
119 if (productosPromoCarrito[i].id !== productosPromoAcargar[i].id) { 120 return false;
120 return false; 121 }
121 } 122 }
122 } 123
123 124 return sonIdenticas;
124 return sonIdenticas; 125 }
125 } 126
126 127 }
127 } 128
src/app/services/punto-venta.service.ts
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { Observable } from 'rxjs/internal/Observable'; 2 import { Observable } from 'rxjs/internal/Observable';
3 import { APP_SETTINGS } from 'src/etc/AppSettings'; 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4 import { HttpClient } from '@angular/common/http'; 4 import { HttpClient } from '@angular/common/http';
5 5
6 @Injectable({ 6 @Injectable({
7 providedIn: 'root' 7 providedIn: 'root'
8 }) 8 })
9 export class PuntoVentaService { 9 export class PuntoVentaService {
10 10
11 private apiAutoservico = APP_SETTINGS.apiAutoservicio; 11 private apiAutoservico = APP_SETTINGS.apiAutoservicio;
12 private apiDeboSuite = APP_SETTINGS.apiDeboSuite;
12 private apiDeboSuite = APP_SETTINGS.apiDeboSuite; 13
13 14 constructor(
14 constructor( 15 private http: HttpClient
15 private http: HttpClient 16 ) { }
16 ) { } 17
17 18 getAll(): Observable<any> {
18 getAll(): Observable<any> { 19
19 20 return this.http.get(`${this.apiAutoservico}/get/puntos-venta`);
20 return this.http.get(`${this.apiAutoservico}/get/puntos-venta`); 21 }
21 } 22
22 23 getByID(id: number): Observable<any> {
23 getByID(id: number): Observable<any> { 24
24 25 return this.http.get(`${this.apiAutoservico}/get/punto-venta/${id}`);
25 return this.http.get(`${this.apiAutoservico}/get/punto-venta/${id}`); 26 }
26 } 27
27 28 getVendedor(filter: any = {}): Observable<any> {
28 getVendedor(filter: any = {}): Observable<any> { 29
29 30 return this.http.get(`${this.apiDeboSuite}/get/vendedor/${JSON.stringify(filter)}`);
30 return this.http.get(`${this.apiDeboSuite}/get/vendedor/${JSON.stringify(filter)}`); 31 }
31 } 32
32 33 }
33 } 34
src/app/services/tarjetas.service.ts
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 { Observable } from 'rxjs'; 3 import { Observable } from 'rxjs';
4 import { APP_SETTINGS } from 'src/etc/AppSettings'; 4 import { APP_SETTINGS } from 'src/etc/AppSettings';
5 5
6 @Injectable({ 6 @Injectable({
7 providedIn: 'root' 7 providedIn: 'root'
8 }) 8 })
9 export class TarjetasService { 9 export class TarjetasService {
10 10
11 constructor(private http: HttpClient) { } 11 constructor(private http: HttpClient) { }
12 12
13 getTarjetas(): Observable<any> { 13 getTarjetas(): Observable<any> {
14 14
15 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/tarjetas`); 15 return this.http.get(`${APP_SETTINGS.apiAutoservicio}/tarjetas`);
16 } 16 }
17 } 17 }
18 18
src/etc/AppSettings ejemplo.ts
1 export const APP_SETTINGS = { 1 export const APP_SETTINGS = {
2 // apiAutoservicio: 'http://10.231.45.117:4705/autoservicio', 2 // apiAutoservicio: 'http://10.231.45.117:4705/autoservicio',
3 // apiDeboSuite: 'http://10.231.45.117:9900',
3 // apiDeboSuite: 'http://10.231.45.117:9900', 4 // apiImagenes: 'http://10.231.45.117:4513/',
4 // apiImagenes: 'http://10.231.45.117:4513/', 5 // apiClientes: 'http://localhost:1515/clientes'
5 // apiClientes: 'http://localhost:1515/clientes' 6 };
6 }; 7