Skip to Content
Odoo เมนู
  • ลงชื่อเข้าใช้
  • ทดลองใช้ฟรี
  • แอป
    การเงิน
    • ระบบบัญชี
    • ระบบการออกใบแจ้งหนี้
    • ระบบบัญชีรายจ่าย
    • ระบบการจัดการข้อมูลผ่านสเปรดชีต (BI)
    • เอกสาร
    • ระบบลงลายเซ็น
    การขาย
    • ลูกค้าสัมพันธ์
    • การขาย
    • POS ร้านค้า
    • POS ร้านอาหาร
    • ระบบสมัครสมาชิก
    • การเช่า
    การจัดการเว็บไซต์
    • เครื่องมือสร้างเว็บไซต์
    • ระบบการขายออนไลน์
    • บล็อก
    • ฟอรั่ม
    • ไลฟ์แชท
    • ระบบการอบรมออนไลน์
    ซัพพลายเชน
    • คลังสินค้า
    • ระบบการผลิต
    • PLM
    • ระบบการจัดซื้อ
    • การซ่อมบำรุง
    • ระบบจัดการคุณภาพ
    ทรัพยากรบุคคล
    • ข้อมูลพนักงาน
    • ระบบสรรหาบุคลากร
    • ระบบการลา
    • การประเมิน
    • ระบบการแนะนำพนักงาน
    • ระบบจัดการยานพาหนะ
    การตลาด
    • โซเชียลมาร์เก็ตติ้ง
    • การตลาดผ่านอีเมล
    • ระบบการตลาดผ่าน SMS
    • ระบบการจัดงานอีเวนต์
    • การตลาดแบบอัตโนมัติ
    • ระบบแบบสำรวจ
    การบริการ
    • โปรเจกต์
    • ระบบบันทึกเวลา
    • ระบบการจัดการบริการภาคสนาม
    • ระบบดูแลช่วยเหลือ
    • การวางแผน
    • การนัดหมาย
    ประสิทธิผล
    • ระบบแสดงความคิดเห็น
    • ระบบการอนุมัติ
    • ไอโอที
    • VoIP
    • คลังข้อมูล
    • WhatsApp
    แอปพลิเคชันของบุคคลที่สาม Odoo สตูดิโอ แพลตฟอร์มคลาวด์ของ Odoo
  • อุตสาหกรรม
    การค้าปลีก
    • ร้านขายหนังสือ
    • ร้านขายเสื้อผ้า
    • ร้านขายเฟอร์นิเจอร์
    • ร้านขายของชำ
    • ร้านขายฮาร์ดแวร์
    • ร้านขายของเล่น
    Food & Hospitality
    • บาร์และผับ
    • ร้านอาหาร
    • อาหารฟาสต์ฟู้ด
    • Guest House
    • ตัวแทนจำหน่ายเครื่องดื่ม
    • Hotel
    อสังหาริมทรัพย์
    • Real Estate Agency
    • บริษัทสถาปัตยกรรม
    • บริษัทรับเหมา
    • การจัดการอสังหาริมทรัพย์
    • การจัดสวน
    • สมาคมเจ้าของอสังหาริมทรัพย์
    ปรึกษา
    • สำนักงานบัญชี
    • Odoo พาร์ทเนอร์
    • เอเจนซี่การตลาด
    • สำนักงานกฎหมาย
    • บริการสรรหาบุคลากร
    • การตรวจสอบและการรับรอง
    ระบบการผลิต
    • Textile
    • เหล็ก
    • เฟอร์นิเจอร์
    • อาหาร
    • Brewery
    • ของขวัญขององค์กร
    สุขภาพ & ฟิตเนส
    • ชมรมกีฬา
    • ร้านขายแว่นตา
    • ฟิตเนส
    • ผู้ประกอบวิชาชีพด้านสุขภาพ
    • ร้านขายยา
    • ร้านทำผม
    Trades
    • ช่างซ่อม
    • ฮาร์ดแวร์และการสนับสนุนด้านไอที
    • ระบบพลังงานแสงอาทิตย์
    • ช่างทำรองเท้า
    • บริการทำความสะอาด
    • HVAC Services
    อื่น ๆ
    • Nonprofit Organization
    • สำนักงานสิ่งแวดล้อม
    • ร้านเช่าป้ายโฆษณา
    • การถ่ายภาพ
    • ร้านเช่าจักรยาน
    • ตัวแทนจำหน่ายซอฟต์แวร์
    Browse all Industries
  • คอมมูนิตี้
    ศึกษา
    • บทเรียน
    • เอกสารกำกับโปรแกรม
    • การรับรอง
    • การฝึกอบรม
    • บล็อก
    • พอดแคสต์
    เพิ่มศักยภาพให้กับการศึกษา
    • โปรแกรมการศึกษา
    • Scale Up! Business Game
    • เยี่ยมชม Odoo
    รับซอฟต์แวร์
    • ดาวน์โหลด
    • เปรียบเทียบรุ่น
    • เผยแพร่
    ทำงานร่วมกัน
    • Github
    • ฟอรั่ม
    • ระบบการจัดงานอีเวนต์
    • การแปล
    • ร่วมเป็นพาร์ทเนอร์
    • Services for Partners
    • ลงทะเบียนเพื่อสร้างบัญชีบริษัทของคุณ
    รับบริการ
    • ค้นหาพาร์ทเนอร์
    • ค้นหานักบัญชี
    • พบกับที่ปรึกษา
    • บริการติดตั้งระบบเพื่อใช้งาน
    • ข้อมูลอ้างอิงลูกค้า
    • การสนับสนุน
    • อัปเกรด
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    รับการสาธิต
  • ราคา
  • ช่วยเหลือ

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • ลูกค้าสัมพันธ์
  • e-Commerce
  • ระบบบัญชี
  • สินค้าคงคลัง
  • PoS
  • โปรเจกต์
  • MRP
