Hello friends. In this video, we'll work on the sales operations on the employee product list page. Let's begin. First, I want to start with the controller. Open EmployeeController. On this page, we will sell a product that is added to the basket. We'll start by adding products to the basket. And after we create a bill for it, the sale will be complete. After that, we will prove this bill as an employee and as an administrator. First, we need a new page for adding products to the basket. Add a new method and call it ProductDetail. This will take an ID parameter with a PathVariable. Path will be ProductDetail. Now, in this, we'll get the ProductById. Now, set this product to the model.

Also, for adding to the basket, we have to add a soldProduct entity. Set to the model. Now, return to the ProductDetail page. We don't have a product detail page yet but we will add one. Let's add. Add a new HTML and name it ProductDetail. On this page, we can see the product's price, name, and stock amount together. We can copy the codes from the add product page if you like, but I want to design a new page.

First, I need some p tags to show the product name, price, and stock amount. Now, we need a form. With this forms action, we will add products to the basket with the selected quantity, so I wanted to find a new action. AddBasket, method will be post. In this form, we only needed the desired product quantity. Now add an input with a stock order ID. Done.

For example, suppose you have 200 Lenovo computers in stock, but try to sell 300. This is an error and we must prevent the scenario. I'd like to create this action using Javascript. First add a label or you can use an h tag, ID will be stockAlert. Let's set the error message. Also, we need a hidden input for the productId. Now, a button for the Add Basket process. Done. The design is ready. Let's check the stock amount with Javascript. I want to use the keyup function of order stock input. First, we have to hide the alert. Now, stock order keyup.

Now, we have to get the stock amount and the desired product amount. Let's calculate the remaining stock. If the remaining stock is less than zero, there's a problem and we must display a stockAlert. For this instance, let's disable the button. Else, hide stockAlert and enable button. Okay, done. That's enough for now. If you want, let's try to test the Javascript on the page. Run the project and login as an employee. Now, try to add to basket. Look, our page is ready.

Now, try 500. And look, we have an error message and the button is disabled. Change to five. And look, the button is now active. Done. Let's take a quick break here. And in the following video, we'll go over the add basket and create bill operations. I'll see you in the following video.