Luis Suarez / autoservicio-axion

Download as
Browse Code ยป

Commit e6edea50be892fb3f3708732180e7eac2e5ce300

Authored by Marcelo Puebla
1 parent cd64d73a70
Exists in develop

Change 

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