Browse Source

feature: 选中数据支持分页

es6
guy 2 years ago
parent
commit
291554ecb4
  1. 244
      src/widget/multiselect/loader.js
  2. 63
      src/widget/multiselect/multiselect.loader.js

244
src/widget/multiselect/loader.js

@ -0,0 +1,244 @@
/**
* 加载控件
*
* Created by GUY on 2015/8/31.
* @class BI.Loader
* @extends BI.Widget
*/
BI.MultiSelectInnerLoader = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectInnerLoader.superclass._defaultConfig.apply(this, arguments), {
baseCls: "bi-multi-select-inner-loader",
direction: "top",
isDefaultInit: true, // 是否默认初始化数据
logic: {
dynamic: true,
scrolly: true
},
// 下面是button_group的属性
el: {
type: "bi.button_group",
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
behaviors: {
redmark: function () {
return true;
}
},
layouts: [{
type: "bi.vertical"
}]
},
items: [],
itemsCreator: BI.emptyFn,
onLoaded: BI.emptyFn,
// 下面是分页信息
count: false,
prev: false,
next: {},
hasPrev: BI.emptyFn,
hasNext: BI.emptyFn
});
},
_nextLoad: function () {
var self = this, o = this.options;
this.next.setLoading();
if (this.cachItems && this.cachItems.length > 0) {
this.next.setLoaded();
this.addItems(this.cachItems.slice(0, 10));
this.cachItems = this.cachItems.slice(10);
return;
}
o.itemsCreator.apply(this, [{times: ++this.times}, function () {
self.next.setLoaded();
self.addItems.apply(self, arguments);
}]);
},
render: function () {
var self = this, o = this.options;
if (o.itemsCreator === false) {
o.next = false;
}
this.button_group = BI.createWidget(o.el, {
type: "bi.button_group",
chooseType: 0,
items: o.items,
behaviors: {},
layouts: [{
type: "bi.vertical"
}],
value: o.value
});
this.button_group.on(BI.Controller.EVENT_CHANGE, function (type, value, obj) {
if (type === BI.Events.CLICK) {
var node = self.cachGroup.getNodeByValue(value);
if (node) {
node.setSelected(obj.isSelected());
}
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
if (type === BI.Events.CLICK) {
self.fireEvent(BI.Loader.EVENT_CHANGE, obj);
}
});
this.cachGroup = BI.createWidget(o.el, {
type: "bi.button_group",
root: true,
chooseType: 0,
items: o.items,
behaviors: {},
layouts: [{
type: "bi.vertical"
}],
value: o.value
});
if (o.next !== false) {
this.next = BI.createWidget(BI.extend({
type: "bi.loading_bar"
}, o.next));
this.next.on(BI.Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) {
self._nextLoad();
}
});
}
BI.createWidget({
type: "bi.vertical",
element: this,
items: [this.button_group, this.next]
});
o.isDefaultInit && BI.isEmpty(o.items) && BI.nextTick(BI.bind(function () {
o.isDefaultInit && BI.isEmpty(o.items) && this._populate();
}, this));
},
hasNext: function () {
var o = this.options;
if (BI.isNumber(o.count)) {
return this.count < o.count;
}
if (this.cachItems && this.cachItems.length > 0) {
return true;
}
return !!o.hasNext.apply(this, [{
times: this.times,
count: this.count
}]);
},
addItems: function (items) {
this.count += items.length;
if (BI.isObject(this.next)) {
if (this.hasNext()) {
this.options.items = this.options.items.concat(items);
this.next.setLoaded();
} else {
this.next.setEnd();
}
}
this.cachGroup.addItems.apply(this.cachGroup, arguments);
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 (items, keyword) {
if (arguments.length === 0) {
throw new Error("参数不能为空");
}
self.populate.apply(self, arguments);
o.onLoaded();
}]);
return false;
}
this.options.items = (items || []).slice(0, 10);
this.times = 1;
this.count = 0;
this.count += items.length;
if (BI.isObject(this.next)) {
if (this.hasNext()) {
this.next.setLoaded();
} else {
this.next.invisible();
}
}
return true;
},
populate: function (items, keyword) {
if (this._populate.apply(this, arguments)) {
this.cachItems = [];
if (items.length > 10) {
this.cachItems = items.slice(10);
}
this.cachGroup.populate.call(this.cachGroup, items, keyword);
this.button_group.populate.call(this.button_group, items.slice(0, 10), keyword);
}
},
setNotSelectedValue: function () {
this.button_group.setNotSelectedValue.apply(this.button_group, arguments);
this.cachGroup.setNotSelectedValue.apply(this.cachGroup, arguments);
},
getNotSelectedValue: function () {
return this.cachGroup.getNotSelectedValue();
},
setValue: function () {
this.cachGroup.setValue.apply(this.cachGroup, arguments);
this.button_group.setValue.apply(this.button_group, arguments);
},
getValue: function () {
return this.cachGroup.getValue.apply(this.cachGroup, arguments);
},
getAllButtons: function () {
return this.button_group.getAllButtons();
},
getAllLeaves: function () {
return this.button_group.getAllLeaves();
},
getSelectedButtons: function () {
return this.button_group.getSelectedButtons();
},
getNotSelectedButtons: function () {
return this.button_group.getNotSelectedButtons();
},
getIndexByValue: function (value) {
return this.button_group.getIndexByValue(value);
},
getNodeById: function (id) {
return this.button_group.getNodeById(id);
},
getNodeByValue: function (value) {
return this.button_group.getNodeByValue(value);
},
empty: function () {
this.button_group.empty();
this.cachGroup.empty();
BI.each([this.prev, this.next], function (i, ob) {
ob && ob.setVisible(false);
});
}
});
BI.MultiSelectInnerLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_inner_loader", BI.MultiSelectInnerLoader);

