Skip to content

Commit 9c1ac30

Browse files
Criado o componete order, form que será chamado ao finalizar o pedido no carrinho de compras
1 parent b12bb0d commit 9c1ac30

File tree

2 files changed

+180
-0
lines changed

2 files changed

+180
-0
lines changed

src/app/order/order.component.html

Lines changed: 166 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,166 @@
1+
<!--INICIO DO CONTEUDO-->
2+
<section class="content-header">
3+
</section>
4+
5+
<section class="content">
6+
<section class="invoice">
7+
8+
<form>
9+
<div class="row">
10+
<div class="col-xs-12">
11+
<h2 class="page-header">
12+
<i class="fa fa-shopping-cart"></i> Finalize o seu pedido
13+
</h2>
14+
</div>
15+
</div>
16+
17+
<div class="row invoice-info">
18+
<div class="col-xs-12">
19+
<p class="lead">Endereço de Entrega:</p>
20+
</div>
21+
<div class="col-sm-6 col-xs-12">
22+
<div class="form-group">
23+
<label class="control-label sr-only" for="inputSuccess"><i class="fa fa-check"></i> Endereço</label>
24+
<input type="text" class="form-control" id="inputSuccess" placeholder="Endereço">
25+
<span class="help-block"></span>
26+
</div>
27+
</div>
28+
<div class="col-sm-2 col-xs-6">
29+
<div class="form-group has-success">
30+
<label class="control-label sr-only" for="inputSuccess"><i class="fa fa-check"></i> Número</label>
31+
<input type="text" class="form-control" id="inputSuccess" placeholder="Número">
32+
<span class="help-block"><i class="fa fa-check"></i> Ok</span>
33+
</div>
34+
</div>
35+
<div class="col-sm-4 col-xs-6">
36+
<div class="form-group has-error">
37+
<label class="control-label sr-only" for="inputSuccess"><i class="fa fa-check"></i> Complemento</label>
38+
<input type="text" class="form-control" id="inputSuccess" placeholder="Complemento">
39+
<span class="help-block"><i class="fa fa-remove"></i> Help block with error</span>
40+
</div>
41+
42+
</div>
43+
<!-- /.col -->
44+
</div>
45+
<!-- /.row -->
46+
47+
<!-- Table row -->
48+
<div class="row">
49+
<div class="col-xs-12">
50+
<p class="lead">Itens do Pedido:</p>
51+
</div>
52+
<div class="col-xs-12 table-responsive">
53+
54+
<table class="table table-striped">
55+
<thead>
56+
<tr>
57+
<th class="text-center">Quantidade</th>
58+
<th>Item</th>
59+
<th>Descrição</th>
60+
<th class="text-right">Subtotal</th>
61+
<th class="text-right"></th>
62+
</tr>
63+
</thead>
64+
<tbody>
65+
<tr>
66+
<td class="text-center">
67+
<a class="btn btn-sm"><i class="fa fa-minus"></i></a>
68+
1
69+
<a class="btn btn-sm"><i class="fa fa-plus"></i></a>
70+
</td>
71+
<td>Cup Cake</td>
72+
73+
<td>Recheado com doce de leite</td>
74+
<td class="text-right">R$ 10,00</td>
75+
<td class="text-right">
76+
<a class="btn btn-sm danger"><i class="fa fa-remove"></i></a>
77+
</td>
78+
</tr>
79+
<tr>
80+
<td class="text-center">
81+
<a class="btn btn-sm"><i class="fa fa-minus"></i></a>
82+
1
83+
<a class="btn btn-sm"><i class="fa fa-plus"></i></a>
84+
</td>
85+
<td>Croissant</td>
86+
87+
<td>Recheado com presunto e queijo</td>
88+
<td class="text-right">R$ 10,00</td>
89+
<td class="text-right">
90+
<a class="btn btn-sm danger "><i class="fa fa-remove"></i></a>
91+
</td>
92+
</tr>
93+
94+
</tbody>
95+
</table>
96+
</div>
97+
<!-- /.col -->
98+
</div>
99+
<!-- /.row -->
100+
101+
<div class="row">
102+
<!-- accepted payments column -->
103+
<div class="col-sm-6 col-xs-12">
104+
<p class="lead">Formas de Pagamento:</p>
105+
106+
<div class="form-group">
107+
<div>
108+
<label>
109+
<div class="iradio_flat-red checked" aria-checked="false" aria-disabled="false"
110+
style="position: relative;">
111+
<input type="radio" name="r3" class="flat-red" checked="" style="position: absolute; opacity: 0;"/>
112+
<ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins>
113+
</div>
114+
Dinheiro
115+
</label>
116+
</div>
117+
<div>
118+
<label>
119+
<div class="iradio_flat-red" aria-checked="false" aria-disabled="false"
120+
style="position: relative;">
121+
<input type="radio" name="r3" class="flat-red" checked="" style="position: absolute; opacity: 0;"/>
122+
<ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;"></ins>
123+
</div>
124+
Cartão de Débito
125+
</label>
126+
</div>
127+
128+
</div>
129+
130+
</div>
131+
<!-- /.col -->
132+
<div class="col-sm-6 col-xs-12">
133+
<p class="lead">Frete e Total:</p>
134+
135+
<div class="table-responsive">
136+
<table class="table">
137+
<tbody><tr>
138+
<th style="width:50%">Itens:</th>
139+
<td class="text-right">R$ 20,00</td>
140+
</tr>
141+
<tr>
142+
<th>Frete:</th>
143+
<td class="text-right">R$ 8,00</td>
144+
</tr>
145+
<tr>
146+
<th>Total:</th>
147+
<td class="text-right">R$ 28,00</td>
148+
</tr>
149+
</tbody></table>
150+
</div>
151+
</div>
152+
<!-- /.col -->
153+
</div>
154+
155+
</form>
156+
157+
<div class="row">
158+
<div class="col-xs-12">
159+
<a href="order-summary.html" class="btn btn-success pull-right"><i class="fa fa-credit-card"></i> Concluir Pedido
160+
</a>
161+
</div>
162+
</div>
163+
164+
</section>
165+
</section>
166+
<!-- FIM DO CONTEUDO-->

src/app/order/order.component.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { Component, OnInit } from '@angular/core';
2+
3+
@Component({
4+
selector: 'mt-order',
5+
templateUrl: './order.component.html'
6+
})
7+
export class OrderComponent implements OnInit {
8+
9+
constructor() { }
10+
11+
ngOnInit() {
12+
}
13+
14+
}

0 commit comments

Comments
 (0)