Marcelo Puebla / autoservicio-axion

Download as
Browse Code ยป

Commit 6065f9ca0308b6827d0bf71b2ac47177677b68e4

Authored by Marcelo Puebla
1 parent e738f95d6c
Exists in develop

Change 

seleccion de sinonimo
Showing 6 changed files with 92 additions and 23 deletions   Show diff stats
src/app/interfaces/ISinonimo.ts
Diff comments   View file @ 6065f9c
... ... @@ -6,5 +6,6 @@ export interface ISinonimo {
6 6 productos: IArticulo[];
7 7 productoPadre?: number;
8 8 cantidad?: number;
  9 + cantidadRestante?: number;
9 10 selected?: boolean;
10 11 }
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ 6065f9c
... ... @@ -117,8 +117,10 @@ export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDes
117 117 if (res.length) {
118 118 const sinonimos = [];
119 119 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
120   - Object.keys(gruposArticulos).forEach(key => {
  120 + Object.keys(gruposArticulos).forEach((key, i) => {
121 121 sinonimos.push({ productos: gruposArticulos[key] });
  122 + sinonimos[i].cantidad = articulo.productos[i].cantidad;
  123 + sinonimos[i].cantidadRestante = articulo.productos[i].cantidad;
122 124 });
123 125 res = sinonimos;
124 126 this.openModalSinonimos(res, articulo);
src/app/shared/sinonimo/sinonimo.component.html
Diff comments   View file @ 6065f9c
... ... @@ -7,8 +7,8 @@
7 7 (click)="close()"
8 8 class="btn-effect icon-30 mt-2 mr-2 position-absolute right-0 top-0 z-index"
9 9 src="assets/img/icono-cancelar-blanco.svg">
10   - <p class="col-7 h4 px-0 align-self-center">{{ articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase() }}</p>
11   - <div class="col-5 pt-4 pr-0 text-right">
  10 + <p class="col-12 h4 px-0 align-self-center">{{ articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase() }}</p>
  11 + <!-- <div class="col-5 pt-4 pr-0 text-right">
12 12 <p *ngFor="let s of sinonimos; let i = index">
13 13 <span
14 14 class="btn-effect"
... ... @@ -17,26 +17,42 @@
17 17 <i class="far fa-hand-point-left"></i>
18 18 </span>
19 19 </p>
20   - </div>
  20 + </div> -->
21 21 </div>
22 22  
23 23 <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2">
24   - <div *ngFor="let s of sinonimos; let i = index">
25   - <div [id]="i"></div>
26   - <hr [hidden]="i === 0" class="bg-white">
27   - <div *ngFor="let articulo of s.productos">
28   - <div class="custom-control custom-checkbox">
29   - <input
30   - type="checkbox"
31   - class="custom-control-input"
32   - [(ngModel)]="articulo.seleccionado"
33   - (click)="selectSinonimo(i, articulo)"
34   - [id]="articulo.id">
35   - <label
36   - class="custom-control-label"
37   - [for]="articulo.id">
38   - {{articulo.DET_LAR.toUpperCase()}}
39   - </label>
  24 + <div class="row mx-0 mb-2" *ngFor="let articulo of sinonimos[currentIndex].productos">
  25 + <div class="col-7 p-0 my-auto h6 text-right">
  26 + <p class="m-0 font-weight-normal">
  27 + {{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}
  28 + </p>
  29 + </div>
  30 + <div class="col-5 pr-0">
  31 + <div class="row mx-0 justify-content-between bg-white badge-pill">
  32 + <!-- BOTON MENOS -->
  33 + <div class="col-auto px-0 my-auto">
  34 + <img
  35 + draggable="false"
  36 + ondragstart="return false;"
  37 + (contextmenu)="false"
  38 + class="d-block ml-auto py-2 icon-15 btn-effect"
  39 + src="assets/img/menos.svg"
  40 + (click)="restarCantidadSinonimo(articulo, currentIndex)">
  41 + </div>
  42 + <!-- CANTIDAD -->
  43 + <div class="col px-0 my-auto text-primary text-center">
  44 + <p><small>{{articulo.cantidad}}</small></p>
  45 + </div>
  46 + <!-- BOTON MAS -->
  47 + <div class="col-auto px-0 my-auto">
  48 + <img
  49 + draggable="false"
  50 + ondragstart="return false;"
  51 + (contextmenu)="false"
  52 + class="d-block ml-auto py-2 icon-15 btn-effect"
  53 + src="assets/img/mas.svg"
  54 + (click)="sumarCantidadSinonimo(articulo, currentIndex)">
  55 + </div>
40 56 </div>
41 57 </div>
42 58 </div>
... ... @@ -44,8 +60,33 @@
44 60  
45 61 <div class="modal-footer">
46 62 <div
  63 + *ngIf="currentIndex != 0 && sinonimos.length > 1"
  64 + class="d-inline-block py-1 bg-white badge-pill text-primary btn-effect mr-auto"
  65 + (click)="currentIndex = currentIndex-1">
  66 + <img
  67 + draggable="false"
  68 + ondragstart="return false;"
  69 + (contextmenu)="false"
  70 + class="icon-30 flip"
  71 + src="assets/img/ir-color.svg">
  72 + VOLVER
  73 + </div>
  74 + <div
  75 + *ngIf="currentIndex == 0 && currentIndex != sinonimos.length-1"
  76 + class="d-inline-block py-1 bg-white badge-pill text-primary btn-effect ml-auto"
  77 + (click)="currentIndex = currentIndex+1">
  78 + SIGUIENTE
  79 + <img
  80 + draggable="false"
  81 + ondragstart="return false;"
  82 + (contextmenu)="false"
  83 + class="icon-30"
  84 + src="assets/img/ir-color.svg">
  85 + </div>
  86 + <div
47 87 [ngClass]="validate()"
48   - class="d-inline-block py-1 bg-white badge-pill text-primary"
  88 + *ngIf="currentIndex == sinonimos.length-1"
  89 + class="d-inline-block py-1 bg-white badge-pill text-primary ml-auto"
49 90 (click)="continue()">
50 91 CONTINUAR
51 92 <img
src/app/shared/sinonimo/sinonimo.component.scss
Diff comments   View file @ 6065f9c
1 1 .lista-sinonimos {
2   - min-height: auto;
  2 + min-height: 35vh;
3 3 max-height: 35vh;
4 4 }
src/app/shared/sinonimo/sinonimo.component.ts
Diff comments   View file @ 6065f9c
... ... @@ -18,6 +18,7 @@ export class SinonimoComponent implements OnInit {
18 18 articulosSelected: IArticulo[] = [];
19 19 articulo: IArticulo;
20 20 isSinonimoSelected = false;
  21 + currentIndex = 0;
21 22  
22 23 constructor(
23 24 private modalRef: BsModalRef,
... ... @@ -27,7 +28,13 @@ export class SinonimoComponent implements OnInit {
27 28 this.articulosSelected.length = this.sinonimos.length;
28 29 }
29 30  
30   - ngOnInit() { }
  31 + ngOnInit() {
  32 + for (const s of this.sinonimos) {
  33 + for (const a of s.productos) {
  34 + a.cantidad = 0;
  35 + }
  36 + }
  37 + }
31 38  
32 39 selectSinonimo(index: number, articulo: IArticulo) {
33 40 for (const a of this.sinonimos[index].productos) {
... ... @@ -73,6 +80,19 @@ export class SinonimoComponent implements OnInit {
73 80 }, err => console.error(err));
74 81 }
75 82  
  83 + sumarCantidadSinonimo(articulo: IArticulo, i: number) {
  84 + if (this.sinonimos[i].cantidadRestante === 0) return;
  85 + articulo.cantidad++;
  86 + this.sinonimos[i].cantidadRestante--;
  87 + }
  88 +
  89 + restarCantidadSinonimo(articulo: IArticulo, i: number) {
  90 + if (this.sinonimos[i].cantidadRestante === this.sinonimos[i].cantidad) return;
  91 + if (articulo.cantidad === 0) return;
  92 + articulo.cantidad--;
  93 + this.sinonimos[i].cantidadRestante++;
  94 + }
  95 +
76 96 scrollTo(index: number) {
77 97 const el = document.getElementById(index.toString());
78 98 el.scrollIntoView({ behavior: 'smooth' });
... ... @@ -102,3 +102,8 @@ p {
102 102 .z-index {
103 103 z-index: 1000;
104 104 }
  105 +
  106 +.flip {
  107 + -webkit-transform: scaleX(-1);
  108 + transform: scaleX(-1);
  109 +}
105 110 \ No newline at end of file