Mauricio Cattafi / autoservicio

Download as
Browse Code »

Commit d4fabac8a5e5bc16792f9120b4f9b187cb088df8

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

Agregado scroll bar al ticket si es muy grande.

Showing 1 changed file with 2 additions and 2 deletions   Show diff stats
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
Diff comments   View file @ d4fabac
1 <div class="row m-0 fade-in bg-primary-gradient disable-user-select"> 1 <div class="row m-0 fade-in bg-primary-gradient disable-user-select">
2 <div class="col-12 p-0 vh-100"> 2 <div class="col-12 p-0 vh-100">
3 3
4 <!-- TOP HEADER --> 4 <!-- TOP HEADER -->
5 <app-header></app-header> 5 <app-header></app-header>
6 6
7 <!-- NOMBRE DE SECCION --> 7 <!-- NOMBRE DE SECCION -->
8 <div class="row m-0"> 8 <div class="row m-0">
9 <div class="col-12 p-0"> 9 <div class="col-12 p-0">
10 <p class="h5 py-1 bg-gray text-muted text-center m-0"> 10 <p class="h5 py-1 bg-gray text-muted text-center m-0">
11 Pagar 11 Pagar
12 <i class="fa fa-usd"></i> 12 <i class="fa fa-usd"></i>
13 </p> 13 </p>
14 </div> 14 </div>
15 </div> 15 </div>
16 16
17 <div class="row m-0"> 17 <div class="row m-0">
18 <div class="col-12"> 18 <div class="col-12">
19 19
20 <!-- TEXTO DE IZQUIERDA --> 20 <!-- TEXTO DE IZQUIERDA -->
21 <div class="row mx-2 mt-4 text-white"> 21 <div class="row mx-2 mt-4 text-white">
22 <div class="col-sm-2 my-auto"> 22 <div class="col-sm-2 my-auto">
23 <p class="h2">Mi Compra 23 <p class="h2">Mi Compra
24 <i class="fa fa-shopping-cart "></i> 24 <i class="fa fa-shopping-cart "></i>
25 </p> 25 </p>
26 </div> 26 </div>
27 <div class="col-sm-4 my-auto"> 27 <div class="col-sm-4 my-auto">
28 <p class="h3">¿Desea finalizar su compra?</p> 28 <p class="h3">¿Desea finalizar su compra?</p>
29 <p class="h4">Por favor, controle y confirme su compra.</p> 29 <p class="h4">Por favor, controle y confirme su compra.</p>
30 </div> 30 </div>
31 </div> 31 </div>
32 32
33 <div class="row"> 33 <div class="row">
34 <!-- GRILLA DE PRODUCTOS DE MI COMPRA --> 34 <!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
35 <div class="col-sm-7"> 35 <div class="col-sm-7">
36 <div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark"> 36 <div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">
37 <div class="col-4 p-2" *ngFor="let producto of productos"> 37 <div class="col-4 p-2" *ngFor="let producto of productos">
38 <div class="bg-white rounded-sm shadow border-0"> 38 <div class="bg-white rounded-sm shadow border-0">
39 <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto"> 39 <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto">
40 <div class="p-2"> 40 <div class="p-2">
41 <p class="h6 text-left m-0">ZARAZA</p> 41 <p class="h6 text-left m-0">ZARAZA</p>
42 <div class="row justify-content-between m-0"> 42 <div class="row justify-content-between m-0">
43 <div class="col-12 p-0"> 43 <div class="col-12 p-0">
44 <div class="text-left"> 44 <div class="text-left">
45 <p class="m-0 h6"><small>ZARAZA DETALLE</small></p> 45 <p class="m-0 h6"><small>ZARAZA DETALLE</small></p>
46 <p class="m-0 h6"><small>COD. 5656</small></p> 46 <p class="m-0 h6"><small>COD. 5656</small></p>
47 </div> 47 </div>
48 </div> 48 </div>
49 <div class="col-12 my-auto pt-2 pr-2 p-0"> 49 <div class="col-12 my-auto pt-2 pr-2 p-0">
50 <p class="text-right m-0 h6">{{20 | currency}}</p> 50 <p class="text-right m-0 h6">{{20 | currency}}</p>
51 </div> 51 </div>
52 </div> 52 </div>
53 </div> 53 </div>
54 </div> 54 </div>
55 </div> 55 </div>
56 </div> 56 </div>
57 </div> 57 </div>
58 58
59 <div class="col-sm-5"> 59 <div class="col-sm-5">
60 <div class="row h-100 ml-3"> 60 <div class="row ml-3">
61 <!-- TICKET --> 61 <!-- TICKET -->
62 <div class="col-sm-7"> 62 <div class="col-sm-7">
63 <div class="card rounded-sm shadow"> 63 <div class="card rounded-sm shadow">
64 <div class="card-body"> 64 <div class="card-body">
65 <p class="h5 card-title">Su Ticket</p> 65 <p class="h5 card-title">Su Ticket</p>
66 <p class="h6 card-text text-left mt-4"> 66 <p class="h6 card-text text-left mt-4 pr-2 vh-60 overflow-scroll">
67 Ticket detalle. 67 Ticket detalle.
68 </p> 68 </p>
69 <p class="h4 card-text text-right mt-3 mb-0"> 69 <p class="h4 card-text text-right mt-3 mb-0">
70 Total {{230 | currency}} 70 Total {{230 | currency}}
71 </p> 71 </p>
72 </div> 72 </div>
73 </div> 73 </div>
74 </div> 74 </div>
75 75
76 <div class="row m-0 fixed-bottom"> 76 <div class="row m-0 fixed-bottom">
77 <!-- OPCIONES ABAJO DERECHA --> 77 <!-- OPCIONES ABAJO DERECHA -->
78 <div class="col-sm-2 offset-sm-10 p-0 mt-auto"> 78 <div class="col-sm-2 offset-sm-10 p-0 mt-auto">
79 <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0"> 79 <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
80 <div class="card-body row m-0"> 80 <div class="card-body row m-0">
81 <div class="col-12 p-3"> 81 <div class="col-12 p-3">
82 <button type="button" class="btn btn-block btn-light shadow btn-sm shadow"> 82 <button type="button" class="btn btn-block btn-light shadow btn-sm shadow">
83 <span class="pr-1">Volver</span> 83 <span class="pr-1">Volver</span>
84 <i class="fa fa-undo text-warning"></i> 84 <i class="fa fa-undo text-warning"></i>
85 </button> 85 </button>
86 <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1"> 86 <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1">
87 <span class="font-weight-bold pr-1">Finalizar y Pagar</span> 87 <span class="font-weight-bold pr-1">Finalizar y Pagar</span>
88 <i class="fa fa-check text-success"></i> 88 <i class="fa fa-check text-success"></i>
89 </button> 89 </button>
90 <button type="button" class="btn btn-block btn-light shadow btn-sm shadow"> 90 <button type="button" class="btn btn-block btn-light shadow btn-sm shadow">
91 <span class="pr-1">Cancelar</span> 91 <span class="pr-1">Cancelar</span>
92 <i class="fa fa-times text-danger"></i> 92 <i class="fa fa-times text-danger"></i>
93 </button> 93 </button>
94 </div> 94 </div>
95 </div> 95 </div>
96 </div> 96 </div>
97 </div> 97 </div>
98 </div> 98 </div>
99 </div> 99 </div>
100 </div> 100 </div>
101 </div> 101 </div>
102 102
103 </div> 103 </div>
104 </div> 104 </div>
105 105
106 106
107 </div> 107 </div>
108 108
109 </div> 109 </div>
110 110