Commit 4bc98d2cad71e697b1119515cbc86a563cd81d71

Authored by Marcelo Puebla
Exists in master and in 1 other branch validar_pve

Merge branch 'master' into 'master'

Master(efernandez)

See merge request !26
src/app/components/busqueda-productos/busqueda-productos.component.html
1 <div class="row m-0 fade-in"> 1 <div class="row m-0 fade-in">
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 py-1 bg-gray text-muted text-center"> 7 <p class="h5 py-1 bg-gray text-muted text-center">
8 Búsqueda 8 Búsqueda
9 <i class="fa fa-search"></i> 9 <i class="fa fa-search"></i>
10 </p> 10 </p>
11 </div> 11 </div>
12 </div> 12 </div>
13 13
14 <div class="row m-3 disable-user-select"> 14 <div class="row m-3 disable-user-select">
15 15
16 <!-- FILTROS --> 16 <!-- FILTROS -->
17 <div class="col-sm-2 p-1"> 17 <div class="col-sm-2 p-1">
18 <div class="text-center"> 18 <div class="text-center">
19 <p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p> 19 <p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p>
20 </div> 20 </div>
21 <ul class="list-group"> 21 <ul class="list-group">
22 <li 22 <li
23 [ngClass]="{active: categoria == 1}" 23 *ngFor="let categoria of categorias"
24 (click)="categoria = 1" 24 [ngClass]="{active: categoriaActive == categoria.id}"
25 (click)="categoriaActive = categoria.id; filterItems()"
25 class="list-group-item list-group-item-action text-center my-1 p-2 h6"> 26 class="list-group-item list-group-item-action text-center my-1 p-2 h6">
26 Combos y Promociones 27 {{categoria.detalle}}
27 </li>
28 <li
29 [ngClass]="{active: categoria == 2}"
30 (click)="categoria = 2"
31 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
32 Todos
33 </li>
34 <li
35 [ngClass]="{active: categoria == 3}"
36 (click)="categoria = 3"
37 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
38 Bebidas
39 </li>
40 <li
41 [ngClass]="{active: categoria == 4}"
42 (click)="categoria = 4"
43 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
44 Sandwichería
45 </li>
46 <li
47 [ngClass]="{active: categoria == 5}"
48 (click)="categoria = 5"
49 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
50 Panaderia
51 </li>
52 <li
53 [ngClass]="{active: categoria == 6}"
54 (click)="categoria = 6"
55 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
56 Golosinas
57 </li>
58 <li
59 [ngClass]="{active: categoria == 7}"
60 (click)="categoria = 7"
61 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
62 Tabaqueria
63 </li> 28 </li>
64 </ul> 29 </ul>
65 </div> 30 </div>
66 31
67 <!-- SEARCH INPUT --> 32 <!-- SEARCH INPUT -->
68 <div *ngIf="productos.length > 0" class="fade-in col-sm-10"> 33 <div *ngIf="productos.length > 0" class="fade-in col-sm-10">
69 34
70 <div class="form-group row search"> 35 <div class="form-group row search">
71 <div class="col-sm-10"> 36 <div class="col-sm-10">
72 <span class="fa fa-search form-control-lg form-control-search pl-3"></span> 37 <span class="fa fa-search form-control-lg form-control-search pl-3"></span>
73 <input 38 <input
74 type="text" 39 type="text"
75 class="form-control form-control-lg shadow-sm rounded-pill px-5" 40 class="form-control form-control-lg shadow-sm rounded-pill px-5"
76 placeholder="Búsqueda productos" 41 placeholder="Búsqueda productos"
77 [(ngModel)]="searchTerm" 42 [(ngModel)]="searchTerm"
78 (ngModelChange)="filterItems()"> 43 (ngModelChange)="filterItems()">
79 </div> 44 </div>
80 <!-- BOTON VOLVER --> 45 <!-- BOTON VOLVER -->
81 <div class="col-sm-2"> 46 <div class="col-sm-2">
82 <button 47 <button
83 type="button" 48 type="button"
84 class="btn btn-light btn-lg shadow-sm" 49 class="btn btn-light btn-lg shadow-sm"
85 [routerLink]="['/inicio']"> 50 [routerLink]="['/inicio']">
86 <span class="font-weight-normal h6 pr-2">Volver</span> 51 <span class="font-weight-normal h6 pr-2">Volver</span>
87 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 52 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
88 </button> 53 </button>
89 </div> 54 </div>
90 </div> 55 </div>
91 <!-- LISTA DE PRODUCTOS --> 56 <!-- LISTA DE PRODUCTOS -->
92 <div class="row align-items-start vh-60 overflow-scroll disable-user-select"> 57 <div class="row align-items-start vh-60 overflow-scroll disable-user-select">
93 <div 58 <div
94 class="col-4 p-2" 59 class="col-4 p-2"
95 *ngFor="let producto of auxProductos"> 60 *ngFor="let producto of auxProductos">
96 <div 61 <div
97 class="card-effect bg-white rounded-sm shadow border-0" 62 class="card-effect bg-white rounded-sm shadow border-0"
98 (click)="mostrarBotonCargar(producto)"> 63 (click)="mostrarBotonCargar(producto)">
99 <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto"> 64 <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto">
100 <div class="p-2"> 65 <div class="p-2">
101 <p class="h6 text-left m-0">{{producto.DetArt}}</p> 66 <p class="h6 text-left m-0">{{producto.DetArt}}</p>
102 <div class="row justify-content-between m-0"> 67 <div class="row justify-content-between m-0">
103 <div class="col-12 p-0"> 68 <div class="col-12 p-0">
104 <div class="text-left"> 69 <div class="text-left">
105 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p> 70 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
106 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p> 71 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p>
107 </div> 72 </div>
108 </div> 73 </div>
109 <div class="col-12 my-auto pt-2 pr-2 p-0"> 74 <div class="col-12 my-auto pt-2 pr-2 p-0">
110 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p> 75 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p>
111 </div> 76 </div>
112 </div> 77 </div>
113 <div *ngIf="producto.showCargarProducto" class="row mt-2"> 78 <div *ngIf="producto.showCargarProducto" class="row mt-2">
114 <div class="col-sm-12"> 79 <div class="col-sm-12">
115 <button 80 <button
116 type="button" 81 type="button"
117 class="btn btn-block btn-outline-primary shadow" 82 class="btn btn-block btn-outline-primary shadow"
118 (click)="elegirProducto(producto)"> 83 (click)="elegirProducto(producto)">
119 Cargar Producto 84 Cargar Producto
120 </button> 85 </button>
121 </div> 86 </div>
122 </div> 87 </div>
123 </div> 88 </div>
124 </div> 89 </div>
125 </div> 90 </div>
126 </div> 91 </div>
127 </div> 92 </div>
128 93
129 <!-- SPINNER --> 94 <!-- SPINNER -->
130 <div *ngIf="productos.length === 0 && showSpinner" class="col-sm-10 align-self-center"> 95 <div *ngIf="productos.length === 0 && showSpinner" class="col-sm-10 align-self-center">
131 <div class="spinner-border spinner-lg text-secondary" role="status"></div> 96 <div class="spinner-border spinner-lg text-secondary" role="status"></div>
132 <span class="text-secondary m-2 h5">Cargando información.</span> 97 <span class="text-secondary m-2 h5">Cargando información.</span>
133 </div> 98 </div>
134 99
135 </div> 100 </div>
136 101
137 </div> 102 </div>
138 103
139 </div> 104 </div>
src/app/components/busqueda-productos/busqueda-productos.component.ts
1 import { Component, OnInit, APP_BOOTSTRAP_LISTENER } from '@angular/core'; 1 import { Component, OnInit, APP_BOOTSTRAP_LISTENER } 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 { appSettings } from 'src/etc/AppSettings'; 5 import { appSettings } from 'src/etc/AppSettings';
5 import { Router } from '@angular/router'; 6 import { Router } from '@angular/router';
6 7
7 @Component({ 8 @Component({
8 selector: 'app-busqueda-productos', 9 selector: 'app-busqueda-productos',
9 templateUrl: './busqueda-productos.component.html', 10 templateUrl: './busqueda-productos.component.html',
10 styleUrls: ['./busqueda-productos.component.scss'] 11 styleUrls: ['./busqueda-productos.component.scss']
11 }) 12 })
12 export class BusquedaProductosComponent implements OnInit { 13 export class BusquedaProductosComponent implements OnInit {
13 14
14 private productos: Producto[] = []; 15 private productos: Producto[] = [];
15 private auxProductos: Producto[] = []; 16 private auxProductos: Producto[] = [];
16 private searchTerm: string = ''; 17 private searchTerm: string = '';
18 private categoriaActive: number = null;
17 private showSpinner: boolean = true; 19 private showSpinner: boolean = true;
18 private categoria: Categorias = Categorias.todos;
19 private apiUrl: string = appSettings.apiUrl; 20 private apiUrl: string = appSettings.apiUrl;
20 private showBtnCargarProducto: boolean = false; 21 private showBtnCargarProducto: boolean = false;
22 private categorias: Categoria[] = [];
21 23
22 constructor( 24 constructor(
23 private productoService: ProductoService, 25 private productoService: ProductoService,
24 private router: Router) { } 26 private router: Router) { }
25 27
26 ngOnInit() { 28 ngOnInit() {
27 29
30 this.productoService.getCategorias()
31 .subscribe((categorias: Categoria[]) => {
32 this.categorias = categorias;
33 this.categoriaActive = categorias[0].id;
34 });
35
28 this.productoService.productoAcargar = undefined; 36 this.productoService.productoAcargar = undefined;
29 this.productoService.getAll() 37 this.productoService.getAll()
30 .subscribe((data: Producto[]) => { 38 .subscribe((data: Producto[]) => {
31 39
32 this.auxProductos = this.productos = data; 40 this.auxProductos = this.productos = data;
33 }, (error) => { 41 }, (error) => {
34 this.showSpinner = false; 42 this.showSpinner = false;
35 console.error(error); 43 console.error(error);
36 }); 44 });
37 } 45 }
38 46
39 filterItems() { 47 filterItems() {
40 48
41 this.auxProductos = this.productos.filter(x => { 49 this.auxProductos = this.productos.filter(x => {
42 return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) 50 return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) &&
51 x.categoria_selfservice == this.categoriaActive;
43 }); 52 });
44 } 53 }
45 54
46 agregarAlCarrito(producto: Producto) { 55 agregarAlCarrito(producto: Producto) {
47 56
48 producto.cantidad = 1; 57 producto.cantidad = 1;
49 this.productoService.productos.push(producto); 58 this.productoService.productos.push(producto);
50 } 59 }
51 60
52 private mostrarBotonCargar(producto: Producto) { 61 private mostrarBotonCargar(producto: Producto) {
53 62
54 for (let i = 0; i < this.auxProductos.length; i++) { 63 for (let i = 0; i < this.auxProductos.length; i++) {
55 if (this.auxProductos[i].id !== producto.id) 64 if (this.auxProductos[i].id !== producto.id)
56 this.auxProductos[i].showCargarProducto = false; 65 this.auxProductos[i].showCargarProducto = false;
57 else if (producto.showCargarProducto) return; 66 else if (producto.showCargarProducto) return;
58 } 67 }
59 producto.showCargarProducto = !producto.showCargarProducto 68 producto.showCargarProducto = !producto.showCargarProducto
60 } 69 }
61 70
62 private elegirProducto(producto: Producto) { 71 private elegirProducto(producto: Producto) {
63 72
64 this.productoService.productoAcargar = producto; 73 this.productoService.productoAcargar = producto;
65 this.router.navigate(['inicio']); 74 this.router.navigate(['inicio']);
66 } 75 }
67 } 76 }
68 77
src/app/components/pago/pago.component.html
1 <div class="row"> 1 <div class="row">
2 2
3 <div class="col-12"> 3 <div class="col-12">
4 4
5 <!-- NOMBRE DE SECCION --> 5 <!-- NOMBRE DE SECCION -->
6 <div class="row m-0"> 6 <div class="row m-0">
7 <div class="col-12 p-0"> 7 <div class="col-12 p-0">
8 <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p> 8 <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p>
9 </div> 9 </div>
10 </div> 10 </div>
11 11
12 <div class="row m-3 d-flex align-items-center"> 12 <div class="row m-3 d-flex align-items-center">
13 <div class="col-4"> 13 <div class="col-4">
14 <h1>Mi Compra <i class="fa fa-shopping-cart "></i></h1> 14 <h1>Mi Compra <i class="fa fa-shopping-cart"></i></h1>
15 </div> 15 </div>
16 <div class="col-8"> 16 <div class="col-8">
17 <h2>Seleccione medio de pago</h2> 17 <h2>Seleccione medio de pago</h2>
18 </div> 18 </div>
19 </div> 19 </div>
20 20
21 </div> 21 </div>
22 22
23 <div class="col-6 card bg-white border-0 shadow rounded mb-auto"> 23 <div class="col-6 card bg-white border-0 shadow rounded mb-auto">
24 <h3>Pago con tarjeta de débito/crédito</h3> 24 <h3>Pago con tarjeta de débito/crédito</h3>
25 <div class="card-body"> 25 <div class="card-body">
26 <img src="{{apiUrl}}/imagenes/posnet.jpg"> 26 <img src="{{apiUrl}}/imagenes/posnet.jpg">
27 </div> 27 </div>
28 </div> 28 </div>
29 29
30 <div class="col-6 card bg-white border-0 shadow rounded mb-auto"> 30 <div class="col-6 card bg-white border-0 shadow rounded mb-auto">
31 <h3>Pago con QR mercado pago</h3> 31 <h3>Pago con QR mercado pago</h3>
32 <div class="card-body"> 32 <div class="card-body">
33 <img src="{{apiUrl}}/imagenes/qrmp.jpg" alt=""> 33 <img src="{{apiUrl}}/imagenes/qrmp.jpg" alt="">
34 </div> 34 </div>
35 </div> 35 </div>
36 </div> 36 </div>
37 37
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 14
15 constructor(private http: HttpClient) { } 15 constructor(private http: HttpClient) { }
16 16
17 getAll(): Observable<any> { 17 getAll(): Observable<any> {
18 18
19 return this.http.get(`${appSettings.apiUrl}/articulos`); 19 return this.http.get(`${appSettings.apiUrl}/articulos`);
20 } 20 }
21 21
22 setProductos(producto: Producto) { 22 setProductos(producto: Producto) {
23 23
24 this.productos.push(producto); 24 this.productos.push(producto);
25 } 25 }
26 26
27 getPromocion(sector, codigo): Observable<any> { 27 getPromocion(sector, codigo): Observable<any> {
28 28
29 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; 29 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`;
30 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; 30 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`;
31 return this.http.get(url); 31 return this.http.get(url);
32 } 32 }
33 33
34 getPromocionSinonimos(sector, codigo): Observable<any> { 34 getPromocionSinonimos(sector, codigo): Observable<any> {
35 35
36 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; 36 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`;
37 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; 37 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`;
38 return this.http.get(url); 38 return this.http.get(url);
39 } 39 }
40 40
41 updateImages(body): Observable<any> { 41 updateImages(body): Observable<any> {
42 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body); 42 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body);
43 } 43 }
44 44
45 getCategorias() {
46 return this.http.get(`${appSettings.apiUrl}/categorias`);
47 }
48
45 } 49 }
46 50
src/app/wrappers/categoria.ts
File was created 1 export interface Categoria {
2 id: number,
3 detalle: string,
4 es_promocion: boolean,
5 vigencia_desde: Date,
6 vigencia_hasta: Date
7 }
src/app/wrappers/producto.ts
1 export interface Producto { 1 export interface Producto {
2 CodSec: number; 2 CodSec: number;
3 CodArt: number; 3 CodArt: number;
4 DetArt: string; 4 DetArt: string;
5 CodRub: number; 5 CodRub: number;
6 Costo: number; 6 Costo: number;
7 PreNet: number; 7 PreNet: number;
8 ImpInt: number; 8 ImpInt: number;
9 UniVen: number; 9 UniVen: number;
10 FecCos: Date; 10 FecCos: Date;
11 UltAct: Date; 11 UltAct: Date;
12 CodPro: number; 12 CodPro: number;
13 ExiDep: number; 13 ExiDep: number;
14 ExiVta: number; 14 ExiVta: number;
15 MinDep: number; 15 MinDep: number;
16 MaxDep: number; 16 MaxDep: number;
17 MinPVE: number; 17 MinPVE: number;
18 MaxPVE: number; 18 MaxPVE: number;
19 ENTTur: number; 19 ENTTur: number;
20 SINTur: number; 20 SINTur: number;
21 SALTur: number; 21 SALTur: number;
22 IvaSN: boolean; 22 IvaSN: boolean;
23 DepSN: boolean; 23 DepSN: boolean;
24 RubMay: number; 24 RubMay: number;
25 PreVen: number; 25 PreVen: number;
26 IvaCO: number; 26 IvaCO: number;
27 TIP: string; 27 TIP: string;
28 IMPIVA: number; 28 IMPIVA: number;
29 ENTADM: number; 29 ENTADM: number;
30 SALADM: number; 30 SALADM: number;
31 CODIIN: number; 31 CODIIN: number;
32 PRO: boolean; 32 PRO: boolean;
33 FPP: boolean; 33 FPP: boolean;
34 ESS: boolean; 34 ESS: boolean;
35 FID: Date; 35 FID: Date;
36 NID: number; 36 NID: number;
37 FIV: Date; 37 FIV: Date;
38 NIV: number; 38 NIV: number;
39 COO: string; 39 COO: string;
40 CAG: string; 40 CAG: string;
41 CAP: number; 41 CAP: number;
42 UTL: number; 42 UTL: number;
43 NHA: boolean; 43 NHA: boolean;
44 PID: boolean; 44 PID: boolean;
45 PRV: number; 45 PRV: number;
46 PRD: number; 46 PRD: number;
47 ImpInt2: number; 47 ImpInt2: number;
48 E_HD: string; 48 E_HD: string;
49 C_HD: string; 49 C_HD: string;
50 CLA: number; 50 CLA: number;
51 UNICAP: number; 51 UNICAP: number;
52 ELBPRO: string; 52 ELBPRO: string;
53 PPP: number; 53 PPP: number;
54 ALI: number; 54 ALI: number;
55 BAL_TIPO: string; 55 BAL_TIPO: string;
56 PER_MAY: boolean; 56 PER_MAY: boolean;
57 ES_MAY: boolean; 57 ES_MAY: boolean;
58 CLA_MAY: number; 58 CLA_MAY: number;
59 PME_CMP: string; 59 PME_CMP: string;
60 USA_BAL: boolean; 60 USA_BAL: boolean;
61 DET_LAR: string; 61 DET_LAR: string;
62 ROTULO: string; 62 ROTULO: string;
63 REC_MANUAL: boolean; 63 REC_MANUAL: boolean;
64 E_HD1: string; 64 E_HD1: string;
65 C_HD1: string; 65 C_HD1: string;
66 ImpInt3: number; 66 ImpInt3: number;
67 FUA_MAE_YPF: Date; 67 FUA_MAE_YPF: Date;
68 CPQ: number; 68 CPQ: number;
69 EPQ: string; 69 EPQ: string;
70 BPQ: number; 70 BPQ: number;
71 PUPQ: number; 71 PUPQ: number;
72 CORVTO: boolean; 72 CORVTO: boolean;
73 CORVTO_COSTO: number; 73 CORVTO_COSTO: number;
74 UTLFR: number; 74 UTLFR: number;
75 FAMILIA: number; 75 FAMILIA: number;
76 ES_LUB: boolean; 76 ES_LUB: boolean;
77 ES_FERT: boolean; 77 ES_FERT: boolean;
78 AutoFac: boolean; 78 AutoFac: boolean;
79 LitrosPCD: number; 79 LitrosPCD: number;
80 LisPCD: number; 80 LisPCD: number;
81 ImpLey23966: boolean; 81 ImpLey23966: boolean;
82 es_bio: boolean; 82 es_bio: boolean;
83 ExpArbaRev: boolean; 83 ExpArbaRev: boolean;
84 ES_AGROQ: boolean; 84 ES_AGROQ: boolean;
85 ES_PLAST: boolean; 85 ES_PLAST: boolean;
86 es_bio_por: string; 86 es_bio_por: string;
87 IMP_IMP_INT: boolean; 87 IMP_IMP_INT: boolean;
88 id: number; 88 id: number;
89 nombreImagen?: any; 89 nombreImagen?: any;
90 90 categoria_selfservice: number;
91 cantidad?: number; 91 cantidad?: number;
92 showCargarProducto?: boolean; 92 showCargarProducto?: boolean;
93 } 93 }
94 94