|
|
|
|
|
|
|
import { shortcut, Widget, extend, toPix, Controller, createWidget } from "@/core";
|
|
|
|
import { ButtonGroup } from "@/base";
|
|
|
|
|
|
|
|
@shortcut()
|
|
|
|
export class Panel extends Widget {
|
|
|
|
static xtype = "bi.panel"
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE"
|
|
|
|
|
|
|
|
|
|
|
|
_defaultConfig() {
|
|
|
|
return extend(super._defaultConfig(...arguments), {
|
|
|
|
baseCls: "bi-panel bi-border",
|
|
|
|
title: "",
|
|
|
|
titleHeight: 30,
|
|
|
|
titleButtons: [],
|
|
|
|
el: {},
|
|
|
|
// logic: {
|
|
|
|
// dynamic: false
|
|
|
|
// }
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
return {
|
|
|
|
type: "bi.vertical_fill",
|
|
|
|
rowSize: ["", "fill"],
|
|
|
|
items: [this._createTitle(), this.options.el],
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
_createTitle() {
|
|
|
|
const o = this.options;
|
|
|
|
this.text = createWidget({
|
|
|
|
type: "bi.label",
|
|
|
|
cls: "panel-title-text",
|
|
|
|
text: o.title,
|
|
|
|
height: o.titleHeight,
|
|
|
|
});
|
|
|
|
|
|
|
|
this.button_group = createWidget({
|
|
|
|
type: "bi.button_group",
|
|
|
|
items: o.titleButtons,
|
|
|
|
layouts: [{
|
|
|
|
type: "bi.center_adapt",
|
|
|
|
lgap: 10,
|
|
|
|
}],
|
|
|
|
});
|
|
|
|
|
|
|
|
this.button_group.on(Controller.EVENT_CHANGE, (...args) => {
|
|
|
|
this.fireEvent(Controller.EVENT_CHANGE, ...args);
|
|
|
|
});
|
|
|
|
|
|
|
|
this.button_group.on(ButtonGroup.EVENT_CHANGE, (value, obj) => {
|
|
|
|
this.fireEvent(Panel.EVENT_CHANGE, value, obj);
|
|
|
|
});
|
|
|
|
|
|
|
|
return {
|
|
|
|
// el: {
|
|
|
|
type: "bi.left_right_vertical_adapt",
|
|
|
|
cls: "panel-title bi-header-background bi-border-bottom",
|
|
|
|
height: toPix(o.titleHeight, 1),
|
|
|
|
items: {
|
|
|
|
left: [this.text],
|
|
|
|
right: [this.button_group],
|
|
|
|
},
|
|
|
|
lhgap: 10,
|
|
|
|
rhgap: 10,
|
|
|
|
// },
|
|
|
|
// height: toPix(o.titleHeight, 1)
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
setTitle(title) {
|
|
|
|
this.text.setValue(title);
|
|
|
|
}
|
|
|
|
}
|