i'm new to odoo development and has no experience.
How to add pop-up window for point of sale products. What I am trying to do is when i click on a product on pos that has a variant (color, type, etc...) a pop-up widow comes out and select the variants, also include it on the order list?
I know that I should create a module that has static folder which contains src > xml > js folders
what I have tried to do is:
on the src > js file i have
odoo.define('your_module_name.change_packlot_popup', function(require){
"use strict";
var pos = require('point_of_sale.models');
var gui = require('point_of_sale.gui');
var popup = require('point_of_sale.popups');
pos.Order.prototype.display_lot_popup = function(){
var order_line = this.get_selected_orderline();
if (order_line){
var pack_lot_lines = order_line.compute_lot_lines();
this.pos.gui.show_popup('SelectVariantPopupWidget', {
'title': _t('Lot/Serial Number(s) Required'),
'pack_lot_lines': pack_lot_lines,
'order': this
});
}
};
var YourCustomPopupWidget = popup.extend({
// Just copy PackLotLinePopupWidget contents in here and modify
// any business logic you need. Then remember to register your widget in gui.
template: 'PackLotLinePopupWidget',
events: _.extend({}, PopupWidget.prototype.events, {
'click .remove-lot': 'remove_lot',
'blur .packlot-line-input': 'lose_input_focus'
}),
show: function(options){
this._super(options);
this.focus();
},
click_confirm: function(){
if (product.product_variant_count > 1) {
this.gui.show_popup('select-variant-popup', product.product_tmpl_id);
} else {
this._super(product);
}
}
},
add_lot: function(ev) {
if (ev.keyCode === $.ui.keyCode.ENTER && this.options.order_line.product.product_variant_count == 'product_ids'){
var pack_lot_lines = this.options.pack_lot_lines,
$input = $(ev.target),
cid = $input.attr('cid'),
lot_name = $input.val();
var lot_model = pack_lot_lines.get({cid: cid});
lot_model.set_lot_name(lot_name); // First set current model then add new one
if(!pack_lot_lines.get_empty_model()){
var new_lot_model = lot_model.add();
this.focus_model = new_lot_model;
}
pack_lot_lines.set_quantity_by_lot();
this.renderElement();
this.focus();
}
},
remove_lot: function(ev){
var pack_lot_lines = this.options.pack_lot_lines,
$input = $(ev.target).prev(),
cid = $input.attr('cid');
var lot_model = pack_lot_lines.get({cid: cid});
lot_model.remove();
pack_lot_lines.set_quantity_by_lot();
this.renderElement();
},
lose_input_focus: function(ev){
var $input = $(ev.target),
cid = $input.attr('cid');
var lot_model = this.options.pack_lot_lines.get({cid: cid});
lot_model.set_lot_name($input.val());
},
focus: function(){
this.$("input[autofocus]").focus();
this.focus_model = false; // after focus clear focus_model on widget
}
});
gui.define_popup({name:'SelectVariantPopupWidget', YourCustomPopupWidget});
});
And For the src > XML file I have
<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2014-Today Akretion (https://www.akretion.com)
@author Sylvain LE GAL (https://twitter.com/legalsylvain)
License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl). -->
<!-- Pop Up Widget -->
<t t-name="SelectVariantPopupWidget">
<div class="modal-dialog">
<div class="popup popup-select-variant">
<div class="variant-title">
Variant Selection of <span id="variant-title-name" />
<span id="variant-popup-cancel" class="button">
Cancel
</span>
</div>
<div class="content-container container-attribute-list">
<span class="placeholder-AttributeListWidget" />
</div>
<div class="content-container container-variant-list">
<span class="placeholder-VariantListWidget" />
</div>
</div>
</div>
</t>
For views / views
<?xml version="1.0" encoding="UTF-8"?>
<odoo>
<data>
<template id="pos_extend_assets" inherit_id="point_of_sale.assets">
<xpath expr="." position="inside">
<script type="text/javascript" src="/pos_override/static/src/js/widget_overidee.js"/>
</xpath>
</template>
</data>
</odoo>
And i got this error message ( The pos page did not loaded at all. just black screen and error message)
Error:
Odoo Server Error
Traceback (most recent call last):
File "/home/abdul/test/odoo/odoo/http.py", line 624, in _handle_exception
return super(JsonRequest, self)._handle_exception(exception)
File "/home/abdul/test/odoo/odoo/http.py", line 310, in _handle_exception
raise pycompat.reraise(type(exception), exception, sys.exc_info()[2])
File "/home/abdul/test/odoo/odoo/tools/pycompat.py", line 14, in reraise
raise value
File "/home/abdul/test/odoo/odoo/http.py", line 669, in dispatch
result = self._call_function(**self.params)
File "/home/abdul/test/odoo/odoo/http.py", line 350, in _call_function
return checked_call(self.db, *args, **kwargs)
File "/home/abdul/test/odoo/odoo/service/model.py", line 94, in wrapper
return f(dbname, *args, **kwargs)
File "/home/abdul/test/odoo/odoo/http.py", line 339, in checked_call
result = self.endpoint(*a, **kw)
File "/home/abdul/test/odoo/odoo/http.py", line 915, in __call__
return self.method(*args, **kw)
File "/home/abdul/test/odoo/odoo/http.py", line 515, in response_wrap
response = f(*args, **kw)
File "/home/abdul/test/odoo/addons/web/controllers/main.py", line 1654, in load
action = request.env[action_type].browse([action_id]).read()
File "/home/abdul/test/odoo/odoo/api.py", line 463, in __getitem__
return self.registry[model_name]._browse(self, (), ())
File "/home/abdul/test/odoo/odoo/modules/registry.py", line 177, in __getitem__
return self.models[model_name]
KeyError: False
Thanks for the help in advance.