forked from fanruan/fineui
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
282 lines
10 KiB
282 lines
10 KiB
/** |
|
* 多层级下拉单选树 |
|
* Created by GUY on 2016/1/26. |
|
* |
|
* @class BI.MultiLayerSingleTreeCombo |
|
* @extends BI.Widget |
|
*/ |
|
BI.MultiLayerSingleTreeCombo = BI.inherit(BI.Widget, { |
|
|
|
_defaultConfig: function () { |
|
return BI.extend(BI.MultiLayerSingleTreeCombo.superclass._defaultConfig.apply(this, arguments), { |
|
baseCls: "bi-multilayer-single-tree-combo", |
|
isDefaultInit: false, |
|
height: 24, |
|
text: "", |
|
defaultText: "", |
|
itemsCreator: BI.emptyFn, |
|
items: [], |
|
allowEdit: false, |
|
allowSearchValue: false, |
|
allowInsertValue: false, |
|
isNeedAdjustWidth: true, |
|
}); |
|
}, |
|
|
|
_init: function () { |
|
var o = this.options; |
|
BI.isNumeric(o.width) && (o.width -= 2); |
|
BI.isNumeric(o.height) && (o.height -= 2); |
|
BI.MultiLayerSingleTreeCombo.superclass._init.apply(this, arguments); |
|
}, |
|
|
|
render: function () { |
|
var self = this, o = this.options; |
|
|
|
var cls = (o.simple ? "bi-border-bottom " : "bi-border bi-border-radius ") + (BI.isKey(o.status) ? ("status-" + o.status) : ""); |
|
|
|
var baseConfig = this._getBaseConfig(); |
|
|
|
if (o.allowEdit) { |
|
return { |
|
type: "bi.absolute", |
|
cls, |
|
items: [ |
|
{ |
|
el: BI.extend(baseConfig, this._getSearchConfig()), |
|
top: 0, bottom: 0, right: 0, left: 0 |
|
}, { |
|
el: self._getTriggerIconButton(), |
|
top: 0, bottom: 0, right: 0, |
|
}, |
|
] |
|
}; |
|
} |
|
|
|
return BI.extend(baseConfig, { |
|
el: { |
|
type: "bi.single_tree_trigger", |
|
ref: function (_ref) { |
|
self.textTrigger = _ref; |
|
}, |
|
text: o.text, |
|
defaultText: o.defaultText, |
|
height: o.height, |
|
items: o.items, |
|
value: o.value, |
|
tipType: o.tipType, |
|
warningTitle: o.warningTitle, |
|
valueFormatter: o.valueFormatter, |
|
}, |
|
}, { cls }); |
|
}, |
|
|
|
_getBaseConfig: function () { |
|
var self = this, o = this.options; |
|
return { |
|
type: "bi.combo", |
|
container: o.container, |
|
destroyWhenHide: o.destroyWhenHide, |
|
adjustLength: 2, |
|
ref: function (_ref) { |
|
self.combo = _ref; |
|
}, |
|
popup: { |
|
el: { |
|
type: "bi.multilayer_single_tree_popup", |
|
isDefaultInit: o.isDefaultInit, |
|
itemsCreator: o.itemsCreator, |
|
items: o.items, |
|
ref: function (_ref) { |
|
self.trigger && self.trigger.getSearcher().setAdapter(_ref); |
|
}, |
|
listeners: [{ |
|
eventName: BI.MultiLayerSingleTreePopup.EVENT_CHANGE, |
|
action: function () { |
|
self.setValue(this.getValue()); |
|
self.combo.hideView(); |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); |
|
} |
|
}], |
|
onLoaded: function () { |
|
BI.nextTick(function () { |
|
self.combo.adjustWidth(); |
|
self.combo.adjustHeight(); |
|
}); |
|
} |
|
}, |
|
value: o.value, |
|
maxHeight: 400, |
|
maxWidth: o.isNeedAdjustWidth ? "auto" : 500, |
|
minHeight: 240 |
|
}, |
|
isNeedAdjustWidth: o.isNeedAdjustWidth, |
|
listeners: [{ |
|
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); |
|
} |
|
}] |
|
}; |
|
}, |
|
|
|
_getSearchConfig: function () { |
|
var self = this, o = this.options; |
|
return { |
|
el: { |
|
type: "bi.multilayer_single_tree_trigger", |
|
container: o.container, |
|
allowInsertValue: o.allowInsertValue, |
|
allowSearchValue: o.allowSearchValue, |
|
cls: "multilayer-single-tree-trigger", |
|
ref: function (_ref) { |
|
self.trigger = _ref; |
|
}, |
|
watermark: o.watermark, |
|
items: o.items, |
|
itemsCreator: o.itemsCreator, |
|
valueFormatter: o.valueFormatter, |
|
height: o.height, |
|
text: o.text, |
|
defaultText: o.defaultText, |
|
value: o.value, |
|
tipType: o.tipType, |
|
warningTitle: o.warningTitle, |
|
title: o.title, |
|
listeners: [{ |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_CHANGE, |
|
action: function () { |
|
self.setValue(this.getValue()); |
|
self.combo.hideView(); |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); |
|
} |
|
}, { |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_FOCUS, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_FOCUS); |
|
} |
|
}, { |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_BLUR, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BLUR); |
|
} |
|
}, { |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_SEARCHING, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_SEARCHING); |
|
} |
|
}, { |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_STOP, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_STOP); |
|
} |
|
}, { |
|
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM, |
|
action: function () { |
|
var value = self.trigger.getSearcher().getKeyword(); |
|
self.combo.setValue([value]); |
|
self.combo.hideView(); |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); |
|
} |
|
}] |
|
}, |
|
toggle: !o.allowEdit, |
|
hideChecker: function (e) { |
|
// 新增传配置container后对应hideChecker的修改 |
|
// IE11下，popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿 |
|
// 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页，所以 |
|
// 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪 |
|
return (o.container && self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().getView().element.find(e.target).length > 0) ? false : self.triggerBtn?.element.find(e.target).length === 0; |
|
}, |
|
listeners: [{ |
|
eventName: BI.Combo.EVENT_AFTER_HIDEVIEW, |
|
action: function () { |
|
self.trigger.stopEditing(); |
|
} |
|
}, { |
|
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, |
|
action: function () { |
|
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); |
|
} |
|
}] |
|
}; |
|
}, |
|
|
|
_getTriggerIconButton: function () { |
|
var self = this, o = this.options; |
|
return { |
|
type: "bi.trigger_icon_button", |
|
cls: "bi-trigger trigger-icon-button", |
|
ref: function (_ref) { |
|
self.triggerBtn = _ref; |
|
}, |
|
width: o.height, |
|
height: o.height, |
|
listeners: [ |
|
{ |
|
eventName: BI.TriggerIconButton.EVENT_CHANGE, |
|
action: function () { |
|
if (self.combo.isViewVisible()) { |
|
self.combo.hideView(); |
|
} else { |
|
self.combo.showView(); |
|
} |
|
} |
|
} |
|
] |
|
}; |
|
}, |
|
|
|
getSearcher: function () { |
|
return this.trigger ? this.trigger.getSearcher() : this.textTrigger.getTextor(); |
|
}, |
|
|
|
setValue: function (v) { |
|
v = BI.isArray(v) ? v : [v]; |
|
this.combo.setValue(v); |
|
}, |
|
|
|
getValue: function () { |
|
return this.combo.getValue(); |
|
}, |
|
|
|
setStatus: function (status) { |
|
if (BI.isKey(this.options.status)) { |
|
this.element.removeClass("status-" + this.options.status); |
|
} |
|
this.element.addClass("status-" + status); |
|
this.options.status = status; |
|
}, |
|
|
|
setTipType: function (v) { |
|
this.trigger ? this.trigger.setTipType(v) : this.textTrigger.setTipType(v); |
|
}, |
|
|
|
populate: function (items) { |
|
this.combo.populate(items); |
|
}, |
|
|
|
focus: function () { |
|
this.trigger.focus(); |
|
}, |
|
|
|
blur: function () { |
|
this.trigger.blur(); |
|
}, |
|
|
|
showView: function () { |
|
this.combo.showView(); |
|
}, |
|
|
|
setWaterMark: function (v) { |
|
this.trigger.setWaterMark(v); |
|
} |
|
}); |
|
|
|
BI.MultiLayerSingleTreeCombo.EVENT_SEARCHING = "EVENT_SEARCHING"; |
|
BI.MultiLayerSingleTreeCombo.EVENT_BLUR = "EVENT_BLUR"; |
|
BI.MultiLayerSingleTreeCombo.EVENT_FOCUS = "EVENT_FOCUS"; |
|
BI.MultiLayerSingleTreeCombo.EVENT_CHANGE = "EVENT_CHANGE"; |
|
BI.MultiLayerSingleTreeCombo.EVENT_STOP = "EVENT_STOP"; |
|
BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
|
BI.shortcut("bi.multilayer_single_tree_combo", BI.MultiLayerSingleTreeCombo);
|
|
|