seleccion-articulos.component.ts
4.28 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
import { Component, OnInit } from "@angular/core";
import { BsModalRef } from 'ngx-bootstrap/modal';
import { ArticuloService } from 'src/app/services/articulo/articulo.service';
import { IArticulo } from 'src/app/interfaces/IArticulo';
import { APP_SETTINGS } from 'src/etc/AppSettings';
import { ICategoria } from 'src/app/interfaces/ICategoria';
import { CategoriaService } from 'src/app/services/categoria/categoria.service';
@Component({
selector: "app-seleccion-articulos",
templateUrl: "./seleccion-articulos.component.html",
styleUrls: ["./seleccion-articulos.component.scss"]
})
export class SeleccionArticulosComponent implements OnInit {
showSpinner = true;
timeoutHandler: any;
urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
articulos: IArticulo[] = [];
auxArticulos: IArticulo[] = [];
showQuantity = 100;
queMostrar = 'todos';
categoriaActive: number = null;
categorias: ICategoria[] = [];
searchTerm = '';
ordenandoByVendidos = true;
allActive = true;
modalRef: BsModalRef;
constructor(
public articuloService: ArticuloService,
private categoriaService: CategoriaService,
) { }
ngOnInit() {
this.getCategorias();
}
getCategorias() {
this.categoriaService.getCategorias()
.subscribe((categorias: ICategoria[]) => {
switch (this.queMostrar) {
case 'todos':
this.categorias = categorias;
this.categoriaActive = 0;
break;
case 'promociones':
this.categorias = categorias;
this.categoriaActive = 19;
break;
case 'ordenar':
this.categorias = categorias.filter((categoria: ICategoria) => {
return categoria.ES_PEDIDO;
});
this.categoriaActive = 4;
break;
default:
this.categorias = categorias;
this.categoriaActive = 0;
break;
}
!localStorage.getItem('articulos') ?
this.getProductos() :
this.setProductos();
});
}
getProductos() {
this.articuloService.getAll()
.subscribe((result: IArticulo[]) => {
this.articuloService.setArticulosSinImagen(result);
if (this.queMostrar == 'ordenar') {
this.categorias.forEach((categoria: ICategoria) => {
let tempArticulos = result.filter((articulo: IArticulo) => {
return articulo.categoria_selfservice == categoria.id;
});
result = tempArticulos;
});
}
localStorage.setItem('articulos', JSON.stringify(result));
this.setProductos();
}, (error) => {
this.showSpinner = false;
console.error(error);
});
}
setProductos() {
this.articulos = JSON.parse(localStorage.getItem('articulos'));
this.filterItems();
}
filterItems() {
if (this.categoriaActive == 0) {
this.auxArticulos = this.articulos;
return;
}
this.auxArticulos = this.articulos.filter(x => {
return x.categoria_selfservice === this.categoriaActive;
});
this.ordenar();
}
ordenar() {
if (this.ordenandoByVendidos) {
this.auxArticulos.sort((a, b) => {
return b.cantidadVendida - a.cantidadVendida;
});
}
}
selectCategoria(index: number, idCategoria?: number) {
if (this.categoriaActive == idCategoria) return;
this.categoriaActive = idCategoria;
this.allActive = idCategoria === 0 ? true : false;
this.categorias.forEach((categoria, i) => {
categoria.selected = index === i ? true : false;
});
this.filterItems();
}
elegirArticulo(articulo: IArticulo) {
articulo.cantidad = 1;
this.articuloService.setArticulo(articulo);
}
increaseShow() {
this.showQuantity += 100;
}
mouseup() {
if (!this.timeoutHandler) return;
clearInterval(this.timeoutHandler);
}
scrollY(el: HTMLElement, value) {
el.scroll({ behavior: "smooth", top: value + el.scrollTop });
this.timeoutHandler = setInterval(() => {
el.scroll({ behavior: "smooth", top: value + el.scrollTop });
}, 500);
}
scrollX(el: HTMLElement, value) {
el.scroll({ behavior: "smooth", left: value + el.scrollLeft });
this.timeoutHandler = setInterval(() => {
el.scroll({ behavior: "smooth", left: value + el.scrollLeft });
}, 500);
}
}