Mauricio Cattafi / autoservicio

Download as
Browse Code »

Commit 9e695afc773b7fbbbea814eb745b3a2bd538c425

Authored by Eric Fernandez
2 parents 57d67af9e7 8a1eca1f9d
Exists in master and in 1 other branch validar_pve

Merge branch 'master' into 'master' 

Master(mpuebla)

See merge request !33
Showing 18 changed files   Show diff stats
src/app/components/amb-imagenes/amb-imagenes.component.html
Diff comments   View file @ 9e695af
1 <app-header></app-header> 1 <app-header></app-header>
2 2
3 <h1>Configuración imágenes</h1> 3 <div class="container-fluid">
4 <br> 4 <div class="row m-3">
5 <span class="fa fa-search form-control-lg form-control-search pl-3"></span> 5 <div class="col">
6 <input 6 <p class="h2">Configuración imágenes</p>
7 type="text" 7 </div>
8 class="form-control form-control-lg shadow-sm rounded-pill px-5" 8 </div>
9 placeholder="Búsqueda productos" 9
10 [(ngModel)]="searchTerm" 10 <div class="row search">
11 (ngModelChange)="filterItems()"> 11 <div class="col">
12 <span class="fa fa-search form-control-lg form-control-search pl-3"></span>
13 <input
14 type="text"
15 class="form-control form-control-lg shadow-sm rounded-pill px-5"
16 placeholder="Búsqueda productos"
17 [(ngModel)]="searchTerm"
18 (ngModelChange)="filterItems()">
19 </div>
20 </div>
21
22 <div class="row m-3 vh-70 overflow-scroll">
23 <div class="col">
24 <h5>Productos</h5>
25 <table class="table">
26 <thead>
27 <tr class="text-center">
28 <th>Nombre</th>
29 <th>Descripción</th>
30 <th colspan="2">Imagen</th>
31 </tr>
32 </thead>
33 <tbody>
34 <tr *ngFor="let articulo of auxProductos">
35 <td>{{articulo.DetArt}}</td>
36 <td>{{articulo.DET_LAR}}</td>
37 <td>
38 <img *ngIf="articulo.imagenes.length" src="{{apiUrl}}/imagenes/{{articulo.imagenes[0].imagen}}">
39 <img id="{{articulo.CodSec + articulo.CodArt}}" [hidden]="articulo.imagenes.length">
40 </td>
41 <td><input type="file" accept="image/*" (change)="onFileSelected($event, articulo)"></td>
42 </tr>
43 </tbody>
44 </table>
45 </div>
46 </div>
12 47
13 <div class="row px-5">
14 <h5>Productos</h5>
src/app/components/amb-imagenes/amb-imagenes.component.scss
Diff comments   View file @ 9e695af
1 .search .form-control-search {
2 position: absolute;
3 z-index: 2;
4 display: block;
5 text-align: center;
6 pointer-events: none;
7 color: #aaa;
8 line-height: inherit;
9 }
10
src/app/components/busqueda-productos/busqueda-productos.component.html
Diff comments   View file @ 9e695af
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 *ngIf="verCategorias" class="col-sm-2 p-1"> 17 <div *ngIf="verCategorias" 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 *ngFor="let categoria of categorias" 23 *ngFor="let categoria of categorias"
24 [ngClass]="{active: categoriaActive == categoria.id}" 24 [ngClass]="{active: categoriaActive == categoria.id}"
25 (click)="categoriaActive = categoria.id; filterItems()" 25 (click)="categoriaActive = categoria.id; filterItems()"
26 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">
27 {{categoria.detalle}} 27 {{categoria.detalle}}
28 </li> 28 </li>
29 </ul> 29 </ul>
30 </div> 30 </div>
31 31
32 <!-- SEARCH INPUT --> 32 <!-- SEARCH INPUT -->
33 <div *ngIf="productos.length > 0" class="fade-in col"> 33 <div *ngIf="productos.length > 0" class="fade-in col">
34 34
35 <div class="form-group row search"> 35 <div class="row search">
36 <div class="col-sm-10"> 36 <div class="col-sm-10">
37 <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>
38 <input 38 <input
39 type="text" 39 type="text"
40 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"
41 placeholder="Búsqueda productos" 41 placeholder="Búsqueda productos"
42 [(ngModel)]="searchTerm" 42 [(ngModel)]="searchTerm"
43 (ngModelChange)="filterItems()"> 43 (ngModelChange)="filterItems()">
44 </div> 44 </div>
45 <!-- BOTON VOLVER --> 45 <!-- BOTON VOLVER -->
46 <div class="col-sm-2"> 46 <div class="col-sm-2">
47 <button 47 <button
48 type="button" 48 type="button"
49 class="btn btn-light btn-lg shadow-sm" 49 class="btn btn-light btn-lg shadow-sm"
50 [routerLink]="['/inicio']"> 50 [routerLink]="['/inicio']">
51 <span class="font-weight-normal h6 pr-2">Volver</span> 51 <span class="font-weight-normal h6 pr-2">Volver</span>
52 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 52 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
53 </button> 53 </button>
54 </div> 54 </div>
55 <div class="col-sm-12 my-2">
56 <span class="badge badge-light px-2">Más vendidos</span>
57 </div>
55 </div> 58 </div>
56 <!-- LISTA DE PRODUCTOS --> 59 <!-- LISTA DE PRODUCTOS -->
57 <div class="row align-items-start vh-70 overflow-scroll disable-user-select"> 60 <div class="row align-items-start vh-70 overflow-scroll disable-user-select">
58 <div 61 <div
59 class="col-4 p-2" 62 class="col-4 p-2"
60 *ngFor="let producto of auxProductos"> 63 *ngFor="let producto of auxProductos">
61 <div 64 <div
62 class="card-effect bg-white rounded-sm shadow border-0" 65 class="card-effect bg-white rounded-sm shadow border-0"
63 (click)="mostrarBotonCargar(producto)"> 66 (click)="elegirProducto(producto)">
64 <img src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto"> 67 <img src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto">
65 <div class="p-2"> 68 <div class="p-2">
66 <p class="h6 text-left m-0">{{producto.DetArt}}</p> 69 <p class="h6 text-left m-0">{{producto.DetArt}}</p>
67 <div class="row justify-content-between m-0"> 70 <div class="row justify-content-between m-0">
68 <div class="col-12 p-0"> 71 <div class="col-12 p-0">
69 <div class="text-left"> 72 <div class="text-left">
70 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p> 73 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
71 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p> 74 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p>
72 </div> 75 </div>
73 </div> 76 </div>
74 <div class="col-12 my-auto pt-2 pr-2 p-0"> 77 <div class="col-12 my-auto pt-2 pr-2 p-0">
75 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p> 78 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p>
76 </div> 79 </div>
77 </div> 80 </div>
78 <div *ngIf="producto.showCargarProducto" class="row mt-2 fade-bottom">
79 <div class="col-sm-12">
80 <button
81 type="button"
82 class="btn btn-block btn-outline-primary shadow"
83 (click)="elegirProducto(producto)">
84 Cargar Producto
85 </button>
86 </div>
87 </div>
88 </div> 81 </div>
89 </div> 82 </div>
90 </div> 83 </div>
91 </div> 84 </div>
92 </div> 85 </div>
93 86
94 <!-- SPINNER --> 87 <!-- SPINNER -->
95 <div 88 <div
96 *ngIf="productos.length === 0 && showSpinner" 89 *ngIf="productos.length === 0 && showSpinner"
97 class="col-sm-10 p-0 align-self-center text-center"> 90 class="col-sm-10 p-0 align-self-center text-center">
98 <div class="spinner-border spinner-lg text-secondary" role="status"></div> 91 <div class="spinner-border spinner-lg text-secondary" role="status"></div>
99 <span class="text-secondary m-2 h5">Cargando información.</span> 92 <span class="text-secondary m-2 h5">Cargando información.</span>
100 </div> 93 </div>
101 94
102 </div> 95 </div>
103 96
104 </div> 97 </div>
src/app/components/busqueda-productos/busqueda-productos.component.ts
Diff comments   View file @ 9e695af
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } 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 { appSettings } from 'src/etc/AppSettings'; 5 import { appSettings } 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 verCategorias: boolean = true; 20 private verCategorias: boolean = true;
21 private apiUrl: string = appSettings.apiUrl; 21 private apiUrl: string = appSettings.apiUrl;
22 private showBtnCargarProducto: boolean = false;
23 private categorias: Categoria[] = []; 22 private categorias: Categoria[] = [];
24 23
25 constructor( 24 constructor(
26 private productoService: ProductoService, 25 private productoService: ProductoService,
27 private router: Router) { } 26 private router: Router) { }
28 27
29 ngOnInit() { 28 ngOnInit() {
30 29
31 this.verCategorias = this.productoService.verCategoriasProductos; 30 this.verCategorias = this.productoService.verCategoriasProductos;
32 31
33 this.productoService.getCategorias() 32 this.productoService.getCategorias()
34 .subscribe((categorias: Categoria[]) => { 33 .subscribe((categorias: Categoria[]) => {
35 this.categorias = categorias; 34 this.categorias = categorias;
36 this.categoriaActive = this.verCategorias ? 1 : categorias[0].id; 35 this.categoriaActive = this.verCategorias ? 1 : categorias[0].id;
37 }); 36 });
38 37
39 this.productoService.productoAcargar = undefined; 38 this.productoService.productoAcargar = undefined;
40 this.productoService.getAll() 39 this.productoService.getAll()
41 .subscribe((data: Producto[]) => { 40 .subscribe((data: Producto[]) => {
42 41
43 this.productos = data; 42 this.productos = data;
44 this.filterItems(); 43 this.filterItems();
45 }, (error) => { 44 }, (error) => {
46 this.showSpinner = false; 45 this.showSpinner = false;
47 console.error(error); 46 console.error(error);
48 }); 47 });
49 } 48 }
50 49
51 filterItems() { 50 filterItems() {
52 51
53 this.auxProductos = this.productos.filter(x => { 52 this.auxProductos = this.productos.filter(x => {
54 return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) && 53 return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) &&
55 x.categoria_selfservice == this.categoriaActive; 54 x.categoria_selfservice == this.categoriaActive;
56 }); 55 });
57 } 56 }
58 57
59 agregarAlCarrito(producto: Producto) { 58 agregarAlCarrito(producto: Producto) {
60 59
61 producto.cantidad = 1; 60 producto.cantidad = 1;
62 this.productoService.productos.push(producto); 61 this.productoService.productos.push(producto);
63 } 62 }
64 63
65 private mostrarBotonCargar(producto: Producto) { 64 private elegirProducto(producto: Producto) {
66 65
67 for (let i = 0; i < this.auxProductos.length; i++) { 66 if (producto.PRO) {
68 if (this.auxProductos[i].id !== producto.id)
69 this.auxProductos[i].showCargarProducto = false;
70 else if (producto.showCargarProducto) return;
71 }
72 producto.showCargarProducto = !producto.showCargarProducto
73 }
74 67
75 private elegirProducto(producto: Producto) { 68 this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)
69 .subscribe(res => {
70
71 this.productoService.productoAcargar = res[0];
72 this.router.navigate(['inicio']);
73 },
74 error => { console.error(error); }
75 );
76 }else {
77
src/app/components/home/home.component.html
Diff comments   View file @ 9e695af
1 <div class="container-fluid p-0"> 1 <div class="container-fluid p-0">
2 <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100"> 2 <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100 w-100">
3 <div class="row m-0"> 3 <div class="row m-0">
4 <div class="col p-0"> 4 <div class="col p-0">
5 <div 5 <div
6 class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select" 6 class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select"
7 [routerLink]="['/inicio']"> 7 [routerLink]="['/inicio']">
8 8
9 <!-- HEADER --> 9 <!-- HEADER -->
10 <div class="row m-0 w-100 bg-primary-gradient-horizontal"> 10 <div class="row m-0 w-100 bg-primary-gradient-horizontal">
11 <div class="col-6 bg-white p-3 rounded-bottom-right"> 11 <div class="col-6 bg-white p-3 rounded-bottom-right">
12 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoaxion.png"> 12 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoaxion.png">
13 </div> 13 </div>
14 </div> 14 </div>
15 15
16 <!-- INFO DE BIENVENIDA --> 16 <!-- INFO DE BIENVENIDA -->
17 <div class="row w-100"> 17 <div class="row w-100">
18 <div class="col-4 offset-2"> 18 <div class="col-4 offset-2">
19 <img src="{{apiUrl}}/imagenes/accesoPLAYA.png" class="w-100"> 19 <img src="{{apiUrl}}/imagenes/accesoPLAYA.png" class="w-100">
20 </div> 20 </div>
21 <div class="col-6 text-center text-white my-auto"> 21 <div class="col-6 text-center text-white my-auto">
22 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p> 22 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
23 <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p> 23 <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
24 </div> 24 </div>
25 </div> 25 </div>
26 26
27 <!-- FOOTER --> 27 <!-- FOOTER -->
28 <div class="row m-0 w-100 bg-gray"> 28 <div class="row m-0 w-100 bg-gray">
29 <div class="col-6 bg-white offset-6 p-3 rounded-top-left"> 29 <div class="col-6 bg-white offset-6 p-3 rounded-top-left">
30 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png"> 30 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">
31 </div> 31 </div>
32 </div> 32 </div>
33 33
34 </div> 34 </div>
35 </div> 35 </div>
36 </div> 36 </div>
37 </div> 37 </div>
38 38
src/app/components/inicio/inicio.component.html
Diff comments   View file @ 9e695af
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">Inicio</p> 7 <p class="h5 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-3 d-flex align-items-start disable-user-select"> 11 <div class="row m-3 d-flex align-items-start disable-user-select">
12 <div class="col-md-5 d-flex align-items-end flex-column"> 12 <div class="col-md-5 d-flex align-items-end flex-column">
13 13
14 <!-- PROMOCIONES --> 14 <!-- PROMOCIONES -->
15 <div 15 <div
16 (click)="irBusquedaProductos(false)" 16 (click)="irBusquedaProductos(false)"
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-7"> 20 <div class="col-7">
21 <p class="h3 card-title">Promociones</p> 21 <p class="h3 card-title">Promociones</p>
22 </div> 22 </div>
23 <div class="col-5 p-0"> 23 <div class="col-5 p-0">
24 <img src="{{apiUrl}}/imagenes/primario.promociones.png" class="icon-dim m-0"> 24 <img src="{{apiUrl}}/imagenes/primario.promociones.png" class="icon-dim 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 <div id="carouselIndicators" class="carousel slide" data-ride="carousel"> 29 <div id="carouselIndicators" class="carousel slide" data-ride="carousel">
30 <div class="carousel-inner"> 30 <div class="carousel-inner">
31 <div class="carousel-item active"> 31 <div class="carousel-item active">
32 <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-100 m-auto rounded"> 32 <img src="{{apiUrl}}/imagenes/beldent.jpg" class="d-block w-75 m-auto rounded">
33 </div> 33 </div>
34 <div class="carousel-item"> 34 <div class="carousel-item">
35 <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-100 m-auto rounded"> 35 <img src="{{apiUrl}}/imagenes/cafe con leche y medialunas.jpg" class="d-block w-75 m-auto rounded">
36 </div> 36 </div>
37 <div class="carousel-item"> 37 <div class="carousel-item">
38 <img src="{{apiUrl}}/imagenes/testImg3.jpg" class="d-block w-100 m-auto rounded"> 38 <img src="{{apiUrl}}/imagenes/Surtido bagley.jpg" class="d-block w-75 m-auto rounded">
39 </div>
40 <div class="carousel-item">
41 <img src="{{apiUrl}}/imagenes/yogurisimo.jpg" class="d-block w-75 m-auto rounded">
39 </div> 42 </div>
40 </div> 43 </div>
41 </div> 44 </div>
42 </div> 45 </div>
43 46
44 <!-- ORDENAR --> 47 <!-- ORDENAR -->
45 <div class="card card-effect bg-white border-0 shadow rounded w-100 mt-4"> 48 <div class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
46 <div class="card-body text-left px-4 py-3"> 49 <div class="card-body text-left px-4 py-3">
47 <div class="row"> 50 <div class="row">
48 <div class="col-5"> 51 <div class="col-5">
49 <p class="h3 card-title">Ordenar Pedido</p> 52 <p class="h3 card-title">Ordenar Pedido</p>
50 </div> 53 </div>
51 <div class="col-7 p-0"> 54 <div class="col-7 p-0">
52 <img src="{{apiUrl}}/imagenes/primario.ordenar.png" class="icon-dim"> 55 <img src="{{apiUrl}}/imagenes/primario.ordenar.png" class="icon-dim">
53 </div> 56 </div>
54 </div> 57 </div>
55 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p> 58 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>
56 </div> 59 </div>
57 <img 60 <img
58 class="card-img-bottom d-block w-100 mx-auto rounded" 61 class="card-img-bottom d-block w-100 mx-auto rounded"
59 src="{{apiUrl}}/imagenes/cafe.jpg"> 62 src="{{apiUrl}}/imagenes/cafe.jpg">
60 </div> 63 </div>
61 </div> 64 </div>
62 65
63 <div class="col-md-7 d-flex align-items-end flex-column mt-4 mt-md-0"> 66 <div class="col-md-7 d-flex align-items-end flex-column mt-4 mt-md-0">
64 67
65 <!-- CARGAR PRODUCTOS --> 68 <!-- CARGAR PRODUCTOS -->
66 <ng-template #popTemplate> 69 <ng-template #popTemplate>
67 <app-popover-promos 70 <app-popover-promos
68 *ngIf="promociones.length > 0 && sinonimos.length === 0" 71 *ngIf="promociones.length > 0 && sinonimos.length === 0"
69 [popover]="popoverDirective" 72 [popover]="popoverDirective"
70 [popoverContent]="promociones" 73 [popoverContent]="promociones"
71 (promoSeleccionada)="promoSeleccionada($event)" 74 (promoSeleccionada)="promoSeleccionada($event)"
72 class="text-white rounded-sm border-0"> 75 class="text-white rounded-sm border-0">
73 </app-popover-promos> 76 </app-popover-promos>
74 <app-popover-sinonimos 77 <app-popover-sinonimos
75 *ngIf="sinonimos.length > 0" 78 *ngIf="sinonimos.length > 0"
76 [popover]="popoverDirective" 79 [popover]="popoverDirective"
77 [popoverContent]="sinonimos" 80 [popoverContent]="sinonimos"
78 (sinonimoSeleccionado)="sinonimoSeleccionado($event)" 81 (productosPersonalizados)="productosPersonalizados($event)"
79 class="text-white rounded-sm border-0"> 82 class="text-white rounded-sm border-0">
80 </app-popover-sinonimos> 83 </app-popover-sinonimos>
81 </ng-template> 84 </ng-template>
82 <div 85 <div
83 placement="left" 86 placement="left"
84 triggers="" 87 triggers=""
85 [popover]="popTemplate" 88 [popover]="popTemplate"
86 class="w-100" 89 class="w-100"
87 #pop="bs-popover"> 90 #pop="bs-popover">
88 <div class="card bg-white border-0 shadow rounded mb-auto"> 91 <div class="card bg-white border-0 shadow rounded mb-auto">
89 <div class="card-body text-left px-4 py-3"> 92 <div class="card-body text-left px-4 py-3">
90 <div class="row"> 93 <div class="row">
91 <div class="col-6"> 94 <div class="col-6">
92 <p class="h3 card-title">Cargar Productos</p> 95 <p class="h3 card-title">Cargar Productos</p>
93 </div> 96 </div>
94 <div class="col-6 p-0"> 97 <div class="col-6 p-0">
95 <img src="{{apiUrl}}/imagenes/escanear.png" class="icon-dim mb-2"> 98 <img src="{{apiUrl}}/imagenes/escanear.png" class="icon-dim mb-2">
96 </div> 99 </div>
97 </div> 100 </div>
98 <p class="h5 card-text text-muted font-weight-light"> 101 <p class="h5 card-text text-muted font-weight-light">
99 Coloque un producto frente<br> 102 Coloque un producto frente<br>
100 al lector de códigos o selecciónelo en pantalla 103 al lector de códigos o selecciónelo en pantalla
101 </p> 104 </p>
102 </div> 105 </div>
103 <div class="row m-4"> 106 <div class="row m-4">
104 <div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm"> 107 <div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm">
105 <!-- IMAGEN DE ESCANER --> 108 <!-- IMAGEN DE ESCANER -->
106 <img 109 <img
107 *ngIf="!productoAcargar" 110 *ngIf="!productoAcargar"
108 class="card-img-top d-block w-100 mx-auto rounded-sm" 111 class="card-img-top d-block w-100 mx-auto rounded-sm"
109 src="{{apiUrl}}/imagenes/escanner.jpg"> 112 src="{{apiUrl}}/imagenes/escanner.jpg">
110 113
111 <!-- PRODUCTO A CARGAR --> 114 <!-- PRODUCTO A CARGAR -->
112 <div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar"> 115 <div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar">
113 <img 116 <img
114 class="card-img-top d-block w-75 mx-auto rounded-sm" 117 class="card-img-top d-block w-75 mx-auto rounded-sm"
115 src="{{apiUrl}}/imagenes/{{productoAcargar.imagenes[0].imagen}}"> 118 src="{{apiUrl}}/imagenes/{{productoAcargar.imagenes[0].imagen}}">
116 119
117 <div class="row justify-content-between m-3"> 120 <div class="row justify-content-between m-3">
118 <div class="col-12 text-left px-1"> 121 <div class="col-12 text-left px-1">
119 <p class="h6 font-weight-bold mb-0">{{productoAcargar.DetArt}}</p> 122 <p class="h6 font-weight-bold mb-0">{{productoAcargar.DetArt}}</p>
120 </div> 123 </div>
121 <div class="col-12 text-right mt-2"> 124 <div class="col-12 text-right mt-2">
122 <p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen | currency}}</p> 125 <p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen | currency}}</p>
123 </div> 126 </div>
124 </div> 127 </div>
125 </div> 128 </div>
126 129
127 <!-- PROMO A CARGAR --> 130 <!-- PROMO A CARGAR -->
128 <div class="fade-in m-0" *ngIf="promoAcargar"> 131 <div class="fade-in m-0" *ngIf="promoAcargar">
129 <img 132 <!-- <img
130 class="card-img-top d-block w-100 mx-auto rounded-sm" 133 class="card-img-top d-block w-100 mx-auto rounded-sm"
131 src="{{apiUrl}}/imagenes/{{promoAcargar.imagenes[0].imagen}}"> 134 src="{{apiUrl}}/imagenes/{{promoAcargar. imagenes[0].imagen}}"> -->
132 135
133 <div class="row justify-content-between m-3"> 136 <div class="row justify-content-between m-3">
134 <div class="col-12 text-left px-1"> 137 <div class="col-12 text-left px-1">
135 <p class="h6 font-weight-bold mb-0">{{promoAcargar.nombrePromo}}</p> 138 <p class="h6 font-weight-bold mb-0">{{promoAcargar.DetArt}}</p>
136 </div> 139 </div>
137 <div class="col-12 text-right mt-2 align-self-end"> 140 <div class="col-12 text-right mt-2 align-self-end">
138 <p class="h5 font-weight-bold mb-0">{{promoAcargar.precioTotal | currency}}</p> 141 <p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen | currency}}</p>
139 </div> 142 </div>
140 </div> 143 </div>
141 </div> 144 </div>
142 145
143 </div> 146 </div>
144 <!-- BOTONES DE CARGAR PRODUCTOS--> 147 <!-- BOTONES DE CARGAR PRODUCTOS-->
145 <div 148 <div
146 class="col-5 pr-0" 149 class="col-5 pr-0"
147 *ngIf="promociones.length > 0"> 150 *ngIf="promociones.length > 0">
148 <button 151 <button
149 *ngIf="sinonimos.length > 0" 152 *ngIf="sinonimos.length > 0"
150 type="button" 153 type="button"
151 class="btn btn-light btn-block shadow-sm" 154 class="btn btn-light btn-block shadow-sm"
152 (click)="pop.show()"> 155 (click)="pop.show()">
153 <span class="pr-2">Personalizar</span> 156 <span class="pr-2">Personalizar</span>
154 <i class="fa fa-hand-o-up text-purple" aria-hidden="true"></i> 157 <i class="fa fa-hand-o-up text-purple" aria-hidden="true"></i>
155 </button> 158 </button>
156 <button 159 <button
157 *ngIf="!promoAcargar" 160 *ngIf="!promoAcargar || sinonimos.length == 0"
158 type="button" 161 type="button"
159 class="btn btn-primary btn-block shadow-sm" 162 class="btn btn-primary btn-block shadow-sm"
160 (click)="pop.show()"> 163 (click)="pop.show()">
161 <span class="pr-2">Mostrar promociones</span> 164 <span class="pr-2">Mostrar promociones</span>
162 <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>
163 </button> 166 </button>
164 <button type="button" class="btn btn-light btn-block shadow-sm my-3"> 167 <button
168 type="button"
169 class="btn btn-light btn-block shadow-sm my-3"
170 (click)="confirmarProducto()">
165 <span class="pr-2 font-weight-bold">Confirmar</span> 171 <span class="pr-2 font-weight-bold">Confirmar</span>
166 <i class="fa fa-check text-success" aria-hidden="true"></i> 172 <i class="fa fa-check text-success" aria-hidden="true"></i>
167 </button> 173 </button>
168 <button 174 <button
169 type="button" 175 type="button"
170 class="btn btn-light btn-block shadow-sm" 176 class="btn btn-light btn-block shadow-sm"
171 (click)="deshacerCarga()"> 177 (click)="deshacerCarga()">
172 <span class="pr-2">Deshacer</span> 178 <span class="pr-2">Deshacer</span>
173 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 179 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
174 </button> 180 </button>
175 </div> 181 </div>
176 </div> 182 </div>
177 </div> 183 </div>
178 </div> 184 </div>
179 185
180 <!-- BUSCAR PRODUCTOS --> 186 <!-- BUSCAR PRODUCTOS -->
181 <div (click)="irBusquedaProductos(true)" 187 <div (click)="irBusquedaProductos(true)"
182 class="card card-effect bg-white border-0 shadow rounded w-100 mt-4"> 188 class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
183 <div class="card-body text-left px-4 py-3"> 189 <div class="card-body text-left px-4 py-3">
184 <div class="row"> 190 <div class="row">
185 <div class="col-6"> 191 <div class="col-6">
186 <p class="h3 card-title">Buscar Productos</p> 192 <p class="h3 card-title">Buscar Productos</p>
187 <p class="h5 card-text text-muted font-weight-light"> 193 <p class="h5 card-text text-muted font-weight-light">
188 Busque aquí los productos<br> 194 Busque aquí los productos<br>
189 que no tienen código </p> 195 que no tienen código </p>
190 </div> 196 </div>
191 <div class="col-6 p-0"> 197 <div class="col-6 p-0">
192 <img src="{{apiUrl}}/imagenes/primario.buscar.png" class="icon-dim mb-2"> 198 <img src="{{apiUrl}}/imagenes/primario.buscar.png" class="icon-dim mb-2">
193 </div> 199 </div>
194 </div> 200 </div>
195 201
196 </div> 202 </div>
197 </div> 203 </div>
198 204
199 </div> 205 </div>
200 206
201 </div> 207 </div>
202 208
203 </div> 209 </div>
204 </div> 210 </div>
205 211
src/app/components/inicio/inicio.component.ts
Diff comments   View file @ 9e695af
1 import { Component, OnInit, ViewChild } 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 { Producto } from 'src/app/wrappers/producto';
5 import { ProductoService } from 'src/app/services/producto.service';
6 import { Router } from '@angular/router'; 4 import { Router } from '@angular/router';
7 import { Promocion } from 'src/app/wrappers/promocion'; 5 import { ProductoService } from 'src/app/services/producto.service';
6 import { Producto } from 'src/app/wrappers/producto';
8 import { Sinonimo } from 'src/app/wrappers/sinonimo'; 7 import { Sinonimo } from 'src/app/wrappers/sinonimo';
9 import { HostListener } from '@angular/core';
10 8
11 @Component({ 9 @Component({
12 selector: 'app-inicio', 10 selector: 'app-inicio',
13 templateUrl: './inicio.component.html', 11 templateUrl: './inicio.component.html',
14 styleUrls: ['./inicio.component.scss'] 12 styleUrls: ['./inicio.component.scss']
15 }) 13 })
16 export class InicioComponent implements OnInit { 14 export class InicioComponent implements OnInit {
17 15
18 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) { 16 @HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) {
19 17
20 if (e.keyCode == 13) { 18 if (e.keyCode == 13) {
21 this.buscarByCodigoBarras(this.busqueda); 19 this.buscarByCodigoBarras(this.busqueda);
22 this.busqueda = ''; 20 this.busqueda = '';
23 } else { 21 } else {
24 this.busqueda += e.key; 22 this.busqueda += e.key;
25 } 23 }
26 24
27 }; 25 };
28 26
29 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective; 27 @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;
30 private productoAcargar: Producto;
31 private productos: Producto[];
32 private promoAcargar: Promocion;
33 private tienePromo = false; 28 private tienePromo = false;
34 private productoEsPromo = false; 29 private productoEsPromo = false;
35 private busqueda: string = ''; 30 private busqueda: string = '';
36 private sinonimoAcargar: Sinonimo;
37 31
38 promociones: Promocion[] = []; 32 private productoAcargar: Producto;
33 private promoAcargar: Producto;
34
35 productos: Producto[] = [];
36 promociones: Producto[] = [];
39 sinonimos: Sinonimo[] = []; 37 sinonimos: Sinonimo[] = [];
40 apiUrl: string = appSettings.apiUrl 38 apiUrl: string = appSettings.apiUrl
41 39
42 constructor( 40 constructor(
43 private router: Router, 41 private router: Router,
44 private productoService: ProductoService) { } 42 private productoService: ProductoService) { }
45 43
46 ngOnInit() { 44 ngOnInit() {
47 45
48 this.productoAcargar = this.productoService.productoAcargar; 46 this.productoAcargar = this.productoService.productoAcargar;
49 this.getPromociones(); 47 if (this.productoAcargar) {
48 if (this.productoAcargar.PRO) {
49 this.promociones.push(this.productoAcargar);
50 this.promoSeleccionada(this.productoAcargar);
51 }
52 else
53 this.getPromociones();
54 }
50 this.getProductos(); 55 this.getProductos();
51 } 56 }
52 57
53 getPromociones() { 58 getPromociones() {
54 if (this.productoAcargar) { 59
55 var sector = this.productoAcargar.CodSec; 60 var sector = this.productoAcargar.CodSec;
56 var codigo = this.productoAcargar.CodArt; 61 var codigo = this.productoAcargar.CodArt;
57 this.productoService.getPromocion(sector, codigo) 62 this.productoService.getPromociones(sector, codigo)
58 .subscribe((res: Promocion[]) => { 63 .subscribe((res: Producto[]) => {
59 64
60 if (res.length === 0) { 65 if (res.length === 0) {
61 //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
62 setTimeout(() => { 67 setTimeout(() => {
63 this.productoService.productos.push(this.productoAcargar); 68 this.productoService.productos.push(this.productoAcargar);
64 this.productoAcargar = undefined; 69 this.productoAcargar = this.productoService.productoAcargar = undefined;
65 }, 2000) 70 }, 2000)
66 } else { 71 } else {
67 72
68 this.promociones = res; 73 this.promociones = res;
69 this.popoverDirective.show(); 74 this.popoverDirective.show();
70 } 75 }
71 }, error => { console.error(error); }) 76 }, error => { console.error(error); })
72 }
73 } 77 }
74 78
75 showPopover() { 79 showPopover() {
76 80
77 this.popoverDirective.show(); 81 this.popoverDirective.show();
78 } 82 }
79 83
80 getProductos() { 84 getProductos() {
81 this.productoService.getAll() 85 this.productoService.getAll()
82 .subscribe((productos: Producto[]) => { 86 .subscribe((productos: Producto[]) => {
83 this.productos = productos; 87 this.productos = productos;
84 }); 88 });
85 } 89 }
86 90
87 private irBusquedaProductos(verPromociones) { 91 irBusquedaProductos(verPromociones) {
88 92
89 this.productoService.verCategoriasProductos = verPromociones; 93 this.productoService.verCategoriasProductos = verPromociones;
90 this.router.navigate(['busqueda-productos']); 94 this.router.navigate(['busqueda-productos']);
91 } 95 }
92 96
97 confirmarProducto() {
98
99 this.productoService.productos.push(this.promoAcargar);
100 this.promoAcargar = undefined;
101 this.productoAcargar = undefined;
102 this.promociones = [];
103 this.popoverDirective.hide();
104 }
105
93 deshacerCarga() { 106 deshacerCarga() {
94 107
95 if (this.sinonimoAcargar || this.sinonimos.length > 0) { 108 if (this.sinonimos.length > 0) {
96 this.sinonimos = []; 109 this.sinonimos = [];
97 this.sinonimoAcargar = undefined;
98 this.popoverDirective.hide(); 110 this.popoverDirective.hide();
99 } 111 }
100 112
101 if (this.promoAcargar) { 113 if (this.promoAcargar) {
102 this.promoAcargar = undefined; 114 this.promoAcargar = undefined;
103 this.popoverDirective.show(); 115 if(this.productoAcargar.PRO){
116 this.productoAcargar = undefined;
117 this.promociones = [];
118 this.popoverDirective.hide();
119 }else{
120 this.popoverDirective.show();
121 }
104 } else { 122 } else {
105 this.productoAcargar = undefined; 123 this.productoAcargar = undefined;
106 this.promociones = []; 124 this.promociones = [];
107 this.popoverDirective.hide(); 125 this.popoverDirective.hide();
108 } 126 }
109 } 127 }
110 128
111 promoSeleccionada($event: Promocion) { 129 promoSeleccionada($event: Producto) {
112 130
113 this.promoAcargar = $event; 131 this.promoAcargar = $event;
114 this.popoverDirective.hide(); 132 this.promoAcargar.tieneSinonimos = true;
115 if (this.promoAcargar.sinonimos) { 133 if (this.promoAcargar.tieneSinonimos) {
116 var sector = this.promoAcargar.sector; 134 var sector = this.promoAcargar.CodSec;
117 var codigo = this.promoAcargar.codigo; 135 var codigo = this.promoAcargar.CodArt;
118 this.productoService.getPromocionSinonimos(sector, codigo) 136 this.productoService.getPromocionSinonimos(sector, codigo)
119 .subscribe((res: Sinonimo[]) => { 137 .subscribe((res: Sinonimo[]) => {
120 138
121 res.forEach(resSinonimo => { 139 res.forEach(sinonimo => {
122 140
123 this.promoAcargar.productos.forEach(productoPromo => { 141 sinonimo.productos.forEach(productoSinonimo => {
124 142
125 if (productoPromo.idSinonimo === resSinonimo.ID_SIN) { 143 this.promoAcargar.productos.forEach(productoPromo => {
126 resSinonimo.cantidad = productoPromo.cantidad;
127 resSinonimo.productoPadre = productoPromo.id;
128 }
129 });
130 144
145 if (productoSinonimo.id === productoPromo.id) {
146 sinonimo.cantidad = productoPromo.cantidad;
147 sinonimo.productoPadre = productoPromo.id;
148 }
149 })
150 })
131 }) 151 })
152
132 this.sinonimos = res; 153 this.sinonimos = res;
133 this.showPopover(); 154 if (res.length > 0)
155 this.showPopover();
134 }) 156 })
157 } else {
158 this.popoverDirective.hide();
135 } 159 }
136 } 160 }
137 161
138 sinonimoSeleccionado($event: Sinonimo) { 162 productosPersonalizados($event: Producto[]) {
163
164 var productosPersonalizados = $event;
165
166 this.promoAcargar.productos.forEach(productoPromo => {
167
168 if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo);
169 })
139 170
140 console.log($event); 171 this.promoAcargar.productos = productosPersonalizados;
141 this.sinonimoAcargar = $event;
142 } 172 }
143 173
144 buscarByCodigoBarras(busqueda) { 174 buscarByCodigoBarras(busqueda) {
145 175
146 let producto = this.productos.filter(producto => { 176 let producto = this.productos.filter(producto => {
147 return producto.codigoBarra == busqueda; 177 return producto.codigoBarra == busqueda;
148 }); 178 });
src/app/components/popover-promos/popover-promos.component.html
Diff comments   View file @ 9e695af
1 <div class="card-body fade-left"> 1 <div class="card-body fade-left">
2 <div class="row"> 2 <div class="row">
3 <div class="col text-left"> 3 <div class="col text-left">
4 <p class="h5 card-title"> 4 <p class="h5 card-title">
5 Este producto forma parte<br> 5 Este producto forma parte<br>
6 de Combos y Promociones 6 de Combos y Promociones
7 </p> 7 </p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="overflow-scroll popover-size pr-2"> 11 <div class="overflow-scroll popover-size pr-2">
12 <div 12 <div
13 class="row my-2" 13 class="row my-2"
14 *ngFor="let promo of popoverContent"> 14 *ngFor="let promo of popoverContent">
15 <div class="col text-dark"> 15 <div class="col text-dark">
16 <div 16 <div
17 class="bg-white card-effect rounded-sm p-2 px-3" 17 class="bg-white card-effect rounded-sm p-2 px-3"
18 (click)="seleccionarPromo(promo)"> 18 (click)="seleccionarPromo(promo)">
19 <div class="row justify-content-between"> 19 <div class="row justify-content-between">
20 <div class="col-12 text-left"> 20 <div class="col-12 text-left">
21 <p class="h5 mb-0"> 21 <p class="h5 mb-0">
22 <small class="font-weight-bold">{{promo.nombrePromo}}</small> 22 <small class="font-weight-bold">{{promo.DetArt}}</small>
23 </p> 23 </p>
24 </div> 24 </div>
25 <div class="col-12 text-right mt-2"> 25 <div class="col-12 text-right mt-2">
26 <p class="h4 font-weight-bold mb-0"> 26 <p class="h4 font-weight-bold mb-0">
27 {{calcularPrecioDePromo(promo) | currency}} 27 {{promo.PreVen | currency}}
28 </p> 28 </p>
29 </div> 29 </div>
30 </div> 30 </div>
31 </div> 31 </div>
32 </div> 32 </div>
33 </div> 33 </div>
34 </div> 34 </div>
35 35
36 <div class="row mt-3 justify-content-end"> 36 <div class="row mt-3 justify-content-end">
37 <div class="col-auto"> 37 <div class="col-auto">
38 <button 38 <button
39 type="button" 39 type="button"
40 class="btn btn-sm btn-light shadow" 40 class="btn btn-sm btn-light shadow"
41 (click)="hide()"> 41 (click)="hide()">
42 <span class="pr-2">No, gracias</span> 42 <span class="pr-2">No, gracias</span>
43 <i class="fa fa-times text-danger" aria-hidden="true"></i> 43 <i class="fa fa-times text-danger" aria-hidden="true"></i>
44 </button> 44 </button>
45 </div> 45 </div>
46 </div> 46 </div>
47 47
48 </div> 48 </div>
49 49
src/app/components/popover-promos/popover-promos.component.ts
Diff comments   View file @ 9e695af
1 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; 1 import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
2 import { PopoverDirective } from 'ngx-bootstrap/popover'; 2 import { PopoverDirective } from 'ngx-bootstrap/popover';
3 import { Promocion } from 'src/app/wrappers/promocion';
4 import { Producto } from 'src/app/wrappers/producto'; 3 import { Producto } from 'src/app/wrappers/producto';
5 4
6 @Component({ 5 @Component({
7 selector: 'app-popover-promos', 6 selector: 'app-popover-promos',
8 templateUrl: './popover-promos.component.html', 7 templateUrl: './popover-promos.component.html',
9 styleUrls: ['./popover-promos.component.scss'] 8 styleUrls: ['./popover-promos.component.scss']
10 }) 9 })
11 export class PopoverPromosComponent implements OnInit { 10 export class PopoverPromosComponent implements OnInit {
12 11
13 @Input() popover: PopoverDirective; 12 @Input() popover: PopoverDirective;
14 @Input() popoverContent: Promocion[]; 13 @Input() popoverContent: Producto[];
15 @Output() promoSeleccionada = new EventEmitter<Promocion>(); 14 @Output() promoSeleccionada = new EventEmitter<Producto>();
16 15
17 constructor() { } 16 constructor() { }
18 17
19 ngOnInit() { 18 ngOnInit() {
20 } 19 }
21 20
22 hide() { 21 hide() {
23 this.popover.hide(); 22 this.popover.hide();
24 } 23 }
25 24
26 seleccionarPromo(promo: Promocion) { 25 seleccionarPromo(promo: Producto) {
27 26
28 this.promoSeleccionada.emit(promo); 27 this.promoSeleccionada.emit(promo);
29 } 28 }
30 29
31 calcularPrecioDePromo(promo: Promocion) { 30 calcularPrecioDePromo(promo: Producto) {
32 31
33 promo.precioTotal = 0; 32 promo.PreVen = 0;
34 promo.productos.forEach(producto => { 33 promo.productos.forEach(producto => {
35 promo.precioTotal += producto.PreVen; 34 promo.PreVen += producto.PreVen;
36 }) 35 })
37 return promo.precioTotal; 36 return promo.PreVen;
38 } 37 }
39 38
40 } 39 }
41 40
src/app/components/popover-sinonimos/popover-sinonimos.component.html
Diff comments   View file @ 9e695af
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 overflow-scroll popover-size pr-2 my-2"> 11 <div class="row m-0 overflow-scroll popover-size pr-2 my-2">
12 <div class="col"> 12 <div class="col">
13 <div class="row mb-2" *ngFor="let sinonimo of popoverContent; let i = index"> 13 <div class="row mb-2" *ngFor="let sinonimo of popoverContent; let i = index">
14 <div class="col"> 14 <div class="col">
15 15
16 <div class="row m-0"> 16 <div class="row m-0">
17 <div class="col text-left"> 17 <div class="col text-left">
18 <p class="h5 card-title"> 18 <p class="h5 card-title">
19 Elija una opción - Cantidad Restante {{cantidadRestanteSinonimos[i]}} 19 Elija una opción - Cantidad Restante {{cantidadRestanteSinonimos[i]}}
20 </p> 20 </p>
21 </div> 21 </div>
22 </div> 22 </div>
23 23
24 <div class="row my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos"> 24 <div class="row my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos">
25 <div class="col-7 pl-4 h6 text-right"> 25 <div class="col-7 pl-2 h6 text-right">
26 <p class="m-0 font-weight-normal"> 26 <p class="m-0 font-weight-normal">
27 {{producto.DetArt}} 27 {{producto.DetArt}}
28 </p> 28 </p>
29 </div> 29 </div>
30 <div class="col-auto"> 30 <div class="col-5">
31 <div class="btn-group float-left my-auto" role="group"> 31 <div class="btn-group float-left my-auto" role="group">
32 <button 32 <button
33 type="button" 33 type="button"
34 class="btn btn-light my-auto border" 34 class="btn btn-light my-auto border shadow"
35 (click)="sumarCantidad(producto, i)"> 35 (click)="sumarCantidad(producto, i)">
36 <i class="fa fa-plus" aria-hidden="true"></i> 36 <i class="fa fa-plus" aria-hidden="true"></i>
37 </button> 37 </button>
38 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5"> 38 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5">
39 <small 39 <small
40 [ngClass]="{'font-weight-bold': producto.cantidad > 0}"> 40 [ngClass]="{'font-weight-bold': producto.cantidad > 0}">
41 {{producto.cantidad}} 41 {{producto.cantidad}}
42 </small> 42 </small>
43 </div> 43 </div>
44 <button 44 <button
45 type="button" 45 type="button"
46 class="btn btn-light my-auto border" 46 class="btn btn-light my-auto border shadow"
47 (click)="restarCantidad(producto, i)"> 47 (click)="restarCantidad(producto, i)">
48 <i class="fa fa-minus" aria-hidden="true"></i> 48 <i class="fa fa-minus" aria-hidden="true"></i>
49 </button> 49 </button>
50 </div> 50 </div>
51 </div> 51 </div>
52 </div> 52 </div>
53 53
54 </div> 54 </div>
55 </div> 55 </div>
56 </div> 56 </div>
57 </div> 57 </div>
58 58
59 <div class="row mt-3 justify-content-end"> 59 <div class="row mt-3 justify-content-end">
60 <div class="col-auto"> 60 <div class="col-auto">
61 <button type="button" class="btn btn-sm btn-light shadow" (click)="hidePopover()"> 61 <button
62 type="button"
63 class="btn btn-sm btn-light shadow"
64 (click)="continuar()">
62 <span class="font-weight-bold pr-2">Continuar</span> 65 <span class="font-weight-bold pr-2">Continuar</span>
63 <i class="fa fa-check text-success" aria-hidden="true"></i> 66 <i class="fa fa-check text-success" aria-hidden="true"></i>
64 </button> 67 </button>
65 </div> 68 </div>
66 </div> 69 </div>
67 70
68 </div> 71 </div>
src/app/components/popover-sinonimos/popover-sinonimos.component.ts
Diff comments   View file @ 9e695af
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 6
6 @Component({ 7 @Component({
7 selector: 'app-popover-sinonimos', 8 selector: 'app-popover-sinonimos',
8 templateUrl: './popover-sinonimos.component.html', 9 templateUrl: './popover-sinonimos.component.html',
9 styleUrls: ['./popover-sinonimos.component.scss'] 10 styleUrls: ['./popover-sinonimos.component.scss']
10 }) 11 })
11 export class PopoverSinonimosComponent implements OnInit { 12 export class PopoverSinonimosComponent implements OnInit {
12 13
13 //Directiva del popover, para poder cerrarlo desde este componente 14 //Directiva del popover, para poder cerrarlo desde este componente
14 @Input() popover: PopoverDirective; 15 @Input() popover: PopoverDirective;
15 @Input() popoverContent: Sinonimo[]; 16 @Input() popoverContent: Sinonimo[];
16 @Output() sinonimoSeleccionado = new EventEmitter<Sinonimo>(); 17 @Output() productosPersonalizados = new EventEmitter<Producto[]>();
17 sinonimo: Sinonimo; 18 // sinonimo: Sinonimo;
18 19
19 private cantidadRestanteSinonimos: number[] = []; 20 private cantidadRestanteSinonimos: number[] = [];
20 21
21 constructor() { } 22 constructor(private productoService: ProductoService) { }
22 23
23 ngOnInit() { 24 ngOnInit() {
24 25
25 //Seteo en la variable a emitir el sinonimo que sea padre 26 //Seteo en la variable a emitir el sinonimo que sea padre
26 this.popoverContent.forEach(sinonimo => { 27 this.popoverContent.forEach(sinonimo => {
27 28
28 this.cantidadRestanteSinonimos.push(0); 29 this.cantidadRestanteSinonimos.push(0);
29 this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined; 30 // this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined;
31
30 sinonimo.productos.forEach(producto => { 32 sinonimo.productos.forEach(producto => {
31 33
32 producto.cantidad = (producto.id === sinonimo.productoPadre) ? sinonimo.cantidad : 0; 34 producto.cantidad = (producto.id === sinonimo.productoPadre) ? sinonimo.cantidad : 0;
33 }) 35 })
34 }) 36 })
35 } 37 }
36 38
37 hidePopover() { 39 continuar() {
38 40
39 this.sinonimoSeleccionado.emit(this.sinonimo); 41 //Si aún quedan articulos que agregar no deja continuar.
40 this.popover.hide(); 42 for (let i = 0; i < this.cantidadRestanteSinonimos.length; i++) {
41 } 43
44 if (this.cantidadRestanteSinonimos[i] > 0) return;
45 }
42 46
43 setSinonimo(sinonimo: Sinonimo) { 47 var productosAenviar: Producto[] = [];
44 48
45 this.sinonimo = sinonimo; 49 this.popoverContent.forEach(sinonimo => {
50
51 sinonimo.productos.forEach(producto => {
52
53 if (producto.cantidad > 0) {
54 producto.idSinonimo = sinonimo.ID_SIN;
55 productosAenviar.push(producto);
56 }
57 })
58
59 })
60
61 this.productosPersonalizados.emit(productosAenviar);
62 this.popover.hide();
46 } 63 }
47 64
48 sumarCantidad(producto: Producto, i: number) { 65 sumarCantidad(producto: Producto, i: number) {
49 66
50 if (this.cantidadRestanteSinonimos[i] === 0) return; 67 if (this.cantidadRestanteSinonimos[i] === 0) return;
51 producto.cantidad++; 68 producto.cantidad++;
52 this.cantidadRestanteSinonimos[i]--; 69 this.cantidadRestanteSinonimos[i]--;
53 } 70 }
54 71
55 restarCantidad(producto: Producto, i: number) { 72 restarCantidad(producto: Producto, i: number) {
56 73
57 if (this.cantidadRestanteSinonimos[i] === this.popoverContent[i].cantidad) return; 74 if (this.cantidadRestanteSinonimos[i] === this.popoverContent[i].cantidad) return;
58 if (producto.cantidad === 0) return; 75 if (producto.cantidad === 0) return;
59 producto.cantidad--; 76 producto.cantidad--;
60 this.cantidadRestanteSinonimos[i]++; 77 this.cantidadRestanteSinonimos[i]++;
61 } 78 }
62 79
63 } 80 }
64 81
src/app/components/sidebar/sidebar.component.html
Diff comments   View file @ 9e695af
1 <div class="disable-user-select d-flex align-items-center flex-column h-100 pt-2 text-center"> 1 <div class="disable-user-select d-flex align-items-center flex-column h-100 pt-2 text-center">
2 2
3 <p class="h4 border-bottom border-white text-white mt-4 pb-2"> 3 <p class="h4 border-bottom border-white text-white mt-4 pb-2">
4 Mi compra 4 Mi compra
5 <i class="fa fa-shopping-cart" aria-hidden="true"></i> 5 <i class="fa fa-shopping-cart" aria-hidden="true"></i>
6 </p> 6 </p>
7 7
8 <div class="overflow-auto overflow-scroll mb-2 w-100"> 8 <div class="overflow-auto overflow-scroll mb-2 w-100">
9 <!-- PRODUCTOS CARRITO --> 9 <!-- PRODUCTOS CARRITO -->
10 <div 10 <div
11 class="slide-in-bl my-2 bg-white border-0 rounded-sm" 11 class="slide-in-bl my-2 bg-white border-0 rounded-sm"
12 *ngFor="let producto of productosCarrito.slice().reverse(); let i = index"> 12 *ngFor="let producto of productosCarrito.slice().reverse(); let i = index">
13 <img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}"> 13 <!-- <img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}"> -->
14 <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm"> 14 <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">
15 <div class="col-12 p-0 pt-2 text-left my-auto"> 15 <div class="col-12 p-0 pt-2 text-left my-auto">
16 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p> 16 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
17 <p class="m-0 h6"><small>COD: {{producto.CodRub}}</small></p> 17 <p class="m-0 h6"><small>COD: {{producto.CodRub}}</small></p>
18 </div> 18 </div>
19 <div class="col-12 pr-1 text-right h6 my-auto "> 19 <div class="col-12 pr-1 text-right h6 my-auto ">
20 <p class="m-0">{{producto.PreVen | currency}}</p> 20 <p class="m-0">{{producto.PreVen | currency}}</p>
21 </div> 21 </div>
22 </div> 22 </div>
23 <div class="row m-0 p-0"> 23 <div class="row m-0 p-0">
24 <div class="col-6 px-2 my-2"> 24 <div class="col-6 px-2 my-2">
25 <div class="btn-group-sm btn-group float-left my-auto" role="group"> 25 <div class="btn-group-sm btn-group float-left my-auto" role="group">
26 <button type="button" class="btn btn-light btn-sm my-auto border" (click)="aumentarContador(i)"> 26 <button type="button" class="btn btn-light btn-sm my-auto border" (click)="aumentarContador(i)">
27 <i class="fa fa-plus" aria-hidden="true"></i> 27 <i class="fa fa-plus" aria-hidden="true"></i>
28 </button> 28 </button>
29 <div class="bg-white border border-white px-3 my-auto text-dark h5"> 29 <div class="bg-white border border-white px-3 my-auto text-dark h5">
30 <small>{{producto.cantidad}}</small> 30 <small>{{producto.cantidad}}</small>
31 </div> 31 </div>
32 <button type="button" class="btn btn-light btn-sm my-auto border" (click)="decrementarContador(i)"> 32 <button type="button" class="btn btn-light btn-sm my-auto border" (click)="decrementarContador(i)">
33 <i class="fa fa-minus" aria-hidden="true"></i> 33 <i class="fa fa-minus" aria-hidden="true"></i>
34 </button> 34 </button>
35 </div> 35 </div>
36 </div> 36 </div>
37 <div class="col-6 px-2 my-2"> 37 <div class="col-6 px-2 my-2">
38 <div class="btn-group-sm btn-group float-right my-auto" role="group"> 38 <div class="btn-group-sm btn-group float-right my-auto" role="group">
39 <button type="button" class="btn btn-light btn-sm my-auto float-left border mr-2"> 39 <button
40 *ngIf="esPersonalizable(producto)"
41 type="button"
42 class="btn btn-light btn-sm my-auto float-left border mr-2"
43 (click)="personalizarPromo">
40 <i class="fa fa-hand-o-up" aria-hidden="true"></i> 44 <i class="fa fa-hand-o-up" aria-hidden="true"></i>
41 </button> 45 </button>
42 <button type="button" class="btn btn-secondary btn-sm my-auto ml-2" (click)="deleteProducto(i)"> 46 <button type="button" class="btn btn-secondary btn-sm my-auto ml-2" (click)="deleteProducto(i)">
43 <i class="fa fa-times" aria-hidden="true"></i> 47 <i class="fa fa-times" aria-hidden="true"></i>
44 </button> 48 </button>
45 </div> 49 </div>
46 </div> 50 </div>
47 </div> 51 </div>
48 </div> 52 </div>
49 </div> 53 </div>
50 54
51 <!-- TOTAL --> 55 <!-- TOTAL -->
52 <div class="card rounded-top-sm mt-auto blue-gradient border-0"> 56 <div class="card rounded-top-sm mt-auto blue-gradient border-0">
53 <div class="card-body row"> 57 <div class="card-body row">
54 <div class="col-12"> 58 <div class="col-12">
55 <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont === 1">({{cont}}) item</p> 59 <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont === 1">({{cont}}) item</p>
56 <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont > 1">({{cont}}) items</p> 60 <p class="h4 border-bottom border-secondary text-secondary pb-2" *ngIf="cont > 1">({{cont}}) items</p>
57 <p class="h3 text-secondary">Total</p> 61 <p class="h3 text-secondary">Total</p>
58 <p class="h3 font-weight-bold">{{getTotal() | currency}}</p> 62 <p class="h3 font-weight-bold">{{getTotal() | currency}}</p>
59 </div> 63 </div>
60 <div class="col-12"> 64 <div class="col-12">
61 <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1" routerLink="/confirmacion-carrito"> 65 <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1" routerLink="/confirmacion-carrito">
62 <span class="font-weight-bold pr-1">Finalizar y Pagar</span> 66 <span class="font-weight-bold pr-1">Finalizar y Pagar</span>
63 <i class="fa fa-check text-success" aria-hidden="true"></i> 67 <i class="fa fa-check text-success" aria-hidden="true"></i>
64 </button> 68 </button>
65 <button 69 <button
66 type="button" 70 type="button"
67 class="btn btn-block btn-light shadow btn-sm shadow" 71 class="btn btn-block btn-light shadow btn-sm shadow"
68 [routerLink]="['/cancelar-compra']"> 72 [routerLink]="['/cancelar-compra']">
69 <span class="pr-1">Cancelar</span> 73 <span class="pr-1">Cancelar</span>
70 <i class="fa fa-times text-danger" aria-hidden="true"></i> 74 <i class="fa fa-times text-danger" aria-hidden="true"></i>
71 </button> 75 </button>
72 </div> 76 </div>
73 </div> 77 </div>
74 </div> 78 </div>
75 </div> 79 </div>
76 80
src/app/components/sidebar/sidebar.component.ts
Diff comments   View file @ 9e695af
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 { appSettings } from 'src/etc/AppSettings'; 3 import { appSettings } from 'src/etc/AppSettings';
4 import { ProductoService } from 'src/app/services/producto.service'; 4 import { ProductoService } from 'src/app/services/producto.service';
5 5
6 6
7 @Component({ 7 @Component({
8 selector: 'app-sidebar', 8 selector: 'app-sidebar',
9 templateUrl: './sidebar.component.html', 9 templateUrl: './sidebar.component.html',
10 styleUrls: ['./sidebar.component.scss'], 10 styleUrls: ['./sidebar.component.scss'],
11 }) 11 })
12 export class SidebarComponent implements OnInit { 12 export class SidebarComponent implements OnInit {
13 13
14 private cont: number = 1; 14 private cont: number = 1;
15 private min: number = 1; 15 private min: number = 1;
16 private max: number = 50; 16 private max: number = 50;
17 private total: number = 0; 17 private total: number = 0;
18 private apiUrl: string = appSettings.apiUrl; 18 private apiUrl: string = appSettings.apiUrl;
19 19
20 public productosCarrito: Producto[] = []; 20 public productosCarrito: Producto[] = [];
21 21
22 constructor(private productoService: ProductoService) { 22 constructor(private productoService: ProductoService) {
23 23
24 this.productosCarrito = this.productoService.productos; 24 this.productosCarrito = this.productoService.productos;
25 } 25 }
26 26
27 ngOnInit() { 27 ngOnInit() {
28 28
29 } 29 }
30 30
31 getCantidadProductos() { 31 getCantidadProductos() {
32 32
33 for (let i = 0; i < this.productosCarrito.length; i++) { 33 for (let i = 0; i < this.productosCarrito.length; i++) {
34 this.productosCarrito[i].cantidad = 1 34 this.productosCarrito[i].cantidad = 1
35 this.cont++; 35 this.cont++;
36 } 36 }
37 return this.cont; 37 return this.cont;
38 } 38 }
39 39
40 getTotal() { 40 getTotal() {
41 41
42 let subTotal = 0; 42 let subTotal = 0;
43 for (let i = 0; i < this.productosCarrito.length; i++) { 43 for (let i = 0; i < this.productosCarrito.length; i++) {
44 subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad); 44 subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
45 } 45 }
46 return this.total = subTotal; 46 return this.total = subTotal;
47 } 47 }
48 48
49 public aumentarContador(index) { 49 public aumentarContador(index) {
50 50
51 this.cont++; 51 this.cont++;
52 for (let i = 0; i < this.productosCarrito.length; i++) { 52 for (let i = 0; i < this.productosCarrito.length; i++) {
53 if (i === index) { 53 if (i === index) {
54 this.total = this.total + this.productosCarrito[i].PreVen; 54 this.total = this.total + this.productosCarrito[i].PreVen;
55 return (this.productosCarrito[i].cantidad === this.max) ? 55 return (this.productosCarrito[i].cantidad === this.max) ?
56 this.productosCarrito[i].cantidad : this.productosCarrito[i].cantidad++; 56 this.productosCarrito[i].cantidad : this.productosCarrito[i].cantidad++;
57 57
58 } 58 }
59 } 59 }
60 } 60 }
61 61
62 decrementarContador(index) { 62 decrementarContador(index) {
63 63
64 for (let i = 0; i < this.productosCarrito.length; i++) { 64 for (let i = 0; i < this.productosCarrito.length; i++) {
65 if (i === index && this.productosCarrito[i].cantidad > this.min) { 65 if (i === index && this.productosCarrito[i].cantidad > this.min) {
66 this.productosCarrito[i].cantidad--; 66 this.productosCarrito[i].cantidad--;
67 this.cont--; 67 this.cont--;
68 break; 68 break;
69 } 69 }
70 } 70 }
71 71
72 this.getTotal() 72 this.getTotal()
73 } 73 }
74 74
75 setCantidadItems() { 75 setCantidadItems() {
76 76
77 this.cont = 0; 77 this.cont = 0;
78 for (let i = 0; i < this.productosCarrito.length; i++) { 78 for (let i = 0; i < this.productosCarrito.length; i++) {
79 this.cont += this.productosCarrito[i].cantidad; 79 this.cont += this.productosCarrito[i].cantidad;
80 } 80 }
81 } 81 }
82 82
83 deleteProducto(index: number) { 83 deleteProducto(index: number) {
84 84
85 for (let i = 0; i < this.productosCarrito.length; i++) { 85 for (let i = 0; i < this.productosCarrito.length; i++) {
86 if (i === index) { 86 if (i === index) {
87 this.cont -= this.productosCarrito[i].cantidad; 87 this.cont -= this.productosCarrito[i].cantidad;
88 //Elimina del total el PreVen de todo el item 88 //Elimina del total el PreVen de todo el item
89 this.total = this.total - (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad); 89 this.total = this.total - (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
90 this.productosCarrito.reverse().splice(i, 1); 90 this.productosCarrito.reverse().splice(i, 1);
91 return; 91 return;
92 } 92 }
93 } 93 }
94 } 94 }
95 95
96 cleanCarrito() { 96 cleanCarrito() {
97 97
98 this.productoService.productos = this.productosCarrito = []; 98 this.productoService.productos = this.productosCarrito = [];
99 this.total = 0; 99 this.total = 0;
100 this.cont = 0; 100 this.cont = 0;
101 } 101 }
102
103 esPersonalizable(producto: Producto) {
104
105 var esPersonalizable: boolean = false;
106 if (producto.tieneSinonimos)
107 esPersonalizable = true;
108
109 return esPersonalizable;
110 }
111
102 } 112 }
103 113
src/app/services/producto.service.ts
Diff comments   View file @ 9e695af
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 verCategoriasProductos: boolean = true; 15 verCategoriasProductos: boolean = true;
15 16
16 constructor(private http: HttpClient) { } 17 constructor(private http: HttpClient) { }
17 18
18 getAll(): Observable<any> { 19 getAll(): Observable<any> {
19 20
20 return this.http.get(`${appSettings.apiUrl}/articulos`); 21 return this.http.get(`${appSettings.apiUrl}/articulos`);
21 } 22 }
22 23
23 setProductos(producto: Producto) { 24 setProductos(producto: Producto) {
24 25
25 this.productos.push(producto); 26 this.productos.push(producto);
26 } 27 }
27 28
28 getPromocion(sector, codigo): Observable<any> { 29 getPromocionByCodigos(sector, codigo): Observable<any> {
30
31 var url = `${appSettings.apiUrl}/promociones/by-codigos/${sector}/${codigo}`;
32 // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`;
33 return this.http.get(url);
34 }
35
36 getPromociones(sector, codigo): Observable<any> {
29 37
30 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; 38 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`;
31 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; 39 // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`;
32 return this.http.get(url); 40 return this.http.get(url);
33 } 41 }
34 42
35 getPromocionSinonimos(sector, codigo): Observable<any> { 43 getPromocionSinonimos(sector, codigo): Observable<any> {
36 44
37 var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; 45 var url = `${appSettings.apiUrl}/sinonimos/promo/${sector}/${codigo}`;
38 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; 46 // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`;
39 return this.http.get(url); 47 return this.http.get(url);
40 } 48 }
41 49
42 updateImages(body): Observable<any> { 50 updateImages(body): Observable<any> {
43 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body); 51 return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body);
44 } 52 }
45 53
46 getCategorias() { 54 getCategorias() {
47 return this.http.get(`${appSettings.apiUrl}/categorias`); 55 return this.http.get(`${appSettings.apiUrl}/categorias`);
48 } 56 }
49 57
50 } 58 }
51 59
src/app/wrappers/producto.ts
Diff comments   View file @ 9e695af
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 categoria_selfservice: number; 90 categoria_selfservice: number;
91 cantidad?: number; 91 cantidad?: number;
92 showCargarProducto?: boolean;
93 esPadre?: boolean; 92 esPadre?: boolean;
94 codigoBarra: string; 93 codigoBarra: string;
95 idSinonimo?: number; 94 idSinonimo?: number;
95 productos?: Producto[];
96 tieneSinonimos?: boolean;
96 } 97 }
src/app/wrappers/promocion.ts
View file @ 9e695af
1 import { Producto } from './producto'; File was deleted
2
3 export interface Promocion {
4 idPromo: number;
5 nombrePromo: string;
6 productos: Producto[];
7 sinonimos: boolean;
8 sector: number,
9 codigo: number,
10 precioTotal? : number,
11 }
12 1 import { Producto } from './producto';
src/assets/scss/bootstrap-override.scss
Diff comments   View file @ 9e695af
1 @import "../../../node_modules/bootstrap/scss/functions"; 1 @import "../../../node_modules/bootstrap/scss/functions";
2 @import "../../../node_modules/bootstrap/scss/variables"; 2 @import "../../../node_modules/bootstrap/scss/variables";
3 @import "../../../node_modules/bootstrap/scss/mixins"; 3 @import "../../../node_modules/bootstrap/scss/mixins";
4 4
5 $primary: #2872ae; 5 $primary: #2872ae;
6 6
7 $theme-colors: ( 7 $theme-colors: (
8 primary: $primary, 8 primary: $primary,
9 light: white 9 light: white
10 ); 10 );
11 11
12 .popover { 12 .popover {
13 transform: translate3d(-480px, 0, -34px) !important; 13 transform: translate3d(-425px, 0, -34px) !important;
14 min-width: 485px !important; 14 min-width: 350px !important;
15 max-width: 485px !important; 15 max-width: 425px !important;
16 border: none !important; 16 border: none !important;
17 border-radius: 1.5rem !important; 17 border-radius: 1.5rem !important;
18 padding: 0 !important; 18 padding: 0 !important;
19 background-color: $primary !important; 19 background-color: $primary !important;
20 .popover-body { 20 .popover-body {
21 padding: 0 !important; 21 padding: 0 !important;
22 } 22 }
23 } 23 }
24 24
25 .bs-popover-left .arrow::after, 25 .bs-popover-left .arrow::after,
26 .bs-popover-auto[x-placement^="left"] .arrow::after { 26 .bs-popover-auto[x-placement^="left"] .arrow::after {
27 border-left-color: $primary !important; 27 border-left-color: $primary !important;
28 } 28 }
29 29
30 .bs-popover-right .arrow::after, 30 .bs-popover-right .arrow::after,
31 .bs-popover-auto[x-placement^="right"] .arrow::after { 31 .bs-popover-auto[x-placement^="right"] .arrow::after {
32 border-right-color: $primary !important; 32 border-right-color: $primary !important;
33 } 33 }
34 34
35 .bs-popover-top .arrow::after, 35 .bs-popover-top .arrow::after,
36 .bs-popover-auto[x-placement^="top"] .arrow::after { 36 .bs-popover-auto[x-placement^="top"] .arrow::after {
37 border-top-color: $primary !important; 37 border-top-color: $primary !important;
38 } 38 }
39 39
40 .bs-popover-bottom .arrow::after, 40 .bs-popover-bottom .arrow::after,
41 .bs-popover-auto[x-placement^="bottom"] .arrow::after { 41 .bs-popover-auto[x-placement^="bottom"] .arrow::after {
42 border-bottom-color: $primary !important; 42 border-bottom-color: $primary !important;
43 } 43 }
44 44
45 .list-group-item.active { 45 .list-group-item.active {
46 background-color: $primary !important; 46 background-color: $primary !important;
47 border-color: $primary !important; 47 border-color: $primary !important;
48 } 48 }
49 49
50 .custom-radio .custom-control-label::before { 50 .custom-radio .custom-control-label::before {
51 background-color: $primary !important; 51 background-color: $primary !important;
52 border-color: $white !important; 52 border-color: $white !important;
53 border-width: 2px !important; 53 border-width: 2px !important;
54 } 54 }
55 55
56 .custom-control-input { 56 .custom-control-input {
57 border-color: $white !important; 57 border-color: $white !important;
58 background-color: $primary !important; 58 background-color: $primary !important;
59 color: $primary !important; 59 color: $primary !important;
60 &:checked ~ .custom-control-label::before { 60 &:checked ~ .custom-control-label::before {
61 border-color: $white !important; 61 border-color: $white !important;
62 color: #fff !important; 62 color: #fff !important;
63 background-color: $primary !important; 63 background-color: $primary !important;
64 } 64 }
65 &:focus ~ .custom-control-label::before { 65 &:focus ~ .custom-control-label::before {
66 border-color: $white !important; 66 border-color: $white !important;
67 box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.7) !important; 67 box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.7) !important;
68 } 68 }
69 } 69 }
70 70
71 @import "../../../node_modules/bootstrap/scss/bootstrap"; 71 @import "../../../node_modules/bootstrap/scss/bootstrap";
72 72
1 @import "./assets/scss/animation.scss"; 1 @import "./assets/scss/animation.scss";
2 @import "./assets/scss/bootstrap-override.scss"; 2 @import "./assets/scss/bootstrap-override.scss";
3 @import "../node_modules/bootstrap/scss/_variables.scss"; 3 @import "../node_modules/bootstrap/scss/_variables.scss";
4 4
5 html, 5 html,
6 body { 6 body {
7 background-color: #f0f0f0; 7 background-color: #f0f0f0;
8 font-family: bahnschrift; 8 font-family: bahnschrift;
9 overflow: hidden !important;
9 } 10 }
10 11
11 .blur { 12 .blur {
12 filter: blur(10px); 13 filter: blur(10px);
13 -webkit-filter: blur(10px); 14 -webkit-filter: blur(10px);
14 } 15 }
15 16
16 .disable-user-select { 17 .disable-user-select {
17 -webkit-user-select: none; 18 -webkit-user-select: none;
18 -moz-user-select: none; 19 -moz-user-select: none;
19 -ms-user-select: none; 20 -ms-user-select: none;
20 user-select: none; 21 user-select: none;
21 } 22 }
22 23
23 .blue-gradient { 24 .blue-gradient {
24 background: linear-gradient(0deg, #ffffff00, $white); 25 background: linear-gradient(0deg, #ffffff00, $white);
25 } 26 }
26 27
27 .rounded { 28 .rounded {
28 border-radius: 1.5rem !important; 29 border-radius: 1.5rem !important;
29 } 30 }
30 31
31 .rounded-top-sm { 32 .rounded-top-sm {
32 border-top-left-radius: 0.75rem !important; 33 border-top-left-radius: 0.75rem !important;
33 border-top-right-radius: 0.75rem !important; 34 border-top-right-radius: 0.75rem !important;
34 } 35 }
35 36
36 .rounded-sm { 37 .rounded-sm {
37 border-radius: 0.75rem !important; 38 border-radius: 0.75rem !important;
38 } 39 }
39 40
40 .card-effect { 41 .card-effect {
41 &:active { 42 &:active {
42 background-color: #c9c9c9b3 !important; 43 background-color: #c9c9c9b3 !important;
43 transition: background-color 0.5s; 44 transition: background-color 0.5s;
44 } 45 }
45 &:focus { 46 &:focus {
46 background-color: #c9c9c9b3 !important; 47 background-color: #c9c9c9b3 !important;
47 transition: background-color 0.5s; 48 transition: background-color 0.5s;
48 } 49 }
49 } 50 }
50 51
51 .overflow-scroll { 52 .overflow-scroll {
52 overflow-y: auto !important; 53 overflow-y: auto !important;
53 overflow-x: hidden !important; 54 overflow-x: hidden !important;
54 &::-webkit-scrollbar { 55 &::-webkit-scrollbar {
55 width: 1em; 56 width: 1em;
56 } 57 }
57 &::-webkit-scrollbar-track { 58 &::-webkit-scrollbar-track {
58 border-radius: 10px; 59 border-radius: 10px;
59 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4); 60 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
60 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4); 61 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
61 background-color: $white; 62 background-color: $white;
62 } 63 }
63 &::-webkit-scrollbar-thumb { 64 &::-webkit-scrollbar-thumb {
64 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.7); 65 box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.7);
65 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.7); 66 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.7);
66 outline: 1px solid slategrey; 67 outline: 1px solid slategrey;
67 border-radius: 10px; 68 border-radius: 10px;
68 height: 12px; 69 height: 12px;
69 &:active { 70 &:active {
70 box-shadow: inset 0 0 8px $primary; 71 box-shadow: inset 0 0 8px $primary;
71 -webkit-box-shadow: inset 0 0 8px $primary; 72 -webkit-box-shadow: inset 0 0 8px $primary;
72 } 73 }
73 } 74 }
74 &::-webkit-scrollbar-corner { 75 &::-webkit-scrollbar-corner {
75 border-radius: 10px; 76 border-radius: 10px;
76 } 77 }
77 } 78 }
78 79
79 .bg-gray { 80 .bg-gray {
80 background-color: #e6e6e6; 81 background-color: #e6e6e6;
81 } 82 }
82 83
83 .bg-primary-gradient { 84 .bg-primary-gradient {
84 background: linear-gradient(135deg, rgba(40, 112, 175, 1) 0%, rgba(0, 32, 66, 1) 100%); 85 background: linear-gradient(135deg, rgba(40, 112, 175, 1) 0%, rgba(0, 32, 66, 1) 100%);
85 } 86 }
86 87
87 .bg-primary-gradient-horizontal { 88 .bg-primary-gradient-horizontal {
88 background: linear-gradient(90deg, rgba(40, 112, 175, 1) 0%, rgba(0, 32, 66, 1) 100%); 89 background: linear-gradient(90deg, rgba(40, 112, 175, 1) 0%, rgba(0, 32, 66, 1) 100%);
89 } 90 }
90 91
91 .icon-dim { 92 .icon-dim {
92 height: 40px !important; 93 height: 40px !important;
93 width: auto !important; 94 width: auto !important;
94 background-color: white !important; 95 background-color: white !important;
95 } 96 }
96 97
97 .text-purple { 98 .text-purple {
98 color: $purple; 99 color: $purple;
99 } 100 }
100 101
101 .vh-70 { 102 .vh-70 {
102 min-height: auto !important; 103 min-height: auto !important;
103 max-height: 70vh !important; 104 max-height: 70vh !important;
104 } 105 }
105 106
106 .vh-60 { 107 .vh-60 {
107 min-height: auto !important; 108 min-height: auto !important;
108 max-height: 60vh !important; 109 max-height: 60vh !important;
109 } 110 }
110 111
111 .spinner-lg { 112 .spinner-lg {
112 width: 3rem !important; 113 width: 3rem !important;
113 height: 3rem !important; 114 height: 3rem !important;
114 } 115 }
115 116
116 .sidebar { 117 .sidebar {
117 right: 0; 118 right: 0;
118 } 119 }
119 120
120 .background-image { 121 .background-image {
121 background-repeat: no-repeat; 122 background-repeat: no-repeat;
122 background-size: cover; 123 background-size: cover;
123 position: fixed; 124 position: fixed;
124 } 125 }
125 126
126 .rounded-bottom-right { 127 .rounded-bottom-right {
127 border-bottom-right-radius: 10rem; 128 border-bottom-right-radius: 10rem;
128 &:before { 129 &:before {
129 border-radius: 0 40px 40px 0; 130 border-radius: 0 40px 40px 0;
130 background-color: #fff; 131 background-color: #fff;
131 } 132 }
132 } 133 }
133 134
134 .rounded-top-left { 135 .rounded-top-left {
135 border-top-left-radius: 10rem; 136 border-top-left-radius: 10rem;
136 } 137 }
137 138
138 .bg-gray { 139 .bg-gray {
139 background-color: #cccccc; 140 background-color: #cccccc;
140 } 141 }
141 142