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