Eric Fernandez / gestion-comprobantes

Commit 0aa4d1f5292fefacd00d6d90ae35884b173b35e0

Authored by Eric Fernandez 2019-06-25 16:52:02 -0300

Exists in master

Merge branch 'master' into 'master'

Master(efernandez)

See merge request !5

Showing 5 changed files Show diff stats

src/app/app-routing.module.ts

Diff comments View file @ 0aa4d1f

 import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
+import { Routes, RouterModule, Router, NavigationEnd} from '@angular/router';
 import { ComprobantesComponent } from './comprobantes/comprobantes.component';
 import { AppBotonera } from './botonera/botonera.component';
 import { LoginComponent } from './login/login.component';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 const routes: Routes = [
   { path: 'comprobantes', component: ComprobantesComponent, pathMatch: 'full' },
   { path: '', redirectTo: 'home', pathMatch: 'full' },
   { path: 'home', component: AppBotonera },
   { path: 'login', component: LoginComponent }
 ];
 @NgModule({
   imports: [RouterModule.forRoot(routes)],
   exports: [RouterModule]
 })
-export class AppRoutingModule { }
+export class AppRoutingModule {
+  constructor(private router: Router, private modalService: NgbModal) {
+    router.events.subscribe(() => {
+      modalService.dismissAll();
+    })
+  }
+}

src/app/comprobantes/comprobantes.component.html

Diff comments View file @ 0aa4d1f

 <div class="row panel-informativo">
   <div class="col-12">
     <div class="row titulares">
-      <div class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope">
+      <div
+        class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope">
         Recepción
-        <button
+        <button class="btn btn-xs btn-outline-light float-right" type="button" (click)="busquedaComprobantes()"
-          class="btn btn-xs btn-outline-light float-right"
+          title="Buscar">
-          type="button"
+          <i class="fa fa-search"></i>
-          (click)="busquedaComprobantes()"
-          title="Buscar"
-        >
-        <i class="fa fa-search"></i>
         </button>
       </div>
       <div class="col-7 col-sm border border-white align-middle">
         Fecha:
-        <span
+        <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'dd/MM/yyyy' }}</span>
-        ng-click="datepickerAbierto = true"
-        >&nbsp;{{ fecha | date: 'dd/MM/yyyy' }}</span>
       </div>
       <div class="col-5 col-sm border border-white border-right-0 align-middle">
         Hora:
-        <span
+        <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'shortTime'}}</span>
-        ng-click="datepickerAbierto = true"
-        >&nbsp;{{ fecha | date: 'shortTime'}}</span>
       </div>
     </div>
   </div>
 </div>
 <div class="row">
   <form class="col-12 col-sm-10">
-    <div class="row border">
+    <div class="row border" *ngIf="showCabecera">
       <div class="col-6 col-sm-3 d-flex">
         <strong>Letra Factura:&nbsp;</strong>
         <label>{{cabecera['TIP']}}</label>
       </div>
       <div class="col-6 col-sm-3 d-flex">
         <strong>Tipo Factura:&nbsp;</strong>
         <label>{{cabecera['TCO']}}</label>
       </div>
       <div class="col-6 col-sm-3 d-flex">
         <strong>Sucursal:&nbsp;</strong>
         <label>{{cabecera['SUC']}}</label>
       </div>
       <div class="col-6 col-sm-3 d-flex">
         <strong>Número:&nbsp;</strong>
         <label>{{cabecera['NCO']}}</label>
       </div>
       <div class="col-6 col-sm-3 d-flex">
         <strong>Cuit:&nbsp;</strong>
         <label>{{cabecera['CUI']}}</label>
       </div>
       <div class="col-12 col-sm-6 d-flex">
         <strong>Nombre:&nbsp;</strong>
         <label>{{cabecera['NOM']}}</label>
       </div>
     </div>
-    <div class="row border pr-2">
+    <div>
-      <div class="col-4">
+      <button type="button" class="btn btn-dark form-control" (click)="showCabecera = !showCabecera">
-        <button
+        <i class="fa" [ngClass]="{'fa-chevron-down': !showCabecera, 'fa-chevron-up': showCabecera }"></i>
-        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">
+    <div class="row border pr-2">
-      <button
+      <div class="col-6">
-      type="button"
+        <button type="button" class="btn btn-outline-success btn-sm"
-      class="btn btn-outline-success btn-sm"
+          [ngClass]="{'active': estadoArticulos == 'modificado'}"
-      [ngClass]="{'active': estadoArticulos == 'aprobado'}"
+          (click)="estadoArticulos == 'modificado' ?  estadoArticulos = undefined : estadoArticulos = 'modificado'; filter = '';">
-      (click)="estadoArticulos = 'aprobado'; paginaActiva = 1; filter = '';">
+          Modificados&nbsp;({{getCantidadArticulosByEstado('modificado')}})
-      Aprobados&nbsp;({{getCantidadArticulosByEstado('aprobado')}})
+        </button>
-      </button>
+      </div>
+      <div class="col-6">
+        <button type="button" class="btn btn-outline-danger btn-sm"
+          [ngClass]="{'active': estadoArticulos == 'rechazado'}"
+          (click)="estadoArticulos == 'rechazado' ?  estadoArticulos = undefined : estadoArticulos = 'rechazado'; filter = '';">
+          Rechazados&nbsp;({{getCantidadArticulosByEstado('rechazado')}})
+        </button>
+      </div>
     </div>
