Commit ac4a8e73ac5551ce75e3a3fa4adf0db54c06a063
1 parent
924d1d4f5d
Exists in
develop
Fix
Referencia
Showing
2 changed files
with
5 additions
and
1 deletions
Show diff stats
src/app/shared/sinonimo/sinonimo.component.html
1 | <div class="bg-primary rounded text-white"> | 1 | <div class="bg-primary rounded text-white"> |
2 | <div class="modal-header"> | 2 | <div class="modal-header"> |
3 | <img | 3 | <img |
4 | draggable="false" | 4 | draggable="false" |
5 | ondragstart="return false;" | 5 | ondragstart="return false;" |
6 | (contextmenu)="false" | 6 | (contextmenu)="false" |
7 | (click)="modalRef.hide()" | 7 | (click)="close()" |
8 | class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index" | 8 | class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index" |
9 | src="assets/img/icono-cancelar-blanco.svg"> | 9 | src="assets/img/icono-cancelar-blanco.svg"> |
10 | <p class="col-7 h4 px-0 align-self-center">{{articulo.DetArt}}</p> | 10 | <p class="col-7 h4 px-0 align-self-center">{{articulo.DetArt}}</p> |
11 | <div class="col-5 pt-4 pr-0 text-right"> | 11 | <div class="col-5 pt-4 pr-0 text-right"> |
12 | <p *ngFor="let s of sinonimos; let i = index"> | 12 | <p *ngFor="let s of sinonimos; let i = index"> |
13 | <span | 13 | <span |
14 | class="btn-effect" | 14 | class="btn-effect" |
15 | (click)="scrollTo(i)"> | 15 | (click)="scrollTo(i)"> |
16 | Ir a opción {{i+1}} | 16 | Ir a opción {{i+1}} |
17 | <i class="far fa-hand-point-left"></i> | 17 | <i class="far fa-hand-point-left"></i> |
18 | </span> | 18 | </span> |
19 | </p> | 19 | </p> |
20 | </div> | 20 | </div> |
21 | </div> | 21 | </div> |
22 | 22 | ||
23 | <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2"> | 23 | <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2"> |
24 | <div *ngFor="let s of sinonimos; let i = index"> | 24 | <div *ngFor="let s of sinonimos; let i = index"> |
25 | <div [id]="i"></div> | 25 | <div [id]="i"></div> |
26 | <hr [hidden]="i === 0" class="bg-white"> | 26 | <hr [hidden]="i === 0" class="bg-white"> |
27 | <div *ngFor="let articulo of s.productos"> | 27 | <div *ngFor="let articulo of s.productos"> |
28 | <div class="custom-control custom-checkbox"> | 28 | <div class="custom-control custom-checkbox"> |
29 | <input | 29 | <input |
30 | type="checkbox" | 30 | type="checkbox" |
31 | class="custom-control-input" | 31 | class="custom-control-input" |
32 | [(ngModel)]="articulo.seleccionado" | 32 | [(ngModel)]="articulo.seleccionado" |
33 | (click)="selectSinonimo(i, articulo)" | 33 | (click)="selectSinonimo(i, articulo)" |
34 | [id]="articulo.id"> | 34 | [id]="articulo.id"> |
35 | <label | 35 | <label |
36 | class="custom-control-label" | 36 | class="custom-control-label" |
37 | [for]="articulo.id"> | 37 | [for]="articulo.id"> |
38 | {{articulo.DET_LAR.toUpperCase()}} | 38 | {{articulo.DET_LAR.toUpperCase()}} |
39 | </label> | 39 | </label> |
40 | </div> | 40 | </div> |
41 | </div> | 41 | </div> |
42 | </div> | 42 | </div> |
43 | </div> | 43 | </div> |
44 | 44 | ||
45 | <div class="modal-footer"> | 45 | <div class="modal-footer"> |
46 | <div | 46 | <div |
47 | [ngClass]="validate()" | 47 | [ngClass]="validate()" |
48 | class="d-inline-block py-1 bg-white badge-pill text-primary" | 48 | class="d-inline-block py-1 bg-white badge-pill text-primary" |
49 | (click)="continue()"> | 49 | (click)="continue()"> |
50 | CONTINUAR | 50 | CONTINUAR |
51 | <img | 51 | <img |
52 | draggable="false" | 52 | draggable="false" |
53 | ondragstart="return false;" | 53 | ondragstart="return false;" |
54 | (contextmenu)="false" | 54 | (contextmenu)="false" |
55 | class="icon-30" | 55 | class="icon-30" |
56 | src="assets/img/ir-color.svg"> | 56 | src="assets/img/ir-color.svg"> |
57 | </div> | 57 | </div> |
58 | </div> | 58 | </div> |
59 | </div> | 59 | </div> |
60 | 60 |
src/app/shared/sinonimo/sinonimo.component.ts
1 | import { Component, OnInit } from '@angular/core'; | 1 | import { Component, OnInit } from '@angular/core'; |
2 | import { ISinonimo } from 'src/app/interfaces/ISinonimo'; | 2 | import { ISinonimo } from 'src/app/interfaces/ISinonimo'; |
3 | import { IArticulo } from 'src/app/interfaces/IArticulo'; | 3 | import { IArticulo } from 'src/app/interfaces/IArticulo'; |
4 | import { BsModalRef } from 'ngx-bootstrap/modal'; | 4 | import { BsModalRef } from 'ngx-bootstrap/modal'; |
5 | import { Subject, forkJoin } from 'rxjs'; | 5 | import { Subject, forkJoin } from 'rxjs'; |
6 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; | 6 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; |
7 | import { element } from 'protractor'; | 7 | import { element } from 'protractor'; |
8 | 8 | ||
9 | @Component({ | 9 | @Component({ |
10 | selector: 'app-sinonimo', | 10 | selector: 'app-sinonimo', |
11 | templateUrl: './sinonimo.component.html', | 11 | templateUrl: './sinonimo.component.html', |
12 | styleUrls: ['./sinonimo.component.scss'] | 12 | styleUrls: ['./sinonimo.component.scss'] |
13 | }) | 13 | }) |
14 | export class SinonimoComponent implements OnInit { | 14 | export class SinonimoComponent implements OnInit { |
15 | sinonimos: ISinonimo[] = []; | 15 | sinonimos: ISinonimo[] = []; |
16 | isValid: boolean; | 16 | isValid: boolean; |
17 | onClose: Subject<any>; | 17 | onClose: Subject<any>; |
18 | articulosSelected: IArticulo[] = []; | 18 | articulosSelected: IArticulo[] = []; |
19 | articulo: IArticulo; | 19 | articulo: IArticulo; |
20 | 20 | ||
21 | constructor( | 21 | constructor( |
22 | private modalRef: BsModalRef, | 22 | private modalRef: BsModalRef, |
23 | private articuloService: ArticuloService, | 23 | private articuloService: ArticuloService, |
24 | ) { | 24 | ) { |
25 | this.onClose = new Subject(); | 25 | this.onClose = new Subject(); |
26 | this.articulosSelected.length = this.sinonimos.length; | 26 | this.articulosSelected.length = this.sinonimos.length; |
27 | } | 27 | } |
28 | 28 | ||
29 | ngOnInit() { } | 29 | ngOnInit() { } |
30 | 30 | ||
31 | selectSinonimo(index: number, articulo: IArticulo) { | 31 | selectSinonimo(index: number, articulo: IArticulo) { |
32 | for (const a of this.sinonimos[index].productos) { | 32 | for (const a of this.sinonimos[index].productos) { |
33 | a.seleccionado = false; | 33 | a.seleccionado = false; |
34 | } | 34 | } |
35 | articulo.seleccionado = true; | 35 | articulo.seleccionado = true; |
36 | this.articulosSelected[index] = articulo; | 36 | this.articulosSelected[index] = articulo; |
37 | } | 37 | } |
38 | 38 | ||
39 | validate() { | 39 | validate() { |
40 | this.isValid = true; | 40 | this.isValid = true; |
41 | for (const s of this.sinonimos) { | 41 | for (const s of this.sinonimos) { |
42 | for (const a of s.productos) { | 42 | for (const a of s.productos) { |
43 | this.isValid = (!a.seleccionado) ? false : true; | 43 | this.isValid = (!a.seleccionado) ? false : true; |
44 | if (this.isValid) break; | 44 | if (this.isValid) break; |
45 | } | 45 | } |
46 | if (!this.isValid) break; | 46 | if (!this.isValid) break; |
47 | } | 47 | } |
48 | return !this.isValid ? 'disabled' : 'btn-effect'; | 48 | return !this.isValid ? 'disabled' : 'btn-effect'; |
49 | } | 49 | } |
50 | 50 | ||
51 | continue() { | 51 | continue() { |
52 | if (!this.isValid) return; | 52 | if (!this.isValid) return; |
53 | const ID_SINS = []; | 53 | const ID_SINS = []; |
54 | const observables = []; | 54 | const observables = []; |
55 | 55 | ||
56 | for (const articulo of this.articulosSelected) { | 56 | for (const articulo of this.articulosSelected) { |
57 | ID_SINS.push(articulo.ID_SIN); | 57 | ID_SINS.push(articulo.ID_SIN); |
58 | } | 58 | } |
59 | 59 | ||
60 | for (const articulo of this.articulosSelected) { | 60 | for (const articulo of this.articulosSelected) { |
61 | observables.push(this.articuloService.getById(articulo.id)); | 61 | observables.push(this.articuloService.getById(articulo.id)); |
62 | } | 62 | } |
63 | 63 | ||
64 | forkJoin(observables) | 64 | forkJoin(observables) |
65 | .subscribe((res: IArticulo[]) => { | 65 | .subscribe((res: IArticulo[]) => { |
66 | for (const articulo of res) { | 66 | for (const articulo of res) { |
67 | for (const ID_SIN of ID_SINS) { | 67 | for (const ID_SIN of ID_SINS) { |
68 | articulo.ID_SIN = ID_SIN; | 68 | articulo.ID_SIN = ID_SIN; |
69 | } | 69 | } |
70 | } | 70 | } |
71 | this.modalRef.hide(); | 71 | this.modalRef.hide(); |
72 | this.onClose.next({ | 72 | this.onClose.next({ |
73 | articulos: res, | 73 | articulos: res, |
74 | }); | 74 | }); |
75 | }, err => console.error(err)); | 75 | }, err => console.error(err)); |
76 | } | 76 | } |
77 | 77 | ||
78 | scrollTo(index: number) { | 78 | scrollTo(index: number) { |
79 | const el = document.getElementById(index.toString()); | 79 | const el = document.getElementById(index.toString()); |
80 | el.scrollIntoView({ behavior: 'smooth' }); | 80 | el.scrollIntoView({ behavior: 'smooth' }); |
81 | } | 81 | } |
82 | 82 | ||
83 | close() { | ||
84 | this.modalRef.hide(); | ||
85 | } | ||
86 | |||
83 | } | 87 | } |
84 | 88 |