[IMP] pos_restaurant: Open tabs Usability

Improve usability of open tabs in the POS.

closes odoo/odoo#56785

X-original-commit: bbe80dcb30c1f5f028bf05cd14a514c627f4ee92
Signed-off-by: pimodoo <pimodoo@users.noreply.github.com>
Signed-off-by: Antoine Prieëls <aprieels@users.noreply.github.com>

addons/point_of_sale/static/src/xml/Screens/PaymentScreen/PaymentScreen.xml

@@ -8,14 +8,14 @@
                     <div class="top-content">
                         <div class="button back"
                               t-on-click="showScreen('ProductScreen')">
-                            <i class="fa fa-angle-double-left"></i>
-                            Back
+                            <i class="fa fa-angle-double-left fa-fw"></i>
+                            <span class="back_text">Back</span>
                         </div>
                         <div class="top-content-center"><h1>Payment</h1></div>
                         <div class="button next" t-att-class="{ highlight: currentOrder.is_paid() }"
                               t-on-click="validateOrder(false)">
-                            Validate
-                            <i class="fa fa-angle-double-right"></i>
+                            <span class="next_text">Validate</span>
+                            <i class="fa fa-angle-double-right fa-fw"></i>
                         </div>
                     </div>
                 </t>

addons/point_of_sale/static/src/xml/Screens/TicketScreen/TicketScreen.xml

@@ -6,7 +6,7 @@
             <div class="screen-content">
                 <div class="controls">
                     <div class="buttons">
-                        <button t-if="showNewTicketButton" class="highlight" t-on-click="createNewOrder">New Ticket</button>
+                        <button t-if="showNewTicketButton" class="highlight" t-on-click="createNewOrder">New Order</button>
                         <button class="discard" t-on-click="trigger('close-screen')">Discard</button>
                     </div>
                     <SearchBar config="searchBarConfig" placeholder="'Search Tickets...'" />

addons/pos_restaurant/__manifest__.py

@@ -42,6 +42,7 @@ This module adds several features to the Point of Sale that are specific to rest
         'static/src/xml/Screens/SplitBillScreen/SplitOrderline.xml',
         'static/src/xml/Screens/ReceiptScreen/OrderReceipt.xml',
         'static/src/xml/Screens/ProductScreen/Orderline.xml',
+        'static/src/xml/Screens/PaymentScreen/PaymentScreen.xml',
         'static/src/xml/Screens/PaymentScreen/PaymentScreenElectronicPayment.xml',
         'static/src/xml/Screens/FloorScreen/FloorScreen.xml',
         'static/src/xml/Screens/FloorScreen/EditBar.xml',

addons/pos_restaurant/static/src/css/restaurant.css

@@ -541,6 +541,7 @@
     height: 100%;
     width: 100%;
     text-align: right;
+    white-space: nowrap;
 }
 
 .ticket-screen .tip-cell input {

addons/pos_restaurant/static/src/js/Screens/TicketScreen.js

@@ -20,10 +20,16 @@ odoo.define('pos_restaurant.TicketScreen', function (require) {
                 }
             }
             get filterOptions() {
-                return [...super.filterOptions, 'Tipping'];
+                var filterOptions = super.filterOptions;
+                if (this.env.pos.config.set_tip_after_payment) {
+                    var idx = filterOptions.indexOf('Payment');
+                    filterOptions[idx] = 'Open';
+                }
+                return [...filterOptions, 'Tipping'];
             }
             get _screenToStatusMap() {
                 return Object.assign(super._screenToStatusMap, {
+                    PaymentScreen: this.env.pos.config.set_tip_after_payment ? 'Open' : super._screenToStatusMap.PaymentScreen,
                     TipScreen: 'Tipping',
                 });
             }

addons/pos_restaurant/static/src/xml/Screens/PaymentScreen/PaymentScreen.xml

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates id="template" xml:space="preserve">
+
+    <t t-name="PaymentScreen" t-inherit="point_of_sale.PaymentScreen" t-inherit-mode="extension" owl="1">
+        <xpath expr="//div[hasclass('button') and hasclass('next')]" position="attributes">
+            <attribute name="t-att-hidden">env.pos.config.set_tip_after_payment and !currentOrder.is_paid()</attribute>
+        </xpath>
+
+        <xpath expr="//div[hasclass('button') and hasclass('back')]/span[hasclass('back_text')]" position="replace">
+            <t t-if="env.pos.config.set_tip_after_payment and currentOrder.is_paid()">
+                <span class="back_text">Keep Open</span>
+            </t>
+            <t t-else="">$0</t>
+        </xpath>
+
+        <xpath expr="//div[hasclass('button') and hasclass('next')]/span[hasclass('next_text')]" position="replace">
+            <t t-if="env.pos.config.set_tip_after_payment and currentOrder.is_paid()">
+                <span class="back_text">Close Tab</span>
+            </t>
+            <t t-else="">$0</t>
+        </xpath>
+    </t>
+
+</templates>

addons/pos_restaurant/static/src/xml/Screens/TipScreen.xml

@@ -19,7 +19,7 @@
                         <h1>Add a tip</h1>
                     </div>
                     <div class="button highlight next" t-on-click="validateTip">
-                        Validate <i class="fa fa-angle-double-right"></i>
+                        Settle <i class="fa fa-angle-double-right"></i>
                     </div>
                 </div>
                 <div class="tip-options">