forked from fanruan/fineui
guy
4 years ago
7 changed files with 24 additions and 2317 deletions
@ -1,153 +0,0 @@ |
|||||||
/** |
|
||||||
* Created by GUY on 2015/6/26. |
|
||||||
*/ |
|
||||||
|
|
||||||
BI.Tab = BI.inherit(BI.Widget, { |
|
||||||
_defaultConfig: function () { |
|
||||||
return BI.extend(BI.Tab.superclass._defaultConfig.apply(this, arguments), { |
|
||||||
baseCls: "bi-tab", |
|
||||||
direction: "top", // top, bottom, left, right, custom
|
|
||||||
single: false, // 是不是单页面
|
|
||||||
logic: { |
|
||||||
dynamic: false |
|
||||||
}, |
|
||||||
showIndex: false, |
|
||||||
tab: false, |
|
||||||
cardCreator: function (v) { |
|
||||||
return BI.createWidget(); |
|
||||||
} |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
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); |
|
||||||
}); |
|
||||||
} |
|
||||||
this.cardMap = {}; |
|
||||||
this.layout = BI.createWidget({ |
|
||||||
type: "bi.card" |
|
||||||
}); |
|
||||||
|
|
||||||
BI.createWidget(BI.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) |
|
||||||
})))); |
|
||||||
|
|
||||||
var listener = new BI.ShowListener({ |
|
||||||
eventObj: this.tab, |
|
||||||
cardLayout: this.layout, |
|
||||||
cardCreator: function (v) { |
|
||||||
var card = o.cardCreator.apply(self, arguments); |
|
||||||
self.cardMap[v] = card; |
|
||||||
return card; |
|
||||||
}, |
|
||||||
afterCardShow: function (v) { |
|
||||||
self._deleteOtherCards(v); |
|
||||||
self.curr = v; |
|
||||||
} |
|
||||||
}); |
|
||||||
listener.on(BI.ShowListener.EVENT_CHANGE, function (value) { |
|
||||||
self.fireEvent(BI.Tab.EVENT_CHANGE, value, self); |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
_deleteOtherCards: function (currCardName) { |
|
||||||
var self = this, o = this.options; |
|
||||||
if (o.single === true) { |
|
||||||
BI.each(this.cardMap, function (name, card) { |
|
||||||
if (name !== (currCardName + "")) { |
|
||||||
self.layout.deleteCardByName(name); |
|
||||||
delete self.cardMap[name]; |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_assertCard: function (v) { |
|
||||||
if (!this.layout.isCardExisted(v)) { |
|
||||||
var card = this.options.cardCreator(v); |
|
||||||
this.cardMap[v] = card; |
|
||||||
this.layout.addCardByName(v, card); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
created: function () { |
|
||||||
var o = this.options; |
|
||||||
if (o.showIndex !== false) { |
|
||||||
this.setSelect(o.showIndex); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
setSelect: function (v) { |
|
||||||
this.tab && this.tab.setValue(v); |
|
||||||
this._assertCard(v); |
|
||||||
this.layout.showCardByName(v); |
|
||||||
this._deleteOtherCards(v); |
|
||||||
if (this.curr !== v) { |
|
||||||
this.curr = v; |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
removeTab: function (cardname) { |
|
||||||
var self = this, o = this.options; |
|
||||||
BI.any(this.cardMap, function (name, card) { |
|
||||||
if (BI.isEqual(name, (cardname + ""))) { |
|
||||||
self.layout.deleteCardByName(name); |
|
||||||
delete self.cardMap[name]; |
|
||||||
return true; |
|
||||||
} |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
getSelect: function () { |
|
||||||
return this.curr; |
|
||||||
}, |
|
||||||
|
|
||||||
getSelectedTab: function () { |
|
||||||
return this.layout.getShowingCard(); |
|
||||||
}, |
|
||||||
|
|
||||||
getTab: function (v) { |
|
||||||
this._assertCard(v); |
|
||||||
return this.layout.getCardByName(v); |
|
||||||
}, |
|
||||||
|
|
||||||
setValue: function (v) { |
|
||||||
var card = this.layout.getShowingCard(); |
|
||||||
if (card) { |
|
||||||
card.setValue(v); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
getValue: function () { |
|
||||||
var card = this.layout.getShowingCard(); |
|
||||||
if (card) { |
|
||||||
return card.getValue(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
populate: function () { |
|
||||||
var card = this.layout.getShowingCard(); |
|
||||||
if (card) { |
|
||||||
return card.populate && card.populate.apply(card, arguments); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
empty: function () { |
|
||||||
this.layout.deleteAllCard(); |
|
||||||
this.cardMap = {}; |
|
||||||
}, |
|
||||||
|
|
||||||
destroy: function () { |
|
||||||
this.cardMap = {}; |
|
||||||
BI.Tab.superclass.destroy.apply(this, arguments); |
|
||||||
} |
|
||||||
}); |
|
||||||
BI.Tab.EVENT_CHANGE = "EVENT_CHANGE"; |
|
||||||
|
|
||||||
BI.shortcut("bi.tab", BI.Tab); |
|
||||||
@ -1,92 +0,0 @@ |
|||||||
(function () { |
|
||||||
var kv = {}; |
|
||||||
BI.shortcut = BI.component = BI.shortcut || function (xtype, cls) { |
|
||||||
if (kv[xtype] != null) { |
|
||||||
_global.console && console.error("shortcut:[" + xtype + "] has been registed"); |
|
||||||
} |
|
||||||
if (cls) { |
|
||||||
cls["xtype"] = xtype; |
|
||||||
} |
|
||||||
kv[xtype] = cls; |
|
||||||
}; |
|
||||||
|
|
||||||
// 根据配置属性生成widget
|
|
||||||
var createWidget = function (config, context, lazy) { |
|
||||||
var cls = kv[config.type]; |
|
||||||
|
|
||||||
if (!cls) { |
|
||||||
throw new Error("组件" + config.type + "未定义"); |
|
||||||
} |
|
||||||
var pushed = false; |
|
||||||
if (context) { |
|
||||||
pushed = true; |
|
||||||
BI.Widget.pushContext(context); |
|
||||||
} |
|
||||||
var widget = new cls(); |
|
||||||
widget._initProps(config); |
|
||||||
widget._constructed(); |
|
||||||
widget._initRoot(); |
|
||||||
// if (!lazy || config.element || config.root) {
|
|
||||||
widget._lazyConstructor(); |
|
||||||
// }
|
|
||||||
pushed && BI.Widget.popContext(); |
|
||||||
return widget; |
|
||||||
}; |
|
||||||
|
|
||||||
BI.createWidget = BI.createWidget || function (item, options, context, lazy) { |
|
||||||
// 先把准备环境准备好
|
|
||||||
BI.init(); |
|
||||||
var el, w; |
|
||||||
item || (item = {}); |
|
||||||
if (BI.isWidget(options)) { |
|
||||||
context = options; |
|
||||||
options = {}; |
|
||||||
} else { |
|
||||||
options || (options = {}); |
|
||||||
} |
|
||||||
if (BI.isEmpty(item) && BI.isEmpty(options)) { |
|
||||||
return BI.createWidget({ |
|
||||||
type: "bi.layout" |
|
||||||
}); |
|
||||||
} |
|
||||||
if (BI.isWidget(item)) { |
|
||||||
return item; |
|
||||||
} |
|
||||||
if (item.type || options.type) { |
|
||||||
el = BI.extend({}, options, item); |
|
||||||
w = BI.Plugin.getWidget(el.type, el); |
|
||||||
w.listeners = (w.listeners || []).concat([{ |
|
||||||
eventName: BI.Events.MOUNT, |
|
||||||
action: function () { |
|
||||||
BI.Plugin.getObject(el.type, this); |
|
||||||
} |
|
||||||
}]); |
|
||||||
return w.type === el.type ? createWidget(w, context, lazy) : BI.createWidget(BI.extend({/**important**/}, el, {type: w.type}), options, context, lazy); |
|
||||||
} |
|
||||||
if (item.el && (item.el.type || options.type)) { |
|
||||||
el = BI.extend({}, options, item.el); |
|
||||||
w = BI.Plugin.getWidget(el.type, el); |
|
||||||
w.listeners = (w.listeners || []).concat([{ |
|
||||||
eventName: BI.Events.MOUNT, |
|
||||||
action: function () { |
|
||||||
BI.Plugin.getObject(el.type, this); |
|
||||||
} |
|
||||||
}]); |
|
||||||
return w.type === el.type ? createWidget(w, context, lazy) : BI.createWidget(BI.extend({/**important**/}, el, {type: w.type}), options, context, lazy); |
|
||||||
} |
|
||||||
if (BI.isWidget(item.el)) { |
|
||||||
return item.el; |
|
||||||
} |
|
||||||
throw new Error("无法根据item创建组件"); |
|
||||||
}; |
|
||||||
|
|
||||||
BI._lazyCreateWidget = BI._lazyCreateWidget || function (item, options, context) { |
|
||||||
return BI.createWidget(item, options, context, true); |
|
||||||
}; |
|
||||||
|
|
||||||
BI.createElement = BI.createElement || function () { |
|
||||||
var widget = BI.createWidget.apply(this, arguments); |
|
||||||
return widget.element; |
|
||||||
}; |
|
||||||
|
|
||||||
})(); |
|
||||||
@ -1,750 +0,0 @@ |
|||||||
/** |
|
||||||
* Widget超类 |
|
||||||
* @class BI.Widget |
|
||||||
* @extends BI.OB |
|
||||||
* |
|
||||||
* @cfg {JSON} options 配置属性 |
|
||||||
*/ |
|
||||||
|
|
||||||
!(function () { |
|
||||||
function callLifeHook (self, life) { |
|
||||||
var hook = self.options[life] || self[life]; |
|
||||||
if (hook) { |
|
||||||
var hooks = BI.isArray(hook) ? hook : [hook]; |
|
||||||
BI.each(hooks, function (i, hook) { |
|
||||||
hook.call(self); |
|
||||||
}); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
BI.Widget = BI.Widget || BI.inherit(BI.OB, { |
|
||||||
_defaultConfig: function () { |
|
||||||
return BI.extend(BI.Widget.superclass._defaultConfig.apply(this), { |
|
||||||
root: false, |
|
||||||
tagName: "div", |
|
||||||
attributes: null, |
|
||||||
data: null, |
|
||||||
|
|
||||||
tag: null, |
|
||||||
disabled: false, |
|
||||||
invisible: false, |
|
||||||
invalid: false, |
|
||||||
baseCls: "", |
|
||||||
extraCls: "", |
|
||||||
cls: "", |
|
||||||
css: null, |
|
||||||
updateMode: "manual" // manual / auto
|
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
_constructor: function () { |
|
||||||
|
|
||||||
}, |
|
||||||
|
|
||||||
// 覆盖父类的_constructor方法，widget不走ob的生命周期
|
|
||||||
_constructed: function () { |
|
||||||
if (this.setup) { |
|
||||||
pushTarget(this); |
|
||||||
this.service = this.setup(this.options); |
|
||||||
this.render = BI.isPlainObject(this.service) ? this.service.render : this.service; |
|
||||||
popTarget(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_lazyConstructor: function () { |
|
||||||
if (!this.__constructed) { |
|
||||||
this.__constructed = true; |
|
||||||
this._init(); |
|
||||||
this._initRef(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
// 生命周期函数
|
|
||||||
beforeInit: null, |
|
||||||
|
|
||||||
beforeRender: null, |
|
||||||
|
|
||||||
beforeCreate: null, |
|
||||||
|
|
||||||
created: null, |
|
||||||
|
|
||||||
render: null, |
|
||||||
|
|
||||||
beforeMount: null, |
|
||||||
|
|
||||||
mounted: null, |
|
||||||
|
|
||||||
shouldUpdate: null, |
|
||||||
|
|
||||||
update: null, |
|
||||||
|
|
||||||
beforeUpdate: null, |
|
||||||
|
|
||||||
updated: null, |
|
||||||
|
|
||||||
beforeDestroy: null, |
|
||||||
|
|
||||||
destroyed: null, |
|
||||||
|
|
||||||
_init: function () { |
|
||||||
BI.Widget.superclass._init.apply(this, arguments); |
|
||||||
this._initElementWidth(); |
|
||||||
this._initElementHeight(); |
|
||||||
this._initVisual(); |
|
||||||
this._initState(); |
|
||||||
this._initRender(); |
|
||||||
}, |
|
||||||
|
|
||||||
_initRender: function () { |
|
||||||
var self = this; |
|
||||||
|
|
||||||
function render () { |
|
||||||
if (self.options.beforeRender || self.beforeRender) { |
|
||||||
(self.options.beforeRender || self.beforeRender).call(self, BI.bind(self._render, self)); |
|
||||||
} else { |
|
||||||
self._render(); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if (this.options.beforeInit || this.beforeInit) { |
|
||||||
this.__asking = true; |
|
||||||
(this.options.beforeInit || this.beforeInit).call(this, render); |
|
||||||
if (this.__asking === true) { |
|
||||||
this.__async = true; |
|
||||||
} |
|
||||||
} else { |
|
||||||
render(); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_render: function () { |
|
||||||
this.__asking = false; |
|
||||||
callLifeHook(this, "beforeCreate"); |
|
||||||
this._initElement(); |
|
||||||
this._initEffects(); |
|
||||||
callLifeHook(this, "created"); |
|
||||||
}, |
|
||||||
|
|
||||||
_initCurrent: function () { |
|
||||||
var o = this.options; |
|
||||||
if (o._baseCls || o.baseCls || o.extraCls || o.cls) { |
|
||||||
this.element.addClass((o._baseCls || "") + " " + (o.baseCls || "") + " " + (o.extraCls || "") + " " + (o.cls || "")); |
|
||||||
} |
|
||||||
if (o.attributes) { |
|
||||||
this.element.attr(o.attributes); |
|
||||||
} |
|
||||||
if (o.data) { |
|
||||||
this.element.data(o.data); |
|
||||||
} |
|
||||||
if (o.css) { |
|
||||||
this.element.css(o.css); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
/** |
|
||||||
* 初始化根节点 |
|
||||||
* @private |
|
||||||
*/ |
|
||||||
_initRoot: function () { |
|
||||||
var o = this.options; |
|
||||||
this.widgetName = o.widgetName || BI.uniqueId("widget"); |
|
||||||
this._isRoot = o.root; |
|
||||||
this._children = {}; |
|
||||||
if (BI.isWidget(o.element)) { |
|
||||||
this.element = this.options.element.element; |
|
||||||
if (o.element instanceof BI.Widget) { |
|
||||||
this._parent = o.element; |
|
||||||
this._parent.addWidget(this.widgetName, this); |
|
||||||
} else { |
|
||||||
this._isRoot = true; |
|
||||||
} |
|
||||||
} else if (o.element) { |
|
||||||
// if (o.root !== true) {
|
|
||||||
// throw new Error("root is a required property");
|
|
||||||
// }
|
|
||||||
this.element = BI.Widget._renderEngine.createElement(this); |
|
||||||
this._isRoot = true; |
|
||||||
} else { |
|
||||||
this.element = BI.Widget._renderEngine.createElement(this); |
|
||||||
} |
|
||||||
this.element._isWidget = true; |
|
||||||
this._initCurrent(); |
|
||||||
}, |
|
||||||
|
|
||||||
_initElementWidth: function () { |
|
||||||
var o = this.options; |
|
||||||
if (BI.isWidthOrHeight(o.width)) { |
|
||||||
this.element.css("width", BI.isNumber(o.width) ? o.width / BI.pixRatio + BI.pixUnit : o.width); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_initElementHeight: function () { |
|
||||||
var o = this.options; |
|
||||||
if (BI.isWidthOrHeight(o.height)) { |
|
||||||
this.element.css("height", BI.isNumber(o.height) ? o.height / BI.pixRatio + BI.pixUnit : o.height); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_initVisual: function () { |
|
||||||
var o = this.options; |
|
||||||
if (o.invisible) { |
|
||||||
// 用display属性做显示和隐藏，否则jquery会在显示时将display设为block会覆盖掉display:flex属性
|
|
||||||
this.element.css("display", "none"); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_initEffects: function () { |
|
||||||
var o = this.options; |
|
||||||
if (o.disabled || o.invalid) { |
|
||||||
if (this.options.disabled) { |
|
||||||
this.setEnable(false); |
|
||||||
} |
|
||||||
if (this.options.invalid) { |
|
||||||
this.setValid(false); |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_initState: function () { |
|
||||||
this._isMounted = false; |
|
||||||
}, |
|
||||||
|
|
||||||
_initElement: function () { |
|
||||||
var self = this; |
|
||||||
var render = BI.isFunction(this.options.render) ? this.options.render : this.render; |
|
||||||
var els = render && render.call(this); |
|
||||||
if (BI.isPlainObject(els)) { |
|
||||||
els = [els]; |
|
||||||
} |
|
||||||
if (BI.isArray(els)) { |
|
||||||
BI.each(els, function (i, el) { |
|
||||||
if (el) { |
|
||||||
BI._lazyCreateWidget(el, { |
|
||||||
element: self |
|
||||||
}); |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
// if (this._isRoot === true || !(this instanceof BI.Layout)) {
|
|
||||||
this._mount(); |
|
||||||
// }
|
|
||||||
}, |
|
||||||
|
|
||||||
_setParent: function (parent) { |
|
||||||
this._parent = parent; |
|
||||||
}, |
|
||||||
|
|
||||||
/** |
|
||||||
* |
|
||||||
* @param force 是否强制挂载子节点 |
|
||||||
* @param deep 子节点是否也是按照当前force处理 |
|
||||||
* @param lifeHook 生命周期钩子触不触发，默认触发 |
|
||||||
* @param predicate 递归每个widget的回调 |
|
||||||
* @returns {boolean} |
|
||||||
* @private |
|
||||||
*/ |
|
||||||
_mount: function (force, deep, lifeHook, predicate, layer) { |
|
||||||
var self = this; |
|
||||||
if (!force && (this._isMounted || !this.isVisible() || this.__asking === true || !(this._isRoot === true || (this._parent && this._parent._isMounted === true)))) { |
|
||||||
return false; |
|
||||||
} |
|
||||||
layer = layer || 0; |
|
||||||
lifeHook !== false && callLifeHook(this, "beforeMount"); |
|
||||||
this._isMounted = true; |
|
||||||
for (var key in this._children) { |
|
||||||
var child = this._children[key]; |
|
||||||
!self.isEnabled() && child._setEnable(false); |
|
||||||
!self.isValid() && child._setValid(false); |
|
||||||
child._mount && child._mount(deep ? force : false, deep, lifeHook, predicate, layer + 1); |
|
||||||
} |
|
||||||
this._mountChildren && this._mountChildren(); |
|
||||||
if (layer === 0) { |
|
||||||
// mounted里面会执行scrollTo之类的方法，如果放宏任务里会闪
|
|
||||||
// setTimeout(function () {
|
|
||||||
self.__afterMount(lifeHook, predicate); |
|
||||||
// }, 0);
|
|
||||||
} |
|
||||||
return true; |
|
||||||
}, |
|
||||||
|
|
||||||
__afterMount: function (lifeHook, predicate) { |
|
||||||
if (this._isMounted) { |
|
||||||
for (var key in this._children) { |
|
||||||
var child = this._children[key]; |
|
||||||
child.__afterMount && child.__afterMount(lifeHook, predicate); |
|
||||||
} |
|
||||||
lifeHook !== false && callLifeHook(this, "mounted"); |
|
||||||
this.fireEvent(BI.Events.MOUNT); |
|
||||||
predicate && predicate(this); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
_mountChildren: null, |
|
||||||
|
|
||||||
_update: function (nextProps, shouldUpdate) { |
|
||||||
var o = this.options; |
|
||||||
callLifeHook(this, "beforeUpdate"); |
|
||||||
if (shouldUpdate) { |
|
||||||
var res = this.update && this.update(nextProps, shouldUpdate); |
|
||||||
} else if (BI.isNull(shouldUpdate)) { |
|
||||||
// 默认使用shallowCompare的方式进行更新
|
|
||||||
var nextChange = {}; |
|
||||||
BI.each(nextProps, function (key, value) { |
|
||||||
if (o[key] !== value) { |
|
||||||
nextChange[key] = value; |
|
||||||
} |
|
||||||
}); |
|
||||||
var res = this.update && BI.isNotEmptyObject(nextChange) && this.update(nextChange); |
|
||||||
} |
|
||||||
callLifeHook(this, "updated"); |
|
||||||
return res; |
|
||||||
}, |
|
||||||
|
|
||||||
isMounted: function () { |
|
||||||
return this._isMounted; |
|
||||||
}, |
|
||||||
|
|
||||||
setWidth: function (w) { |
|
||||||
this.options.width = w; |
|
||||||
this._initElementWidth(); |
|
||||||
}, |
|
||||||
|
|
||||||
setHeight: function (h) { |
|
||||||
this.options.height = h; |
|
||||||
this._initElementHeight(); |
|
||||||
}, |
|
||||||
|
|
||||||
_setEnable: function (enable) { |
|
||||||
if (enable === true) { |
|
||||||
this.options.disabled = false; |
|
||||||
} else if (enable === false) { |
|
||||||
this.options.disabled = true; |
|
||||||
} |
|
||||||
// 递归将所有子组件使能
|
|
||||||
BI.each(this._children, function (i, child) { |
|
||||||
!child._manualSetEnable && child._setEnable && child._setEnable(enable); |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
_setValid: function (valid) { |
|
||||||
if (valid === true) { |
|
||||||
this.options.invalid = false; |
|
||||||
} else if (valid === false) { |
|
||||||
this.options.invalid = true; |
|
||||||
} |
|
||||||
// 递归将所有子组件使有效
|
|
||||||
BI.each(this._children, function (i, child) { |
|
||||||
!child._manualSetValid && child._setValid && child._setValid(valid); |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
_setVisible: function (visible) { |
|
||||||
if (visible === true) { |
|
||||||
this.options.invisible = false; |
|
||||||
} else if (visible === false) { |
|
||||||
this.options.invisible = true; |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
setEnable: function (enable) { |
|
||||||
this._manualSetEnable = true; |
|
||||||
this._setEnable(enable); |
|
||||||
if (enable === true) { |
|
||||||
this.element.removeClass("base-disabled disabled"); |
|
||||||
} else if (enable === false) { |
|
||||||
this.element.addClass("base-disabled disabled"); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
setVisible: function (visible) { |
|
||||||
this._setVisible(visible); |
|
||||||
if (visible === true) { |
|
||||||
// 用this.element.show()会把display属性改成block
|
|
||||||
this.element.css("display", ""); |
|
||||||
this._mount(); |
|
||||||
} else if (visible === false) { |
|
||||||
this.element.css("display", "none"); |
|
||||||
} |
|
||||||
this.fireEvent(BI.Events.VIEW, visible); |
|
||||||
}, |
|
||||||
|
|
||||||
setValid: function (valid) { |
|
||||||
this._manualSetValid = true; |
|
||||||
this._setValid(valid); |
|
||||||
if (valid === true) { |
|
||||||
this.element.removeClass("base-invalid invalid"); |
|
||||||
} else if (valid === false) { |
|
||||||
this.element.addClass("base-invalid invalid"); |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
doBehavior: function () { |
|
||||||
var args = arguments; |
|
||||||
// 递归将所有子组件使有效
|
|
||||||
BI.each(this._children, function (i, child) { |
|
||||||
child.doBehavior && child.doBehavior.apply(child, args); |
|
||||||
}); |
|
||||||
}, |
|
||||||
|
|
||||||
getWidth: function () { |
|
||||||
return this.options.width; |
|
||||||
}, |
|
||||||
|
|
||||||
getHeight: function () { |
|
||||||
return this.options.height; |
|
||||||
}, |
|
||||||
|
|
||||||
isValid: function () { |
|
||||||
return !this.options.invalid; |
|
||||||
}, |
|
||||||
|
|
||||||
addWidget: function (name, widget) { |
|
||||||
var self = this; |
|
||||||
if (name instanceof BI.Widget) { |
|
||||||
widget = name; |
|
||||||
name = widget.getName(); |
|
||||||
} |
|
||||||
if (BI.isKey(name)) { |
|
||||||
name = name + ""; |
|
||||||
} |
|
||||||
name = name || widget.getName() || BI.uniqueId("widget"); |
|
||||||
if (this._children[name]) { |
|
||||||
throw new Error("name has already been existed"); |
|
||||||
} |
|
||||||
widget._setParent && widget._setParent(this); |
|
||||||
widget.on(BI.Events.DESTROY, function () { |
|
||||||
BI.remove(self._children, this); |
|
||||||
}); |
|
||||||
return (this._children[name] = widget); |
|
||||||
}, |
|
||||||
|
|
||||||
getWidgetByName: function (name) { |
|
||||||
if (!BI.isKey(name) || name === this.getName()) { |
|
||||||
return this; |
|
||||||
} |
|
||||||
name = name + ""; |
|
||||||
var widget = void 0, other = {}; |
|
||||||
BI.any(this._children, function (i, wi) { |
|
||||||
if (i === name) { |
|
||||||
widget = wi; |
|
||||||
return true; |
|
||||||
} |
|
||||||
other[i] = wi; |
|
||||||
}); |
|
||||||
if (!widget) { |
|
||||||
BI.any(other, function (i, wi) { |
|
||||||
return (widget = wi.getWidgetByName(i)); |
|
||||||
}); |
|
||||||
} |
|
||||||
return widget; |
|
||||||
}, |
|
||||||
|
|
||||||
removeWidget: function (nameOrWidget) { |
|
||||||
var self = this; |
|
||||||
if (BI.isWidget(nameOrWidget)) { |
|
||||||
BI.remove(this._children, nameOrWidget); |
|
||||||
} else { |
|
||||||
delete this._children[nameOrWidget]; |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
hasWidget: function (name) { |
|
||||||
return this._children[name] != null; |
|
||||||
}, |
|
||||||
|
|
||||||
getName: function () { |
|
||||||
return this.widgetName; |
|
||||||
}, |
|
||||||
|
|
||||||
setTag: function (tag) { |
|
||||||
this.options.tag = tag; |
|
||||||
}, |
|
||||||
|
|
||||||
getTag: function () { |
|
||||||
return this.options.tag; |
|
||||||
}, |
|
||||||
|
|
||||||
attr: function (key, value) { |
|
||||||
var self = this; |
|
||||||
if (BI.isPlainObject(key)) { |
|
||||||
BI.each(key, function (k, v) { |
|
||||||
self.attr(k, v); |
|
||||||
}); |
|
||||||
return; |
|
||||||
} |
|
||||||
if (BI.isNotNull(value)) { |
|
||||||
return this.options[key] = value; |
|
||||||
} |
|
||||||
return this.options[key]; |
|
||||||
}, |
|
||||||
|
|
||||||
css: function (name, value) { |
|
||||||
return this.element.css(name, value); |
|
||||||
}, |
|
||||||
|
|
||||||
getText: function () { |
|
||||||
|
|
||||||
}, |
|
||||||
|
|
||||||
setText: function (text) { |
|
||||||
|
|
||||||
}, |
|
||||||
|
|
||||||
getValue: function () { |
|
||||||
|
|
||||||
}, |
|
||||||
|
|
||||||
setValue: function (value) { |
|
||||||
|
|
||||||
}, |
|
||||||
|
|
||||||
isEnabled: function () { |
|
||||||
return !this.options.disabled; |
|
||||||
}, |
|
||||||
|
|
||||||
isVisible: function () { |
|
||||||
return !this.options.invisible; |
|
||||||
}, |
|
||||||
|
|
||||||
disable: function () { |
|
||||||
this.setEnable(false); |
|
||||||
}, |
|
||||||
|
|
||||||
enable: function () { |
|
||||||
this.setEnable(true); |
|
||||||
}, |
|
||||||
|
|
||||||
valid: function () { |
|
||||||
this.setValid(true); |
|
||||||
}, |
|
||||||
|
|
||||||
invalid: function () { |
|
||||||
this.setValid(false); |
|
||||||
}, |
|
||||||
|
|
||||||
invisible: function () { |
|
||||||
this.setVisible(false); |
|
||||||
}, |
|
||||||
|
|
||||||
visible: function () { |
|
||||||
this.setVisible(true); |
|
||||||
}, |
|
||||||
|
|
||||||
__d: function () { |
|
||||||
callLifeHook(this, "beforeDestroy"); |
|
||||||
this.beforeDestroy = null; |
|
||||||
BI.each(this._children, function (i, widget) { |
|
||||||
widget && widget._unMount && widget._unMount(); |
|
||||||
}); |
|
||||||
this._children = {}; |
|
||||||
this._parent = null; |
|
||||||
this._isMounted = false; |
|
||||||
callLifeHook(this, "destroyed"); |
|
||||||
this.destroyed = null; |
|
||||||
}, |
|
||||||
|
|
||||||
_unMount: function () { |
|
||||||
this.__d(); |
|
||||||
this.fireEvent(BI.Events.UNMOUNT); |
|
||||||
this.purgeListeners(); |
|
||||||
}, |
|
||||||
|
|
||||||
isolate: function () { |
|
||||||
if (this._parent) { |
|
||||||
this._parent.removeWidget(this); |
|
||||||
} |
|
||||||
BI.DOM.hang([this]); |
|
||||||
}, |
|
||||||
|
|
||||||
empty: function () { |
|
||||||
BI.each(this._children, function (i, widget) { |
|
||||||
widget && widget._unMount && widget._unMount(); |
|
||||||
}); |
|
||||||
this._children = {}; |
|
||||||
this.element.empty(); |
|
||||||
}, |
|
||||||
|
|
||||||
// 默认的populate方法就是干掉重来
|
|
||||||
reset: function () { |
|
||||||
this.purgeListeners(); |
|
||||||
this.empty(); |
|
||||||
this._initCurrent(); |
|
||||||
this._init(); |
|
||||||
this._initRef(); |
|
||||||
}, |
|
||||||
|
|
||||||
_destroy: function () { |
|
||||||
this.__d(); |
|
||||||
this.element.destroy(); |
|
||||||
this.purgeListeners(); |
|
||||||
}, |
|
||||||
|
|
||||||
destroy: function () { |
|
||||||
this.__d(); |
|
||||||
this.element.destroy(); |
|
||||||
this.fireEvent(BI.Events.UNMOUNT); |
|
||||||
this.fireEvent(BI.Events.DESTROY); |
|
||||||
this._purgeRef(); |
|
||||||
this.purgeListeners(); |
|
||||||
} |
|
||||||
}); |
|
||||||
var context = null, current = null; |
|
||||||
var contextStack = [], currentStack = []; |
|
||||||
|
|
||||||
BI.Widget.pushContext = function (_context) { |
|
||||||
if (context) contextStack.push(context); |
|
||||||
BI.Widget.context = context = _context; |
|
||||||
}; |
|
||||||
|
|
||||||
BI.Widget.popContext = function () { |
|
||||||
BI.Widget.context = context = contextStack.pop(); |
|
||||||
}; |
|
||||||
|
|
||||||
function pushTarget (_current) { |
|
||||||
if (current) currentStack.push(current); |
|
||||||
BI.Widget.current = current = _current; |
|
||||||
} |
|
||||||
|
|
||||||
function popTarget () { |
|
||||||
BI.Widget.current = current = currentStack.pop(); |
|
||||||
} |
|
||||||
|
|
||||||
BI.useStore = function (_store) { |
|
||||||
if (current && current.store) { |
|
||||||
return current.store; |
|
||||||
} |
|
||||||
if (current && current.$storeDelegate) { |
|
||||||
return current.$storeDelegate; |
|
||||||
} |
|
||||||
if (current) { |
|
||||||
var delegate = {}, origin; |
|
||||||
if (_global.Proxy) { |
|
||||||
var proxy = new Proxy(delegate, { |
|
||||||
get: function (target, key) { |
|
||||||
return Reflect.get(origin, key); |
|
||||||
}, |
|
||||||
set: function (target, key, value) { |
|
||||||
return Reflect.set(origin, key, value); |
|
||||||
} |
|
||||||
}); |
|
||||||
current._store = function () { |
|
||||||
origin = _store.apply(this, arguments); |
|
||||||
return origin; |
|
||||||
}; |
|
||||||
return current.$storeDelegate = proxy; |
|
||||||
} |
|
||||||
current._store = function () { |
|
||||||
var st = _store.apply(this, arguments); |
|
||||||
BI.extend(delegate, st); |
|
||||||
return st; |
|
||||||
}; |
|
||||||
return current.$storeDelegate = delegate; |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
BI.watch = function (watch, handler) { |
|
||||||
if (BI.Widget.current) { |
|
||||||
BI.Widget.current.$watchDelayCallbacks || (BI.Widget.current.$watchDelayCallbacks = []); |
|
||||||
BI.Widget.current.$watchDelayCallbacks.push([watch, handler]); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
BI.onBeforeMount = function (beforeMount) { |
|
||||||
if (current) { |
|
||||||
if (!current.beforeMount) { |
|
||||||
current.beforeMount = []; |
|
||||||
} else if (!BI.isArray(current.beforeMount)) { |
|
||||||
current.beforeMount = [current.beforeMount]; |
|
||||||
} |
|
||||||
current.beforeMount.push(beforeMount); |
|
||||||
} |
|
||||||
}; |
|
||||||
BI.onMounted = function (mounted) { |
|
||||||
if (current) { |
|
||||||
if (!current.mounted) { |
|
||||||
current.mounted = []; |
|
||||||
} else if (!BI.isArray(current.mounted)) { |
|
||||||
current.mounted = [current.mounted]; |
|
||||||
} |
|
||||||
current.mounted.push(mounted); |
|
||||||
} |
|
||||||
}; |
|
||||||
BI.onBeforeUnmount = function (beforeDestroy) { |
|
||||||
if (current) { |
|
||||||
if (!current.beforeDestroy) { |
|
||||||
current.beforeDestroy = []; |
|
||||||
} else if (!BI.isArray(current.beforeDestroy)) { |
|
||||||
current.beforeDestroy = [current.beforeDestroy]; |
|
||||||
} |
|
||||||
current.beforeDestroy.push(beforeDestroy); |
|
||||||
} |
|
||||||
}; |
|
||||||
BI.onUnmounted = function (destroyed) { |
|
||||||
if (current) { |
|
||||||
if (!current.destroyed) { |
|
||||||
current.destroyed = []; |
|
||||||
} else if (!BI.isArray(current.destroyed)) { |
|
||||||
current.destroyed = [current.destroyed]; |
|
||||||
} |
|
||||||
current.destroyed.push(destroyed); |
|
||||||
} |
|
||||||
}; |
|
||||||
|
|
||||||
BI.Widget.registerRenderEngine = function (engine) { |
|
||||||
BI.Widget._renderEngine = engine; |
|
||||||
}; |
|
||||||
BI.Widget.registerRenderEngine({ |
|
||||||
createElement: function (widget) { |
|
||||||
if (BI.isWidget(widget)) { |
|
||||||
var o = widget.options; |
|
||||||
if (o.element) { |
|
||||||
return BI.$(o.element); |
|
||||||
} |
|
||||||
if (o.tagName) { |
|
||||||
return BI.$(document.createElement(o.tagName)); |
|
||||||
} |
|
||||||
return BI.$(document.createDocumentFragment()); |
|
||||||
} |
|
||||||
return BI.$(widget); |
|
||||||
}, |
|
||||||
createFragment: function () { |
|
||||||
return document.createDocumentFragment(); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
BI.mount = function (widget, container, predicate, hydrate) { |
|
||||||
if (hydrate === true) { |
|
||||||
// 将widget的element元素都挂载好，并建立相互关系
|
|
||||||
widget.element.data("__widgets", [widget]); |
|
||||||
var res = widget._mount(true, false, false, function (w) { |
|
||||||
BI.each(w._children, function (i, child) { |
|
||||||
var ws = child.element.data("__widgets"); |
|
||||||
if (!ws) { |
|
||||||
ws = []; |
|
||||||
} |
|
||||||
ws.push(child); |
|
||||||
child.element.data("__widgets", ws); |
|
||||||
}); |
|
||||||
predicate && predicate.apply(this, arguments); |
|
||||||
}); |
|
||||||
// 将新的dom树属性（事件等）patch到已存在的dom上
|
|
||||||
var c = BI.Widget._renderEngine.createElement; |
|
||||||
BI.DOM.patchProps(widget.element, c(c(container).children()[0])); |
|
||||||
|
|
||||||
var triggerLifeHook = function (w) { |
|
||||||
w.beforeMount && w.beforeMount(); |
|
||||||
w.mounted && w.mounted(); |
|
||||||
BI.each(w._children, function (i, child) { |
|
||||||
triggerLifeHook(child); |
|
||||||
}); |
|
||||||
}; |
|
||||||
// 最后触发组件树生命周期函数
|
|
||||||
triggerLifeHook(widget); |
|
||||||
return res; |
|
||||||
} |
|
||||||
if (container) { |
|
||||||
BI.Widget._renderEngine.createElement(container).append(widget.element); |
|
||||||
} |
|
||||||
return widget._mount(true, false, false, predicate); |
|
||||||
}; |
|
||||||
})(); |
|
||||||
Loading…
Reference in new issue