Marcelo Puebla / autoservicio-axion

Download as
Browse Code »

Commit 4d9b01ed2063e3f464368b8fbb7ce9b4309f16bc

Authored by Benjamin Rodriguez
1 parent 08c32ce4d8
Exists in develop

cambio que se muestre MKT_DES cuando exista y saco diferenciacion de visualizaci… 

…on cuando el producto es promo
Showing 1 changed file with 2 additions and 4 deletions   Show diff stats
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ 4d9b01e
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 h-80 align-items-end"> 5 <div class="row mx-0 h-80 align-items-end">
6 <!-- CABECERA --> 6 <!-- CABECERA -->
7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm"> 7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 p-2 align-self-center"> 8 <div class="col-12 p-2 align-self-center">
9 <div class="px-3"> 9 <div class="px-3">
10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p> 10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p>
11 </div> 11 </div>
12 </div> 12 </div>
13 </div> 13 </div>
14 <!-- CUERPO --> 14 <!-- CUERPO -->
15 <div class="row w-100 mr-4 h-50 h-md-70" id="content"> 15 <div class="row w-100 mr-4 h-50 h-md-70" id="content">
16 <div class="col-12 h-100 px-0 py-3"> 16 <div class="col-12 h-100 px-0 py-3">
17 <div class="row mx-0 h-100"> 17 <div class="row mx-0 h-100">
18 <app-filtro-categorias 18 <app-filtro-categorias
19 class="col-5 col-sm-3 col-xl-2 h-100" 19 class="col-5 col-sm-3 col-xl-2 h-100"
20 #filtroCategorias 20 #filtroCategorias
21 (getProductos)="getProductos()" 21 (getProductos)="getProductos()"
22 (setProductos)="setProductos()" 22 (setProductos)="setProductos()"
23 (filterItems)="filterItems()"> 23 (filterItems)="filterItems()">
24 </app-filtro-categorias> 24 </app-filtro-categorias>
25 <!-- LISTA DE ARTICULOS --> 25 <!-- LISTA DE ARTICULOS -->
26 <div 26 <div
27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible" 27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible"
28 (scroll)="scrollEvent($event)"> 28 (scroll)="scrollEvent($event)">
29 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6"> 29 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6">
30 <!-- ARTICULO --> 30 <!-- ARTICULO -->
31 <div 31 <div
32 class="col px-2 my-1 my-md-3 h-auto" 32 class="col px-2 my-1 my-md-3 h-auto"
33 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;"> 33 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
34 <div 34 <div
35 class="swing-in-top-fwd btn-effect card h-auto" 35 class="swing-in-top-fwd btn-effect card h-auto"
36 (click)="selectArticulo(articulo)"> 36 (click)="selectArticulo(articulo)">
37 <img 37 <img
38 draggable="false" 38 draggable="false"
39 ondragstart="return false;" 39 ondragstart="return false;"
40 (contextmenu)="false" 40 (contextmenu)="false"
41 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 41 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
42 onerror="this.src='assets/img/image-not-found.jpg'" 42 onerror="this.src='assets/img/image-not-found.jpg'"
43 class="card-img-top h-30 h-md-55 rounded-sm"> 43 class="card-img-top h-30 h-md-55 rounded-sm">
44 <div class="row mx-0 py-1 h-auto justify-content-center"> 44 <div class="row mx-0 py-1 h-auto justify-content-center">
45 <p 45 <p
46 [ngClass]="{'text-primary': articulo.PRO, 'text-secondary': !articulo.PRO}" 46 [ngClass]="{'text-primary': articulo.PRO, 'text-secondary': !articulo.PRO}"
47 class="col-12 px-1 h6 h-auto text-center min-h-60"> 47 class="col-12 px-1 h6 h-auto text-center min-h-60">
48 {{articulo.DetArt.toUpperCase()}} 48 {{ articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}
49 </p> 49 </p>
50 <div class="col-12 px-1 align-self-end h-auto"> 50 <div class="col-12 px-1 align-self-end h-auto">
51 <div 51 <div class="row mx-0 justify-content-between bg-primary badge-pill">
52 [ngClass]="{'bg-primary': articulo.PRO, 'bg-secondary': !articulo.PRO}"
53 class="row mx-0 justify-content-between badge-pill">
54 <div class="col px-0 align-self-center text-white text-right"> 52 <div class="col px-0 align-self-center text-white text-right">
55 {{articulo.PreVen | currency}} 53 {{articulo.PreVen | currency}}
56 </div> 54 </div>
57 <div class="col-5 px-0"> 55 <div class="col-5 px-0">
58 <img 56 <img
59 draggable="false" 57 draggable="false"
60 ondragstart="return false;" 58 ondragstart="return false;"
61 (contextmenu)="false" 59 (contextmenu)="false"
62 class="d-block ml-auto py-1 icon-30" 60 class="d-block ml-auto py-1 icon-30"
63 src="assets/img/ir.svg"> 61 src="assets/img/ir.svg">
64 </div> 62 </div>
65 </div> 63 </div>
66 </div> 64 </div>
67 </div> 65 </div>
68 </div> 66 </div>
69 </div> 67 </div>
70 </div> 68 </div>
71 <!-- BOTON VER MAS --> 69 <!-- BOTON VER MAS -->
72 <div class="row mx-0"> 70 <div class="row mx-0">
73 <div 71 <div
74 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length" 72 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length"
75 class="col-12 px-0 mb-2"> 73 class="col-12 px-0 mb-2">
76 <button 74 <button
77 (click)="increaseShow()" 75 (click)="increaseShow()"
78 class="btn btn-block btn-outline-primary"> 76 class="btn btn-block btn-outline-primary">
79 Ver Más 77 Ver Más
80 </button> 78 </button>
81 </div> 79 </div>
82 </div> 80 </div>
83 </div> 81 </div>
84 </div> 82 </div>
85 </div> 83 </div>
86 </div> 84 </div>
87 <!-- FOOTER CARRITO DE COMPRAS --> 85 <!-- FOOTER CARRITO DE COMPRAS -->
88 <div class="row w-90 mx-auto h-auto justify-content-center"> 86 <div class="row w-90 mx-auto h-auto justify-content-center">
89 <div class="h-75 px-0 border border-primary rounded" #boxCarrito 87 <div class="h-75 px-0 border border-primary rounded" #boxCarrito
90 [ngClass]="boxCarrito.classList.contains('media-pantalla') 88 [ngClass]="boxCarrito.classList.contains('media-pantalla')
91 ? 'col-8' : 'col-12'" id="boxCarrito"> 89 ? 'col-8' : 'col-12'" id="boxCarrito">
92 <!-- CABECERA --> 90 <!-- CABECERA -->
93 <div class="row mx-0 h-15 border-bottom border-primary"> 91 <div class="row mx-0 h-15 border-bottom border-primary">
94 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p> 92 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p>
95 </div> 93 </div>
96 <!-- CUERPO --> 94 <!-- CUERPO -->
97 <div class="row h-85 mx-0 justify-content-around"> 95 <div class="row h-85 mx-0 justify-content-around">
98 <!-- BOTON SCROLL IZQUIERDA --> 96 <!-- BOTON SCROLL IZQUIERDA -->
99 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 97 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
100 <img 98 <img
101 draggable="false" 99 draggable="false"
102 ondragstart="return false;" 100 ondragstart="return false;"
103 (contextmenu)="false" 101 (contextmenu)="false"
104 class="icon-30 rotate-180-neg" 102 class="icon-30 rotate-180-neg"
105 src="assets/img/ir-fondo-color.svg" 103 src="assets/img/ir-fondo-color.svg"
106 (mousedown)="scrollX(templateCarrito, -100)" 104 (mousedown)="scrollX(templateCarrito, -100)"
107 (mouseup)="mouseup()" 105 (mouseup)="mouseup()"
108 (mouseleave)="mouseup()"> 106 (mouseleave)="mouseup()">
109 </div> 107 </div>
110 <!-- CARRITO --> 108 <!-- CARRITO -->
111 <div class="col-6 col-sm-8 col-lg-10 h-100"> 109 <div class="col-6 col-sm-8 col-lg-10 h-100">
112 <div 110 <div
113 #templateCarrito 111 #templateCarrito
114 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x" 112 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"
115 (scroll)="scrollEvent($event)"> 113 (scroll)="scrollEvent($event)">
116 <!-- ARTICULOS --> 114 <!-- ARTICULOS -->
117 <div 115 <div
118 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary" 116 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
119 *ngFor="let articulo of articuloService.carrito; let i = index;" 117 *ngFor="let articulo of articuloService.carrito; let i = index;"
120 @EnterLeave> 118 @EnterLeave>
121 <img 119 <img
122 class="btn-effect icon-20 mr-2 position-absolute right-0" 120 class="btn-effect icon-20 mr-2 position-absolute right-0"
123 src="assets/img/icono-cancelar-color.svg" 121 src="assets/img/icono-cancelar-color.svg"
124 (click)="deleteArticulo(i)"> 122 (click)="deleteArticulo(i)">
125 <img 123 <img
126 draggable="false" 124 draggable="false"
127 ondragstart="return false;" 125 ondragstart="return false;"
128 (contextmenu)="false" 126 (contextmenu)="false"
129 class="d-block img-fluid p-2 mx-auto rounded" 127 class="d-block img-fluid p-2 mx-auto rounded"
130 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 128 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
131 onerror="this.src='assets/img/image-not-found.jpg'"> 129 onerror="this.src='assets/img/image-not-found.jpg'">
132 <p class="d-block mt-auto text-center text-primary text-truncate"> 130 <p class="d-block mt-auto text-center text-primary text-truncate">
133 <small>{{articulo.DetArt}}</small> 131 <small>{{articulo.DetArt}}</small>
134 </p> 132 </p>
135 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 133 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
136 </div> 134 </div>
137 <!-- MENSAJE DE ADVERTENCIA --> 135 <!-- MENSAJE DE ADVERTENCIA -->
138 <div *ngIf="!articuloService.carrito.length" class="col h-100"> 136 <div *ngIf="!articuloService.carrito.length" class="col h-100">
139 <p class="text-center py-5">No hay articulos en el carrito</p> 137 <p class="text-center py-5">No hay articulos en el carrito</p>
140 </div> 138 </div>
141 </div> 139 </div>
142 </div> 140 </div>
143 <!-- BOTON SCROLL DERECHA --> 141 <!-- BOTON SCROLL DERECHA -->
144 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 142 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
145 <img 143 <img
146 draggable="false" 144 draggable="false"
147 ondragstart="return false;" 145 ondragstart="return false;"
148 (contextmenu)="false" 146 (contextmenu)="false"
149 class="icon-30" 147 class="icon-30"
150 src="assets/img/ir-fondo-color.svg" 148 src="assets/img/ir-fondo-color.svg"
151 (mousedown)="scrollX(templateCarrito, 100)" 149 (mousedown)="scrollX(templateCarrito, 100)"
152 (mouseup)="mouseup()" 150 (mouseup)="mouseup()"
153 (mouseleave)="mouseup()"> 151 (mouseleave)="mouseup()">
154 </div> 152 </div>
155 </div> 153 </div>
156 </div> 154 </div>
157 <!-- TOTAL--> 155 <!-- TOTAL-->
158 <div 156 <div
159 class="col-auto mt-2 ml-auto h-20"> 157 class="col-auto mt-2 ml-auto h-20">
160 <div class="row mx-0"> 158 <div class="row mx-0">
161 <div class="col-auto align-self-center text-primary">TOTAL</div> 159 <div class="col-auto align-self-center text-primary">TOTAL</div>
162 <div class="col-auto bg-primary badge-pill"> 160 <div class="col-auto bg-primary badge-pill">
163 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p> 161 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p>
164 </div> 162 </div>
165 </div> 163 </div>
166 </div> 164 </div>
167 165
168 <!-- VER CARRITO --> 166 <!-- VER CARRITO -->
169 <div 167 <div
170 class="col-auto px-0 mt-2 h-20" 168 class="col-auto px-0 mt-2 h-20"
171 *ngIf="articuloService.carrito.length" 169 *ngIf="articuloService.carrito.length"
172 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}"> 170 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}">
173 <div 171 <div
174 class="btn-effect col-auto px-0 align-self-center bg-white" 172 class="btn-effect col-auto px-0 align-self-center bg-white"
175 [routerLink]="['/carrito']"> 173 [routerLink]="['/carrito']">
176 <div class="row mx-0 bg-light"> 174 <div class="row mx-0 bg-light">
177 <div class="col-auto p-0 bg-primary"> 175 <div class="col-auto p-0 bg-primary">
178 <img 176 <img
179 draggable="false" 177 draggable="false"
180 ondragstart="return false;" 178 ondragstart="return false;"
181 (contextmenu)="false" 179 (contextmenu)="false"
182 class="p-2 icon-40" 180 class="p-2 icon-40"
183 src="assets/img/carrito.svg"> 181 src="assets/img/carrito.svg">
184 </div> 182 </div>
185 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div> 183 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div>
186 </div> 184 </div>
187 </div> 185 </div>
188 </div> 186 </div>
189 187
190 </div> 188 </div>
191 </div> 189 </div>
192 190
193 </div> 191 </div>
194 192