[IMP] pos*: add tax info on receipt

pos*: point_of_sale,l10n_ae_pos, l10n_gcc_pos

Currently, the pos receipt shows the total amount of taxes paid.
Different localisations require more information regarding the taxes
to be shown on the receipt.

In this PR we improve the receipt by adding specific information
for each of the applied taxes and a mechanism that would allow
each localization to more easily display the proper tax information.

This change makes it so the pos is in accordance with the United Arab Emirates
regulations by default. This means that we are removing the `l10n_ae_pos`
module, as we no longer need it.

closes odoo/odoo#125418

Task: 3305403
Related: odoo/upgrade#4858
Signed-off-by: Joseph Caburnay (jcb) <jcb@odoo.com>

addons/l10n_ae_pos/__manifest__.py

@@ -1,20 +0,0 @@
-# -*- coding: utf-8 -*-
-# Part of Odoo. See LICENSE file for full copyright and licensing details.
-{
-    'name': 'United Arab Emirates - Point of Sale',
-    'countries': ['ae'],
-    'author': 'Odoo PS',
-    'category': 'Accounting/Localizations/Point of Sale',
-    'description': """
-United Arab Emirates POS Localization
-=======================================================
-    """,
-    'depends': ['l10n_ae', 'point_of_sale'],
-    'auto_install': True,
-    'license': 'LGPL-3',
-    'assets': {
-        'point_of_sale._assets_pos': [
-            'l10n_ae_pos/static/src/**/*',
-        ],
-    },
-}

addons/l10n_ae_pos/static/src/overrides/components/order_receipt/order_receipt.xml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<templates id="template" xml:space="preserve">
-    <t t-name="l10n_ae_pos.OrderReceiptVAT" t-inherit="point_of_sale.OrderReceipt" t-inherit-mode="extension" owl="1">
-        <xpath expr="//div[@id='post_receipt_taxes_container']" position="replace">
-            <div id='post_receipt_taxes_container'>
-                <t t-if="pos.company.country?.code == 'AE'">VAT</t>
-                <t t-else="">Total Taxes</t>
-                <span t-esc="env.utils.formatCurrency(receipt.total_tax)" class="pos-receipt-right-align"/>
-            </div>
-        </xpath>
-    </t>
-</templates>

addons/l10n_gcc_pos/static/src/overrides/components/order_receipt/order_receipt.xml

@@ -84,14 +84,9 @@
             </div>
         </xpath>
 
-        <xpath expr="//span[@t-esc='env.utils.formatCurrency(receipt.total_tax)']/.." position="attributes">
-            <attribute name="t-if">!receipt.is_gcc_country</attribute>
-        </xpath>
-        <xpath expr="//span[@t-esc='env.utils.formatCurrency(receipt.total_tax)']/.." position="after">
-            <div t-if="receipt.is_gcc_country" t-translation="off">
-                Total Taxes / إجمالي الضرائب
-                <span t-esc="env.utils.formatCurrency(receipt.total_tax)" class="pos-receipt-right-align"/>
-            </div>
+        <xpath expr="//div[hasclass('pos-receipt-taxes')]/span[text()='Total']" position="replace">
+            <span t-if="receipt.is_gcc_country" t-translation="off">Total Taxes / إجمالي الضرائب</span>
+            <span t-else="">Total</span>
         </xpath>
     </t>
 

addons/point_of_sale/static/src/app/screens/receipt_screen/receipt/receipt.js

@@ -34,4 +34,21 @@ export class OrderReceipt extends Component {
     get shippingDate() {
         return this.receiptEnv.shippingDate;
     }
+
+    /**
+     * @param {object} line item of the array given by `this.receiptEnv.orderlines`
+     * @returns {object} the corresponding tax objects from `pos.taxes_by_id`
+     */
+    getOrderlineTaxes(line) {
+        return Object.keys(line.tax_details).map((taxId) => this.pos.taxes_by_id[taxId]);
+    }
+
+    /**
+     * Override this method to customize the tax letter mapping.
+     * @param {array} taxes array of tax objects from `pos.taxes_by_id`
+     * @returns {string} the tax letter
+     */
+    getTaxLetter(...taxes) {
+        return "";
+    }
 }

addons/point_of_sale/static/src/app/screens/receipt_screen/receipt/receipt.xml

@@ -104,18 +104,27 @@
                     <span t-esc="env.utils.formatCurrency(receipt.total_discount)" class="pos-receipt-right-align"/>
                 </div>
             </t>