All apps
คุณต้องลงทะเบียนเพื่อโต้ตอบกับคอมมูนิตี้
All Posts คน เหรียญรางวัล
แท็ก (View all)
odoo accounting v14 pos v15
เกี่ยวกับฟอรั่มนี้
คุณต้องลงทะเบียนเพื่อโต้ตอบกับคอมมูนิตี้
All Posts คน เหรียญรางวัล
แท็ก (View all)
odoo accounting v14 pos v15
เกี่ยวกับฟอรั่มนี้
ช่วยเหลือ

How to inherit the POS to add a new print button and QWeb report?

ติดตาม

รับการแจ้งเตือนเมื่อมีกิจกรรมในโพสต์นี้

คำถามนี้ถูกตั้งค่าสถานะ
javascriptinheritancepoint_of_salebackbone.jsodoo8
13 ตอบกลับ
24017 มุมมอง
อวตาร
Yenthe Van Ginneken (Mainframe Monkey)

Hi guys,

I've been trying to inherit and extend the POS from Odoo (V8) but I keep running stock. What do I want to do? When the user clicks on a payment method and the screen is show there is a button 'Confirm'. I want to add another button here, which prints a new created QWeb report. So far I've managed to add a new JS file to the web.assets and started to extend the POS. So my code for adding my customer JS file:

<openerp> <data> <!-- Inherit the js template in the module and include js file there. --> <template id="assets_backend_pippa" name="pos_print" inherit_id="web.assets_backend"> <xpath expr="." position="inside"> <script type="text/javascript" src="/my_module_name/static/src/js/pos_button.js"></script> </xpath> </template> </data> </openerp>

the javascript file (pos_button.js):

function openerp_pos_screens(instance, module){ var QWeb = instance.web.qweb, _t = instance.web._t;

module.ReceiptScreenWidget = module.ScreenWidget.extend({ template: 'ReceiptScreenWidget', show_numpad: true, show_leftpane: true, init: function(parent, options) { this._super(parent,options); this.model = options.model; this.user = this.pos.get('user'); this.company = this.pos.get('company'); this.shop_obj = this.pos.get('shop'); }, renderElement: function() { this._super(); this.pos.bind('change:selectedOrder', this.change_selected_order, this); this.change_selected_order(); }, show: function(){ this._super(); var self = this;

this.add_action_button({ label: _t('Print Receipt'), icon: '/pos_print/static/src/img/icons/printer.png', click: function(){ self.print(); }, }); }, close: function(){ this._super(); } }); }

But this gives me the following error in the console:

TypeError: module.ScreenWidget is undefined

