Managing orders - Spring MVC sample | Tradenity documentations for developers

Manage orders, create, list, view details and refund.

Checkout

@RequestMapping(method = RequestMethod.GET, path="/checkout")
public String newInstance(@CurrentUser User user, Model model){
    Customer customer = customerService.findByEmail(user.getEmail());
    Order order = new Order(customer);
    order.setShippingAddress(createAddress());
    order.setBillingAddress(createAddress());
    model.addAttribute("order", order);
    return "orders/new";
}

Placing orders

@RequestMapping(method = RequestMethod.GET, path="/checkout")
public String newInstance(@CurrentUser User user, Model model){
    Customer customer = customerService.findByEmail(user.getEmail());
    Order order = new Order(customer);
    order.setShippingAddress(createAddress());
    order.setBillingAddress(createAddress());
    model.addAttribute("order", order);
    return "orders/new";
}

The order form consists of two parts:

First: customer information, this is a normal thymeleaf form.

src/main/resources/templates/orders/new.html

<form id="payment-form" th:action="@{/orders/checkout}" method="post" th:object="${order}">
    <input type="hidden" name="token" value="" />
    <div class="reg-form">
        <div>
            <h3>Personal Information</h3>

            <ul>
                <li class="text-info">First Name: </li>
                <li><input type="text" th:field="*{customer.firstName}" /></li>
            </ul>
            <ul>
                <li class="text-info">Last Name: </li>
                <li><input type="text" value="" th:field="*{customer.lastName}"/></li>
            </ul>
            <ul>
                <li class="text-info">Email: </li>
                <li><input type="text" value="" th:field="*{customer.email}"/></li>
            </ul>
            <h3>Billing Address</h3>
            <ul>
                <li class="text-info">Address Line 1: </li>
                <li><input type="text" value="" th:field="*{billingAddress.streetLine1}"/></li>
            </ul>
            <ul>
                <li class="text-info">Address Line 2:</li>
                <li><input type="text" value="" th:field="*{billingAddress.streetLine2}"/></li>
            </ul>

Second: The Stripe form, these fields will be handled by stripe.js

Please Note that these fields do not contain name attribute, this prevent the credit card information from being posted to Tradenity servers.

src/main/resources/templates/orders/new.html

<h3>Credit Card Information</h3>
<ul>
    <li class="text-info">Card Holder Name: </li>
    <li><input id="card_holder_name" type="text" value="" /></li>
</ul>
<ul>
    <li class="text-info">Card Number: </li>
    <li><input id="card_number" type="text" value="4242424242424242" data-stripe="number"/></li>
</ul>
<ul>
    <li class="text-info">CVC: </li>
    <li><input id="cvc" type="text" value="123" data-stripe="cvc"/></li>
</ul>
<ul>
    <li class="text-info">Expiration Date: </li>
    <li>
        Month: <input type="text" value="12" style="width: 100px;" data-stripe="exp-month"/>
        Year: <input type="text" value="2017" style="width: 100px;" data-stripe="exp-year"/>
    </li>
</ul>

@RequestMapping(method = RequestMethod.POST, path="/checkout")
public String create(@CurrentUser User user, @Valid @ModelAttribute Order order, BindingResult result, @RequestParam("token") String stripeToken, HttpSession session, Model model, RedirectAttributes ra){
    if(result.hasErrors()){
        if(stripeToken != null && !stripeToken.trim().isEmpty()){
            session.setAttribute("stripToken", stripeToken);
            model.addAttribute("stripTokenAvailable", true);
        }
        return "orders/new";
    }else{
        System.out.println("Recieved Billing Address: "+order.getBillingAddress());
        Customer customer = user.toCustomer();
        order.setCustomer(customer);
        Transaction transaction = orderService.checkout(order, stripeToken);
        ra.addAttribute("orderId", transaction.getOrder().getId());
        return "redirect:/orders/{orderId}";
    }
}

List all customer orders

@RequestMapping(method = RequestMethod.GET, path = {"", "/"})
public String index(@CurrentUser User user, Model model, Pageable pageable){
    model.addAttribute("orders", orderService.findAllByCustomer(user.toCustomer(), Utils.mapPageable(pageable)));
    return "orders/index";
}

src/main/resources/templates/orders/index.html

<h2>MY ORDERS </h2>
<div th:if="${#lists.isEmpty(orders)}">
    <h1>You did not yet placed any orders</h1>
</div>
<div th:unless="${#lists.isEmpty(orders)}" class="cart-gd">
    <table class="table">
        <thead>
        <tr>
            <th>Order ID</th>
            <th>Creation Date</th>
            <th>Total Price</th>
            <th>Status</th>
            <th>Action</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="o : ${orders}">
            <td>
                <a href="#" th:href="@{'/orders/'+${o.id} }" th:text="${o.id}"></a>
            </td>
            <td th:text="${o.createdAt}"></td>
            <td th:text="${o.total}"></td>
            <td th:text="${o.status}"></td>
            <td>
                <form th:action="@{'/orders/'+${o.id} }" method="post">
                    <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
                    <input type="hidden" name="_method" value="DELETE" />
                    <input type="submit" value="Refund"/>
                </form>
            </td>
        </tr>
        </tbody>
    </table>
</div>

Display order details

@RequestMapping(method = RequestMethod.GET, path = "/{orderId}")
public String show(@PathVariable("orderId")String orderId, Model model){
    model.addAttribute("order", orderService.findById(orderId));
    return "orders/show";
}

src/main/resources/templates/orders/show.html

<h2>Order Details </h2>
<table class="table">
    <tbody>
    <tr>
        <td colspan="2">
            <h4 style="text-align: center;">Summery</h4>
        </td>
    </tr>
    <tr>
        <th>Order ID</th>
        <td th:text="${order.id}"></td>
    </tr>
    <tr>
        <th>Creation Date</th>
        <td th:text="${order.createdAt}"></td>
    </tr>
    <tr>
        <th>Total price</th>
        <td th:text="${order.total}"></td>
    </tr>
    <tr>
        <th>Status</th>
        <td th:text="${order.status}"></td>
    </tr>
    <tr>
        <td colspan="2">
            <h4 style="text-align: center;">Item details</h4>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <table class="table">
                <thead>
                <tr>
                    <th>Product</th>
                    <th>Quantity</th>
                    <th>Unit Price</th>
                    <th>Total</th>
                </tr>
                </thead>
                <tbody>
                <tr th:each="i : ${order.items}">
                    <td th:text="${i.product.title}"></td>
                    <td th:text="${i.quantity}"></td>
                    <td th:text="${i.unitPrice}"></td>
                    <td th:text="${i.total}"></td>
                </tr>
                </tbody>
            </table>
        </td>
    </tr>
    </tbody>
</table>

Refund Order

src/main/resources/templates/orders/index.html

<form th:action="@{'/orders/'+${o.id} }" method="post">
    <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
    <input type="hidden" name="_method" value="DELETE" />
    <input type="submit" value="Refund"/>
</form>

@RequestMapping(method = RequestMethod.DELETE, path="/{orderId}")
public String refund(@PathVariable("orderId") String orderId, RedirectAttributes ra){
    Transaction transaction = orderService.refund(orderId);
    ra.addAttribute("orderId", transaction.getOrder().getId());
    return "redirect:/orders/{orderId}";
}