From ab1def30d4b47c2f3928e40e5bd5d76233ab8383 Mon Sep 17 00:00:00 2001
From: Eric Fernandez <efernandez@focasoftware.com>
Date: Mon, 3 Jun 2019 17:12:29 -0300
Subject: [PATCH] pendiente, aprobados, rechazados

---
 src/app/comprobantes/comprobantes.component.html | 49 ++++++++++++++++----
 src/app/comprobantes/comprobantes.component.ts   | 58 +++++++++++++++++-------
 2 files changed, 82 insertions(+), 25 deletions(-)

diff --git a/src/app/comprobantes/comprobantes.component.html b/src/app/comprobantes/comprobantes.component.html
index a5cf86e..553ddef 100644
--- a/src/app/comprobantes/comprobantes.component.html
+++ b/src/app/comprobantes/comprobantes.component.html
@@ -56,26 +56,56 @@
       <label>{{cabecera.NOM}}</label>
     </div>
   </div>
+  <div class="row border">
+    <div class="col-4">
+      <button
+        type="button"
+        class="btn btn-outline-secondary btn-sm"
+        [ngClass]="{'active': estadoArticulos == 'pendiente'}"
+        (click)="estadoArticulos = 'pendiente'; paginaActiva = 1; filter = '';">
+          Pendientes&nbsp;({{getCantidadArticulosByEstado('pendiente')}})
+      </button>
+    </div>
+    <div class="col-4">
+      <button
+        type="button"
+        class="btn btn-outline-success btn-sm"
+        [ngClass]="{'active': estadoArticulos == 'aprobado'}"
+        (click)="estadoArticulos = 'aprobado'; paginaActiva = 1; filter = '';">
+          Aprobados&nbsp;({{getCantidadArticulosByEstado('aprobado')}})
+      </button>
+    </div>
+    <div class="col-4">
+      <button
+        type="button"
+        class="btn btn-outline-danger btn-sm"
+        [ngClass]="{'active': estadoArticulos == 'rechazado'}"
+        (click)="estadoArticulos = 'rechazado'; paginaActiva = 1; filter = '';">
+          Rechazados&nbsp;({{getCantidadArticulosByEstado('rechazado')}})
+      </button>
+    </div>
+  </div>
   <div class="row">
     <input
       type="text"
       class="form-control-sm col-12"
       placeholder="Busque producto por nombre, codigo"
-      (keyup)="filtrar($event)"/>
+      [(ngModel)]="filter"
+      [ngModelOptions]="{standalone: true}"/>
   </div>
   <div class="row">
     <table class="table table-dark">
       <thead>
         <tr>
-          <th>Rechazar</th>
+          <th *ngIf="estadoArticulos != 'rechazado'">Rechazar</th>
           <th>Producto</th>
           <th>Cantidad</th>
-          <th>Aceptar</th>
+          <th *ngIf="estadoArticulos != 'aprobado'">Aceptar</th>
         </tr>
       </thead>
       <tbody>
-        <tr *ngFor="let articulo of getPaginaFiltro()" [ngClass]="{'bg-success': articulo.done}">
-          <th><button type="button" class="" (click)="articulo.input = true">
+        <tr *ngFor="let articulo of getPaginaFiltro()" [ngClass]="{'bg-success': articulo.estado == 'aprobado'}">
+          <th *ngIf="estadoArticulos != 'rechazado'"><button type="button" class="" (click)="articulo.estado = 'rechazado'">
             <i class="fa fa-window-close"></i>
           </button></th>
           <th>{{articulo.LI0}}</th>
@@ -83,15 +113,18 @@
           <th *ngIf="articulo.input">
             <input class="form-control-sm col-12"/>
           </th>
-          <th>
-            <button type="button" class="" (click)="articulo.done = true">
+          <th *ngIf="estadoArticulos != 'aprobado'">
+            <button type="button" class="" (click)="articulo.estado = 'aprobado'">
               <i class="fa fa-check"></i>
             </button>
           </th>
         </tr>
+        <tr>
+          <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th>
+        </tr>
       </tbody>
     <tfoot>
