filtro ordernar by

Eric Fernandez
1 parent 0b97774414
Showing 3 changed files with 20 additions and 4 deletions Show diff stats
src/app/components/busqueda-productos/busqueda-productos.component.html
src/app/components/busqueda-productos/busqueda-productos.component.ts
src/app/wrappers/producto.ts
@@ -60,7 +60,11 @@
             </button>
           </div>
           <div class="col-sm-12 my-2 h5">
-            <span class="badge badge-light px-2 text-muted shadow-sm">Más vendidos</span>
+            <button
+              class="btn btn-outline-primary badge badge-light px-2 shadow-sm"
+              [ngClass]="{'active': ordenandoByVendidos}"
+              (click)="ordenandoByVendidos = !ordenandoByVendidos; ordenar()"
+            >Más vendidos</button>
           </div>
         </div>
         <!-- LISTA DE PRODUCTOS -->
@@ -21,6 +21,7 @@ export class BusquedaProductosComponent implements OnInit {
   private apiUrl: string = appSettings.apiUrl;
   private categorias: Categoria[] = [];
   private blurFocus = new EventEmitter();
+  private ordenandoByVendidos = true;
  
   constructor(
     private productoService: ProductoService,
@@ -78,6 +79,7 @@ export class BusquedaProductosComponent implements OnInit {
           this.productos = data;
         }
         this.filterItems();
+        this.ordenar();
       }, (error) => {
         this.showSpinner = false;
         console.error(error);
@@ -104,8 +106,17 @@ export class BusquedaProductosComponent implements OnInit {
     this.productoService.productos.push(producto);
   }
  
-  lostBlur() {
-    this.blurFocus.emit();
+  ordenar() {
+
+    if (this.ordenandoByVendidos) {
+
+      this.auxProductos.sort((a, b) => {
+        return b.cantidadVendida - a.cantidadVendida;
+      });
+    } else {
+      this.filterItems();
+    }
+
   }
  
   private elegirProducto(producto: Producto) {
@@ -94,5 +94,6 @@ export interface Producto {
   idSinonimo?: number;
   productos?: Producto[];
   tieneSinonimos?: boolean;
-  imagenes: object[]
+  imagenes: object[],
+  cantidadVendida: number
 }
...	...	@@ -60,7 +60,11 @@
60	60	</button>
61	61	</div>
62	62	<div class="col-sm-12 my-2 h5">
63		- <span class="badge badge-light px-2 text-muted shadow-sm">Más vendidos</span>
	63	+ <button
	64	+ class="btn btn-outline-primary badge badge-light px-2 shadow-sm"
	65	+ [ngClass]="{'active': ordenandoByVendidos}"
	66	+ (click)="ordenandoByVendidos = !ordenandoByVendidos; ordenar()"
	67	+ >Más vendidos</button>
64	68	</div>
65	69	</div>
66	70	<!-- LISTA DE PRODUCTOS -->
...	...	@@ -21,6 +21,7 @@ export class BusquedaProductosComponent implements OnInit {
21	21	private apiUrl: string = appSettings.apiUrl;
22	22	private categorias: Categoria[] = [];
23	23	private blurFocus = new EventEmitter();
	24	+ private ordenandoByVendidos = true;
24	25
25	26	constructor(
26	27	private productoService: ProductoService,
...	...	@@ -78,6 +79,7 @@ export class BusquedaProductosComponent implements OnInit {
78	79	this.productos = data;
79	80	}
80	81	this.filterItems();
	82	+ this.ordenar();
81	83	}, (error) => {
82	84	this.showSpinner = false;
83	85	console.error(error);
...	...	@@ -104,8 +106,17 @@ export class BusquedaProductosComponent implements OnInit {
104	106	this.productoService.productos.push(producto);
105	107	}
106	108
107		- lostBlur() {
108		- this.blurFocus.emit();
	109	+ ordenar() {
	110	+
	111	+ if (this.ordenandoByVendidos) {
	112	+
	113	+ this.auxProductos.sort((a, b) => {
	114	+ return b.cantidadVendida - a.cantidadVendida;
	115	+ });
	116	+ } else {
	117	+ this.filterItems();
	118	+ }
	119	+
109	120	}
110	121
111	122	private elegirProducto(producto: Producto) {
...	...	@@ -94,5 +94,6 @@ export interface Producto {
94	94	idSinonimo?: number;
95	95	productos?: Producto[];
96	96	tieneSinonimos?: boolean;
97		- imagenes: object[]
	97	+ imagenes: object[],
	98	+ cantidadVendida: number
98	99	}