Commit 57d67af9e78a046355ddd2c561bff4abad09dfdc

Authored by Eric Fernandez
Exists in master and in 1 other branch validar_pve

Merge branch 'master' into 'master'

Master(mpuebla)

See merge request !32
src/app/components/busqueda-productos/busqueda-productos.component.html
... ... @@ -61,7 +61,7 @@
61 61 <div
62 62 class="card-effect bg-white rounded-sm shadow border-0"
63 63 (click)="mostrarBotonCargar(producto)">
64   - <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto">
  64 + <img src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto">
65 65 <div class="p-2">
66 66 <p class="h6 text-left m-0">{{producto.DetArt}}</p>
67 67 <div class="row justify-content-between m-0">
src/app/components/cancelar-compra/cancelar-compra.component.html
... ... @@ -16,7 +16,7 @@
16 16 </div>
17 17  
18 18 <!-- INFO -->
19   - <div class="row m-0 w-100">
  19 + <div class="row h-75 py-5 m-0 w-100">
20 20 <div class="col-4 offset-2">
21 21 <div class="row h-100">
22 22 <div class="col-12 py-4">
src/app/components/home/home.component.html
1 1 <div class="container-fluid p-0">
2   - <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image">
  2 + <img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100">
3 3 <div class="row m-0">
4 4 <div class="col p-0">
5 5 <div
... ... @@ -8,7 +8,7 @@
8 8  
9 9 <!-- HEADER -->
10 10 <div class="row m-0 w-100 bg-primary-gradient-horizontal">
11   - <div class="col-6 bg-white p-5 rounded-bottom-right">
  11 + <div class="col-6 bg-white p-3 rounded-bottom-right">
12 12 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoaxion.png">
13 13 </div>
14 14 </div>
... ... @@ -20,13 +20,13 @@
20 20 </div>
21 21 <div class="col-6 text-center text-white my-auto">
22 22 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
23   - <p class="display-3 m-0">Toque la pantalla<br>para comenzar</p>
  23 + <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
24 24 </div>
25 25 </div>
26 26  
27 27 <!-- FOOTER -->
28 28 <div class="row m-0 w-100 bg-gray">
29   - <div class="col-6 bg-white offset-6 p-5 rounded-top-left">
  29 + <div class="col-6 bg-white offset-6 p-3 rounded-top-left">
30 30 <img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">
31 31 </div>
32 32 </div>
src/app/components/inicio/inicio.component.html
... ... @@ -96,8 +96,8 @@
96 96 </div>
97 97 </div>
98 98 <p class="h5 card-text text-muted font-weight-light">
99   - Coloque el código de<br>
100   - barras o QR frente al scanner.
  99 + Coloque un producto frente<br>
  100 + al lector de códigos o selecciónelo en pantalla
101 101 </p>
102 102 </div>
103 103 <div class="row m-4">
... ... @@ -112,7 +112,7 @@
112 112 <div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar">
113 113 <img
114 114 class="card-img-top d-block w-75 mx-auto rounded-sm"
115   - src="{{apiUrl}}/imagenes/testImg.jpg">
  115 + src="{{apiUrl}}/imagenes/{{productoAcargar.imagenes[0].imagen}}">
116 116  
117 117 <div class="row justify-content-between m-3">
118 118 <div class="col-12 text-left px-1">
... ... @@ -128,7 +128,7 @@
128 128 <div class="fade-in m-0" *ngIf="promoAcargar">
129 129 <img
130 130 class="card-img-top d-block w-100 mx-auto rounded-sm"
131   - src="{{apiUrl}}/imagenes/testImg.jpg">
  131 + src="{{apiUrl}}/imagenes/{{promoAcargar.imagenes[0].imagen}}">
