Eric Fernandez / gestion-comprobantes

Download as
Browse Code »

Commit 3e5d641314feb6bc6facc2c824de0167a2c1e474

Authored by Eric Fernandez
1 parent fd60509b5d
Exists in master

paginación cbusqueda comprobantes

Showing 9 changed files with 328 additions and 0 deletions   Show diff stats
src/app/busqueda-comprobante/busqueda-comprobante.component.html
Diff comments   View file @ 3e5d641
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
Diff comments   View file @ 3e5d641
src/app/busqueda-comprobante/busqueda-comprobante.component.ts
Diff comments   View file @ 3e5d641
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
Diff comments   View file @ 3e5d641
File was created 1 import { Injectable } from '@angular/core';
2 import { HttpClient, HttpHeaders } 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
11 getComprobantes() {
12 return this.http.get(AppSetings.END_POINT + '/comprobantes/' + localStorage.getItem('gln'));
13 };
14 }
15
src/app/login/login.component.html
Diff comments   View file @ 3e5d641
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
Diff comments   View file @ 3e5d641
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
Diff comments   View file @ 3e5d641
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
Diff comments   View file @ 3e5d641
File was created 1 import { Injectable } from '@angular/core';
2 import { HttpClient, HttpHeaders } 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
Diff comments   View file @ 3e5d641
File was created 1 export class AppSetings {
2 public static END_POINT='http://localhost:6060/gateway-debo';
3 }
4