blob: 446a514aa46a444b44abb8f6ed142087ebb83e2f (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
odoo.define('point_of_sale.PopupControllerMixin', function(require) {
'use strict';
const { useState } = owl;
const { useListener } = require('web.custom_hooks');
/**
* Allows the component declared with this mixin the ability show popup dynamically,
* provided the following:
* 1. The following element is declared in the template. It is where the Popup will be rendered.
* `<t t-if="popup.isShown" t-component="popup.component" t-props="popupProps" t-key="popup.name" />`
* 2. The component should trigger `show-popup` event to show the popup and `close-popup` event
* to close. In PosComponent, `showPopup` is conveniently declared to satisfy this requirement.
* @param {Function} x class definition to mix with during extension
*/
const PopupControllerMixin = x =>
class extends x {
constructor() {
super(...arguments);
useListener('show-popup', this.__showPopup);
useListener('close-popup', this.__closePopup);
this.popup = useState({ isShown: false, name: null, component: null });
this.popupProps = {}; // We want to avoid making the props to become Proxy!
}
__showPopup(event) {
const { name, props, resolve } = event.detail;
const popupConstructor = this.constructor.components[name];
if (popupConstructor.dontShow) {
resolve();
return;
}
this.popup.isShown = true;
this.popup.name = name;
this.popup.component = popupConstructor;
this.popupProps = Object.assign({}, props, { resolve });
}
__closePopup() {
this.popup.isShown = false;
}
};
return PopupControllerMixin;
});
|
