Commit 13d8a7169e662ac901c0f9b944877c24511d40ab
Exists in
master
and in
1 other branch
Merge branch 'master' into 'master'
Master(efernandez) See merge request !3
Showing
14 changed files
Show diff stats
src/app/acciones/acciones.component.ts
1 | import { Component, OnInit, Output, EventEmitter } from '@angular/core'; | 1 | import { Component, OnInit, Output, EventEmitter } from '@angular/core'; |
2 | @Component({ | 2 | @Component({ |
3 | selector: 'app-acciones', | 3 | selector: 'app-acciones', |
4 | templateUrl: './acciones.component.html', | 4 | templateUrl: './acciones.component.html', |
5 | styleUrls: ['./acciones.component.scss'] | 5 | styleUrls: ['./acciones.component.scss'], |
6 | inputs: ['saveLoading'] | ||
6 | }) | 7 | }) |
7 | export class AccionesComponent implements OnInit { | 8 | export class AccionesComponent implements OnInit { |
8 | 9 | ||
9 | @Output() guardar = new EventEmitter<any>(); | 10 | @Output() guardar = new EventEmitter<any>(); |
10 | saveLoading = false; | 11 | saveLoading = false; |
11 | 12 | ||
12 | constructor() { } | 13 | constructor() { } |
13 | 14 | ||
14 | ngOnInit() { | 15 | ngOnInit() { |
15 | } | 16 | } |
16 | 17 | ||
17 | callSave() { | 18 | callSave() { |
18 | //llamo función guardar pasada en el componente | 19 | //llamo función guardar pasada en el componente |
19 | this.saveLoading = true; | 20 | this.guardar.emit(); |
20 | |||
21 | setTimeout(() => { | ||
22 | this.saveLoading = false; | ||
23 | }, 10000); | ||
24 | } | 21 | } |
25 | } | 22 | } |
src/app/app.module.ts
1 | import { BrowserModule } from '@angular/platform-browser'; | 1 | import { BrowserModule } from '@angular/platform-browser'; |
2 | import { NgModule } from '@angular/core'; | 2 | import { NgModule } from '@angular/core'; |
3 | import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; | 3 | import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; |
4 | import { HttpClientModule } from '@angular/common/http'; | 4 | import { HttpClientModule } from '@angular/common/http'; |
5 | import { FormsModule } from '@angular/forms'; | 5 | import { FormsModule } from '@angular/forms'; |
6 | import { LaddaModule } from 'angular2-ladda'; | 6 | import { LaddaModule } from 'angular2-ladda'; |
7 | 7 | ||
8 | import { AppRoutingModule } from './app-routing.module'; | 8 | import { AppRoutingModule } from './app-routing.module'; |
9 | import { AppComponent } from './app.component'; | 9 | import { AppComponent } from './app.component'; |
10 | import { AppBotonera } from './botonera/botonera.component'; | 10 | import { AppBotonera } from './botonera/botonera.component'; |
11 | import { ComprobantesComponent } from './comprobantes/comprobantes.component'; | 11 | import { ComprobantesComponent } from './comprobantes/comprobantes.component'; |
12 | import { NombreEmpresaComponent } from './nombre-empresa/nombre-empresa.component'; | 12 | import { NombreEmpresaComponent } from './nombre-empresa/nombre-empresa.component'; |
13 | import { AccionesComponent } from './acciones/acciones.component'; | 13 | import { AccionesComponent } from './acciones/acciones.component'; |
14 | import { LoginComponent } from './login/login.component'; | 14 | import { LoginComponent } from './login/login.component'; |
15 | import { BusquedaComprobanteComponent } from './busqueda-comprobante/busqueda-comprobante.component'; | 15 | import { BusquedaComprobanteComponent } from './busqueda-comprobante/busqueda-comprobante.component'; |
16 | 16 | ||
17 | @NgModule({ | 17 | @NgModule({ |
18 | declarations: [ | 18 | declarations: [ |
19 | AppComponent, | 19 | AppComponent, |
20 | AppBotonera, | 20 | AppBotonera, |
21 | ComprobantesComponent, | 21 | ComprobantesComponent, |
22 | NombreEmpresaComponent, | 22 | NombreEmpresaComponent, |
23 | AccionesComponent, | 23 | AccionesComponent, |
24 | LoginComponent, | 24 | LoginComponent, |
25 | BusquedaComprobanteComponent | 25 | BusquedaComprobanteComponent |
26 | ], | 26 | ], |
27 | imports: [ | 27 | imports: [ |
28 | BrowserModule, | 28 | BrowserModule, |
29 | AppRoutingModule, | 29 | AppRoutingModule, |
30 | NgbModule, | 30 | NgbModule, |
31 | HttpClientModule, | 31 | HttpClientModule, |
32 | FormsModule, | 32 | FormsModule, |
33 | LaddaModule | 33 | LaddaModule |
34 | ], | 34 | ], |
35 | entryComponents:[BusquedaComprobanteComponent], | ||
35 | providers: [], | 36 | providers: [], |
36 | bootstrap: [AppComponent] | 37 | bootstrap: [AppComponent] |
37 | }) | 38 | }) |
38 | export class AppModule { } | 39 | export class AppModule { } |
39 | 40 |
src/app/busqueda-comprobante/busqueda-comprobante.component.html
File was created | 1 | <div class="modal-header py-1"> | |
2 | <div class="row w-100"> | ||
3 | <div class="col-lg-6"> | ||
4 | <h5 class="modal-title">Búsqueda de Comprobantes</h5> | ||
5 | </div> | ||
6 | </div> | ||
7 | </div> | ||
8 | <div class="modal-body d-flex" id="modal-body"> | ||
9 | <table class="table table-striped table-sm"> | ||
10 | <thead> | ||
11 | <tr> | ||
12 | <th>Comprobante</th> | ||
13 | <th>Items</th> | ||
14 | <th></th> | ||
15 | </tr> | ||
16 | </thead> | ||
17 | <tbody> | ||
18 | <tr *ngFor="let comprobante of getPaginaFiltro()"> | ||
19 | <td> | ||
20 | {{comprobante.cabecera.TCO + '-' + comprobante.cabecera.TIP + '-' + rellenar(4, comprobante.cabecera.SUC) + '-' + rellenar(8, comprobante.cabecera.NCO)}} | ||
21 | </td> | ||
22 | <td>{{comprobante.cuerpo.length}}</td> | ||
23 | <td> | ||
24 | <button type="button" class="btn btn-xs p-1 float-right btn-primary" (click)="selectItem(comprobante)"> | ||
25 | <i class="fa fa-circle-thin" aria-hidden="true"></i> | ||
26 | </button> | ||
27 | </td> | ||
28 | </tr> | ||
29 | </tbody> | ||
30 | </table> | ||
31 | </div> | ||
32 | <div class="modal-footer py-1"> | ||
33 | <nav *ngIf="comprobantes.length > 0" class="mr-auto mb-5"> | ||
34 | <ul class="pagination pagination-sm justify-content mb-0"> | ||
35 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == 1}"> | ||
36 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva - 1"> | ||
37 | <span aria-hidden="true">«</span> | ||
38 | <span class="sr-only">Anterior</span> | ||
39 | </a> | ||
40 | </li> | ||
41 | <li | ||
42 | class="page-item" | ||
43 | *ngFor="let pagina of paginas; index as i" | ||
44 | [ngClass]="{'active': pagina == paginaActiva}" | ||
45 | > | ||
46 | <a | ||
47 | class="page-link" | ||
48 | href="javascript:void();" | ||
49 | (click)="paginaActiva = pagina" | ||
50 | >{{pagina}}</a> | ||
51 | </li> | ||
52 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == paginas.length}"> | ||
53 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva + 1"> | ||
54 | <span aria-hidden="true">»</span> | ||
55 | <span class="sr-only">Siguiente</span> | ||
56 | </a> | ||
57 | </li> | ||
58 | </ul> | ||
59 | </nav> | ||
60 | <button class="btn btn-sm btn-secondary" type="button" (click)="close()">Cerrar</button> | ||
61 | </div> | ||
62 |
src/app/busqueda-comprobante/busqueda-comprobante.component.scss
src/app/busqueda-comprobante/busqueda-comprobante.component.ts
File was created | 1 | import { Component, OnInit} from '@angular/core'; | |
2 | import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; | ||
3 | import { BusquedaComprobantesService } from './busqueda-comprobantes.service'; | ||
4 | |||
5 | @Component({ | ||
6 | templateUrl: './busqueda-comprobante.component.html', | ||
7 | styleUrls: ['./busqueda-comprobante.component.scss'], | ||
8 | providers: [BusquedaComprobantesService] | ||
9 | }) | ||
10 | export class BusquedaComprobanteComponent implements OnInit { | ||
11 | |||
12 | comprobantes: Array<Object> = []; | ||
13 | paginaActiva = 1; | ||
14 | paginas = []; | ||
15 | cantidadPorPagina = 10; | ||
16 | |||
17 | constructor(public activeModal: NgbActiveModal, public comprobanteService: BusquedaComprobantesService) { } | ||
18 | |||
19 | ngOnInit() { | ||
20 | this.comprobanteService.getComprobantes().subscribe((data: Array<Object>) => { | ||
21 | this.comprobantes = data; | ||
22 | this.comprobantes.push(this.comprobantes[0]); | ||
23 | this.comprobantes.push(this.comprobantes[1]); | ||
24 | this.comprobantes.push(this.comprobantes[0]); | ||
25 | this.comprobantes.push(this.comprobantes[1]); | ||
26 | this.comprobantes.push(this.comprobantes[0]); | ||
27 | this.comprobantes.push(this.comprobantes[1]); | ||
28 | this.comprobantes.push(this.comprobantes[0]); | ||
29 | this.comprobantes.push(this.comprobantes[1]); | ||
30 | this.comprobantes.push(this.comprobantes[0]); | ||
31 | this.comprobantes.push(this.comprobantes[1]); | ||
32 | this.comprobantes.push(this.comprobantes[0]); | ||
33 | this.comprobantes.push(this.comprobantes[1]); | ||
34 | this.comprobantes.push(this.comprobantes[0]); | ||
35 | this.comprobantes.push(this.comprobantes[1]); | ||
36 | this.comprobantes.push(this.comprobantes[0]); | ||
37 | this.comprobantes.push(this.comprobantes[1]); | ||
38 | this.paginar(); | ||
39 | }); | ||
40 | } | ||
41 | |||
42 | getPaginaFiltro() { | ||
43 | return this.comprobantes.slice((this.paginaActiva - 1) * this.cantidadPorPagina, | ||
44 | this.paginaActiva * this.cantidadPorPagina); | ||
45 | } | ||
46 | |||
47 | paginar() { | ||
48 | |||
49 | var cantPaginas = Math.ceil(this.comprobantes.length / this.cantidadPorPagina); | ||
50 | this.paginas = []; | ||
51 | for (let i = 0; i < cantPaginas; i++) { | ||
52 | this.paginas.push(i + 1); | ||
53 | } | ||
54 | } | ||
55 | |||
56 | rellenar(relleno: number, numero: number) { | ||
57 | |||
58 | if (numero.toString().length >= relleno) { | ||
59 | return numero; | ||
60 | } | ||
61 | |||
62 | let rellenar = ''; | ||
63 | |||
64 | for (let i = 0; i < relleno - numero.toString().length; i++) { | ||
65 | rellenar += '0' | ||
66 | } | ||
67 | |||
68 | return rellenar + numero.toString(); | ||
69 | } | ||
70 | |||
71 | close() { | ||
72 | this.activeModal.dismiss(); | ||
73 | } | ||
74 | |||
75 | selectItem(comprobante: object) { | ||
76 | this.activeModal.close(comprobante); | ||
77 | } | ||
78 | } | ||
79 |
src/app/busqueda-comprobante/busqueda-comprobantes.service.ts
File was created | 1 | import { Injectable } from '@angular/core'; | |
2 | import { HttpClient } from '@angular/common/http'; | ||
3 | import { AppSetings } from '../../etc/AppSetings'; | ||
4 | |||
5 | @Injectable() | ||
6 | export class BusquedaComprobantesService { | ||
7 | |||
8 | constructor(private http: HttpClient) { } | ||
9 | |||
10 | getComprobantes() { | ||
11 | return this.http.get(AppSetings.END_POINT + '/comprobantes/' + localStorage.getItem('gln')); | ||
12 | }; | ||
13 | } | ||
14 |
src/app/comprobantes/comprobantes.component.html
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 class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope"> | 4 | <div class="col-12 col-sm numero-pedido text-center text-md-left border border-white align-middle ng-binding ng-scope"> |
5 | Recepción | 5 | Recepción |
6 | <button | 6 | <button |
7 | class="btn btn-xs btn-outline-light float-right" | 7 | class="btn btn-xs btn-outline-light float-right" |
8 | type="button" | 8 | type="button" |
9 | ng-click="$ctrl.busqueda()" | 9 | (click)="busquedaComprobantes()" |
10 | ng-if="$ctrl.busqueda" | ||
11 | title="Buscar" | 10 | title="Buscar" |
12 | > | 11 | > |
13 | <i class="fa fa-search"></i> | 12 | <i class="fa fa-search"></i> |
14 | </button> | 13 | </button> |
15 | </div> | 14 | </div> |
16 | <div class="col-7 col-sm border border-white align-middle"> | 15 | <div class="col-7 col-sm border border-white align-middle"> |
17 | Fecha: | 16 | Fecha: |
18 | <span | 17 | <span |
19 | ng-click="datepickerAbierto = true" | 18 | ng-click="datepickerAbierto = true" |
20 | > {{ fecha | date: 'dd/MM/yyyy' }}</span> | 19 | > {{ fecha | date: 'dd/MM/yyyy' }}</span> |
21 | </div> | 20 | </div> |
22 | <div class="col-5 col-sm border border-white border-right-0 align-middle"> | 21 | <div class="col-5 col-sm border border-white border-right-0 align-middle"> |
23 | Hora: | 22 | Hora: |
24 | <span | 23 | <span |
25 | ng-click="datepickerAbierto = true" | 24 | ng-click="datepickerAbierto = true" |
26 | > {{ fecha | date: 'shortTime'}}</span> | 25 | > {{ fecha | date: 'shortTime'}}</span> |
27 | </div> | 26 | </div> |
28 | </div> | 27 | </div> |
29 | </div> | 28 | </div> |
30 | </div> | 29 | </div> |
31 | <div class="row"> | 30 | <div class="row"> |
32 | <form class="col-12 col-sm-10"> | 31 | <form class="col-12 col-sm-10"> |
33 | <div class="row border"> | 32 | <div class="row border"> |
34 | <div class="col-6 col-sm-3 d-flex"> | 33 | <div class="col-6 col-sm-3 d-flex"> |
35 | <strong>Letra Factura: </strong> | 34 | <strong>Letra Factura: </strong> |
36 | <label>{{cabecera.TIP}}</label> | 35 | <label>{{cabecera.TIP}}</label> |
37 | </div> | 36 | </div> |
38 | <div class="col-6 col-sm-3 d-flex"> | 37 | <div class="col-6 col-sm-3 d-flex"> |
39 | <strong>Tipo Factura: </strong> | 38 | <strong>Tipo Factura: </strong> |
40 | <label>{{cabecera.TCO}}</label> | 39 | <label>{{cabecera.TCO}}</label> |
41 | </div> | 40 | </div> |
42 | <div class="col-6 col-sm-3 d-flex"> | 41 | <div class="col-6 col-sm-3 d-flex"> |
43 | <strong>Sucursal: </strong> | 42 | <strong>Sucursal: </strong> |
44 | <label>{{cabecera.SUC}}</label> | 43 | <label>{{cabecera.SUC}}</label> |
45 | </div> | 44 | </div> |
46 | <div class="col-6 col-sm-3 d-flex"> | 45 | <div class="col-6 col-sm-3 d-flex"> |
47 | <strong>Número: </strong> | 46 | <strong>Número: </strong> |
48 | <label>{{cabecera.NCO}}</label> | 47 | <label>{{cabecera.NCO}}</label> |
49 | </div> | 48 | </div> |
50 | <div class="col-6 col-sm-3 d-flex"> | 49 | <div class="col-6 col-sm-3 d-flex"> |
51 | <strong>Cuit: </strong> | 50 | <strong>Cuit: </strong> |
52 | <label>{{cabecera.CUI}}</label> | 51 | <label>{{cabecera.CUI}}</label> |
53 | </div> | 52 | </div> |
54 | <div class="col-12 col-sm-3 d-flex"> | 53 | <div class="col-12 col-sm-6 d-flex"> |
55 | <strong>Nombre: </strong> | 54 | <strong>Nombre: </strong> |
56 | <label>{{cabecera.NOM}}</label> | 55 | <label>{{cabecera.NOM}}</label> |
57 | </div> | 56 | </div> |
58 | </div> | 57 | </div> |
59 | <div class="row border"> | 58 | <div class="row border pr-2"> |
60 | <div class="col-4"> | 59 | <div class="col-4"> |
61 | <button | 60 | <button |
62 | type="button" | 61 | type="button" |
63 | class="btn btn-outline-secondary btn-sm" | 62 | class="btn btn-outline-secondary btn-sm" |
64 | [ngClass]="{'active': estadoArticulos == 'pendiente'}" | 63 | [ngClass]="{'active': estadoArticulos == 'pendiente'}" |
65 | (click)="estadoArticulos = 'pendiente'; paginaActiva = 1; filter = '';"> | 64 | (click)="estadoArticulos = 'pendiente'; paginaActiva = 1; filter = '';"> |
66 | Pendientes ({{getCantidadArticulosByEstado('pendiente')}}) | 65 | Pendientes ({{getCantidadArticulosByEstado('pendiente')}}) |
67 | </button> | 66 | </button> |
68 | </div> | 67 | </div> |
69 | <div class="col-4"> | 68 | <div class="col-4"> |
70 | <button | 69 | <button |
71 | type="button" | 70 | type="button" |
72 | class="btn btn-outline-success btn-sm" | 71 | class="btn btn-outline-success btn-sm" |
73 | [ngClass]="{'active': estadoArticulos == 'aprobado'}" | 72 | [ngClass]="{'active': estadoArticulos == 'aprobado'}" |
74 | (click)="estadoArticulos = 'aprobado'; paginaActiva = 1; filter = '';"> | 73 | (click)="estadoArticulos = 'aprobado'; paginaActiva = 1; filter = '';"> |
75 | Aprobados ({{getCantidadArticulosByEstado('aprobado')}}) | 74 | Aprobados ({{getCantidadArticulosByEstado('aprobado')}}) |
76 | </button> | 75 | </button> |
77 | </div> | 76 | </div> |
78 | <div class="col-4"> | 77 | <div class="col-4"> |
79 | <button | 78 | <button |
80 | type="button" | 79 | type="button" |
81 | class="btn btn-outline-danger btn-sm" | 80 | class="btn btn-outline-danger btn-sm" |
82 | [ngClass]="{'active': estadoArticulos == 'rechazado'}" | 81 | [ngClass]="{'active': estadoArticulos == 'rechazado'}" |
83 | (click)="estadoArticulos = 'rechazado'; paginaActiva = 1; filter = '';"> | 82 | (click)="estadoArticulos = 'rechazado'; paginaActiva = 1; filter = '';"> |
84 | Rechazados ({{getCantidadArticulosByEstado('rechazado')}}) | 83 | Rechazados ({{getCantidadArticulosByEstado('rechazado')}}) |
85 | </button> | 84 | </button> |
86 | </div> | 85 | </div> |
87 | </div> | 86 | </div> |
88 | <div class="row"> | 87 | <div class="row"> |
89 | <input | 88 | <input |
90 | type="text" | 89 | type="text" |
91 | class="form-control-sm col-12" | 90 | class="form-control-sm col-12" |
92 | placeholder="Busque producto por nombre, codigo" | 91 | placeholder="Busque producto por nombre, codigo" |
93 | [(ngModel)]="filter" | 92 | [(ngModel)]="filter" |
94 | [ngModelOptions]="{standalone: true}"/> | 93 | [ngModelOptions]="{standalone: true}"/> |
95 | </div> | 94 | </div> |
96 | <div class="row"> | 95 | <div class="row"> |
97 | <table class="table table-dark"> | 96 | <table class="table table-dark"> |
98 | <thead> | 97 | <thead> |
99 | <tr> | 98 | <tr> |
100 | <th *ngIf="estadoArticulos != 'rechazado'">Rechazar</th> | 99 | <th *ngIf="estadoArticulos != 'rechazado'">Rechazar</th> |
101 | <th>Producto</th> | 100 | <th>Producto</th> |
102 | <th>Cantidad</th> | 101 | <th>Cantidad</th> |
103 | <th *ngIf="estadoArticulos != 'aprobado'">Aceptar</th> | 102 | <th *ngIf="estadoArticulos != 'aprobado'">Aceptar</th> |
104 | </tr> | 103 | </tr> |
105 | </thead> | 104 | </thead> |
106 | <tbody> | 105 | <tbody> |
107 | <tr *ngFor="let articulo of getPaginaFiltro()" [ngClass]="{'bg-success': articulo.estado == 'aprobado'}"> | 106 | <tr *ngFor="let articulo of getPaginaFiltro()" [ngClass]="{'bg-success': articulo.estado == 'aprobado'}"> |
108 | <th *ngIf="estadoArticulos != 'rechazado'"><button type="button" class="" (click)="articulo.estado = 'rechazado'"> | 107 | <th *ngIf="estadoArticulos != 'rechazado'"><button type="button" class="" (click)="articulo.estado = 'rechazado'"> |
109 | <i class="fa fa-window-close"></i> | 108 | <i class="fa fa-window-close"></i> |
110 | </button></th> | 109 | </button></th> |
111 | <th>{{articulo.LI0}}</th> | 110 | <th>{{articulo.TIO}}</th> |
112 | <th *ngIf="!articulo.input" (click)="articulo.input = true"> | 111 | <th *ngIf="!articulo.input" (click)="articulo.input = true"> |
113 | {{articulo.recibido ? articulo.recibido + '/' : ''}}{{articulo.CAN}}</th> | 112 | {{articulo.recibido ? articulo.recibido + '/' : ''}}{{articulo.CAN}}</th> |
114 | <th *ngIf="articulo.input"> | 113 | <th *ngIf="articulo.input"> |
115 | <input | 114 | <input |
116 | class="form-control-sm col-12" | 115 | class="form-control-sm col-12" |
117 | type="number" | 116 | type="number" |
118 | (keyup.enter)="articulo.input = false" | 117 | (keyup.enter)="articulo.input = false" |
119 | [(ngModel)]="articulo.recibido" | 118 | [(ngModel)]="articulo.recibido" |
120 | [ngModelOptions]="{standalone: true}" | 119 | [ngModelOptions]="{standalone: true}" |
121 | autofocus/> | 120 | autofocus/> |
122 | /{{articulo.CAN}} | 121 | /{{articulo.CAN}} |
123 | </th> | 122 | </th> |
124 | <th *ngIf="estadoArticulos != 'aprobado'"> | 123 | <th *ngIf="estadoArticulos != 'aprobado'"> |
125 | <button type="button" class="" (click)="articulo.estado = 'aprobado'"> | 124 | <button type="button" class="" (click)="articulo.estado = 'aprobado'"> |
126 | <i class="fa fa-check"></i> | 125 | <i class="fa fa-check"></i> |
127 | </button> | 126 | </button> |
128 | </th> | 127 | </th> |
129 | </tr> | 128 | </tr> |
130 | <tr> | 129 | <tr> |
131 | <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th> | 130 | <th colspan="3" *ngIf="articulosFiltro.length == 0">Por el momento no hay elementos aquí</th> |
132 | </tr> | 131 | </tr> |
133 | </tbody> | 132 | </tbody> |
134 | <tfoot> | 133 | <tfoot> |
135 | <nav *ngIf="articulosFiltro.length > 0" class="mr-auto position-absolute mb-5"> | 134 | <nav *ngIf="articulosFiltro.length > 0" class="mr-auto position-absolute mb-5"> |
136 | <ul class="pagination pagination-sm justify-content mb-0"> | 135 | <ul class="pagination pagination-sm justify-content mb-0"> |
137 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == 1}"> | 136 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == 1}"> |
138 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva - 1"> | 137 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva - 1"> |
139 | <span aria-hidden="true">«</span> | 138 | <span aria-hidden="true">«</span> |
140 | <span class="sr-only">Anterior</span> | 139 | <span class="sr-only">Anterior</span> |
141 | </a> | 140 | </a> |
142 | </li> | 141 | </li> |
143 | <li | 142 | <li |
144 | class="page-item" | 143 | class="page-item" |
145 | *ngFor="let pagina of paginas; index as i" | 144 | *ngFor="let pagina of paginas; index as i" |
146 | [ngClass]="{'active': pagina == paginaActiva}" | 145 | [ngClass]="{'active': pagina == paginaActiva}" |
147 | > | 146 | > |
148 | <a | 147 | <a |
149 | class="page-link" | 148 | class="page-link" |
150 | href="javascript:void();" | 149 | href="javascript:void();" |
151 | (click)="paginaActiva = pagina" | 150 | (click)="paginaActiva = pagina" |
152 | >{{pagina}}</a> | 151 | >{{pagina}}</a> |
153 | </li> | 152 | </li> |
154 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == paginas.length}"> | 153 | <li class="page-item" [ngClass]="{'disabled': paginaActiva == paginas.length}"> |
155 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva + 1"> | 154 | <a class="page-link" href="javascript:void();" (click)="paginaActiva = paginaActiva + 1"> |
156 | <span aria-hidden="true">»</span> | 155 | <span aria-hidden="true">»</span> |
157 | <span class="sr-only">Siguiente</span> | 156 | <span class="sr-only">Siguiente</span> |
158 | </a> | 157 | </a> |
159 | </li> | 158 | </li> |
160 | </ul> | 159 | </ul> |
161 | </nav> | 160 | </nav> |
162 | </tfoot> | 161 | </tfoot> |
163 | </table> | 162 | </table> |
164 | </div> | 163 | </div> |
165 | </form> | 164 | </form> |
166 | <app-acciones (guardar)="guardarComprobante()"></app-acciones> | 165 | <app-acciones (guardar)="guardarComprobante()" [(saveLoading)]="saveLoading"></app-acciones> |
167 | </div> | 166 | </div> |
168 | 167 |
src/app/comprobantes/comprobantes.component.ts
1 | import { Component, OnInit} from '@angular/core'; | 1 | import { Component, OnInit} from '@angular/core'; |
2 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap'; | ||
3 | import { BusquedaComprobanteComponent } from '../busqueda-comprobante/busqueda-comprobante.component'; | ||
4 | import { ComprobanteService } from './comprobantes.service'; | ||
2 | 5 | ||
3 | @Component({ | 6 | @Component({ |
4 | templateUrl: './comprobantes.component.html', | 7 | templateUrl: './comprobantes.component.html', |
5 | styleUrls: ['./comprobantes.component.scss'] | 8 | styleUrls: ['./comprobantes.component.scss'], |
9 | providers:[ ComprobanteService ] | ||
6 | }) | 10 | }) |
7 | export class ComprobantesComponent implements OnInit { | 11 | export class ComprobantesComponent implements OnInit { |
8 | 12 | ||
9 | constructor() { } | 13 | constructor(private modalService: NgbModal, public comprobanteService: ComprobanteService) { } |
10 | 14 | ||
11 | ngOnInit() { | 15 | ngOnInit() { } |
12 | |||
13 | this.obtenerConsulta(); | ||
14 | } | ||
15 | 16 | ||
16 | filter = ''; | 17 | filter = ''; |
17 | estadoArticulos = 'pendiente'; | 18 | estadoArticulos = 'pendiente'; |
18 | comprobantes = [1, 2, 3]; | 19 | comprobantes = [1, 2, 3]; |
19 | cabecera = {}; | 20 | cabecera = {}; |
20 | cuerpo = []; | 21 | cuerpo = []; |
21 | articulosFiltro = []; | 22 | articulosFiltro = []; |
22 | paginaActiva = 1; | 23 | paginaActiva = 1; |
23 | paginas = []; | 24 | paginas = []; |
24 | 25 | saveLoading = false; | |
26 | |||
25 | fecha = new Date(); | 27 | fecha = new Date(); |
26 | 28 | ||
27 | paginar() { | 29 | paginar() { |
28 | 30 | ||
29 | var cantPaginas = Math.ceil(this.articulosFiltro.length / 5); | 31 | var cantPaginas = Math.ceil(this.articulosFiltro.length / 5); |
30 | this.paginas = []; | 32 | this.paginas = []; |
31 | for (let i = 0; i < cantPaginas; i++) { | 33 | for (let i = 0; i < cantPaginas; i++) { |
32 | this.paginas.push(i + 1); | 34 | this.paginas.push(i + 1); |
33 | } | 35 | } |
34 | } | 36 | } |
35 | 37 | ||
36 | getPaginaFiltro() { | 38 | getPaginaFiltro() { |
37 | 39 | ||
38 | this.articulosFiltro = this.cuerpo.filter((articulo) => { | 40 | this.articulosFiltro = this.cuerpo.filter((articulo) => { |
39 | return articulo.estado == this.estadoArticulos && | 41 | return articulo.estado == this.estadoArticulos && |
40 | (articulo.LI0.toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()) || | 42 | (articulo.TIO.toLocaleUpperCase().includes(this.filter.toLocaleUpperCase()) || |
41 | articulo.codigoBarras == this.filter); | 43 | articulo.codigoBarras == this.filter); |
42 | }); | 44 | }); |
43 | 45 | ||
44 | this.paginar(); | 46 | this.paginar(); |
45 | 47 | ||
46 | return this.articulosFiltro.slice((this.paginaActiva - 1) * 5 , this.paginaActiva * 5); | 48 | return this.articulosFiltro.slice((this.paginaActiva - 1) * 5 , this.paginaActiva * 5); |
47 | } | 49 | } |
48 | 50 | ||
49 | getCantidadArticulosByEstado(estado: String) { | 51 | getCantidadArticulosByEstado(estado: String) { |
50 | return this.cuerpo.filter((articulo) => { | 52 | return this.cuerpo.filter((articulo) => { |
51 | return articulo.estado == estado; | 53 | return articulo.estado == estado; |
52 | }).length; | 54 | }).length; |
53 | } | 55 | } |
54 | 56 | ||
55 | guardarComprobante(event: any) { | 57 | guardarComprobante(event: any) { |
56 | alert('Guardando'); | 58 | |
59 | if (this.getCantidadArticulosByEstado('pendiente')) { | ||
60 | alert('No deben quedar articulos pendientes'); | ||
61 | } | ||
62 | |||
63 | this.comprobanteService | ||
64 | .saveComprobantes({cabecera: this.cabecera, cuerpo: this.cuerpo}) | ||
65 | .subscribe(data => { | ||
66 | console.log(data); | ||
67 | }); | ||
57 | } | 68 | } |
58 | 69 | ||
59 | obtenerConsulta() { | 70 | busquedaComprobantes() { |
60 | 71 | this.modalService.open(BusquedaComprobanteComponent).result.then(comprobante => { | |
61 | setTimeout(() => { | 72 | |
62 | this.cabecera = { | 73 | this.cabecera = comprobante.cabecera; |
63 | TIP: 'A', | 74 | this.cuerpo = comprobante.cuerpo; |
64 | TCO: 'FT', | 75 | |
65 | SUC: 623, | 76 | this.cuerpo.forEach(articulo => { |
66 | NCO: 53979, | 77 | articulo['estado'] = 'pendiente'; |
67 | COD: 1, | 78 | }); |
68 | FEC: new Date(), | 79 | |
69 | NOM: 'POTIGIAN GOLOCINAS', | 80 | this.getPaginaFiltro(); |
70 | CUI: '30-54775125-2' | 81 | }, (reason) => { }); |
71 | }; | ||
72 | |||
73 | this.cuerpo = [ | ||
74 | { | ||
75 | LI0: 'Mantel Combo Bolso CocaCola', | ||
76 | CAN: 5, | ||
77 | estado: 'pendiente', | ||
78 | codigoBarras: '7790667006462' | ||
79 | }, | ||
80 | { | ||
81 | LI0: 'Papas', | ||
82 | CAN: 5, | ||
83 | estado: 'pendiente', | ||
84 | }, | ||
85 | { | ||
86 | LI0: 'Peras', | ||
87 | CAN: 5, | ||
88 | estado: 'pendiente', | ||
89 | }, | ||
90 | { | ||
91 | LI0: 'Cafe', | ||
92 | CAN: 5, | ||
93 | estado: 'pendiente', | ||
94 | }, | ||
95 | { | ||
96 | LI0: 'Cafe capuchino', | ||
97 | CAN: 5, | ||
98 | estado: 'pendiente', | ||
99 | }, | ||
100 | { | ||
101 | LI0: 'Menta', | ||
102 | CAN: 5, | ||
103 | estado: 'pendiente', | ||
104 | }, | ||
105 | { | ||
106 | LI0: 'Fernet', | ||
107 | CAN: 5, | ||
108 | estado: 'pendiente', | ||
109 | }, | ||
110 | { |
src/app/comprobantes/comprobantes.service.ts
File was created | 1 | import { Injectable } from '@angular/core'; | |
2 | import { HttpClient } from '@angular/common/http'; | ||
3 | import { AppSetings } from '../../etc/AppSetings'; | ||
4 | |||
5 | @Injectable() | ||
6 | export class ComprobanteService { | ||
7 | |||
8 | constructor(private http: HttpClient) {} | ||
9 | |||
10 | saveComprobantes(comprobante: object) { | ||
11 | return this.http.post(AppSetings.END_POINT + '/comprobante', comprobante); | ||
12 | } | ||
13 | } | ||
14 |
src/app/login/login.component.html
File was created | 1 | <div class="d-flex justify-content-center align-items-center"> | |
2 | <div class="login"> | ||
3 | <form name="login"> | ||
4 | <div class="login-titulo"> | ||
5 | <span>Ingreso de usuario</span> | ||
6 | </div> | ||
7 | <div class="login-campo"> | ||
8 | <label>Usuario</label> | ||
9 | <input | ||
10 | type="text" | ||
11 | [(ngModel)]="usuario.idUsuario" | ||
12 | [ngModelOptions]="{standalone: true}" | ||
13 | ng-keyup="$event.keyCode == 13 && irPaso(2)" | ||
14 | [ladda]="loginLoading" | ||
15 | /> | ||
16 | </div> | ||
17 | <div class="login-campo"> | ||
18 | <label>Contraseña</label> | ||
19 | <input | ||
20 | type="password" | ||
21 | [(ngModel)]="usuario.clave" | ||
22 | [ngModelOptions]="{standalone: true}" | ||
23 | foca-focus="paso == 2" | ||
24 | ng-keyup="$event.keyCode == 13 && enviar()" | ||
25 | [ladda]="loginLoading" | ||
26 | /> | ||
27 | </div> | ||
28 | <div class="d-flex"> | ||
29 | <button | ||
30 | type="button" | ||
31 | class="btn btn-outline-dark mt-3 mr-auto" | ||
32 | (click)="configuracionEstacion = !configuracionEstacion" | ||
33 | [ngClass]="{'active': configuracionEstacion}" | ||
34 | [disabled]="loginLoading" | ||
35 | >Configuración</button> | ||
36 | <button | ||
37 | type="button" | ||
38 | class="btn btn-dark mt-3 ml-auto" | ||
39 | (click)="ingresar()" | ||
40 | [ladda]="loginLoading" | ||
41 | >Ingresar</button> | ||
42 | </div> | ||
43 | <div *ngIf="configuracionEstacion" class="mt-3"> | ||
44 | <strong>Configuración estación</strong> | ||
45 | <br/> | ||
46 | <div> | ||
47 | <label class="justify-content-left">Código estación:</label> | ||
48 | <input | ||
49 | class="form-control" | ||
50 | placeholder="Código estación" | ||
51 | [(ngModel)]="usuario.codigoEntidad" | ||
52 | [ngModelOptions]="{standalone: true}"> | ||
53 | </div> | ||
54 | <div> | ||
55 | <label class="justify-content-left">GLN:</label> | ||
56 | <input | ||
57 | class="form-control" | ||
58 | placeholder="GLN ESTACIÓN" | ||
59 | [(ngModel)]="usuario.gln" | ||
60 | [ngModelOptions]="{standalone: true}"/> | ||
61 | </div> | ||
62 | </div> | ||
63 | </form> | ||
64 | </div> | ||
65 | </div> | ||
66 |
src/app/login/login.component.scss
File was created | 1 | .login { | |
2 | background-color: #bdbdbd; | ||
3 | border: 1px solid #000000; | ||
4 | border-radius: 3px; | ||
5 | height: calc(193px + 1em); | ||
6 | left: calc(50% - 130px); | ||
7 | opacity: 0.7; | ||
8 | text-align: center; | ||
9 | top: 190px; | ||
10 | width: 260px; | ||
11 | margin-top: 3.5rem; | ||
12 | &-titulo { | ||
13 | border-bottom: 1px solid #ffffff; | ||
14 | padding: 5px 0; | ||
15 | } | ||
16 | &-campo { | ||
17 | label { | ||
18 | display: block; | ||
19 | font-size: 12px; | ||
20 | margin: 5px 0 0; | ||
21 | } | ||
22 | input { | ||
23 | -moz-border-radius: 10px; | ||
24 | -khtml-border-radius: 10px; | ||
25 | -webkit-border-radius: 10px; | ||
26 | -webkit-appearance: none; | ||
27 | padding-right: 5%; | ||
28 | padding-left: 5%; | ||
29 | border-radius: 10px; | ||
30 | outline: 0; | ||
31 | border-color: transparent; | ||
32 | &:focus { | ||
33 | border-color: #ff9900; | ||
34 | } | ||
35 | } | ||
36 | } | ||
37 | |||
38 | &-button { | ||
39 | // width: 80%; | ||
40 | background-color: #cd9035; | ||
41 | color: white; | ||
42 | &:hover{ | ||
43 | background-color: #a7743d; | ||
44 | color: white | ||
45 | } | ||
46 | &:focus{ | ||
47 | color: white; | ||
48 | } | ||
49 | } | ||
50 | |||
51 | &-alerta-error { | ||
52 | width: 260px; | ||
53 | left: calc(50% - 130px); | ||
54 | top: calc(383px + 1.5em); | ||
55 | } | ||
56 | } | ||
57 |
src/app/login/login.component.ts
File was created | 1 | import { Component, OnInit } from '@angular/core'; | |
2 | import { LoginService } from './login.service'; | ||
3 | import { Router } from '@angular/router'; | ||
4 | |||
5 | @Component({ | ||
6 | templateUrl: './login.component.html', | ||
7 | styleUrls: ['./login.component.scss'], | ||
8 | providers: [LoginService] | ||
9 | }) | ||
10 | export class LoginComponent implements OnInit { | ||
11 | |||
12 | loginLoading: boolean = false; | ||
13 | usuario: object = {}; | ||
14 | |||
15 | constructor(private loginService: LoginService, private router: Router) { } | ||
16 | |||
17 | ngOnInit() { | ||
18 | |||
19 | let glnPrevius = localStorage.getItem('gln') | ||
20 | if (glnPrevius) { | ||
21 | this.usuario['gln'] = glnPrevius; | ||
22 | } | ||
23 | } | ||
24 | |||
25 | ingresar() { | ||
26 | |||
27 | this.loginLoading = true; | ||
28 | this.loginService.getLogin(this.usuario).subscribe(login => { | ||
29 | if(login['data'] == 'ok') { | ||
30 | localStorage.setItem('gln', this.usuario['gln']) | ||
31 | this.router.navigateByUrl('/home'); | ||
32 | } else { | ||
33 | alert('No se encontró la estación'); | ||
34 | this.loginLoading = false; | ||
35 | } | ||
36 | }); | ||
37 | } | ||
38 | } | ||
39 |
src/app/login/login.service.ts
File was created | 1 | import { Injectable } from '@angular/core'; | |
2 | import { HttpClient } from '@angular/common/http'; | ||
3 | import { AppSetings } from '../../etc/AppSetings'; | ||
4 | |||
5 | @Injectable() | ||
6 | export class LoginService { | ||
7 | |||
8 | constructor(private http: HttpClient) { } | ||
9 | |||
10 | getLogin(json: object) { | ||
11 | return this.http.post(AppSetings.END_POINT + '/login', json); | ||
12 | }; | ||
13 | } | ||
14 |
src/etc/AppSetings.ts
File was created | 1 | export class AppSetings { | |
2 | public static END_POINT='http://localhost:6060/gateway-debo'; | ||
3 | } | ||
4 |