Commit 0de2d23fd5eac28fbf47f00f5222171499426744
Exists in
develop
Merge branch 'develop' into 'develop'
Develop See merge request !126
Showing
8 changed files
Show diff stats
package-lock.json
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
... | ... | @@ -158,13 +158,7 @@ export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDes |
158 | 158 | .subscribe((res: any) => { |
159 | 159 | this.modalRef = null; |
160 | 160 | if (!res) return; |
161 | - for (const a of articulo.productos) { | |
162 | - for (const aRes of res.articulos) { | |
163 | - if (a.idSinonimo === aRes.ID_SIN) { | |
164 | - this.articuloService.changeArticulo(a, aRes); | |
165 | - } | |
166 | - } | |
167 | - } | |
161 | + articulo.productos = res.articulos; | |
168 | 162 | this.articuloService.setArticulo(articulo); |
169 | 163 | }); |
170 | 164 | this.mediaPantalla(); |
src/app/shared/header-publicidad/header-publicidad.component.ts
... | ... | @@ -119,13 +119,8 @@ export class HeaderPublicidadComponent implements OnInit { |
119 | 119 | this.modalSinonimo.content.onClose |
120 | 120 | .subscribe((res: any) => { |
121 | 121 | this.modalSinonimo = null; |
122 | - for (const a of articulo.productos) { | |
123 | - for (const aRes of res.articulos) { | |
124 | - if (a.idSinonimo === aRes.ID_SIN) { | |
125 | - this.articuloService.changeArticulo(a, aRes); | |
126 | - } | |
127 | - } | |
128 | - } | |
122 | + if (!res) return; | |
123 | + articulo.productos = res.articulos; | |
129 | 124 | this.articuloService.setArticulo(articulo); |
130 | 125 | }); |
131 | 126 | } |
src/app/shared/promocion/promocion.component.ts
... | ... | @@ -86,13 +86,7 @@ export class PromocionComponent implements OnInit { |
86 | 86 | this.modalPromocion.hide(); |
87 | 87 | return; |
88 | 88 | } |
89 | - for (const a of articulo.productos) { | |
90 | - for (const aRes of res.articulos) { | |
91 | - if (a.idSinonimo === aRes.ID_SIN) { | |
92 | - this.articuloService.changeArticulo(a, aRes); | |
93 | - } | |
94 | - } | |
95 | - } | |
89 | + articulo.productos = res.articulos; | |
96 | 90 | this.articuloService.setArticulo(articulo); |
97 | 91 | this.onClose.next(); |
98 | 92 | this.modalPromocion.hide(); |
src/app/shared/sinonimo/sinonimo.component.html
... | ... | @@ -8,60 +8,57 @@ |
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 | 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 | - <p *ngFor="let s of sinonimos; let i = index"> | |
13 | - <span | |
14 | - class="btn-effect" | |
15 | - (click)="scrollTo(i)"> | |
16 | - Ir a opciรณn {{i+1}} | |
17 | - <i class="far fa-hand-point-left"></i> | |
18 | - </span> | |
19 | - </p> | |
20 | - </div> --> | |
21 | 11 | </div> |
22 | 12 | |
23 | - <div class="modal-body lista-sinonimos scroll-y-visible my-2 mr-2"> | |
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 border border-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-blanco.svg" | |
40 | - (click)="restarCantidadSinonimo(articulo, currentIndex)"> | |
41 | - </div> | |
42 | - <!-- CANTIDAD --> | |
43 | - <div class="col px-0 my-auto text-white 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-blanco.svg" | |
54 | - (click)="sumarCantidadSinonimo(articulo, currentIndex)"> | |
13 | + <div class="modal-body my-2"> | |
14 | + <p class="mb-2 h4">Opcion {{currentIndex+1}}</p> | |
15 | + <p class="mb-2 h5">Cantidad restante {{sinonimos[currentIndex].cantidadRestante}}</p> | |
16 | + <div class="lista-sinonimos scroll-y-visible"> | |
17 | + <div | |
18 | + class="row mx-0 mb-2 fade-in-left" | |
19 | + *ngFor="let articulo of sinonimos[currentIndex].productos"> | |
20 | + <div class="col-8 p-0 my-auto h6 text-right"> | |
21 | + <p class="m-0 font-weight-normal"> | |
22 | + {{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}} | |
23 | + </p> | |
24 | + </div> | |
25 | + <div class="col-4"> | |
26 | + <div class="row mx-0 justify-content-between border border-white badge-pill"> | |
27 | + <!-- BOTON MENOS --> | |
28 | + <div class="col-auto px-0 my-auto"> | |
29 | + <img | |
30 | + draggable="false" | |
31 | + ondragstart="return false;" | |
32 | + (contextmenu)="false" | |
33 | + class="d-block ml-auto py-2 icon-30 btn-effect" | |
34 | + src="assets/img/menos-blanco.svg" | |
35 | + (click)="restarCantidadSinonimo(articulo, currentIndex)"> | |
36 | + </div> | |
37 | + <!-- CANTIDAD --> | |
38 | + <div class="col px-0 my-auto text-white text-center"> | |
39 | + <p>{{articulo.cantidad}}</p> | |
40 | + </div> | |
41 | + <!-- BOTON MAS --> | |
42 | + <div class="col-auto px-0 my-auto"> | |
43 | + <img | |
44 | + draggable="false" | |
45 | + ondragstart="return false;" | |
46 | + (contextmenu)="false" | |
47 | + class="d-block ml-auto py-2 icon-30 btn-effect" | |
48 | + src="assets/img/mas-blanco.svg" | |
49 | + (click)="sumarCantidadSinonimo(articulo, currentIndex)"> | |
50 | + </div> | |
55 | 51 | </div> |
56 | 52 | </div> |
57 | 53 | </div> |
58 | 54 | </div> |
55 | + | |
59 | 56 | </div> |
60 | 57 | |
61 | 58 | <div class="modal-footer"> |
62 | 59 | <div |
63 | 60 | *ngIf="currentIndex != 0 && sinonimos.length > 1" |
64 | - class="d-inline-block py-1 bg-white badge-pill text-primary btn-effect mr-auto" | |
61 | + class="d-inline-block py-1 bg-white badge-pill text-primary btn-effect mr-auto fade-in-right" | |
65 | 62 | (click)="currentIndex = currentIndex-1"> |
66 | 63 | <img |
67 | 64 | draggable="false" |
... | ... | @@ -72,8 +69,8 @@ |
72 | 69 | VOLVER |
73 | 70 | </div> |
74 | 71 | <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" | |
72 | + *ngIf="currentIndex != sinonimos.length-1" | |
73 | + class="d-inline-block py-1 bg-white badge-pill text-primary btn-effect ml-auto fade-in-left" | |
77 | 74 | (click)="currentIndex = currentIndex+1"> |
78 | 75 | SIGUIENTE |
79 | 76 | <img |
... | ... | @@ -86,7 +83,7 @@ |
86 | 83 | <div |
87 | 84 | [ngClass]="validate()" |
88 | 85 | *ngIf="currentIndex == sinonimos.length-1" |
89 | - class="d-inline-block py-1 bg-white badge-pill text-primary ml-auto" | |
86 | + class="d-inline-block py-1 bg-white badge-pill text-primary ml-auto fade-in-left" | |
90 | 87 | (click)="continue()"> |
91 | 88 | CONTINUAR |
92 | 89 | <img |
src/app/shared/sinonimo/sinonimo.component.ts
... | ... | @@ -15,7 +15,6 @@ export class SinonimoComponent implements OnInit { |
15 | 15 | sinonimos: ISinonimo[] = []; |
16 | 16 | isValid: boolean; |
17 | 17 | onClose: Subject<any>; |
18 | - articulosSelected: IArticulo[] = []; | |
19 | 18 | articulo: IArticulo; |
20 | 19 | isSinonimoSelected = false; |
21 | 20 | currentIndex = 0; |
... | ... | @@ -25,7 +24,6 @@ export class SinonimoComponent implements OnInit { |
25 | 24 | private articuloService: ArticuloService, |
26 | 25 | ) { |
27 | 26 | this.onClose = new Subject(); |
28 | - this.articulosSelected.length = this.sinonimos.length; | |
29 | 27 | } |
30 | 28 | |
31 | 29 | ngOnInit() { |
... | ... | @@ -36,22 +34,13 @@ export class SinonimoComponent implements OnInit { |
36 | 34 | } |
37 | 35 | } |
38 | 36 | |
39 | - selectSinonimo(index: number, articulo: IArticulo) { | |
40 | - for (const a of this.sinonimos[index].productos) { | |
41 | - a.seleccionado = false; | |
42 | - } | |
43 | - articulo.seleccionado = true; | |
44 | - this.articulosSelected[index] = articulo; | |
45 | - } | |
46 | - | |
47 | 37 | validate() { |
48 | 38 | this.isValid = true; |
49 | 39 | for (const s of this.sinonimos) { |
50 | - for (const a of s.productos) { | |
51 | - this.isValid = (!a.seleccionado) ? false : true; | |
52 | - if (this.isValid) break; | |
40 | + if (s.cantidadRestante > 0) { | |
41 | + this.isValid = false; | |
42 | + break; | |
53 | 43 | } |
54 | - if (!this.isValid) break; | |
55 | 44 | } |
56 | 45 | return !this.isValid ? 'disabled' : 'btn-effect'; |
57 | 46 | } |
... | ... | @@ -60,18 +49,20 @@ export class SinonimoComponent implements OnInit { |
60 | 49 | if (!this.isValid) return; |
61 | 50 | if (this.isSinonimoSelected) return; |
62 | 51 | this.isSinonimoSelected = true; |
63 | - const ID_SINS = []; | |
64 | 52 | const observables = []; |
53 | + const cantidades = []; | |
65 | 54 | |
66 | - for (const articulo of this.articulosSelected) { | |
67 | - ID_SINS.push(articulo.ID_SIN); | |
68 | - observables.push(this.articuloService.getById(articulo.id)); | |
55 | + for (const s of this.sinonimos) { | |
56 | + for (const articulo of s.productos) { | |
57 | + if (articulo.cantidad === 0) continue; | |
58 | + cantidades.push(articulo.cantidad); | |
59 | + observables.push(this.articuloService.getById(articulo.id)); | |
60 | + } | |
69 | 61 | } |
70 | - | |
71 | 62 | forkJoin(observables) |
72 | 63 | .subscribe((res: IArticulo[]) => { |
73 | 64 | res.forEach((articulo, i) => { |
74 | - articulo.ID_SIN = ID_SINS[i]; | |
65 | + articulo.cantidad = cantidades[i]; | |
75 | 66 | }); |
76 | 67 | this.modalRef.hide(); |
77 | 68 | this.onClose.next({ |
src/scss/animations.scss
... | ... | @@ -124,6 +124,39 @@ |
124 | 124 | } |
125 | 125 | |
126 | 126 | /* |
127 | + * animation fade-in-right | |
128 | + */ | |
129 | +.fade-in-right { | |
130 | + -webkit-animation: fade-in-right 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both; | |
131 | + animation: fade-in-right 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both; | |
132 | +} | |
133 | + | |
134 | +@-webkit-keyframes fade-in-right { | |
135 | + 0% { | |
136 | + -webkit-transform: translateX(50px); | |
137 | + transform: translateX(50px); | |
138 | + opacity: 0; | |
139 | + } | |
140 | + 100% { | |
141 | + -webkit-transform: translateX(0); | |
142 | + transform: translateX(0); | |
143 | + opacity: 1; | |
144 | + } | |
145 | +} | |
146 | +@keyframes fade-in-right { | |
147 | + 0% { | |
148 | + -webkit-transform: translateX(50px); | |
149 | + transform: translateX(50px); | |
150 | + opacity: 0; | |
151 | + } | |
152 | + 100% { | |
153 | + -webkit-transform: translateX(0); | |
154 | + transform: translateX(0); | |
155 | + opacity: 1; | |
156 | + } | |
157 | +} | |
158 | + | |
159 | +/* | |
127 | 160 | * animation swing-in-top-fwd |
128 | 161 | */ |
129 | 162 | .swing-in-top-fwd { |