+ 
+ 
+ 
+ 
+ 
+ 
+
+ ![]()
+ +
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ Community
+
+
+ Enterprise
+
+
+
+
+
+
+
+ 
+
+ POS Product Multi Variant
+Configure Multi-Variant Products For POS.
+ +
+
+
+
+ 
+
+
+ Explore This + Module
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ Overview +
+
+
+
\ No newline at end of file
diff --git a/pos_multi_variant/static/src/css/label.css b/pos_multi_variant/static/src/css/label.css
new file mode 100644
index 000000000..977f72571
--- /dev/null
+++ b/pos_multi_variant/static/src/css/label.css
@@ -0,0 +1,67 @@
+.pos .product .variant {
+ position: absolute;
+ top: 50px;
+ left: 2px;
+ right: 2px;
+ vertical-align: top;
+ color: white;
+ line-height: 13px;
+ background: #0070F7;
+ padding: 2px 5px;
+ border-radius: 2px;
+}
+
+.variants{
+ position: absolute;
+ bottom: -11px;
+ left: 2px;
+ right: 2px;
+ vertical-align: top;
+ color: white;
+ line-height: 40px;
+ background: #1b9c99;
+ padding: 2px 5px;
+ border-radius: 2px;
+}
+.extra-price{
+position: absolute;
+ top: 2px;
+ right: 2px;
+ vertical-align: top;
+ color: #000;
+ line-height: 13px;
+ background: #FFACAC;
+ padding: 7px 5px;
+ border-radius: 2px;
+}
+.tag{
+background-color:#d7d7d7;
+font-style: italic;
+}
+.variant-selected{
+ position: absolute;
+ bottom: 23px;
+ left: 2px;
+ right: 2px;
+ vertical-align: top;
+ color: white;
+ line-height: 13px;
+ font-size: 15px;
+ background: #0831b3;
+ padding: 2px 5px;
+ border-radius: 2px;
+}
+.custom-pos-label{
+ width: 100%;
+ position: absolute;
+ top: 45%;
+ left: 0;
+ background: #30E3DF;
+ height: 20px;
+ display: block;
+ line-height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #03001C;
+}
\ No newline at end of file
diff --git a/pos_multi_variant/static/src/js/ProductPopup.js b/pos_multi_variant/static/src/js/ProductPopup.js
new file mode 100644
index 000000000..7db458c1f
--- /dev/null
+++ b/pos_multi_variant/static/src/js/ProductPopup.js
@@ -0,0 +1,75 @@
+odoo.define('pos_multi_variant.ProductsPopup', function(require) {
+ 'use strict';
+ /* This JavaScript code defines the ProductsPopup component, which extends
+ * the ProductItem class from the point_of_sale module. It represents a popup
+ * for selecting product variants.
+ */
+ const Registries = require('point_of_sale.Registries');
+ const { useListener } = require("@web/core/utils/hooks");
+ const ProductItem = require('point_of_sale.ProductItem');
+
+ class ProductsPopup extends ProductItem {
+ setup() {
+ super.setup();
+ useListener('click','.confirm', this.click_confirm);
+ useListener('click','.product', this.select_variant);
+ useListener('click','.cancel', this.click_cancel);
+ }
+ select_variant(e) {
+ var order = this.env.pos.get_order()
+ var self = e.composedPath ? e.composedPath()[2] : e.path[2];
+ var action = $(self).find('.action').text();
+ var category = $(self).find('.action').data('category');
+ $('.product-img').find('.variant-selected').each(function ()
+ { if($(this).data('category') == category)
+ { $(this).text("").removeClass('variant-selected');
+ $(self).find('.action').text("Selected").addClass('variant-selected');
+ }
+ });
+ $(self).find('.action').text("Selected").addClass('variant-selected');
+ var add = $(self).find('.extra-price').text().substr(1).slice(0, -2);
+ var type = $(self).find('.variants').text();
+ $(self).find('.variant-selected').attr('data-price', add);
+ $(self).find('.variant-selected').attr('data-type', type);
+ }
+ click_confirm(e){
+ var price = 0.00
+ var order = this.env.pos.get_order()
+ var selected_orderline = order.get_selected_orderline()
+ var variants = []
+ this.env.pos.selectedOrder.selected_orderline.product_variants=variants
+ $('.product-img').find('.variant-selected').each(function ()
+ {
+ var add = this.previousSibling.innerHTML;
+ add = add.slice(3)
+ price += parseFloat(add)
+ if (order.selected_orderline.product.is_pos_variants){
+ variants.push({
+ 'extra_price': add,
+ 'type': $(this).data('type'),
+ })
+ };
+ })
+ selected_orderline.price_manually_set = true;
+ selected_orderline.price += price
+ this.env.posbus.trigger('close-popup', {
+ popupId: this.props.id
+ });
+ }
+ click_cancel(){
+ this.env.posbus.trigger('close-popup', {
+ popupId: this.props.id
+ });
+ }
+ imageUrl() {
+ return `/web/image?model=product.product&field=image_1920&id=${this.props.product_tmpl_id}&unique=1`;
+ }
+ async _clickProduct(event) {
+ }
+ }
+ ProductsPopup.template = 'ProductsPopUp';
+ ProductsPopup.defaultProps = {};
+ Registries.Component.add(ProductsPopup);
+ return ProductsPopup;
+});
+
diff --git a/pos_multi_variant/static/src/js/ProductScreen.js b/pos_multi_variant/static/src/js/ProductScreen.js
new file mode 100644
index 000000000..660e73323
--- /dev/null
+++ b/pos_multi_variant/static/src/js/ProductScreen.js
@@ -0,0 +1,62 @@
+odoo.define('pos_multi_variant.ProductScreen', function(require) {
+ 'use strict';
+ /* This JavaScript code extends the ProductScreen class from the point_of_sale module.
+ * It adds functionality for handling product clicks and displaying the ProductsPopup
+ * for selecting variants.
+ */
+ var ProductScreen = require('point_of_sale.ProductScreen');
+ const Registries = require('point_of_sale.Registries');
+ const NumberBuffer = require('point_of_sale.NumberBuffer');
+ var rpc = require('web.rpc');
+ const ProductScreenExtend = (ProductScreen) =>
+ class extends ProductScreen {
+ constructor() {
+ super(...arguments);
+ }
+ async _clickProduct(event) {
+ await super._clickProduct(...arguments)
+ if (!this.currentOrder) {
+ this.env.pos.add_new_order();
+ }
+ const product = event.detail;
+ var variant_product = ''
+ await rpc.query({
+ model: 'variants.tree',
+ method: 'search_read',
+ fields: ['extra_price','attribute_id','value_ids', 'variants_id'],
+ args: [[['variants_id','=',event.detail.product_tmpl_id]]]
+ }).then(function (data) {
+ variant_product = data
+ });
+ var li=[]
+ for(var i=0; i
+ POS Multi-variant module is an advanced way for managing product variants from the point of sale application.
+ The module helps the user to configure product variants straight from POS. User can set extra price, also activate/inactivate the option for variants.
+ As multi-variant products are displayed with a label, it comes easy for the user to sort which is multi-variant and which is not.
+ User can confirm the variant type to POS orders.
+
+
+
+
+
+
+
+ 
+
+
+ Features +
+
+
+
+
+
+
+
+
+ 
+ Multi-variant option in product configuration.
+
+
+ Multi-variant option in product configuration.
+
+
+ Option for activating/inactivating variant types in POS.
+
+
+ Option for activating/inactivating variant types in POS.
+
+
+ Easy selection of variant type from wizard.
+
+
+ Easy selection of variant type from wizard.
+
+
+ Option for adding extra price for the variant.
+
+
+ Option for adding extra price for the variant.
+
+
+ Notification for multi-variant products in POS.
+
+
+ Notification for multi-variant products in POS.
+
+
+ Displays variant details in order receipt and order.
+
+
+ Displays variant details in order receipt and order.
+
+
+
+ 
+
+
+ Screenshots +
+
+
+
+
+
+
+
+
+
+ 
+
+
+ Products -> Enable POS variants and Configure variants.
+After installation, go to Products -> Enable POS variants option. + Here you have an option to configure different variants.
+
+
+ 
+
+
+ See multi-variant products
+Open the POS session, you can see the product with multi-variants.
+
+
+ 
+
+ Variant selection window pop-up
+Variant selection window pop-ups, upon selecting a product having multi-variants.
+
+
+ 
+
+ Choose desired variants
+User can see invoice is validated automatically and sent message is linked with chatter which is sent to customer.
+
+
+ 
+
+ Confirmed variants get listed in the POS order list.
+On confirming the variants, it gets listed in the order list of POS session.
+
+
+ 
+
+ Variant details in the order receipt
+The order receipt will be shown as below.
+
+
+
+
+ 
+
+
+ Related + Products +
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ Our Services +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Odoo + Customization
+
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+
+
+ 
+
+
+ + Odoo + Support
+
+
+
+
+ 
+
+
+ + Hire + Odoo + Developer
+
+
+
+
+ 
+
+
+ + Odoo + Integration
+
+
+
+
+
+ 
+
+
+ + Odoo + Migration
+
+
+
+
+ 
+
+
+ + Odoo + Consultancy
+
+
+
+
+ 
+
+
+ + Odoo + Implementation
+
+
+
+ 
+
+
+ + Odoo + Licensing Consultancy
+
+
+
+
+ 
+
+
+ Our + Industries +
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+ + Trading +
++ Easily procure + and + sell your products
+
+
+
+
+ 
+
+
+ + POS +
++ Easy + configuration + and convivial experience
+
+
+
+
+ 
+
+
+ + Education +
++ A platform for + educational management
+
+
+
+
+ 
+
+
+ + Manufacturing +
++ Plan, track and + schedule your operations
+
+
+
+
+ 
+
+
+ + E-commerce & Website +
++ Mobile + friendly, + awe-inspiring product pages
+
+
+
+
+ 
+
+
+ + Service Management +
++ Keep track of + services and invoice
+
+
+
+
+ 
+
+
+ + Restaurant +
++ Run your bar or + restaurant methodically
+
+
+
+ 
+
+
+ + Hotel Management +
++ An + all-inclusive + hotel management application
+
+
+
+ 
+
+
+ Support +
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ 
+
+
+ +
+
+
+ (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+