Commit 13d8a7169e662ac901c0f9b944877c24511d40ab

Authored by Eric Fernandez

Merge branch 'master' into 'master'

Master(efernandez)

See merge request !3
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">&laquo;</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">&raquo;</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 >&nbsp;{{ fecha | date: 'dd/MM/yyyy' }}</span> 19 >&nbsp;{{ 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 >&nbsp;{{ fecha | date: 'shortTime'}}</span> 25 >&nbsp;{{ 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:&nbsp;</strong> 34 <strong>Letra Factura:&nbsp;</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:&nbsp;</strong> 38 <strong>Tipo Factura:&nbsp;</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:&nbsp;</strong> 42 <strong>Sucursal:&nbsp;</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:&nbsp;</strong> 46 <strong>Número:&nbsp;</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:&nbsp;</strong> 50 <strong>Cuit:&nbsp;</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:&nbsp;</strong> 54 <strong>Nombre:&nbsp;</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&nbsp;({{getCantidadArticulosByEstado('pendiente')}}) 65 Pendientes&nbsp;({{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&nbsp;({{getCantidadArticulosByEstado('aprobado')}}) 74 Aprobados&nbsp;({{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&nbsp;({{getCantidadArticulosByEstado('rechazado')}}) 83 Rechazados&nbsp;({{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">&laquo;</span> 138 <span aria-hidden="true">&laquo;</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">&raquo;</span> 155 <span aria-hidden="true">&raquo;</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