So I remain with two questions: 
1) Why am I getting this TypeError? I don't get why it is undefined.
2) How can I pass this part of the code to open up a new custom QWeb report in the POS?

this.add_action_button({ label: _t('Print Receipt'); icon: '/pos_print/static/src/img/icons/printer.png', click: function(){ self.print(); }, });

Update: I managed to get the new button working thanks to Emipro. I'm now trying to call another report lay-out, but this doesn't seem to work. My code:

module.PaymentScreenWidgetInherit=module.PaymentScreenWidget.include({ show:function(){ self=this; this._super(); this.add_action_button({ label: _t('Kasticket'), icon: '/point_of_sale/static/src/img/icons/png48/invoice.png', click: function(){ self.print_report(); }, }); }, //This variable will keep the link to another view. next_screen: 'receipt', print_report:function(){ //This opens the next page (which is the receipt page) this.pos_widget.screen_selector.set_current_screen('receipt'); 

},

refresh: function() { var order = this.pos.get('selectedOrder'); $('.pos-receipt-container', this.$el).html(Qweb.render('PosTicket2',{ widget:this, order: order, orderlines: order.get('orderLines').models, paymentlines: order.get('paymentLines').models, })); },

});

};

This opens a new page but shows the old report lay-out, while it should show the new one I created. My new report code:

<?xml version="1.0" encoding="UTF-8"?> <templates id="template" xml:space="preserve"> <t t-name="PosTicket2"> <div class="pos-sale-ticket"> <div class="pos-center-align"><t t-esc="new Date().toString(Date.CultureInfo.formatPatterns.shortDate + ' ' + Date.CultureInfo.formatPatterns.longTime)"/> <t t-esc="order.get('name')"/></div> <br /> <t t-esc="widget.pos.company.name"/><br /> Phone: <t t-esc="widget.pos.company.phone || ''"/><br /> User: <t t-esc="widget.pos.cashier ? widget.pos.cashier.name : widget.pos.user.name"/><br /> Shop: <t t-esc="widget.pos.shop.name"/><br /> <br /> <t t-if="widget.pos.config.receipt_header"> <div style='text-align:center'> <t t-esc="widget.pos.config.receipt_header" /> </div> <br /> </t> </div> </t> </templates>


Thanks, 
Yenthe

3
อวตาร
ละทิ้ง
อวตาร
Axel Mendoza
คำตอบที่ดีที่สุด

This code is working ok, it's based on your code. The thing is that the refresh function of the ReceiptScreenWidget render the original report and that function is called when you call 

this.pos_widget.screen_selector.set_current_screen('receipt');

That's way I put the "no_refresh = true" flag to check if the original refresh function of the ReceiptScreenWidget need to get called or not
Here is the code:

openerp.aa_pippa_pepper_pos = function(instance){

var module = instance.point_of_sale;

var Qweb = instance.web.qweb;

var _t = instance.web._t;

module.PaymentScreenWidget.include({

show:function(){

self=this;

this._super();

this.add_action_button({

label: _t('Kasticket'),

icon: '/point_of_sale/static/src/img/icons/png48/invoice.png',

click: function(){

self.refresh();

},

});

},

refresh: function() {

var order = this.pos.get('selectedOrder');

$('.pos-receipt-container').html(Qweb.render('PosTicket2',{

widget:this,

order: order,

orderlines: order.get('orderLines').models,

paymentlines: order.get('paymentLines').models,

}));

this.pos_widget.receipt_screen.no_refresh = true;

this.pos_widget.screen_selector.set_current_screen('receipt');

this.pos_widget.receipt_screen.no_refresh = false;

},

close: function(){

this._super();

}

});

module.ReceiptScreenWidget.include({

refresh: function() {

if(this.no_refresh){

return

} else{

this._super();

}

},

});

};

--- Update to fix the report template ---

<?xml version="1.0" encoding="UTF-8"?>

<templates id="template" xml:space="preserve">

<t t-name="PosTicket2">

<div class="pos-sale-ticket">

<div class="pos-center-align"><t t-esc="new Date().toString(Date.CultureInfo.formatPatterns.shortDate + ' ' +

Date.CultureInfo.formatPatterns.longTime)"/> <t t-esc="order.get('name')"/></div>

<br />

<t t-esc="widget.pos.company.name"/><br />

