Odoo POS (Odoo Point Of Sale) is the best all-in-one solution for managing your retail stores, restaurants, accounting, and sales. You can find this simple, intuitive interface on iPods, tablets, and laptops.
We can see how to override a component in POS in this blog. Before we can proceed with programming, we must first understand what a component is. A widget is the most important part of a user interface, or as we can say, most of the components of Odoo’s user interface are controlled by widgets. Stated differently, it is possible to link a template and a widget. Now, let’s look at how it works. The widget renders the template and appends it to the user interface upon initialization.
In order to override a component first, we need to create a js file under static > src > overrides > folder name > file.js.Additionally, remember to include the js file in the manifest file.
'assets': {
'point_of_sale._assets_pos': [
'bg_pos_customer_maximum_discount/static/src/overrides/discount_button/discount_button.js'
],
},
/** @odoo-module */
import { DiscountButton } from '@pos_discount/overrides/components/discount_button/discount_button';
import { patch } from "@web/core/utils/patch";
import { _t } from "@web/core/l10n/translation";
import { AlertPopup } from"@bg_pos_customer_maximum_discount/overrides/utils/alert_popup/alert_popup";
patch(DiscountButton.prototype,
{
if(self.pos.orders[0].partner.discount_type === 'fixed'){
const discount_percentage = self.pos.orders[0].partner.discount;
const total_amount = this.pos.orders[0].get_total_with_tax()
const disc_value = ((val/100)*total_amount)
if (disc_value > discount_percentage){
this.env.services.popup.add(AlertPopup, {
title: _t("Exceed Discount Limit!"),
body: _t("Sorry, Discount is not allowed. Maximum discount for this customer is %s", discount_percentage),
});
}else{
await self.apply_discount(val);
}
}
});
In order to add extra functionality to the discount button first we need to import the component. After that, we need to patch the component which is DiscountButton.Here a popup functionality is added. As we need to add popup functionality, we need to import popup path. Alert popup is our custom, which is shown below.
import { AlertPopup } from"@bg_pos_customer_maximum_discount/overrides/utils/alert_popup/alert_popup"
Then, we can add our functionality as above. This is how we override a component and add extra functionality.