132 132  
133 133 <div class="row justify-content-between m-3">
134 134 <div class="col-12 text-left px-1">
src/app/components/inicio/inicio.component.ts
... ... @@ -117,15 +117,17 @@ export class InicioComponent implements OnInit {
117 117 var codigo = this.promoAcargar.codigo;
118 118 this.productoService.getPromocionSinonimos(sector, codigo)
119 119 .subscribe((res: Sinonimo[]) => {
  120 +
120 121 res.forEach(resSinonimo => {
121   - resSinonimo.productos.forEach(productoSinonimo => {
122   - this.promoAcargar.productos.forEach(productoPromo => {
123   - if (productoPromo.id === productoSinonimo.id) {
124   - productoSinonimo.esPadre = true;
125   - }
126   - });
127   -
128   - })
  122 +
  123 + this.promoAcargar.productos.forEach(productoPromo => {
  124 +
  125 + if (productoPromo.idSinonimo === resSinonimo.ID_SIN) {
  126 + resSinonimo.cantidad = productoPromo.cantidad;
  127 + resSinonimo.productoPadre = productoPromo.id;
  128 + }
  129 + });
  130 +
129 131 })
130 132 this.sinonimos = res;
131 133 this.showPopover();
src/app/components/popover-sinonimos/popover-sinonimos.component.html
... ... @@ -10,41 +10,41 @@
10 10  
11 11 <div class="row m-0 overflow-scroll popover-size pr-2 my-2">
12 12 <div class="col">
13   - <div class="row mb-2" *ngFor="let sinonimo of popoverContent">
  13 + <div class="row mb-2" *ngFor="let sinonimo of popoverContent; let i = index">
14 14 <div class="col">
15 15  
16 16 <div class="row m-0">
17 17 <div class="col text-left">
18 18 <p class="h5 card-title">
19   - Elija una opción
  19 + Elija una opción - Cantidad Restante {{cantidadRestanteSinonimos[i]}}
20 20 </p>
21 21 </div>
22 22 </div>
23 23  
24 24 <div class="row my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos">
25   - <div class="col-8 pl-4 h6 m-0">
26   - <div class="custom-control custom-radio">
27   - <input
28   - type="radio"
29   - [id]="producto.id"
30   - [checked]="producto.esPadre"
31   - name="sinonimoOpciones"
32   - class="custom-control-input"
33   - (click)="setSinonimo(sinonimo)">
34   - <label class="font-weight-normal custom-control-label" [for]="producto.id">
35   - {{producto.DetArt}}
36   - </label>
37   - </div>
  25 + <div class="col-7 pl-4 h6 text-right">
  26 + <p class="m-0 font-weight-normal">
  27 + {{producto.DetArt}}
  28 + </p>
38 29 </div>
39 30 <div class="col-auto">
40   - <div class="btn-group-sm btn-group float-left my-auto" role="group">
41   - <button type="button" class="btn btn-light btn-sm my-auto border">
  31 + <div class="btn-group float-left my-auto" role="group">
  32 + <button
  33 + type="button"
  34 + class="btn btn-light my-auto border"
  35 + (click)="sumarCantidad(producto, i)">
42 36 <i class="fa fa-plus" aria-hidden="true"></i>
43 37 </button>
44   - <div class="bg-white border border-white px-3 my-auto text-dark h5">
45   - <small>{{producto.cantidad}}</small>
  38 + <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5">
  39 + <small
  40 + [ngClass]="{'font-weight-bold': producto.cantidad > 0}">
  41 + {{producto.cantidad}}
  42 + </small>
46 43 </div>
47   - <button type="button" class="btn btn-light btn-sm my-auto border">
  44 + <button
  45 + type="button"
  46 + class="btn btn-light my-auto border"
  47 + (click)="restarCantidad(producto, i)">
48 48 <i class="fa fa-minus" aria-hidden="true"></i>
49 49 </button>
50 50 </div>
src/app/components/popover-sinonimos/popover-sinonimos.component.ts
... ... @@ -16,13 +16,21 @@ export class PopoverSinonimosComponent implements OnInit {
16 16 @Output() sinonimoSeleccionado = new EventEmitter<Sinonimo>();
17 17 sinonimo: Sinonimo;
18 18  
  19 + private cantidadRestanteSinonimos: number[] = [];
  20 +
19 21 constructor() { }
20 22  
21 23 ngOnInit() {
22 24  
23 25 //Seteo en la variable a emitir el sinonimo que sea padre
24 26 this.popoverContent.forEach(sinonimo => {
25   - // this.sinonimo = sinonimo.esPadre ? sinonimo : undefined;
  27 +
  28 + this.cantidadRestanteSinonimos.push(0);
  29 + this.sinonimo = sinonimo.productoPadre ? sinonimo : undefined;
  30 + sinonimo.productos.forEach(producto => {
  31 +
  32 + producto.cantidad = (producto.id === sinonimo.productoPadre) ? sinonimo.cantidad : 0;
  33 + })
26 34 })
27 35 }
28 36  
... ... @@ -37,4 +45,19 @@ export class PopoverSinonimosComponent implements OnInit {
37 45 this.sinonimo = sinonimo;
38 46 }
39 47  
  48 + sumarCantidad(producto: Producto, i: number) {
  49 +
  50 + if (this.cantidadRestanteSinonimos[i] === 0) return;
  51 + producto.cantidad++;
  52 + this.cantidadRestanteSinonimos[i]--;
  53 + }
  54 +
  55 + restarCantidad(producto: Producto, i: number) {
  56 +
  57 + if (this.cantidadRestanteSinonimos[i] === this.popoverContent[i].cantidad) return;
  58 + if (producto.cantidad === 0) return;
  59 + producto.cantidad--;
  60 + this.cantidadRestanteSinonimos[i]++;
  61 + }
  62 +
40 63 }
src/app/components/sidebar/sidebar.component.html
... ... @@ -8,7 +8,7 @@
8 8 <div class="overflow-auto overflow-scroll mb-2 w-100">
9 9 <!-- PRODUCTOS CARRITO -->
10 10 <div
11   - class="fade-left my-2 bg-white border-0 rounded-sm"
  11 + class="slide-in-bl my-2 bg-white border-0 rounded-sm"
12 12 *ngFor="let producto of productosCarrito.slice().reverse(); let i = index">
13 13 <img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}">
14 14 <div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">
src/app/components/sidebar/sidebar.component.ts
... ... @@ -87,7 +87,7 @@ export class SidebarComponent implements OnInit {
87 87 this.cont -= this.productosCarrito[i].cantidad;
88 88 //Elimina del total el PreVen de todo el item
89 89 this.total = this.total - (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
90   - this.productosCarrito.splice(i, 1);
  90 + this.productosCarrito.reverse().splice(i, 1);
91 91 return;
92 92 }
93 93 }
src/app/wrappers/producto.ts
... ... @@ -92,4 +92,5 @@ export interface Producto {
92 92 showCargarProducto?: boolean;
93 93 esPadre?: boolean;
94 94 codigoBarra: string;
  95 + idSinonimo?: number;
95 96 }
src/app/wrappers/sinonimo.ts
... ... @@ -5,4 +5,6 @@ export interface Sinonimo {
5 5 ID_SIN: number,
6 6 descripcion: string,
7 7 productos: Producto[],
  8 + productoPadre?: number;
  9 + cantidad? : number;
8 10 }
src/assets/scss/animation.scss
... ... @@ -144,3 +144,34 @@
144 144 transform-origin: 100% 0%;
145 145 }
146 146 }
  147 +
  148 +.slide-in-bl {
  149 + -webkit-animation: slide-in-bl 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  150 + animation: slide-in-bl 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  151 +}
  152 +
  153 +@-webkit-keyframes slide-in-bl {
  154 + 0% {
  155 + -webkit-transform: translateY(1000px) translateX(-1000px);
  156 + transform: translateY(1000px) translateX(-1000px);
  157 + opacity: 0;
  158 + }
  159 + 100% {
  160 + -webkit-transform: translateY(0) translateX(0);
  161 + transform: translateY(0) translateX(0);
  162 + opacity: 1;
  163 + }
  164 +}
  165 +
  166 +@keyframes slide-in-bl {
  167 + 0% {
  168 + -webkit-transform: translateY(1000px) translateX(-1000px);
  169 + transform: translateY(1000px) translateX(-1000px);
  170 + opacity: 0;
  171 + }
  172 + 100% {
  173 + -webkit-transform: translateY(0) translateX(0);
  174 + transform: translateY(0) translateX(0);
  175 + opacity: 1;
  176 + }
  177 +}