Skip to Content
Menu
This question has been flagged
2 Replies
11790 Zobrazenia

Hi,

I need to be able to inherit an existing Owl class / component, and then add functions or override/include some functions.

I want to add a function to the Owl class: PosComponent

or be able to trigger a owl function / component from the widget framwork. 


Is there anyone thats has a sulotion to this?



Avatar
Zrušiť
Best Answer

This is such a painful thing I have experienced. I used to search a lot for solution but I can only find a guide to create a new Owl class rather than inherit an existing one and I am a js dummy. However you can try this way:

- inherit the 'views/pos_assets_common.xml', find the entry of PosComponent.js and replace it with your new own PosComponent.js file (in your custom module)

- then in your new PosComponent.js file, you copy the origin file and add your new function

Tell me if it works, actually I think we can find the way to inherit an Owl class by diving deep into Odoo source code (I am still trying to do that and feeling the pain) and Odoo havent moved completely from old js framework to Owl, old code still there which makes me confused a lot. If one day you can find the way, feel free to share with us.

Avatar
Zrušiť

Thank you so much, this helped me a lot

Autor Best Answer

Thanks for your answer.

I haven't been able to inherit the PosComponent.js file, but I did found an other way to solve my issue, but it's not quiet the solution to this question.

I found out that i can inherit / override functions in components that is in the Registries class like so:

const PaymentScreen = require('point_of_sale.PaymentScreen');

const Registries = require('point_of_sale.Registries');

const MyPaymentScreen = PaymentScreen =>

class extends PaymentScreen {

constructor (){

super(...arguments);

}

onClick() {

// your code here

console.log('button clicked)

}

};

Registries.Component.extend(PaymentScreen, MyPaymentScreen);

return MyPaymentScreen;

});

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

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

<t t-name="MyPaymentScreen" owl="1">

<div class="ticket-button" t-att-class="{ highlight: props.isTicketScreenShown }" t-on-click="onClick">

<!-- <div class="with-badge" t-att-badge="count"> -->

<i class="fa fa-credit-card" aria-hidden="true"></i>

<!-- </div> -->

</div>

</t>

<t t-inherit="point_of_sale.Chrome" t-inherit-mode="extension">

<xpath expr="//OrderManagementButton" position="before">

<MyPaymentScreen t-if="env.pos.config.use_proxy" />

</xpath>

</t>

</templates>

Avatar
Zrušiť

Can you add new function by this method or you can only override existing function?

Related Posts Replies Zobrazenia Aktivita
0
apr 21
116
0
nov 23
1877
1
sep 23
6844
0
máj 23
2619
0
dec 22
2446