Commit 0e2eb138d49984a703c1fa2706a046e3031a98a1
Exists in
master
and in
1 other branch
Merge branch 'master' of http://git.focasoftware.com/angular/autoservicio
Showing
18 changed files
Show diff stats
src/app/components/amb-imagenes/amb-imagenes.component.html
| 1 | 1 | <app-header></app-header> |
| 2 | 2 | |
| 3 | -<h1>Configuración imágenes</h1> | |
| 4 | -<br> | |
| 5 | -<span class="fa fa-search form-control-lg form-control-search pl-3"></span> | |
| 6 | -<input | |
| 7 | - type="text" | |
| 8 | - class="form-control form-control-lg shadow-sm rounded-pill px-5" | |
| 9 | - placeholder="Búsqueda productos" | |
| 10 | - [(ngModel)]="searchTerm" | |
| 11 | - (ngModelChange)="filterItems()"> | |
| 3 | +<div class="container-fluid"> | |
| 4 | + <div class="row m-3"> | |
| 5 | + <div class="col"> | |
| 6 | + <p class="h2">Configuración imágenes</p> | |
| 7 | + </div> | |
| 8 | + </div> | |
| 9 | + | |
| 10 | + <div class="row search"> | |
| 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> | |
| 15 | - <table class="table"> | |
| 16 | - <thead> | |
| 17 | - <tr> | |
| 18 | - <th>Nombre</th> | |
| 19 | - <th>Descripción</th> | |
| 20 | - <th>Imagen</th> | |
| 21 | - <th></th> | |
| 22 | - </tr> | |
| 23 | - </thead> | |
| 24 | - <tbody> | |
| 25 | - <tr *ngFor="let articulo of auxProductos"> | |
| 26 | - <td>{{articulo.DetArt}}</td> | |
| 27 | - <td>{{articulo.DET_LAR}}</td> | |
| 28 | - <td> | |
| 29 | - <img *ngIf="articulo.imagenes.length" src="{{apiUrl}}/imagenes/{{articulo.imagenes[0].imagen}}"> | |
| 30 | - <img id="{{articulo.CodSec + articulo.CodArt}}" [hidden]="articulo.imagenes.length"> | |
| 31 | - </td> | |
| 32 | - <td><input type="file" accept="image/*" (change)="onFileSelected($event, articulo)"></td> | |
| 33 | - </tr> | |
| 34 | - </tbody> | |
| 35 | - </table> | |
| 36 | 48 | </div> |
src/app/components/amb-imagenes/amb-imagenes.component.scss
src/app/components/busqueda-productos/busqueda-productos.component.html
| ... | ... | @@ -32,7 +32,7 @@ |
| 32 | 32 | <!-- SEARCH INPUT --> |
| 33 | 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 | 36 | <div class="col-sm-10"> |
| 37 | 37 | <span class="fa fa-search form-control-lg form-control-search pl-3"></span> |
| 38 | 38 | <input |
| ... | ... | @@ -52,6 +52,9 @@ |
| 52 | 52 | <i class="fa fa-undo text-warning" aria-hidden="true"></i> |
| 53 | 53 | </button> |
| 54 | 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 | 58 | </div> |
| 56 | 59 | <!-- LISTA DE PRODUCTOS --> |
| 57 | 60 | <div class="row align-items-start vh-70 overflow-scroll disable-user-select"> |
| ... | ... | @@ -60,7 +63,7 @@ |
| 60 | 63 | *ngFor="let producto of auxProductos"> |
| 61 | 64 | <div |
| 62 | 65 | class="card-effect bg-white rounded-sm shadow border-0" |
| 63 | - (click)="mostrarBotonCargar(producto)"> | |
| 66 | + (click)="elegirProducto(producto)"> | |
| 64 | 67 | <img src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto"> |
| 65 | 68 | <div class="p-2"> |
| 66 | 69 | <p class="h6 text-left m-0">{{producto.DetArt}}</p> |
| ... | ... | @@ -75,16 +78,6 @@ |
| 75 | 78 | <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p> |
| 76 | 79 | </div> |
| 77 | 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 | 81 | </div> |
| 89 | 82 | </div> |
| 90 | 83 | </div> |
src/app/components/busqueda-productos/busqueda-productos.component.ts
| ... | ... | @@ -19,7 +19,6 @@ export class BusquedaProductosComponent implements OnInit { |
| 19 | 19 | private showSpinner: boolean = true; |
| 20 | 20 | private verCategorias: boolean = true; |
| 21 | 21 | private apiUrl: string = appSettings.apiUrl; |
| 22 | - private showBtnCargarProducto: boolean = false; | |
| 23 | 22 | private categorias: Categoria[] = []; |
| 24 | 23 | |
| 25 | 24 | constructor( |
| ... | ... | @@ -62,19 +61,23 @@ export class BusquedaProductosComponent implements OnInit { |
| 62 | 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++) { | |
| 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 | - } | |
| 66 | + if (producto.PRO) { | |
| 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 | + | |
| 78 | + this.productoService.productoAcargar = producto; | |
| 79 | + this.router.navigate(['inicio']); | |
| 80 | + } | |
| 76 | 81 | |
| 77 | - this.productoService.productoAcargar = producto; | |
| 78 | - this.router.navigate(['inicio']); | |
| 79 | 82 | } |
| 80 | 83 | } |
src/app/components/home/home.component.html
src/app/components/inicio/inicio.component.html
| ... | ... | @@ -29,13 +29,16 @@ |
| 29 | 29 | <div id="carouselIndicators" class="carousel slide" data-ride="carousel"> |
| 30 | 30 | <div class="carousel-inner"> |
| 31 | 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 | 33 | </div> |
| 34 | 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 | 36 | </div> |
| 37 | 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 | 42 | </div> |
| 40 | 43 | </div> |
| 41 | 44 | </div> |
| ... | ... | @@ -75,7 +78,7 @@ |
| 75 | 78 | *ngIf="sinonimos.length > 0" |
| 76 | 79 | [popover]="popoverDirective" |
| 77 | 80 | [popoverContent]="sinonimos" |
| 78 | - (sinonimoSeleccionado)="sinonimoSeleccionado($event)" | |
| 81 | + (productosPersonalizados)="productosPersonalizados($event)" | |
| 79 | 82 | class="text-white rounded-sm border-0"> |
| 80 | 83 | </app-popover-sinonimos> |
| 81 | 84 | </ng-template> |
| ... | ... | @@ -126,16 +129,16 @@ |
| 126 | 129 | |
| 127 | 130 | <!-- PROMO A CARGAR --> |
| 128 | 131 | <div class="fade-in m-0" *ngIf="promoAcargar"> |
| 129 | - <img | |
| 132 | + <!-- <img | |
| 130 | 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 | 136 | <div class="row justify-content-between m-3"> |
| 134 | 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 | 139 | </div> |
| 137 | 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 | 142 | </div> |
| 140 | 143 | </div> |
| 141 | 144 | </div> |
| ... | ... | @@ -154,14 +157,17 @@ |
| 154 | 157 | <i class="fa fa-hand-o-up text-purple" aria-hidden="true"></i> |
| 155 | 158 | </button> |
| 156 | 159 | <button |
| 157 | - *ngIf="!promoAcargar" | |
| 160 | + *ngIf="!promoAcargar || sinonimos.length == 0" | |
| 158 | 161 | type="button" |
| 159 | 162 | class="btn btn-primary btn-block shadow-sm" |
| 160 | 163 | (click)="pop.show()"> |
| 161 | 164 | <span class="pr-2">Mostrar promociones</span> |
| 162 | 165 | <i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i> |
| 163 | 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 | 171 | <span class="pr-2 font-weight-bold">Confirmar</span> |
| 166 | 172 | <i class="fa fa-check text-success" aria-hidden="true"></i> |
| 167 | 173 | </button> |
src/app/components/inicio/inicio.component.ts
| 1 | -import { Component, OnInit, ViewChild } from '@angular/core'; | |
| 1 | +import { Component, OnInit, ViewChild, HostListener } from '@angular/core'; | |
| 2 | 2 | import { PopoverDirective } from 'ngx-bootstrap'; |
| 3 | 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 | 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 | 7 | import { Sinonimo } from 'src/app/wrappers/sinonimo'; |
| 9 | -import { HostListener } from '@angular/core'; | |
| 10 | 8 | |
| 11 | 9 | @Component({ |
| 12 | 10 | selector: 'app-inicio', |
| ... | ... | @@ -27,15 +25,15 @@ export class InicioComponent implements OnInit { |
| 27 | 25 | }; |
| 28 | 26 | |
| 29 | 27 | @ViewChild('pop', { static: false }) popoverDirective: PopoverDirective; |
| 30 | - private productoAcargar: Producto; | |
| 31 | - private productos: Producto[]; | |
| 32 | - private promoAcargar: Promocion; | |
| 33 | 28 | private tienePromo = false; |
| 34 | 29 | private productoEsPromo = false; |
| 35 | 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 | 37 | sinonimos: Sinonimo[] = []; |
| 40 | 38 | apiUrl: string = appSettings.apiUrl |
| 41 | 39 | |
| ... | ... | @@ -46,30 +44,36 @@ export class InicioComponent implements OnInit { |
| 46 | 44 | ngOnInit() { |
| 47 | 45 | |
| 48 | 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 | 55 | this.getProductos(); |
| 51 | 56 | } |
| 52 | 57 | |
| 53 | 58 | getPromociones() { |
| 54 | - if (this.productoAcargar) { | |
| 55 | - var sector = this.productoAcargar.CodSec; | |
| 56 | - var codigo = this.productoAcargar.CodArt; | |
| 57 | - this.productoService.getPromocion(sector, codigo) | |
| 58 | - .subscribe((res: Promocion[]) => { | |
| 59 | - | |
| 60 | - if (res.length === 0) { | |
| 61 | - //Si no tiene promociones la cargará al carrito despues de un tiempo | |
| 62 | - setTimeout(() => { | |
| 63 | - this.productoService.productos.push(this.productoAcargar); | |
| 64 | - this.productoAcargar = undefined; | |
| 65 | - }, 2000) | |
| 66 | - } else { | |
| 67 | - | |
| 68 | - this.promociones = res; | |
| 69 | - this.popoverDirective.show(); | |
| 70 | - } | |
| 71 | - }, error => { console.error(error); }) | |
| 72 | - } | |
| 59 | + | |
| 60 | + var sector = this.productoAcargar.CodSec; | |
| 61 | + var codigo = this.productoAcargar.CodArt; | |
| 62 | + this.productoService.getPromociones(sector, codigo) | |
| 63 | + .subscribe((res: Producto[]) => { | |
| 64 | + | |
| 65 | + if (res.length === 0) { | |
| 66 | + //Si no tiene promociones la cargará al carrito despues de un tiempo | |
| 67 | + setTimeout(() => { | |
| 68 | + this.productoService.productos.push(this.productoAcargar); | |
| 69 | + this.productoAcargar = this.productoService.productoAcargar = undefined; | |
| 70 | + }, 2000) | |
| 71 | + } else { | |
| 72 | + | |
| 73 | + this.promociones = res; | |
| 74 | + this.popoverDirective.show(); | |
| 75 | + } | |
| 76 | + }, error => { console.error(error); }) | |
| 73 | 77 | } |
| 74 | 78 | |
| 75 | 79 | showPopover() { |
| ... | ... | @@ -84,23 +88,37 @@ export class InicioComponent implements OnInit { |
| 84 | 88 | }); |
| 85 | 89 | } |
| 86 | 90 | |
| 87 | - private irBusquedaProductos(verPromociones) { | |
| 91 | + irBusquedaProductos(verPromociones) { | |
| 88 | 92 | |
| 89 | 93 | this.productoService.verCategoriasProductos = verPromociones; |
| 90 | 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 | 106 | deshacerCarga() { |
| 94 | 107 | |
| 95 | - if (this.sinonimoAcargar || this.sinonimos.length > 0) { | |
| 108 | + if (this.sinonimos.length > 0) { | |
| 96 | 109 | this.sinonimos = []; |
| 97 | - this.sinonimoAcargar = undefined; | |
| 98 | 110 | this.popoverDirective.hide(); |
| 99 | 111 | } |
| 100 | 112 | |
| 101 | 113 | if (this.promoAcargar) { |
| 102 | 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 | 122 | } else { |
| 105 | 123 | this.productoAcargar = undefined; |
| 106 | 124 | this.promociones = []; |
| ... | ... | @@ -108,37 +126,49 @@ export class InicioComponent implements OnInit { |
| 108 | 126 | } |
| 109 | 127 | } |
| 110 | 128 | |
| 111 | - promoSeleccionada($event: Promocion) { | |
| 129 | + promoSeleccionada($event: Producto) { | |
| 112 | 130 | |
| 113 | 131 | this.promoAcargar = $event; |
| 114 | - this.popoverDirective.hide(); | |
| 115 | - if (this.promoAcargar.sinonimos) { | |
| 116 | - var sector = this.promoAcargar.sector; | |
| 117 | - var codigo = this.promoAcargar.codigo; | |
| 132 | + this.promoAcargar.tieneSinonimos = true; | |
| 133 | + if (this.promoAcargar.tieneSinonimos) { | |
| 134 | + var sector = this.promoAcargar.CodSec; | |
| 135 | + var codigo = this.promoAcargar.CodArt; | |
| 118 | 136 | this.productoService.getPromocionSinonimos(sector, codigo) |
| 119 | 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) { | |
| 126 | - resSinonimo.cantidad = productoPromo.cantidad; | |
| 127 | - resSinonimo.productoPadre = productoPromo.id; | |
| 128 | - } | |
| 129 | - }); | |
| 143 | + this.promoAcargar.productos.forEach(productoPromo => { | |
| 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 | 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); | |
| 141 | - this.sinonimoAcargar = $event; | |
| 171 | + this.promoAcargar.productos = productosPersonalizados; | |
| 142 | 172 | } |
| 143 | 173 | |
| 144 | 174 | buscarByCodigoBarras(busqueda) { |
src/app/components/popover-promos/popover-promos.component.html
| ... | ... | @@ -19,12 +19,12 @@ |
| 19 | 19 | <div class="row justify-content-between"> |
| 20 | 20 | <div class="col-12 text-left"> |
| 21 | 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 | 23 | </p> |
| 24 | 24 | </div> |
| 25 | 25 | <div class="col-12 text-right mt-2"> |
| 26 | 26 | <p class="h4 font-weight-bold mb-0"> |
| 27 | - {{calcularPrecioDePromo(promo) | currency}} | |
| 27 | + {{promo.PreVen | currency}} | |
| 28 | 28 | </p> |
| 29 | 29 | </div> |
| 30 | 30 | </div> |
src/app/components/popover-promos/popover-promos.component.ts
| 1 | 1 | import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; |
| 2 | 2 | import { PopoverDirective } from 'ngx-bootstrap/popover'; |
| 3 | -import { Promocion } from 'src/app/wrappers/promocion'; | |
| 4 | 3 | import { Producto } from 'src/app/wrappers/producto'; |
| 5 | 4 | |
| 6 | 5 | @Component({ |
| ... | ... | @@ -11,8 +10,8 @@ import { Producto } from 'src/app/wrappers/producto'; |
| 11 | 10 | export class PopoverPromosComponent implements OnInit { |
| 12 | 11 | |
| 13 | 12 | @Input() popover: PopoverDirective; |
| 14 | - @Input() popoverContent: Promocion[]; | |
| 15 | - @Output() promoSeleccionada = new EventEmitter<Promocion>(); | |
| 13 | + @Input() popoverContent: Producto[]; | |
| 14 | + @Output() promoSeleccionada = new EventEmitter<Producto>(); | |
| 16 | 15 | |
| 17 | 16 | constructor() { } |
| 18 | 17 | |
| ... | ... | @@ -23,18 +22,18 @@ export class PopoverPromosComponent implements OnInit { |
| 23 | 22 | this.popover.hide(); |
| 24 | 23 | } |
| 25 | 24 | |
| 26 | - seleccionarPromo(promo: Promocion) { | |
| 25 | + seleccionarPromo(promo: Producto) { | |
| 27 | 26 | |
| 28 | 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 | 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 | } |
src/app/components/popover-sinonimos/popover-sinonimos.component.html
| ... | ... | @@ -22,16 +22,16 @@ |
| 22 | 22 | </div> |
| 23 | 23 | |
| 24 | 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 | 26 | <p class="m-0 font-weight-normal"> |
| 27 | 27 | {{producto.DetArt}} |
| 28 | 28 | </p> |
| 29 | 29 | </div> |
| 30 | - <div class="col-auto"> | |
| 30 | + <div class="col-5"> | |
| 31 | 31 | <div class="btn-group float-left my-auto" role="group"> |
| 32 | 32 | <button |
| 33 | 33 | type="button" |
| 34 | - class="btn btn-light my-auto border" | |
| 34 | + class="btn btn-light my-auto border shadow" | |
| 35 | 35 | (click)="sumarCantidad(producto, i)"> |
| 36 | 36 | <i class="fa fa-plus" aria-hidden="true"></i> |
| 37 | 37 | </button> |
| ... | ... | @@ -43,7 +43,7 @@ |
| 43 | 43 | </div> |
| 44 | 44 | <button |
| 45 | 45 | type="button" |
| 46 | - class="btn btn-light my-auto border" | |
| 46 | + class="btn btn-light my-auto border shadow" | |
| 47 | 47 | (click)="restarCantidad(producto, i)"> |
| 48 | 48 | <i class="fa fa-minus" aria-hidden="true"></i> |
| 49 | 49 | </button> |
| ... | ... | @@ -58,7 +58,10 @@ |
| 58 | 58 | |
| 59 | 59 | <div class="row mt-3 justify-content-end"> |
| 60 | 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 | 65 | <span class="font-weight-bold pr-2">Continuar</span> |
| 63 | 66 | <i class="fa fa-check text-success" aria-hidden="true"></i> |
| 64 | 67 | </button> |
src/app/components/popover-sinonimos/popover-sinonimos.component.ts
| ... | ... | @@ -2,6 +2,7 @@ import { Component, OnInit, Input, EventEmitter, Output } from '@angular/core'; |
| 2 | 2 | import { PopoverDirective } from 'ngx-bootstrap'; |
| 3 | 3 | import { Producto } from 'src/app/wrappers/producto'; |
| 4 | 4 | import { Sinonimo } from 'src/app/wrappers/sinonimo'; |
| 5 | +import { ProductoService } from 'src/app/services/producto.service'; | |
| 5 | 6 | |
| 6 | 7 | @Component({ |
| 7 | 8 | selector: 'app-popover-sinonimos', |
| ... | ... | @@ -13,12 +14,12 @@ export class PopoverSinonimosComponent implements OnInit { |
| 13 | 14 | //Directiva del popover, para poder cerrarlo desde este componente |
| 14 | 15 | @Input() popover: PopoverDirective; |
| 15 | 16 | @Input() popoverContent: Sinonimo[]; |
| 16 | - @Output() sinonimoSeleccionado = new EventEmitter<Sinonimo>(); | |
| 17 | - sinonimo: Sinonimo; | |
| 17 | + @Output() productosPersonalizados = new EventEmitter<Producto[]>(); | |
| 18 | + // sinonimo: Sinonimo; | |
| 18 | 19 | |
| 19 | 20 | private cantidadRestanteSinonimos: number[] = []; |
| 20 | 21 | |
| 21 | - constructor() { } | |
| 22 | + constructor(private productoService: ProductoService) { } | |
| 22 | 23 | |
| 23 | 24 | ngOnInit() { |
| 24 | 25 | |
| ... | ... | @@ -26,7 +27,8 @@ export class PopoverSinonimosComponent implements OnInit { |
| 26 | 27 | this.popoverContent.forEach(sinonimo => { |
| 27 | 28 | |
| 28 | 29 | this.cantidadRestanteSinonimos.push(0); |
| 29 | - this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined; | |
| 30 | + // this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined; | |
| 31 | + | |
| 30 | 32 | sinonimo.productos.forEach(producto => { |
| 31 | 33 | |
| 32 | 34 | producto.cantidad = (producto.id === sinonimo.productoPadre) ? sinonimo.cantidad : 0; |
| ... | ... | @@ -34,15 +36,30 @@ export class PopoverSinonimosComponent implements OnInit { |
| 34 | 36 | }) |
| 35 | 37 | } |
| 36 | 38 | |
| 37 | - hidePopover() { | |
| 39 | + continuar() { | |
| 38 | 40 | |
| 39 | - this.sinonimoSeleccionado.emit(this.sinonimo); | |
| 40 | - this.popover.hide(); | |
| 41 | - } | |
| 41 | + //Si aún quedan articulos que agregar no deja continuar. | |
| 42 | + for (let i = 0; i < this.cantidadRestanteSinonimos.length; i++) { | |
| 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 | 65 | sumarCantidad(producto: Producto, i: number) { |
src/app/components/sidebar/sidebar.component.html
| ... | ... | @@ -10,7 +10,7 @@ |
| 10 | 10 | <div |
| 11 | 11 | class="slide-in-bl my-2 bg-white border-0 rounded-sm" |
| 12 | 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 | 14 | <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm"> |
| 15 | 15 | <div class="col-12 p-0 pt-2 text-left my-auto"> |
| 16 | 16 | <p class="m-0 h6"><small>{{producto.DetArt}}</small></p> |
| ... | ... | @@ -36,7 +36,11 @@ |
| 36 | 36 | </div> |
| 37 | 37 | <div class="col-6 px-2 my-2"> |
| 38 | 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 | 44 | <i class="fa fa-hand-o-up" aria-hidden="true"></i> |
| 41 | 45 | </button> |
| 42 | 46 | <button type="button" class="btn btn-secondary btn-sm my-auto ml-2" (click)="deleteProducto(i)"> |
src/app/components/sidebar/sidebar.component.ts
| ... | ... | @@ -20,7 +20,7 @@ export class SidebarComponent implements OnInit { |
| 20 | 20 | public productosCarrito: Producto[] = []; |
| 21 | 21 | |
| 22 | 22 | constructor(private productoService: ProductoService) { |
| 23 | - | |
| 23 | + | |
| 24 | 24 | this.productosCarrito = this.productoService.productos; |
| 25 | 25 | } |
| 26 | 26 | |
| ... | ... | @@ -99,4 +99,14 @@ export class SidebarComponent implements OnInit { |
| 99 | 99 | this.total = 0; |
| 100 | 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 | } |
src/app/services/producto.service.ts
| ... | ... | @@ -11,6 +11,7 @@ export class ProductoService { |
| 11 | 11 | |
| 12 | 12 | productos: Producto[] = []; |
| 13 | 13 | productoAcargar: Producto; |
| 14 | + promoAcargar: Producto; | |
| 14 | 15 | verCategoriasProductos: boolean = true; |
| 15 | 16 | |
| 16 | 17 | constructor(private http: HttpClient) { } |
| ... | ... | @@ -25,7 +26,14 @@ export class ProductoService { |
| 25 | 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 | 38 | var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; |
| 31 | 39 | // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; |
| ... | ... | @@ -34,7 +42,7 @@ export class ProductoService { |
| 34 | 42 | |
| 35 | 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 | 46 | // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; |
| 39 | 47 | return this.http.get(url); |
| 40 | 48 | } |
src/app/wrappers/producto.ts
| ... | ... | @@ -89,8 +89,9 @@ export interface Producto { |
| 89 | 89 | nombreImagen?: any; |
| 90 | 90 | categoria_selfservice: number; |
| 91 | 91 | cantidad?: number; |
| 92 | - showCargarProducto?: boolean; | |
| 93 | 92 | esPadre?: boolean; |
| 94 | 93 | codigoBarra: string; |
| 95 | 94 | idSinonimo?: number; |
| 95 | + productos?: Producto[]; | |
| 96 | + tieneSinonimos?: boolean; | |
| 96 | 97 | } |
src/app/wrappers/promocion.ts
src/assets/scss/bootstrap-override.scss
| ... | ... | @@ -10,9 +10,9 @@ $theme-colors: ( |
| 10 | 10 | ); |
| 11 | 11 | |
| 12 | 12 | .popover { |
| 13 | - transform: translate3d(-480px, 0, -34px) !important; | |
| 14 | - min-width: 485px !important; | |
| 15 | - max-width: 485px !important; | |
| 13 | + transform: translate3d(-425px, 0, -34px) !important; | |
| 14 | + min-width: 350px !important; | |
| 15 | + max-width: 425px !important; | |
| 16 | 16 | border: none !important; |
| 17 | 17 | border-radius: 1.5rem !important; |
| 18 | 18 | padding: 0 !important; |