Designing Basket Page and Create Bill Page
Start course
2h 34m

In this course, we will learn the concepts of microservice and spring framework with a focus on Spring Boot.

Learning Objectives

  • Understanding Spring Boot

Intended Audience

  • Beginner Java developers
  • Java developers interested in learning how to Build and Deploy RESTful Web Services
  • Java Developers who want to develop web applications using the Spring framework
  • Java Developers who want to develop web applications with microservices
  • Java Developers who wish to develop Spring Boot Microservices with Spring Cloud


  • Basic Java knowledge

Hello, dear friends. In this video, we will continue building our project with the basket page and create a bill page. Let's begin. First, we will start with the EmployeeController. We need a basket method. GetMapping will be Basket. The method name is Basket and we need a model as a parameter. Now, in the method, we will fill this method and we will redirect the basket page. First, get all sold products. Now, we need an empty SoldProduct list for sp in all sold products. If sp.isIn_basket equals true, we have to add this item to the soldProduct list. Now, we also need all products. Let's set the soldProduct list and all product list to the model return basket page. Okay, done.

Now, we need a basket page. Add a new HTML file named Basket. Add thymeLeaf libraries. Add layout and change the content fragment. If sold products list size is greater than zero, Now, I'll use two nested loops. First, sold products. Each sold product in sold products, now to get product name and price, we need the product list. Each product in the product list. If Now, this means this product is in the basket. Let's show the details.

A h5 tag for product name. A p tag for piece. Another p tag for price. Now, we need two buttons, for creating a bill and adding a sale. To cancel and clear the basket, we need a 'Cancel' button. If you want you can define 'Delete' buttons for each sold product. I don't want to have the same operation. We have already made this available on the list page. I will delete all the sold products together. Before we go back to the controller, let's add a message for the empty list. Unless soldProducts > 0, the basket is empty. Okay, done.

Let's modify the menu item and the employee layout to access the basket page. Now, we can try. Run the project. Login as employee and go to the basket page, As you can see, our basket page is working. Now, we can create the bill. Let's go back to the controller. To create bills, we need a new page. First method, GetMapping, createBill. Name will be createBill. First, get all bill from bill service. Now, we have all bills, but we only need unconfirmed bills. To find an instance from bill, let's use a for loop. If the bill employee confirmed is false, now we have to use this bill so we can set it to the new bill instance. Before set model, we have to calculate the total price also.

First, get all soldProducts, We will calculate the total price only for in basket items. Total price plus equals piece multiply price. That's enough. Let's set total price to the bill model. Now, set bill model to the model, and now we can redirect the page. Our page will be createBill. Okay, done. Let's add the createBill page. Add a new HTML and name it createBill. Add thymeLeaf libraries. Adjust layout and fragment. Okay, done. First we need a form, but this form's method must be post.

The action will be saveBill, we will define this in the next video. We need two hidden inputs. First one is ID, second one is total_price. Now, add a label for customer name. Now, an input for customer name. copy for customer surname, copy for total price. We need a 'Save' button.

Done. The page is ready. Let's save bill to our project. Actually, let's take a short break here. In the next video, we will continue with creating bills and implement the cancel sale operation. So, I'll see you in the next video.


About the Author
Learning Paths

OAK Academy is made up of tech experts who have been in the sector for years and years and are deeply rooted in the tech world. They specialize in critical areas like cybersecurity, coding, IT, game development, app monetization, and mobile development.