Phone: <t t-esc="widget.pos.company.phone || ''"/><br />

User: <t t-esc="widget.pos.cashier ? widget.pos.cashier.name : widget.pos.user.name"/><br />

Shop: <t t-esc="widget.pos.shop.name"/><br />

<br />

<t t-if="widget.pos.config.receipt_header">

<div style='text-align:center'>

<t t-esc="widget.pos.config.receipt_header" />

</div>

<br />

</t>

<table class='receipt-orderlines'>

<colgroup>

<col width='50%' />

<col width='25%' />

<col width='25%' />

</colgroup>

<tr t-foreach="orderlines" t-as="orderline">

<td>

<t t-esc="orderline.get_product().display_name"/>

<t t-if="orderline.get_discount() > 0">

<div class="pos-disc-font">

With a <t t-esc="orderline.get_discount()"/>% discount

</div>

</t>

</td>

<td class="pos-right-align">

<t t-esc="orderline.get_quantity_str_with_unit()"/>

</td>

<td class="pos-right-align">

<t t-esc="widget.format_currency(orderline.get_display_price())"/>

</td>

</tr>

</table>

<br />

<table class='receipt-total'>

<tr>

<td>Subtotal:</td>

<td class="pos-right-align">

<t t-esc="widget.format_currency(order.getSubtotal())"/>

</td>

</tr>

<t t-foreach="order.getTaxDetails()" t-as="taxdetail">

<tr>

<td><t t-esc="taxdetail.name" /></td>

<td class="pos-right-align">

<t t-esc="widget.format_currency(taxdetail.amount)" />

</td>

</tr>

</t>

<tr>

<td>Discount:</td>

<td class="pos-right-align">

<t t-esc="widget.format_currency(order.getDiscountTotal())"/>

</td>

</tr>

<tr class="emph">

<td>Total:</td>

<td class="pos-right-align">

<t t-esc="widget.format_currency(order.getTotalTaxIncluded())"/>

</td>

</tr>

</table>

</div>

</t>

</templates>


6
อวตาร
ละทิ้ง
Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

Thanks Axel, a step closer! The thing is, I've now extended my custom ticket since it should show the prices too. So I added a line: but when I now run the JS I will get the error 'Error: QWeb2 - template['PosTicket2']: Runtime Error: TypeError: dict.order.get_subtotal is not a function' so I'm missing something in the JS that gets the get_subtotal but I'm not sure how to call it.. Think you could give me a helping hand there too?

Axel Mendoza

Update the code to see what is the error now with the get_subtotal function

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

Excellent answer, upvoted & accepted! Thank you Axel.

อวตาร
Emipro Technologies Pvt. Ltd.
คำตอบที่ดีที่สุด

Here in your pos_button.js file

For initializing a function in ".js" file you need to do following:

In your case your module name is "my_module_name" which we can see from your ".js" declaration in web.asset.

Now, why do you want to define new "ReceiptScreenWidget", because it already there provided in core module 'point_of_sale'

Try Following:

openerp.my_module_name = function(instance){
     var module = instance.point_of_sale;
     var Qweb = instance.web.qweb;
     var _t =    instance.web._t;
   

module.PaymentScreenWidgetInherit=module.PaymentScreenWidget.include({ 

    show:function(){

                self=this;

                this._super();

                this.add_action_button({

                                    label: _t('NA'),

                                    icon: '/point_of_sale/static/src/img/icons/png48/go-previous.png',

                                   click: function(){

                                                    self.myclick();

                                    },

                });

    },

    myclick:function(){

              alert('My Button Click');

             <<your code for loading qweb template goes here>

   },

});

};



1
อวตาร
ละทิ้ง
Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

Thanks for the great answer Emipro! I've added a line in the JS like this: this.pos_widget.screen_selector.set_current_screen(this.next_screen); which is opening a new view, the default ticket screen. How do I now create another view/report that should be opened in place of the receipt screen? :s

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

I've added my code as how it looks now, I did some attemps.

Emipro Technologies Pvt. Ltd.

Can you tell your purpose for having a new screen?

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

