Marcelo Aiello / gestion-comprobantes

Download as
Browse Code »

Commit 26ab7d6442ca8ec0480af9cfa4ba862ec5791640

Authored by Eric Fernandez
2 parents d9e6d50e16 ce26c30d51
Exists in master and in 1 other branch fec14082020_1215

Merge branch 'master' into 'master' 

Master(efernandez)

See merge request !10
Showing 2 changed files   Show diff stats
src/app/comprobantes/comprobantes.component.html
Diff comments   View file @ 26ab7d6
1 <div class="row panel-informativo"> 1 <div class="row panel-informativo">
2 <div class="col-12"> 2 <div class="col-12">
3 <div class="row titulares"> 3 <div class="row titulares">
4 <div 4 <div
5 class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope"> 5 class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope">
6 Recepción 6 Recepción
7 <button class="btn btn-xs btn-outline-light float-right" type="button" (click)="busquedaComprobantes()" 7 <button class="btn btn-xs btn-outline-light float-right" type="button" (click)="busquedaComprobantes()"
8 title="Buscar"> 8 title="Buscar">
9 <i class="fa fa-search"></i> 9 <i class="fa fa-search"></i>
10 </button> 10 </button>
11 </div> 11 </div>
12 <div class="col-7 col-sm border border-white align-middle"> 12 <div class="col-7 col-sm border border-white align-middle">
13 Fecha: 13 Fecha:
14 <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'dd/MM/yyyy' }}</span> 14 <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'dd/MM/yyyy' }}</span>
15 </div> 15 </div>
16 <div class="col-5 col-sm border border-white border-right-0 align-middle"> 16 <div class="col-5 col-sm border border-white border-right-0 align-middle">
17 Hora: 17 Hora:
18 <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'shortTime'}}</span> 18 <span ng-click="datepickerAbierto = true">&nbsp;{{ fecha | date: 'shortTime'}}</span>
19 </div> 19 </div>
20 </div> 20 </div>
21 </div> 21 </div>
22 </div> 22 </div>
23 <div class="row"> 23 <div class="row">
24 <form class="col-12 col-sm-10"> 24 <form class="col-12 col-sm-10">
25 <div class="row border" *ngIf="showCabecera"> 25 <div class="row border" *ngIf="showCabecera">
26 <div class="col-6 col-sm-3 d-flex"> 26 <div class="col-6 col-sm-3 d-flex">
27 <strong>Letra Factura:&nbsp;</strong> 27 <strong>Letra Factura:&nbsp;</strong>
28 <label>{{cabecera['TIP']}}</label> 28 <label>{{cabecera['TIP']}}</label>
29 </div> 29 </div>
30 <div class="col-6 col-sm-3 d-flex"> 30 <div class="col-6 col-sm-3 d-flex">
31 <strong>Tipo Factura:&nbsp;</strong> 31 <strong>Tipo Factura:&nbsp;</strong>
32 <label>{{cabecera['TCO']}}</label> 32 <label>{{cabecera['TCO']}}</label>
33 </div> 33 </div>
34 <div class="col-6 col-sm-3 d-flex"> 34 <div class="col-6 col-sm-3 d-flex">
35 <strong>Sucursal:&nbsp;</strong> 35 <strong>Sucursal:&nbsp;</strong>
36 <label>{{cabecera['SUC']}}</label> 36 <label>{{cabecera['SUC']}}</label>
37 </div> 37 </div>
38 <div class="col-6 col-sm-3 d-flex"> 38 <div class="col-6 col-sm-3 d-flex">
39 <strong>Número:&nbsp;</strong> 39 <strong>Número:&nbsp;</strong>
40 <label>{{cabecera['NCO']}}</label> 40 <label>{{cabecera['NCO']}}</label>
41 </div> 41 </div>
42 <div class="col-6 col-sm-3 d-flex"> 42 <div class="col-6 col-sm-3 d-flex">
43 <strong>Cuit:&nbsp;</strong> 43 <strong>Cuit:&nbsp;</strong>
44 <label>{{cabecera['CUI']}}</label> 44 <label>{{cabecera['CUI']}}</label>
45 </div> 45 </div>
46 <div class="col-12 col-sm-6 d-flex"> 46 <div class="col-12 col-sm-6 d-flex">
47 <strong>Nombre:&nbsp;</strong> 47 <strong>Nombre:&nbsp;</strong>
48 <label>{{cabecera['NOM']}}</label> 48 <label>{{cabecera['NOM']}}</label>
49 </div> 49 </div>
50 </div> 50 </div>
51 <div> 51 <div>
52 <button type="button" class="btn btn-dark form-control" (click)="showCabecera = !showCabecera"> 52 <button type="button" class="btn btn-dark form-control" (click)="showCabecera = !showCabecera">
53 <i class="fa" [ngClass]="{'fa-chevron-down': !showCabecera, 'fa-chevron-up': showCabecera }"></i> 53 <i class="fa" [ngClass]="{'fa-chevron-down': !showCabecera, 'fa-chevron-up': showCabecera }"></i>
54 </button> 54 </button>
55 </div> 55 </div>
56 <div class="row border pr-2"> 56 <div class="row border pr-2">
57 <div class="col-6"> 57 <div class="col-6">
58 <button type="button" class="btn btn-outline-success btn-sm" 58 <button type="button" class="btn btn-outline-success btn-sm"
59 [ngClass]="{'active': estadoArticulos == 'modificado'}" 59 [ngClass]="{'active': estadoArticulos == 'modificado'}"
60 (click)="estadoArticulos == 'modificado' ? estadoArticulos = undefined : estadoArticulos = 'modificado'; filter = '';"> 60 (click)="estadoArticulos == 'modificado' ? estadoArticulos = undefined : estadoArticulos = 'modificado'; filter = '';">
61 Modificados&nbsp;({{getCantidadArticulosByEstado('modificado')}}) 61 Modificados&nbsp;({{getCantidadArticulosByEstado('modificado')}})
62 </button> 62 </button>
63 </div> 63 </div>
64 <div class="col-6"> 64 <div class="col-6">
65 <button type="button" class="btn btn-outline-danger btn-sm" 65 <button type="button" class="btn btn-outline-danger btn-sm"
66 [ngClass]="{'active': estadoArticulos == 'rechazado'}" 66 [ngClass]="{'active': estadoArticulos == 'rechazado'}"
67 (click)="estadoArticulos == 'rechazado' ? estadoArticulos = undefined : estadoArticulos = 'rechazado'; filter = '';"> 67 (click)="estadoArticulos == 'rechazado' ? estadoArticulos = undefined : estadoArticulos = 'rechazado'; filter = '';">
68 Rechazados&nbsp;({{getCantidadArticulosByEstado('rechazado')}}) 68 Rechazados&nbsp;({{getCantidadArticulosByEstado('rechazado')}})
69 </button> 69 </button>
70 </div> 70 </div>
71 </div> 71 </div>
72 <div class="row"> 72 <div class="row">
73 <input type="text" class="form-control-sm col-12" placeholder="Busque producto por nombre, codigo" 73 <input type="text" class="form-control-sm col-12" placeholder="Busque producto por nombre, codigo"
74 [(ngModel)]="filter" [ngModelOptions]="{standalone: true}" /> 74 [(ngModel)]="filter" [ngModelOptions]="{standalone: true}" />
75 </div> 75 </div>
76 <div class="row"> 76 <div class="row">
77 <table class="table table-dark"> 77 <table class="table table-dark">
78 <thead> 78 <thead>
79 <tr> 79 <tr>
80 <th>Producto</th> 80 <th>Producto</th>
81 <th>Cantidad</th> 81 <th>Cantidad</th>
82 <th></th> 82 <th></th>
83 </tr> 83 </tr>
84 </thead> 84 </thead>
85 <tbody class="scroll-tabla w-100 mb-5"> 85 <tbody class="scroll-tabla w-100 mb-5">
86 <tr *ngFor="let articulo of getPaginaFiltro();" class="row mx-0" [ngClass]="{'bg-danger': articulo.estado == 'rechazado'}"> 86 <tr *ngFor="let articulo of getPaginaFiltro();" class="row mx-0" [ngClass]="{'bg-danger': articulo.estado == 'rechazado'}">
87 <td class="col-5">{{articulo.TIO.trim() || articulo.LI0}}</td> 87 <td class="col-5">{{articulo.TIO.trim() || articulo.LI0}}</td>
88 <td 88 <td
89 class="col-5" 89 class="col-5"
90 *ngIf="!articulo.input" 90 *ngIf="!articulo.input"
91 (click)="articulo.estado != 'rechazado' ? articulo.input = true : false" 91 (click)="articulo.estado != 'rechazado' ? articulo.input = true : false"
92 > 92 >
93 {{articulo.recibido ? articulo.recibido + '/' : ''}}{{articulo.CAN}} 93 {{articulo.cantidadRecibida != articulo.CAN ? articulo.cantidadRecibida + '/' : ''}}{{articulo.CAN}}
94 </td> 94 </td>
95 <td *ngIf="articulo.input" class="col-5"> 95 <td *ngIf="articulo.input" class="col-5">
96 <input 96 <input
97 class="form-control-sm col-10" 97 class="form-control-sm col-10"
98 type="number" 98 type="number"
99 (focus)="$event.target.select();" 99 (focus)="$event.target.select();"
100 (keyup.enter)="inputArticulo(articulo)" 100 (keyup.enter)="inputArticulo(articulo)"
101 (keyup.esc)="articulo.input = false" 101 (keyup.esc)="articulo.input = false"
102 [(ngModel)]="articulo.tempRecibido" 102 [(ngModel)]="articulo.tempRecibido"
103 [ngModelOptions]="{standalone: true}" autofocus/> 103 [ngModelOptions]="{standalone: true}" autofocus/>
104 /{{articulo.CAN}} 104 /{{articulo.CAN}}
105 </td> 105 </td>
106 <td class="col-2" *ngIf="articulo.estado != 'rechazado'"> 106 <td class="col-2" *ngIf="articulo.estado != 'rechazado'">
107 <button type="button" 107 <button type="button"
108 (click)="articulo.estado = 'rechazado'"> 108 (click)="articulo.estado = 'rechazado'">
109 <i class="fa fa-window-close"></i> 109 <i class="fa fa-window-close"></i>
110 </button> 110 </button>
111 </td> 111 </td>
112 <td class="col-2" *ngIf="articulo.estado == 'rechazado'"> 112 <td class="col-2" *ngIf="articulo.estado == 'rechazado'">
113 <button type="button" (click)="articulo.estado = undefined"> 113 <button type="button" (click)="articulo.estado = undefined">
114 <i class="fa fa-check"></i> 114 <i class="fa fa-check"></i>
115 </button> 115 </button>
116 </td> 116 </td>
117 </tr> 117 </tr>
118 <tr> 118 <tr>
119 <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th> 119 <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th>
120 </tr> 120 </tr>
121 </tbody> 121 </tbody>
122 </table> 122 </table>
123 </div> 123 </div>
124 </form> 124 </form>
125 <app-acciones (guardar)="guardarComprobante()" [(saveLoading)]="saveLoading"></app-acciones> 125 <app-acciones (guardar)="guardarComprobante()" [(saveLoading)]="saveLoading"></app-acciones>
126 </div> 126 </div>
src/app/comprobantes/comprobantes.component.ts
Diff comments   View file @ 26ab7d6
1 import { Component, OnInit} from '@angular/core'; 1 import { Component, OnInit} from '@angular/core';
2 import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; 2 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
3 import { BusquedaComprobanteComponent } from '../busqueda-comprobante/busqueda-comprobante.component'; 3 import { BusquedaComprobanteComponent } from '../busqueda-comprobante/busqueda-comprobante.component';
4 import { ComprobanteService } from './comprobantes.service'; 4 import { ComprobanteService } from './comprobantes.service';
5 import { Router } from '@angular/router'; 5 import { Router } from '@angular/router';
6 6
7 @Component({ 7 @Component({
8 templateUrl: './comprobantes.component.html', 8 templateUrl: './comprobantes.component.html',
9 styleUrls: ['./comprobantes.component.scss'], 9 styleUrls: ['./comprobantes.component.scss'],
10 providers:[ ComprobanteService ] 10 providers:[ ComprobanteService ]
11 }) 11 })
12 export class ComprobantesComponent implements OnInit { 12 export class ComprobantesComponent implements OnInit {
13 13
14 constructor( 14 constructor(
15 private modalService: NgbModal, 15 private modalService: NgbModal,
16 public comprobanteService: ComprobanteService, 16 public comprobanteService: ComprobanteService,
17 public router: Router) { } 17 public router: Router) { }
18 18
19 ngOnInit() { } 19 ngOnInit() { }
20 20
21 filter = ''; 21 filter = '';
22 estadoArticulos : string; 22 estadoArticulos : string;
23 tempRecibido = []; 23 tempRecibido = [];
24 cabecera = {}; 24 cabecera = {};
25 cuerpo = []; 25 cuerpo = [];
26 articulosFiltro = []; 26 articulosFiltro = [];
27 saveLoading = false; 27 saveLoading = false;
28 showCabecera = true; 28 showCabecera = true;
29 29
30 fecha = new Date(); 30 fecha = new Date();
31 31
32 getPaginaFiltro() { 32 getPaginaFiltro() {
33 33
34 this.articulosFiltro = this.cuerpo.filter((articulo) => { 34 this.articulosFiltro = this.cuerpo.filter((articulo) => {
35 35
36 var tio = articulo.TIO.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()); 36 var tio = articulo.TIO.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase());
37 var lio = articulo.LI0.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()); 37 var lio = articulo.LI0.trim().toLocaleUpperCase().includes(this.filter.toLocaleUpperCase());
38 var codigoBarras = articulo.codigoBarras == this.filter; 38 var codigoBarras = articulo.codigoBarras == this.filter;
39 39
40 articulo.recibido && !articulo.estado ? articulo.estado = 'modificado' : false; 40 articulo.cantidadRecibida != articulo.CAN && !articulo.estado ? articulo.estado = 'modificado' :
41 false;
41 42
42 var estado = articulo.estado == this.estadoArticulos; 43 var estado = articulo.estado == this.estadoArticulos;
43 44
44 return (tio || lio || codigoBarras) && estado; 45 return (tio || lio || codigoBarras) && estado;
45 }); 46 });
46 47
47 return this.articulosFiltro; 48 return this.articulosFiltro;
48 } 49 }
49 50
50 getCantidadArticulosByEstado(estado: String) { 51 getCantidadArticulosByEstado(estado: String) {
51 return this.cuerpo.filter((articulo) => { 52 return this.cuerpo.filter((articulo) => {
52 return articulo.estado == estado; 53 return articulo.estado == estado;
53 }).length; 54 }).length;
54 } 55 }
55 56
56 guardarComprobante() { 57 guardarComprobante() {
57 58
58 if (this.getCantidadArticulosByEstado('pendiente')) { 59 if (this.getCantidadArticulosByEstado('pendiente')) {
59 alert('No deben quedar articulos pendientes'); 60 alert('No deben quedar articulos pendientes');
60 return; 61 return;
61 } 62 }
62 63
63 if (!this.cuerpo.length) { 64 if (!this.cuerpo.length) {
64 alert('Debe seleccionar un comprobante'); 65 alert('Debe seleccionar un comprobante');
65 return; 66 return;
66 } 67 }
67 68
68 this.saveLoading = true; 69 this.saveLoading = true;
69 70
70 this.comprobanteService 71 this.comprobanteService
71 .saveComprobantes({cabecera: this.cabecera, cuerpo: this.cuerpo}) 72 .saveComprobantes({cabecera: this.cabecera, cuerpo: this.cuerpo})
72 .subscribe(data => { 73 .subscribe(data => {
73 74
74 alert('Comprobante guardado con éxito'); 75 alert('Comprobante guardado con éxito');
75 this.saveLoading = false; 76 this.saveLoading = false;
76 this.router.navigateByUrl('/home'); 77 this.router.navigateByUrl('/home');
77 78
78 }, err => { 79 }, err => {
79 80
80 alert('Algo salió mal...'); 81 alert('Algo salió mal...');
81 this.saveLoading = false; 82 this.saveLoading = false;
82 console.log(err); 83 console.log(err);
83 }); 84 });
84 } 85 }
85 86
86 busquedaComprobantes() { 87 busquedaComprobantes() {
87 this.modalService.open(BusquedaComprobanteComponent).result.then(comprobante => { 88 this.modalService.open(BusquedaComprobanteComponent).result.then(comprobante => {
88 89
89 this.cabecera = comprobante.cabecera; 90 this.cabecera = comprobante.cabecera;
91
92 comprobante.cuerpo.forEach(articulo => {
93 articulo.cantidadRecibida = articulo.CAN;
94 });
95
90 this.cuerpo = comprobante.cuerpo; 96 this.cuerpo = comprobante.cuerpo;
91 97
92 this.getPaginaFiltro(); 98 this.getPaginaFiltro();
93 }, (reason) => { }); 99 }, (reason) => { });
94 } 100 }
95 101
96 inputArticulo(articulo) { 102 inputArticulo(articulo) {
97 if (articulo.tempRecibido > 999999) { 103 if (articulo.tempRecibido > 999999) {
98 alert('Cantidad máxima superada'); 104 alert('Cantidad máxima superada');
99 return; 105 return;
100 } 106 }
101 articulo.input = false; 107 articulo.input = false;
102 articulo.recibido = articulo.tempRecibido; 108 articulo.cantidadRecibida = articulo.tempRecibido || articulo.CAN;
103 } 109 }
104 110
105 } 111 }
106 112