Browse Source

KERNEL-13948 refactor: base/combination文件夹ES6化

es6
impact 2 years ago
parent
commit
4edb0d9b23
  1. 5
      src/base/0.base.js
  2. 972
      src/base/combination/bubble.js
  3. 682
      src/base/combination/combo.js
  4. 245
      src/base/combination/expander.js
  5. 326
      src/base/combination/group.button.js
  6. 98
      src/base/combination/group.combo.js
  7. 130
      src/base/combination/group.virtual.js
  8. 221
      src/base/combination/loader.js
  9. 162
      src/base/combination/navigation.js
  10. 306
      src/base/combination/searcher.js
  11. 278
      src/base/combination/switcher.js
  12. 177
      src/base/combination/tab.js
  13. 142
      src/base/combination/tree.button.js
  14. 40
      src/base/index.js
  15. 3
      src/core/index.js
  16. 52
      src/core/listener/listener.show.js

5
src/base/0.base.js

@ -7,7 +7,8 @@ import {
PopoverController,
ResizeController,
TooltipsController,
StyleLoaderManager
StyleLoaderManager,
extend
} from "../core";
const Resizers = new ResizeController();
@ -20,7 +21,7 @@ const Drawers = new DrawerController();
const Broadcasts = new BroadcastController();
const StyleLoaders = new StyleLoaderManager();
BI.extend(BI, {
extend(BI, {
Resizers,
Layers,
Maskers,

972
src/base/combination/bubble.js

File diff suppressed because it is too large Load Diff

682
src/base/combination/combo.js

@ -1,374 +1,374 @@
!(function () {
var needHideWhenAnotherComboOpen = {};
var currentOpenedCombos = {};
/**
* @class BI.Combo
* @extends BI.Widget
*/
/**
* @class BI.Combo
* @extends BI.Widget
*/
BI.Combo = BI.inherit(BI.Bubble, {
_const: {
TRIANGLE_LENGTH: 12,
},
_defaultConfig: function () {
var conf = BI.Combo.superclass._defaultConfig.apply(this, arguments);
import { shortcut, Widget, Controller, extend, createWidget, nextTick, bind, isNotNull, isNull, isFunction, each } from "../../core";
import Bubble from "./bubble";
import { Resizers } from "../0.base";
return BI.extend(conf, {
baseCls: (conf.baseCls || "") + " bi-combo" + (BI.isIE() ? " hack" : ""),
attributes: {
tabIndex: -1,
},
trigger: "click", // click || hover || click-hover || ""
toggle: true,
direction: "bottom", // top||bottom||left||right||top,left||top,right||bottom,left||bottom,right||right,innerRight||right,innerLeft||innerRight||innerLeft
logic: {
dynamic: true,
},
container: null, // popupview放置的容器,默认为this.element
isDefaultInit: false,
destroyWhenHide: false,
hideWhenBlur: true,
hideWhenAnotherComboOpen: false,
hideWhenClickOutside: true,
showArrow: false,
isNeedAdjustHeight: true, // 是否需要高度调整
isNeedAdjustWidth: true,
stopEvent: false,
stopPropagation: false,
adjustLength: 0, // 调整的距离
adjustXOffset: 0,
adjustYOffset: 0,
supportCSSTransform: true,
hideChecker: BI.emptyFn,
offsetStyle: "", // "",center,middle
el: {},
popup: {},
comboClass: "bi-combo-popup",
hoverClass: "bi-combo-hover",
belowMouse: false,
});
},
let needHideWhenAnotherComboOpen = {};
let currentOpenedCombos = {};
render: function () {
var self = this, o = this.options;
this._initCombo();
// 延迟绑定事件,这样可以将自己绑定的事情优先执行
BI.nextTick(() => {
!this.isDestroyed() && this._initPullDownAction();
});
this.combo.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (self.isEnabled() && self.isValid()) {
if (type === BI.Events.TOGGLE) {
self._toggle();
}
if (type === BI.Events.EXPAND) {
self._popupView();
}
if (type === BI.Events.COLLAPSE) {
self._hideView();
}
if (type === BI.Events.EXPAND) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.fireEvent(BI.Combo.EVENT_EXPAND);
}
if (type === BI.Events.COLLAPSE) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.isViewVisible() && self.fireEvent(BI.Combo.EVENT_COLLAPSE);
}
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Combo.EVENT_TRIGGER_CHANGE, obj);
}
}
});
@shortcut()
export default class Combo extends Bubble {
static xtype = "bi.combo";
self.element.on("mouseenter." + self.getName(), function (e) {
if (self.isEnabled() && self.isValid() && self.combo.isEnabled() && self.combo.isValid()) {
self.element.addClass(o.hoverClass);
static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_EXPAND = "EVENT_EXPAND";
static EVENT_COLLAPSE = "EVENT_COLLAPSE";
static EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
static EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
_defaultConfig() {
const conf = super._defaultConfig(arguments);
return extend(conf, {
baseCls: (conf.baseCls || "") + " bi-combo" + (BI.isIE() ? " hack" : ""),
attributes: {
tabIndex: -1,
},
trigger: "click", // click || hover || click-hover || ""
toggle: true,
direction: "bottom", // top||bottom||left||right||top,left||top,right||bottom,left||bottom,right||right,innerRight||right,innerLeft||innerRight||innerLeft
logic: {
dynamic: true,
},
container: null, // popupview放置的容器,默认为this.element
isDefaultInit: false,
destroyWhenHide: false,
hideWhenBlur: true,
hideWhenAnotherComboOpen: false,
hideWhenClickOutside: true,
showArrow: false,
isNeedAdjustHeight: true, // 是否需要高度调整
isNeedAdjustWidth: true,
stopEvent: false,
stopPropagation: false,
adjustLength: 0, // 调整的距离
adjustXOffset: 0,
adjustYOffset: 0,
supportCSSTransform: true,
hideChecker: BI.emptyFn,
offsetStyle: "", // "",center,middle
el: {},
popup: {},
comboClass: "bi-combo-popup",
hoverClass: "bi-combo-hover",
belowMouse: false,
});
}
render() {
const { hoverClass, logic, isDefaultInit } = this.options;
this._initCombo();
// 延迟绑定事件,这样可以将自己绑定的事情优先执行
nextTick(() => {
!this.isDestroyed() && this._initPullDownAction();
});
this.combo.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
if (this.isEnabled() && this.isValid()) {
if (type === BI.Events.TOGGLE) {
this._toggle();
}
});
self.element.on("mouseleave." + self.getName(), function (e) {
if (self.isEnabled() && self.isValid() && self.combo.isEnabled() && self.combo.isValid()) {
self.element.removeClass(o.hoverClass);
if (type === BI.Events.EXPAND) {
this._popupView();
}
});
BI.createWidget(BI.extend({
element: this,
scrolly: false,
}, BI.LogicFactory.createLogic("vertical", BI.extend(o.logic, {
items: [
{ el: this.combo }
],
}))));
o.isDefaultInit && (this._assertPopupView());
BI.Resizers.add(this.getName(), BI.bind(function (e) {
// 如果resize对象是combo的子元素,则不应该收起,或交由hideChecker去处理
if (this.isViewVisible()) {
BI.isNotNull(e) ? this._hideIf(e) : this._hideView();
if (type === BI.Events.COLLAPSE) {
this._hideView();
}
if (type === BI.Events.EXPAND) {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.fireEvent(Combo.EVENT_EXPAND);
}
if (type === BI.Events.COLLAPSE) {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.isViewVisible() && this.fireEvent(Combo.EVENT_COLLAPSE);
}
if (type === BI.Events.CLICK) {
this.fireEvent(Combo.EVENT_TRIGGER_CHANGE, obj);
}
}, this));
},
_assertPopupView: function () {
var self = this, o = this.options;
if (BI.isNull(this.popupView)) {
this.popupView = BI.createWidget(BI.isFunction(this.options.popup) ? this.options.popup() : this.options.popup, {
type: "bi.popup_view",
showArrow: o.showArrow,
value: o.value,
}, this);
this.popupView.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (type === BI.Events.CLICK) {
self.combo.setValue(self.getValue());
self.fireEvent(BI.Bubble.EVENT_CHANGE, value, obj);
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
this.popupView.setVisible(false);
BI.nextTick(function () {
self.fireEvent(BI.Bubble.EVENT_AFTER_INIT);
});
}
},
});
_hideView: function (e) {
var o = this.options;
this.fireEvent(BI.Combo.EVENT_BEFORE_HIDEVIEW);
if (this.options.destroyWhenHide === true) {
this.popupView && this.popupView.destroy();
this.popupView = null;
this._rendered = false;
} else {
this.popupView && this.popupView.invisible();
this.element.on("mouseenter." + this.getName(), (e) => {
if (this.isEnabled() && this.isValid() && this.combo.isEnabled() && this.combo.isValid()) {
this.element.addClass(hoverClass);
}
if (!e || !this.combo.element.__isMouseInBounds__(e)) {
this.element.removeClass(this.options.hoverClass);
// 应对bi-focus-shadow在收起时不失焦
this.element.blur();
});
this.element.on("mouseleave." + this.getName(), (e) => {
if (this.isEnabled() && this.isValid() && this.combo.isEnabled() && this.combo.isValid()) {
this.element.removeClass(hoverClass);
}
});
this.element.removeClass(this.options.comboClass);
delete needHideWhenAnotherComboOpen[this.getName()];
delete currentOpenedCombos[this.getName()];
o.hideWhenClickOutside && BI.Widget._renderEngine.createElement(document).unbind("mousedown." + this.getName()).unbind("mousewheel." + this.getName());
BI.EVENT_BLUR && o.hideWhenBlur && BI.Widget._renderEngine.createElement(window).unbind("blur." + this.getName());
this.fireEvent(BI.Combo.EVENT_AFTER_HIDEVIEW, e);
},
createWidget(extend({
element: this,
scrolly: false,
}, BI.LogicFactory.createLogic("vertical", extend(logic, {
items: [
{ el: this.combo }
],
}))));
isDefaultInit && (this._assertPopupView());
Resizers.add(this.getName(), bind((e) => {
// 如果resize对象是combo的子元素,则不应该收起,或交由hideChecker去处理
if (this.isViewVisible()) {
isNotNull(e) ? this._hideIf(e) : this._hideView();
}
}, this));
}
_popupView: function (e) {
var self = this, o = this.options;
this._assertPopupViewRender();
this.fireEvent(BI.Combo.EVENT_BEFORE_POPUPVIEW);
// popupVisible是为了获取其宽高, 放到可视范围之外以防止在IE下闪一下
this.popupView.css({ left: -99999, top: -99999 });
this.popupView.visible();
BI.each(needHideWhenAnotherComboOpen, function (i, combo) {
if (i !== self.getName()) {
if (combo && combo._hideIf(e, true) === true) {
delete needHideWhenAnotherComboOpen[i];
}
_assertPopupView() {
const { showArrow, value, hideWhenClickOutside, hideWhenBlur } = this.options;
if (isNull(this.popupView)) {
this.popupView = createWidget(isFunction(this.options.popup) ? this.options.popup() : this.options.popup, {
type: "bi.popup_view",
showArrow,
value,
}, this);
this.popupView.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
if (type === BI.Events.CLICK) {
this.combo.setValue(this.getValue());
this.fireEvent(Bubble.EVENT_CHANGE, value, obj);
}
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
});
this.popupView.setVisible(false);
nextTick(() => {
this.fireEvent(Bubble.EVENT_AFTER_INIT);
});
currentOpenedCombos[this.getName()] = this;
this.options.hideWhenAnotherComboOpen && (needHideWhenAnotherComboOpen[this.getName()] = this);
this.adjustWidth(e);
this.adjustHeight(e);
}
}
this.element.addClass(this.options.comboClass);
o.hideWhenClickOutside && BI.Widget._renderEngine.createElement(document).unbind("mousedown." + this.getName()).unbind("mousewheel." + this.getName());
o.hideWhenClickOutside && BI.Widget._renderEngine.createElement(document).unbind("mousewheel." + this.getName());
BI.EVENT_BLUR && o.hideWhenBlur && BI.Widget._renderEngine.createElement(window).unbind("blur." + this.getName());
_hideView(e) {
const { hideWhenClickOutside, hideWhenBlur } = this.options;
this.fireEvent(Combo.EVENT_BEFORE_HIDEVIEW);
if (this.options.destroyWhenHide === true) {
this.popupView && this.popupView.destroy();
this.popupView = null;
this._rendered = false;
} else {
this.popupView && this.popupView.invisible();
}
o.hideWhenClickOutside && BI.Widget._renderEngine.createElement(document).bind("mousedown." + this.getName(), BI.bind(this._hideIf, this)).bind("mousewheel." + this.getName(), BI.bind(this._hideIf, this));
o.hideWhenClickOutside && BI.Widget._renderEngine.createElement(document).bind("mousewheel." + this.getName(), BI.bind(this._hideIf, this));
BI.EVENT_BLUR && o.hideWhenBlur && BI.Widget._renderEngine.createElement(window).bind("blur." + this.getName(), BI.bind(this._hideIf, this));
this.fireEvent(BI.Combo.EVENT_AFTER_POPUPVIEW);
},
if (!e || !this.combo.element.__isMouseInBounds__(e)) {
this.element.removeClass(this.options.hoverClass);
// 应对bi-focus-shadow在收起时不失焦
this.element.blur();
}
adjustHeight: function (e) {
var o = this.options, p = {};
if (!this.popupView) {
return;
}
var isVisible = this.popupView.isVisible();
this.popupView.visible();
var combo = (o.belowMouse && BI.isNotNull(e)) ? {
element: {
0: BI.extend({}, e.target, {
getBoundingClientRect: function () {
return {
left: e.pageX,
top: e.pageY,
width: 0,
height: 0,
};
}
}),
offset: function () {
return {
left: e.pageX,
top: e.pageY,
};
},
},
} : this.combo;
this.element.removeClass(this.options.comboClass);
delete needHideWhenAnotherComboOpen[this.getName()];
delete currentOpenedCombos[this.getName()];
var positionRelativeElement = BI.DOM.getPositionRelativeContainingBlock(
BI.isNull(o.container)
? this.element[0]
: BI.isWidget(o.container)
? o.container.element[0]
: BI.Widget._renderEngine.createElement(BI.isFunction(o.container) ? o.container() : o.container)[0]
);
hideWhenClickOutside && Widget._renderEngine.createElement(document).unbind("mousedown." + this.getName()).unbind("mousewheel." + this.getName());
BI.EVENT_BLUR && hideWhenBlur && Widget._renderEngine.createElement(window).unbind("blur." + this.getName());
this.fireEvent(Combo.EVENT_AFTER_HIDEVIEW, e);
}
switch (o.direction) {
case "bottom":
case "bottom,right":
p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight, ["bottom", "top", "right", "left"], o.offsetStyle, positionRelativeElement);
break;
case "top":
case "top,right":
p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight, ["top", "bottom", "right", "left"], o.offsetStyle, positionRelativeElement);
break;
case "left":
case "left,bottom":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["left", "right", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "right":
case "right,bottom":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "top,left":
p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight, ["top", "bottom", "left", "right"], o.offsetStyle, positionRelativeElement);
break;
case "bottom,left":
p = BI.DOM.getComboPosition(combo, this.popupView, o.adjustXOffset, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight, ["bottom", "top", "left", "right"], o.offsetStyle, positionRelativeElement);
break;
case "left,top":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["left", "right", "top", "bottom"], o.offsetStyle, positionRelativeElement);
break;
case "right,top":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "top", "bottom"], o.offsetStyle, positionRelativeElement);
break;
case "right,innerRight":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "innerRight", "innerLeft", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "right,innerLeft":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["right", "left", "innerLeft", "innerRight", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "innerRight":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["innerRight", "innerLeft", "right", "left", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "innerLeft":
p = BI.DOM.getComboPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.adjustYOffset, o.isNeedAdjustHeight, ["innerLeft", "innerRight", "left", "right", "bottom", "top"], o.offsetStyle, positionRelativeElement);
break;
case "top,custom":
case "custom,top":
p = BI.DOM.getTopAdaptPosition(combo, this.popupView, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight);
p.dir = "top";
break;
case "custom,bottom":
case "bottom,custom":
p = BI.DOM.getBottomAdaptPosition(combo, this.popupView, (o.adjustYOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0), o.isNeedAdjustHeight);
p.dir = "bottom";
break;
case "left,custom":
case "custom,left":
p = BI.DOM.getLeftAdaptPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0));
delete p.top;
delete p.adaptHeight;
p.dir = "left";
break;
case "custom,right":
case "right,custom":
p = BI.DOM.getRightAdaptPosition(combo, this.popupView, (o.adjustXOffset + o.adjustLength) + (o.showArrow ? this._const.TRIANGLE_LENGTH : 0));
delete p.top;
delete p.adaptHeight;
p.dir = "right";
break;
default:
break;
_popupView(e) {
const { hideWhenClickOutside, hideWhenBlur } = this.options;
this._assertPopupViewRender();
this.fireEvent(Combo.EVENT_BEFORE_POPUPVIEW);
// popupVisible是为了获取其宽高, 放到可视范围之外以防止在IE下闪一下
this.popupView.css({ left: -99999, top: -99999 });
this.popupView.visible();
each(needHideWhenAnotherComboOpen, (i, combo) => {
if (i !== this.getName()) {
if (combo && combo._hideIf(e, true) === true) {
delete needHideWhenAnotherComboOpen[i];
}
}
});
currentOpenedCombos[this.getName()] = this;
this.options.hideWhenAnotherComboOpen && (needHideWhenAnotherComboOpen[this.getName()] = this);
this.adjustWidth(e);
this.adjustHeight(e);
var width = this.combo.element.outerWidth();
var height = this.combo.element.outerHeight();
this.popupView.setDirection && this.popupView.setDirection(p.dir, {
width: width,
height: height,
offsetStyle: o.offsetStyle,
adjustXOffset: o.adjustXOffset,
adjustYOffset: o.adjustYOffset,
offset: this.combo.element.offset(),
});
this.element.addClass(this.options.comboClass);
hideWhenClickOutside && Widget._renderEngine.createElement(document).unbind("mousedown." + this.getName()).unbind("mousewheel." + this.getName());
hideWhenClickOutside && Widget._renderEngine.createElement(document).unbind("mousewheel." + this.getName());
BI.EVENT_BLUR && hideWhenBlur && Widget._renderEngine.createElement(window).unbind("blur." + this.getName());
if (o.supportCSSTransform) {
hideWhenClickOutside && Widget._renderEngine.createElement(document).bind("mousewheel." + this.getName(), bind(this._hideIf, this));
hideWhenClickOutside && Widget._renderEngine.createElement(document).bind("mousedown." + this.getName(), bind(this._hideIf, this)).bind("mousewheel." + this.getName(), bind(this._hideIf, this));
BI.EVENT_BLUR && hideWhenBlur && Widget._renderEngine.createElement(window).bind("blur." + this.getName(), bind(this._hideIf, this));
this.fireEvent(Combo.EVENT_AFTER_POPUPVIEW);
}
var positonedRect = positionRelativeElement.getBoundingClientRect();
adjustHeight(e) {
const { belowMouse, supportCSSTransform, container, direction, adjustXOffset, adjustYOffset, adjustLength, showArrow, isNeedAdjustHeight, offsetStyle } = this.options;
let p = {};
if (!this.popupView) {
return;
}
const isVisible = this.popupView.isVisible();
this.popupView.visible();
const combo = (belowMouse && isNotNull(e)) ? {
element: {
0: e.target,
offset: () => {
return {
left: e.pageX,
top: e.pageY,
};
},
bounds: () => {
// offset为其相对于父定位元素的偏移
return {
x: e.offsetX,
y: e.offsetY,
width: 0,
height: 24,
};
},
outerWidth: () => {
return 0;
},
outerHeight: () => {
return 24;
},
},
} : this.combo;
const positionRelativeElement = supportCSSTransform ? BI.DOM.getPositionRelativeContainingBlock(isNull(container) ? this.element[0] : Widget._renderEngine.createElement(isFunction(container) ? container() : container)[0]) : null;
const TRIANGLE_LENGTH = 12;
switch (direction) {
case "bottom":
case "bottom,right":
p = BI.DOM.getComboPosition(combo, this.popupView, adjustXOffset, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight, ["bottom", "top", "right", "left"], offsetStyle, positionRelativeElement);
break;
case "top":
case "top,right":
p = BI.DOM.getComboPosition(combo, this.popupView, adjustXOffset, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight, ["top", "bottom", "right", "left"], offsetStyle, positionRelativeElement);
break;
case "left":
case "left,bottom":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["left", "right", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "right":
case "right,bottom":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["right", "left", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "top,left":
p = BI.DOM.getComboPosition(combo, this.popupView, adjustXOffset, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight, ["top", "bottom", "left", "right"], offsetStyle, positionRelativeElement);
break;
case "bottom,left":
p = BI.DOM.getComboPosition(combo, this.popupView, adjustXOffset, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight, ["bottom", "top", "left", "right"], offsetStyle, positionRelativeElement);
break;
case "left,top":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["left", "right", "top", "bottom"], offsetStyle, positionRelativeElement);
break;
case "right,top":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["right", "left", "top", "bottom"], offsetStyle, positionRelativeElement);
break;
case "right,innerRight":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["right", "left", "innerRight", "innerLeft", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "right,innerLeft":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["right", "left", "innerLeft", "innerRight", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "innerRight":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["innerRight", "innerLeft", "right", "left", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "innerLeft":
p = BI.DOM.getComboPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), adjustYOffset, isNeedAdjustHeight, ["innerLeft", "innerRight", "left", "right", "bottom", "top"], offsetStyle, positionRelativeElement);
break;
case "top,custom":
case "custom,top":
p = BI.DOM.getTopAdaptPosition(combo, this.popupView, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight);
p.dir = "top";
break;
case "custom,bottom":
case "bottom,custom":
p = BI.DOM.getBottomAdaptPosition(combo, this.popupView, (adjustYOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0), isNeedAdjustHeight);
p.dir = "bottom";
break;
case "left,custom":
case "custom,left":
p = BI.DOM.getLeftAdaptPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0));
delete p.top;
delete p.adaptHeight;
p.dir = "left";
break;
case "custom,right":
case "right,custom":
p = BI.DOM.getRightAdaptPosition(combo, this.popupView, (adjustXOffset + adjustLength) + (showArrow ? TRIANGLE_LENGTH : 0));
delete p.top;
delete p.adaptHeight;
p.dir = "right";
break;
default:
break;
}
var scaleX = positonedRect.width / positionRelativeElement.offsetWidth;
var scaleY = positonedRect.height / positionRelativeElement.offsetHeight;
if ("adaptHeight" in p) {
this.resetListHeight(p.adaptHeight);
}
p.top && (p.top = Math.round(p.top / scaleY + positionRelativeElement.scrollTop));
p.left && (p.left = Math.round(p.left / scaleX + positionRelativeElement.scrollLeft));
const width = this.combo.element.outerWidth();
const height = this.combo.element.outerHeight();
this.popupView.setDirection && this.popupView.setDirection(p.dir, {
width,
height,
offsetStyle,
adjustXOffset,
adjustYOffset,
offset: this.combo.element.offset(),
});
p.adaptHeight && (p.adaptHeight = Math.round(p.adaptHeight / scaleY));
}
if (supportCSSTransform) {
if ("adaptHeight" in p) {
this.resetListHeight(p.adaptHeight);
}
const positonedRect = positionRelativeElement.getBoundingClientRect();
if ("left" in p) {
this.popupView.element.css({
left: p.left,
});
}
if ("top" in p) {
this.popupView.element.css({
top: p.top,
});
}
this.position = p;
this.popupView.setVisible(isVisible);
},
const scaleX = positonedRect.width / positionRelativeElement.offsetWidth;
const scaleY = positonedRect.height / positionRelativeElement.offsetHeight;
destroyed: function () {
BI.Widget._renderEngine.createElement(document)
.unbind("click." + this.getName())
.unbind("mousedown." + this.getName())
.unbind("mousewheel." + this.getName())
.unbind("mouseenter." + this.getName())
.unbind("mouseleave." + this.getName());
BI.Widget._renderEngine.createElement(window)
.unbind("blur." + this.getName());
BI.Resizers.remove(this.getName());
this.popupView && this.popupView._destroy();
delete needHideWhenAnotherComboOpen[this.getName()];
delete currentOpenedCombos[this.getName()];
},
});
BI.Combo.closeAll = function () {
BI.each(currentOpenedCombos, function (i, combo) {
if (combo) {
combo.hideView();
}
});
currentOpenedCombos = {};
needHideWhenAnotherComboOpen = {};
};
BI.Combo.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
BI.Combo.EVENT_CHANGE = "EVENT_CHANGE";
BI.Combo.EVENT_EXPAND = "EVENT_EXPAND";
BI.Combo.EVENT_COLLAPSE = "EVENT_COLLAPSE";
BI.Combo.EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
p.top && (p.top = p.top / scaleY);
p.left && (p.left = p.left / scaleX);
}
if ("left" in p) {
this.popupView.element.css({
left: p.left,
});
}
if ("top" in p) {
this.popupView.element.css({
top: p.top,
});
}
this.position = p;
this.popupView.setVisible(isVisible);
}
BI.Combo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.Combo.EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
BI.Combo.EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
BI.Combo.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
destroyed() {
Widget._renderEngine.createElement(document)
.unbind("click." + this.getName())
.unbind("mousedown." + this.getName())
.unbind("mousewheel." + this.getName())
.unbind("mouseenter." + this.getName())
.unbind("mouseleave." + this.getName());
Widget._renderEngine.createElement(window)
.unbind("blur." + this.getName());
Resizers.remove(this.getName());
this.popupView && this.popupView._destroy();
delete needHideWhenAnotherComboOpen[this.getName()];
delete currentOpenedCombos[this.getName()];
}
}
BI.shortcut("bi.combo", BI.Combo);
}());
Combo.closeAll = () => {
each(currentOpenedCombos, (i, combo) => {
if (combo) {
combo.hideView();
}
});
currentOpenedCombos = {};
needHideWhenAnotherComboOpen = {};
};

