Commit 40d37eb2255dcc8b0de15209df6eb90d817126d4
1 parent
21cd425af7
Exists in
develop
modal promociones
Showing
1 changed file
with
1 additions
and
1 deletions
Show diff stats
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
| 1 | import { Component, OnInit, TemplateRef } from '@angular/core'; | 1 | import { Component, OnInit, TemplateRef } from '@angular/core'; |
| 2 | import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; | 2 | import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; |
| 3 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; | 3 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; |
| 4 | import { IArticulo } from 'src/app/interfaces/IArticulo'; | 4 | import { IArticulo } from 'src/app/interfaces/IArticulo'; |
| 5 | import { APP_SETTINGS } from 'src/etc/AppSettings'; | 5 | import { APP_SETTINGS } from 'src/etc/AppSettings'; |
| 6 | import { ICategoria } from 'src/app/interfaces/ICategoria'; | 6 | import { ICategoria } from 'src/app/interfaces/ICategoria'; |
| 7 | import { CategoriaService } from 'src/app/services/categoria/categoria.service'; | 7 | import { CategoriaService } from 'src/app/services/categoria/categoria.service'; |
| 8 | import { PromocionService } from 'src/app/services/promocion/promocion.service'; | 8 | import { PromocionService } from 'src/app/services/promocion/promocion.service'; |
| 9 | 9 | ||
| 10 | @Component({ | 10 | @Component({ |
| 11 | selector: 'app-seleccion-articulos', | 11 | selector: 'app-seleccion-articulos', |
| 12 | templateUrl: './seleccion-articulos.component.html', | 12 | templateUrl: './seleccion-articulos.component.html', |
| 13 | styleUrls: ['./seleccion-articulos.component.scss'] | 13 | styleUrls: ['./seleccion-articulos.component.scss'] |
| 14 | }) | 14 | }) |
| 15 | export class SeleccionArticulosComponent implements OnInit { | 15 | export class SeleccionArticulosComponent implements OnInit { |
| 16 | showSpinner = true; | 16 | showSpinner = true; |
| 17 | timeoutHandler: any; | 17 | timeoutHandler: any; |
| 18 | urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; | 18 | urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`; |
| 19 | articulos: IArticulo[] = []; | 19 | articulos: IArticulo[] = []; |
| 20 | auxArticulos: IArticulo[] = []; | 20 | auxArticulos: IArticulo[] = []; |
| 21 | showQuantity = 100; | 21 | showQuantity = 100; |
| 22 | queMostrar = 'todos'; | 22 | queMostrar = 'todos'; |
| 23 | categoriaActive: number = null; | 23 | categoriaActive: number = null; |
| 24 | categorias: ICategoria[] = []; | 24 | categorias: ICategoria[] = []; |
| 25 | searchTerm = ''; | 25 | searchTerm = ''; |
| 26 | ordenandoByVendidos = true; | 26 | ordenandoByVendidos = true; |
| 27 | allActive = true; | 27 | allActive = true; |
| 28 | modalRef: BsModalRef; | 28 | modalRef: BsModalRef; |
| 29 | total: number = 0; | 29 | total: number = 0; |
| 30 | articuloPromo: IArticulo[] = []; | 30 | articuloPromo: IArticulo[] = []; |
| 31 | promociones: IArticulo[] = []; | 31 | promociones: IArticulo[] = []; |
| 32 | 32 | ||
| 33 | constructor( | 33 | constructor( |
| 34 | public articuloService: ArticuloService, | 34 | public articuloService: ArticuloService, |
| 35 | private categoriaService: CategoriaService, | 35 | private categoriaService: CategoriaService, |
| 36 | private modalService: BsModalService, | 36 | private modalService: BsModalService, |
| 37 | private promocionService: PromocionService | 37 | private promocionService: PromocionService |
| 38 | ) { } | 38 | ) { } |
| 39 | 39 | ||
| 40 | ngOnInit() { | 40 | ngOnInit() { |
| 41 | this.getCategorias(); | 41 | this.getCategorias(); |
| 42 | } | 42 | } |
| 43 | 43 | ||
| 44 | getCategorias() { | 44 | getCategorias() { |
| 45 | this.categoriaService.getCategorias() | 45 | this.categoriaService.getCategorias() |
| 46 | .subscribe((categorias: ICategoria[]) => { | 46 | .subscribe((categorias: ICategoria[]) => { |
| 47 | switch (this.queMostrar) { | 47 | switch (this.queMostrar) { |
| 48 | case 'todos': | 48 | case 'todos': |
| 49 | this.categorias = categorias; | 49 | this.categorias = categorias; |
| 50 | this.categoriaActive = 0; | 50 | this.categoriaActive = 0; |
| 51 | break; | 51 | break; |
| 52 | case 'promociones': | 52 | case 'promociones': |
| 53 | this.categorias = categorias; | 53 | this.categorias = categorias; |
| 54 | this.categoriaActive = 19; | 54 | this.categoriaActive = 19; |
| 55 | break; | 55 | break; |
| 56 | case 'ordenar': | 56 | case 'ordenar': |
| 57 | this.categorias = categorias.filter((categoria: ICategoria) => { | 57 | this.categorias = categorias.filter((categoria: ICategoria) => { |
| 58 | return categoria.ES_PEDIDO; | 58 | return categoria.ES_PEDIDO; |
| 59 | }); | 59 | }); |
| 60 | this.categoriaActive = 4; | 60 | this.categoriaActive = 4; |
| 61 | break; | 61 | break; |
| 62 | default: | 62 | default: |
| 63 | this.categorias = categorias; | 63 | this.categorias = categorias; |
| 64 | this.categoriaActive = 0; | 64 | this.categoriaActive = 0; |
| 65 | break; | 65 | break; |
| 66 | } | 66 | } |
| 67 | !localStorage.getItem('articulos') ? | 67 | !localStorage.getItem('articulos') ? |
| 68 | this.getProductos() : | 68 | this.getProductos() : |
| 69 | this.setProductos(); | 69 | this.setProductos(); |
| 70 | }); | 70 | }); |
| 71 | } | 71 | } |
| 72 | 72 | ||
| 73 | getProductos() { | 73 | getProductos() { |
| 74 | this.articuloService.getAll() | 74 | this.articuloService.getAll() |
| 75 | .subscribe((result: IArticulo[]) => { | 75 | .subscribe((result: IArticulo[]) => { |
| 76 | this.articuloService.setArticulosSinImagen(result); | 76 | this.articuloService.setArticulosSinImagen(result); |
| 77 | if (this.queMostrar === 'ordenar') { | 77 | if (this.queMostrar === 'ordenar') { |
| 78 | this.categorias.forEach((categoria: ICategoria) => { | 78 | this.categorias.forEach((categoria: ICategoria) => { |
| 79 | const tempArticulos = result.filter((articulo: IArticulo) => { | 79 | const tempArticulos = result.filter((articulo: IArticulo) => { |
| 80 | return articulo.categoria_selfservice === categoria.id; | 80 | return articulo.categoria_selfservice === categoria.id; |
| 81 | }); | 81 | }); |
| 82 | result = tempArticulos; | 82 | result = tempArticulos; |
| 83 | }); | 83 | }); |
| 84 | } | 84 | } |
| 85 | localStorage.setItem('articulos', JSON.stringify(result)); | 85 | localStorage.setItem('articulos', JSON.stringify(result)); |
| 86 | this.setProductos(); | 86 | this.setProductos(); |
| 87 | }, (error) => { | 87 | }, (error) => { |
| 88 | this.showSpinner = false; | 88 | this.showSpinner = false; |
| 89 | console.error(error); | 89 | console.error(error); |
| 90 | }); | 90 | }); |
| 91 | } | 91 | } |
| 92 | 92 | ||
| 93 | setProductos() { | 93 | setProductos() { |
| 94 | this.articulos = JSON.parse(localStorage.getItem('articulos')); | 94 | this.articulos = JSON.parse(localStorage.getItem('articulos')); |
| 95 | this.filterItems(); | 95 | this.filterItems(); |
| 96 | } | 96 | } |
| 97 | 97 | ||
| 98 | filterItems() { | 98 | filterItems() { |
| 99 | if (this.categoriaActive === 0) { | 99 | if (this.categoriaActive === 0) { |
| 100 | this.auxArticulos = this.articulos; | 100 | this.auxArticulos = this.articulos; |
| 101 | return; | 101 | return; |
| 102 | } | 102 | } |
| 103 | this.auxArticulos = this.articulos.filter(x => { | 103 | this.auxArticulos = this.articulos.filter(x => { |
| 104 | return x.categoria_selfservice === this.categoriaActive; | 104 | return x.categoria_selfservice === this.categoriaActive; |
| 105 | }); | 105 | }); |
| 106 | this.ordenar(); | 106 | this.ordenar(); |
| 107 | } | 107 | } |
| 108 | 108 | ||
| 109 | ordenar() { | 109 | ordenar() { |
| 110 | if (this.ordenandoByVendidos) { | 110 | if (this.ordenandoByVendidos) { |
| 111 | this.auxArticulos.sort((a, b) => { | 111 | this.auxArticulos.sort((a, b) => { |
| 112 | return b.cantidadVendida - a.cantidadVendida; | 112 | return b.cantidadVendida - a.cantidadVendida; |
| 113 | }); | 113 | }); |
| 114 | } | 114 | } |
| 115 | } | 115 | } |
| 116 | 116 | ||
| 117 | selectCategoria(index: number, idCategoria?: number) { | 117 | selectCategoria(index: number, idCategoria?: number) { |
| 118 | if (this.categoriaActive === idCategoria) return; | 118 | if (this.categoriaActive === idCategoria) return; |
| 119 | this.categoriaActive = idCategoria; | 119 | this.categoriaActive = idCategoria; |
| 120 | this.allActive = idCategoria === 0 ? true : false; | 120 | this.allActive = idCategoria === 0 ? true : false; |
| 121 | this.categorias.forEach((categoria, i) => { | 121 | this.categorias.forEach((categoria, i) => { |
| 122 | categoria.selected = index === i ? true : false; | 122 | categoria.selected = index === i ? true : false; |
| 123 | }); | 123 | }); |
| 124 | this.filterItems(); | 124 | this.filterItems(); |
| 125 | } | 125 | } |
| 126 | 126 | ||
| 127 | elegirArticulo(articulo: IArticulo) { | 127 | elegirArticulo(articulo: IArticulo) { |
| 128 | this.articuloService.getById(articulo.id) | 128 | this.articuloService.getById(articulo.id) |
| 129 | .subscribe((res: IArticulo) => { | 129 | .subscribe((res: IArticulo) => { |
| 130 | res.cantidad = 1; | 130 | res.cantidad = 1; |
| 131 | this.articuloService.setArticulo(res); | 131 | this.articuloService.setArticulo(res); |
| 132 | }, err => console.error(err)); | 132 | }, err => console.error(err)); |
| 133 | } | 133 | } |
| 134 | 134 | ||
| 135 | openModalPromos(articulo: IArticulo, templatePromos: TemplateRef<any>) { | 135 | openModalPromos(articulo: IArticulo, templatePromos: TemplateRef<any>) { |
| 136 | this.articuloService.getById(articulo.id) | 136 | this.articuloService.getById(articulo.id) |
| 137 | .subscribe((res: IArticulo) => { | 137 | .subscribe((res: IArticulo) => { |
| 138 | this.articuloPromo[0] = res; | 138 | this.articuloPromo[0] = res; |
| 139 | this.getPromociones(); | 139 | this.getPromociones(); |
| 140 | }, err => console.error(err)); | 140 | }, err => console.error(err)); |
| 141 | this.modalRef = this.modalService.show(templatePromos, { class: 'custom-modal modal-dialog-centered', backdrop: 'static' }); | 141 | this.modalRef = this.modalService.show(templatePromos, { class: 'custom-modal modal-dialog-centered', backdrop: 'static' }); |
| 142 | } | 142 | } |
| 143 | 143 | ||
| 144 | getPromociones() { | 144 | getPromociones() { |
| 145 | var sector = this.articuloPromo[0].CodSec; | 145 | var sector = this.articuloPromo[0].CodSec; |
| 146 | var codigo = this.articuloPromo[0].CodArt; | 146 | var codigo = this.articuloPromo[0].CodArt; |
| 147 | this.promocionService.getPromociones(sector, codigo) | 147 | this.promocionService.getPromociones(sector, codigo) |
| 148 | .subscribe((res: IArticulo[]) => { | 148 | .subscribe((res: IArticulo[]) => { |
| 149 | this.promociones = res; | 149 | this.promociones = res; |
| 150 | }, error => { console.error(error); }) | 150 | }, error => { console.error(error); }) |
| 151 | } | 151 | } |
| 152 | 152 | ||
| 153 | increaseShow() { | 153 | increaseShow() { |
| 154 | this.showQuantity += 100; | 154 | this.showQuantity += 100; |
| 155 | } | 155 | } |
| 156 | 156 | ||
| 157 | mouseup() { | 157 | mouseup() { |
| 158 | if (!this.timeoutHandler) return; | 158 | if (!this.timeoutHandler) return; |
| 159 | clearInterval(this.timeoutHandler); | 159 | clearInterval(this.timeoutHandler); |
| 160 | } | 160 | } |
| 161 | 161 | ||
| 162 | scrollY(el: HTMLElement, value) { | 162 | scrollY(el: HTMLElement, value) { |
| 163 | el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); | 163 | el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); |
| 164 | this.timeoutHandler = setInterval(() => { | 164 | this.timeoutHandler = setInterval(() => { |
| 165 | el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); | 165 | el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); |
| 166 | }, 500); | 166 | }, 500); |
| 167 | } | 167 | } |
| 168 | 168 | ||
| 169 | scrollX(el: HTMLElement, value) { | 169 | scrollX(el: HTMLElement, value) { |
| 170 | el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); | 170 | el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); |
| 171 | this.timeoutHandler = setInterval(() => { | 171 | this.timeoutHandler = setInterval(() => { |
| 172 | el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); | 172 | el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); |
| 173 | }, 500); | 173 | }, 500); |
| 174 | } | 174 | } |
| 175 | } | ||
| 175 | } |