Mauricio Cattafi / autoservicio

Download as
Browse Code »

Commit 24181b4e9e3ff9ea78c2e727c4d2260c4ffe244a

Authored by Marcelo Puebla
1 parent 6641a4f189
Exists in master and in 1 other branch validar_pve

Cambio color nombre seccion.

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