Book Image

Odoo 14 Development Cookbook - Fourth Edition

By : Parth Gajjar, Alexandre Fayolle, Holger Brunn, Daniel Reis
5 (2)
Book Image

Odoo 14 Development Cookbook - Fourth Edition

5 (2)
By: Parth Gajjar, Alexandre Fayolle, Holger Brunn, Daniel Reis

Overview of this book

With its latest iteration, the powerful Odoo framework released a wide variety of features for rapid application development. This updated Odoo development cookbook will help you explore the new features in Odoo 14 and learn how to use them to develop Odoo applications from scratch. You'll learn about the new website concepts in Odoo 14 and get a glimpse of Odoo's new web-client framework, the Odoo Web Library (OWL). Once you've completed the installation, you'll begin to explore the Odoo framework with real-world examples. You'll then create a new Odoo module from the ground up and progress to advanced framework concepts. You'll also learn how to modify existing applications, including Point of Sale (POS) applications. This book isn't just limited to backend development; you'll discover advanced JavaScript recipes for creating new views and widgets. As you progress, you'll learn about website development and become a quality Odoo developer by studying performance optimization, debugging, and automated testing. Finally, you'll delve into advanced concepts such as multi-website, In-App Purchasing (IAP),, the IoT Box, and security. By the end of the book, you'll have all the knowledge you need to build impressive Odoo applications and you'll be well versed in development best practices that will come in handy when working with the Odoo framework.
Table of Contents (26 chapters)

Modifying the Point of Sale screen UI

The UI of the Point of Sale application is written with the OWL QWeb template. In this recipe, we will learn how you can modify UI elements in the Point of Sale application.

Getting ready

In this recipe, we will be using the pos_demo module created in the Making RPC calls recipe. We will modify the UI of the product card and display the profit margin per product.

How to do it...

Follow these steps to display the profit margin on the product card:

  1. Add the following code to the /static/src/js/pos_demo.js file to fetch the extra field for the product's actual price:
    const pos_model = require('point_of_sale.models');
    pos_model.load_fields("product.product", ["standard_price"]);
  2. Add the following code to /static/src/xml/pos_demo.xml in order to display a profit margin product card:
    <t t-name="ProductItem" t-inherit="point_of_sale.ProductItem"    t-inherit...