-    <div class="col-4">
+    <div class="row">
-      <button
+      <input type="text" class="form-control-sm col-12" placeholder="Busque producto por nombre, codigo"
-      type="button"
+        [(ngModel)]="filter" [ngModelOptions]="{standalone: true}" />
-      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"
-      [(ngModel)]="filter"
-      [ngModelOptions]="{standalone: true}"/>
     </div>
     <div class="row">
       <table class="table table-dark">
         <thead>
           <tr>
-            <th *ngIf="estadoArticulos != 'rechazado'">Rechazar</th>
             <th>Producto</th>
             <th>Cantidad</th>
-            <th *ngIf="estadoArticulos != 'aprobado'">Aceptar</th>
+            <th></th>
           </tr>
         </thead>
-        <tbody>
+        <tbody class="scroll-tabla w-100 mb-5">
-          <tr *ngFor="let articulo of getPaginaFiltro()" [ngClass]="{'bg-success': articulo.estado == 'aprobado'}">
+          <tr *ngFor="let articulo of getPaginaFiltro();" class="row mx-0" [ngClass]="{'bg-danger': articulo.estado == 'rechazado'}">
-            <th *ngIf="estadoArticulos != 'rechazado'"><button type="button" class="" (click)="articulo.estado = 'rechazado'">
+            <td class="col-5">{{articulo.TIO.trim() || articulo.LI0}}</td>
-              <i class="fa fa-window-close"></i>
+            <td
-            </button></th>
+              class="col-5"
-            <th>{{articulo.TIO}}</th>
+              *ngIf="!articulo.input"
-            <th *ngIf="!articulo.input" (click)="articulo.input = true">
+              (click)="articulo.estado != 'rechazado' ? articulo.input = true : false"
-              {{articulo.recibido ? articulo.recibido + '/' : ''}}{{articulo.CAN}}</th>
+            >
-              <th *ngIf="articulo.input">
+              {{articulo.recibido ? articulo.recibido + '/' : ''}}{{articulo.CAN}}
-                <input
+            </td>
-                class="form-control-sm col-12"
+            <td *ngIf="articulo.input" class="col-5">
+              <input
+                class="form-control-sm col-10"
                 type="number"
-                (keyup.enter)="articulo.input = false"
+                (focus)="$event.target.select();"
-                [(ngModel)]="articulo.recibido"
+                (keyup.enter)="articulo.input = false; articulo.recibido = articulo.tempRecibido"
-                [ngModelOptions]="{standalone: true}"
+                [(ngModel)]="articulo.tempRecibido"
-                autofocus/>
+                [ngModelOptions]="{standalone: true}" autofocus/>
-                /{{articulo.CAN}}
+              /{{articulo.CAN}}
-              </th>
+            </td>
-              <th *ngIf="estadoArticulos != 'aprobado'">
+            <td class="col-2" *ngIf="articulo.estado != 'rechazado'">
-                <button type="button" class="" (click)="articulo.estado = 'aprobado'">
+              <button type="button"
-                  <i class="fa fa-check"></i>
+                (click)="articulo.estado = 'rechazado'">
-                </button>
+                <i class="fa fa-window-close"></i>
-              </th>
+              </button>
-            </tr>
+            </td>
-            <tr>
+            <td class="col-2" *ngIf="articulo.estado == 'rechazado'">
-              <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th>
+              <button type="button" (click)="articulo.estado = undefined">
-            </tr>
+                <i class="fa fa-check"></i>
-          </tbody>
+              </button>
-          <tfoot>
+            </td>
+          </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 position-absolute mb-5">
               <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">
                     <span aria-hidden="true">&laquo;</span>
                     <span class="sr-only">Anterior</span>
                   </a>
                 </li>
                 <li
                 class="page-item"
                 *ngFor="let pagina of paginas; index as i"
                 [ngClass]="{'active': pagina == paginaActiva}"
                 >
                 <a
                 class="page-link"
                 href="javascript:void();"
                 (click)="paginaActiva = pagina"
                 >{{pagina}}</a>

