[IMP] pos_restaurant: allow to print bill with web printing

addons/point_of_sale/static/src/js/screens.js

@@ -1394,6 +1394,10 @@ var ReceiptScreenWidget = ScreenWidget.extend({
     click_next: function() {
         this.pos.get_order().finalize();
     },
+    click_back: function() {
+        // Placeholder method for ReceiptScreen extensions that
+        // can go back ...
+    },
     renderElement: function() {
         var self = this;
         this._super();
@@ -1402,6 +1406,11 @@ var ReceiptScreenWidget = ScreenWidget.extend({
                 self.click_next();
             }
         });
+        this.$('.back').click(function(){
+            if (!self._locked) {
+                self.click_back();
+            }
+        });
         this.$('.button.print').click(function(){
             if (!self._locked) {
                 self.print();
@@ -1825,6 +1834,7 @@ var PaymentScreenWidget = ScreenWidget.extend({
 gui.define_screen({name:'payment', widget: PaymentScreenWidget});
 
 return {
+    ReceiptScreenWidget: ReceiptScreenWidget,
     ActionButtonWidget: ActionButtonWidget,
     define_action_button: define_action_button,
     ScreenWidget: ScreenWidget,

addons/point_of_sale/static/src/xml/pos.xml

@@ -1250,7 +1250,7 @@
                 </div>
                 <br />
             </t>
-            <table>
+            <table class='receipt-orderlines'>
                 <colgroup>
                     <col width='50%' />
                     <col width='25%' />
@@ -1274,7 +1274,7 @@
                 </tr>
             </table>
             <br />
-            <table>
+            <table class='receipt-total'>
                 <tr>
                     <td>Subtotal:</td>
                     <td class="pos-right-align">
@@ -1303,7 +1303,7 @@
                 </tr>
             </table>
             <br />
-            <table>
+            <table class='receipt-paymentlines'>
                 <tr t-foreach="paymentlines" t-as="line">
                     <td>
                         <t t-esc="line.name"/>
@@ -1314,7 +1314,7 @@
                 </tr>
             </table>
             <br />
-            <table>
+            <table class='receipt-change'>
                 <tr><td>Change:</td><td class="pos-right-align">
                     <t t-esc="widget.format_currency(order.get_change())"/>
                     </td></tr>

addons/pos_restaurant/static/src/js/printbill.js

@@ -3,12 +3,33 @@ odoo.define('pos_restaurant.printbill', function (require) {
 
 var core = require('web.core');
 var screens = require('point_of_sale.screens');
+var gui = require('point_of_sale.gui');
 
 var QWeb = core.qweb;
 
+var BillScreenWidget = screens.ReceiptScreenWidget.extend({
+    template: 'BillScreenWidget',
+    click_next: function(){
+        this.gui.show_screen('products');
+    },
+    click_back: function(){
+        this.gui.show_screen('products');
+    },
+    render_receipt: function(){
+        this._super();
+        this.$('.receipt-paymentlines').remove();
+        this.$('.receipt-change').remove();
+    },
+    print_web: function(){
+        window.print();
+    },
+});
+
+gui.define_screen({name:'bill', widget: BillScreenWidget});
+
 var PrintBillButton = screens.ActionButtonWidget.extend({
     template: 'PrintBillButton',
-    button_click: function(){
+    print_xml: function(){
         var order = this.pos.get('selectedOrder');
         if(order.get_orderlines().length > 0){
             var receipt = order.export_for_printing();
@@ -18,6 +39,13 @@ var PrintBillButton = screens.ActionButtonWidget.extend({
             }));
         }
     },
+    button_click: function(){
+        if (!this.pos.config.iface_print_via_proxy) {
+            this.gui.show_screen('bill');
+        } else {
+            this.print_xml();
+        }
+    },
 });
 
 screens.define_action_button({

addons/pos_restaurant/static/src/xml/printbill.xml

@@ -1,6 +1,31 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates id="template" xml:space="preserve">
 
+    <t t-name="BillScreenWidget">
+        <div class='receipt-screen screen'>
+            <div class='screen-content'>
+                <div class='top-content'>
+                    <span class='button back'>
+                        <i class='fa fa-angle-double-left'></i>
+                        Back
+                    </span>
+                    <h1>Bill Printing</h1>
+                    <span class='button next'>
+                        Ok 
+                        <i class='fa fa-angle-double-right'></i>
+                    </span>
+                </div>
+                <div class="centered-content">
+                    <div class="button print">
+                        <i class='fa fa-print'></i> Print 
+                    </div>
+                    <div class="pos-receipt-container">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </t>
+
     <t t-name="PrintBillButton">
         <span class="control-button order-printbill">
             <i class="fa fa-print"></i>