The default ticket that is printed in the screen (when you click on the payment method and then on confirm shows you the dialog to print the report but also shows the report inline. I want a second view which shows another version of this ticket in the browser. See: http://i.imgur.com/2iUI5MY.png

Emipro Technologies Pvt. Ltd.

Do you want to keep the old version of the report? If no then I suggest copy whole template of that report version in your xml file and keep the 'same name of the template' and just do the changes you want, so it will load with whatever changes you made. In this case you don't need to add any new button. OR you can create your own new template and in js file you need to override the code where it prints the old version of the report and change the template name with yours new template name. Hope this helps !!.

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

@Emipro I do need the old ticket lay-out. So I need two buttons next to eachother that both link to another QWeb report. How exactly should I link my second button to the QWeb report then?

Emipro Technologies Pvt. Ltd.

Actually, when you click on confirm button pos makes the order 'paid' and shows you the reciept. I don't know while showing new qweb template do you want to confirm the order or not. If not than, in your case you need to create new screen inherited from 'ScreenWidget'. Then from the code shown above in function 'myclick' you need to show that new screen rendering your new qweb template. For rendering the qweb template, you can just search around in core module how the old report is rendered and check it.

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

@Emipro I'm talking about the button 'Validate', not 'Invoice'. My new button (named 'Kasticket') should do exactly the same functionalities as 'Validate', the only difference is that it should show another QWeb report. I can't find any working way to show another QWeb report though..

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

@Emipro I've updated my code again and added in my template for the new QWeb report.

Emipro Technologies Pvt. Ltd.

What error you are facing here?

Yenthe Van Ginneken (Mainframe Monkey)
ผู้เขียน

The new QWeb report is not shown in the ticket view, it is always the old (default) QWeb report

สนุกกับการพูดคุยนี้ใช่ไหม? เข้าร่วมเลย!

สร้างบัญชีวันนี้เพื่อเพลิดเพลินไปกับฟีเจอร์พิเศษและมีส่วนร่วมกับคอมมูนิตี้ที่ยอดเยี่ยมของเรา!

ลงชื่อ
Related Posts ตอบกลับ มุมมอง กิจกรรม
Extend a specific popup widget
javascript point_of_sale backbone.js
อวตาร
0
ก.พ. 19
6830
Inherit POS Javascript function in Odoo 10 แก้ไขแล้ว
javascript inheritance point_of_sale odoo10.0
อวตาร
อวตาร
1
เม.ย. 18
11430
Add a field and update the value in odoo pos orderline Odoo 11 แก้ไขแล้ว
javascript inheritance point_of_sale odoo odoo11
อวตาร
อวตาร
1
ก.ค. 21
16872
(SOLVED) JavaScript: How to add a QR code in POS Receipt?
javascript point_of_sale
อวตาร
0
ส.ค. 23
4048
Change onclick kanban project view (JS file)
javascript inheritance
อวตาร
อวตาร
1
มี.ค. 22
7659
คอมมูนิตี้
  • บทเรียน
  • เอกสารกำกับโปรแกรม
  • ฟอรั่ม
โอเพนซอร์ส
  • ดาวน์โหลด
  • Github
  • Runbot
  • การแปล
บริการ
  • โฮสติ้ง odoo.sh เซิร์ฟเวอร์
  • การสนับสนุน
  • อัปเกรด
  • การพัฒนาที่กำหนดเอง
  • การศึกษา
  • ค้นหานักบัญชี
  • ค้นหาพาร์ทเนอร์
  • ร่วมเป็นพาร์ทเนอร์
เกี่ยวกับเรา
  • บริษัทของเรา
  • ทรัพย์สินในรูปของเครื่องหมายการค้า
  • ติดต่อเรา
  • งาน
  • ระบบการจัดงานอีเวนต์
  • พอดแคสต์
  • บล็อก
  • ลูกค้า
  • กฎหมาย • ความเป็นส่วนตัว
  • ความปลอดภัย
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo เป็นชุดแอปธุรกิจแบบเปิดที่ครอบคลุมทุกความต้องการของบริษัทของคุณ อาธิ CRM eCommerce ระบบบัญชี ระบบสินค้าคงคลัง ระบบการขายหน้าร้าน โปรเจกต์ และ อีกมากมาย

ความเหนือกว่าอันเป็นเอกลักษณ์ของ Odoo คือการใช้งานที่ง่ายดายและผสานการทำงานอย่างสมบูรณ์แบบในเวลาเดียวกัน

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now