How To Customize POS Receipt In Odoo

And the POS receipt or the bill receipt generated by this POS looks something like this:

The inheritance of the template is slightly different from what we do in the inheritance of the qweb where we use ‘<xpath>’ to give a path for inheritance.

Here, we’ll use ‘<t-extend>’ to give the path of the template we are inheriting.

And we’ll use ‘<t-jquery>’  and ‘<t-operation>’ to apply the changes.

In this case, we’ll try to change the POS receipt and add the customer's name to the POS receipt if a customer is selected at the screen for that order.

< ---- Code Starts ---- >
 
<?xml version="1.0" encoding="UTF-8"?>
<templates id="template" xml:space="preserve">
    <t t-extend="OrderReceipt">
        <t t-jquery=".pos-receipt .pos-receipt-contact" t-operation='append'>
 
            <t t-if='receipt.client'>
                <div>Client:<t t-esc='receipt.client' /></div>
            </t>
        </t>
    </t>
</templates>
 
< ---- Code Ends ---- >

In the Above Code:

1) templates id= “template”   ; because we are inheriting the template record.

2)<t t-extend="OrderReceipt">   ; Extending the template ‘OrderReceipt’.

3) <t t-jquery=".pos-receipt .pos-receipt-contact" t-operation='append'> ; Mentioning the name of the class that we are applying operation on, in this case we have to inherit the ‘pos-receipt-contact’ class of the ‘pos-receipt’ class.  And mention the operation that we need to perform. In this case, we are adding the ‘client name’ to the ‘pos-receipt-contact’ class so we’ll use ‘append’.

4) <div>Client:<t t-esc='receipt.client' /></div> ; Adding the Client name to the receipt.

"Important Note:  In case, you want to change the whole layout of the receipt, you can use operation ‘replace’ on the class ‘pos-receipt’."

Now the xml file is done. The next step is to make sure that the ‘__manifest__.py’ file is configured properly.

< ----- Code Starts ----->
 
{
    'name': 'POS Custom Receipt',
    'version': '1.0',
    'category': 'Point Of Sale',
    'summary': 'Customized Receipt of Point Of Sales',
    'website': 'www.kanakinfosystems.com',
    'author': 'Kanak Infosystems LLP.',
    'depends': ['base', 'point_of_sale'],
    "data": [],
    'demo': [],
    'qweb': ['static/src/xml/pos.xml'],
    'installable': True,
}
 
< ---- Code Ends ---->

After the ‘__manifest__.py’ file is done, the module is ready to be installed. Just install the module & you can see that the POS receipt is inherited & the client/customer name would be showing where we added the field.