buy.html
Home
/
application /
src /
main /
webapp /
WEB-INF /
views /
buy.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<title>Customer registration</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href=""
th:href="@{/resources/css/bootstrap.min.css}" />
<link rel="stylesheet" href=""
th:href="@{/resources/css/bootstrap-responsive.min.css}" />
<style type="text/css">
body {
padding-top: 20px;
padding-bottom: 40px;
}
/* Custom container */
.container-narrow {
margin: 0 auto;
max-width: 700px;
}
.container-narrow>hr {
margin: 30px 0;
}
/* Main marketing message and sign up button */
.jumbotron {
margin: 60px 0;
text-align: center;
}
.jumbotron h1 {
font-size: 72px;
line-height: 1;
}
.jumbotron .btn {
font-size: 21px;
padding: 14px 24px;
}
/* Supporting marketing content */
.marketing {
margin: 60px 0;
}
.marketing p+h4 {
margin-top: 28px;
}
.promotional {
margin: auto;
width: 550px;
}
.promotional .pull-left {
padding-right: 10px;
}
.left-column table td,.right-column table td {
width: 150px;
text-align: center;
}
.myLabel {
width: 150px;
font-weight: bold;
text-align: right;
}
.content {
margin-left: 10px;
}
.payment .myLabel {
width: 250px;
}
</style>
</head>
<body>
<div class="container-narrow">
<div th:if="${!errors.isEmpty()}" class="alert alert-error">
<div th:each="error : ${errors}" th:text="${error}"></div>
</div>
<div th:unless="${!errors.isEmpty()}">
<form th:action="@{/buy-confirm(C_ID=${customer.CId})}" method="get">
<div class="masthead">
<ul class="nav nav-pills pull-right">
<li><a href="#" th:href="@{${searchUrl}}">Search</a></li>
<li><a href="#" th:href="@{${shoppingCartUrl}}">Shopping
cart</a></li>
<li><a href="#" th:href="@{${orderInquiryUrl}}">Order
list</a></li>
</ul>
<h3 class="muted">
<a href="/" th:href="@{${homeUrl}}"><img
th:src="@{/resources/img/logo-CloudScale.png}" /></a>
</h3>
</div>
<hr />
<div class="billing-info">
<h2>Billing information:</h2>
<table>
<tr>
<td>Firstname:</td>
<td th:text="${customer.CFname}"></td>
</tr>
<tr>
<td>Lastname:</td>
<td th:text="${customer.CLname}"></td>
</tr>
</table>
<div class="pull-left myLabel">Address street1:</div>
<div class="pull-left content"
th:text="${customer.address.addrStreet1}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Address street2:</div>
<div class="pull-left content"
th:text="${customer.address.addrStreet2}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">City:</div>
<div class="pull-left content"
th:text="${customer.address.addrCity}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">State:</div>
<div class="pull-left content"
th:text="${customer.address.addrState}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Zip:</div>
<div class="pull-left content"
th:text="${customer.address.addrZip}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Country:</div>
<div class="pull-left content"
th:text="${customer.address.country.coName}"></div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Email</div>
<div class="pull-left content" th:text="${customer.CEmail}">
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Phone:</div>
<div class="pull-left content" th:text="${customer.CPhone}">
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Address street1:</div>
<div class="pull-left content"
th:text="${customer.address.addrStreet1}"></div>
<div class="clearfix"></div>
</div>
<hr />
<div class="shipping-info">
<h2>Shipping information:</h2>
<div class="pull-left myLabel">Address street1:</div>
<div class="pull-left content">
<input type="text" name="street1" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Address street 2:</div>
<div class="pull-left content">
<input type="text" name="street2" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">City:</div>
<div class="pull-left content">
<input type="text" name="city" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">State:</div>
<div class="pull-left content">
<input type="text" name="state" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Zip:</div>
<div class="pull-left content">
<input type="text" name="zip" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Country:</div>
<div class="pull-left content">
<input type="text" name="country" />
</div>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
<hr />
<h2>Order information:</h2>
<div>
<table class="table">
<thead>
<tr>
<th>OTY</th>
<th>Product</th>
</tr>
</thead>
<tbody>
<tr th:each="line, i : ${cart.shoppingCartLines}">
<td th:text="${line.sclQty}"></td>
<td>Title: <i th:text="${line.item.ITitle}"></i> - Backing:
<span th:text="${line.item.IBacking}"></span><br /> SRP. $<span
th:text="${line.item.ISrp}"></span> <span style="color: red;"><strong>Your
Price: <span th:text="${line.item.ICost}"></span>
</strong></span>
</td>
</tr>
</tbody>
</table>
</div>
<div>
Subtotal width discount (0.0%): $<span th:text="${subTotal}"></span><br />
Tax:<br /> Shipping and Handling: <br /> Total: $<span
th:text="${subTotal}"></span><br />
</div>
<hr />
<div class="payment">
<div class="pull-left myLabel">CreditCartType</div>
<div class="pull-left content">
<label class="radio pull-left"> <input type="radio"
name="CC_TYPE" value="Visa" checked="checked" />Visa
</label> <label class="radio pull-left"> <input type="radio"
name="CC_TYPE" value="MasterCard" />MasterCard
</label> <label class="radio pull-left"> <input type="radio"
name="CC_TYPE" value="Discover" />Discover
</label> <label class="radio pull-left"> <input type="radio"
name="CC_TYPE" value="Amex" />American Express
</label> <label class="radio pull-left"> <input type="radio"
name="CC_TYPE" value="Diners" />Diners
</label>
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Name on Credit Card</div>
<div class="pull-left content">
<input name="CC_NAME" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Credit Card Number</div>
<div class="pull-left content">
<input name="CC_NUMBER" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Credit Card Expiration Date
(mm/dd/yyyy)</div>
<div class="pull-left content">
<input name="CC_EXPIRY" />
</div>
<div class="clearfix"></div>
<div class="pull-left myLabel">Shipping method</div>
<div class="pull-left content">
<label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="AIR" checked="checked" />AIR
</label> <label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="UPS" />UPS
</label> <label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="FEDEX" />FEDEX
</label> <label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="SHIP" />SHIP
</label> <label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="COURIER" />COURIER
</label> <label class="radio pull-left"> <input type="radio"
name="SHIPPING" value="MAIL" />MAIL
</label>
</div>
<div class="clearfix"></div>
</div>
<input th:if="${cart}" th:value="${cart.scId}" type="hidden"
name="SHOPPING_ID" /> <input th:if="${customer}"
th:value="${customer.CId}" type="hidden" name="C_ID" /> <input
class="btn btn-primary" type="submit" value="Submit" />
</form>
</div>
</div>
</body>
</html>