src/app/comprobantes/comprobantes.component.scss

Diff comments View file @ 0aa4d1f

 .panel-informativo {
   background: #67615e;
   color: #FFF;
   min-height: 32px;
   .form-group {
       margin-bottom: 5px;
   }
   .form-control-xs {
       height: calc(1.6rem);
       padding: .25rem .5rem;
       font-size: .8rem;
       line-height: 1.3;
       border-radius: .2rem;
   }
   .label {
       font-size: .8em;
   }
   .valor {
       font-size: .8em;
   }
   .border{
       border-width: 4px 2px !important;
   }
   .nota-pedido {
       @media (max-width: 576px) {
           text-align: center;
       }
   }
 }
 .titulares>div{
     display: flex;
     line-height: 30px;
     h5{
         line-height: 30px;
     }
     button{
         margin: auto;
         margin-right: 0;
     }
     @media(max-width: 992px){
         border-top: none !important;
         border-right: none !important;
         border-left: none !important;
         border-bottom: 2px solid #FFF !important;
         &:last-child{
             border-left: 2px solid #FFF !important;
         }
         &:first-child{
             border-top: 2px solid #FFF !important;
         }
     }
-}
+}
+.scroll-tabla {
+    position: absolute;
+    max-height: 200%;
+    overflow: auto;
+    background-color: #343a40;
+}

src/app/comprobantes/comprobantes.component.ts

Diff comments View file @ 0aa4d1f

 import { Component, OnInit} from '@angular/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { BusquedaComprobanteComponent } from '../busqueda-comprobante/busqueda-comprobante.component';
 import { ComprobanteService } from './comprobantes.service';
 import { Router } from '@angular/router';
 @Component({
   templateUrl: './comprobantes.component.html',
   styleUrls: ['./comprobantes.component.scss'],
   providers:[ ComprobanteService ]
 })
 export class ComprobantesComponent implements OnInit {
   constructor(
       private modalService: NgbModal,
       public comprobanteService: ComprobanteService,
       public router: Router) { }
   ngOnInit() { }
   filter = '';
-  estadoArticulos = 'pendiente';
+  estadoArticulos : string;
-  comprobantes = [1, 2, 3];
+  tempRecibido = [];
   cabecera = {};
   cuerpo = [];
   articulosFiltro = [];
-  paginaActiva = 1;
-  paginas = [];
   saveLoading = false;
+  showCabecera = true;
   fecha = new Date();
-  paginar() {
-    var cantPaginas = Math.ceil(this.articulosFiltro.length / 5);
-    this.paginas = [];
-    for (let i = 0; i < cantPaginas; i++) {
-      this.paginas.push(i + 1);
-    }
-  }
   getPaginaFiltro() {
     this.articulosFiltro = this.cuerpo.filter((articulo) => {
-      return articulo.estado == this.estadoArticulos &&
-        (articulo.TIO.toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()) ||
-        articulo.codigoBarras == this.filter);
-    });
-    this.paginar();
+      var tio = articulo.TIO.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase());
+      var lio = articulo.LI0.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase());
+      var codigoBarras = articulo.codigoBarras == this.filter;
+      articulo.recibido && !articulo.estado ? articulo.estado = 'modificado' : false;
+      var estado = articulo.estado == this.estadoArticulos;
+      return (tio || lio || codigoBarras) && estado;
+    });
-    return this.articulosFiltro.slice((this.paginaActiva - 1) * 5 , this.paginaActiva * 5);
+    return this.articulosFiltro;
   }
   getCantidadArticulosByEstado(estado: String) {
     return this.cuerpo.filter((articulo) => {
       return articulo.estado == estado;
     }).length;
   }
   guardarComprobante() {
     if (this.getCantidadArticulosByEstado('pendiente')) {
       alert('No deben quedar articulos pendientes');
+      return;
     }
+    if (!this.cuerpo.length) {
+      alert('Debe seleccionar un comprobante');
+      return;
+    }
+    this.saveLoading = true;
     this.comprobanteService
       .saveComprobantes({cabecera: this.cabecera, cuerpo: this.cuerpo})
       .subscribe(data => {
         alert('Comprobante guardado con éxito');
+        this.saveLoading = false;
         this.router.navigateByUrl('/home');
       }, err => {
         alert('Algo salió mal');
+        this.saveLoading = false;
         console.log(err);

src/etc/AppSetings.ts

Diff comments View file @ 0aa4d1f

1	export class AppSetings {	1	export class AppSetings {
2	public static END_POINT='http://10.231.45.234:6060/gateway-debo';	2	public static END_POINT='http://localhost:6060/gateway-debo';
3	}	3	}
4		4