Commit cd84daae1920b98850d92afb75f992099b95524c

Authored by Marcelo Puebla
1 parent 0a9a4e91bf
Exists in master

Agregada logica para manejar el paginador

src/app/components/amb-imagenes/amb-imagenes.component.ts
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { appSettings } from 'src/etc/AppSettings'; 2 import { appSettings } from 'src/etc/AppSettings';
3 import { ProductoService } from 'src/app/services/producto.service'; 3 import { ProductoService } from 'src/app/services/producto.service';
4 import { Producto } from 'src/app/wrappers/producto'; 4 import { Producto } from 'src/app/wrappers/producto';
5 import { HttpClient } from '@angular/common/http'; 5 import { HttpClient } from '@angular/common/http';
6 6
7 @Component({ 7 @Component({
8 selector: 'app-amb-imagenes', 8 selector: 'app-amb-imagenes',
9 templateUrl: './amb-imagenes.component.html', 9 templateUrl: './amb-imagenes.component.html',
10 styleUrls: ['./amb-imagenes.component.scss'] 10 styleUrls: ['./amb-imagenes.component.scss']
11 }) 11 })
12 12
13 export class AmbImagenesComponent implements OnInit { 13 export class AmbImagenesComponent implements OnInit {
14 14
15 apiUrl = appSettings.apiUrl; 15 apiUrl = appSettings.apiUrl;
16 articulos: Producto[] = []; 16 articulos: Producto[] = [];
17 private auxProductos: Producto[] = []; 17 private auxProductos: Producto[] = [];
18 private searchTerm: string = ''; 18 private searchTerm: string = '';
19 private paginationData: any;
19 20
20 constructor(private productoService: ProductoService, private http: HttpClient) { } 21 constructor(private productoService: ProductoService, private http: HttpClient) { }
21 22
22 ngOnInit() { 23 ngOnInit() {
23 24
24 this.productoService.getAll().subscribe((productos: Producto[]) => { 25 this.productoService.getAllWithPaginator()
25 this.articulos = productos; 26 .subscribe((res) => {
26 this.filterItems();
27 });
28 }
29 27
30 this.articulos = productos; 28 this.articulos = res.data;
29 this.paginationData = res.pagination;
31 this.filterItems(); 30 this.filterItems();
32 }, error => console.error(error)); 31 }, error => console.error(error));
33 } 32 }
34 33
35 onFileSelected(event, articulo: Producto) { 34 onFileSelected(event, articulo: Producto) {
36 35
37 let auxFiles: FileList = event.target.files; 36 let auxFiles: FileList = event.target.files;
38 Array.from(auxFiles).forEach(file => { 37 Array.from(auxFiles).forEach(file => {
39 38
40 this.onLoad(file) 39 this.onLoad(file)
41 .then(result => { 40 .then(result => {
42 41
43 articulo.imagenes.push({ 42 articulo.imagenes.push({
44 name: file.name, 43 name: file.name,
45 fromGallery: true, 44 fromGallery: true,
46 imagen: result, 45 imagen: result,
47 id_articulo: articulo.id 46 id_articulo: articulo.id
48 }); 47 });
49 48
50 this.saveInBase({ 49 this.saveInBase({
51 name: file.name, 50 name: file.name,
52 base64: result, 51 base64: result,
53 codigo: articulo.CodArt, 52 codigo: articulo.CodArt,
54 sector: articulo.CodSec 53 sector: articulo.CodSec
55 }); 54 });
56 }); 55 });
57 }) 56 })
58 } 57 }
59 58
60 filterItems() { 59 filterItems() {
61 60
62 this.auxProductos = this.articulos.filter(x => { 61 this.auxProductos = this.articulos.filter(x => {
63 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) 62 return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) ||
63 x.CodArt.toString().includes(this.searchTerm.toLowerCase()) ||
64 x.CodSec.toString().includes(this.searchTerm.toLowerCase());
64 }); 65 });
65 } 66 }
66 67
67 68
68 saveInBase(img) { 69 saveInBase(img) {
69 70
70 this.productoService.saveInBase(img) 71 this.productoService.saveInBase(img)
71 .subscribe(data => { 72 .subscribe(data => {
72 73
73 }, error => console.error(error)); 74 }, error => console.error(error));
74 } 75 }
75 76
76 onLoad(file) { 77 onLoad(file) {
77 78
78 return new Promise((resolve, reject) => { 79 return new Promise((resolve, reject) => {
79 80
80 var fr = new FileReader(); 81 var fr = new FileReader();
81 82
82 fr.onload = function () { 83 fr.onload = function () {
83 84
84 resolve(fr.result); 85 resolve(fr.result);
85 }; 86 };
86 87
87 fr.readAsDataURL(file); 88 fr.readAsDataURL(file);
88 }); 89 });
89 90
90 } 91 }
91 92
92 deleteImage(imagenes, index: number) { 93 deleteImage(imagenes, index: number) {
93 94
94 if (!imagenes[index].name) { 95 if (!imagenes[index].name) {
95 imagenes[index].name = imagenes[index].imagen; 96 imagenes[index].name = imagenes[index].imagen;
96 } 97 }
97 98
98 this.productoService.deleteImage(imagenes[index]) 99 this.productoService.deleteImage(imagenes[index])
99 .subscribe(res => { 100 .subscribe(res => {
100 101
101 if (res) { 102 if (res) {
102 imagenes.splice(index, 1); 103 imagenes.splice(index, 1);
103 } 104 }
104 }, error => console.error(error)); 105 }, error => console.error(error));
105 } 106 }
106 107
108 pageChanged(event: any): void {
109 this.productoService.getAllWithPaginator(event.page)
110 .subscribe((res) => {
111
112 this.articulos = res.data;
113 this.paginationData = res.pagination;
114 this.filterItems();
115 }, error => console.error(error));
116 }