-      <nav *ngIf="articulosFiltro.length > 0" class="mr-auto">
+      <nav *ngIf="articulosFiltro.length > 0" class="mr-auto position-absolute">
         <ul class="pagination pagination-sm justify-content mb-0">
           <li class="page-item" [ngClass]="{'disabled': paginaActiva == 1}">
               <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva - 1">
diff --git a/src/app/comprobantes/comprobantes.component.ts b/src/app/comprobantes/comprobantes.component.ts
index a11274c..7ee7c9e 100644
--- a/src/app/comprobantes/comprobantes.component.ts
+++ b/src/app/comprobantes/comprobantes.component.ts
@@ -1,7 +1,6 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit} from '@angular/core';
 
 @Component({
-  selector: 'app-comprobantes',
   templateUrl: './comprobantes.component.html',
   styleUrls: ['./comprobantes.component.scss']
 })
@@ -15,20 +14,19 @@ export class ComprobantesComponent implements OnInit {
   }
 
   filter = '';
+  estadoArticulos = 'pendiente';
   comprobantes = [1, 2, 3];
   cabecera = {};
   cuerpo = [];
   articulosFiltro = [];
   paginaActiva = 1;
   paginas = [];
-
+  
   fecha = new Date();
 
   filtrar(event: any) {
     this.articulosFiltro =  this.cuerpo.filter((param)=> {
-      return (param.LI0).toLocaleUpperCase().includes(
-        (event.target.value).toLocaleUpperCase()) ||
-        param.codigoBarras == event.target.value;
+      return 
     });
 
     this.paginar();
@@ -36,7 +34,7 @@ export class ComprobantesComponent implements OnInit {
 
   paginar() {
 
-    var cantPaginas = Math.round(this.articulosFiltro.length / 5) + 1;
+    var cantPaginas = Math.ceil(this.articulosFiltro.length / 5);
     this.paginas = [];
     for (let i = 0; i < cantPaginas; i++) {
       this.paginas.push(i + 1);
@@ -44,8 +42,22 @@ export class ComprobantesComponent implements OnInit {
   }
 
   getPaginaFiltro() {
-    return this.articulosFiltro.slice(
-      (this.paginaActiva - 1) * 5 , this.paginaActiva * 5);
+
+    this.articulosFiltro = this.cuerpo.filter((articulo) => {
+      return articulo.estado == this.estadoArticulos &&
+        (articulo.LI0.toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()) ||
+        articulo.codigoBarras == this.filter);
+    });
+
+    this.paginar();
+
+    return this.articulosFiltro.slice((this.paginaActiva - 1) * 5 , this.paginaActiva * 5);
+  }
+
+  getCantidadArticulosByEstado(estado: String) {
+    return this.cuerpo.filter((articulo) => {
+      return articulo.estado == estado;
+    }).length;
   }
 
   obtenerConsulta() {
@@ -61,36 +73,48 @@ export class ComprobantesComponent implements OnInit {
         NOM: 'POTIGIAN GOLOCINAS',
         CUI: '30-54775125-2'
       };
-  
+
       this.cuerpo = [
         {
           LI0: 'Mantel Combo Bolso CocaCola',
           CAN: 5,
+          estado: 'pendiente',
           codigoBarras: '7790667006462'
         },
         {
           LI0: 'Papas',
-          CAN: 5
+          CAN: 5,
+          estado: 'pendiente',
         },
         {
           LI0: 'Peras',
-          CAN: 5
+          CAN: 5,
+          estado: 'pendiente',
         },
         {
           LI0: 'Cafe',
-          CAN: 5
+          CAN: 5,
+          estado: 'pendiente',
+        },
+        {
+          LI0: 'Cafe capuchino',
+          CAN: 5,
+          estado: 'pendiente',
         },
         {
           LI0: 'Menta',
-          CAN: 5
+          CAN: 5,
+          estado: 'pendiente',
         },
         {
           LI0: 'Fernet',
-          CAN: 5
+          CAN: 5,
+          estado: 'pendiente',
         },
         {
-          LI0: 'Birra',
-          CAN: 5
+          LI0: 'Andes',
+          CAN: 5,
+          estado: 'pendiente',
         }
       ];
   
-- 
1.9.1