forked from fanruan/fineui
windy
7 years ago
30 changed files with 2397 additions and 446 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,161 @@ |
|||||||
|
/** |
||||||
|
* |
||||||
|
* 复选下拉框 |
||||||
|
* @class BI.MultiSelectInsertTrigger |
||||||
|
* @extends BI.Trigger |
||||||
|
*/ |
||||||
|
|
||||||
|
BI.MultiSelectInsertTrigger = BI.inherit(BI.Trigger, { |
||||||
|
|
||||||
|
constants: { |
||||||
|
height: 14, |
||||||
|
rgap: 4, |
||||||
|
lgap: 4 |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.MultiSelectInsertTrigger.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-multi-select-trigger bi-border", |
||||||
|
itemsCreator: BI.emptyFn, |
||||||
|
valueFormatter: BI.emptyFn, |
||||||
|
searcher: {}, |
||||||
|
switcher: {}, |
||||||
|
|
||||||
|
adapter: null, |
||||||
|
masker: {} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MultiSelectInsertTrigger.superclass._init.apply(this, arguments); |
||||||
|
|
||||||
|
var self = this, o = this.options; |
||||||
|
if (o.height) { |
||||||
|
this.setHeight(o.height - 2); |
||||||
|
} |
||||||
|
|
||||||
|
this.searcher = BI.createWidget(o.searcher, { |
||||||
|
type: "bi.multi_select_insert_searcher", |
||||||
|
height: o.height, |
||||||
|
text: o.text, |
||||||
|
itemsCreator: o.itemsCreator, |
||||||
|
valueFormatter: o.valueFormatter, |
||||||
|
popup: {}, |
||||||
|
adapter: o.adapter, |
||||||
|
masker: o.masker, |
||||||
|
value: o.value |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_START, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_START); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_ADD_ITEM, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_ADD_ITEM); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_PAUSE, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_PAUSE); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_SEARCHING, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_SEARCHING, arguments); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_STOP, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_STOP); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_CHANGE, arguments); |
||||||
|
}); |
||||||
|
this.numberCounter = BI.createWidget(o.switcher, { |
||||||
|
type: "bi.multi_select_check_selected_switcher", |
||||||
|
valueFormatter: o.valueFormatter, |
||||||
|
itemsCreator: o.itemsCreator, |
||||||
|
adapter: o.adapter, |
||||||
|
masker: o.masker, |
||||||
|
value: o.value |
||||||
|
}); |
||||||
|
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_COUNTER_CLICK); |
||||||
|
}); |
||||||
|
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW); |
||||||
|
}); |
||||||
|
|
||||||
|
var wrapNumberCounter = BI.createWidget({ |
||||||
|
type: "bi.right_vertical_adapt", |
||||||
|
hgap: 4, |
||||||
|
items: [{ |
||||||
|
el: this.numberCounter |
||||||
|
}] |
||||||
|
}); |
||||||
|
|
||||||
|
var wrapper = BI.createWidget({ |
||||||
|
type: "bi.htape", |
||||||
|
element: this, |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
el: this.searcher, |
||||||
|
width: "fill" |
||||||
|
}, { |
||||||
|
el: wrapNumberCounter, |
||||||
|
width: 0 |
||||||
|
}, { |
||||||
|
el: BI.createWidget(), |
||||||
|
width: 24 |
||||||
|
}] |
||||||
|
}); |
||||||
|
|
||||||
|
this.numberCounter.on(BI.Events.VIEW, function (b) { |
||||||
|
BI.nextTick(function () {// 自动调整宽度
|
||||||
|
wrapper.attr("items")[1].width = (b === true ? self.numberCounter.element.outerWidth() + 8 : 0); |
||||||
|
wrapper.resize(); |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
this.element.click(function (e) { |
||||||
|
if (self.element.__isMouseInBounds__(e) && !self.numberCounter.element.__isMouseInBounds__(e)) { |
||||||
|
self.numberCounter.hideView(); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
getCounter: function () { |
||||||
|
return this.numberCounter; |
||||||
|
}, |
||||||
|
|
||||||
|
getSearcher: function () { |
||||||
|
return this.searcher; |
||||||
|
}, |
||||||
|
|
||||||
|
stopEditing: function () { |
||||||
|
this.searcher.stopSearch(); |
||||||
|
this.numberCounter.hideView(); |
||||||
|
}, |
||||||
|
|
||||||
|
setAdapter: function (adapter) { |
||||||
|
this.searcher.setAdapter(adapter); |
||||||
|
this.numberCounter.setAdapter(adapter); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (ob) { |
||||||
|
this.searcher.setValue(ob); |
||||||
|
this.numberCounter.setValue(ob); |
||||||
|
}, |
||||||
|
|
||||||
|
getKey: function () { |
||||||
|
return this.searcher.getKey(); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.searcher.getValue(); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.MultiSelectInsertTrigger.EVENT_TRIGGER_CLICK = "EVENT_TRIGGER_CLICK"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_COUNTER_CLICK = "EVENT_COUNTER_CLICK"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_START = "EVENT_START"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_STOP = "EVENT_STOP"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_PAUSE = "EVENT_PAUSE"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_SEARCHING = "EVENT_SEARCHING"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW = "EVENT_BEFORE_COUNTER_POPUPVIEW"; |
||||||
|
BI.MultiSelectInsertTrigger.EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; |
||||||
|
|
||||||
|
BI.shortcut("bi.multi_select_insert_trigger", BI.MultiSelectInsertTrigger); |
@ -0,0 +1,116 @@ |
|||||||
|
/** |
||||||
|
* |
||||||
|
* 在搜索框中输入文本弹出的面板 |
||||||
|
* @class BI.MultiSelectSearchInsertPane |
||||||
|
* @extends Widget |
||||||
|
*/ |
||||||
|
|
||||||
|
BI.MultiSelectSearchInsertPane = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
constants: { |
||||||
|
height: 24, |
||||||
|
lgap: 10, |
||||||
|
tgap: 5 |
||||||
|
}, |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.MultiSelectSearchInsertPane.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-multi-select-search-pane bi-card", |
||||||
|
itemsCreator: BI.emptyFn, |
||||||
|
valueFormatter: BI.emptyFn, |
||||||
|
keywordGetter: BI.emptyFn |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MultiSelectSearchInsertPane.superclass._init.apply(this, arguments); |
||||||
|
var self = this, o = this.options; |
||||||
|
|
||||||
|
this.tooltipClick = BI.createWidget({ |
||||||
|
type: "bi.label", |
||||||
|
invisible: true, |
||||||
|
text: BI.i18nText("BI-Click_Blank_To_Select"), |
||||||
|
cls: "multi-select-toolbar", |
||||||
|
height: this.constants.height |
||||||
|
}); |
||||||
|
|
||||||
|
this.addNotMatchTip = BI.createWidget({ |
||||||
|
type: "bi.icon_text_item", |
||||||
|
invisible: true, |
||||||
|
logic: { |
||||||
|
dynamic: true |
||||||
|
}, |
||||||
|
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), |
||||||
|
cls: "text-add-tip-font", |
||||||
|
height: this.constants.height, |
||||||
|
handler: function () { |
||||||
|
self.fireEvent(BI.MultiSelectSearchInsertPane.EVENT_ADD_ITEM, o.keywordGetter()); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
this.loader = BI.createWidget({ |
||||||
|
type: "bi.multi_select_search_loader", |
||||||
|
keywordGetter: o.keywordGetter, |
||||||
|
valueFormatter: o.valueFormatter, |
||||||
|
itemsCreator: function (op, callback) { |
||||||
|
o.itemsCreator.apply(self, [op, function (res) { |
||||||
|
callback(res); |
||||||
|
self.setKeyword(o.keywordGetter()); |
||||||
|
}]); |
||||||
|
}, |
||||||
|
value: o.value |
||||||
|
}); |
||||||
|
this.loader.on(BI.Controller.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); |
||||||
|
}); |
||||||
|
|
||||||
|
this.resizer = BI.createWidget({ |
||||||
|
type: "bi.vtape", |
||||||
|
element: this, |
||||||
|
items: [{ |
||||||
|
type: "bi.float_center_adapt", |
||||||
|
items: [this.tooltipClick, this.addNotMatchTip], |
||||||
|
height: this.constants.height |
||||||
|
}, { |
||||||
|
el: this.loader |
||||||
|
}] |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
setKeyword: function (keyword) { |
||||||
|
var btn; |
||||||
|
var isMatchTipVisible = this.loader.getAllButtons().length > 0 && (btn = this.loader.getAllButtons()[0]) && (keyword === btn.getValue()); |
||||||
|
this.tooltipClick.setVisible(isMatchTipVisible); |
||||||
|
this.addNotMatchTip.setVisible(!isMatchTipVisible); |
||||||
|
!isMatchTipVisible && this.addNotMatchTip.setText(BI.i18nText("BI-Basic_Click_To_Add_Text", keyword)); |
||||||
|
}, |
||||||
|
|
||||||
|
isAllSelected: function () { |
||||||
|
return this.loader.isAllSelected(); |
||||||
|
}, |
||||||
|
|
||||||
|
hasMatched: function () { |
||||||
|
return this.tooltipClick.isVisible(); |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (v) { |
||||||
|
this.loader.setValue(v); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.loader.getValue(); |
||||||
|
}, |
||||||
|
|
||||||
|
empty: function () { |
||||||
|
this.loader.empty(); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (items) { |
||||||
|
this.loader.populate.apply(this.loader, arguments); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.MultiSelectSearchInsertPane.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.MultiSelectSearchInsertPane.EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; |
||||||
|
|
||||||
|
BI.shortcut("bi.multi_select_search_insert_pane", BI.MultiSelectSearchInsertPane); |
@ -0,0 +1,182 @@ |
|||||||
|
/** |
||||||
|
* searcher |
||||||
|
* Created by guy on 15/11/3. |
||||||
|
* @class BI.MultiSelectInsertSearcher |
||||||
|
* @extends Widget |
||||||
|
*/ |
||||||
|
BI.MultiSelectInsertSearcher = BI.inherit(BI.Widget, { |
||||||
|
|
||||||
|
_defaultConfig: function () { |
||||||
|
return BI.extend(BI.MultiSelectInsertSearcher.superclass._defaultConfig.apply(this, arguments), { |
||||||
|
baseCls: "bi-multi-select-searcher", |
||||||
|
itemsCreator: BI.emptyFn, |
||||||
|
el: {}, |
||||||
|
popup: {}, |
||||||
|
valueFormatter: BI.emptyFn, |
||||||
|
adapter: null, |
||||||
|
masker: {}, |
||||||
|
text: BI.i18nText("BI-Basic_Please_Select") |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
_init: function () { |
||||||
|
BI.MultiSelectInsertSearcher.superclass._init.apply(this, arguments); |
||||||
|
var self = this, o = this.options; |
||||||
|
this.editor = BI.createWidget(o.el, { |
||||||
|
type: "bi.multi_select_editor", |
||||||
|
height: o.height, |
||||||
|
text: o.text |
||||||
|
}); |
||||||
|
|
||||||
|
this.searcher = BI.createWidget({ |
||||||
|
type: "bi.searcher", |
||||||
|
element: this, |
||||||
|
height: o.height, |
||||||
|
isAutoSearch: false, |
||||||
|
isAutoSync: false, |
||||||
|
onSearch: function (op, callback) { |
||||||
|
callback(); |
||||||
|
}, |
||||||
|
el: this.editor, |
||||||
|
|
||||||
|
popup: BI.extend({ |
||||||
|
type: "bi.multi_select_search_insert_pane", |
||||||
|
valueFormatter: o.valueFormatter, |
||||||
|
keywordGetter: function () { |
||||||
|
return self.editor.getValue(); |
||||||
|
}, |
||||||
|
itemsCreator: function (op, callback) { |
||||||
|
var keyword = self.editor.getValue(); |
||||||
|
op.keywords = [keyword]; |
||||||
|
this.setKeyword(keyword); |
||||||
|
o.itemsCreator(op, callback); |
||||||
|
}, |
||||||
|
value: o.value, |
||||||
|
listeners: [{ |
||||||
|
eventName: BI.MultiSelectSearchInsertPane.EVENT_ADD_ITEM, |
||||||
|
action: function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_ADD_ITEM); |
||||||
|
} |
||||||
|
}] |
||||||
|
}, o.popup), |
||||||
|
|
||||||
|
adapter: o.adapter, |
||||||
|
masker: o.masker |
||||||
|
}); |
||||||
|
this.searcher.on(BI.Searcher.EVENT_START, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_START); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () { |
||||||
|
if (this.hasMatched()) { |
||||||
|
|
||||||
|
} |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_PAUSE); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.Searcher.EVENT_STOP, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_STOP); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () { |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_CHANGE, arguments); |
||||||
|
}); |
||||||
|
this.searcher.on(BI.Searcher.EVENT_SEARCHING, function () { |
||||||
|
var keywords = this.getKeywords(); |
||||||
|
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_SEARCHING, keywords); |
||||||
|
}); |
||||||
|
if (BI.isNotNull(o.value)) { |
||||||
|
this.setState(o.value); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
adjustView: function () { |
||||||
|
this.searcher.adjustView(); |
||||||
|
}, |
||||||
|
|
||||||
|
isSearching: function () { |
||||||
|
return this.searcher.isSearching(); |
||||||
|
}, |
||||||
|
|
||||||
|
stopSearch: function () { |
||||||
|
this.searcher.stopSearch(); |
||||||
|
}, |
||||||
|
|
||||||
|
getKeyword: function () { |
||||||
|
return this.editor.getValue(); |
||||||
|
}, |
||||||
|
|
||||||
|
hasMatched: function () { |
||||||
|
return this.searcher.hasMatched(); |
||||||
|
}, |
||||||
|
|
||||||
|
hasChecked: function () { |
||||||
|
return this.searcher.getView() && this.searcher.getView().hasChecked(); |
||||||
|
}, |
||||||
|
|
||||||
|
setAdapter: function (adapter) { |
||||||
|
this.searcher.setAdapter(adapter); |
||||||
|
}, |
||||||
|
|
||||||
|
setState: function (ob) { |
||||||
|
var o = this.options; |
||||||
|
ob || (ob = {}); |
||||||
|
ob.value || (ob.value = []); |
||||||
|
if (ob.type === BI.Selection.All) { |
||||||
|
if (ob.value.length === 0) { |
||||||
|
this.editor.setState(BI.Selection.All); |
||||||
|
} else if (BI.size(ob.assist) <= 20) { |
||||||
|
var state = ""; |
||||||
|
BI.each(ob.assist, function (i, v) { |
||||||
|
if (i === 0) { |
||||||
|
state += "" + (o.valueFormatter(v + "") || v); |
||||||
|
} else { |
||||||
|
state += "," + (o.valueFormatter(v + "") || v); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.editor.setState(state); |
||||||
|
} else { |
||||||
|
this.editor.setState(BI.Selection.Multi); |
||||||
|
} |
||||||
|
} else { |
||||||
|
if (ob.value.length === 0) { |
||||||
|
this.editor.setState(BI.Selection.None); |
||||||
|
} else if (BI.size(ob.value) <= 20) { |
||||||
|
var state = ""; |
||||||
|
BI.each(ob.value, function (i, v) { |
||||||
|
if (i === 0) { |
||||||
|
state += "" + (o.valueFormatter(v + "") || v); |
||||||
|
} else { |
||||||
|
state += "," + (o.valueFormatter(v + "") || v); |
||||||
|
} |
||||||
|
}); |
||||||
|
this.editor.setState(state); |
||||||
|
} else { |
||||||
|
this.editor.setState(BI.Selection.Multi); |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
setValue: function (ob) { |
||||||
|
this.setState(ob); |
||||||
|
this.searcher.setValue(ob); |
||||||
|
}, |
||||||
|
|
||||||
|
getKey: function () { |
||||||
|
return this.editor.getValue(); |
||||||
|
}, |
||||||
|
|
||||||
|
getValue: function () { |
||||||
|
return this.searcher.getValue(); |
||||||
|
}, |
||||||
|
|
||||||
|
populate: function (items) { |
||||||
|
this.searcher.populate.apply(this.searcher, arguments); |
||||||
|
} |
||||||
|
}); |
||||||
|
|
||||||
|
BI.MultiSelectInsertSearcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_CHANGE = "EVENT_CHANGE"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_START = "EVENT_START"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_STOP = "EVENT_STOP"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_PAUSE = "EVENT_PAUSE"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_SEARCHING = "EVENT_SEARCHING"; |
||||||
|
BI.MultiSelectInsertSearcher.EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; |
||||||
|
BI.shortcut("bi.multi_select_insert_searcher", BI.MultiSelectInsertSearcher); |
Loading…
Reference in new issue