Commit 9a7ebd7c887ccc78b1891641adc021ba8055294b

Authored by Eric Fernandez
Exists in master and in 1 other branch validar_pve

Merge branch 'master' of http://git.focasoftware.com/angular/autoservicio

src/app/components/home/home.component.html
1 <div class="container-fluid p-0"> 1 <div class="container-fluid p-0">
2 <img 2 <img
3 src="{{apiUrl}}/imagenes/homeBackground.jpg" 3 src="{{apiUrl}}/imagenes/homeBackground.jpg"
4 class="background-image vh-100 w-100"> 4 class="background-image vh-100 w-100">
5 <div class="row m-0"> 5 <div class="row m-0">
6 <div class="col p-0"> 6 <div class="col p-0">
7 <div 7 <div
8 class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select" 8 class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select"
9 [routerLink]="['/inicio']"> 9 [routerLink]="['/inicio']">
10 10
11 <!-- HEADER --> 11 <!-- HEADER -->
12 <div class="row m-0 w-100 bg-primary-gradient-horizontal"> 12 <div class="row m-0 w-100 bg-primary-gradient-horizontal">
13 <div class="col-6 bg-white p-3 rounded-bottom-right"> 13 <div class="col-6 bg-white p-3 rounded-bottom-right">
14 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png"> 14 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png">
15 </div> 15 </div>
16 </div> 16 </div>
17 17
18 <!-- INFO DE BIENVENIDA --> 18 <!-- INFO DE BIENVENIDA -->
19 <div class="row w-100"> 19 <div class="row h-50 w-100">
20 <div class="col-4 offset-2"> 20 <div class="col-4 offset-2 my-auto">
21 21
22 <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel"> 22 <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
23 <div class="carousel-inner"> 23 <div class="carousel-inner">
24 <div class="carousel-item active"> 24 <div class="carousel-item active">
25 <img 25 <img
26 src="{{apiUrl}}/imagenes/coca1.jpg" 26 src="{{apiUrl}}/imagenes/coca1.jpg"
27 class="d-block rounded-sm shadow w-100"> 27 class="d-block rounded-sm shadow w-75 mx-auto">
28 </div> 28 </div>
29 <div class="carousel-item"> 29 <div class="carousel-item">
30 <img 30 <img
31 src="{{apiUrl}}/imagenes/coca2.jpg" 31 src="{{apiUrl}}/imagenes/coca2.jpg"
32 class="d-block rounded-sm shadow w-100"> 32 class="d-block rounded-sm shadow w-75 mx-auto">
33 </div> 33 </div>
34 <div class="carousel-item"> 34 <div class="carousel-item">
35 <img 35 <img
36 src="{{apiUrl}}/imagenes/coca3.jpg" 36 src="{{apiUrl}}/imagenes/coca3.jpg"
37 class="d-block rounded-sm shadow w-100"> 37 class="d-block rounded-sm shadow w-75 mx-auto">
38 </div> 38 </div>
39 </div> 39 </div>
40 </div> 40 </div>
41 41
42 </div> 42 </div>
43 <div class="col-6 text-center text-white my-auto"> 43 <div class="col-6 text-center text-white my-auto">
44 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p> 44 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
45 <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p> 45 <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
46 </div> 46 </div>
47 </div> 47 </div>
48 48
49 <!-- FOOTER --> 49 <!-- FOOTER -->
50 <div class="row m-0 w-100 bg-gray"> 50 <div class="row m-0 w-100 bg-gray">
51 <div class="col-6 bg-white offset-6 p-3 rounded-top-left"> 51 <div class="col-6 bg-white offset-6 p-3 rounded-top-left">
52 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png"> 52 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">
53 </div> 53 </div>
54 </div> 54 </div>
55 55
56 </div> 56 </div>
57 </div> 57 </div>
58 </div> 58 </div>
59 </div> 59 </div>
60 60
src/app/components/inicio/inicio.component.ts
1 import { Component, OnInit, ViewChild, HostListener } from '@angular/core'; 1 import { Component, OnInit, ViewChild, HostListener } from '@angular/core';
2 import { PopoverDirective } from 'ngx-bootstrap'; 2 import { PopoverDirective } from 'ngx-bootstrap';
3 import { appSettings } from 'src/etc/AppSettings'; 3 import { appSettings } 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 { 14 export class InicioComponent implements OnInit {
15 15
16 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) { 16 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) {
17 17
18 if (e.keyCode == 13) { 18 if (e.keyCode == 13) {
19 this.buscarByCodigoBarras(this.busqueda); 19 this.buscarByCodigoBarras(this.busqueda);
20 this.busqueda = ''; 20 this.busqueda = '';
21 } else { 21 } else {
22 this.busqueda += e.key; 22 this.busqueda += e.key;
23 } 23 }
24 24
25 }; 25 };
26 26
27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective; 27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;
28 private tienePromo = false; 28 private tienePromo = false;
29 private productoEsPromo = false; 29 private productoEsPromo = false;
30 private busqueda: string = ''; 30 private busqueda: string = '';
31 31
32 private productoAcargar: Producto; 32 private productoAcargar: Producto;
33 private promoAcargar: Producto; 33 private promoAcargar: Producto;
34 34
35 productos: Producto[] = []; 35 productos: Producto[] = [];
36 promociones: Producto[] = []; 36 promociones: Producto[] = [];
37 sinonimos: Sinonimo[] = []; 37 sinonimos: Sinonimo[] = [];
38 apiUrl: string = appSettings.apiUrl 38 apiUrl: string = appSettings.apiUrl
39 39
40 constructor( 40 constructor(
41 private router: Router, 41 private router: Router,
42 private productoService: ProductoService) { } 42 private productoService: ProductoService) { }
43 43
44 ngOnInit() { 44 ngOnInit() {
45 45
46 this.productoAcargar = this.productoService.productoAcargar; 46 this.productoAcargar = this.productoService.productoAcargar;
47 if (this.productoAcargar) { 47 if (this.productoAcargar) {
48 if (this.productoAcargar.PRO) { 48 if (this.productoAcargar.PRO) {
49 this.promociones.push(this.productoAcargar); 49 this.promociones.push(this.productoAcargar);
50 this.promoSeleccionada(this.productoAcargar); 50 this.promoSeleccionada(this.productoAcargar);
51 } 51 }
52 else 52 else
53 this.getPromociones(); 53 this.getPromociones();
54 } 54 }
55 this.getProductos(); 55 this.getProductos();
56 } 56 }
57 57
58 getPromociones() { 58 getPromociones() {
59 59
60 var sector = this.productoAcargar.CodSec; 60 var sector = this.productoAcargar.CodSec;
61 var codigo = this.productoAcargar.CodArt; 61 var codigo = this.productoAcargar.CodArt;
62 this.productoService.getPromociones(sector, codigo) 62 this.productoService.getPromociones(sector, codigo)
63 .subscribe((res: Producto[]) => { 63 .subscribe((res: Producto[]) => {
64 64
65 if (res.length === 0) { 65 if (res.length === 0) {
66 //Si no tiene promociones la cargará al carrito despues de un tiempo 66 //Si no tiene promociones la cargará al carrito despues de un tiempo
67 // setTimeout(() => { 67 // setTimeout(() => {
68 this.productoAcargar.cantidad = 1; 68 this.productoAcargar.cantidad = 1;
69 this.productoService.productos.push(this.productoAcargar); 69 this.productoService.productos.push(this.productoAcargar);
70 this.productoAcargar = this.productoService.productoAcargar = undefined; 70 this.productoAcargar = this.productoService.productoAcargar = undefined;
71 // }, 2000) 71 // }, 2000)
72 } else { 72 } else {
73 73
74 this.promociones = res; 74 this.promociones = res;
75 this.popoverDirective.show(); 75 this.popoverDirective.show();
76 } 76 }
77 }, error => { console.error(error); }) 77 }, error => { console.error(error); })
78 } 78 }
79 79
80 showPopover() {
81
82 this.popoverDirective.show();
83 }
84
85 getProductos() { 80 getProductos() {
81
86 this.productoService.getAll() 82 this.productoService.getAll()
87 .subscribe((productos: Producto[]) => { 83 .subscribe((productos: Producto[]) => {
88 this.productos = productos; 84 this.productos = productos;
89 }); 85 });
90 } 86 }
91 87
92 irBusquedaProductos(verPromociones) { 88 irBusquedaProductos(verPromociones) {
93 89
94 this.productoService.verCategoriasProductos = verPromociones; 90 this.productoService.verCategoriasProductos = verPromociones;
95 this.router.navigate(['busqueda-productos']); 91 this.router.navigate(['busqueda-productos']);
96 } 92 }
97 93
98 confirmarProducto() { 94 confirmarProducto() {
99 this.promoAcargar.cantidad = 1; 95 var producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar;
100 this.productoService.productos.push(this.promoAcargar); 96 producto.cantidad = 1;
97 this.productoService.productos.push(producto);
101 this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined; 98 this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined;
102 this.promociones = []; 99 this.promociones = [];
103 this.popoverDirective.hide(); 100 this.popoverDirective.hide();
104 } 101 }
105 102
106 deshacerCarga() { 103 deshacerCarga() {
107 104
108 if (this.sinonimos.length > 0) { 105 if (this.sinonimos.length > 0) {
109 this.sinonimos = []; 106 this.sinonimos = [];
110 this.popoverDirective.hide(); 107 this.popoverDirective.hide();
111 } 108 }
112 109
113 if (this.promoAcargar) { 110 if (this.promoAcargar) {
114 this.promoAcargar = undefined; 111 this.promoAcargar = undefined;
115 if (this.productoAcargar.PRO) { 112 if (this.productoAcargar.PRO) {
116 this.productoAcargar = undefined; 113 this.productoAcargar = undefined;
117 this.promociones = []; 114 this.promociones = [];
118 this.popoverDirective.hide(); 115 this.popoverDirective.hide();
119 } else { 116 } else {
120 this.popoverDirective.show(); 117 this.popoverDirective.show();
121 } 118 }
122 } else { 119 } else {
123 this.productoAcargar = undefined; 120 this.productoAcargar = undefined;
124 this.promociones = []; 121 this.promociones = [];
125 this.popoverDirective.hide(); 122 this.popoverDirective.hide();
126 } 123 }
127 } 124 }
128 125
129 promoSeleccionada($event: Producto) { 126 promoSeleccionada($event: Producto) {
130 127
131 this.promoAcargar = $event; 128 if ($event.tieneSinonimos) {
132 this.promoAcargar.tieneSinonimos = true; 129
133 if (this.promoAcargar.tieneSinonimos) { 130 this.productoService.getProductoById($event.id)
134 var sector = this.promoAcargar.CodSec; 131 .subscribe((res : Producto) => {
135 var codigo = this.promoAcargar.CodArt; 132
136 this.productoService.getPromocionSinonimos(sector, codigo) 133 $event.imagenes = res.imagenes;
137 .subscribe((res: Sinonimo[]) => { 134 this.promoAcargar = $event;
135 this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt);
136 },
137 error => { console.log(error); })
138
139
140 } else if (this.popoverDirective) {
141 this.popoverDirective.hide();
142 }
143 }
144
145 getSinonimos(sector, codigo) {
146
147 this.productoService.getPromocionSinonimos(sector, codigo)
148 .subscribe((res: Sinonimo[]) => {
138 149
139 res.forEach(sinonimo => { 150 res.forEach(sinonimo => {
140 151
141 sinonimo.productos.forEach(productoSinonimo => { 152 sinonimo.productos.forEach(productoSinonimo => {
142 153
143 this.promoAcargar.productos.forEach(productoPromo => { 154 this.promoAcargar.productos.forEach(productoPromo => {
144 155
145 if (productoSinonimo.id === productoPromo.id) { 156 if (productoSinonimo.id === productoPromo.id) {
146 sinonimo.cantidad = productoPromo.cantidad; 157 sinonimo.cantidad = productoPromo.cantidad;
147 sinonimo.productoPadre = productoPromo.id; 158 sinonimo.productoPadre = productoPromo.id;
148 } 159 }
149 })
150 }) 160 })
151 }) 161 })
152
153 this.sinonimos = res;
154 if (res.length > 0)
155 this.showPopover();
156 else
157 this.popoverDirective.hide();
158 }) 162 })
159 } else { 163
160 this.popoverDirective.hide(); 164 this.sinonimos = res;
161 } 165 if (res.length > 0)
166 this.popoverDirective.show();
167 else
168 this.popoverDirective.hide();
169 })
162 } 170 }
163 171
164 productosPersonalizados($event: Producto[]) { 172 productosPersonalizados($event: Producto[]) {
165 173
166 var productosPersonalizados = $event; 174 var productosPersonalizados = $event;
167 175
168 this.promoAcargar.productos.forEach(productoPromo => { 176 this.promoAcargar.productos.forEach(productoPromo => {
169 177
170 if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo); 178 if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo);
171 }) 179 })
172 180
173 this.promoAcargar.productos = productosPersonalizados; 181 this.promoAcargar.productos = productosPersonalizados;
174 this.confirmarProducto(); 182 this.confirmarProducto();
175 } 183 }
176 184
177 buscarByCodigoBarras(busqueda) { 185 buscarByCodigoBarras(busqueda) {
178 186
179 let producto = this.productos.filter(producto => { 187 let producto = this.productos.filter(producto => {
180 return producto.codigoBarra == busqueda; 188 return producto.codigoBarra == busqueda;
181 }); 189 });
182 190
183 if (producto.length) { 191 if (producto.length) {
src/app/components/pago/pago.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { appSettings } from 'src/etc/AppSettings'; 2 import { appSettings } 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 { RouterLink, Router } from '@angular/router'; 5 import { RouterLink, Router } from '@angular/router';
6 import { Producto } from 'src/app/wrappers/producto'; 6 import { Producto } from 'src/app/wrappers/producto';
7 7
8 @Component({ 8 @Component({
9 selector: 'app-pago', 9 selector: 'app-pago',
10 templateUrl: './pago.component.html', 10 templateUrl: './pago.component.html',
11 styleUrls: ['./pago.component.scss'] 11 styleUrls: ['./pago.component.scss']
12 }) 12 })
13 export class PagoComponent implements OnInit { 13 export class PagoComponent implements OnInit {
14 14
15 private apiUrl: string = appSettings.apiUrl; 15 private apiUrl: string = appSettings.apiUrl;
16 private verQR: boolean = false; 16 private verQR: boolean = false;
17 private productos: Producto[] = []; 17 private productos: Producto[] = [];
18 private total: number = 0; 18 private total: number = 0;
19 19
20 private compraConQRfinalizada: boolean = false; 20 private compraConQRfinalizada: boolean = false;
21 private compraConEfectivofinalizada: boolean = false; 21 private compraConEfectivofinalizada: boolean = false;
22 22
23 constructor( 23 constructor(
24 private productoService: ProductoService, 24 private productoService: ProductoService,
25 private location: Location, 25 private location: Location,
26 private router: Router, 26 private router: Router,
27 ) { } 27 ) { }
28 28
29 ngOnInit() { 29 ngOnInit() {
30
30 this.productos = this.productoService.productos; 31 this.productos = this.productoService.productos;
31 } 32 }
32 33
33 pagar() { 34 pagar() {
34 35
35 this.verQR = true; 36 this.verQR = true;
36 37
37 this.productoService.pagar() 38 this.productoService.pagar()
38 .subscribe(() => { 39 .subscribe(() => {
39 // alert('Compra finalizada'); 40
41 // alert('Compra finalizada');
40 this.compraConQRfinalizada = true; 42 this.compraConQRfinalizada = true;
41 setTimeout(() => { 43 setTimeout(() => {
42 44
43 this.router.navigate(['mensaje-final']); 45 this.router.navigate(['mensaje-final']);
44 }, 1000); 46 }, 3000);
45 }, err => { 47 }, err => {
46 console.log(err); 48 console.log(err);
47 alert('algo salió mal'); 49 alert('algo salió mal');
48 }) 50 })
49 } 51 }
50 52
51 volverPreviousPage() { 53 volverPreviousPage() {
52 54
53 if (this.verQR) { 55 if (this.verQR) {
54 this.verQR = false; 56 this.verQR = false;
55 return; 57 return;
56 } 58 }
57 this.location.back(); 59 this.location.back();
58 } 60 }
59 61
60 getTotal() { 62 getTotal() {
61 63
62 var subTotal = 0; 64 var subTotal = 0;
63 this.productos.forEach(producto => { 65 this.productos.forEach(producto => {
64 66
65 subTotal = subTotal + (producto.PreVen * producto.cantidad); 67 subTotal = subTotal + (producto.PreVen * producto.cantidad);
66 }); 68 });
67 return this.total = subTotal; 69 return this.total = subTotal;
68 } 70 }
69 71
70 } 72 }
71 73
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 { appSettings } from 'src/etc/AppSettings'; 4 import { appSettings } from 'src/etc/AppSettings';
5 import { Producto } from '../wrappers/producto'; 5 import { Producto } from '../wrappers/producto';
6 6
7 @Injectable({ 7 @Injectable({
8 providedIn: 'root' 8 providedIn: 'root'
9 }) 9 })
10 export class ProductoService { 10 export class ProductoService {
11 11
12 productos: Producto[] = []; 12 productos: Producto[] = [];
13 productoAcargar: Producto; 13 productoAcargar: Producto;
14 promoAcargar: Producto; 14 promoAcargar: Producto;
15 verCategoriasProductos: boolean = true; 15 verCategoriasProductos: boolean = true;
16 16
17 constructor(private http: HttpClient) { } 17 constructor(private http: HttpClient) { }
18 18
19 getProductoById(id): Observable<any> {
20
21 return this.http.get(`${appSettings.apiUrl}/articulos/${id}`);
22 }
23
19 getAll(): Observable<any> { 24 getAll(): Observable<any> {
20 25
21 return this.http.get(`${appSettings.apiUrl}/articulos`); 26 return this.http.get(`${appSettings.apiUrl}/articulos`);
22 } 27 }
23 28
24 setProductos(producto: Producto) { 29 setProductos(producto: Producto) {
25 30
26 this.productos.push(producto); 31 this.productos.push(producto);
27 } 32 }
28 33
29 getPromocionByCodigos(sector, codigo): Observable<any> { 34 getPromocionByCodigos(sector, codigo): Observable<any> {
30 35
31 var url = `${appSettings.apiUrl}/promociones/by-codigos/${sector}/${codigo}`; 36 var url = `${appSettings.apiUrl}/promociones/by-codigos/${sector}/${codigo}`;
32 // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`; 37 // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`;
33 return this.http.get(url); 38 return this.http.get(url);
34 } 39 }
35 40
36 getPromociones(sector, codigo): Observable<any> { 41 getPromociones(sector, codigo): Observable<any> {
37 42
38 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; 43 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`;
39 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; 44 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`;
40 return this.http.get(url); 45 return this.http.get(url);
41 } 46 }
42 47
43 getPromocionSinonimos(sector, codigo): Observable<any> { 48 getPromocionSinonimos(sector, codigo): Observable<any> {
44 49
45 var url = `${appSettings.apiUrl}/sinonimos/promo/${sector}/${codigo}`; 50 var url = `${appSettings.apiUrl}/sinonimos/promo/${sector}/${codigo}`;
46 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; 51 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`;
47 return this.http.get(url); 52 return this.http.get(url);
48 } 53 }
49 54
50 updateImages(body): Observable<any> { 55 updateImages(body): Observable<any> {
51 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body); 56 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body);
52 } 57 }
53 58
54 getCategorias() { 59 getCategorias() {
55 return this.http.get(`${appSettings.apiUrl}/categorias`); 60 return this.http.get(`${appSettings.apiUrl}/categorias`);
56 } 61 }
57 62
58 pagar() { 63 pagar() {
59 return this.http.post(`${appSettings.apiUrl}/comprobante/guardar`, { 64 return this.http.post(`${appSettings.apiUrl}/comprobante/guardar`, {
60 productos: this.productos 65 productos: this.productos
61 }); 66 });
62 } 67 }
63 68
64 } 69 }
65 70