63
src/widget/multiselect/multiselect.loader.js

@ -18,7 +18,7 @@ BI.MultiSelectLoader = BI.inherit(BI.Widget, {
valueFormatter: BI.emptyFn, valueFormatter: BI.emptyFn,
itemsCreator: BI.emptyFn, itemsCreator: BI.emptyFn,
onLoaded: BI.emptyFn, onLoaded: BI.emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
}); });
}, },
@ -43,43 +43,28 @@ BI.MultiSelectLoader = BI.inherit(BI.Widget, {
el: BI.extend({ el: BI.extend({
onLoaded: opts.onLoaded, onLoaded: opts.onLoaded,
el: { el: {
type: "bi.loader", type: "bi.multi_select_inner_loader",
isDefaultInit: false,
logic: {
dynamic: true,
scrolly: true
},
el: {
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
behaviors: {
redmark: function () {
return true;
}
},
layouts: [{
type: "bi.vertical"
}]
}
} }
}, opts.el), }, opts.el),
itemsCreator: function (op, callback) { itemsCreator: function (op, callback) {
var startValue = self._startValue; var startValue = self._startValue;
var firstItems = [];
self.storeValue && (op = BI.extend(op || {}, { self.storeValue && (op = BI.extend(op || {}, {
selectedValues: BI.isKey(startValue) && self.storeValue.type === BI.Selection.Multi selectedValues: BI.isKey(startValue) && self.storeValue.type === BI.Selection.Multi
? self.storeValue.value.concat(startValue) : self.storeValue.value ? self.storeValue.value.concat(startValue) : self.storeValue.value
})); }));
if (self.storeValue) { opts.itemsCreator(op, function (ob) {
var json = BI.map(self.storeValue.value.slice((op.times - 1) * 100, op.times * 100), function (i, v) { hasNext = ob.hasNext;
var txt = opts.valueFormatter(v) || v; var firstItems = [];
return { if (op.times === 1 && self.storeValue) {
text: txt, var json = BI.map(self.storeValue.value, function (i, v) {
value: v, var txt = opts.valueFormatter(v) || v;
title: txt, return {
selected: self.storeValue.type === BI.Selection.Multi text: txt,
}; value: v,
}); title: txt,
if (op.times === 1) { selected: self.storeValue.type === BI.Selection.Multi
};
});
if (BI.isKey(self._startValue) && !BI.contains(self.storeValue.value, self._startValue)) { if (BI.isKey(self._startValue) && !BI.contains(self.storeValue.value, self._startValue)) {
var txt = opts.valueFormatter(startValue) || startValue; var txt = opts.valueFormatter(startValue) || startValue;
json.unshift({ json.unshift({
@ -89,22 +74,10 @@ BI.MultiSelectLoader = BI.inherit(BI.Widget, {
selected: true selected: true
}); });
} }
firstItems = self._createItems(json);
} }
if (op.times < Math.floor((self.storeValue.value.length - 1) / 100)) { callback(firstItems.concat(self._createItems(ob.items)), ob.keyword || "");
hasNext = true; if (op.times === 1 && self.storeValue) {
callback(self._createItems(json), op.keyword || "");
(op.times === 1) && self._scrollToTop();
return;
}
firstItems = self._createItems(json);
}
var times = op.times - Math.max(0, Math.floor((self.storeValue.value.length - 1) / 100));
opts.itemsCreator(BI.extend({}, op, {
times: times
}), function (ob) {
hasNext = ob.hasNext;
callback(firstItems.concat(self._createItems(ob.items)), ob.keyword || op.keyword || "");
if (times === 1 && self.storeValue) {
BI.isKey(startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, startValue) : BI.pushDistinct(self.storeValue.value, startValue)); BI.isKey(startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, startValue) : BI.pushDistinct(self.storeValue.value, startValue));
self.setValue(self.storeValue); self.setValue(self.storeValue);
} }

Loading…
Cancel
Save