Commit 28ae0e69f74107723f8aec3f92d5237d32088f7d

Authored by Marcelo Puebla
1 parent 400808f594
Exists in master

Deshabilitar boton continuar si no elije todas las opciones disponibles.

src/app/components/popover-sinonimos/popover-sinonimos.component.html
1 <div class="card-body fade-left"> 1 <div class="card-body fade-left">
2 2
3 <div class="row m-0"> 3 <div class="row m-0">
4 <div class="col text-left"> 4 <div class="col text-left">
5 <p class="h4 card-title"> 5 <p class="h4 card-title">
6 Personalice su pedido 6 Personalice su pedido
7 </p> 7 </p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="row m-0 pr-2 my-2"> 11 <div class="row m-0 pr-2 my-2">
12 <div class="col"> 12 <div class="col">
13 <div class="row mb-2" *ngFor="let sinonimo of popoverContent; let i = index"> 13 <div class="row mb-2" *ngFor="let sinonimo of popoverContent; let i = index">
14 <div class="col p-0"> 14 <div class="col p-0">
15 15
16 <div class="row bg-white text-dark m-0 py-1 shadow"> 16 <div class="row bg-white text-dark m-0 py-1 shadow">
17 <div class="col text-left"> 17 <div class="col text-left">
18 <p class="h5 m-0 card-title"> 18 <p class="h5 m-0 card-title">
19 Elija opción - 19 Elija opción -
20 <span [ngClass]=" 20 <span [ngClass]="
21 { 21 {
22 'text-success': cantidadRestanteSinonimos == 0, 22 'text-success': cantidadRestanteSinonimos == 0,
23 'text-danger': cantidadRestanteSinonimos > 0 23 'text-danger': cantidadRestanteSinonimos > 0
24 }"> 24 }">
25 Cantidad Restante {{cantidadRestanteSinonimos}} 25 Cantidad Restante {{cantidadRestanteSinonimos}}
26 </span> 26 </span>
27 </p> 27 </p>
28 </div> 28 </div>
29 </div> 29 </div>
30 30
31 <div class="row m-0 popover-size overflow-scroll"> 31 <div class="row m-0 popover-size overflow-scroll">
32 <div class="col-12 p-0"> 32 <div class="col-12 p-0">
33 <div class="row m-0 my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos"> 33 <div class="row m-0 my-3 d-flex justify-content-between" *ngFor="let producto of sinonimo.productos">
34 <div class="col-7 p-0 h6 text-right"> 34 <div class="col-7 p-0 h6 text-right">
35 <p class="m-0 font-weight-normal"> 35 <p class="m-0 font-weight-normal">
36 {{producto.DetArt}} 36 {{producto.DetArt}}
37 </p> 37 </p>
38 </div> 38 </div>
39 <div class="col-5 pr-0"> 39 <div class="col-5 pr-0">
40 <div class="btn-group float-right my-auto" role="group"> 40 <div class="btn-group float-right my-auto" role="group">
41 <button 41 <button
42 type="button" 42 type="button"
43 class="btn btn-light my-auto border shadow" 43 class="btn btn-light my-auto border shadow"
44 (click)="sumarCantidad(producto, i)"> 44 (click)="sumarCantidad(producto, i)">
45 <i class="fa fa-plus" aria-hidden="true"></i> 45 <i class="fa fa-plus" aria-hidden="true"></i>
46 </button> 46 </button>
47 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5"> 47 <div class="bg-white border border-white px-3 py-1 my-auto text-dark h5">
48 <small 48 <small
49 [ngClass]="{'font-weight-bold': producto.cantidad > 0}"> 49 [ngClass]="{'font-weight-bold': producto.cantidad > 0}">
50 {{producto.cantidad}} 50 {{producto.cantidad}}
51 </small> 51 </small>
52 </div> 52 </div>
53 <button 53 <button
54 type="button" 54 type="button"
55 class="btn btn-light my-auto border shadow" 55 class="btn btn-light my-auto border shadow"
56 (click)="restarCantidad(producto, i)"> 56 (click)="restarCantidad(producto, i)">
57 <i class="fa fa-minus" aria-hidden="true"></i> 57 <i class="fa fa-minus" aria-hidden="true"></i>
58 </button> 58 </button>
59 </div> 59 </div>
60 </div> 60 </div>
61 </div> 61 </div>
62 </div> 62 </div>
63 </div> 63 </div>
64 64
65 </div> 65 </div>
66 </div> 66 </div>
67 </div> 67 </div>
68 </div> 68 </div>
69 69
70 <div class="row mt-3 justify-content-end"> 70 <div class="row mt-3 justify-content-end">
71 <div class="col"> 71 <div class="col">
72 <button 72 <button
73 [disabled]="cantidadRestanteSinonimos > 0"
73 type="button" 74 type="button"
74 class="btn btn-block btn-light shadow" 75 class="btn btn-block btn-light shadow"
75 (click)="continuar()"> 76 (click)="continuar()">
76 <span class="font-weight-bold pr-2">Continuar</span> 77 <span class="font-weight-bold pr-2">Continuar</span>
77 <i class="fa fa-check text-success" aria-hidden="true"></i> 78 <i class="fa fa-check text-success" aria-hidden="true"></i>
78 </button> 79 </button>
79 </div> 80 </div>
80 </div> 81 </div>
81 82
82 </div> 83 </div>