Feb 9 [UPDT] : Updated 'simplified_pos'

simplified_pos/__manifest__.py

@@ -21,7 +21,7 @@
 ###############################################################################
 {
     'name': 'Simplified POS',
-    'version': '16.0.1.0.0',
+    'version': '16.0.1.1.0',
     'category': 'Point of Sale',
     'summary': 'All aspects of POS on a single page.',
     'description': 'A straightforward point-of-sale system that enables '
@@ -39,7 +39,6 @@
             'simplified_pos/static/src/js/ConfirmationPopup.js',
             'simplified_pos/static/src/js/PrintPopup.js',
             'simplified_pos/static/src/js/ProductScreenPaymentLine.js',
-            'simplified_pos/static/src/js/ProductWidgetSimple.js',
             'simplified_pos/static/src/scss/pos.scss',
             'simplified_pos/static/src/xml/ProductScreen.xml',
             'simplified_pos/static/src/xml/OrderWidget.xml',

simplified_pos/doc/RELEASE_NOTES.md

@@ -4,3 +4,9 @@
 #### ADD
 
 - Initial commit for Simplified POS
+
+#### 07.02.2024
+#### Version 16.0.1.1.0
+#### UPDT
+
+- Updated Simplified POS to include control buttons and invoice button. Fixed the style Issues.

simplified_pos/static/description/index.html

@@ -165,7 +165,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 This is the new point
                 of sale frame.</p>
-            <img src="assets/screenshots/s_pos_01.png" class="img-thumbnail">
+            <img src="assets/screenshots/1.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -174,7 +174,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 We can search for
                 products here.</p>
-            <img src="assets/screenshots/s_pos_02.png" class="img-thumbnail">
+            <img src="assets/screenshots/2.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -186,7 +186,7 @@
                 clicked, it is added to the order lines and the total is
                 displayed beneath it. We can adjust the amount,
                 price, and discount using the number pad.</p>
-            <img src="assets/screenshots/s_pos_03.png" class="img-thumbnail">
+            <img src="assets/screenshots/3.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -197,16 +197,17 @@
                 We can select the
                 necessary payment options, which can be shown beneath the
                 summary.</p>
-            <img src="assets/screenshots/s_pos_04.png" class="img-thumbnail">
+            <img src="assets/screenshots/4.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
             <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">
-                Choose Customer</h3>
+                Choose Customer, Invoice</h3>
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
-                By pressing the search
-                button, we may choose a customer.</p>
-            <img src="assets/screenshots/s_pos_05.png" class="img-thumbnail">
+                By pressing the search button, you can choose a customer.
+                Additionally, if you want to generate an invoice,
+                simply click the invoice button.</p>
+            <img src="assets/screenshots/5.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -215,7 +216,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 Click this to validate
                 the order.</p>
-            <img src="assets/screenshots/s_pos_06.png" class="img-thumbnail">
+            <img src="assets/screenshots/6.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -224,7 +225,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 Click confirm to
                 confirm order else click cancel.</p>
-            <img src="assets/screenshots/s_pos_07.png" class="img-thumbnail">
+            <img src="assets/screenshots/7.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -233,7 +234,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 Click print to print
                 the order.</p>
-            <img src="assets/screenshots/s_pos_08.png" class="img-thumbnail">
+            <img src="assets/screenshots/8.png" class="img-thumbnail">
         </div>
 
         <div style="display: block; margin: 30px auto;">
@@ -242,7 +243,7 @@
             <p style="font-weight: 400; font-family: 'Montserrat', sans-serif; font-size: 14px;">
                 To access the new
                 order, click New Order.</p>
-            <img src="assets/screenshots/s_pos_09.png" class="img-thumbnail">
+            <img src="assets/screenshots/9.png" class="img-thumbnail">
         </div>
     </div>
 </div>

simplified_pos/static/src/js/ProductScreen.js

@@ -80,6 +80,11 @@ odoo.define('point_of_sale.customer', function (require) {
             _selectLine(event) {
                 this.env.pos.selectedOrder.select_orderline(event.detail.orderline);
             }
+            toggleIsToInvoice() {
+                // click_invoice
+                this.currentOrder.set_to_invoice(!this.currentOrder.is_to_invoice());
+                this.render(true);
+            }
 
         }
     Registries.Component.extend(ProductScreen, CustomerButtons);

simplified_pos/static/src/js/ProductWidgetSimple.js

@@ -1,24 +0,0 @@
-odoo.define('point_of_sale.ProductsWidgetSimple', function (require) {
-    'use strict';
-    const Registries = require('point_of_sale.Registries');
-    const ProductsWidget = require('point_of_sale.ProductsWidget');
-    const ProductsWidgetSimple = (ProductsWidget) =>
-        class extends ProductsWidget {
-            setup() {
-                super.setup();
-            }
-            get productsToDisplay() {
-                /* This function is override to remove products showing before hand.*/
-                let list = [];
-                if (this.searchWord !== '') {
-                    list = this.env.pos.db.search_product_in_category(
-                        this.selectedCategoryId,
-                        this.searchWord
-                    );
-                }
-                return list.sort(function (a, b) { return a.display_name.localeCompare(b.display_name) });
-            }
-        };
-    Registries.Component.extend(ProductsWidget, ProductsWidgetSimple);
-    return ProductsWidgetSimple;
-});

simplified_pos/static/src/scss/pos.scss

@@ -1,34 +1,34 @@
 .pos .leftpane {
     background: $gray-200;
     float:left;
-    height: 98%;
+    height: 100%;
     display: flex;
     flex-direction: column;
     flex-grow: 1;
-    width:30%;
-    border: solid 5px teal;;
+    width:40%;
+    max-height: 94vh;
+    max-width: 65vh;
+    border: solid 5px teal;
      &::-webkit-scrollbar {
         width: 0;
     }
 }
-.pos .subwindow .subwindow-container-fix {
-    height: 100%;
-    position: relative;
-    overflow-y: scroll;;
-    &::-webkit-scrollbar {
-        width: 0;
-    }
-}
 .pos .products-widget {
     display: flex;
     flex-direction: column;
     flex-grow: 1;
     height:100%;
+    border :solid 1px teal;
     overflow: hidden;;
     &::-webkit-scrollbar {
         width: 0;
     }
 }
+
+.pos .order {
+    max-width: none;
+}
+
 .pos .order .orderlines {
     &::-webkit-scrollbar {
         width: 0;
@@ -40,11 +40,17 @@
 .payment-status-container {
     margin-top: 70px !important;
 }
+.pos .right .invoice-btn {
+    display: flex;
+    justify-content: center;
+}
+.pos .right .invoice-btn .highlight {
+    width: 65% !important;
+}
 .paymentlines-container {
     height: 29% !important;
 }
 .nextorder{
-    margin-bottom:8px !important;
     width:29% !important;
 }
 .pos .product-list-container .product-list-empty p {
@@ -62,9 +68,18 @@
     grid-template-columns: repeat(4, 1fr);
     text-align: center;
     flex-grow: 1;
-    width: 100%;
+    width: 65%;
     min-width: 216px;
 }
+.pos .control-buttons {
+    display: grid;
+    flex-grow: 1;
+    width: 35%;
+    border :solid 1px teal;
+}
+.pos .leftpane .control-buttons .control-button {
+    flex:1 1 100%;
+}
 .pos .numpad button {
     border-color:teal;
     color:teal;
@@ -89,11 +104,9 @@
    float:right;
    background:white;
    width:30%;
-   height: 98.9%;
+   height: 100%;
    border: solid 5px teal;
-   box-sizing: border-box;
-   margin-top: 2px;
-   margin-bottom: 8px;
+   max-height: 94vh;
 }
 .pos .customer-button{
     width: 65%;
@@ -109,6 +122,9 @@
 .pos .center{
    background:white;
    height: 100%;
+   border: solid 5px teal;
+   border-top:none;
+   max-height: 94vh;
 }
 .pos ._o_customer{
   text-align: justify;
@@ -148,18 +164,21 @@
     font-size: 25px;
     padding-top: 15px;
 }
+
 .pos .button.validation {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
-    height: calc(var(--btn-height-size) * 2.3);
     border: none;
     background: $primary;
     color: #fff;
     font-size: 14px;
     font-weight: bold;
     transition: all 150ms linear;
+    height:16%;
+    border-bottom: solid 5px teal !important;
+
 }
 .pos .amount-paymentmethod{
    padding-left: 40%;
@@ -179,14 +198,10 @@
 }
 .pos .button.validation{
     background:#39B8B8 !important;
-    margin-bottom: 13px !important;
 }
 .highlight {
     width: 29.45% !important;
 }
-.next {
-    border-bottom: solid 5px teal !important;
-}
 .paymentmethods-container {
     overflow: scroll;
     height: 49.125%;
@@ -198,6 +213,8 @@
   position: absolute;
   width: 28.3%;
   bottom: 0;
+  padding-right: 0.6rem;
+
 }
 .pos .search-bar-container.sb-product {
     max-width: 100%;

simplified_pos/static/src/xml/OrderWidget.xml

@@ -4,8 +4,7 @@
     <t t-name="OrderWidget" t-inherit="point_of_sale.OrderWidget"
        t-inherit-mode="extension" owl="1">
         <xpath expr="//div[hasclass('order-container')]" position="before">
-            <ProductsWidget
-                    mobileSearchBarIsShown="props.mobileSearchBarIsShown"/>
+            <ProductsWidget mobileSearchBarIsShown="props.mobileSearchBarIsShown"/>
             <MobileOrderWidget t-if="env.isMobile" pane="state.mobile_pane"
                                onSwitchPane.bind="switchPane"/>
         </xpath>

simplified_pos/static/src/xml/ProductScreen.xml

@@ -6,9 +6,24 @@
         <xpath expr="//div[hasclass('product-screen')]" position="replace">
             <div class="leftpane pane-border">
                 <OrderWidget/>
-                <NumpadWidget activeMode="env.pos.numpadMode"/>
+                <div class="d-flex" style="display:flex">
+                    <NumpadWidget activeMode="env.pos.numpadMode"/>
+                    <div class="control-buttons">
+                    <t t-if="env.isMobile and controlButtons.length > 3">
+                        <div class="control-button"
+                             t-on-click="_displayAllControlPopup">More...</div>
+                    </t>
+                        <t t-else="">
+                        <t t-foreach="controlButtons" t-as="cb"
+                           t-key="cb.name">
+                            <t t-component="cb.component" t-key="cb.name"/>
+                        </t>
+                    </t>
+                </div>
+                </div>
             </div>
             <div class="right">
+
                 <div class="head"><center><h2>CUSTOMER</h2></center></div>
                 <br/>
                 <br/>
@@ -20,7 +35,16 @@
                             t-on-click="customerdetails">
                         <i class="fa fa-search"/>
                     </button>
+
                 </center>
+                <div class="d-flex justify-content-center align-items-center invoice-btn">
+                    <button class="button invoice_button customer-button" style="font-size:16px;"
+                     t-att-class="{ highlight: currentOrder.is_to_invoice() }"
+                     t-on-click="toggleIsToInvoice">
+                    <i class="fa fa-file-text-o"/>
+                     Invoice
+                </button>
+                </div>
                 <div class="button nextorder validation"
                      t-att-class="{ highlight: !locked }"
                      t-on-click="orderDone" style="background:#39B8B8;">
@@ -76,5 +100,6 @@
                 <t t-esc="this.get_partner().phone"/>
             </t>
         </div>
+        <!--        <PartnerListScreen/>-->
     </t>
 </templates>