Mauricio Cattafi / autoservicio

Download as
Browse Code »

Commit f1cb82284ab99ad35064285506ca7598c75fb958

Authored by Marcelo Puebla
1 parent 62d69e27cf
Exists in master and in 1 other branch validar_pve

Arreglo en tamaño de margen.

Showing 2 changed files with 2 additions and 2 deletions   Show diff stats
src/app/components/busqueda-productos/busqueda-productos.component.html
Diff comments   View file @ f1cb822
1 <div class="row m-0 fade-in"> 1 <div class="row m-0 fade-in">
2 <div class="col-12 p-0"> 2 <div class="col-12 p-0">
3 3
4 <!-- NOMBRE DE SECCION --> 4 <!-- NOMBRE DE SECCION -->
5 <div class="row m-0"> 5 <div class="row m-0">
6 <div class="col-12 p-0"> 6 <div class="col-12 p-0">
7 <p class="h5 py-1 bg-gray text-muted text-center"> 7 <p class="h5 py-1 bg-gray text-muted text-center">
8 Búsqueda 8 Búsqueda
9 <i class="fa fa-search"></i> 9 <i class="fa fa-search"></i>
10 </p> 10 </p>
11 </div> 11 </div>
12 </div> 12 </div>
13 13
14 <div class="row m-4 disable-user-select"> 14 <div class="row m-3 disable-user-select">
15 15
16 <!-- FILTROS --> 16 <!-- FILTROS -->
17 <div class="col-sm-2 p-1"> 17 <div class="col-sm-2 p-1">
18 <div class="text-center"> 18 <div class="text-center">
19 <p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p> 19 <p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p>
20 </div> 20 </div>
21 <ul class="list-group"> 21 <ul class="list-group">
22 <li 22 <li
23 [ngClass]="{active: categoria == 1}" 23 [ngClass]="{active: categoria == 1}"
24 (click)="categoria = 1" 24 (click)="categoria = 1"
25 class="list-group-item list-group-item-action text-center my-1 p-2 h6"> 25 class="list-group-item list-group-item-action text-center my-1 p-2 h6">
26 Combos y Promociones 26 Combos y Promociones
27 </li> 27 </li>
28 <li 28 <li
29 [ngClass]="{active: categoria == 2}" 29 [ngClass]="{active: categoria == 2}"
30 (click)="categoria = 2" 30 (click)="categoria = 2"
31 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 31 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
32 Todos 32 Todos
33 </li> 33 </li>
34 <li 34 <li
35 [ngClass]="{active: categoria == 3}" 35 [ngClass]="{active: categoria == 3}"
36 (click)="categoria = 3" 36 (click)="categoria = 3"
37 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 37 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
38 Bebidas 38 Bebidas
39 </li> 39 </li>
40 <li 40 <li
41 [ngClass]="{active: categoria == 4}" 41 [ngClass]="{active: categoria == 4}"
42 (click)="categoria = 4" 42 (click)="categoria = 4"
43 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 43 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
44 Sandwichería 44 Sandwichería
45 </li> 45 </li>
46 <li 46 <li
47 [ngClass]="{active: categoria == 5}" 47 [ngClass]="{active: categoria == 5}"
48 (click)="categoria = 5" 48 (click)="categoria = 5"
49 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 49 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
50 Panaderia 50 Panaderia
51 </li> 51 </li>
52 <li 52 <li
53 [ngClass]="{active: categoria == 6}" 53 [ngClass]="{active: categoria == 6}"
54 (click)="categoria = 6" 54 (click)="categoria = 6"
55 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 55 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
56 Golosinas 56 Golosinas
57 </li> 57 </li>
58 <li 58 <li
59 [ngClass]="{active: categoria == 7}" 59 [ngClass]="{active: categoria == 7}"
60 (click)="categoria = 7" 60 (click)="categoria = 7"
61 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> 61 class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm">
62 Tabaqueria 62 Tabaqueria
63 </li> 63 </li>
64 </ul> 64 </ul>
65 </div> 65 </div>
66 66
67 <!-- SEARCH INPUT --> 67 <!-- SEARCH INPUT -->
68 <div *ngIf="productos.length > 0" class="fade-in col-sm-10"> 68 <div *ngIf="productos.length > 0" class="fade-in col-sm-10">
69 69
70 <div class="form-group row search"> 70 <div class="form-group row search">
71 <div class="col-sm-10"> 71 <div class="col-sm-10">
72 <span class="fa fa-search form-control-lg form-control-search pl-3"></span> 72 <span class="fa fa-search form-control-lg form-control-search pl-3"></span>
73 <input 73 <input
74 type="text" 74 type="text"
75 class="form-control form-control-lg shadow-sm rounded-pill px-5" 75 class="form-control form-control-lg shadow-sm rounded-pill px-5"
76 placeholder="Búsqueda productos" 76 placeholder="Búsqueda productos"
77 [(ngModel)]="searchTerm" 77 [(ngModel)]="searchTerm"
78 (ngModelChange)="filterItems()"> 78 (ngModelChange)="filterItems()">
79 </div> 79 </div>
80 <!-- BOTON VOLVER --> 80 <!-- BOTON VOLVER -->
81 <div class="col-sm-2"> 81 <div class="col-sm-2">
82 <button 82 <button
83 type="button" 83 type="button"
84 class="btn btn-light btn-lg shadow-sm" 84 class="btn btn-light btn-lg shadow-sm"
85 [routerLink]="['/inicio']"> 85 [routerLink]="['/inicio']">
86 <span class="font-weight-normal h6 pr-2">Volver</span> 86 <span class="font-weight-normal h6 pr-2">Volver</span>
87 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 87 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
88 </button> 88 </button>
89 </div> 89 </div>
90 </div> 90 </div>
91 <!-- LISTA DE PRODUCTOS --> 91 <!-- LISTA DE PRODUCTOS -->
92 <div class="row align-items-start vh-60 overflow-scroll disable-user-select"> 92 <div class="row align-items-start vh-60 overflow-scroll disable-user-select">
93 <div 93 <div
94 class="col-4 p-2" 94 class="col-4 p-2"
95 *ngFor="let producto of auxProductos"> 95 *ngFor="let producto of auxProductos">
96 <div 96 <div
97 class="card-effect bg-white rounded-sm shadow border-0" 97 class="card-effect bg-white rounded-sm shadow border-0"
98 (click)="mostrarBotonCargar(producto)"> 98 (click)="mostrarBotonCargar(producto)">
99 <img src="{{apiUrl}}/imagenes/cafe.jpg" class="rounded-sm w-100 m-auto"> 99 <img src="{{apiUrl}}/imagenes/cafe.jpg" class="rounded-sm w-100 m-auto">
100 <div class="p-2"> 100 <div class="p-2">
101 <p class="h6 text-left m-0">{{producto.DetArt}}</p> 101 <p class="h6 text-left m-0">{{producto.DetArt}}</p>
102 <div class="row justify-content-between m-0"> 102 <div class="row justify-content-between m-0">
103 <div class="col-12 p-0"> 103 <div class="col-12 p-0">
104 <div class="text-left"> 104 <div class="text-left">
105 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p> 105 <p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
106 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p> 106 <p class="m-0 h6"><small>COD. {{producto.CodRub}}</small></p>
107 </div> 107 </div>
108 </div> 108 </div>
109 <div class="col-12 my-auto pt-2 pr-2 p-0"> 109 <div class="col-12 my-auto pt-2 pr-2 p-0">
110 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p> 110 <p class="text-right m-0 h6">{{producto.PreVen | currency}}</p>
111 </div> 111 </div>
112 </div> 112 </div>
113 <div *ngIf="producto.showCargarProducto" class="row mt-2"> 113 <div *ngIf="producto.showCargarProducto" class="row mt-2">
114 <div class="col-sm-12"> 114 <div class="col-sm-12">
115 <button 115 <button
116 type="button" 116 type="button"
117 class="btn btn-block btn-outline-primary shadow" 117 class="btn btn-block btn-outline-primary shadow"
118 (click)="elegirProducto(producto)"> 118 (click)="elegirProducto(producto)">
119 Cargar Producto 119 Cargar Producto
120 </button> 120 </button>
121 </div> 121 </div>
122 </div> 122 </div>
123 </div> 123 </div>
124 </div> 124 </div>
125 </div> 125 </div>
126 </div> 126 </div>
127 </div> 127 </div>
128 128
129 <!-- SPINNER --> 129 <!-- SPINNER -->
130 <div *ngIf="productos.length === 0 && showSpinner" class="col-sm-10 align-self-center"> 130 <div *ngIf="productos.length === 0 && showSpinner" class="col-sm-10 align-self-center">
131 <div class="spinner-border spinner-lg text-secondary" role="status"></div> 131 <div class="spinner-border spinner-lg text-secondary" role="status"></div>
132 <span class="text-secondary m-2 h5">Cargando información.</span> 132 <span class="text-secondary m-2 h5">Cargando información.</span>
133 </div> 133 </div>
134 134
135 </div> 135 </div>
136 136
137 </div> 137 </div>
138 138
139 </div> 139 </div>
140 140
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
Diff comments   View file @ f1cb822
1 <div class="row"> 1 <div class="row">
2 <div class="col-12"> 2 <div class="col-12">
3 3
4 <!-- NOMBRE DE SECCION --> 4 <!-- NOMBRE DE SECCION -->
5 <div class="row m-0"> 5 <div class="row m-0">
6 <div class="col-12 p-0"> 6 <div class="col-12 p-0">
7 <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p> 7 <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="row m-4 d-flex align-items-center"> 11 <div class="row m-3 d-flex align-items-center">
12 <div class="col-4"> 12 <div class="col-4">
13 <h1>Mi Compra <i class="fa fa-shopping-cart "></i></h1> 13 <h1>Mi Compra <i class="fa fa-shopping-cart "></i></h1>
14 </div> 14 </div>
15 <div class="col-8"> 15 <div class="col-8">
16 <h2>¿Desea finalizar su compra?</h2> 16 <h2>¿Desea finalizar su compra?</h2>
17 <h3>Por favor, controle y confirme su compra.</h3> 17 <h3>Por favor, controle y confirme su compra.</h3>
18 </div> 18 </div>
19 <div class="col-sm-7"> 19 <div class="col-sm-7">
20 20
21 <div class="row pr-3 vh-50 overflow-scroll"> 21 <div class="row pr-3 vh-50 overflow-scroll">
22 <div class="col-4 p-2" *ngFor="let producto of productos"> 22 <div class="col-4 p-2" *ngFor="let producto of productos">
23 <div class="card card-effect bg-white rounded-sm shadow border-0"> 23 <div class="card card-effect bg-white rounded-sm shadow border-0">
24 <img src="{{apiUrl}}/imagenes/{{producto.nombreImagen}}" class="card-img-top w-75 m-auto"> 24 <img src="{{apiUrl}}/imagenes/{{producto.nombreImagen}}" class="card-img-top w-75 m-auto">
25 <div class="card-body"> 25 <div class="card-body">
26 <p class="h5 text-left m-0">{{producto.variable}}</p> 26 <p class="h5 text-left m-0">{{producto.variable}}</p>
27 <div class="text-left"> 27 <div class="text-left">
28 <p class="m-0"><small>ASDASDSADASDSA</small></p> 28 <p class="m-0"><small>ASDASDSADASDSA</small></p>
29 <p class="m-0"><small>COD. 1222</small></p> 29 <p class="m-0"><small>COD. 1222</small></p>
30 <p class="m-0"><strong>$ 563</strong></p> 30 <p class="m-0"><strong>$ 563</strong></p>
31 </div> 31 </div>
32 </div> 32 </div>
33 </div> 33 </div>
34 </div> 34 </div>
35 </div> 35 </div>
36 </div> 36 </div>
37 <div class="col-sm-5"> 37 <div class="col-sm-5">
38 <h3>TOTAL: $553</h3> 38 <h3>TOTAL: $553</h3>
39 </div> 39 </div>
40 </div> 40 </div>
41 </div> 41 </div>
42 </div> 42 </div>
43 43