Luis Suarez / autoservicio-axion

Download as
Browse Code »

Commit 09fee6732935ea5a68a3ee9284f4a3da9ada96f6

Authored by Marcelo Puebla
2 parents 0962e67bdd 84919dc526
Exists in develop

Merge branch 'develop' into 'develop' 

Develop

See merge request !117
Showing 8 changed files   Show diff stats
src/app/modules/carrito/carrito.component.html
Diff comments   View file @ 09fee67
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <!-- PUBLICIDADES --> 2 <!-- PUBLICIDADES -->
3 <app-header-publicidad></app-header-publicidad> 3 <app-header-publicidad></app-header-publicidad>
4 4
5 <div class="h-75 carrito-content" #carritoContent> 5 <div class="h-75 carrito-content" #carritoContent>
6 <!-- CABECERA --> 6 <!-- CABECERA -->
7 <div class="row mx-3 h-auto border border-primary rounded-sm"> 7 <div class="row mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 px-0 py-2 align-self-center"> 8 <div class="col-12 px-0 py-2 align-self-center">
9 <div class="px-3"> 9 <div class="px-3">
10 <p class="h6 text-truncate">ESTE ES TÚ CARRITO DE COMPRAS</p> 10 <p class="h6 text-truncate">ESTE ES TÚ CARRITO DE COMPRAS</p>
11 </div> 11 </div>
12 </div> 12 </div>
13 </div> 13 </div>
14 14
15 <!-- CARRITO --> 15 <!-- CARRITO -->
16 <div 16 <div
17 class="row mx-2 mt-4 h-80 h-lg-60 align-content-start scroll-y-visible" 17 class="row mx-2 mt-4 h-80 h-lg-60 align-content-start scroll-y-visible"
18 (scroll)="scrollEvent($event)"> 18 (scroll)="scrollEvent($event)">
19 <!-- MENSAJE DE ADVERTENCIA --> 19 <!-- MENSAJE DE ADVERTENCIA -->
20 <div class="col-10 align-self-center alert alert-primary" *ngIf="!articuloService.carrito.length"> 20 <div class="col-10 align-self-center alert alert-primary" *ngIf="!articuloService.carrito.length">
21 <p class="h5 text-center">No hay artículos en el carrito</p> 21 <p class="h5 text-center">No hay artículos en el carrito</p>
22 </div> 22 </div>
23 <!-- ARTICULOS --> 23 <!-- ARTICULOS -->
24 <div 24 <div
25 class="col-12 col-xl-6 p-2 h-50 h-md-25 h-xl-40 text-center text-truncate carrito-articulo" 25 class="col-12 col-xl-6 p-2 h-50 h-md-25 h-xl-40 text-center text-truncate carrito-articulo"
26 [ngClass]="{'media-pantalla': carritoContent.classList.contains('media-pantalla')}" 26 [ngClass]="{'media-pantalla': carritoContent.classList.contains('media-pantalla')}"
27 *ngFor="let articulo of articuloService.carrito; let i = index;" 27 *ngFor="let articulo of articuloService.carrito; let i = index;"
28 @EnterLeaveX> 28 @EnterLeaveX>
29 <!-- ARTICULO --> 29 <!-- ARTICULO -->
30 <div class="h-100 border border-primary rounded-sm"> 30 <div class="h-100 border border-primary rounded-sm">
31 <div class="row align-items-center mx-0 h-100"> 31 <div class="row align-items-center mx-0 h-100">
32 <!-- NOMBRE E IMAGEN --> 32 <!-- NOMBRE E IMAGEN -->
33 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 33 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
34 <img 34 <img
35 draggable="false" 35 draggable="false"
36 ondragstart="return false;" 36 ondragstart="return false;"
37 (contextmenu)="false" 37 (contextmenu)="false"
38 class="d-none d-md-block mx-auto h-55 rounded-sm shadow-sm" 38 class="d-none d-md-block mx-auto h-55 rounded-sm shadow-sm"
39 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 39 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
40 onerror="this.src='assets/img/imagen-no-encontrada.jpg'"> 40 onerror="this.src='assets/img/imagen-no-encontrada.jpg'">
41 <div class="row mx-0 h-100 h-md-45"> 41 <div class="row mx-0 h-100 h-md-45">
42 <p class="col text-primary text-truncate align-self-center"> 42 <p class="col text-primary text-truncate align-self-center">
43 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small> 43 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small>
44 </p> 44 </p>
45 </div> 45 </div>
46 </div> 46 </div>
47 <!-- CANTIDAD --> 47 <!-- CANTIDAD -->
48 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 48 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
49 <p class="h-40"><small>CANT</small></p> 49 <p class="h-40"><small>CANT</small></p>
50 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 50 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
51 </div> 51 </div>
52 <!-- PRECIO --> 52 <!-- PRECIO -->
53 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 53 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
54 <p class="h-40"><small>PRECIO</small></p> 54 <p class="h-40"><small>PRECIO</small></p>
55 <div class="py-1 badge-pill bg-dark text-white"> 55 <div class="py-1 badge-pill bg-dark text-white">
56 <p><small>{{articulo.PreVen | currency}}</small></p> 56 <p><small>{{articulo.PreVen | currency}}</small></p>
57 </div> 57 </div>
58 </div> 58 </div>
59 <!-- ELIMINAR --> 59 <!-- ELIMINAR -->
60 <div class="col-6 col-md-3 align-self-center"> 60 <div class="col-6 col-md-3 align-self-center">
61 <div class="row mx-0 justify-content-center"> 61 <div class="row mx-0 justify-content-center">
62 <div 62 <div
63 class="col-auto px-3 py-1 btn-effect bg-primary badge-pill text-white" 63 class="col-auto px-3 py-1 btn-effect bg-primary badge-pill text-white"
64 (click)="deleteArticulo(i)"> 64 (click)="deleteArticulo(i)">
65 <span> 65 <span>
66 <small class="pr-2">ELIMINAR</small> 66 <small class="pr-2">ELIMINAR</small>
67 <img 67 <img
68 draggable="false" 68 draggable="false"
69 ondragstart="return false;" 69 ondragstart="return false;"
70 (contextmenu)="false" 70 (contextmenu)="false"
71 class="icon-20 rotate-45" 71 class="icon-20 rotate-45"
72 src="assets/img/mas-blanco.svg"> 72 src="assets/img/mas-blanco.svg">
73 </span> 73 </span>
74 </div> 74 </div>
75 </div> 75 </div>
76 </div> 76 </div>
77 </div> 77 </div>
78 </div> 78 </div>
79 </div> 79 </div>
80 </div> 80 </div>
81 <!-- TOTAL --> 81 <!-- TOTAL -->
82 <div class="row mx-3 mt-2 h-auto justify-content-end"> 82 <div class="row mx-3 mt-2 h-auto justify-content-end">
83 <div class="col-auto font-weight-bold align-self-center text-primary py-2 h3">TOTAL</div> 83 <div class="col-auto font-weight-bold align-self-center text-primary py-2 h3">TOTAL</div>
84 <div class="col-auto align-self-center bg-primary badge-pill"> 84 <div class="col-auto align-self-center bg-primary badge-pill">
85 <p class="text-center font-weight-bold text-white py-2 h3 px-2">{{articuloService.subTotal | currency}}</p> 85 <p class="text-center font-weight-bold text-white py-2 h3 px-2">{{articuloService.total | currency}}</p>
86 </div> 86 </div>
87 </div> 87 </div>
88 <!-- CONTINUAR --> 88 <!-- CONTINUAR -->
89 <div 89 <div
90 *ngIf="articuloService.carrito.length" 90 *ngIf="articuloService.carrito.length"
91 class="row mx-3 mt-4 h-auto justify-content-end"> 91 class="row mx-3 mt-4 h-auto justify-content-end">
92 <div 92 <div
93 class="col-auto py-2 px-3 align-self-center btn-effect bg-primary badge-pill text-white" 93 class="col-auto py-2 px-3 align-self-center btn-effect bg-primary badge-pill text-white"
94 [routerLink]="['/forma-pago']"> 94 [routerLink]="['/forma-pago']">
95 <span> 95 <span>
96 <small class="pr-2">CONTINUAR</small> 96 <small class="pr-2">CONTINUAR</small>
97 <img 97 <img
98 draggable="false" 98 draggable="false"
99 ondragstart="return false;" 99 ondragstart="return false;"
100 (contextmenu)="false" 100 (contextmenu)="false"
101 class="icon-20" 101 class="icon-20"
102 src="assets/img/ir.svg"> 102 src="assets/img/ir.svg">
103 </span> 103 </span>
104 </div> 104 </div>
105 </div> 105 </div>
106 </div> 106 </div>
107 107
108 </div> 108 </div>
109 109
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ 09fee67
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <!-- PUBLICIDADES --> 2 <!-- PUBLICIDADES -->
3 <app-header-publicidad></app-header-publicidad> 3 <app-header-publicidad></app-header-publicidad>
4 4
5 <div class="row mx-0 align-items-end" 5 <div class="row mx-0 align-items-end"
6 [ngClass]="boxCarrito.classList.contains('media-pantalla') 6 [ngClass]="boxCarrito.classList.contains('media-pantalla')
7 ? 'h-68' : 'h-80'"> 7 ? 'h-68' : 'h-80'">
8 <!-- CABECERA --> 8 <!-- CABECERA -->
9 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm"> 9 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm">
10 <div class="col-12 p-2 align-self-center"> 10 <div class="col-12 p-2 align-self-center">
11 <div class="px-3"> 11 <div class="px-3">
12 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p> 12 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p>
13 </div> 13 </div>
14 </div> 14 </div>
15 </div> 15 </div>
16 <!-- CUERPO --> 16 <!-- CUERPO -->
17 <div class="row w-100 mr-4 h-50 h-md-70" id="content"> 17 <div class="row w-100 mr-4 h-50 h-md-70" id="content">
18 <div class="col-12 h-100 px-0 py-3"> 18 <div class="col-12 h-100 px-0 py-3">
19 <div class="row mx-0 h-100"> 19 <div class="row mx-0 h-100">
20 <app-filtro-categorias 20 <app-filtro-categorias
21 class="col-5 col-sm-3 col-xl-2 h-100" 21 class="col-5 col-sm-3 col-xl-2 h-100"
22 #filtroCategorias 22 #filtroCategorias
23 (getProductos)="getProductos()" 23 (getProductos)="getProductos()"
24 (setProductos)="setProductos()" 24 (setProductos)="setProductos()"
25 (filterItems)="filterItems()"> 25 (filterItems)="filterItems()">
26 </app-filtro-categorias> 26 </app-filtro-categorias>
27 <!-- LISTA DE ARTICULOS --> 27 <!-- LISTA DE ARTICULOS -->
28 <div 28 <div
29 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible" 29 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible"
30 (scroll)="scrollEvent($event)"> 30 (scroll)="scrollEvent($event)">
31 <!-- SPINNER --> 31 <!-- SPINNER -->
32 <div 32 <div
33 class="d-flex justify-content-center" 33 class="d-flex justify-content-center"
34 *ngIf="loading"> 34 *ngIf="loading">
35 <div class="spinner-border text-primary mt-5" role="status"> 35 <div class="spinner-border text-primary mt-5" role="status">
36 <span class="sr-only">Loading...</span> 36 <span class="sr-only">Loading...</span>
37 </div> 37 </div>
38 </div> 38 </div>
39 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6"> 39 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6">
40 <!-- ARTICULO --> 40 <!-- ARTICULO -->
41 <div 41 <div
42 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;" 42 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;"
43 class="col px-2 my-1 my-md-3 h-auto"> 43 class="col px-2 my-1 my-md-3 h-auto">
44 <div 44 <div
45 class="swing-in-top-fwd btn-effect card h-auto" 45 class="swing-in-top-fwd btn-effect card h-auto"
46 (click)="selectArticulo(articulo)"> 46 (click)="selectArticulo(articulo)">
47 <img 47 <img
48 draggable="false" 48 draggable="false"
49 ondragstart="return false;" 49 ondragstart="return false;"
50 (contextmenu)="false" 50 (contextmenu)="false"
51 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 51 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
52 onerror="this.src='assets/img/imagen-no-encontrada.jpg'" 52 onerror="this.src='assets/img/imagen-no-encontrada.jpg'"
53 class="card-img-top w-100 h-auto h-md-55 rounded-sm"> 53 class="card-img-top w-100 h-auto h-md-55 rounded-sm">
54 <div class="row mx-0 py-1 h-auto justify-content-center"> 54 <div class="row mx-0 py-1 h-auto justify-content-center">
55 <p class="col-12 px-1 h6 h-auto text-primary text-center min-h-60"> 55 <p class="col-12 px-1 h6 h-auto text-primary text-center min-h-60">
56 {{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}} 56 {{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}
57 </p> 57 </p>
58 <div class="col-12 px-1 align-self-end h-auto"> 58 <div class="col-12 px-1 align-self-end h-auto">
59 <div class="row mx-0 justify-content-between bg-primary badge-pill"> 59 <div class="row mx-0 justify-content-between bg-primary badge-pill">
60 <div class="col px-0 align-self-center text-white text-right"> 60 <div class="col px-0 align-self-center text-white text-right">
61 {{articulo.PreVen | currency}} 61 {{articulo.PreVen | currency}}
62 </div> 62 </div>
63 <div class="col-5 px-0"> 63 <div class="col-5 px-0">
64 <img 64 <img
65 draggable="false" 65 draggable="false"
66 ondragstart="return false;" 66 ondragstart="return false;"
67 (contextmenu)="false" 67 (contextmenu)="false"
68 class="d-block ml-auto py-1 icon-30" 68 class="d-block ml-auto py-1 icon-30"
69 src="assets/img/ir.svg"> 69 src="assets/img/ir.svg">
70 </div> 70 </div>
71 </div> 71 </div>
72 </div> 72 </div>
73 </div> 73 </div>
74 </div> 74 </div>
75 </div> 75 </div>
76 </div> 76 </div>
77 <!-- BOTON VER MAS --> 77 <!-- BOTON VER MAS -->
78 <div class="row mx-0"> 78 <div class="row mx-0">
79 <div 79 <div
80 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length" 80 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length"
81 class="col-12 px-0 mb-2"> 81 class="col-12 px-0 mb-2">
82 <button 82 <button
83 (click)="increaseShow()" 83 (click)="increaseShow()"
84 class="btn btn-block btn-outline-primary"> 84 class="btn btn-block btn-outline-primary">
85 Ver Más 85 Ver Más
86 </button> 86 </button>
87 </div> 87 </div>
88 </div> 88 </div>
89 </div> 89 </div>
90 </div> 90 </div>
91 </div> 91 </div>
92 </div> 92 </div>
93 <!-- FOOTER CARRITO DE COMPRAS --> 93 <!-- FOOTER CARRITO DE COMPRAS -->
94 <div class="row w-90 mx-auto h-auto justify-content-center"> 94 <div class="row w-90 mx-auto h-auto justify-content-center">
95 <div class="h-75 px-0 border border-primary rounded" #boxCarrito 95 <div class="h-75 px-0 border border-primary rounded" #boxCarrito
96 [ngClass]="boxCarrito.classList.contains('media-pantalla') 96 [ngClass]="boxCarrito.classList.contains('media-pantalla')
97 ? 'col-8' : 'col-12'" id="boxCarrito"> 97 ? 'col-8' : 'col-12'" id="boxCarrito">
98 <!-- CABECERA --> 98 <!-- CABECERA -->
99 <div class="row mx-0 h-15 border-bottom border-primary"> 99 <div class="row mx-0 h-15 border-bottom border-primary">
100 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p> 100 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p>
101 </div> 101 </div>
102 <!-- CUERPO --> 102 <!-- CUERPO -->
103 <div class="row h-85 mx-0 justify-content-around"> 103 <div class="row h-85 mx-0 justify-content-around">
104 <!-- BOTON SCROLL IZQUIERDA --> 104 <!-- BOTON SCROLL IZQUIERDA -->
105 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 105 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
106 <img 106 <img
107 draggable="false" 107 draggable="false"
108 ondragstart="return false;" 108 ondragstart="return false;"
109 (contextmenu)="false" 109 (contextmenu)="false"
110 class="icon-30 rotate-180-neg" 110 class="icon-30 rotate-180-neg"
111 src="assets/img/ir-fondo-color.svg" 111 src="assets/img/ir-fondo-color.svg"
112 (mousedown)="scrollX(templateCarrito, -100)" 112 (mousedown)="scrollX(templateCarrito, -100)"
113 (mouseup)="mouseup()" 113 (mouseup)="mouseup()"
114 (mouseleave)="mouseup()"> 114 (mouseleave)="mouseup()">
115 </div> 115 </div>
116 <!-- CARRITO --> 116 <!-- CARRITO -->
117 <div class="col-6 col-sm-8 col-lg-10 h-100"> 117 <div class="col-6 col-sm-8 col-lg-10 h-100">
118 <div 118 <div
119 #templateCarrito 119 #templateCarrito
120 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x" 120 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"
121 (scroll)="scrollEvent($event)"> 121 (scroll)="scrollEvent($event)">
122 <!-- ARTICULOS --> 122 <!-- ARTICULOS -->
123 <div 123 <div
124 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary" 124 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
125 *ngFor="let articulo of articuloService.carrito; let i = index;" 125 *ngFor="let articulo of articuloService.carrito; let i = index;"
126 @EnterLeaveY> 126 @EnterLeaveY>
127 <img 127 <img
128 class="btn-effect icon-20 mr-2 position-absolute right-0" 128 class="btn-effect icon-20 mr-2 position-absolute right-0"
129 src="assets/img/icono-cancelar-color.svg" 129 src="assets/img/icono-cancelar-color.svg"
130 (click)="deleteArticulo(i)"> 130 (click)="deleteArticulo(i)">
131 <img 131 <img
132 draggable="false" 132 draggable="false"
133 ondragstart="return false;" 133 ondragstart="return false;"
134 (contextmenu)="false" 134 (contextmenu)="false"
135 class="d-block img-fluid p-2 mx-auto rounded w-100 h-auto" 135 class="d-block img-fluid p-2 mx-auto rounded w-100 h-auto"
136 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 136 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
137 onerror="this.src='assets/img/imagen-no-encontrada.jpg'"> 137 onerror="this.src='assets/img/imagen-no-encontrada.jpg'">
138 <p class="d-block mt-auto text-center text-primary text-truncate"> 138 <p class="d-block mt-auto text-center text-primary text-truncate">
139 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small> 139 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small>
140 </p> 140 </p>
141 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 141 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
142 </div> 142 </div>
143 <!-- MENSAJE DE ADVERTENCIA --> 143 <!-- MENSAJE DE ADVERTENCIA -->
144 <div *ngIf="!articuloService.carrito.length" class="col h-100"> 144 <div *ngIf="!articuloService.carrito.length" class="col h-100">
145 <p class="text-center py-5">No hay articulos en el carrito</p> 145 <p class="text-center py-5">No hay articulos en el carrito</p>
146 </div> 146 </div>
147 </div> 147 </div>
148 </div> 148 </div>
149 <!-- BOTON SCROLL DERECHA --> 149 <!-- BOTON SCROLL DERECHA -->
150 <div *ngIf="articuloService.carrito.length" 150 <div *ngIf="articuloService.carrito.length"
151 class="col-auto btn-effect h-20 align-self-center d-contents"> 151 class="col-auto btn-effect h-20 align-self-center d-contents">
152 <img 152 <img
153 draggable="false" 153 draggable="false"
154 ondragstart="return false;" 154 ondragstart="return false;"
155 (contextmenu)="false" 155 (contextmenu)="false"
156 class="icon-30" 156 class="icon-30"
157 src="assets/img/ir-fondo-color.svg" 157 src="assets/img/ir-fondo-color.svg"
158 (mousedown)="scrollX(templateCarrito, 100)" 158 (mousedown)="scrollX(templateCarrito, 100)"
159 (mouseup)="mouseup()" 159 (mouseup)="mouseup()"
160 (mouseleave)="mouseup()"> 160 (mouseleave)="mouseup()">
161 </div> 161 </div>
162 </div> 162 </div>
163 </div> 163 </div>
164 <!-- TOTAL--> 164 <!-- TOTAL-->
165 <div 165 <div
166 class="col-auto mt-2 ml-auto h-20"> 166 class="col-auto mt-2 ml-auto h-20">
167 <div class="row mx-0"> 167 <div class="row mx-0">
168 <div class="col-auto font-weight-bold align-self-center text-primary py-2 h3">TOTAL</div> 168 <div class="col-auto font-weight-bold align-self-center text-primary py-2 h3">TOTAL</div>
169 <div class="col-auto align-self-center bg-primary badge-pill"> 169 <div class="col-auto align-self-center bg-primary badge-pill">
170 <p class="text-center font-weight-bold text-white py-2 h3 px-2">{{articuloService.subTotal | currency}}</p> 170 <p class="text-center font-weight-bold text-white py-2 h3 px-2">{{articuloService.total | currency}}</p>
171 </div> 171 </div>
172 </div> 172 </div>
173 </div> 173 </div>
174 174
175 <!-- VER CARRITO --> 175 <!-- VER CARRITO -->
176 <div 176 <div
177 class="col-auto px-0 h-20" 177 class="col-auto px-0 h-20"
178 *ngIf="articuloService.carrito.length" 178 *ngIf="articuloService.carrito.length"
179 [ngClass]="boxCarrito.classList.contains('media-pantalla') ? 'ml-auto' : 'mt-3'"> 179 [ngClass]="boxCarrito.classList.contains('media-pantalla') ? 'ml-auto' : 'mt-3'">
180 <div 180 <div
181 class="btn-effect col-auto px-0 align-self-center bg-white" 181 class="btn-effect col-auto px-0 align-self-center bg-white"
182 [routerLink]="['/carrito']"> 182 [routerLink]="['/carrito']">
183 <div class="row mx-0 bg-light"> 183 <div class="row mx-0 bg-light">
184 <div class="col-auto p-0 bg-primary"> 184 <div class="col-auto p-0 bg-primary">
185 <img 185 <img
186 draggable="false" 186 draggable="false"
187 ondragstart="return false;" 187 ondragstart="return false;"
188 (contextmenu)="false" 188 (contextmenu)="false"
189 class="p-2 icon-40" 189 class="p-2 icon-40"
190 src="assets/img/carrito.svg"> 190 src="assets/img/carrito.svg">
191 </div> 191 </div>
192 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div> 192 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div>
193 </div> 193 </div>
194 </div> 194 </div>
195 </div> 195 </div>
196 196
197 </div> 197 </div>
198 </div> 198 </div>
199 199
200 </div> 200 </div>
201 201
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ 09fee67
1 import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit } from '@angular/core'; 1 import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit } from '@angular/core';
2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; 2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 import { IArticulo } from 'src/app/interfaces/IArticulo'; 4 import { IArticulo } from 'src/app/interfaces/IArticulo';
5 import { APP_SETTINGS } from 'src/etc/AppSettings'; 5 import { APP_SETTINGS } from 'src/etc/AppSettings';
6 import { ICategoria } from 'src/app/interfaces/ICategoria'; 6 import { ICategoria } from 'src/app/interfaces/ICategoria';
7 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 7 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component'; 8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 9 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
11 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component'; 11 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
12 import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component'; 12 import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component';
13 import * as _ from 'lodash'; 13 import * as _ from 'lodash';
14 import { ANIMATIONS } from 'src/app/utils/animations'; 14 import { ANIMATIONS } from 'src/app/utils/animations';
15 15
16 @Component({ 16 @Component({
17 selector: 'app-seleccion-articulos', 17 selector: 'app-seleccion-articulos',
18 templateUrl: './seleccion-articulos.component.html', 18 templateUrl: './seleccion-articulos.component.html',
19 styleUrls: ['./seleccion-articulos.component.scss'], 19 styleUrls: ['./seleccion-articulos.component.scss'],
20 animations: [ANIMATIONS.EnterLeaveY] 20 animations: [ANIMATIONS.EnterLeaveY]
21 }) 21 })
22 export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDestroy { 22 export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDestroy {
23 loading = true; 23 loading = true;
24 timeoutHandler: any; 24 timeoutHandler: any;
25 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`; 25 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
26 articulos: IArticulo[] = []; 26 articulos: IArticulo[] = [];
27 auxArticulos: IArticulo[] = []; 27 auxArticulos: IArticulo[] = [];
28 showQuantity = 100; 28 showQuantity = 100;
29 searchTerm = ''; 29 searchTerm = '';
30 ordenandoByVendidos = true; 30 ordenandoByVendidos = true;
31 modalRef: BsModalRef; 31 modalRef: BsModalRef;
32 total = 0; 32 total = 0;
33 @ViewChild(FiltroCategoriasComponent, { static: false }) filtroCategorias: FiltroCategoriasComponent; 33 @ViewChild(FiltroCategoriasComponent, { static: false }) filtroCategorias: FiltroCategoriasComponent;
34 34
35 constructor( 35 constructor(
36 public articuloService: ArticuloService, 36 public articuloService: ArticuloService,
37 private sinonimoService: SinonimoService, 37 private sinonimoService: SinonimoService,
38 private modalService: BsModalService, 38 private modalService: BsModalService,
39 private inactiveScreen: InactiveScreenService, 39 private inactiveScreen: InactiveScreenService,
40 ) { } 40 ) { }
41 41
42 ngOnInit() { } 42 ngOnInit() { }
43 43
44 ngAfterViewInit(): void { 44 ngAfterViewInit(): void {
45 this.filtroCategorias.getCategorias(); 45 this.filtroCategorias.getCategorias();
46 this.mediaPantalla(); 46 this.mediaPantalla();
47 } 47 }
48 48
49 ngOnDestroy() { 49 ngOnDestroy() {
50 for (let i = 1; i <= this.modalService.getModalsCount(); i++) { 50 for (let i = 1; i <= this.modalService.getModalsCount(); i++) {
51 this.modalService.hide(i); 51 this.modalService.hide(i);
52 } 52 }
53 } 53 }
54 54
55 getProductos() { 55 getProductos() {
56 this.articuloService.getAll() 56 this.articuloService.getAll()
57 .subscribe((result: IArticulo[]) => { 57 .subscribe((result: IArticulo[]) => {
58 this.articuloService.setArticulosSinImagen(result); 58 this.articuloService.setArticulosSinImagen(result);
59 if (this.filtroCategorias.queMostrar === 'ordenar') { 59 if (this.filtroCategorias.queMostrar === 'ordenar') {
60 this.filtroCategorias.categorias.forEach((categoria: ICategoria) => { 60 this.filtroCategorias.categorias.forEach((categoria: ICategoria) => {
61 const tempArticulos = result.filter((articulo: IArticulo) => { 61 const tempArticulos = result.filter((articulo: IArticulo) => {
62 return articulo.categoria_selfservice === categoria.id; 62 return articulo.categoria_selfservice === categoria.id;
63 }); 63 });
64 result = tempArticulos; 64 result = tempArticulos;
65 }); 65 });
66 } 66 }
67 localStorage.setItem('articulos', JSON.stringify(result)); 67 localStorage.setItem('articulos', JSON.stringify(result));
68 this.setProductos(); 68 this.setProductos();
69 }, (error) => { 69 }, (error) => {
70 console.error(error); 70 console.error(error);
71 }); 71 });
72 } 72 }
73 73
74 setProductos() { 74 setProductos() {
75 this.articulos = JSON.parse(localStorage.getItem('articulos')); 75 this.articulos = JSON.parse(localStorage.getItem('articulos'));
76 this.filterItems(); 76 this.filterItems();
77 this.loading = false; 77 this.loading = false;
78 } 78 }
79 79
80 filterItems() { 80 filterItems() {
81 if (this.filtroCategorias.categoriaActive === 0) { 81 if (this.filtroCategorias.categoriaActive === 0) {
82 this.auxArticulos = this.articulos; 82 this.auxArticulos = this.articulos;
83 return; 83 return;
84 } 84 }
85 this.auxArticulos = this.articulos.filter(x => { 85 this.auxArticulos = this.articulos.filter(x => {
86 return x.categoria_selfservice === this.filtroCategorias.categoriaActive; 86 return x.categoria_selfservice === this.filtroCategorias.categoriaActive;
87 }); 87 });
88 this.ordenar(); 88 this.ordenar();
89 } 89 }
90 90
91 ordenar() { 91 ordenar() {
92 if (this.ordenandoByVendidos) { 92 if (this.ordenandoByVendidos) {
93 this.auxArticulos.sort((a, b) => { 93 this.auxArticulos.sort((a, b) => {
94 return b.cantidadVendida - a.cantidadVendida; 94 return b.cantidadVendida - a.cantidadVendida;
95 }); 95 });
96 } 96 }
97 } 97 }
98 98
99 selectArticulo(articulo: IArticulo) { 99 selectArticulo(articulo: IArticulo) {
100 this.getByID(articulo.id); 100 this.getByID(articulo.id);
101 } 101 }
102 102
103 getByID(id: number) { 103 getByID(id: number) {
104 this.articuloService.getById(id) 104 this.articuloService.getById(id)
105 .subscribe((res: IArticulo) => { 105 .subscribe((res: IArticulo) => {
106 if (res.FPP) { 106 if (res.FPP) {
107 this.openModalPromos(res); 107 this.openModalPromos(res);
108 } else { 108 } else {
109 this.getSinonimos(res); 109 this.getSinonimos(res);
110 } 110 }
111 }, err => console.error(err)); 111 }, err => console.error(err));
112 } 112 }
113 113
114 getSinonimos(articulo: IArticulo) { 114 getSinonimos(articulo: IArticulo) {
115 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt) 115 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
116 .subscribe((res: any[]) => { 116 .subscribe((res: any[]) => {
117 if (res.length) { 117 if (res.length) {
118 const sinonimos = []; 118 const sinonimos = [];
119 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 119 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
120 Object.keys(gruposArticulos).forEach(key => { 120 Object.keys(gruposArticulos).forEach(key => {
121 sinonimos.push({ productos: gruposArticulos[key] }); 121 sinonimos.push({ productos: gruposArticulos[key] });
122 }); 122 });
123 res = sinonimos; 123 res = sinonimos;
124 this.openModalSinonimos(res, articulo); 124 this.openModalSinonimos(res, articulo);
125 } else { 125 } else {
126 this.articuloService.setArticulo(articulo); 126 this.articuloService.setArticulo(articulo);
127 } 127 }
128 }); 128 });
129 } 129 }
130 130
131 openModalPromos(articulo: IArticulo) { 131 openModalPromos(articulo: IArticulo) {
132 if (this.modalRef) return; 132 if (this.modalRef) return;
133 this.articuloService.setArticulosSinImagen([articulo]); 133 this.articuloService.setArticulosSinImagen([articulo]);
134 this.modalRef = this.modalService.show(PromocionComponent, { 134 this.modalRef = this.modalService.show(PromocionComponent, {
135 initialState: { articulosPromo: [articulo] }, 135 initialState: { articulosPromo: [articulo] },
136 class: 'modal-dialog-centered', 136 class: 'modal-dialog-centered',
137 ignoreBackdropClick: true, 137 ignoreBackdropClick: true,
138 }); 138 });
139 this.modalRef.content.onClose 139 this.modalRef.content.onClose
140 .subscribe(() => this.modalRef = null); 140 .subscribe(() => this.modalRef = null);
141 this.mediaPantalla(); 141 this.mediaPantalla();
142 } 142 }
143 143
144 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 144 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
145 if (this.modalRef) return; 145 if (this.modalRef) return;
146 this.modalRef = this.modalService.show(SinonimoComponent, { 146 this.modalRef = this.modalService.show(SinonimoComponent, {
147 initialState: { 147 initialState: {
148 sinonimos: sinonimosData, 148 sinonimos: sinonimosData,
149 articulo 149 articulo
150 }, 150 },
151 class: 'modal-dialog-centered', 151 class: 'modal-dialog-centered',
152 ignoreBackdropClick: true, 152 ignoreBackdropClick: true,
153 }); 153 });
154 154
155 this.modalRef.content.onClose 155 this.modalRef.content.onClose
156 .subscribe((res: any) => { 156 .subscribe((res: any) => {
157 this.modalRef = null; 157 this.modalRef = null;
158 if (!res) return;
158 for (const a of articulo.productos) { 159 for (const a of articulo.productos) {
159 for (const aRes of res.articulos) { 160 for (const aRes of res.articulos) {
160 if (a.idSinonimo === aRes.ID_SIN) { 161 if (a.idSinonimo === aRes.ID_SIN) {
161 a.CODA = aRes.CodArt; 162 this.articuloService.changeArticulo(a, aRes);
162 a.CodArt = aRes.CodArt;
163 a.SECA = aRes.CodSec;
164 aRes.CodSec = aRes.CodSec;
165 a.PreVen = aRes.PreVen;
166 a.id = aRes.id;
167 a.DET_LAR = aRes.DET_LAR;
168 a.DetArt = aRes.DetArt;
169 } 163 }
170 } 164 }
171 } 165 }
172 this.articuloService.setArticulo(articulo); 166 this.articuloService.setArticulo(articulo);
173 }); 167 });
174 this.mediaPantalla(); 168 this.mediaPantalla();
175 } 169 }
176 170
177 deleteArticulo(index: number) { 171 deleteArticulo(index: number) {
178 this.articuloService.deleteArticulo(index); 172 this.articuloService.deleteArticulo(index);
179 } 173 }
180 174
181 increaseShow() { 175 increaseShow() {
182 this.showQuantity += 100; 176 this.showQuantity += 100;
183 } 177 }
184 178
185 @HostListener('scroll', ['$event']) 179 @HostListener('scroll', ['$event'])
186 scrollEvent(event: Event) { 180 scrollEvent(event: Event) {
187 clearTimeout(this.inactiveScreen.timerReposo); 181 clearTimeout(this.inactiveScreen.timerReposo);
188 this.inactiveScreen.startTimeOutInactividad(); 182 this.inactiveScreen.startTimeOutInactividad();
189 } 183 }
190 184
191 mouseup() { 185 mouseup() {
192 if (!this.timeoutHandler) return; 186 if (!this.timeoutHandler) return;
193 clearInterval(this.timeoutHandler); 187 clearInterval(this.timeoutHandler);
194 } 188 }
195 189
196 scrollY(el: HTMLElement, value) { 190 scrollY(el: HTMLElement, value) {
197 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 191 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
198 this.timeoutHandler = setInterval(() => { 192 this.timeoutHandler = setInterval(() => {
199 el.scroll({ behavior: 'smooth', top: value + el.scrollTop }); 193 el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
200 }, 500); 194 }, 500);
201 } 195 }
202 196
203 scrollX(el: HTMLElement, value) { 197 scrollX(el: HTMLElement, value) {
204 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); 198 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft });
205 this.timeoutHandler = setInterval(() => { 199 this.timeoutHandler = setInterval(() => {
206 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft }); 200 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft });
207 }, 500); 201 }, 500);
208 } 202 }
209 203
210 mediaPantalla() { 204 mediaPantalla() {
211 if ($('body').hasClass('media-pantalla')) { 205 if ($('body').hasClass('media-pantalla')) {
212 $(`.cat-content,#cat-content,#content,.cat-btn,#boxCarrito, 206 $(`.cat-content,#cat-content,#content,.cat-btn,#boxCarrito,
213 .cat-box,.img-categoria, .modal-content`) 207 .cat-box,.img-categoria, .modal-content`)
214 .addClass('media-pantalla') 208 .addClass('media-pantalla')
215 .addBack('media-pantalla'); 209 .addBack('media-pantalla');
216 } 210 }
217 } 211 }
218 } 212 }
src/app/modules/splash-screen/splash-screen.component.ts
Diff comments   View file @ 09fee67
1 import { Component, OnInit } from '@angular/core'; 1 import { Component, OnInit } from '@angular/core';
2 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
2 3
3 @Component({ 4 @Component({
4 selector: 'app-splash-screen', 5 selector: 'app-splash-screen',
5 templateUrl: './splash-screen.component.html', 6 templateUrl: './splash-screen.component.html',
6 styleUrls: ['./splash-screen.component.scss'] 7 styleUrls: ['./splash-screen.component.scss']
7 }) 8 })
8 export class SplashScreenComponent implements OnInit { 9 export class SplashScreenComponent implements OnInit {
9 timerSplashScreen = 2000; 10 timerSplashScreen = 2000;
10 showSplashScreen = true; 11 showSplashScreen = true;
11 textWelcome = 'BIENVENIDO A SPOT!'; 12 textWelcome = 'BIENVENIDO A SPOT!';
12 textComoEstas = '¿cómo estás?'; 13 textComoEstas = '¿cómo estás?';
13 textInvitamos = 'TE INVITAMOS A HACER'; 14 textInvitamos = 'TE INVITAMOS A HACER';
14 textTuPedido = 'tu pedido acá'; 15 textTuPedido = 'tu pedido acá';
15 16
16 constructor() {} 17 constructor(
18 private articuloService: ArticuloService,
19 ) { }
17 20
18 ngOnInit() { 21 ngOnInit() {
22 this.articuloService.cleanShoppingCar();
19 localStorage.clear(); 23 localStorage.clear();
20 setTimeout(() => { 24 setTimeout(() => {
21 this.showSplashScreen = false; 25 this.showSplashScreen = false;
22 }, this.timerSplashScreen); 26 }, this.timerSplashScreen);
23 $('body').removeClass('media-pantalla'); 27 $('body').removeClass('media-pantalla');
24 } 28 }
25 } 29 }
26 30
src/app/services/articulo/articulo.service.ts
Diff comments   View file @ 09fee67
1 import { Injectable } from '@angular/core'; 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http'; 2 import { HttpClient } from '@angular/common/http';
3 import { APP_SETTINGS } from '../../../etc/AppSettings'; 3 import { APP_SETTINGS } from '../../../etc/AppSettings';
4 import { IArticulo } from '../../interfaces/IArticulo'; 4 import { IArticulo } from '../../interfaces/IArticulo';
5 import { ClienteService } from '../cliente/cliente.service'; 5 import { ClienteService } from '../cliente/cliente.service';
6 import { Observable } from 'rxjs'; 6 import { Observable } from 'rxjs';
7 7
8 @Injectable() 8 @Injectable()
9 export class ArticuloService { 9 export class ArticuloService {
10 carrito: IArticulo[] = []; 10 carrito: IArticulo[] = [];
11 articuloAcargar: IArticulo; 11 articuloAcargar: IArticulo;
12 promoAcargar: IArticulo; 12 promoAcargar: IArticulo;
13 mostrar: string; 13 mostrar: string;
14 esPromoPersonalizada = false; 14 esPromoPersonalizada = false;
15 urlDeboSuite = APP_SETTINGS.apiDeboSuite; 15 urlDeboSuite = APP_SETTINGS.apiDeboSuite;
16 medioPago: number; 16 medioPago: number;
17 idComanda: number; 17 idComanda: number;
18 subTotal = 0; 18 total = 0;
19 maxCantidad = 50; 19 maxCantidad = 50;
20 20
21 constructor( 21 constructor(
22 private http: HttpClient, 22 private http: HttpClient,
23 private clienteService: ClienteService, 23 private clienteService: ClienteService,
24 ) { } 24 ) { }
25 25
26 getById(id) { 26 getById(id) {
27 return this.http.get(`${this.urlDeboSuite}/articulos/${id}`); 27 return this.http.get(`${this.urlDeboSuite}/articulos/${id}`);
28 } 28 }
29 29
30 getAll() { 30 getAll() {
31 return this.http.get(`${this.urlDeboSuite}/articulos/`); 31 return this.http.get(`${this.urlDeboSuite}/articulos/`);
32 } 32 }
33 33
34 getAllWithPaginator(page: number = 1) { 34 getAllWithPaginator(page: number = 1) {
35 return this.http.get(`${this.urlDeboSuite}/articulos/${page}`); 35 return this.http.get(`${this.urlDeboSuite}/articulos/${page}`);
36 } 36 }
37 37
38 substractCant(articulo: IArticulo) { 38 substractCant(articulo: IArticulo) {
39 if (articulo.cantidad === 1) return; 39 if (articulo.cantidad === 1) return;
40 articulo.cantidad--; 40 articulo.cantidad--;
41 this.calcularTotal(); 41 this.calcularTotal();
42 } 42 }
43 43
44 addCant(articulo: IArticulo) { 44 addCant(articulo: IArticulo) {
45 if (articulo.cantidad >= this.maxCantidad) return; 45 if (articulo.cantidad >= this.maxCantidad) return;
46 articulo.cantidad++; 46 articulo.cantidad++;
47 this.calcularTotal(); 47 this.calcularTotal();
48 } 48 }
49 49
50 calcularTotal() { 50 calcularTotal() {
51 this.subTotal = 0; 51 this.total = 0;
52 this.carrito.forEach(articulo => { 52 this.carrito.forEach(articulo => {
53 this.subTotal += (articulo.PreVen * articulo.cantidad); 53 this.total += (articulo.PreVen * articulo.cantidad);
54 }); 54 });
55 } 55 }
56 56
57 setArticulo(articulo: IArticulo) { 57 setArticulo(articulo: IArticulo) {
58 articulo.cantidad = 1; 58 articulo.cantidad = 1;
59 for (const articuloCarrito of this.carrito) { 59 for (const articuloCarrito of this.carrito) {
60 if (articuloCarrito.id === articulo.id && !articulo.productos) { 60 if (articuloCarrito.id === articulo.id && !articulo.productos) {
61 articuloCarrito.cantidad++; 61 articuloCarrito.cantidad++;
62 this.calcularTotal(); 62 this.calcularTotal();
63 return; 63 return;
64 } 64 }
65 } 65 }
66 this.setArticulosSinImagen([articulo]); 66 this.setArticulosSinImagen([articulo]);
67 this.carrito.unshift(articulo); 67 this.carrito.unshift(articulo);
68 this.calcularTotal(); 68 this.calcularTotal();
69 } 69 }
70 70
71 deleteArticulo(index: number) { 71 deleteArticulo(index: number) {
72 this.carrito.splice(index, 1); 72 this.carrito.splice(index, 1);
73 this.calcularTotal(); 73 this.calcularTotal();
74 } 74 }
75 75
76 pay(dataPago: any) { 76 pay(dataPago: any) {
77 return new Observable((observer) => { 77 return new Observable((observer) => {
78 this.clienteService.getById(-1) 78 this.clienteService.getById(-1)
79 .subscribe(cliente => { 79 .subscribe(cliente => {
80 this.markArticuloInPromoAsRemoved(); 80 this.markArticuloInPromoAsRemoved();
81 this.http.post(`${this.urlDeboSuite}/comprobante/guardar/${this.medioPago}`, { 81 this.http.post(`${this.urlDeboSuite}/comprobante/guardar/${this.medioPago}`, {
82 productos: this.carrito, 82 productos: this.carrito,
83 cliente, 83 cliente,
84 origen: 'autoservicio', 84 origen: 'autoservicio',
85 codigoVendedor: 5, 85 codigoVendedor: 5,
86 puntoVenta: APP_SETTINGS.puntoVenta, 86 puntoVenta: APP_SETTINGS.puntoVenta,
87 pedidoAnombreDe: dataPago.pedidoAnombreDe, 87 pedidoAnombreDe: dataPago.pedidoAnombreDe,
88 numeroPlanilla: APP_SETTINGS.numeroPlanilla, 88 numeroPlanilla: APP_SETTINGS.numeroPlanilla,
89 pedidoParaLlevar: localStorage.getItem('pedidoParaLlevar'), 89 pedidoParaLlevar: localStorage.getItem('pedidoParaLlevar'),
90 terminal: APP_SETTINGS.terminal 90 terminal: APP_SETTINGS.terminal
91 }) 91 })
92 .subscribe((data) => { 92 .subscribe((data) => {
93 observer.next(data); 93 observer.next(data);
94 observer.complete(); 94 observer.complete();
95 }, err => { 95 }, err => {
96 observer.error(err); 96 observer.error(err);
97 observer.complete(); 97 observer.complete();
98 }); 98 });
99 }); 99 });
100 }); 100 });
101 } 101 }
102 102
103 cleanShoppingCar() { 103 cleanShoppingCar() {
104 this.articuloAcargar = undefined; 104 this.articuloAcargar = undefined;
105 this.promoAcargar = undefined; 105 this.promoAcargar = undefined;
106 this.carrito = []; 106 this.carrito = [];
107 this.calcularTotal(); 107 this.calcularTotal();
108 } 108 }
109 109
110 setArticulosSinImagen(articulos: IArticulo[]) { 110 setArticulosSinImagen(articulos: IArticulo[]) {
111 articulos.forEach((articulo: IArticulo) => { 111 articulos.forEach((articulo: IArticulo) => {
112 articulo.imagenes = !articulo.imagenes ? [{ imagen: 'noImage.jpg' }] : 112 articulo.imagenes = !articulo.imagenes ? [{ imagen: 'noImage.jpg' }] :
113 !articulo.imagenes.length ? [{ imagen: 'noImage.jpg' }] : articulo.imagenes; 113 !articulo.imagenes.length ? [{ imagen: 'noImage.jpg' }] : articulo.imagenes;
114 }); 114 });
115 } 115 }
116 116
117 markArticuloInPromoAsRemoved() { 117 markArticuloInPromoAsRemoved() {
118 this.carrito.forEach((articuloCarrito: IArticulo) => { 118 this.carrito.forEach((articuloCarrito: IArticulo) => {
119 if (articuloCarrito.PRO) { 119 if (articuloCarrito.PRO) {
120 articuloCarrito.productos.forEach((articulo: IArticulo) => { 120 articuloCarrito.productos.forEach((articulo: IArticulo) => {
121 if (articulo.cantidadAdicionada === 0) { 121 if (articulo.cantidadAdicionada === 0) {
122 articulo.cantidad = 0; 122 articulo.cantidad = 0;
123 articulo.importeValorExtra = 0; 123 articulo.importeValorExtra = 0;
124 } 124 }
125 }); 125 });
126 } 126 }
127 }); 127 });
128 } 128 }
129
130 changeArticulo(articuloToChange: IArticulo, articuloData: any) {
131 articuloToChange.CODA = articuloData.CodArt;
132 articuloToChange.CodArt = articuloData.CodArt;
133 articuloToChange.SECA = articuloData.CodSec;
134 articuloToChange.CodSec = articuloData.CodSec;
135 articuloToChange.PreVen = articuloData.PreVen;
136 articuloToChange.id = articuloData.id;
137 articuloToChange.DET_LAR = articuloData.DET_LAR;
138 articuloToChange.DetArt = articuloData.DetArt;
139 articuloToChange.MKT_DESC = articuloData.MKT_DESC;
140 }
129 } 141 }
130 142
src/app/shared/header-publicidad/header-publicidad.component.ts
Diff comments   View file @ 09fee67
1 import { Component, OnInit, TemplateRef } from '@angular/core'; 1 import { Component, OnInit, TemplateRef } from '@angular/core';
2 import { APP_SETTINGS } from 'src/etc/AppSettings'; 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 import { IPublicidad } from 'src/app/interfaces/IPublicidad'; 3 import { IPublicidad } from 'src/app/interfaces/IPublicidad';
4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service'; 4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service';
5 import { IArticulo } from 'src/app/interfaces/IArticulo'; 5 import { IArticulo } from 'src/app/interfaces/IArticulo';
6 import { PromocionComponent } from '../promocion/promocion.component'; 6 import { PromocionComponent } from '../promocion/promocion.component';
7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal'; 7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
8 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 8 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
9 import { ConfirmacionComponent } from '../confirmacion/confirmacion.component'; 9 import { ConfirmacionComponent } from '../confirmacion/confirmacion.component';
10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 10 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
11 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 11 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
12 import { SinonimoComponent } from '../sinonimo/sinonimo.component'; 12 import { SinonimoComponent } from '../sinonimo/sinonimo.component';
13 import * as _ from 'lodash'; 13 import * as _ from 'lodash';
14 14
15 @Component({ 15 @Component({
16 selector: 'app-header-publicidad', 16 selector: 'app-header-publicidad',
17 templateUrl: './header-publicidad.component.html', 17 templateUrl: './header-publicidad.component.html',
18 styleUrls: ['./header-publicidad.component.scss'] 18 styleUrls: ['./header-publicidad.component.scss']
19 }) 19 })
20 export class HeaderPublicidadComponent implements OnInit { 20 export class HeaderPublicidadComponent implements OnInit {
21 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`; 21 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
22 publicidades: IPublicidad[] = []; 22 publicidades: IPublicidad[] = [];
23 modalRef: BsModalRef; 23 modalRef: BsModalRef;
24 modalSinonimo: BsModalRef; 24 modalSinonimo: BsModalRef;
25 25
26 constructor( 26 constructor(
27 private publicidadService: PublicidadService, 27 private publicidadService: PublicidadService,
28 private articuloService: ArticuloService, 28 private articuloService: ArticuloService,
29 private modalService: BsModalService, 29 private modalService: BsModalService,
30 private sinonimoService: SinonimoService 30 private sinonimoService: SinonimoService
31 ) { } 31 ) { }
32 32
33 ngOnInit() { 33 ngOnInit() {
34 this.getPublicidades(); 34 this.getPublicidades();
35 this.mediaPantalla(); 35 this.mediaPantalla();
36 } 36 }
37 37
38 getPublicidades() { 38 getPublicidades() {
39 this.publicidadService.getAll() 39 this.publicidadService.getAll()
40 .subscribe((res: IPublicidad[]) => { 40 .subscribe((res: IPublicidad[]) => {
41 this.publicidades = res; 41 this.publicidades = res;
42 }, err => console.error(err)); 42 }, err => console.error(err));
43 } 43 }
44 44
45 elegirArticulo(publicidad: IPublicidad) { 45 elegirArticulo(publicidad: IPublicidad) {
46 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo); 46 if (publicidad.id_articulo) this.getByID(publicidad.id_articulo);
47 } 47 }
48 48
49 getByID(id: number) { 49 getByID(id: number) {
50 this.articuloService.getById(id) 50 this.articuloService.getById(id)
51 .subscribe((res: IArticulo) => { 51 .subscribe((res: IArticulo) => {
52 if (res.FPP) { 52 if (res.FPP) {
53 this.openModalPromos(res); 53 this.openModalPromos(res);
54 return; 54 return;
55 } else { 55 } else {
56 this.openModalConfirmacion(res); 56 this.openModalConfirmacion(res);
57 return; 57 return;
58 } 58 }
59 }, err => console.error(err)); 59 }, err => console.error(err));
60 } 60 }
61 61
62 openModalPromos(articulo: IArticulo) { 62 openModalPromos(articulo: IArticulo) {
63 if (this.modalRef) return; 63 if (this.modalRef) return;
64 this.modalRef = this.modalService.show(PromocionComponent, 64 this.modalRef = this.modalService.show(PromocionComponent,
65 { 65 {
66 initialState: { 66 initialState: {
67 idArticulo: articulo.id 67 idArticulo: articulo.id
68 }, 68 },
69 class: 'modal-dialog-centered' 69 class: 'modal-dialog-centered'
70 }); 70 });
71 } 71 }
72 72
73 openModalConfirmacion(articulo: IArticulo) { 73 openModalConfirmacion(articulo: IArticulo) {
74 if (this.modalRef) return; 74 if (this.modalRef) return;
75 this.articuloService.setArticulosSinImagen([articulo]); 75 this.articuloService.setArticulosSinImagen([articulo]);
76 this.modalRef = this.modalService.show(ConfirmacionComponent, 76 this.modalRef = this.modalService.show(ConfirmacionComponent,
77 { 77 {
78 initialState: { 78 initialState: {
79 titleMessage: articulo.DET_LAR, 79 titleMessage: articulo.DET_LAR,
80 imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : 'assets/img/imagen-no-encontrada.jpg', 80 imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : 'assets/img/imagen-no-encontrada.jpg',
81 footerMessageFirst: `¿QUERÉS AGREGAR ESTE COMBO`, 81 footerMessageFirst: `¿QUERÉS AGREGAR ESTE COMBO`,
82 footerMessageSecond: `a tu carrito?`, 82 footerMessageSecond: `a tu carrito?`,
83 footerConfirmation: articulo.PreVen 83 footerConfirmation: articulo.PreVen
84 }, 84 },
85 ignoreBackdropClick: true, 85 ignoreBackdropClick: true,
86 class: 'modal-dialog-centered' 86 class: 'modal-dialog-centered'
87 }); 87 });
88 this.modalRef.content.onClose.subscribe((resClose) => { 88 this.modalRef.content.onClose.subscribe((resClose) => {
89 this.modalRef = null; 89 this.modalRef = null;
90 if (!resClose) return; 90 if (!resClose) return;
91 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt) 91 this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
92 .subscribe((res: ISinonimo[]) => { 92 .subscribe((res: ISinonimo[]) => {
93 if (res.length) { 93 if (res.length) {
94 const sinonimos = []; 94 const sinonimos = [];
95 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 95 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
96 Object.keys(gruposArticulos).forEach(key => { 96 Object.keys(gruposArticulos).forEach(key => {
97 sinonimos.push({ productos: gruposArticulos[key] }); 97 sinonimos.push({ productos: gruposArticulos[key] });
98 }); 98 });
99 res = sinonimos; 99 res = sinonimos;
100 this.openModalSinonimos(res, articulo); 100 this.openModalSinonimos(res, articulo);
101 } else { 101 } else {
102 articulo.cantidad = 1; 102 articulo.cantidad = 1;
103 this.articuloService.setArticulo(articulo); 103 this.articuloService.setArticulo(articulo);
104 } 104 }
105 }, err => console.error(err)); 105 }, err => console.error(err));
106 }); 106 });
107 this.mediaPantalla(); 107 this.mediaPantalla();
108 } 108 }
109 109
110 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 110 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
111 if (this.modalSinonimo) return; 111 if (this.modalSinonimo) return;
112 this.modalSinonimo = this.modalService.show(SinonimoComponent, { 112 this.modalSinonimo = this.modalService.show(SinonimoComponent, {
113 initialState: { 113 initialState: {
114 sinonimos: sinonimosData, 114 sinonimos: sinonimosData,
115 articulo 115 articulo
116 }, 116 },
117 class: 'modal-dialog-centered' 117 class: 'modal-dialog-centered'
118 }); 118 });
119 this.modalSinonimo.content.onClose 119 this.modalSinonimo.content.onClose
120 .subscribe((res: any) => { 120 .subscribe((res: any) => {
121 for (const a of articulo.productos) { 121 for (const a of articulo.productos) {
122 for (const aRes of res.articulos) { 122 for (const aRes of res.articulos) {
123 if (a.idSinonimo === aRes.ID_SIN) { 123 if (a.idSinonimo === aRes.ID_SIN) {
124 a.CODA = aRes.CodArt; 124 this.articuloService.changeArticulo(a, aRes);
125 a.CodArt = aRes.CodArt;
126 a.SECA = aRes.CodSec;
127 aRes.CodSec = aRes.CodSec;
128 a.PreVen = aRes.PreVen;
129 a.id = aRes.id;
130 a.DET_LAR = aRes.DET_LAR;
131 a.DetArt = aRes.DetArt;
132 } 125 }
133 } 126 }
134 } 127 }
135 this.articuloService.setArticulo(articulo); 128 this.articuloService.setArticulo(articulo);
136 }); 129 });
137 } 130 }
138 131
139 mediaPantalla() { 132 mediaPantalla() {
140 if ($('body').hasClass('media-pantalla')) { 133 if ($('body').hasClass('media-pantalla')) {
141 $('#headerPublicidad,#headerPad').addClass('media-pantalla'); 134 $('#headerPublicidad,#headerPad').addClass('media-pantalla');
142 } 135 }
143 } 136 }
144 } 137 }
145 138
src/app/shared/promocion/promocion.component.ts
Diff comments   View file @ 09fee67
1 import { Component, OnInit, HostListener } from '@angular/core'; 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal'; 2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 import { IArticulo } from 'src/app/interfaces/IArticulo'; 3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 import { ArticuloService } from 'src/app/services/articulo/articulo.service'; 4 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
5 import { PromocionService } from 'src/app/services/promocion/promocion.service'; 5 import { PromocionService } from 'src/app/services/promocion/promocion.service';
6 import { Subject } from 'rxjs'; 6 import { Subject } from 'rxjs';
7 import { APP_SETTINGS } from 'src/etc/AppSettings'; 7 import { APP_SETTINGS } from 'src/etc/AppSettings';
8 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service'; 8 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
9 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service'; 9 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
10 import { ISinonimo } from 'src/app/interfaces/ISinonimo'; 10 import { ISinonimo } from 'src/app/interfaces/ISinonimo';
11 import { SinonimoComponent } from '../sinonimo/sinonimo.component'; 11 import { SinonimoComponent } from '../sinonimo/sinonimo.component';
12 import * as _ from 'lodash'; 12 import * as _ from 'lodash';
13 13
14 @Component({ 14 @Component({
15 selector: 'app-promocion', 15 selector: 'app-promocion',
16 templateUrl: './promocion.component.html', 16 templateUrl: './promocion.component.html',
17 styleUrls: ['./promocion.component.scss'] 17 styleUrls: ['./promocion.component.scss']
18 }) 18 })
19 export class PromocionComponent implements OnInit { 19 export class PromocionComponent implements OnInit {
20 articulosPromo: IArticulo[] = []; 20 articulosPromo: IArticulo[] = [];
21 promociones: IArticulo[] = []; 21 promociones: IArticulo[] = [];
22 onClose: Subject<any>; 22 onClose: Subject<any>;
23 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`; 23 urlImagenes = `${APP_SETTINGS.apiImagenes}/imagenes/`;
24 loading = true; 24 loading = true;
25 modalSinonimo: BsModalRef; 25 modalSinonimo: BsModalRef;
26 isPromoSelected = false; 26 isPromoSelected = false;
27 27
28 constructor( 28 constructor(
29 private modalPromocion: BsModalRef, 29 private modalPromocion: BsModalRef,
30 private modalService: BsModalService, 30 private modalService: BsModalService,
31 private articuloService: ArticuloService, 31 private articuloService: ArticuloService,
32 private promocionService: PromocionService, 32 private promocionService: PromocionService,
33 private sinonimoService: SinonimoService, 33 private sinonimoService: SinonimoService,
34 private inactiveScreen: InactiveScreenService, 34 private inactiveScreen: InactiveScreenService,
35 ) { 35 ) {
36 this.onClose = new Subject(); 36 this.onClose = new Subject();
37 } 37 }
38 38
39 ngOnInit() { 39 ngOnInit() {
40 this.getPromociones(); 40 this.getPromociones();
41 } 41 }
42 42
43 selectPromo(promo: IArticulo) { 43 selectPromo(promo: IArticulo) {
44 if (this.isPromoSelected) return; 44 if (this.isPromoSelected) return;
45 this.isPromoSelected = true; 45 this.isPromoSelected = true;
46 this.sinonimoService.getSinonimos(promo.CodSec, promo.CodArt) 46 this.sinonimoService.getSinonimos(promo.CodSec, promo.CodArt)
47 .subscribe((res: ISinonimo[]) => { 47 .subscribe((res: ISinonimo[]) => {
48 if (res.length) { 48 if (res.length) {
49 const sinonimos = []; 49 const sinonimos = [];
50 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN'); 50 const gruposArticulos = _.groupBy(res[0].productos, 'ID_SIN');
51 Object.keys(gruposArticulos).forEach(key => { 51 Object.keys(gruposArticulos).forEach(key => {
52 sinonimos.push({ productos: gruposArticulos[key] }); 52 sinonimos.push({ productos: gruposArticulos[key] });
53 }); 53 });
54 res = sinonimos; 54 res = sinonimos;
55 this.openModalSinonimos(res, promo); 55 this.openModalSinonimos(res, promo);
56 } else { 56 } else {
57 promo.cantidad = 1; 57 promo.cantidad = 1;
58 this.articuloService.setArticulo(promo); 58 this.articuloService.setArticulo(promo);
59 this.onClose.next(); 59 this.onClose.next();
60 this.modalPromocion.hide(); 60 this.modalPromocion.hide();
61 } 61 }
62 }, err => console.error(err)); 62 }, err => console.error(err));
63 this.mediaPantalla(); 63 this.mediaPantalla();
64 } 64 }
65 65
66 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) { 66 openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
67 if (this.modalSinonimo) return; 67 if (this.modalSinonimo) return;
68 this.modalSinonimo = this.modalService.show(SinonimoComponent, { 68 this.modalSinonimo = this.modalService.show(SinonimoComponent, {
69 initialState: { 69 initialState: {
70 sinonimos: sinonimosData, 70 sinonimos: sinonimosData,
71 articulo 71 articulo
72 }, 72 },
73 class: 'modal-dialog-centered', 73 class: 'modal-dialog-centered',
74 ignoreBackdropClick: true, 74 ignoreBackdropClick: true,
75 }); 75 });
76 76
77 this.modalSinonimo.content.onClose 77 this.modalSinonimo.content.onClose
78 .subscribe((res: any) => { 78 .subscribe((res: any) => {
79 this.modalSinonimo = null; 79 this.modalSinonimo = null;
80 if (!res) { 80 if (!res) {
81 this.onClose.next(); 81 this.onClose.next();
82 this.modalPromocion.hide(); 82 this.modalPromocion.hide();
83 return; 83 return;
84 } 84 }
85 for (const a of articulo.productos) { 85 for (const a of articulo.productos) {
86 for (const aRes of res.articulos) { 86 for (const aRes of res.articulos) {
87 if (a.idSinonimo === aRes.ID_SIN) { 87 if (a.idSinonimo === aRes.ID_SIN) {
88 a.CODA = aRes.CodArt; 88 this.articuloService.changeArticulo(a, aRes);
89 a.CodArt = aRes.CodArt;
90 a.SECA = aRes.CodSec;
91 aRes.CodSec = aRes.CodSec;
92 a.PreVen = aRes.PreVen;
93 a.id = aRes.id;
94 a.DET_LAR = aRes.DET_LAR;
95 a.DetArt = aRes.DetArt;
96 } 89 }
97 } 90 }
98 } 91 }
99 this.articuloService.setArticulo(articulo); 92 this.articuloService.setArticulo(articulo);
100 this.onClose.next(); 93 this.onClose.next();
101 this.modalPromocion.hide(); 94 this.modalPromocion.hide();
102 }); 95 });
103 } 96 }
104 97
105 getPromociones() { 98 getPromociones() {
106 const sector = this.articulosPromo[0].CodSec; 99 const sector = this.articulosPromo[0].CodSec;
107 const codigo = this.articulosPromo[0].CodArt; 100 const codigo = this.articulosPromo[0].CodArt;
108 this.promocionService.getPromociones(sector, codigo) 101 this.promocionService.getPromociones(sector, codigo)
109 .subscribe((res: IArticulo[]) => { 102 .subscribe((res: IArticulo[]) => {
110 this.promociones = res; 103 this.promociones = res;
111 this.loading = false; 104 this.loading = false;
112 }, error => { console.error(error); }); 105 }, error => { console.error(error); });
113 } 106 }
114 107
115 @HostListener('document:click', ['$event']) 108 @HostListener('document:click', ['$event'])
116 eventListener(event: Event) { 109 eventListener(event: Event) {
117 clearTimeout(this.inactiveScreen.timerReposo); 110 clearTimeout(this.inactiveScreen.timerReposo);
118 this.inactiveScreen.startTimeOutInactividad(); 111 this.inactiveScreen.startTimeOutInactividad();
119 } 112 }
120 113
121 @HostListener('scroll', ['$event']) 114 @HostListener('scroll', ['$event'])
122 scrollEvent(event: Event) { 115 scrollEvent(event: Event) {
123 clearTimeout(this.inactiveScreen.timerReposo); 116 clearTimeout(this.inactiveScreen.timerReposo);
124 this.inactiveScreen.startTimeOutInactividad(); 117 this.inactiveScreen.startTimeOutInactividad();
125 } 118 }
126 119
127 mediaPantalla() { 120 mediaPantalla() {
128 if ($('body').hasClass('media-pantalla')) { 121 if ($('body').hasClass('media-pantalla')) {
129 $('.modal-content').addClass('media-pantalla'); 122 $('.modal-content').addClass('media-pantalla');
130 } 123 }
131 } 124 }
132 } 125 }
133 126
src/app/shared/sinonimo/sinonimo.component.ts
Diff comments   View file @ 09fee67
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 isSinonimoSelected = false; 20 isSinonimoSelected = false;
21 21
22 constructor( 22 constructor(
23 private modalRef: BsModalRef, 23 private modalRef: BsModalRef,
24 private articuloService: ArticuloService, 24 private articuloService: ArticuloService,
25 ) { 25 ) {
26 this.onClose = new Subject(); 26 this.onClose = new Subject();
27 this.articulosSelected.length = this.sinonimos.length; 27 this.articulosSelected.length = this.sinonimos.length;
28 } 28 }
29 29
30 ngOnInit() { } 30 ngOnInit() { }
31 31
32 selectSinonimo(index: number, articulo: IArticulo) { 32 selectSinonimo(index: number, articulo: IArticulo) {
33 for (const a of this.sinonimos[index].productos) { 33 for (const a of this.sinonimos[index].productos) {
34 a.seleccionado = false; 34 a.seleccionado = false;
35 } 35 }
36 articulo.seleccionado = true; 36 articulo.seleccionado = true;
37 this.articulosSelected[index] = articulo; 37 this.articulosSelected[index] = articulo;
38 } 38 }
39 39
40 validate() { 40 validate() {
41 this.isValid = true; 41 this.isValid = true;
42 for (const s of this.sinonimos) { 42 for (const s of this.sinonimos) {
43 for (const a of s.productos) { 43 for (const a of s.productos) {
44 this.isValid = (!a.seleccionado) ? false : true; 44 this.isValid = (!a.seleccionado) ? false : true;
45 if (this.isValid) break; 45 if (this.isValid) break;
46 } 46 }
47 if (!this.isValid) break; 47 if (!this.isValid) break;
48 } 48 }
49 return !this.isValid ? 'disabled' : 'btn-effect'; 49 return !this.isValid ? 'disabled' : 'btn-effect';
50 } 50 }
51 51
52 continue() { 52 continue() {
53 if (!this.isValid) return; 53 if (!this.isValid) return;
54 if (this.isSinonimoSelected) return; 54 if (this.isSinonimoSelected) return;
55 this.isSinonimoSelected = true; 55 this.isSinonimoSelected = true;
56 const ID_SINS = []; 56 const ID_SINS = [];
57 const observables = []; 57 const observables = [];
58 58
59 for (const articulo of this.articulosSelected) { 59 for (const articulo of this.articulosSelected) {
60 ID_SINS.push(articulo.ID_SIN); 60 ID_SINS.push(articulo.ID_SIN);
61 }
62
63 for (const articulo of this.articulosSelected) {
64 observables.push(this.articuloService.getById(articulo.id)); 61 observables.push(this.articuloService.getById(articulo.id));
65 } 62 }
66 63
67 forkJoin(observables) 64 forkJoin(observables)
68 .subscribe((res: IArticulo[]) => { 65 .subscribe((res: IArticulo[]) => {
69 for (const articulo of res) { 66 res.forEach((articulo, i) => {
70 for (const ID_SIN of ID_SINS) { 67 articulo.ID_SIN = ID_SINS[i];
71 articulo.ID_SIN = ID_SIN; 68 });
72 }
73 }
74 this.modalRef.hide(); 69 this.modalRef.hide();
75 this.onClose.next({ 70 this.onClose.next({
76 articulos: res, 71 articulos: res,
77 }); 72 });
78 }, err => console.error(err)); 73 }, err => console.error(err));
79 } 74 }
80 75
81 scrollTo(index: number) { 76 scrollTo(index: number) {
82 const el = document.getElementById(index.toString()); 77 const el = document.getElementById(index.toString());
83 el.scrollIntoView({ behavior: 'smooth' }); 78 el.scrollIntoView({ behavior: 'smooth' });
84 } 79 }
85 80
86 close() { 81 close() {
87 this.modalRef.hide(); 82 this.modalRef.hide();
88 this.onClose.next(); 83 this.onClose.next();
89 } 84 }
90 85
91 } 86 }
92 87