245
src/base/combination/expander.js

@ -6,9 +6,25 @@
* @class BI.Expander
* @extends BI.Widget
*/
BI.Expander = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Expander.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, nextTick, each, debounce, isNull, createWidget } from "../../core";
@shortcut()
export default class Expander extends Widget {
static xtype = "bi.expander";
static EVENT_EXPAND = "EVENT_EXPAND";
static EVENT_COLLAPSE = "EVENT_COLLAPSE";
static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
static EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-expander",
trigger: "click",
toggle: true,
@ -19,48 +35,48 @@ BI.Expander = BI.inherit(BI.Widget, {
expanderClass: "bi-expander-popup",
hoverClass: "bi-expander-hover",
});
},
}
render: function () {
var self = this, o = this.options;
this._expanded = !!o.el.open;
render() {
const { el, hoverClass, isDefaultInit } = this.options;
this._expanded = !!el.open;
this._initExpander();
// 延迟绑定事件,这样可以将自己绑定的事情优先执行
BI.nextTick(() => {
nextTick(() => {
!this.isDestroyed() && this._initPullDownAction();
});
this.expander.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (self.isEnabled() && self.isValid()) {
this.expander.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
if (this.isEnabled() && this.isValid()) {
if (type === BI.Events.EXPAND) {
self._popupView();
this._popupView();
}
if (type === BI.Events.COLLAPSE) {
self._hideView();
this._hideView();
}
if (type === BI.Events.EXPAND) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.fireEvent(BI.Expander.EVENT_EXPAND);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.fireEvent(Expander.EVENT_EXPAND);
}
if (type === BI.Events.COLLAPSE) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.isViewVisible() && self.fireEvent(BI.Expander.EVENT_COLLAPSE);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.isViewVisible() && this.fireEvent(Expander.EVENT_COLLAPSE);
}
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Expander.EVENT_TRIGGER_CHANGE, value, obj);
this.fireEvent(Expander.EVENT_TRIGGER_CHANGE, value, obj);
}
}
});
this.element.hover(function () {
if (self.isEnabled() && self.isValid() && self.expander.isEnabled() && self.expander.isValid()) {
self.element.addClass(o.hoverClass);
this.element.hover(() => {
if (this.isEnabled() && this.isValid() && this.expander.isEnabled() && this.expander.isValid()) {
this.element.addClass(hoverClass);
}
}, function () {
if (self.isEnabled() && self.isValid() && self.expander.isEnabled() && self.expander.isValid()) {
self.element.removeClass(o.hoverClass);
}, () => {
if (this.isEnabled() && this.isValid() && this.expander.isEnabled() && this.expander.isValid()) {
this.element.removeClass(hoverClass);
}
});
BI.createWidget({
createWidget({
type: "bi.vertical",
scrolly: false,
element: this,
@ -68,13 +84,13 @@ BI.Expander = BI.inherit(BI.Widget, {
{ el: this.expander }
],
});
o.isDefaultInit && this._assertPopupView();
isDefaultInit && this._assertPopupView();
if (this.expander.isOpened() === true) {
this._popupView();
}
},
}
_toggle: function () {
_toggle() {
this._assertPopupViewRender();
if (this.popupView.isVisible()) {
this._hideView();
@ -83,40 +99,40 @@ BI.Expander = BI.inherit(BI.Widget, {
this._popupView();
}
}
},
}
_initPullDownAction: function () {
var self = this, o = this.options;
var evs = this.options.trigger.split(",");
BI.each(evs, function (i, e) {
_initPullDownAction() {
const { toggle } = this.options;
const evs = this.options.trigger.split(",");
each(evs, (i, e) => {
switch (e) {
case "hover":
self.element[e](function (e) {
if (self.isEnabled() && self.isValid() && self.expander.isEnabled() && self.expander.isValid()) {
self._popupView();
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EXPAND, "", self.expander);
self.fireEvent(BI.Expander.EVENT_EXPAND);
this.element[e]((e) => {
if (this.isEnabled() && this.isValid() && this.expander.isEnabled() && this.expander.isValid()) {
this._popupView();
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.EXPAND, "", this.expander);
this.fireEvent(Expander.EVENT_EXPAND);
}
}, function () {
if (self.isEnabled() && self.isValid() && self.expander.isEnabled() && self.expander.isValid() && o.toggle) {
self._hideView();
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", self.expander);
self.fireEvent(BI.Expander.EVENT_COLLAPSE);
}, () => {
if (this.isEnabled() && this.isValid() && this.expander.isEnabled() && this.expander.isValid() && toggle) {
this._hideView();
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", this.expander);
this.fireEvent(Expander.EVENT_COLLAPSE);
}
});
break;
case "click":
if (e) {
self.element.off(e + "." + self.getName()).on(e + "." + self.getName(), BI.debounce(function (e) {
if (self.expander.element.__isMouseInBounds__(e)) {
if (self.isEnabled() && self.isValid() && self.expander.isEnabled() && self.expander.isValid()) {
o.toggle ? self._toggle() : self._popupView();
if (self.isExpanded()) {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EXPAND, "", self.expander);
self.fireEvent(BI.Expander.EVENT_EXPAND);
this.element.off(e + "." + this.getName()).on(e + "." + this.getName(), debounce((e) => {
if (this.expander.element.__isMouseInBounds__(e)) {
if (this.isEnabled() && this.isValid() && this.expander.isEnabled() && this.expander.isValid()) {
toggle ? this._toggle() : this._popupView();
if (this.isExpanded()) {
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.EXPAND, "", this.expander);
this.fireEvent(Expander.EVENT_EXPAND);
} else {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", self.expander);
self.fireEvent(BI.Expander.EVENT_COLLAPSE);
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", this.expander);
this.fireEvent(Expander.EVENT_COLLAPSE);
}
}
}
@ -130,16 +146,16 @@ BI.Expander = BI.inherit(BI.Widget, {
break;
}
});
},
}
_initExpander: function () {
this.expander = BI.createWidget(this.options.el);
},
_initExpander() {
this.expander = createWidget(this.options.el);
}
_assertPopupView: function () {
var self = this, o = this.options;
if (BI.isNull(this.popupView)) {
this.popupView = BI.createWidget(this.options.popup, {
_assertPopupView() {
const { value } = this.options;
if (isNull(this.popupView)) {
this.popupView = createWidget(this.options.popup, {
type: "bi.button_group",
cls: "expander-popup",
layouts: [{
@ -147,26 +163,26 @@ BI.Expander = BI.inherit(BI.Widget, {
hgap: 0,
vgap: 0,
}],
value: o.value,
value,
}, this);
this.popupView.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.popupView.on(Controller.EVENT_CHANGE, (type, value, obj, ...args)=> {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
// self.setValue(self.getValue());
self.fireEvent(BI.Expander.EVENT_CHANGE, value, obj);
this.fireEvent(Expander.EVENT_CHANGE, value, obj);
}
});
this.popupView.setVisible(this.isExpanded());
BI.nextTick(function () {
self.fireEvent(BI.Expander.EVENT_AFTER_INIT);
nextTick(() => {
this.fireEvent(Expander.EVENT_AFTER_INIT);
});
}
},
}
_assertPopupViewRender: function () {
_assertPopupViewRender() {
this._assertPopupView();
if (!this._rendered) {
BI.createWidget({
createWidget({
type: "bi.vertical",
scrolly: false,
element: this,
@ -176,113 +192,100 @@ BI.Expander = BI.inherit(BI.Widget, {
});
this._rendered = true;
}
},
}
_hideView: function () {
this.fireEvent(BI.Expander.EVENT_BEFORE_HIDEVIEW);
_hideView() {
this.fireEvent(Expander.EVENT_BEFORE_HIDEVIEW);
this._expanded = false;
this.expander.setOpened(false);
this.popupView && this.popupView.invisible();
this.element.removeClass(this.options.expanderClass);
this.fireEvent(BI.Expander.EVENT_AFTER_HIDEVIEW);
},
this.fireEvent(Expander.EVENT_AFTER_HIDEVIEW);
}
_popupView: function () {
_popupView() {
this._assertPopupViewRender();
this.fireEvent(BI.Expander.EVENT_BEFORE_POPUPVIEW);
this.fireEvent(Expander.EVENT_BEFORE_POPUPVIEW);
this._expanded = true;
this.expander.setOpened(true);
this.popupView.visible();
this.element.addClass(this.options.expanderClass);
this.fireEvent(BI.Expander.EVENT_AFTER_POPUPVIEW);
},
this.fireEvent(Expander.EVENT_AFTER_POPUPVIEW);
}
populate: function (items) {
populate(items) {
// this._assertPopupView();
this.popupView && this.popupView.populate.apply(this.popupView, arguments);
this.expander.populate && this.expander.populate.apply(this.expander, arguments);
},
}
_setEnable: function (arg) {
BI.Expander.superclass._setEnable.apply(this, arguments);
_setEnable(arg) {
super._setEnable(arguments);
!arg && this.element.removeClass(this.options.hoverClass);
!arg && this.isViewVisible() && this._hideView();
},
}
setValue: function (v) {
setValue(v) {
this.expander.setValue(v);
if (BI.isNull(this.popupView)) {
if (isNull(this.popupView)) {
this.options.popup.value = v;
} else {
this.popupView.setValue(v);
}
},
}
getValue: function () {
if (BI.isNull(this.popupView)) {
getValue() {
if (isNull(this.popupView)) {
return this.options.popup.value;
} else {
return this.popupView.getValue();
}
},
}
isViewVisible: function () {
isViewVisible() {
return this.isEnabled() && this.expander.isEnabled() && !!this.popupView && this.popupView.isVisible();
},
}
isExpanded: function () {
isExpanded() {
return this._expanded;
},
}
showView: function () {
showView() {
if (this.isEnabled() && this.expander.isEnabled()) {
this._popupView();
}
},
}
hideView: function () {
hideView() {
this._hideView();
},
}
getView: function () {
getView() {
return this.popupView;
},
}
getAllLeaves: function () {
getAllLeaves() {
return this.popupView && this.popupView.getAllLeaves();
},
}
getNodeById: function (id) {
getNodeById(id) {
if (this.expander.options.id === id) {
return this.expander;
}
return this.popupView && this.popupView.getNodeById(id);
},
}
getNodeByValue: function (value) {
getNodeByValue(value) {
if (this.expander.getValue() === value) {
return this.expander;
}
return this.popupView && this.popupView.getNodeByValue(value);
},
destroy: function () {
BI.Expander.superclass.destroy.apply(this, arguments);
},
});
BI.Expander.EVENT_EXPAND = "EVENT_EXPAND";
BI.Expander.EVENT_COLLAPSE = "EVENT_COLLAPSE";
BI.Expander.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
BI.Expander.EVENT_CHANGE = "EVENT_CHANGE";
BI.Expander.EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
BI.Expander.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.Expander.EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
BI.Expander.EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
BI.Expander.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
}
BI.shortcut("bi.expander", BI.Expander);
destroy() {
super.destroy(arguments);
}
}

326
src/base/combination/group.button.js

@ -3,10 +3,16 @@
* @class BI.ButtonGroup
* @extends BI.Widget
*/
import { shortcut, Widget, Controller, extend, createWidget, createWidgets, each, isFunction, isKey, isNotEmptyArray, createItems, isArray, remove, map, stripEL, makeArrayByArray, clone, deepClone, formatEL, isEmpty, concat, removeAt, deepContains, has, any } from "../../core";
BI.ButtonGroup = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.ButtonGroup.superclass._defaultConfig.apply(this, arguments), {
@shortcut()
export default class ButtonGroup extends Widget {
static xtype = "bi.button_group";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-button-group",
behaviors: {},
items: [],
@ -18,83 +24,84 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
vgap: 0,
}],
});
},
}
render: function () {
var self = this, o = this.options;
var behaviors = {};
BI.each(o.behaviors, function (key, rule) {
render() {
const { behaviors: optionsBehaviors, items: optionsItems, value } = this.options;
const behaviors = {};
each(optionsBehaviors, (key, rule) => {
behaviors[key] = BI.BehaviorFactory.createBehavior(key, {
rule: rule,
});
});
this.behaviors = behaviors;
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}) : o.items;
const items = isFunction(optionsItems) ? this.__watch(optionsItems, (context, newValue) => {
this.populate(newValue);
}) : optionsItems;
this.populate(items);
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
self.setValue(newValue);
}) : o.value;
if (BI.isKey(o.value) || BI.isNotEmptyArray(o.value)) {
this.setValue(o.value);
this.options.value = isFunction(value) ? this.__watch(value, (context, newValue) => {
this.setValue(newValue);
}) : value;
if (isKey(value) || isNotEmptyArray(value)) {
this.setValue(value);
}
},
}
_createBtns: function (items) {
var btns;
BI.Widget.execWithContext(this, function () {
btns = BI.createWidgets(BI.createItems(items, {
_createBtns(items) {
let btns;
Widget.execWithContext(this, () => {
btns = createWidgets(createItems(items, {
type: "bi.text_button",
}));
});
return btns;
},
}
_btnsCreator: function (items) {
var self = this, args = Array.prototype.slice.call(arguments), o = this.options;
var buttons = this._createBtns(items);
_btnsCreator(items) {
const args = Array.prototype.slice.call(arguments);
const { chooseType } = this.options;
const buttons = this._createBtns(items);
args[0] = buttons;
BI.each(this.behaviors, function (i, behavior) {
each(this.behaviors, (i, behavior) => {
behavior.doBehavior.apply(behavior, args);
});
BI.each(buttons, function (i, btn) {
btn.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
each(buttons, (i, btn) => {
btn.on(Controller.EVENT_CHANGE, (type, value, obj, ...arg) => {
if (type === BI.Events.CLICK) {
switch (o.chooseType) {
case BI.ButtonGroup.CHOOSE_TYPE_SINGLE:
self.setValue(btn.getValue());
switch (chooseType) {
case ButtonGroup.CHOOSE_TYPE_SINGLE:
this.setValue(btn.getValue());
break;
case BI.ButtonGroup.CHOOSE_TYPE_NONE:
self.setValue([]);
case ButtonGroup.CHOOSE_TYPE_NONE:
this.setValue([]);
break;
default:
break;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.fireEvent(BI.ButtonGroup.EVENT_CHANGE, value, obj);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...arg);
this.fireEvent(ButtonGroup.EVENT_CHANGE, value, obj);
} else {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...arg);
}
});
btn.on(BI.Events.DESTROY, function () {
BI.remove(self.buttons, btn);
btn.on(BI.Events.DESTROY, () => {
remove(this.buttons, btn);
});
});
return buttons;
},
_packageBtns: function (btns) {
var o = this.options;
var layouts = BI.isArray(o.layouts) ? o.layouts : [o.layouts];
for (var i = layouts.length - 1; i > 0; i--) {
btns = BI.map(btns, function (k, it) {
return BI.extend({}, layouts[i], {
}
_packageBtns(btns) {
const { layouts: optionsLayouts } = this.options;
const layouts = isArray(optionsLayouts) ? optionsLayouts : [optionsLayouts];
for (let i = layouts.length - 1; i > 0; i--) {
btns = map(btns, (k, it) => {
return extend({}, layouts[i], {
items: [
BI.extend({}, layouts[i].el, {
extend({}, layouts[i].el, {
el: it,
})
],
@ -103,56 +110,57 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
}
return btns;
},
}
_packageSimpleItems: function (btns) {
var o = this.options;
_packageSimpleItems(btns) {
const { items } = this.options;
return BI.map(o.items, function (i, item) {
if (BI.stripEL(item) === item) {
return map(items, (i, item) => {
if (stripEL(item) === item) {
return btns[i];
}
return BI.extend({}, item, {
return extend({}, item, {
el: btns[i],
});
});
},
}
_packageItems: function (items, packBtns) {
return BI.createItems(BI.makeArrayByArray(items, {}), BI.clone(packBtns));
},
_packageItems(items, packBtns) {
return createItems(makeArrayByArray(items, {}), clone(packBtns));
}
_packageLayout: function (items) {
var o = this.options, layout = BI.deepClone(BI.isArray(o.layouts) ? o.layouts[0] : o.layouts);
_packageLayout(items) {
const { layouts } = this.options;
const layout = deepClone(isArray(layouts) ? layouts[0] : layouts);
var lay = BI.formatEL(layout).el;
while (lay && lay.items && !BI.isEmpty(lay.items)) {
lay = BI.formatEL(lay.items[0]).el;
let lay = formatEL(layout).el;
while (lay && lay.items && !isEmpty(lay.items)) {
lay = formatEL(lay.items[0]).el;
}
lay.items = items;
return layout;
},
}
// 如果是一个简单的layout
_isSimpleLayout: function () {
var o = this.options;
_isSimpleLayout() {
const { layouts, items } = this.options;
return BI.isArray(o.layouts) ? (o.layouts.length === 1 && !BI.isArray(o.items[0])) : true;
},
return isArray(layouts) ? (layouts.length === 1 && !isArray(items[0])) : true;
}
doBehavior: function () {
var args = Array.prototype.slice.call(arguments);
doBehavior() {
const args = Array.prototype.slice.call(arguments);
args.unshift(this.buttons);
BI.each(this.behaviors, function (i, behavior) {
each(this.behaviors, (i, behavior) => {
behavior.doBehavior.apply(behavior, args);
});
},
}
prependItems: function (items) {
var btns = this._btnsCreator.apply(this, arguments);
this.buttons = BI.concat(btns, this.buttons);
prependItems(items) {
const btns = this._btnsCreator.apply(this, arguments);
this.buttons = concat(btns, this.buttons);
if (this._isSimpleLayout() && this.layouts && this.layouts.prependItems) {
this.layouts.prependItems(btns);
@ -162,11 +170,11 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
items = this._packageItems(items, this._packageBtns(btns));
this.layouts.prependItems(this._packageLayout(items).items);
},
}
addItems: function (items) {
var btns = this._btnsCreator.apply(this, arguments);
this.buttons = BI.concat(this.buttons, btns);
addItems(items) {
const btns = this._btnsCreator.apply(this, arguments);
this.buttons = concat(this.buttons, btns);
// 如果是一个简单的layout
if (this._isSimpleLayout() && this.layouts && this.layouts.addItems) {
@ -177,26 +185,26 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
items = this._packageItems(items, this._packageBtns(btns));
this.layouts.addItems(this._packageLayout(items).items);
},
}
removeItemAt: function (indexes) {
BI.removeAt(this.buttons, indexes);
removeItemAt(indexes) {
removeAt(this.buttons, indexes);
this.layouts.removeItemAt(indexes);
},
}
removeItems: function (values) {
values = BI.isArray(values) ? values : [values];
var deleted = [];
BI.each(this.buttons, function (i, button) {
if (BI.deepContains(values, button.getValue())) {
removeItems(values) {
values = isArray(values) ? values : [values];
const deleted = [];
each(this.buttons, (i, button) => {
if (deepContains(values, button.getValue())) {
deleted.push(i);
}
});
BI.removeAt(this.buttons, deleted);
removeAt(this.buttons, deleted);
this.layouts.removeItemAt(deleted);
},
}
populate: function (items) {
populate(items) {
items = items || [];
this.empty();
this.options.items = items;
@ -208,114 +216,114 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
items = this._packageItems(items, this._packageBtns(this.buttons));
}
this.layouts = BI.createWidget(BI.extend({ element: this }, this._packageLayout(items)));
},
this.layouts = createWidget(extend({ element: this }, this._packageLayout(items)));
}
setNotSelectedValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (BI.deepContains(v, item.getValue())) {
setNotSelectedValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (deepContains(v, item.getValue())) {
item.setSelected && item.setSelected(false);
} else {
item.setSelected && item.setSelected(true);
}
});
},
}
setEnabledValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (BI.deepContains(v, item.getValue())) {
setEnabledValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (deepContains(v, item.getValue())) {
item.setEnable(true);
} else {
item.setEnable(false);
}
});
},
}
setValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (BI.deepContains(v, item.getValue())) {
setValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (deepContains(v, item.getValue())) {
item.setSelected && item.setSelected(true);
} else {
item.setSelected && item.setSelected(false);
}
});
},
}
setValueMap: function (map) {
setValueMap(map) {
map = map || {};
BI.each(this.buttons, function (i, item) {
if (BI.has(map, item.getValue())) {
each(this.buttons, (i, item) => {
if (has(map, item.getValue())) {
item.setSelected && item.setSelected(true);
} else {
item.setSelected && item.setSelected(false);
}
});
},
}
setAllSelected: function (v) {
BI.each(this.getAllButtons(), function (i, btn) {
setAllSelected(v) {
each(this.getAllButtons(), (i, btn) => {
(btn.setSelected || btn.setAllSelected).apply(btn, [v]);
});
},
}
getNotSelectedValue: function () {
var v = [];
BI.each(this.buttons, function (i, item) {
getNotSelectedValue() {
const v = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !(item.isSelected && item.isSelected())) {
v.push(item.getValue());
}
});
return v;
},
}
getValue: function () {
var v = [];
BI.each(this.buttons, function (i, item) {
getValue() {
const v = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && item.isSelected && item.isSelected()) {
v.push(item.getValue());
}
});
return v;
},
}
getAllButtons: function () {
getAllButtons() {
return this.buttons;
},
}
getAllLeaves: function () {
getAllLeaves() {
return this.buttons;
},
}
getSelectedButtons: function () {
var btns = [];
BI.each(this.buttons, function (i, item) {
getSelectedButtons() {
const btns = [];
each(this.buttons, (i, item) => {
if (item.isSelected && item.isSelected()) {
btns.push(item);
}
});
return btns;
},
}
getNotSelectedButtons: function () {
var btns = [];
BI.each(this.buttons, function (i, item) {
getNotSelectedButtons() {
const btns = [];
each(this.buttons, (i, item) => {
if (item.isSelected && !item.isSelected()) {
btns.push(item);
}
});
return btns;
},
}
getIndexByValue: function (value) {
var index = -1;
BI.any(this.buttons, function (i, item) {
getIndexByValue(value) {
let index = -1;
any(this.buttons, (i, item) => {
if (item.isEnabled() && item.getValue() === value) {
index = i;
@ -324,11 +332,11 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
});
return index;
},
}
getNodeById: function (id) {
var node;
BI.any(this.buttons, function (i, item) {
getNodeById(id) {
let node;
any(this.buttons, (i, item) => {
if (item.isEnabled() && item.options.id === id) {
node = item;
@ -337,11 +345,11 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
});
return node;
},
}
getNodeByValue: function (value) {
var node;
BI.any(this.buttons, function (i, item) {
getNodeByValue(value) {
let node;
any(this.buttons, (i, item) => {
if (item.isEnabled() && item.getValue() === value) {
node = item;
@ -350,35 +358,33 @@ BI.ButtonGroup = BI.inherit(BI.Widget, {
});
return node;
},
}
/**
* 滚动到指定的节点
*/
scrollToValue: function (value, scrollIntoViewOptions) {
var node = this.getNodeByValue(value);
scrollToValue(value, scrollIntoViewOptions) {
const node = this.getNodeByValue(value);
if (node) {
node.element[0].scrollIntoView(scrollIntoViewOptions);
}
},
}
empty: function () {
BI.ButtonGroup.superclass.empty.apply(this, arguments);
empty() {
super.empty(arguments);
this.options.items = [];
},
}
destroy: function () {
BI.ButtonGroup.superclass.destroy.apply(this, arguments);
destroy() {
super.destroy(arguments);
this.options.items = [];
},
});
BI.extend(BI.ButtonGroup, {
}
}
extend(ButtonGroup, {
CHOOSE_TYPE_SINGLE: BI.Selection.Single,
CHOOSE_TYPE_MULTI: BI.Selection.Multi,
CHOOSE_TYPE_ALL: BI.Selection.All,
CHOOSE_TYPE_NONE: BI.Selection.None,
CHOOSE_TYPE_DEFAULT: BI.Selection.Default,
});
BI.ButtonGroup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.button_group", BI.ButtonGroup);

98
src/base/combination/group.combo.js

@ -2,9 +2,16 @@
* Created by GUY on 2015/8/10.
*/
BI.ComboGroup = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.ComboGroup.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, isEmpty, each, formatEL, clone, createWidget } from "../../core";
@shortcut()
export default class ComboGroup extends Widget {
static xtype = "bi.combo_group";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-combo-group bi-list-item",
// 以下这些属性对每一个combo都是公用的
@ -28,69 +35,66 @@ BI.ComboGroup = BI.inherit(BI.Widget, {
},
},
});
},
}
render: function () {
render() {
this._populate(this.options.el);
},
}
_populate: function (item) {
var self = this, o = this.options;
var children = o.items;
if (BI.isEmpty(children)) {
_populate(item) {
const { items, action, height, direction, isDefaultInit, isNeedAdjustHeight, isNeedAdjustWidth, adjustLength, popup, container, trigger } = this.options;
const children = items;
if (isEmpty(children)) {
throw new Error("ComboGroup构造错误");
}
BI.each(children, function (i, ch) {
var son = BI.formatEL(ch).el.children;
ch = BI.formatEL(ch).el;
if (!BI.isEmpty(son)) {
ch.el = BI.clone(ch);
each(children, (i, ch) => {
const son = formatEL(ch).el.children;
ch = formatEL(ch).el;
if (!isEmpty(son)) {
ch.el = clone(ch);
ch.items = son;
ch.type = "bi.combo_group";
ch.action = o.action;
ch.height = o.height;
ch.direction = o.direction;
ch.isDefaultInit = o.isDefaultInit;
ch.isNeedAdjustHeight = o.isNeedAdjustHeight;
ch.isNeedAdjustWidth = o.isNeedAdjustWidth;
ch.adjustLength = o.adjustLength;
ch.popup = o.popup;
ch.action = action;
ch.height = height;
ch.direction = direction;
ch.isDefaultInit = isDefaultInit;
ch.isNeedAdjustHeight = isNeedAdjustHeight;
ch.isNeedAdjustWidth = isNeedAdjustWidth;
ch.adjustLength = adjustLength;
ch.popup = popup;
}
});
this.combo = BI.createWidget({
this.combo = createWidget({
type: "bi.combo",
element: this,
container: o.container,
height: o.height,
trigger: o.trigger,
direction: o.direction,
isDefaultInit: o.isDefaultInit,
isNeedAdjustWidth: o.isNeedAdjustWidth,
isNeedAdjustHeight: o.isNeedAdjustHeight,
adjustLength: o.adjustLength,
container,
height,
trigger,
direction,
isDefaultInit,
isNeedAdjustWidth,
isNeedAdjustHeight,
adjustLength,
el: item,
popup: BI.extend({}, o.popup, {
el: BI.extend({
popup: extend({}, popup, {
el: extend({
items: children,
}, o.popup.el),
}, popup.el),
}),
});
this.combo.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.combo.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
self.fireEvent(BI.ComboGroup.EVENT_CHANGE, obj);
this.fireEvent(ComboGroup.EVENT_CHANGE, obj);
}
});
},
}
getValue: function () {
getValue() {
return this.combo.getValue();
},
}
setValue: function (v) {
setValue(v) {
this.combo.setValue(v);
},
});
BI.ComboGroup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.combo_group", BI.ComboGroup);
}
}

130
src/base/combination/group.virtual.js

@ -1,6 +1,13 @@
BI.VirtualGroup = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.VirtualGroup.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, isFunction, isKey, isArray, map, stripEL, deepClone, formatEL, isEmpty, each, createWidget } from "../../core";
@shortcut()
export default class VirtualGroup extends Widget {
static xtype = "bi.virtual_group";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-virtual-group",
items: [],
layouts: [{
@ -9,36 +16,36 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
vgap: 0,
}],
});
},
}
render: function () {
var self = this, o = this.options;
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}) : o.items;
render() {
const { items: optionsItems, value } = this.options;
const items = isFunction(optionsItems) ? this.__watch(optionsItems, (context, newValue) => {
this.populate(newValue);
}) : optionsItems;
this.populate(items);
o.value = BI.isFunction(o.value) ? this.__watch(o.value, function (context, newValue) {
self.setValue(newValue);
}) : o.value;
if (BI.isKey(o.value)) {
this.setValue(o.value);
this.options.value = isFunction(value) ? this.__watch(value, (context, newValue) => {
this.setValue(newValue);
}) : value;
if (isKey(value)) {
this.setValue(value);
}
},
}
_packageBtns: function (items) {
var o = this.options;
var map = this.buttonMap = {};
var layouts = BI.isArray(o.layouts) ? o.layouts : [o.layouts];
_packageBtns(items) {
const o = this.options;
const map = this.buttonMap = {};
const layouts = isArray(o.layouts) ? o.layouts : [o.layouts];
for (let i = layouts.length - 1; i > 0; i--) {
items = BI.map(items, function (k, it) {
var el = BI.stripEL(it);
items = map(items, (k, it) => {
const el = stripEL(it);
return BI.extend({}, layouts[i], {
return extend({}, layouts[i], {
items: [
BI.extend({}, layouts[i].el, {
el: BI.extend({
ref: function (_ref) {
if (BI.isKey(map[el.value])) {
extend({}, layouts[i].el, {
el: extend({
ref: (_ref) => {
if (isKey(map[el.value])) {
map[el.value] = _ref;
}
},
@ -50,33 +57,33 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
}
return items;
},
}
_packageLayout: function (items) {
var o = this.options;
var layouts = BI.isArray(o.layouts) ? o.layouts : [o.layouts];
var layout = BI.deepClone(layouts[0]);
_packageLayout(items) {
const o = this.options;
const layouts = isArray(o.layouts) ? o.layouts : [o.layouts];
const layout = deepClone(layouts[0]);
var lay = BI.formatEL(layout).el;
while (lay && lay.items && !BI.isEmpty(lay.items)) {
lay = BI.formatEL(lay.items[0]).el;
let lay = formatEL(layout).el;
while (lay && lay.items && !isEmpty(lay.items)) {
lay = formatEL(lay.items[0]).el;
}
lay.items = items;
return layout;
},
}
addItems: function (items) {
addItems(items) {
this.layouts.addItems(items, this);
},
}
prependItems: function (items) {
prependItems(items) {
this.layouts.prependItems(items, this);
},
}
setValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttonMap, function (key, item) {
setValue(v) {
v = isArray(v) ? v : [v];
each(this.buttonMap, (key, item) => {
if (item) {
if (v.deepContains(key)) {
item.setSelected && item.setSelected(true);
@ -85,11 +92,11 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
}
}
});
},
}
getNotSelectedValue: function () {
var v = [];
BI.each(this.buttonMap, function (i, item) {
getNotSelectedValue() {
const v = [];
each(this.buttonMap, (i, item) => {
if (item) {
if (item.isEnabled() && !(item.isSelected && item.isSelected())) {
v.push(item.getValue());
@ -98,25 +105,25 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
});
return v;
},
}
getNodeByValue: function (value) {
getNodeByValue(value) {
return this.buttonMap[value];
},
}
/**
* 滚动到指定的节点
*/
scrollToValue: function (value, scrollIntoViewOptions) {
var node = this.getNodeByValue(value);
scrollToValue(value, scrollIntoViewOptions) {
const node = this.getNodeByValue(value);
if (node) {
node.element[0].scrollIntoView(scrollIntoViewOptions);
}
},
}
getValue: function () {
var v = [];
BI.each(this.buttonMap, function (i, item) {
getValue() {
const v = [];
each(this.buttonMap, (i, item) => {
if (item) {
if (item.isEnabled() && item.isSelected && item.isSelected()) {
v.push(item.getValue());
@ -125,21 +132,18 @@ BI.VirtualGroup = BI.inherit(BI.Widget, {
});
return v;
},
}
populate: function (items) {
populate(items) {
items = items || [];
this.options.items = items;
items = this._packageBtns(items);
if (!this.layouts) {
this.layouts = BI.createWidget(BI.extend({ element: this }, this._packageLayout(items)));
this.layouts = createWidget(extend({ element: this }, this._packageLayout(items)));
} else {
this.layouts.populate(items, {
context: this,
});
}
},
});
BI.VirtualGroup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.virtual_group", BI.VirtualGroup);
}
}

221
src/base/combination/loader.js

@ -5,9 +5,16 @@
* @class BI.Loader
* @extends BI.Widget
*/
BI.Loader = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Loader.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, createWidget, isEmpty, nextTick, bind, isFunction, isNotEmptyArray, isNumber, isObject, each } from "../../core";
@shortcut()
export default class Loader extends Widget {
static xtype = "bi.loader";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-loader",
direction: "top",
@ -33,115 +40,115 @@ BI.Loader = BI.inherit(BI.Widget, {
hasPrev: BI.emptyFn,
hasNext: BI.emptyFn,
});
},
}
_prevLoad: function () {
var self = this, o = this.options;
_prevLoad() {
const o = this.options;
this.prev.setLoading();
o.itemsCreator.apply(this, [{ times: --this.times }, function () {
self.prev.setLoaded();
self.prependItems.apply(self, arguments);
o.itemsCreator.apply(this, [{ times: --this.times }, (...args) => {
this.prev.setLoaded();
this.prependItems.apply(this, args);
}]);
},
}
_nextLoad: function () {
var self = this, o = this.options;
_nextLoad() {
const o = this.options;
this.next.setLoading();
o.itemsCreator.apply(this, [{ times: ++this.times }, function () {
self.next.setLoaded();
self.addItems.apply(self, arguments);
o.itemsCreator.apply(this, [{ times: ++this.times }, (...args) => {
this.next.setLoaded();
this.addItems.apply(this, args);
}]);
},
}
render: function () {
var self = this, o = this.options;
if (o.itemsCreator === false) {
o.prev = false;
o.next = false;
render() {
const { itemsCreator, prev, next, el, items: optionsItems, value, direction, logic, isDefaultInit } = this.options;
if (itemsCreator === false) {
prev = false;
next = false;
}
if (o.prev !== false) {
this.prev = BI.createWidget(BI.extend({
if (prev !== false) {
this.prev = createWidget(extend({
type: "bi.loading_bar",
}, o.prev));
this.prev.on(BI.Controller.EVENT_CHANGE, function (type) {
}, prev));
this.prev.on(Controller.EVENT_CHANGE, (type) => {
if (type === BI.Events.CLICK) {
self._prevLoad();
this._prevLoad();
}
});
}
this.button_group = BI.createWidget(o.el, {
this.button_group = createWidget(el, {
type: "bi.button_group",
chooseType: 0,
items: o.items,
items: optionsItems,
behaviors: {},
layouts: [{
type: "bi.vertical",
}],
value: o.value,
value,
});
this.button_group.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.button_group.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Loader.EVENT_CHANGE, obj);
this.fireEvent(Loader.EVENT_CHANGE, obj);
}
});
if (o.next !== false) {
this.next = BI.createWidget(BI.extend({
if (next !== false) {
this.next = createWidget(extend({
type: "bi.loading_bar",
}, o.next));
this.next.on(BI.Controller.EVENT_CHANGE, function (type) {
}, next));
this.next.on(Controller.EVENT_CHANGE, (type) => {
if (type === BI.Events.CLICK) {
self._nextLoad();
this._nextLoad();
}
});
}
BI.createWidget(BI.extend({
createWidget(extend({
element: this,
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(o.direction), BI.extend({
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(direction), extend({
scrolly: true,
}, o.logic, {
items: BI.LogicFactory.createLogicItemsByDirection(o.direction, this.prev, this.button_group, this.next),
}, logic, {
items: BI.LogicFactory.createLogicItemsByDirection(direction, this.prev, this.button_group, this.next),
}))));
o.isDefaultInit && BI.isEmpty(o.items) && BI.nextTick(BI.bind(function () {
o.isDefaultInit && BI.isEmpty(o.items) && this._populate();
isDefaultInit && isEmpty(optionsItems) && nextTick(bind(() => {
isDefaultInit && isEmpty(optionsItems) && this._populate();
}, this));
var items = BI.isFunction(o.items) ? this.__watch(o.items, function (context, newValue) {
self.populate(newValue);
}) : o.items;
if (BI.isNotEmptyArray(items)) {
const items = isFunction(optionsItems) ? this.__watch(optionsItems, (context, newValue) => {
this.populate(newValue);
}) : optionsItems;
if (isNotEmptyArray(items)) {
this._populate(items);
}
},
}
hasPrev: function () {
var o = this.options;
if (BI.isNumber(o.count)) {
return this.count < o.count;
hasPrev() {
const { count, hasPrev } = this.options;
if (isNumber(count)) {
return this.count < count;
}
return !!o.hasPrev.apply(this, [{
return !!hasPrev.apply(this, [{
times: this.times,
count: this.count,
}]);
},
}
hasNext: function () {
var o = this.options;
if (BI.isNumber(o.count)) {
return this.count < o.count;
hasNext() {
const { count, hasNext } = this.options;
if (isNumber(count)) {
return this.count < count;
}
return !!o.hasNext.apply(this, [{
return !!hasNext.apply(this, [{
times: this.times,
count: this.count,
}]);
},
}
prependItems: function (items) {
prependItems(items) {
this.count += items.length;
if (this.next !== false) {
if (this.hasPrev()) {
@ -152,11 +159,11 @@ BI.Loader = BI.inherit(BI.Widget, {
}
}
this.button_group.prependItems.apply(this.button_group, arguments);
},
}
addItems: function (items) {
addItems(items) {
this.count += items.length;
if (BI.isObject(this.next)) {
if (isObject(this.next)) {
if (this.hasNext()) {
this.options.items = this.options.items.concat(items);
this.next.setLoaded();
@ -165,16 +172,16 @@ BI.Loader = BI.inherit(BI.Widget, {
}
}
this.button_group.addItems.apply(this.button_group, arguments);
},
}
_populate: function (items) {
var self = this, o = this.options;
if (arguments.length === 0 && (BI.isFunction(o.itemsCreator))) {
o.itemsCreator.apply(this, [{ times: 1 }, function () {
if (arguments.length === 0) {
_populate(items) {
const o = this.options;
if (arguments.length === 0 && (isFunction(o.itemsCreator))) {
o.itemsCreator.apply(this, [{ times: 1 }, (...args) => {
if (args.length === 0) {
throw new Error("参数不能为空");
}
self.populate.apply(self, arguments);
this.populate.apply(this, args);
o.onLoaded();
}]);
@ -184,14 +191,14 @@ BI.Loader = BI.inherit(BI.Widget, {
this.times = 1;
this.count = 0;
this.count += items.length;
if (BI.isObject(this.next)) {
if (isObject(this.next)) {
if (this.hasNext()) {
this.next.setLoaded();
} else {
this.next.invisible();
}
}
if (BI.isObject(this.prev)) {
if (isObject(this.prev)) {
if (this.hasPrev()) {
this.prev.setLoaded();
} else {
@ -200,66 +207,64 @@ BI.Loader = BI.inherit(BI.Widget, {
}
return true;
},
}
populate: function () {
populate() {
this._populate.apply(this, arguments) && this.button_group.populate.apply(this.button_group, arguments);
},
}
setNotSelectedValue: function () {
setNotSelectedValue() {
this.button_group.setNotSelectedValue.apply(this.button_group, arguments);
},
}
getNotSelectedValue: function () {
getNotSelectedValue() {
return this.button_group.getNotSelectedValue();
},
}
setValue: function () {
setValue() {
this.button_group.setValue.apply(this.button_group, arguments);
},
}
getValue: function () {
getValue() {
return this.button_group.getValue.apply(this.button_group, arguments);
},
}
getAllButtons: function () {
getAllButtons() {
return this.button_group.getAllButtons();
},
}
getAllLeaves: function () {
getAllLeaves() {
return this.button_group.getAllLeaves();
},
}
getSelectedButtons: function () {
getSelectedButtons() {
return this.button_group.getSelectedButtons();
},
}
getNotSelectedButtons: function () {
getNotSelectedButtons() {
return this.button_group.getNotSelectedButtons();
},
}
getIndexByValue: function (value) {
getIndexByValue(value) {
return this.button_group.getIndexByValue(value);
},
}
getNodeById: function (id) {
getNodeById(id) {
return this.button_group.getNodeById(id);
},
}
getNodeByValue: function (value) {
getNodeByValue(value) {
return this.button_group.getNodeByValue(value);
},
}
empty: function () {
empty() {
this.button_group.empty();
BI.each([this.prev, this.next], function (i, ob) {
each([this.prev, this.next], (i, ob) => {
ob && ob.setVisible(false);
});
},
destroy: function () {
BI.Loader.superclass.destroy.apply(this, arguments);
},
});
BI.Loader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.loader", BI.Loader);
}
destroy() {
super.destroy(arguments);
}
}

162
src/base/combination/navigation.js

@ -1,10 +1,16 @@
/**
* Created by GUY on 2015/6/26.
*/
import { shortcut, Widget, Controller, extend, createWidget, bind, ShowListener, isFunction, each, nextTick, isKey, values } from "../../core";
BI.Navigation = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Navigation.superclass._defaultConfig.apply(this, arguments), {
@shortcut()
export default class Navigation extends Widget {
static xtype = "bi.navigation";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
direction: "bottom", // top, bottom, left, right, custom
logic: {
dynamic: false,
@ -12,160 +18,158 @@ BI.Navigation = BI.inherit(BI.Widget, {
single: false,
showIndex: false,
tab: false,
cardCreator: function (v) {
return BI.createWidget();
cardCreator: (v) => {
return createWidget();
},
afterCardCreated: BI.emptyFn,
afterCardShow: BI.emptyFn,
});
},
}
render: function () {
var self = this, o = this.options;
this.tab = BI.createWidget(this.options.tab, { type: "bi.button_group" });
render() {
const { direction, logic, cardCreator, showIndex } = this.options;
this.tab = createWidget(this.options.tab, { type: "bi.button_group" });
this.cardMap = {};
this.showIndex = 0;
this.layout = BI.createWidget({
this.layout = createWidget({
type: "bi.card",
});
BI.createWidget(BI.extend({
createWidget(extend({
element: this,
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(o.direction), BI.extend({}, o.logic, {
items: BI.LogicFactory.createLogicItemsByDirection(o.direction, this.tab, this.layout),
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(direction), extend({}, logic, {
items: BI.LogicFactory.createLogicItemsByDirection(direction, this.tab, this.layout),
}))));
new BI.ShowListener({
new ShowListener({
eventObj: this.tab,
cardLayout: this.layout,
cardNameCreator: function (v) {
return self.showIndex + v;
cardNameCreator: (v) => {
return this.showIndex + v;
},
cardCreator: function (v) {
BI.Widget.execWithContext(self, function () {
self.cardMap[v] = o.cardCreator(v);
cardCreator: (v) => {
Widget.execWithContext(this, () => {
this.cardMap[v] = cardCreator(v);
});
return self.cardMap[v];
return this.cardMap[v];
},
afterCardCreated: BI.bind(this.afterCardCreated, this),
afterCardShow: BI.bind(this.afterCardShow, this),
afterCardCreated: bind(this.afterCardCreated, this),
afterCardShow: bind(this.afterCardShow, this),
});
if (BI.isFunction(o.showIndex)) {
this.__watch(o.showIndex, function (context, newValue) {
self.setSelect(newValue);
if (isFunction(showIndex)) {
this.__watch(showIndex, (context, newValue) => {
this.setSelect(newValue);
});
}
},
}
created: function () {
var o = this.options;
if (o.showIndex !== false) {
this.setSelect(o.showIndex);
created() {
const { showIndex } = this.options;
if (showIndex !== false) {
this.setSelect(showIndex);
}
},
}
_deleteOtherCards: function (currCardName) {
var self = this, o = this.options;
if (o.single === true) {
BI.each(this.cardMap, function (name, card) {
_deleteOtherCards(currCardName) {
const { single } = this.options;
if (single === true) {
each(this.cardMap, (name, card) => {
if (name !== (currCardName + "")) {
self.layout.deleteCardByName(name);
delete self.cardMap[name];
this.layout.deleteCardByName(name);
delete this.cardMap[name];
}
});
}
},
}
afterCardCreated: function (v) {
var self = this;
this.cardMap[v].on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
afterCardCreated(v) {
this.cardMap[v].on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Navigation.EVENT_CHANGE, obj);
this.fireEvent(Navigation.EVENT_CHANGE, obj);
}
});
this.options.afterCardCreated.apply(this, arguments);
},
}
afterCardShow: function (v) {
afterCardShow(v) {
this.showIndex = v;
this._deleteOtherCards(v);
this.options.afterCardShow.apply(this, arguments);
},
}
populate: function () {
var card = this.layout.getShowingCard();
populate() {
const card = this.layout.getShowingCard();
if (card) {
return card.populate.apply(card, arguments);
}
},
}
_assertCard: function (v) {
var self = this, o = this.options;
_assertCard(v) {
const { cardCreator } = this.options;
if (!this.layout.isCardExisted(v)) {
BI.Widget.execWithContext(self, function () {
self.cardMap[v] = o.cardCreator(v);
Widget.execWithContext(this, () => {
this.cardMap[v] = cardCreator(v);
});
this.layout.addCardByName(v, this.cardMap[v]);
this.afterCardCreated(v);
}
},
}
setSelect: function (v) {
setSelect(v) {
this._assertCard(v);
this.layout.showCardByName(v);
this._deleteOtherCards(v);
if (this.showIndex !== v) {
this.showIndex = v;
BI.nextTick(BI.bind(this.afterCardShow, this, v));
nextTick(bind(this.afterCardShow, this, v));
}
},
}
getSelect: function () {
getSelect() {
return this.showIndex;
},
}
getSelectedCard: function () {
if (BI.isKey(this.showIndex)) {
getSelectedCard() {
if (isKey(this.showIndex)) {
return this.cardMap[this.showIndex];
}
},
}
getAllCard: function() {
return BI.values(this.cardMap);
},
getAllCard() {
return values(this.cardMap);
}
/**
* @override
*/
setValue: function (v) {
var card = this.layout.getShowingCard();
setValue(v) {
const card = this.layout.getShowingCard();
if (card) {
card.setValue(v);
}
},
}
/**
* @override
*/
getValue: function () {
var card = this.layout.getShowingCard();
getValue() {
const card = this.layout.getShowingCard();
if (card) {
return card.getValue();
}
},
}
empty: function () {
empty() {
this.layout.deleteAllCard();
this.cardMap = {};
},
}
destroy() {
super.destroy(arguments);
}
destroy: function () {
BI.Navigation.superclass.destroy.apply(this, arguments);
},
});
BI.Navigation.EVENT_CHANGE = "EVENT_CHANGE";
}
BI.shortcut("bi.navigation", BI.Navigation);

306
src/base/combination/searcher.js

@ -5,10 +5,23 @@
* @class BI.Searcher
* @extends BI.Widget
*/
BI.Searcher = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Searcher.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, createWidget, debounce, bind, endWith, deepWithout, nextTick, isEmptyString, isNull } from "../../core";
import ButtonGroup from "./group.button";
import { Maskers } from "../0.base";
@shortcut()
export default class Searcher extends Widget {
static xtype = "bi.searcher";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_START = "EVENT_START";
static EVENT_STOP = "EVENT_STOP";
static EVENT_PAUSE = "EVENT_PAUSE";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-searcher",
lgap: 0,
rgap: 0,
@ -20,10 +33,10 @@ BI.Searcher = BI.inherit(BI.Widget, {
isDefaultInit: false,
isAutoSearch: true, // 是否自动搜索
isAutoSync: true, // 是否自动同步数据, 即是否保持搜索面板和adapter面板状态值的统一
chooseType: BI.ButtonGroup.CHOOSE_TYPE_SINGLE,
chooseType: ButtonGroup.CHOOSE_TYPE_SINGLE,
// isAutoSearch为false时启用
onSearch: function (op, callback) {
onSearch: (op, callback) => {
callback([]);
},
@ -40,190 +53,191 @@ BI.Searcher = BI.inherit(BI.Widget, {
offset: {},
},
});
},
}
render: function () {
var self = this, o = this.options;
render() {
const { el, lgap, rgap, tgap, bgap, vgap, hgap, isDefaultInit } = this.options;
this.editor = BI.createWidget(o.el, {
this.editor = createWidget(el, {
type: "bi.search_editor",
});
BI.createWidget({
createWidget({
type: "bi.vertical",
element: this,
lgap: o.lgap,
rgap: o.rgap,
tgap: o.tgap,
bgap: o.bgap,
vgap: o.vgap,
hgap: o.hgap,
lgap,
rgap,
tgap,
bgap,
vgap,
hgap,
items: [this.editor],
});
o.isDefaultInit && (this._assertPopupView());
isDefaultInit && (this._assertPopupView());
var search = BI.debounce(BI.bind(this._search, this), BI.EVENT_RESPONSE_TIME, {
const search = debounce(bind(this._search, this), BI.EVENT_RESPONSE_TIME, {
"leading": true,
"trailing": false,
});
this.editor.on(BI.Controller.EVENT_CHANGE, function (type) {
this.editor.on(Controller.EVENT_CHANGE, (type) => {
switch (type) {
case BI.Events.STARTEDIT:
self._startSearch();
this._startSearch();
break;
case BI.Events.EMPTY:
self._stopSearch();
this._stopSearch();
break;
case BI.Events.CHANGE:
search();
break;
case BI.Events.PAUSE:
if (BI.endWith(this.getValue(), BI.BlankSplitChar)) {
self._pauseSearch();
if (endWith(this.getValue(), BI.BlankSplitChar)) {
this._pauseSearch();
}
break;
default:
break;
}
});
},
}
_assertPopupView: function () {
var self = this, o = this.options;
if ((o.masker && !BI.Maskers.has(this.getName())) || (o.masker === false && !this.popupView)) {
this.popupView = BI.createWidget(o.popup, {
_assertPopupView() {
const { masker, popup, chooseType, isAutoSync, adapter } = this.options;
if ((masker && !Maskers.has(this.getName())) || (masker === false && !this.popupView)) {
this.popupView = createWidget(popup, {
type: "bi.searcher_view",
chooseType: o.chooseType,
chooseType: chooseType,
});
this.popupView.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.popupView.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
if (o.isAutoSync) {
var values = o.adapter && o.adapter.getValue();
switch (o.chooseType) {
case BI.ButtonGroup.CHOOSE_TYPE_SINGLE:
o.adapter && o.adapter.setValue([obj.getValue()]);
if (isAutoSync) {
const values = adapter && adapter.getValue();
switch (chooseType) {
case ButtonGroup.CHOOSE_TYPE_SINGLE:
adapter && adapter.setValue([obj.getValue()]);
break;
case BI.ButtonGroup.CHOOSE_TYPE_MULTI:
case ButtonGroup.CHOOSE_TYPE_MULTI:
if (!obj.isSelected()) {
o.adapter && o.adapter.setValue(BI.deepWithout(values, obj.getValue()));
adapter && adapter.setValue(deepWithout(values, obj.getValue()));
}
values.push(obj.getValue());
o.adapter && o.adapter.setValue(values);
adapter && adapter.setValue(values);
break;
default:
break;
}
}
self.fireEvent(BI.Searcher.EVENT_CHANGE, value, obj);
this.fireEvent(Searcher.EVENT_CHANGE, value, obj);
}
});
BI.nextTick(function () {
self.fireEvent(BI.Searcher.EVENT_AFTER_INIT);
nextTick(() => {
this.fireEvent(Searcher.EVENT_AFTER_INIT);
});
}
if (o.masker && !BI.Maskers.has(this.getName())) {
BI.Maskers.create(this.getName(), o.adapter, BI.extend({
if (masker && !Maskers.has(this.getName())) {
Maskers.create(this.getName(), adapter, extend({
container: this,
render: this.popupView,
}, o.masker), this);
}, masker), this);
}
},
}
_startSearch: function () {
_startSearch() {
this._assertPopupView();
this._stop = false;
this._isSearching = true;
this.fireEvent(BI.Searcher.EVENT_START);
this.fireEvent(Searcher.EVENT_START);
this.popupView.startSearch && this.popupView.startSearch();
// 搜索前先清空dom
// BI.Maskers.get(this.getName()).empty();
BI.nextTick(function (name) {
BI.Maskers.show(name);
nextTick((name) => {
Maskers.show(name);
}, this.getName());
},
}
_pauseSearch: function () {
_pauseSearch() {
this._stop = true;
BI.nextTick(function (name) {
BI.Maskers.hide(name);
nextTick((name) => {
Maskers.hide(name);
}, this.getName());
if (this._isSearching === true) {
this.popupView && this.popupView.pauseSearch && this.popupView.pauseSearch();
this.fireEvent(BI.Searcher.EVENT_PAUSE);
this.fireEvent(Searcher.EVENT_PAUSE);
}
this._isSearching = false;
},
}
_stopSearch: function () {
var name = this.getName();
_stopSearch() {
const name = this.getName();
this._stop = true;
BI.Maskers.hide(name);
Maskers.hide(name);
if (this._isSearching === true) {
this.popupView && this.popupView.stopSearch && this.popupView.stopSearch();
this.fireEvent(BI.Searcher.EVENT_STOP);
this.fireEvent(Searcher.EVENT_STOP);
}
this._isSearching = false;
},
}
_search: function () {
var self = this, o = this.options, keyword = this.editor.getValue();
_search() {
const { isAutoSearch, adapter, isAutoSync, onSearch } = this.options;
const keyword = this.editor.getValue();
if (keyword === "" || this._stop) {
return;
}
if (o.isAutoSearch) {
var items = (o.adapter && ((o.adapter.getItems && o.adapter.getItems()) || o.adapter.attr("items"))) || [];
var finding = BI.Func.getSearchResult(items, keyword);
var match = finding.match, find = finding.find;
if (isAutoSearch) {
const items = (adapter && ((adapter.getItems && adapter.getItems()) || adapter.attr("items"))) || [];
const finding = BI.Func.getSearchResult(items, keyword);
const match = finding.match, find = finding.find;
this.popupView.populate(find, match, keyword);
o.isAutoSync && o.adapter && o.adapter.getValue && this.popupView.setValue(o.adapter.getValue());
self.fireEvent(BI.Searcher.EVENT_SEARCHING);
isAutoSync && adapter && adapter.getValue && this.popupView.setValue(adapter.getValue());
this.fireEvent(Searcher.EVENT_SEARCHING);
return;
}
this.popupView.loading && this.popupView.loading();
o.onSearch({
onSearch({
times: 1,
keyword: keyword,
selectedValues: o.adapter && o.adapter.getValue(),
}, function (searchResult, matchResult) {
if (!self._stop && keyword === self.editor.getValue()) {
var args = [].slice.call(arguments);
selectedValues: adapter && adapter.getValue(),
}, (searchResult, matchResult, ...arg) => {
if (!this._stop && keyword === this.editor.getValue()) {
const args = [searchResult, matchResult, ...arg];
if (args.length > 0) {
args.push(keyword);
}
BI.Maskers.show(self.getName());
self.popupView.populate.apply(self.popupView, args);
o.isAutoSync && o.adapter && o.adapter.getValue && self.popupView.setValue(o.adapter.getValue());
self.popupView.loaded && self.popupView.loaded();
self.fireEvent(BI.Searcher.EVENT_SEARCHING);
Maskers.show(this.getName());
this.popupView.populate.apply(this.popupView, args);
isAutoSync && adapter && adapter.getValue && this.popupView.setValue(adapter.getValue());
this.popupView.loaded && this.popupView.loaded();
this.fireEvent(Searcher.EVENT_SEARCHING);
}
});
},
}
_getLastSearchKeyword: function () {
_getLastSearchKeyword() {
if (this.isValid()) {
var res = this.editor.getValue().split(/\u200b\s\u200b/);
if (BI.isEmptyString(res[res.length - 1])) {
const res = this.editor.getValue().split(/\u200b\s\u200b/);
if (isEmptyString(res[res.length - 1])) {
res = res.slice(0, res.length - 1);
}
return BI.isNull(res) ? "" : res[res.length - 1];
return isNull(res) ? "" : res[res.length - 1];
}
},
}
setAdapter: function (adapter) {
setAdapter(adapter) {
this.options.adapter = adapter;
BI.Maskers.remove(this.getName());
},
Maskers.remove(this.getName());
}
doSearch: function () {
doSearch() {
if (this.isSearching()) {
this._search();
}
},
}
stopSearch: function () {
stopSearch() {
this._stopSearch();// 先停止搜索,然后再去设置editor为空
// important:停止搜索必须退出编辑状态,这里必须加上try(input框不显示时blur会抛异常)
try {
@ -235,103 +249,95 @@ BI.Searcher = BI.inherit(BI.Widget, {
} finally {
this.editor.setValue("");
}
},
}
isSearching: function () {
isSearching() {
return this._isSearching;
},
}
isViewVisible: function () {
return this.editor.isEnabled() && BI.Maskers.isVisible(this.getName());
},
isViewVisible() {
return this.editor.isEnabled() && Maskers.isVisible(this.getName());
}
getView: function () {
getView() {
return this.popupView;
},
}
hasMatched: function () {
hasMatched() {
this._assertPopupView();
return this.popupView.hasMatched();
},
}
adjustHeight: function () {
if (BI.Maskers.has(this.getName()) && BI.Maskers.get(this.getName()).isVisible()) {
BI.Maskers.show(this.getName());
adjustHeight() {
if (Maskers.has(this.getName()) && Maskers.get(this.getName()).isVisible()) {
Maskers.show(this.getName());
}
},
}
adjustView: function () {
this.isViewVisible() && BI.Maskers.show(this.getName());
},
adjustView() {
this.isViewVisible() && Maskers.show(this.getName());
}
setValue: function (v) {
if (BI.isNull(this.popupView)) {
setValue(v) {
if (isNull(this.popupView)) {
this.options.popup.value = v;
} else {
this.popupView.setValue(v);
}
},
}
getKeyword: function () {
getKeyword() {
return this._getLastSearchKeyword();
},
}
getKeywords: function () {
getKeywords() {
return this.editor.getKeywords();
},
}
getValue: function () {
var o = this.options;
if (o.isAutoSync && o.adapter && o.adapter.getValue) {
return o.adapter.getValue();
getValue() {
const { isAutoSync, adapter, popup } = this.options;
if (isAutoSync && adapter && adapter.getValue) {
return adapter.getValue();
}
if (this.isSearching()) {
return this.popupView.getValue();
} else if (o.adapter && o.adapter.getValue) {
return o.adapter.getValue();
} else if (adapter && adapter.getValue) {
return adapter.getValue();
}
if (BI.isNull(this.popupView)) {
return o.popup.value;
if (isNull(this.popupView)) {
return popup.value;
}
return this.popupView.getValue();
},
}
populate: function (result, searchResult, keyword) {
var o = this.options;
populate(result, searchResult, keyword) {
const { isAutoSync, adapter } = this.options;
this._assertPopupView();
this.popupView.populate.apply(this.popupView, arguments);
if (o.isAutoSync && o.adapter && o.adapter.getValue) {
this.popupView.setValue(o.adapter.getValue());
if (isAutoSync && adapter && adapter.getValue) {
this.popupView.setValue(adapter.getValue());
}
},
}
empty: function () {
empty() {
this.popupView && this.popupView.empty();
},
}
destroyed: function () {
BI.Maskers.remove(this.getName());
},
destroyed() {
Maskers.remove(this.getName());
}
focus: function () {
focus() {
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.editor.setWaterMark(v);
},
});
BI.Searcher.EVENT_CHANGE = "EVENT_CHANGE";
BI.Searcher.EVENT_START = "EVENT_START";
BI.Searcher.EVENT_STOP = "EVENT_STOP";
BI.Searcher.EVENT_PAUSE = "EVENT_PAUSE";
BI.Searcher.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.Searcher.EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
BI.shortcut("bi.searcher", BI.Searcher);
}
}

278
src/base/combination/switcher.js

@ -6,9 +6,26 @@
* @class BI.Switcher
* @extends BI.Widget
*/
BI.Switcher = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Switcher.superclass._defaultConfig.apply(this, arguments), {
import { shortcut, Widget, Controller, extend, nextTick, createWidget, each, debounce, isNull } from "../../core";
import { Maskers } from "../0.base";
@shortcut()
export default class Switcher extends Widget {
static xtype = "bi.switcher";
static EVENT_EXPAND = "EVENT_EXPAND";
static EVENT_COLLAPSE = "EVENT_COLLAPSE";
static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
static EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-switcher",
direction: BI.Direction.Top,
trigger: "click",
@ -20,47 +37,47 @@ BI.Switcher = BI.inherit(BI.Widget, {
switcherClass: "bi-switcher-popup",
hoverClass: "bi-switcher-hover",
});
},
}
render: function () {
var self = this, o = this.options;
render() {
const { hoverClass, isDefaultInit } = this.options;
this._initSwitcher();
// 延迟绑定事件,这样可以将自己绑定的事情优先执行
BI.nextTick(() => {
nextTick(() => {
!this.isDestroyed() && this._initPullDownAction();
});
this.switcher.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (self.isEnabled() && self.isValid()) {
this.switcher.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
if (this.isEnabled() && this.isValid()) {
if (type === BI.Events.EXPAND) {
self._popupView();
this._popupView();
}
if (type === BI.Events.COLLAPSE) {
self._hideView();
this._hideView();
}
if (type === BI.Events.EXPAND) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.fireEvent(BI.Switcher.EVENT_EXPAND);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.fireEvent(Switcher.EVENT_EXPAND);
}
if (type === BI.Events.COLLAPSE) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
self.isViewVisible() && self.fireEvent(BI.Switcher.EVENT_COLLAPSE);
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
this.isViewVisible() && this.fireEvent(Switcher.EVENT_COLLAPSE);
}
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Switcher.EVENT_TRIGGER_CHANGE, value, obj);
this.fireEvent(Switcher.EVENT_TRIGGER_CHANGE, value, obj);
}
}
});
this.element.hover(function () {
if (self.isEnabled() && self.switcher.isEnabled()) {
self.element.addClass(o.hoverClass);
this.element.hover(() => {
if (this.isEnabled() && this.switcher.isEnabled()) {
this.element.addClass(hoverClass);
}
}, function () {
if (self.isEnabled() && self.switcher.isEnabled()) {
self.element.removeClass(o.hoverClass);
}, () => {
if (this.isEnabled() && this.switcher.isEnabled()) {
this.element.removeClass(hoverClass);
}
});
BI.createWidget({
createWidget({
type: "bi.vertical",
scrolly: false,
element: this,
@ -68,10 +85,10 @@ BI.Switcher = BI.inherit(BI.Widget, {
{ el: this.switcher }
],
});
o.isDefaultInit && (this._assertPopupView());
},
isDefaultInit && (this._assertPopupView());
}
_toggle: function () {
_toggle() {
this._assertPopupView();
if (this.isExpanded()) {
this._hideView();
@ -80,40 +97,40 @@ BI.Switcher = BI.inherit(BI.Widget, {
this._popupView();
}
}
},
}
_initPullDownAction: function () {
var self = this, o = this.options;
var evs = this.options.trigger.split(",");
BI.each(evs, function (i, e) {
_initPullDownAction() {
const { toggle } = this.options;
const evs = this.options.trigger.split(",");
each(evs, (i, e) => {
switch (e) {
case "hover":
self.element[e](function (e) {
if (self.isEnabled() && self.switcher.isEnabled()) {
self._popupView();
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EXPAND, "", self.switcher);
self.fireEvent(BI.Switcher.EVENT_EXPAND);
this.element[e]((e) => {
if (this.isEnabled() && this.switcher.isEnabled()) {
this._popupView();
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.EXPAND, "", this.switcher);
this.fireEvent(Switcher.EVENT_EXPAND);
}
}, function () {
if (self.isEnabled() && self.switcher.isEnabled() && o.toggle) {
self._hideView();
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", self.switcher);
self.fireEvent(BI.Switcher.EVENT_COLLAPSE);
}, () => {
if (this.isEnabled() && this.switcher.isEnabled() && toggle) {
this._hideView();
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", this.switcher);
this.fireEvent(Switcher.EVENT_COLLAPSE);
}
});
break;
default :
if (e) {
self.element.off(e + "." + self.getName()).on(e + "." + self.getName(), BI.debounce(function (e) {
if (self.switcher.element.__isMouseInBounds__(e)) {
if (self.isEnabled() && self.switcher.isEnabled()) {
o.toggle ? self._toggle() : self._popupView();
if (self.isExpanded()) {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EXPAND, "", self.switcher);
self.fireEvent(BI.Switcher.EVENT_EXPAND);
this.element.off(e + "." + this.getName()).on(e + "." + this.getName(), debounce((e) => {
if (this.switcher.element.__isMouseInBounds__(e)) {
if (this.isEnabled() && this.switcher.isEnabled()) {
toggle ? this._toggle() : this._popupView();
if (this.isExpanded()) {
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.EXPAND, "", this.switcher);
this.fireEvent(Switcher.EVENT_EXPAND);
} else {
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", self.switcher);
self.fireEvent(BI.Switcher.EVENT_COLLAPSE);
this.fireEvent(Controller.EVENT_CHANGE, BI.Events.COLLAPSE, "", this.switcher);
this.fireEvent(Switcher.EVENT_COLLAPSE);
}
}
}
@ -125,36 +142,36 @@ BI.Switcher = BI.inherit(BI.Widget, {
break;
}
});
},
}
_initSwitcher: function () {
this.switcher = BI.createWidget(this.options.el, {
_initSwitcher() {
this.switcher = createWidget(this.options.el, {
value: this.options.value,
});
},
}
_assertPopupView: function () {
var self = this, o = this.options;
_assertPopupView() {
const { popup, adapter, masker, value, direction } = this.options;
if (!this._created) {
this.popupView = BI.createWidget(o.popup, {
this.popupView = createWidget(popup, {
type: "bi.button_group",
element: o.adapter && BI.Maskers.create(this.getName(), o.adapter, BI.extend({ container: this }, o.masker)),
element: adapter && Maskers.create(this.getName(), adapter, extend({ container: this }, masker)),
cls: "switcher-popup",
layouts: [{
type: "bi.vertical",
hgap: 0,
vgap: 0,
}],
value: o.value,
value,
}, this);
this.popupView.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.popupView.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Switcher.EVENT_CHANGE, value, obj);
this.fireEvent(Switcher.EVENT_CHANGE, value, obj);
}
});
if (o.direction !== BI.Direction.Custom && !o.adapter) {
BI.createWidget({
if (direction !== BI.Direction.Custom && !adapter) {
createWidget({
type: "bi.vertical",
scrolly: false,
element: this,
@ -164,133 +181,120 @@ BI.Switcher = BI.inherit(BI.Widget, {
});
}
this._created = true;
BI.nextTick(function () {
self.fireEvent(BI.Switcher.EVENT_AFTER_INIT);
nextTick(() => {
this.fireEvent(Switcher.EVENT_AFTER_INIT);
});
}
},
}
_hideView: function () {
this.fireEvent(BI.Switcher.EVENT_BEFORE_HIDEVIEW);
var self = this, o = this.options;
o.adapter ? BI.Maskers.hide(self.getName()) : (self.popupView && self.popupView.setVisible(false));
BI.nextTick(function () {
o.adapter ? BI.Maskers.hide(self.getName()) : (self.popupView && self.popupView.setVisible(false));
self.element.removeClass(o.switcherClass);
self.fireEvent(BI.Switcher.EVENT_AFTER_HIDEVIEW);
_hideView() {
this.fireEvent(Switcher.EVENT_BEFORE_HIDEVIEW);
const { adapter, switcherClass } = this.options;
adapter ? Maskers.hide(this.getName()) : (this.popupView && this.popupView.setVisible(false));
nextTick(() => {
adapter ? Maskers.hide(this.getName()) : (this.popupView && this.popupView.setVisible(false));
this.element.removeClass(switcherClass);
this.fireEvent(Switcher.EVENT_AFTER_HIDEVIEW);
});
},
}
_popupView: function () {
var self = this, o = this.options;
_popupView() {
const { adapter, switcherClass } = this.options;
this._assertPopupView();
this.fireEvent(BI.Switcher.EVENT_BEFORE_POPUPVIEW);
o.adapter ? BI.Maskers.show(this.getName()) : self.popupView.setVisible(true);
BI.nextTick(function (name) {
o.adapter ? BI.Maskers.show(name) : self.popupView.setVisible(true);
self.element.addClass(o.switcherClass);
self.fireEvent(BI.Switcher.EVENT_AFTER_POPUPVIEW);
this.fireEvent(Switcher.EVENT_BEFORE_POPUPVIEW);
adapter ? Maskers.show(this.getName()) : this.popupView.setVisible(true);
nextTick((name) => {
adapter ? Maskers.show(name) : this.popupView.setVisible(true);
this.element.addClass(switcherClass);
this.fireEvent(Switcher.EVENT_AFTER_POPUPVIEW);
}, this.getName());
},
}
_populate: function () {
_populate() {
this._assertPopupView();
this.popupView.populate.apply(this.popupView, arguments);
},
}
populate: function (items) {
populate(items) {
this._populate.apply(this, arguments);
this.switcher.populate && this.switcher.populate.apply(this.switcher, arguments);
},
}
_setEnable: function (arg) {
BI.Switcher.superclass._setEnable.apply(this, arguments);
_setEnable(arg) {
super._setEnable(arguments);
!arg && this.isViewVisible() && this._hideView();
},
}
setValue: function (v) {
setValue(v) {
this.switcher.setValue(v);
if (BI.isNull(this.popupView)) {
if (isNull(this.popupView)) {
this.options.popup.value = v;
} else {
this.popupView.setValue(v);
}
},
}
getValue: function () {
if (BI.isNull(this.popupView)) {
getValue() {
if (isNull(this.popupView)) {
return this.options.popup.value;
} else {
return this.popupView.getValue();
}
},
}
setAdapter: function (adapter) {
setAdapter(adapter) {
this.options.adapter = adapter;
BI.Maskers.remove(this.getName());
},
Maskers.remove(this.getName());
}
isViewVisible: function () {
isViewVisible() {
return this.isEnabled() && this.switcher.isEnabled() &&
(this.options.adapter ? BI.Maskers.isVisible(this.getName()) : (this.popupView && this.popupView.isVisible()));
},
(this.options.adapter ? Maskers.isVisible(this.getName()) : (this.popupView && this.popupView.isVisible()));
}
isExpanded: function () {
isExpanded() {
return this.isViewVisible();
},
}
showView: function () {
showView() {
if (this.isEnabled() && this.switcher.isEnabled()) {
this._popupView();
}
},
}
hideView: function () {
hideView() {
this._hideView();
},
}
getView: function () {
getView() {
return this.popupView;
},
}
adjustView: function () {
this.isViewVisible() && BI.Maskers.show(this.getName());
},
adjustView() {
this.isViewVisible() && Maskers.show(this.getName());
}
getAllLeaves: function () {
getAllLeaves() {
return this.popupView && this.popupView.getAllLeaves();
},
}
getNodeById: function (id) {
getNodeById(id) {
if (this.switcher.attr("id") === id) {
return this.switcher;
}
return this.popupView && this.popupView.getNodeById(id);
},
}
getNodeByValue: function (value) {
getNodeByValue(value) {
if (this.switcher.getValue() === value) {
return this.switcher;
}
return this.popupView && this.popupView.getNodeByValue(value);
},
}
empty: function () {
empty() {
this.popupView && this.popupView.empty();
},
});
BI.Switcher.EVENT_EXPAND = "EVENT_EXPAND";
BI.Switcher.EVENT_COLLAPSE = "EVENT_COLLAPSE";
BI.Switcher.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
BI.Switcher.EVENT_CHANGE = "EVENT_CHANGE";
BI.Switcher.EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
BI.Switcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.Switcher.EVENT_AFTER_POPUPVIEW = "EVENT_AFTER_POPUPVIEW";
BI.Switcher.EVENT_BEFORE_HIDEVIEW = "EVENT_BEFORE_HIDEVIEW";
BI.Switcher.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
BI.shortcut("bi.switcher", BI.Switcher);
}
}

177
src/base/combination/tab.js

@ -1,10 +1,16 @@
/**
* Created by GUY on 2015/6/26.
*/
import { shortcut, Widget, Controller, ShowListener, extend, createWidget, isObject, each, isFunction, contains, any, isEqual } from "../../core";
BI.Tab = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.Tab.superclass._defaultConfig.apply(this, arguments), {
@shortcut()
export default class Tab extends Widget {
static xtype = "bi.tab";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-tab",
direction: "top", // top, bottom, left, right, custom
single: false, // 是不是单页面
@ -13,87 +19,87 @@ BI.Tab = BI.inherit(BI.Widget, {
},
showIndex: false,
tab: false,
cardCreator: function (v) {
return BI.createWidget();
cardCreator: (v) => {
return createWidget();
},
keepAlives: [],
});
},
render: function () {
var self = this, o = this.options;
if (BI.isObject(o.tab)) {
this.tab = BI.createWidget(this.options.tab, { type: "bi.button_group" });
this.tab.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
}
render() {
const { tab, direction, logic, cardCreator } = this.options;
if (isObject(tab)) {
this.tab = createWidget(this.options.tab, { type: "bi.button_group" });
this.tab.on(Controller.EVENT_CHANGE, (type, value, obj, ...args) => {
this.fireEvent(Controller.EVENT_CHANGE, type, value, obj, ...args);
});
}
this.cardMap = {};
this.layout = BI.createWidget({
this.layout = createWidget({
type: "bi.card",
});
BI.createWidget(BI.extend({
createWidget(extend({
element: this,
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(o.direction), BI.extend({}, o.logic, {
items: BI.LogicFactory.createLogicItemsByDirection(o.direction, this.tab, this.layout),
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(direction), extend({}, logic, {
items: BI.LogicFactory.createLogicItemsByDirection(direction, this.tab, this.layout),
}))));
var listener = new BI.ShowListener({
const listener = new ShowListener({
eventObj: this.tab,
cardLayout: this.layout,
cardCreator: function (v) {
BI.Widget.execWithContext(self, function () {
self.cardMap[v] = o.cardCreator(v);
cardCreator: (v) => {
Widget.execWithContext(this, () => {
this.cardMap[v] = cardCreator(v);
});
return self.cardMap[v];
return this.cardMap[v];
},
afterCardShow: function (v) {
self._deleteOtherCards(v);
self.curr = v;
afterCardShow: (v) => {
this._deleteOtherCards(v);
this.curr = v;
},
});
listener.on(BI.ShowListener.EVENT_CHANGE, function (value) {
self.fireEvent(BI.Tab.EVENT_CHANGE, value, self);
listener.on(ShowListener.EVENT_CHANGE, (value) => {
this.fireEvent(Tab.EVENT_CHANGE, value, this);
});
},
_deleteOtherCards: function (currCardName) {
var self = this, o = this.options;
if (o.single === true) {
BI.each(this.cardMap, function (name, card) {
if (name !== (currCardName + "") && self._keepAlive(name) !== true) {
self.layout.deleteCardByName(name);
delete self.cardMap[name];
}
_deleteOtherCards(currCardName) {
const { single } = this.options;
if (single === true) {
each(this.cardMap, (name, card) => {
if (name !== (currCardName + "") && this._keepAlive(name) !== true) {
this.layout.deleteCardByName(name);
delete this.cardMap[name];
}
});
}
},
}
_assertCard: function (v) {
var self = this, o = this.options;
_assertCard(v) {
const { cardCreator } = this.options;
if (!this.layout.isCardExisted(v)) {
BI.Widget.execWithContext(this, function () {
self.cardMap[v] = o.cardCreator(v);
Widget.execWithContext(this, () => {
this.cardMap[v] = cardCreator(v);
});
this.layout.addCardByName(v, this.cardMap[v]);
}
},
}
_keepAlive: function (v) {
var o = this.options;
_keepAlive(v) {
const { keepAlives } = this.options;
return BI.isFunction(o.keepAlives) ? o.keepAlives(v) : BI.contains(o.keepAlives, v);
},
return isFunction(keepAlives) ? keepAlives(v) : contains(keepAlives, v);
}
created: function () {
var self = this, o = this.options;
created() {
const o = this.options;
let showIndex;
var showIndex;
if (BI.isFunction(o.showIndex)) {
showIndex = this.__watch(o.showIndex, function (context, newValue) {
self.setSelect(newValue);
if (isFunction(o.showIndex)) {
showIndex = this.__watch(o.showIndex, (context, newValue) => {
this.setSelect(newValue);
});
} else {
showIndex = o.showIndex;
@ -102,9 +108,9 @@ BI.Tab = BI.inherit(BI.Widget, {
if (showIndex !== false) {
this.setSelect(showIndex);
}
},
}
setSelect: function (v, action, callback) {
setSelect(v, action, callback) {
this.tab && this.tab.setValue(v);
this._assertCard(v);
this.layout.showCardByName(v, action, callback);
@ -112,69 +118,66 @@ BI.Tab = BI.inherit(BI.Widget, {
if (this.curr !== v) {
this.curr = v;
}
},
}
removeTab: function (cardname) {
var self = this;
BI.any(this.cardMap, function (name, card) {
if (BI.isEqual(name, (cardname + ""))) {
self.layout.deleteCardByName(name);
delete self.cardMap[name];
removeTab(cardname) {
any(this.cardMap, (name, card) => {
if (isEqual(name, (cardname + ""))) {
this.layout.deleteCardByName(name);
delete this.cardMap[name];
return true;
}
});
},
}
isCardExisted: function (cardName) {
isCardExisted(cardName) {
return this.layout.isCardExisted(cardName);
},
}
getSelect: function () {
getSelect() {
return this.curr;
},
}
getSelectedTab: function () {
getSelectedTab() {
return this.layout.getShowingCard();
},
}
getTab: function (v) {
getTab(v) {
this._assertCard(v);
return this.layout.getCardByName(v);
},
}
setValue: function (v) {
var card = this.layout.getShowingCard();
setValue(v) {
const card = this.layout.getShowingCard();
if (card) {
card.setValue(v);
}
},
}
getValue: function () {
var card = this.layout.getShowingCard();
getValue() {
const card = this.layout.getShowingCard();
if (card) {
return card.getValue();
}
},
}
populate: function () {
var card = this.layout.getShowingCard();
populate() {
const card = this.layout.getShowingCard();
if (card) {
return card.populate && card.populate.apply(card, arguments);
}
},
}
empty: function () {
empty() {
this.layout.deleteAllCard();
this.cardMap = {};
},
}
destroy: function () {
destroy() {
this.cardMap = {};
BI.Tab.superclass.destroy.apply(this, arguments);
},
});
BI.Tab.EVENT_CHANGE = "EVENT_CHANGE";
super.destroy(arguments);
}
BI.shortcut("bi.tab", BI.Tab);
}

142
src/base/combination/tree.button.js

@ -3,67 +3,74 @@
* @class BI.ButtonTree
* @extends BI.ButtonGroup
*/
import { shortcut, Widget, extend, isArray, each, isFunction, deepContains, concat, any, contains } from "../../core";
import ButtonGroup from "./group.button";
BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
_defaultConfig: function () {
return BI.extend(BI.ButtonTree.superclass._defaultConfig.apply(this, arguments), {
@shortcut()
export default class ButtonTree extends ButtonGroup {
static xtype = "bi.button_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(arguments), {
baseCls: "bi-button-tree",
});
},
}
setNotSelectedValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (!BI.isFunction(item.setSelected)) {
setNotSelectedValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (!isFunction(item.setSelected)) {
item.setNotSelectedValue(v);
return;
}
if (BI.deepContains(v, item.getValue())) {
if (deepContains(v, item.getValue())) {
item.setSelected(false);
} else {
item.setSelected(true);
}
});
},
}
setEnabledValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (BI.isFunction(item.setEnabledValue)) {
setEnabledValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (isFunction(item.setEnabledValue)) {
item.setEnabledValue(v);
return;
}
if (BI.deepContains(v, item.getValue())) {
if (deepContains(v, item.getValue())) {
item.setEnable(true);
} else {
item.setEnable(false);
}
});
},
}
setValue: function (v) {
v = BI.isArray(v) ? v : [v];
BI.each(this.buttons, function (i, item) {
if (!BI.isFunction(item.setSelected)) {
setValue(v) {
v = isArray(v) ? v : [v];
each(this.buttons, (i, item) => {
if (!isFunction(item.setSelected)) {
item.setValue(v);
return;
}
if (BI.deepContains(v, item.getValue())) {
if (deepContains(v, item.getValue())) {
item.setSelected(true);
} else {
item.setSelected(false);
}
});
},
}
getNotSelectedValue: function () {
var v = [];
BI.each(this.buttons, function (i, item) {
if (item.isEnabled() && !BI.isFunction(item.setSelected)) {
v = BI.concat(v, item.getNotSelectedValue());
getNotSelectedValue() {
let v = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !isFunction(item.setSelected)) {
v = concat(v, item.getNotSelectedValue());
return;
}
@ -73,13 +80,13 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return v;
},
}
getValue: function () {
var v = [];
BI.each(this.buttons, function (i, item) {
if (item.isEnabled() && !BI.isFunction(item.setSelected)) {
v = BI.concat(v, item.getValue());
getValue() {
let v = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !isFunction(item.setSelected)) {
v = concat(v, item.getValue());
return;
}
@ -89,12 +96,12 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return v;
},
}
getSelectedButtons: function () {
var btns = [];
BI.each(this.buttons, function (i, item) {
if (item.isEnabled() && !BI.isFunction(item.setSelected)) {
getSelectedButtons() {
let btns = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !isFunction(item.setSelected)) {
btns = btns.concat(item.getSelectedButtons());
return;
@ -105,12 +112,12 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return btns;
},
}
getNotSelectedButtons: function () {
var btns = [];
BI.each(this.buttons, function (i, item) {
if (item.isEnabled() && !BI.isFunction(item.setSelected)) {
getNotSelectedButtons() {
let btns = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !isFunction(item.setSelected)) {
btns = btns.concat(item.getNotSelectedButtons());
return;
@ -121,13 +128,13 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return btns;
},
}
// 获取所有的叶子节点
getAllLeaves: function () {
var leaves = [];
BI.each(this.buttons, function (i, item) {
if (item.isEnabled() && !BI.isFunction(item.setSelected)) {
getAllLeaves() {
let leaves = [];
each(this.buttons, (i, item) => {
if (item.isEnabled() && !isFunction(item.setSelected)) {
leaves = leaves.concat(item.getAllLeaves());
return;
@ -138,13 +145,13 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return leaves;
},
}
getIndexByValue: function (value) {
var index = -1;
BI.any(this.buttons, function (i, item) {
var vs = item.getValue();
if (item.isEnabled() && (vs === value || BI.contains(vs, value))) {
getIndexByValue(value) {
let index = -1;
any(this.buttons, (i, item) => {
const vs = item.getValue();
if (item.isEnabled() && (vs === value || contains(vs, value))) {
index = i;
return true;
@ -152,17 +159,17 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return index;
},
}
getNodeById: function (id) {
var node;
BI.any(this.buttons, function (i, item) {
getNodeById(id) {
let node;
any(this.buttons, (i, item) => {
if (item.isEnabled()) {
if (item.attr("id") === id) {
node = item;
return true;
} else if (BI.isFunction(item.getNodeById)) {
} else if (isFunction(item.getNodeById)) {
node = item.getNodeById(id);
if (node) {
return true;
@ -172,13 +179,13 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return node;
},
}
getNodeByValue: function (value) {
var node;
BI.any(this.buttons, function (i, item) {
getNodeByValue(value) {
let node;
any(this.buttons, (i, item) => {
if (item.isEnabled()) {
if (BI.isFunction(item.getNodeByValue)) {
if (isFunction(item.getNodeByValue)) {
node = item.getNodeByValue(value);
if (node) {
return true;
@ -192,8 +199,5 @@ BI.ButtonTree = BI.inherit(BI.ButtonGroup, {
});
return node;
},
});
BI.ButtonTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.button_tree", BI.ButtonTree);
}
}

40
src/base/index.js

@ -1,3 +1,4 @@
import { extend } from "../core";
import Pane from "./1.pane";
import Single from "./single/0.single";
import Text from "./single/1.text";
@ -14,9 +15,20 @@ import VirtualGroupList from "./list/virtualgrouplist";
import VirtualList from "./list/virtuallist";
import GridView from "./grid/grid";
import Pager from "./pager/pager";
import Bubble from "./combination/bubble";
import Combo from "./combination/combo";
import Expander from "./combination/expander";
import ButtonGroup from "./combination/group.button";
import ComboGroup from "./combination/group.combo";
import VirtualGroup from "./combination/group.virtual";
import Loader from "./combination/loader";
import Navigation from "./combination/navigation";
import Searcher from "./combination/searcher";
import Switcher from "./combination/switcher";
import Tab from "./combination/tab";
import ButtonTree from "./combination/tree.button";
BI.extend(BI, {
extend(BI, {
Pane,
Single,
Text,
@ -34,6 +46,18 @@ BI.extend(BI, {
VirtualList,
GridView,
Pager,
Bubble,
Combo,
Expander,
ButtonGroup,
ComboGroup,
VirtualGroup,
Loader,
Navigation,
Searcher,
Switcher,
Tab,
ButtonTree,
});
export {
@ -54,4 +78,16 @@ export {
VirtualList,
GridView,
Pager,
Bubble,
Combo,
Expander,
ButtonGroup,
ComboGroup,
VirtualGroup,
Loader,
Navigation,
Searcher,
Switcher,
Tab,
ButtonTree,
}

3
src/core/index.js

@ -16,6 +16,7 @@ import PopoverController from "./controller/controller.popover";
import ResizeController from "./controller/controller.resizer";
import TooltipsController from "./controller/controller.tooltips";
import StyleLoaderManager from "./loader/loader.style";
import ShowListener from "./listener/listener.show";
BI.extend(BI, {
OB,
@ -35,6 +36,7 @@ BI.extend(BI, {
ResizeController,
TooltipsController,
StyleLoaderManager,
ShowListener,
});
export * from './2.base';
@ -60,4 +62,5 @@ export {
ResizeController,
TooltipsController,
StyleLoaderManager,
ShowListener,
}

52
src/core/listener/listener.show.js

@ -5,44 +5,50 @@
* @class BI.ShowListener
* @extends BI.OB
*/
BI.ShowListener = BI.inherit(BI.OB, {
props: function () {
import OB from "../3.ob";
import { isArray, isNull, nextTick, } from "../2.base";
import { createWidget } from "../5.inject";
import Controller from "../controller/0.controller";
export default class ShowListener extends OB {
static EVENT_CHANGE = "EVENT_CHANGE";
props() {
return {
eventObj: BI.createWidget(),
eventObj: createWidget(),
cardLayout: null,
cardNameCreator: function (v) {
cardNameCreator: (v) => {
return v;
},
cardCreator: BI.emptyFn,
afterCardCreated: BI.emptyFn,
afterCardShow: BI.emptyFn
};
},
}
init: function () {
var self = this, o = this.options;
if (o.eventObj) {
o.eventObj.on(BI.Controller.EVENT_CHANGE, function (type, v, ob) {
init() {
const { eventObj, cardLayout, afterCardCreated, cardNameCreator, cardCreator, afterCardShow } = this.options;
if (eventObj) {
eventObj.on(Controller.EVENT_CHANGE, (type, v, ob) => {
if (type === BI.Events.CLICK) {
v = v || o.eventObj.getValue();
v = BI.isArray(v) ? (v.length > 1 ? v.toString() : v[0]) : v;
if (BI.isNull(v)) {
v = v || eventObj.getValue();
v = isArray(v) ? (v.length > 1 ? v.toString() : v[0]) : v;
if (isNull(v)) {
throw new Error("不能为null");
}
var cardName = o.cardNameCreator(v);
if (!o.cardLayout.isCardExisted(cardName)) {
var card = o.cardCreator(cardName);
o.cardLayout.addCardByName(cardName, card);
o.afterCardCreated(cardName);
var cardName = cardNameCreator(v);
if (!cardLayout.isCardExisted(cardName)) {
const card = cardCreator(cardName);
cardLayout.addCardByName(cardName, card);
afterCardCreated(cardName);
}
o.cardLayout.showCardByName(cardName);
BI.nextTick(function () {
o.afterCardShow(cardName);
self.fireEvent(BI.ShowListener.EVENT_CHANGE, cardName);
cardLayout.showCardByName(cardName);
nextTick(() => {
afterCardShow(cardName);
this.fireEvent(ShowListener.EVENT_CHANGE, cardName);
});
}
});
}
}
});
BI.ShowListener.EVENT_CHANGE = "EVENT_CHANGE";
}

Loading…
Cancel
Save