-            <t t-if="isTaxIncluded">
-                <t t-foreach="receipt.tax_details" t-as="tax" t-key="tax.name">
-                    <div>
-                        <t t-esc="tax.name" />
-                        <span t-esc="env.utils.formatCurrency(tax.amount, false)" class="pos-receipt-right-align"/>
-                    </div>
+            <div t-if="isTaxIncluded" class="pos-receipt-taxes">
+                <span />
+                <span>VAT%</span>
+                <span>VAT</span>
+                <span>ExVAT</span>
+                <span>Total</span>
+                <t t-foreach="receipt.tax_details" t-as="tax" t-key="tax.tax.id">
+                    <span t-esc="getTaxLetter(tax.tax)" />
+                    <span><t t-esc="tax.tax.amount"/> %</span> 
+                    <span t-esc="env.utils.formatCurrency(tax.amount, false)" />
+                    <span t-esc="env.utils.formatCurrency(tax.base, false)" />
+                    <span t-esc="env.utils.formatCurrency(tax.amount + tax.base, false)" />
                 </t>
-                <div id="post_receipt_taxes_container">
-                    Total Taxes
-                    <span t-esc="env.utils.formatCurrency(receipt.total_tax)" class="pos-receipt-right-align"/>
-                </div>
-            </t>
+                <t t-if="receipt.tax_details.length > 1">
+                    <span />
+                    <span />
+                    <span t-esc="env.utils.formatCurrency(receipt.total_tax, false)" />
+                    <span t-esc="env.utils.formatCurrency(receipt.total_without_tax, false)" />
+                    <span t-esc="env.utils.formatCurrency(receipt.total_with_tax, false)" />
+                </t>
+            </div>
 
             <div class="before-footer" />
 
@@ -207,9 +216,10 @@
                 <t t-if="!line.is_in_unit" t-esc="line.unit_name" />
                 x
                 <t t-esc="env.utils.formatCurrency(line.price_display_one)" />
-                <span class="price_display pos-receipt-right-align">
-                    <t t-esc="env.utils.formatCurrency(line.price_display, false)" />
-                </span>
+                <div class="price_display pos-receipt-right-align">
+                    <span t-esc="env.utils.formatCurrency(line.price_display, false)" />
+                    <span t-esc="getTaxLetter(...getOrderlineTaxes(line))" class="tax-letter" /> 
+                </div>
             </div>
             <t t-if="line.customer_note">
                 <div class="pos-receipt-left-padding pos-receipt-customer-note">

addons/point_of_sale/static/src/app/store/models.js

@@ -778,6 +778,7 @@ export class Orderline extends PosModel {
             price_without_tax: this.get_price_without_tax(),
             price_with_tax_before_discount: this.get_price_with_tax_before_discount(),
             tax: this.get_tax(),
+            tax_details: this.get_tax_details(),
             product_description: this.get_product().description,
             product_description_sale: this.get_product().description_sale,
             pack_lot_lines: this.get_lot_lines(),
@@ -995,7 +996,10 @@ export class Orderline extends PosModel {
         );
         all_taxes.taxes.forEach(function (tax) {
             taxtotal += tax.amount;
-            taxdetail[tax.id] = tax.amount;
+            taxdetail[tax.id] = {
+                amount: tax.amount,
+                base: tax.base,
+            };
         });
 
         return {
@@ -2299,7 +2303,10 @@ export class Order extends PosModel {
             var ldetails = line.get_tax_details();
             for (var id in ldetails) {
                 if (Object.hasOwnProperty.call(ldetails, id)) {
-                    details[id] = (details[id] || 0) + ldetails[id];
+                    details[id] = {
+                        amount: (details[id]?.amount || 0) + ldetails[id].amount,
+                        base: (details[id]?.base || 0) + ldetails[id].base,
+                    };
                 }
             }
         });
@@ -2307,7 +2314,8 @@ export class Order extends PosModel {
         for (var id in details) {
             if (Object.hasOwnProperty.call(details, id)) {
                 fulldetails.push({
-                    amount: details[id],
+                    amount: details[id].amount,
+                    base: details[id].base,
                     tax: this.pos.taxes_by_id[id],
                     name: this.pos.taxes_by_id[id].name,
                 });

addons/point_of_sale/static/src/css/pos_receipts.css

@@ -13,6 +13,11 @@
 
 .pos-receipt .pos-receipt-right-align {
     float: right;
+    display: flex;
+}
+
+.pos-receipt .pos-receipt-right-align .tax-letter{
+    margin-left: 0.5em;
 }
 
 .pos-receipt .pos-receipt-center-align {
@@ -81,3 +86,10 @@
 .responsive-price > .pos-receipt-right-align {
     margin-left: auto;
 }
+
+.pos-receipt .pos-receipt-taxes {
+    display: grid;
+    grid-template-columns: min-content min-content auto auto auto;
+    width: 100%;
+    justify-items: end;
+}