Browse Source

Pull request #3376: KERNEL-14086 feat: widget/singletree、selecttree

Merge in VISUAL/fineui from ~DAILER/fineui:es6 to es6

* commit '2bfd07879c342edab49b6a714a5972eb15a5c9de':
  KERNEL-14086 feat: widget/singletree、selecttree
es6
Dailer-刘荣歆 2 years ago
parent
commit
1688b21eb4
  1. 3
      es6.js
  2. 171
      src/widget/multiselect/__test__/multiselect.loader.nobar.test.js
  3. 130
      src/widget/multiselect/check/multiselect.check.pane.js
  4. 106
      src/widget/multiselect/check/multiselect.display.js
  5. 317
      src/widget/multiselect/loader.js
  6. 494
      src/widget/multiselect/multiselect.combo.js
  7. 536
      src/widget/multiselect/multiselect.combo.nobar.js
  8. 551
      src/widget/multiselect/multiselect.insert.combo.js
  9. 543
      src/widget/multiselect/multiselect.insert.combo.nobar.js
  10. 190
      src/widget/multiselect/multiselect.insert.trigger.js
  11. 254
      src/widget/multiselect/multiselect.loader.js
  12. 251
      src/widget/multiselect/multiselect.loader.nobar.js
  13. 123
      src/widget/multiselect/multiselect.popup.view.js
  14. 117
      src/widget/multiselect/multiselect.popup.view.nobar.js
  15. 2
      src/widget/multiselect/multiselect.trigger.js
  16. 134
      src/widget/multiselect/search/multiselect.search.insert.pane.js
  17. 203
      src/widget/multiselect/search/multiselect.search.loader.js
  18. 108
      src/widget/multiselect/search/multiselect.search.pane.js
  19. 10
      src/widget/multiselect/trigger/button.checkselected.js
  20. 5
      src/widget/multiselect/trigger/editor.multiselect.js
  21. 260
      src/widget/multiselect/trigger/editor/editor.patch.js
  22. 249
      src/widget/multiselect/trigger/searcher.multiselect.insert.js
  23. 18
      src/widget/multiselect/trigger/searcher.multiselect.js
  24. 8
      src/widget/multiselect/trigger/switcher.checkselected.js
  25. 4
      src/widget/multitree/multi.tree.combo.js
  26. 4
      src/widget/multitree/multi.tree.insert.combo.js
  27. 4
      src/widget/multitree/multi.tree.list.combo.js
  28. 2
      src/widget/multitree/trigger/searcher.list.multi.tree.js
  29. 2
      src/widget/multitree/trigger/searcher.multi.tree.js

3
es6.js

@ -43,10 +43,13 @@ const target = [
"createItems",
"makeArrayByArray",
"VerticalAlign",
"pushDistinct",
"endWith",
"transformItems",
"print",
"Tree",
"Func",
"Selection",
];
// 加载模块

171
src/widget/multiselect/__test__/multiselect.loader.nobar.test.js

@ -4,15 +4,15 @@
* Created by windy on 2019/9/18
*/
describe("multi_select_no_bar_series", function () {
var _getItemsByTimes, _itemsCreator, itemSelectorGetter, searchItemSelectorGetter, _hasNextByTimes, items;
before(function () {
describe("multi_select_no_bar_series", () => {
let _getItemsByTimes, _itemsCreator, itemSelectorGetter, searchItemSelectorGetter, _hasNextByTimes, items;
before(() => {
_getItemsByTimes = function (items, times) {
var res = [];
for (var i = (times - 1) * 100; items[i] && i < times * 100; i++) {
const res = [];
for (let i = (times - 1) * 100; items[i] && i < times * 100; i++) {
res.push(items[i]);
}
return res;
};
@ -21,65 +21,60 @@ describe("multi_select_no_bar_series", function () {
};
_itemsCreator = function (options, callback) {
var items = BI.map(BI.makeArray(100, null), function(idx, v) {
let items = BI.map(BI.makeArray(100, null), (idx, v) => {
return {
text: idx,
value: idx,
title: idx
title: idx,
};
});
var keywords = (options.keywords || []).slice();
const keywords = (options.keywords || []).slice();
if (options.keyword) {
keywords.push(options.keyword);
}
BI.each(keywords, function (i, kw) {
var search = BI.Func.getSearchResult(items, kw);
BI.each(keywords, (i, kw) => {
const search = BI.Func.getSearchResult(items, kw);
items = search.match.concat(search.find);
});
if (options.selectedValues) {// 过滤
var filter = BI.makeObject(options.selectedValues, true);
items = BI.filter(items, function (i, ob) {
return !filter[ob.value];
});
const filter = BI.makeObject(options.selectedValues, true);
items = BI.filter(items, (i, ob) => !filter[ob.value]);
}
if (options.type == BI.MultiSelectCombo.REQ_GET_ALL_DATA) {
callback({
items: items
items,
});
return;
}
if (options.type == BI.MultiSelectCombo.REQ_GET_DATA_LENGTH) {
callback({ count: items.length });
return;
}
callback({
items: _getItemsByTimes(items, options.times),
hasNext: _hasNextByTimes(items, options.times)
hasNext: _hasNextByTimes(items, options.times),
});
};
itemSelectorGetter = function (array) {
return BI.map(array, function (idx, num) {
return ".bi-multi-select-popup-view .bi-loader .bi-button-group .bi-multi-select-item:nth-child(" + num + ")";
});
return BI.map(array, (idx, num) => `.bi-multi-select-popup-view .bi-loader .bi-button-group .bi-multi-select-item:nth-child(${num})`);
};
searchItemSelectorGetter = function (array) {
return BI.map(array, function (idx, num) {
return ".bi-multi-select-search-pane .bi-loader .bi-button-group .bi-multi-select-item:nth-child(" + num + ")";
});
return BI.map(array, (idx, num) => `.bi-multi-select-search-pane .bi-loader .bi-button-group .bi-multi-select-item:nth-child(${num})`);
};
})
});
/**
* test_author_windy
**/
it("setValue", function () {
var widget = BI.Test.createWidget({
it("setValue", () => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
widget.setValue([1, 2]);
expect(widget.getValue()).to.deep.equal([1, 2]);
@ -89,12 +84,12 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("getValue", function () {
var widget = BI.Test.createWidget({
it("getValue", () => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator,
value: [1, 2, 3]
value: [1, 2, 3],
});
expect(widget.getValue()).to.deep.equal([1, 2, 3]);
widget.destroy();
@ -103,22 +98,22 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("点选选值", function (done) {
var widget = BI.Test.createWidget({
it("点选选值", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
widget.element.find(".bi-multi-select-trigger").click();
// 为什么要delay 300呢,因为按钮有debounce
BI.delay(function () {
BI.delay(() => {
// 点选1、2、3
BI.each(itemSelectorGetter([1,2,3]), function (idx, selector) {
BI.each(itemSelectorGetter([1, 2, 3]), (idx, selector) => {
widget.element.find(selector).click();
});
// 取消勾选1、2
BI.delay(function () {
BI.each(itemSelectorGetter([1,2]), function (idx, selector) {
BI.delay(() => {
BI.each(itemSelectorGetter([1, 2]), (idx, selector) => {
widget.element.find(selector).click();
});
expect(widget.getValue()).to.deep.equal([2]);
@ -131,19 +126,19 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("搜索选值", function (done) {
var widget = BI.Test.createWidget({
it("搜索选值", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
BI.nextTick(function () {
BI.nextTick(() => {
widget.element.find(".bi-multi-select-trigger .tip-text-style").click();
// 这边为啥要加呢,因为input的setValue中有nextTick
BI.nextTick(function () {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "2", 50, function () {
BI.nextTick(function () {
BI.each(searchItemSelectorGetter([1,2]), function (idx, selector) {
BI.nextTick(() => {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "2", 50, () => {
BI.nextTick(() => {
BI.each(searchItemSelectorGetter([1, 2]), (idx, selector) => {
widget.element.find(selector).click();
});
expect(widget.getValue()).to.deep.equal([2, 12]);
@ -158,21 +153,21 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("查看已选", function (done) {
var widget = BI.Test.createWidget({
it("查看已选", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_no_bar_combo",
width: 220,
itemsCreator: function (op, callback) {
itemsCreator(op, callback) {
callback({
items: items,
hasNext: false
items,
hasNext: false,
});
},
value: [1, 2]
value: [1, 2],
});
BI.nextTick(function () {
BI.nextTick(() => {
widget.element.find(".bi-multi-select-check-selected-button").click();
BI.delay(function () {
BI.delay(() => {
expect(widget.element.find(".display-list-item").length).to.equal(2);
widget.destroy();
done();
@ -183,11 +178,11 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("setValue", function () {
var widget = BI.Test.createWidget({
it("setValue", () => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
widget.setValue([1, 2]);
expect(widget.getValue()).to.deep.equal([1, 2]);
@ -197,12 +192,12 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("getValue", function () {
var widget = BI.Test.createWidget({
it("getValue", () => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator,
value: [1, 2, 3]
value: [1, 2, 3],
});
expect(widget.getValue()).to.deep.equal([1, 2, 3]);
widget.destroy();
@ -212,22 +207,22 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("点选选值1", function (done) {
var widget = BI.Test.createWidget({
it("点选选值1", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
widget.element.find(".bi-multi-select-trigger").click();
// 为什么要delay 300呢,因为按钮有debounce
BI.delay(function () {
BI.delay(() => {
// 点选1、2、3
BI.each(itemSelectorGetter([1,2,3]), function (idx, selector) {
BI.each(itemSelectorGetter([1, 2, 3]), (idx, selector) => {
widget.element.find(selector).click();
});
// 取消勾选1、2、3
BI.delay(function () {
BI.each(itemSelectorGetter([1,2]), function (idx, selector) {
BI.delay(() => {
BI.each(itemSelectorGetter([1, 2]), (idx, selector) => {
widget.element.find(selector).click();
});
expect(widget.getValue()).to.deep.equal([2]);
@ -240,19 +235,19 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("搜索选值1", function (done) {
var widget = BI.Test.createWidget({
it("搜索选值1", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
BI.nextTick(function () {
BI.nextTick(() => {
widget.element.find(".bi-multi-select-trigger .tip-text-style").click();
// 这边为啥要加呢,因为input的setValue中有nextTick
BI.nextTick(function () {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "2", 50, function () {
BI.nextTick(function () {
BI.each(searchItemSelectorGetter([1,2]), function (idx, selector) {
BI.nextTick(() => {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "2", 50, () => {
BI.nextTick(() => {
BI.each(searchItemSelectorGetter([1, 2]), (idx, selector) => {
widget.element.find(selector).click();
});
expect(widget.getValue()).to.deep.equal([2, 12]);
@ -267,18 +262,18 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("新增值1", function (done) {
var widget = BI.Test.createWidget({
it("新增值1", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator
itemsCreator: _itemsCreator,
});
BI.nextTick(function () {
BI.nextTick(() => {
widget.element.find(".bi-multi-select-trigger .tip-text-style").click();
// 这边为啥要加呢,因为input的setValue中有nextTick
BI.nextTick(function () {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "z", 50, function () {
BI.nextTick(function () {
BI.nextTick(() => {
BI.Test.triggerKeyDown(widget.element.find(".bi-multi-select-trigger .bi-input"), "z", 50, () => {
BI.nextTick(() => {
widget.element.find(".bi-text-button:contains(+点击新增\"z\")").click();
expect(widget.getValue()).to.deep.equal(["z"]);
widget.destroy();
@ -292,19 +287,19 @@ describe("multi_select_no_bar_series", function () {
/**
* test_author_windy
**/
it("查看已选1", function (done) {
var widget = BI.Test.createWidget({
it("查看已选1", done => {
const widget = BI.Test.createWidget({
type: "bi.multi_select_insert_no_bar_combo",
width: 220,
itemsCreator: _itemsCreator,
value: {
type: 1,
value: [1, 2]
}
value: [1, 2],
},
});
BI.nextTick(function () {
BI.nextTick(() => {
widget.element.find(".bi-multi-select-check-selected-button").click();
BI.delay(function () {
BI.delay(() => {
expect(widget.element.find(".display-list-item").length).to.equal(2);
widget.destroy();
done();

130
src/widget/multiselect/check/multiselect.check.pane.js

@ -1,113 +1,121 @@
/**
*
* @class BI.MultiSelectCheckPane
* @extends BI.Widget
*/
BI.MultiSelectCheckPane = BI.inherit(BI.Widget, {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
map,
i18nText,
VerticalAdaptLayout, VTapeLayout
} from "@/core";
import { TextButton, Label } from "@/base";
import { DisplaySelectedList } from "./multiselect.display";
constants: {
height: 12,
lgap: 10,
tgap: 10,
bgap: 5
},
@shortcut()
export class MultiSelectCheckPane extends Widget {
static xtype = "bi.multi_select_check_pane";
constants = { height: 12, lgap: 10, tgap: 10, bgap: 5 };
_defaultConfig: function () {
return BI.extend(BI.MultiSelectCheckPane.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-check-pane bi-background",
items: [],
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
onClickContinueSelect: BI.emptyFn
itemsCreator: emptyFn,
valueFormatter: emptyFn,
onClickContinueSelect: emptyFn,
});
},
}
_init: function () {
BI.MultiSelectCheckPane.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, opts = this.options;
const self = this,
opts = this.options;
this.storeValue = opts.value || {};
this.display = BI.createWidget({
type: "bi.display_selected_list",
this.display = createWidget({
type: DisplaySelectedList.xtype,
items: opts.items,
itemsCreator: function (op, callback) {
op = BI.extend(op || {}, {
selectedValues: self.storeValue.value
itemsCreator(op, callback) {
op = extend(op || {}, {
selectedValues: self.storeValue.value,
});
if (self.storeValue.type === BI.Selection.Multi) {
callback({
items: BI.map(self.storeValue.value, function (i, v) {
var txt = opts.valueFormatter(v) || v;
items: map(self.storeValue.value, (i, v) => {
const txt = opts.valueFormatter(v) || v;
return {
text: txt,
value: v,
title: txt
title: txt,
};
})
}),
});
return;
}
opts.itemsCreator(op, callback);
}
},
});
this.continueSelect = BI.createWidget({
type: "bi.text_button",
title: BI.i18nText("BI-Continue_Select"),
text: BI.i18nText("BI-Continue_Select"),
cls: "multi-select-check-selected bi-high-light"
this.continueSelect = createWidget({
type: TextButton.xtype,
title: i18nText("BI-Continue_Select"),
text: i18nText("BI-Continue_Select"),
cls: "multi-select-check-selected bi-high-light",
});
this.continueSelect.on(BI.TextButton.EVENT_CHANGE, function () {
this.continueSelect.on(TextButton.EVENT_CHANGE, () => {
opts.onClickContinueSelect();
});
BI.createWidget({
type: "bi.vtape",
createWidget({
type: VTapeLayout.xtype,
element: this,
items: [{
items: [
{
height: this.constants.height,
el: {
type: "bi.vertical_adapt",
type: VerticalAdaptLayout.xtype,
columnSize: ["auto", "auto"],
cls: "multi-select-continue-select",
items: [
{
el: {
type: "bi.label",
title: BI.i18nText("BI-Selected_Data"),
text: BI.i18nText("BI-Selected_Data")
type: Label.xtype,
title: i18nText("BI-Selected_Data"),
text: i18nText("BI-Selected_Data"),
},
lgap: this.constants.lgap
lgap: this.constants.lgap,
},
{
el: this.continueSelect,
hgap: this.constants.lgap
}]
hgap: this.constants.lgap,
}
],
},
tgap: this.constants.tgap
}, {
tgap: this.constants.tgap,
},
{
height: "fill",
el: this.display,
tgap: this.constants.bgap
}]
tgap: this.constants.bgap,
}
],
});
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = v || {};
},
}
empty: function () {
empty() {
this.display.empty();
},
populate: function () {
this.display.populate.apply(this.display, arguments);
}
});
BI.shortcut("bi.multi_select_check_pane", BI.MultiSelectCheckPane);
populate() {
this.display.populate(...arguments);
}
}

106
src/widget/multiselect/check/multiselect.display.js

@ -1,106 +1,112 @@
/**
*
*
* 查看已选弹出层的展示面板
* @class BI.DisplaySelectedList
* @extends BI.Widget
*/
BI.DisplaySelectedList = BI.inherit(BI.Pane, {
import {
shortcut,
extend,
emptyFn,
createWidget,
VerticalLayout,
createItems
} from "@/core";
import { Pane, ButtonGroup, Loader, IconTextItem } from "@/base";
import { ListPane } from "@/case";
constants: {
height: 24,
lgap: 10
},
@shortcut()
export class DisplaySelectedList extends Pane {
static xtype = "bi.display_selected_list";
constants = { height: 24, lgap: 10 };
_defaultConfig: function () {
return BI.extend(BI.DisplaySelectedList.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-display-list",
itemsCreator: BI.emptyFn,
items: []
itemsCreator: emptyFn,
items: [],
});
},
}
_init: function () {
BI.DisplaySelectedList.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, opts = this.options;
const self = this,
opts = this.options;
this.hasNext = false;
var cacheItems = [];
let cacheItems = [];
this.button_group = BI.createWidget({
type: "bi.list_pane",
this.button_group = createWidget({
type: ListPane.xtype,
element: this,
el: {
type: "bi.loader",
type: Loader.xtype,
isDefaultInit: false,
logic: {
dynamic: true,
scrolly: true
scrolly: true,
},
items: this._createItems(opts.items),
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI,
layouts: [
{
type: "bi.vertical",
lgap: 10
type: VerticalLayout.xtype,
lgap: 10,
}
]
],
},
itemsCreator: function (options, callback) {
itemsCreator (options, callback) {
if (options.times === 1) {
cacheItems = [];
}
if (cacheItems.length > 0) {
var renderedItems = cacheItems.slice(0, 100);
const renderedItems = cacheItems.slice(0, 100);
cacheItems = cacheItems.slice(100);
self.hasNext = cacheItems.length > 0;
callback(self._createItems(renderedItems));
return;
}
opts.itemsCreator(options, function (ob) {
opts.itemsCreator(options, ob => {
self.hasNext = !!ob.hasNext;
var firstItemsCount = 100 + ob.items.length % 100;
const firstItemsCount = 100 + (ob.items.length % 100);
if (ob.items.length > 100) {
cacheItems = ob.items.slice(firstItemsCount);
self.hasNext = (firstItemsCount === ob.items.length) ? false : true;
self.hasNext =
firstItemsCount !== ob.items.length;
}
callback(self._createItems(ob.items.slice(0, firstItemsCount)));
callback(
self._createItems(ob.items.slice(0, firstItemsCount))
);
});
},
hasNext: function () {
hasNext () {
return self.hasNext;
}
});
},
});
}
_createItems: function (items) {
return BI.createItems(items, {
type: "bi.icon_text_item",
_createItems(items) {
return createItems(items, {
type: IconTextItem.xtype,
cls: "cursor-default check-font icon-size-12 display-list-item bi-tips",
once: true,
invalid: true,
selected: true,
height: this.constants.height,
logic: {
dynamic: true
}
});
dynamic: true,
},
});
}
empty: function () {
empty() {
this.button_group.empty();
},
}
populate: function (items) {
populate(items) {
if (arguments.length === 0) {
this.button_group.populate();
} else {
this.button_group.populate(this._createItems(items));
}
}
});
BI.shortcut("bi.display_selected_list", BI.DisplaySelectedList);
}

317
src/widget/multiselect/loader.js

@ -1,146 +1,192 @@
/**
* 加载控件
*
* 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), {
import {
shortcut,
Widget,
extend,
emptyFn,
VerticalLayout,
createWidget,
Controller,
Events,
isEmpty,
nextTick,
bind,
isNumber,
isObject,
isFunction,
makeObject,
isArray,
each
} from "@/core";
import { ButtonGroup, Loader } from "@/base";
@shortcut()
export class MultiSelectInnerLoader extends Widget {
static xtype = "bi.multi_select_inner_loader";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-inner-loader",
direction: "top",
isDefaultInit: true, // 是否默认初始化数据
logic: {
dynamic: true,
scrolly: true
scrolly: true,
},
// 下面是button_group的属性
el: {
type: "bi.button_group",
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
type: ButtonGroup.xtype,
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI,
behaviors: {
redmark: function () {
redmark() {
return true;
}
},
layouts: [{
type: "bi.vertical"
}]
},
layouts: [
{
type: VerticalLayout.xtype,
}
],
},
items: [],
itemsCreator: BI.emptyFn,
onLoaded: BI.emptyFn,
itemsCreator: emptyFn,
onLoaded: emptyFn,
// 下面是分页信息
count: false,
prev: false,
next: {},
hasPrev: BI.emptyFn,
hasNext: BI.emptyFn
hasPrev: emptyFn,
hasNext: emptyFn,
});
},
}
_nextLoad: function () {
var self = this, o = this.options;
_nextLoad() {
const self = this,
o = this.options;
this.next.setLoading();
if (this.cachItems && this.cachItems.length > 0) {
this.next.setLoaded();
this.addItems(this.cachItems.slice(0, 100));
this.cachItems = this.cachItems.slice(100);
return;
}
o.itemsCreator.apply(this, [{times: ++this.times}, function () {
o.itemsCreator.apply(this, [
{ times: ++this.times },
function () {
self.next.setLoaded();
self.addItems.apply(self, arguments);
}]);
},
self.addItems(...arguments);
}
]);
}
render: function () {
var self = this, o = this.options;
render() {
const self = this,
o = this.options;
if (o.itemsCreator === false) {
o.next = false;
}
this.button_group = BI.createWidget(o.el, {
type: "bi.button_group",
this.button_group = createWidget(o.el, {
type: ButtonGroup.xtype,
chooseType: 0,
items: o.items,
behaviors: {},
layouts: [{
type: "bi.vertical"
}],
value: o.value
layouts: [
{
type: VerticalLayout.xtype,
}
],
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);
this.button_group.on(
Controller.EVENT_CHANGE,
function (type, value, obj) {
if (type === Events.CLICK) {
const 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);
self.fireEvent(Controller.EVENT_CHANGE, arguments);
if (type === Events.CLICK) {
self.fireEvent(Loader.EVENT_CHANGE, obj);
}
});
}
);
var renderEngine = BI.Widget._renderEngine;
BI.Widget.registerRenderEngine(BI.Element.renderEngine);
this.cachGroup = BI.createWidget(o.el, {
type: "bi.button_group",
const renderEngine = Widget._renderEngine;
Widget.registerRenderEngine(BI.Element.renderEngine);
this.cachGroup = createWidget(o.el, {
type: ButtonGroup.xtype,
root: true,
chooseType: 0,
items: o.items,
behaviors: {},
layouts: [{
type: "bi.vertical"
}],
value: o.value
layouts: [
{
type: VerticalLayout.xtype,
}
],
value: o.value,
});
BI.Widget.registerRenderEngine(renderEngine);
Widget.registerRenderEngine(renderEngine);
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) {
this.next = createWidget(
extend(
{
type: "bi.loading_bar",
},
o.next
)
);
this.next.on(Controller.EVENT_CHANGE, type => {
if (type === Events.CLICK) {
self._nextLoad();
}
});
}
BI.createWidget({
type: "bi.vertical",
createWidget({
type: VerticalLayout.xtype,
element: this,
items: [this.button_group, this.next]
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));
},
o.isDefaultInit &&
isEmpty(o.items) &&
nextTick(
bind(function () {
o.isDefaultInit && isEmpty(o.items) && this._populate();
}, this)
);
}
hasNext: function () {
var o = this.options;
if (BI.isNumber(o.count)) {
hasNext() {
const o = this.options;
if (isNumber(o.count)) {
return this.count < o.count;
}
if (this.cachItems && this.cachItems.length > 0) {
return true;
}
return !!o.hasNext.apply(this, [{
return !!o.hasNext.apply(this, [
{
times: this.times,
count: this.count
}]);
},
count: this.count,
}
]);
}
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();
@ -148,113 +194,124 @@ BI.MultiSelectInnerLoader = BI.inherit(BI.Widget, {
this.next.setEnd();
}
}
var renderEngine = BI.Widget._renderEngine;
BI.Widget.registerRenderEngine(BI.Element.renderEngine);
this.cachGroup.addItems.apply(this.cachGroup, arguments);
BI.Widget.registerRenderEngine(renderEngine);
this.button_group.addItems.apply(this.button_group, arguments);
},
const renderEngine = Widget._renderEngine;
Widget.registerRenderEngine(BI.Element.renderEngine);
this.cachGroup.addItems(...arguments);
Widget.registerRenderEngine(renderEngine);
this.button_group.addItems(...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) {
_populate(items) {
const self = this,
o = this.options;
if (arguments.length === 0 && isFunction(o.itemsCreator)) {
o.itemsCreator.apply(this, [
{ times: 1 },
function (items, keyword) {
if (arguments.length === 0) {
throw new Error("参数不能为空");
}
self.populate.apply(self, arguments);
self.populate(...arguments);
o.onLoaded();
}]);
}
]);
return false;
}
this.options.items = (items || []).slice(0, 100 + (items || []).length % 100);
this.options.items = (items || []).slice(
0,
100 + ((items || []).length % 100)
);
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();
}
}
return true;
},
}
populate: function (items, keyword) {
if (this._populate.apply(this, arguments)) {
populate(items, keyword) {
if (this._populate(...arguments)) {
this.cachItems = [];
var firstItemsCount = 100 + items.length % 100;
const firstItemsCount = 100 + (items.length % 100);
if (items.length > firstItemsCount) {
this.cachItems = items.slice(firstItemsCount);
}
var renderEngine = BI.Widget._renderEngine;
BI.Widget.registerRenderEngine(BI.Element.renderEngine);
const renderEngine = Widget._renderEngine;
Widget.registerRenderEngine(BI.Element.renderEngine);
this.cachGroup.populate.call(this.cachGroup, items, keyword);
BI.Widget.registerRenderEngine(renderEngine);
this.button_group.populate.call(this.button_group, items.slice(0, firstItemsCount), keyword);
Widget.registerRenderEngine(renderEngine);
this.button_group.populate.call(
this.button_group,
items.slice(0, firstItemsCount),
keyword
);
}
}
},
setNotSelectedValue: function () {
this.button_group.setNotSelectedValue.apply(this.button_group, arguments);
this.cachGroup.setNotSelectedValue.apply(this.cachGroup, arguments);
},
setNotSelectedValue() {
this.button_group.setNotSelectedValue(...arguments);
this.cachGroup.setNotSelectedValue(...arguments);
}
getNotSelectedValue: function () {
getNotSelectedValue() {
return this.cachGroup.getNotSelectedValue();
},
}
setAllSelected: function (v) {
setAllSelected(v) {
this.button_group.setAllSelected(v);
this.cachGroup.setAllSelected(v);
},
}
setValue: function (value) {
var map = BI.makeObject(BI.isArray(value) ? value : [value]);
setValue(value) {
const map = makeObject(isArray(value) ? value : [value]);
this.cachGroup.setValueMap.call(this.cachGroup, map);
this.button_group.setValueMap.call(this.button_group, map);
},
}
getValue: function () {
return this.cachGroup.getValue.apply(this.cachGroup, arguments);
},
getValue() {
return this.cachGroup.getValue(...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();
this.cachGroup.empty();
BI.each([this.prev, this.next], function (i, ob) {
each([this.prev, this.next], (i, ob) => {
ob && ob.setVisible(false);
});
}
});
BI.MultiSelectInnerLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_inner_loader", BI.MultiSelectInnerLoader);
}

494
src/widget/multiselect/multiselect.combo.js

@ -1,51 +1,98 @@
/**
*
* @class BI.MultiSelectCombo
* @extends BI.Single
*/
BI.MultiSelectCombo = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectCombo.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
isKey,
remove,
deepClone,
createWidget,
toPix,
bind,
last,
initial,
nextTick,
Events,
AbsoluteLayout,
VerticalAdaptLayout,
isNotNull,
makeObject,
map,
each,
Func,
concat,
values,
filter,
contains,
isNull
} from "@/core";
import { Single, Combo } from "@/base";
import { TriggerIconButton } from "@/case";
import { MultiSelectTrigger } from "./multiselect.trigger";
import { MultiSelectPopupView } from "./multiselect.popup.view";
import { MultiSelectCheckSelectedSwitcher } from "./trigger/switcher.checkselected";
@shortcut()
export class MultiSelectCombo extends Single {
static xtype = "bi.multi_select_combo";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_STOP = "EVENT_STOP";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_CONFIRM = "EVENT_CONFIRM";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-combo",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height: 24,
allowEdit: true,
});
},
}
_init() {
const self = this;
const o = this.options;
super._init(...arguments);
const triggerBtn = createWidget({
type: TriggerIconButton.xtype,
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button",
});
_init: function () {
var self = this;
var o = this.options;
BI.MultiSelectCombo.superclass._init.apply(this, arguments);
var assertShowValue = function () {
if (BI.isKey(self._startValue)) {
function assertShowValue() {
if (isKey(self._startValue)) {
if (self.storeValue.type === BI.Selection.All) {
BI.remove(self.storeValue.value, self._startValue);
remove(self.storeValue.value, self._startValue);
self.storeValue.assist = self.storeValue.assist || [];
BI.pushDistinct(self.storeValue.assist, self._startValue);
} else {
BI.pushDistinct(self.storeValue.value, self._startValue);
BI.remove(self.storeValue.assist, self._startValue);
remove(self.storeValue.assist, self._startValue);
}
}
self.trigger.getSearcher().setState(self.storeValue);
self.numberCounter.setButtonChecked(self.storeValue);
};
this.storeValue = BI.deepClone(o.value) || {};
}
this.storeValue = deepClone(o.value) || {};
this._assertValue(this.storeValue);
// 标记正在请求数据
this.requesting = false;
this.trigger = BI.createWidget({
type: "bi.multi_select_trigger",
this.trigger = createWidget({
type: MultiSelectTrigger.xtype,
allowEdit: o.allowEdit,
height: BI.toPix(o.height, o.simple ? 1 : 2),
height: toPix(o.height, o.simple ? 1 : 2),
text: o.text,
defaultText: o.defaultText,
masker: {
@ -58,32 +105,34 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
},
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
itemHeight: o.itemHeight,
value: this.storeValue,
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_FOCUS, function () {
self.fireEvent(BI.MultiSelectCombo.EVENT_FOCUS);
this.trigger.on(MultiSelectTrigger.EVENT_FOCUS, () => {
self.fireEvent(MultiSelectCombo.EVENT_FOCUS);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_BLUR, function () {
self.fireEvent(BI.MultiSelectCombo.EVENT_BLUR);
this.trigger.on(MultiSelectTrigger.EVENT_BLUR, () => {
self.fireEvent(MultiSelectCombo.EVENT_BLUR);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () {
this.trigger.on(MultiSelectTrigger.EVENT_START, function () {
self._setStartValue("");
this.getSearcher().setValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () {
this.trigger.on(MultiSelectTrigger.EVENT_STOP, () => {
self._setStartValue("");
self.fireEvent(BI.MultiSelectCombo.EVENT_STOP);
self.fireEvent(MultiSelectCombo.EVENT_STOP);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_SEARCHING, function (keywords) {
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
this.trigger.on(
MultiSelectTrigger.EVENT_SEARCHING,
keywords => {
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
self._joinKeywords(keywords, () => {
if (BI.endWith(lastKeyword, BI.BlankSplitChar)) {
self.combo.setValue(self.storeValue);
assertShowValue();
self.combo.populate();
@ -95,77 +144,85 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
self._dataChange = true;
});
}
self.fireEvent(BI.MultiSelectCombo.EVENT_SEARCHING);
});
self.fireEvent(MultiSelectCombo.EVENT_SEARCHING);
}
);
this.trigger.on(BI.MultiSelectTrigger.EVENT_CHANGE, function (value, obj) {
this.trigger.on(MultiSelectTrigger.EVENT_CHANGE, function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
self._joinAll(this.getValue(), () => {
assertShowValue();
self.fireEvent(BI.MultiSelectCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectCombo.EVENT_CLICK_ITEM);
});
} else {
self._join(this.getValue(), function () {
self._join(this.getValue(), () => {
assertShowValue();
self.fireEvent(BI.MultiSelectCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectCombo.EVENT_CLICK_ITEM);
});
}
self._dataChange = true;
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW, function () {
this.trigger.on(
MultiSelectTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW,
() => {
// counter的值随点击项的改变而改变, 点击counter的时候不需要setValue(counter会请求刷新计数)
// 只需要更新查看面板的selectedValue用以请求已选数据
self.numberCounter.updateSelectedValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_COUNTER_CLICK, function () {
}
);
this.trigger.on(MultiSelectTrigger.EVENT_COUNTER_CLICK, () => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.combo = BI.createWidget({
type: "bi.combo",
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"),
this.combo = createWidget({
type: Combo.xtype,
cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: !o.allowEdit,
container: o.container,
el: this.trigger,
adjustLength: 1,
popup: {
type: "bi.multi_select_popup_view",
ref: function () {
ref() {
self.popup = this;
self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this);
},
listeners: [{
eventName: BI.MultiSelectPopupView.EVENT_CHANGE,
action: function () {
listeners: [
{
eventName: MultiSelectPopupView.EVENT_CHANGE,
action() {
self._dataChange = true;
self.storeValue = this.getValue();
self._adjust(function () {
self._adjust(() => {
assertShowValue();
});
self.fireEvent(BI.MultiSelectCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectCombo.EVENT_CLICK_ITEM);
},
},
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action: function () {
{
eventName: MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action() {
self._defaultState();
},
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CLEAR,
action: function () {
},
{
eventName: MultiSelectPopupView.EVENT_CLICK_CLEAR,
action() {
self._dataChange = true;
self.setValue();
self._defaultState();
},
}],
}
],
itemsCreator: o.itemsCreator,
itemHeight: o.itemHeight,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
onLoaded: function () {
BI.nextTick(function () {
onLoaded() {
nextTick(() => {
self.combo.adjustWidth();
self.combo.adjustHeight();
self.numberCounter.adjustView();
@ -174,39 +231,37 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
},
},
value: o.value,
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 && self.numberCounter.element.find(e.target).length === 0;
hideChecker(e) {
return (
triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0
);
},
});
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (!this.isViewVisible()) {
self._dataChange = false; // 标记数据是否发生变化
}
this.setValue(self.storeValue);
BI.nextTick(function () {
nextTick(() => {
self._populate();
});
});
// 当退出的时候如果还在处理请求,则等请求结束后再对外发确定事件
this.wants2Quit = false;
this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () {
this.combo.on(Combo.EVENT_AFTER_HIDEVIEW, () => {
// important:关闭弹出时又可能没有退出编辑状态
self._stopEditing();
if (self.requesting === true) {
self.wants2Quit = true;
} else {
self._dataChange && self.fireEvent(BI.MultiSelectCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectCombo.EVENT_CONFIRM);
}
});
var triggerBtn = BI.createWidget({
type: "bi.trigger_icon_button",
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button",
});
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView();
if (self.combo.isViewVisible()) {
self.combo.hideView();
@ -215,8 +270,8 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
}
});
this.numberCounter = BI.createWidget({
type: "bi.multi_select_check_selected_switcher",
this.numberCounter = createWidget({
type: MultiSelectCheckSelectedSwitcher.xtype,
masker: {
offset: {
left: 0,
@ -226,259 +281,274 @@ BI.MultiSelectCombo = BI.inherit(BI.Single, {
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
value: this.storeValue,
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () {
}
);
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
function () {
this.updateSelectedValue(self.storeValue);
});
}
);
this.numberCounter.on(BI.Events.VIEW, function (b) {
BI.nextTick(function () {// 自动调整宽度
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0));
this.numberCounter.on(Events.VIEW, b => {
nextTick(() => {
// 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
});
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () {
BI.nextTick(function () {// 收起时自动调整宽度
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
() => {
nextTick(() => {
// 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
});
}
);
this.trigger.element.click(function (e) {
this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView();
}
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [{
items: [
{
el: this.combo,
left: 0,
right: 0,
top: 0,
bottom: 0,
}, {
},
{
el: triggerBtn,
right: 0,
top: 0,
bottom: 0,
}, {
},
{
el: {
type: "bi.vertical_adapt",
type: VerticalAdaptLayout.xtype,
items: [this.numberCounter],
},
right: o.height,
top: 0,
height: o.height,
}],
}
],
});
},
}
_itemsCreator4Trigger: function (op, callback) {
var self = this;
var o = this.options;
_itemsCreator4Trigger(op, callback) {
const self = this;
const o = this.options;
o.itemsCreator(op, function (res) {
if (op.times === 1 && BI.isNotNull(op.keywords)) {
if (op.times === 1 && isNotNull(op.keywords)) {
// 预防trigger内部把当前的storeValue改掉
self.trigger.setValue(BI.deepClone(self.getValue()));
self.trigger.setValue(deepClone(self.getValue()));
}
callback.apply(self, arguments);
});
},
}
_stopEditing: function () {
_stopEditing() {
this.trigger.stopEditing();
this.numberCounter.hideView();
},
}
_defaultState: function () {
_defaultState() {
this._stopEditing();
this.combo.hideView();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.value || (val.value = []);
},
}
_makeMap: function (values) {
return BI.makeObject(values || []);
},
_makeMap(values) {
return makeObject(values || []);
}
_joinKeywords: function (keywords, callback) {
var self = this;
var o = this.options;
_joinKeywords(keywords, callback) {
const self = this;
const o = this.options;
this._assertValue(this.storeValue);
this.requesting = true;
o.itemsCreator({
type: BI.MultiSelectCombo.REQ_GET_ALL_DATA,
keywords: keywords,
}, function (ob) {
var values = BI.map(ob.items, "value");
o.itemsCreator(
{
type: MultiSelectCombo.REQ_GET_ALL_DATA,
keywords,
},
ob => {
const values = map(ob.items, "value");
digest(values);
});
}
);
function digest(items) {
var selectedMap = self._makeMap(items);
BI.each(keywords, function (i, val) {
if (BI.isNotNull(selectedMap[val])) {
self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val);
const selectedMap = self._makeMap(items);
each(keywords, (i, val) => {
if (isNotNull(selectedMap[val])) {
self.storeValue.type === BI.Selection.Multi
? BI.pushDistinct(self.storeValue.value, val)
: remove(self.storeValue.value, val);
}
});
self._adjust(callback);
}
},
}
_joinAll: function (res, callback) {
var self = this;
var o = this.options;
_joinAll(res, callback) {
const tempMap = this._makeMap(this.storeValue.value);
const self = this;
const o = this.options;
this._assertValue(res);
this.requesting = true;
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v
value: v,
};
}), this.trigger.getKey());
var change = false;
var map = this._makeMap(this.storeValue.value);
BI.each(BI.concat(result.match, result.find), function (i, obj) {
var v = obj.value;
if (BI.isNotNull(map[v])) {
}),
this.trigger.getKey()
);
let change = false;
each(concat(result.match, result.find), (i, obj) => {
const v = obj.value;
if (isNotNull(tempMap[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
delete map[v];
self.storeValue.assist &&
self.storeValue.assist.push(tempMap[v]);
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
this._adjust(callback);
return;
}
o.itemsCreator({
type: BI.MultiSelectCombo.REQ_GET_ALL_DATA,
o.itemsCreator(
{
type: MultiSelectCombo.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKey()],
selectedValues: BI.filter(this.storeValue.value, function (_i, v) {
return !BI.contains(res.value, v);
}),
}, function (ob) {
var items = BI.map(ob.items, "value");
var selectedMap = self._makeMap(self.storeValue.value);
var notSelectedMap = self._makeMap(res.value);
var newItems = [];
BI.each(items, function (i, item) {
if (BI.isNotNull(selectedMap[items[i]])) {
self.storeValue.assist && self.storeValue.assist.push(selectedMap[items[i]]);
selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)),
},
ob => {
const items = map(ob.items, "value");
const selectedMap = self._makeMap(self.storeValue.value);
const notSelectedMap = self._makeMap(res.value);
const newItems = [];
each(items, (i, item) => {
if (isNotNull(selectedMap[items[i]])) {
self.storeValue.assist &&
self.storeValue.assist.push(selectedMap[items[i]]);
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
BI.remove(self.storeValue.assist, item);
if (isNull(notSelectedMap[items[i]])) {
remove(self.storeValue.assist, item);
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
self.storeValue.value = newItems.concat(values(selectedMap));
self._adjust(callback);
});
},
}
);
}
_adjust: function (callback) {
var self = this;
var o = this.options;
_adjust(callback) {
const self = this;
adjust();
callback();
function adjust() {
if (self.wants2Quit === true) {
self._dataChange && self.fireEvent(BI.MultiSelectCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectCombo.EVENT_CONFIRM);
self.wants2Quit = false;
}
self.requesting = false;
}
},
}
_join: function (res, callback) {
var self = this;
var o = this.options;
_join(res, callback) {
const self = this;
this._assertValue(res);
this._assertValue(this.storeValue);
if (this.storeValue.type === res.type) {
var map = this._makeMap(this.storeValue.value);
BI.each(res.value, function (i, v) {
const map = this._makeMap(this.storeValue.value);
each(res.value, (i, v) => {
if (!map[v]) {
BI.pushDistinct(self.storeValue.value, v);
BI.remove(self.storeValue.assist, v);
remove(self.storeValue.assist, v);
map[v] = v;
}
});
var change = false;
BI.each(res.assist, function (i, v) {
if (BI.isNotNull(map[v])) {
let change = false;
each(res.assist, (i, v) => {
if (isNotNull(map[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
self.storeValue.assist &&
self.storeValue.assist.push(map[v]);
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
self._adjust(callback);
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.popup.setStartValue(value);
},
}
_populate: function () {
this.combo.populate.apply(this.combo, arguments);
},
_populate() {
this.combo.populate(...arguments);
}
showView: function () {
showView() {
this.combo.showView();
},
}
hideView: function () {
hideView() {
this.combo.hideView();
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.combo.setValue(this.storeValue);
this.numberCounter.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue);
},
populate: function () {
this._populate.apply(this, arguments);
this.numberCounter.populateSwitcher.apply(this.numberCounter, arguments);
},
});
BI.extend(BI.MultiSelectCombo, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1,
});
}
BI.MultiSelectCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiSelectCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiSelectCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiSelectCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiSelectCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiSelectCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
getValue() {
return deepClone(this.storeValue);
}
BI.shortcut("bi.multi_select_combo", BI.MultiSelectCombo);
populate() {
this._populate(...arguments);
this.numberCounter.populateSwitcher(...arguments);
}
}

536
src/widget/multiselect/multiselect.combo.nobar.js

@ -1,47 +1,95 @@
/**
*
* @class BI.MultiSelectNoBarCombo
* @extends BI.Single
*/
BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectNoBarCombo.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
isKey,
remove,
deepClone,
createWidget,
toPix,
bind,
last,
initial,
nextTick,
Events,
AbsoluteLayout,
VerticalAdaptLayout,
isNotNull,
makeObject,
map,
each,
Func,
concat,
values,
filter,
contains,
isNull, pushDistinct, Selection
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiSelectBar, TriggerIconButton } from "@/case";
import { MultiSelectTrigger } from "./multiselect.trigger";
import { MultiSelectCheckSelectedSwitcher } from "./trigger/switcher.checkselected";
import { MultiSelectNoBarPopupView } from "@/widget/multiselect/multiselect.popup.view.nobar";
@shortcut()
export class MultiSelectNoBarCombo extends Single {
static xtype = "bi.multi_select_no_bar_combo";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_STOP = "EVENT_STOP";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_CONFIRM = "EVENT_CONFIRM";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-combo-no-bar",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height: 24,
});
},
}
_init: function () {
var self = this, o = this.options;
BI.MultiSelectNoBarCombo.superclass._init.apply(this, arguments);
var assertShowValue = function () {
if (BI.isKey(self._startValue)) {
_init() {
const self = this,
o = this.options;
super._init(...arguments);
const triggerBtn = createWidget({
type: TriggerIconButton.xtype,
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button",
});
function assertShowValue() {
if (isKey(self._startValue)) {
if (self.storeValue.type === BI.Selection.All) {
BI.remove(self.storeValue.value, self._startValue);
remove(self.storeValue.value, self._startValue);
self.storeValue.assist = self.storeValue.assist || [];
BI.pushDistinct(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.assist, self._startValue);
} else {
BI.pushDistinct(self.storeValue.value, self._startValue);
BI.remove(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.value, self._startValue);
remove(self.storeValue.assist, self._startValue);
}
}
self.trigger.getSearcher().setState(self.storeValue);
self.numberCounter.setButtonChecked(self.storeValue);
};
}
this.storeValue = {
type: BI.Selection.Multi,
value: BI.deepClone(o.value) || []
type: Selection.Multi,
value: deepClone(o.value) || [],
};
// 标记正在请求数据
this.requesting = false;
this.trigger = BI.createWidget({
type: "bi.multi_select_trigger",
height: BI.toPix(o.height, o.simple ? 1 : 2),
this.trigger = createWidget({
type: MultiSelectTrigger.xtype,
height: toPix(o.height, o.simple ? 1 : 2),
text: o.text,
defaultText: o.defaultText,
masker: {
@ -53,37 +101,39 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
itemFormatter: o.itemFormatter,
itemHeight: o.itemHeight,
value: {
type: BI.Selection.Multi,
value: o.value
}
value: o.value,
},
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_FOCUS, function () {
self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_FOCUS);
this.trigger.on(MultiSelectTrigger.EVENT_FOCUS, () => {
self.fireEvent(MultiSelectNoBarCombo.EVENT_FOCUS);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_BLUR, function () {
self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_BLUR);
this.trigger.on(MultiSelectTrigger.EVENT_BLUR, () => {
self.fireEvent(MultiSelectNoBarCombo.EVENT_BLUR);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () {
this.trigger.on(MultiSelectTrigger.EVENT_START, function () {
self._setStartValue("");
this.getSearcher().setValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () {
this.trigger.on(MultiSelectTrigger.EVENT_STOP, () => {
self._setStartValue("");
self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_STOP);
self.fireEvent(MultiSelectNoBarCombo.EVENT_STOP);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_SEARCHING, function (keywords) {
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
this.trigger.on(
MultiSelectTrigger.EVENT_SEARCHING,
keywords => {
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
self._joinKeywords(keywords, () => {
if (BI.endWith(lastKeyword, BI.BlankSplitChar)) {
self.combo.setValue(self.storeValue);
assertShowValue();
self.combo.populate();
@ -95,121 +145,127 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
self._dataChange = true;
});
}
});
}
);
this.trigger.on(BI.MultiSelectTrigger.EVENT_CHANGE, function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
this.trigger.on(MultiSelectTrigger.EVENT_CHANGE, function (value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
});
} else {
self._join(this.getValue(), function () {
self._join(this.getValue(), () => {
assertShowValue();
});
}
self._dataChange = true;
self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectNoBarCombo.EVENT_CLICK_ITEM);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW, function () {
this.trigger.on(
MultiSelectTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW,
() => {
// counter的值随点击项的改变而改变, 点击counter的时候不需要setValue(counter会请求刷新计数)
// 只需要更新查看面板的selectedValue用以请求已选数据
self.numberCounter.updateSelectedValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectTrigger.EVENT_COUNTER_CLICK, function () {
}
);
this.trigger.on(MultiSelectTrigger.EVENT_COUNTER_CLICK, () => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.combo = BI.createWidget({
type: "bi.combo",
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"),
this.combo = createWidget({
type: Combo.xtype,
cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: false,
container: o.container,
el: this.trigger,
adjustLength: 1,
popup: {
type: "bi.multi_select_no_bar_popup_view",
ref: function () {
type: MultiSelectNoBarPopupView.xtype,
ref() {
self.popup = this;
self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this);
},
listeners: [
{
eventName: BI.MultiSelectPopupView.EVENT_CHANGE,
action: function () {
eventName: MultiSelectNoBarPopupView.EVENT_CHANGE,
action() {
self._dataChange = true;
self.storeValue = this.getValue();
self._adjust(function () {
self._adjust(() => {
assertShowValue();
});
self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_CLICK_ITEM);
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action: function () {
self.fireEvent(
MultiSelectNoBarCombo.EVENT_CLICK_ITEM
);
},
},
{
eventName: MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM,
action() {
self._defaultState();
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CLEAR,
action: function () {
},
},
{
eventName: MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR,
action() {
self._dataChange = true;
self.setValue();
self._defaultState();
}
},
}
],
itemsCreator: o.itemsCreator,
itemHeight: o.itemHeight,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
onLoaded: function () {
BI.nextTick(function () {
onLoaded() {
nextTick(() => {
self.combo.adjustWidth();
self.combo.adjustHeight();
self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView();
});
}
},
},
value: {
type: BI.Selection.Multi,
value: o.value
value: o.value,
},
hideChecker(e) {
return (
triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0
);
},
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 && self.numberCounter.element.find(e.target).length === 0;
}
});
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (!this.isViewVisible()) {
self._dataChange = false; // 标记数据是否发生变化
}
this.setValue(self.storeValue);
BI.nextTick(function () {
nextTick(() => {
self._populate();
});
});
// 当退出的时候如果还在处理请求,则等请求结束后再对外发确定事件
this.wants2Quit = false;
this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () {
this.combo.on(Combo.EVENT_AFTER_HIDEVIEW, () => {
// important:关闭弹出时又可能没有退出编辑状态
self._stopEditing();
if (self.requesting === true) {
self.wants2Quit = true;
} else {
self._dataChange && self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectNoBarCombo.EVENT_CONFIRM);
}
});
var triggerBtn = BI.createWidget({
type: "bi.trigger_icon_button",
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button"
});
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView();
if (self.combo.isViewVisible()) {
self.combo.hideView();
@ -218,8 +274,8 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
}
});
this.numberCounter = BI.createWidget({
type: "bi.multi_select_check_selected_switcher",
this.numberCounter = createWidget({
type: MultiSelectCheckSelectedSwitcher.xtype,
masker: {
offset: {
left: 0,
@ -229,41 +285,54 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
value: {
type: BI.Selection.Multi,
value: o.value
}
value: o.value,
},
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () {
}
);
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
function () {
this.updateSelectedValue(self.storeValue);
});
}
);
this.numberCounter.on(BI.Events.VIEW, function (b) {
BI.nextTick(function () {// 自动调整宽度
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0));
this.numberCounter.on(Events.VIEW, b => {
nextTick(() => {
// 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
});
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () {
BI.nextTick(function () {// 收起时自动调整宽度
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
() => {
nextTick(() => {
// 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
});
}
);
this.trigger.element.click(function (e) {
this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView();
}
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [
{
@ -271,32 +340,36 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
left: 0,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: triggerBtn,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: {
type: "bi.vertical_adapt",
items: [this.numberCounter]
type: VerticalAdaptLayout.xtype,
items: [this.numberCounter],
},
right: o.height,
top: 0,
height: o.height
height: o.height,
}
]
],
});
},
}
_addItem: function (assertShowValue, matched) {
var self = this;
var keyword = this.trigger.getSearcher().getKeyword();
this._join({
_addItem(assertShowValue, matched) {
const self = this;
const keyword = this.trigger.getSearcher().getKeyword();
this._join(
{
type: BI.Selection.Multi,
value: [keyword]
}, function () {
value: [keyword],
},
() => {
// 如果在不选的状态下直接把该值添加进来
if (self.storeValue.type === BI.Selection.Multi) {
BI.pushDistinct(self.storeValue.value, keyword);
@ -307,202 +380,207 @@ BI.MultiSelectNoBarCombo = BI.inherit(BI.Single, {
self.populate();
self._setStartValue("");
self._dataChange = true;
});
},
}
);
}
_itemsCreator4Trigger: function (op, callback) {
var self = this, o = this.options;
_itemsCreator4Trigger(op, callback) {
const self = this,
o = this.options;
o.itemsCreator(op, function (res) {
if (op.times === 1 && BI.isNotNull(op.keywords)) {
if (op.times === 1 && isNotNull(op.keywords)) {
// 预防trigger内部把当前的storeValue改掉
self.trigger.setValue(BI.deepClone(self.storeValue));
self.trigger.setValue(deepClone(self.storeValue));
}
callback.apply(self, arguments);
});
},
}
_stopEditing: function () {
_stopEditing() {
this.trigger.stopEditing();
this.numberCounter.hideView();
},
}
_defaultState: function () {
_defaultState() {
this._stopEditing();
this.combo.hideView();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.value || (val.value = []);
},
}
_makeMap: function (values) {
return BI.makeObject(values || []);
},
_makeMap(values) {
return makeObject(values || []);
}
_joinKeywords: function (keywords, callback) {
var self = this, o = this.options;
_joinKeywords(keywords, callback) {
const self = this,
o = this.options;
this._assertValue(this.storeValue);
this.requesting = true;
o.itemsCreator({
type: BI.MultiSelectNoBarCombo.REQ_GET_ALL_DATA,
keywords: keywords
}, function (ob) {
var values = BI.map(ob.items, "value");
o.itemsCreator(
{
type: MultiSelectNoBarCombo.REQ_GET_ALL_DATA,
keywords,
},
ob => {
const values = map(ob.items, "value");
digest(values);
});
}
);
function digest(items) {
var selectedMap = self._makeMap(items);
BI.each(keywords, function (i, val) {
if (BI.isNotNull(selectedMap[val])) {
self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val);
const selectedMap = self._makeMap(items);
each(keywords, (i, val) => {
if (isNotNull(selectedMap[val])) {
self.storeValue.type === BI.Selection.Multi
? BI.pushDistinct(self.storeValue.value, val)
: remove(self.storeValue.value, val);
}
});
self._adjust(callback);
}
},
}
_joinAll: function (res, callback) {
var self = this, o = this.options;
_joinAll(res, callback) {
const self = this,
o = this.options;
this._assertValue(res);
this.requesting = true;
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v
value: v,
};
}), this.trigger.getKey());
var change = false;
var map = this._makeMap(this.storeValue.value);
BI.each(BI.concat(result.match, result.find), function (i, obj) {
var v = obj.value;
if (BI.isNotNull(map[v])) {
}),
this.trigger.getKey()
);
let change = false;
const tempMap = this._makeMap(this.storeValue.value);
each(concat(result.match, result.find), (i, obj) => {
const v = obj.value;
if (isNotNull(tempMap[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
delete map[v];
self.storeValue.assist &&
self.storeValue.assist.push(tempMap[v]);
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
this._adjust(callback);
return;
}
o.itemsCreator({
type: BI.MultiSelectNoBarCombo.REQ_GET_ALL_DATA,
o.itemsCreator(
{
type: MultiSelectNoBarCombo.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKey()],
selectedValues: BI.filter(this.storeValue.value, function (_i, v) {
return !BI.contains(res.value, v);
}),
}, function (ob) {
var items = BI.map(ob.items, "value");
var selectedMap = self._makeMap(self.storeValue.value);
var notSelectedMap = self._makeMap(res.value);
var newItems = [];
BI.each(items, function (i, item) {
if (BI.isNotNull(selectedMap[items[i]])) {
self.storeValue.assist && self.storeValue.assist.push(selectedMap[items[i]]);
selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)),
},
ob => {
const items = map(ob.items, "value");
const selectedMap = self._makeMap(self.storeValue.value);
const notSelectedMap = self._makeMap(res.value);
const newItems = [];
each(items, (i, item) => {
if (isNotNull(selectedMap[items[i]])) {
self.storeValue.assist &&
self.storeValue.assist.push(selectedMap[items[i]]);
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
BI.remove(self.storeValue.assist, item);
if (isNull(notSelectedMap[items[i]])) {
remove(self.storeValue.assist, item);
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
self.storeValue.value = newItems.concat(values(selectedMap));
self._adjust(callback);
});
},
}
);
}
_adjust: function (callback) {
var self = this, o = this.options;
_adjust(callback) {
const self = this;
adjust();
callback();
function adjust() {
if (self.wants2Quit === true) {
self._dataChange && self.fireEvent(BI.MultiSelectNoBarCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectNoBarCombo.EVENT_CONFIRM);
self.wants2Quit = false;
}
self.requesting = false;
}
},
}
_join: function (res, callback) {
var self = this, o = this.options;
_join(res, callback) {
const self = this;
this._assertValue(res);
this._assertValue(this.storeValue);
if (this.storeValue.type === res.type) {
var map = this._makeMap(this.storeValue.value);
BI.each(res.value, function (i, v) {
const map = this._makeMap(this.storeValue.value);
each(res.value, (i, v) => {
if (!map[v]) {
BI.pushDistinct(self.storeValue.value, v);
BI.remove(self.storeValue.assist, v);
pushDistinct(self.storeValue.value, v);
remove(self.storeValue.assist, v);
map[v] = v;
}
});
var change = false;
BI.each(res.assist, function (i, v) {
if (BI.isNotNull(map[v])) {
let change = false;
each(res.assist, (i, v) => {
if (isNotNull(map[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
self.storeValue.assist &&
self.storeValue.assist.push(map[v]);
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
self._adjust(callback);
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.popup.setStartValue(value);
},
}
_populate: function () {
this.combo.populate.apply(this.combo, arguments);
},
_populate() {
this.combo.populate(...arguments);
}
showView: function () {
showView() {
this.combo.showView();
},
}
hideView: function () {
hideView() {
this.combo.hideView();
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = {
type: BI.Selection.Multi,
value: v || []
value: v || [],
};
this.combo.setValue(this.storeValue);
this.numberCounter.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue.value);
},
populate: function () {
this._populate.apply(this, arguments);
this.numberCounter.populateSwitcher.apply(this.numberCounter, arguments);
}
});
BI.extend(BI.MultiSelectNoBarCombo, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
BI.MultiSelectNoBarCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiSelectNoBarCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiSelectNoBarCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiSelectNoBarCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiSelectNoBarCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiSelectNoBarCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
getValue() {
return deepClone(this.storeValue.value);
}
BI.shortcut("bi.multi_select_no_bar_combo", BI.MultiSelectNoBarCombo);
populate() {
this._populate(...arguments);
this.numberCounter.populateSwitcher(...arguments);
}
}

551
src/widget/multiselect/multiselect.insert.combo.js

@ -1,46 +1,96 @@
/**
*
* @class BI.MultiSelectInsertCombo
* @extends BI.Single
*/
BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectInsertCombo.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
isKey,
remove,
deepClone,
createWidget,
toPix,
bind,
last,
initial,
i18nText,
nextTick,
Events,
AbsoluteLayout,
VerticalAdaptLayout,
isNotNull,
makeObject,
each,
Func,
map,
concat,
values,
filter,
contains,
isNull, endWith, pushDistinct, Selection
} from "@/core";
import { Single, Combo, Msg } from "@/base";
import { MultiSelectInsertTrigger } from "./multiselect.insert.trigger";
import { MultiSelectPopupView } from "./multiselect.popup.view";
import { MultiSelectBar, TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "./trigger/switcher.checkselected";
@shortcut()
export class MultiSelectInsertCombo extends Single {
static xtype = "bi.multi_select_insert_combo";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_STOP = "EVENT_STOP";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-insert-combo",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
height: 24,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
allowEdit: true
allowEdit: true,
});
},
}
_init: function () {
var self = this, o = this.options;
BI.MultiSelectInsertCombo.superclass._init.apply(this, arguments);
var assertShowValue = function () {
if (BI.isKey(self._startValue)) {
if (self.storeValue.type === BI.Selection.All) {
BI.remove(self.storeValue.value, self._startValue);
_init() {
const self = this,
o = this.options;
super._init(...arguments);
const triggerBtn = createWidget({
type: TriggerIconButton.xtype,
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button",
});
function assertShowValue() {
if (isKey(self._startValue)) {
if (self.storeValue.type === Selection.All) {
remove(self.storeValue.value, self._startValue);
self.storeValue.assist = self.storeValue.assist || [];
BI.pushDistinct(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.assist, self._startValue);
} else {
BI.pushDistinct(self.storeValue.value, self._startValue);
BI.remove(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.value, self._startValue);
remove(self.storeValue.assist, self._startValue);
}
}
self.trigger.getSearcher().setState(self.storeValue);
self.numberCounter.setButtonChecked(self.storeValue);
};
this.storeValue = BI.deepClone(o.value) || {};
}
this.storeValue = deepClone(o.value) || {};
// 标记正在请求数据
this.requesting = false;
this.trigger = BI.createWidget({
this.trigger = createWidget({
type: "bi.multi_select_insert_trigger",
allowEdit: o.allowEdit,
height: BI.toPix(o.height, o.simple ? 1 : 2),
height: toPix(o.height, o.simple ? 1 : 2),
text: o.text,
watermark: o.watermark,
defaultText: o.defaultText,
@ -50,41 +100,46 @@ BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
left: 0,
top: 0,
right: 0,
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1
}
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
itemFormatter: o.itemFormatter,
itemHeight: o.itemHeight,
value: this.storeValue,
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_FOCUS, function () {
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_FOCUS);
this.trigger.on(MultiSelectInsertTrigger.EVENT_FOCUS, () => {
self.fireEvent(MultiSelectInsertCombo.EVENT_FOCUS);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_BLUR, function () {
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_BLUR);
this.trigger.on(MultiSelectInsertTrigger.EVENT_BLUR, () => {
self.fireEvent(MultiSelectInsertCombo.EVENT_BLUR);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_START, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_START, function () {
self._setStartValue("");
this.getSearcher().setValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_STOP, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_STOP, () => {
self._setStartValue("");
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_STOP);
self.fireEvent(MultiSelectInsertCombo.EVENT_STOP);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_PAUSE, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_PAUSE, function () {
self._addItem(assertShowValue, true);
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_ADD_ITEM, this.getSearcher().getKeyword());
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_SEARCHING, function (keywords) {
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
self.fireEvent(
MultiSelectInsertCombo.EVENT_ADD_ITEM,
this.getSearcher().getKeyword()
);
});
this.trigger.on(
MultiSelectInsertTrigger.EVENT_SEARCHING,
function (keywords) {
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
self._joinKeywords(keywords, () => {
if (endWith(lastKeyword, BI.BlankSplitChar)) {
self.combo.setValue(self.storeValue);
assertShowValue();
self.combo.populate();
@ -95,123 +150,138 @@ BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
}
self._dataChange = true;
});
this.getSearcher().getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand"));
this.getSearcher().getKeywordsLength() > 2000 &&
Msg.alert(
i18nText("BI-Basic_Prompt"),
i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand")
);
}
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_SEARCHING);
});
self.fireEvent(MultiSelectInsertCombo.EVENT_SEARCHING);
}
);
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_CHANGE, function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
this.trigger.on(
MultiSelectInsertTrigger.EVENT_CHANGE,
function (value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectInsertCombo.EVENT_CLICK_ITEM);
});
} else {
self._join(this.getValue(), function () {
self._join(this.getValue(), () => {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_CLICK_ITEM);
self.fireEvent(MultiSelectInsertCombo.EVENT_CLICK_ITEM);
});
}
self._dataChange = true;
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW, function () {
}
);
this.trigger.on(
MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW,
() => {
// counter的值随点击项的改变而改变, 点击counter的时候不需要setValue(counter会请求刷新计数)
// 只需要更新查看面板的selectedValue用以请求已选数据
self.numberCounter.updateSelectedValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_COUNTER_CLICK, function () {
}
);
this.trigger.on(
MultiSelectInsertTrigger.EVENT_COUNTER_CLICK,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
}
);
this.combo = BI.createWidget({
type: "bi.combo",
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"),
this.combo = createWidget({
type: Combo.xtype,
cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: !o.allowEdit,
el: this.trigger,
adjustLength: 1,
container: o.container,
popup: {
type: "bi.multi_select_popup_view",
ref: function () {
ref() {
self.popup = this;
self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this);
},
listeners: [
{
eventName: BI.MultiSelectPopupView.EVENT_CHANGE,
action: function () {
eventName: MultiSelectPopupView.EVENT_CHANGE,
action() {
self._dataChange = true;
self.storeValue = this.getValue();
self._adjust(function () {
self._adjust(() => {
assertShowValue();
});
self.fireEvent(BI.MultiSelectInsertCombo.EVENT_CLICK_ITEM);
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action: function () {
self.fireEvent(
MultiSelectInsertCombo.EVENT_CLICK_ITEM
);
},
},
{
eventName: MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action() {
self._defaultState();
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CLEAR,
action: function () {
},
},
{
eventName: MultiSelectPopupView.EVENT_CLICK_CLEAR,
action() {
self._dataChange = true;
self.setValue();
self._defaultState();
}
},
}
],
itemsCreator: o.itemsCreator,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
itemHeight: o.itemHeight,
onLoaded: function () {
BI.nextTick(function () {
onLoaded() {
nextTick(() => {
self.combo.adjustWidth();
self.combo.adjustHeight();
self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView();
});
}
},
},
value: o.value,
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
}
hideChecker(e) {
return (
triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0
);
},
});
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (!this.isViewVisible()) {
self._dataChange = false; // 标记数据是否发生变化
}
this.setValue(self.storeValue);
BI.nextTick(function () {
nextTick(() => {
self._populate();
});
});
// 当退出的时候如果还在处理请求,则等请求结束后再对外发确定事件
this.wants2Quit = false;
this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () {
this.combo.on(Combo.EVENT_AFTER_HIDEVIEW, () => {
// important:关闭弹出时又可能没有退出编辑状态
self._stopEditing();
if (self.requesting === true) {
self.wants2Quit = true;
} else {
self._dataChange && self.fireEvent(BI.MultiSelectInsertCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectInsertCombo.EVENT_CONFIRM);
}
});
var triggerBtn = BI.createWidget({
type: "bi.trigger_icon_button",
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button"
});
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView();
if (self.combo.isViewVisible()) {
self.combo.hideView();
@ -220,49 +290,62 @@ BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
}
});
this.numberCounter = BI.createWidget({
type: "bi.multi_select_check_selected_switcher",
this.numberCounter = createWidget({
type: MultiSelectCheckSelectedSwitcher.xtype,
masker: {
offset: {
left: 0,
top: 0,
right: 0,
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1
}
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
value: o.value
itemsCreator: bind(this._itemsCreator4Trigger, this),
value: o.value,
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () {
}
);
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
function () {
this.updateSelectedValue(self.storeValue);
});
}
);
this.numberCounter.on(BI.Events.VIEW, function (b) {
BI.nextTick(function () {// 自动调整宽度
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0));
this.numberCounter.on(Events.VIEW, b => {
nextTick(() => {
// 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
});
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () {
BI.nextTick(function () {// 收起时自动调整宽度
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
() => {
nextTick(() => {
// 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
});
}
);
this.trigger.element.click(function (e) {
this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView();
}
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [
{
@ -270,46 +353,51 @@ BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
left: 0,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: triggerBtn,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: {
type: "bi.vertical_adapt",
items: [this.numberCounter]
type: VerticalAdaptLayout.xtype,
items: [this.numberCounter],
},
right: o.height,
top: 0,
height: o.height,
}
]
],
});
},
}
_itemsCreator4Trigger: function (op, callback) {
var self = this, o = this.options;
_itemsCreator4Trigger(op, callback) {
const self = this,
o = this.options;
o.itemsCreator(op, function (res) {
if (op.times === 1 && BI.isNotNull(op.keywords)) {
if (op.times === 1 && isNotNull(op.keywords)) {
// 预防trigger内部把当前的storeValue改掉
self.trigger.setValue(BI.deepClone(self.getValue()));
self.trigger.setValue(deepClone(self.getValue()));
}
callback.apply(self, arguments);
});
},
}
_addItem: function (assertShowValue) {
var self = this;
var keyword = this.trigger.getSearcher().getKeyword();
this._join({
type: BI.Selection.Multi,
value: [keyword]
}, function () {
_addItem(assertShowValue) {
const self = this;
const keyword = this.trigger.getSearcher().getKeyword();
this._join(
{
type: Selection.Multi,
value: [keyword],
},
() => {
// 如果在不选的状态下直接把该值添加进来
if (self.storeValue.type === BI.Selection.Multi) {
BI.pushDistinct(self.storeValue.value, keyword);
if (self.storeValue.type === Selection.Multi) {
pushDistinct(self.storeValue.value, keyword);
}
self.combo.setValue(self.storeValue);
self._setStartValue(keyword);
@ -317,183 +405,182 @@ BI.MultiSelectInsertCombo = BI.inherit(BI.Single, {
self.populate();
self._setStartValue("");
self._dataChange = true;
});
},
}
);
}
_stopEditing: function () {
_stopEditing() {
this.trigger.stopEditing();
this.numberCounter.hideView();
},
}
_defaultState: function () {
_defaultState() {
this._stopEditing();
this.combo.hideView();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
},
}
_makeMap: function (values) {
return BI.makeObject(values || []);
},
_makeMap(values) {
return makeObject(values || []);
}
_joinKeywords: function (keywords, callback) {
var self = this, o = this.options;
_joinKeywords(keywords, callback) {
const self = this;
this._assertValue(this.storeValue);
this.requesting = true;
digest();
function digest() {
BI.each(keywords, function (i, val) {
self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val);
each(keywords, (i, val) => {
self.storeValue.type === Selection.Multi
? pushDistinct(self.storeValue.value, val)
: remove(self.storeValue.value, val);
});
self._adjust(callback);
}
},
}
_joinAll: function (res, callback) {
var self = this, o = this.options;
_joinAll(res, callback) {
const self = this,
o = this.options;
this._assertValue(res);
this.requesting = true;
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v
value: v,
};
}), this.trigger.getKey());
var change = false;
var map = this._makeMap(this.storeValue.value);
BI.each(BI.concat(result.match, result.find), function (i, obj) {
var v = obj.value;
if (BI.isNotNull(map[v])) {
}),
this.trigger.getKey()
);
let change = false;
const tempMap = this._makeMap(this.storeValue.value);
each(concat(result.match, result.find), (i, obj) => {
const v = obj.value;
if (isNotNull(tempMap[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
delete map[v];
self.storeValue.assist &&
self.storeValue.assist.push(tempMap[v]);
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
this._adjust(callback);
return;
}
o.itemsCreator({
type: BI.MultiSelectInsertCombo.REQ_GET_ALL_DATA,
o.itemsCreator(
{
type: MultiSelectInsertCombo.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKey()],
selectedValues: BI.filter(this.storeValue.value, function (_i, v) {
return !BI.contains(res.value, v);
}),
}, function (ob) {
var items = BI.map(ob.items, "value");
var selectedMap = self._makeMap(self.storeValue.value);
var notSelectedMap = self._makeMap(res.value);
var newItems = [];
BI.each(items, function (i, item) {
if (BI.isNotNull(selectedMap[items[i]])) {
self.storeValue.assist && self.storeValue.assist.push(selectedMap[items[i]]);
selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)),
},
ob => {
const items = map(ob.items, "value");
const selectedMap = self._makeMap(self.storeValue.value);
const notSelectedMap = self._makeMap(res.value);
const newItems = [];
each(items, (i, item) => {
if (isNotNull(selectedMap[items[i]])) {
self.storeValue.assist &&
self.storeValue.assist.push(selectedMap[items[i]]);
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
BI.remove(self.storeValue.assist, item);
if (isNull(notSelectedMap[items[i]])) {
remove(self.storeValue.assist, item);
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
self.storeValue.value = newItems.concat(values(selectedMap));
self._adjust(callback);
});
},
}
);
}
_adjust: function (callback) {
var self = this, o = this.options;
_adjust(callback) {
const self = this;
adjust();
callback();
function adjust() {
if (self.wants2Quit === true) {
self._dataChange && self.fireEvent(BI.MultiSelectInsertCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectInsertCombo.EVENT_CONFIRM);
self.wants2Quit = false;
}
self.requesting = false;
}
},
}
_join: function (res, callback) {
var self = this, o = this.options;
_join(res, callback) {
const self = this;
this._assertValue(res);
this._assertValue(this.storeValue);
if (this.storeValue.type === res.type) {
var map = this._makeMap(this.storeValue.value);
BI.each(res.value, function (i, v) {
const map = this._makeMap(this.storeValue.value);
each(res.value, (i, v) => {
if (!map[v]) {
BI.pushDistinct(self.storeValue.value, v);
pushDistinct(self.storeValue.value, v);
// value更新的时候assist也需要更新
BI.remove(self.storeValue.assist, v);
remove(self.storeValue.assist, v);
map[v] = v;
}
});
var change = false;
BI.each(res.assist, function (i, v) {
if (BI.isNotNull(map[v])) {
let change = false;
each(res.assist, (i, v) => {
if (isNotNull(map[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
self.storeValue.assist &&
self.storeValue.assist.push(map[v]);
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
self._adjust(callback);
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.popup.setStartValue(value);
},
}
_populate: function () {
this.combo.populate.apply(this.combo, arguments);
},
_populate() {
this.combo.populate(...arguments);
}
showView: function () {
showView() {
this.combo.showView();
},
}
hideView: function () {
hideView() {
this.combo.hideView();
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.combo.setValue(this.storeValue);
this.numberCounter.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue);
},
populate: function () {
this._populate.apply(this, arguments);
this.numberCounter.populateSwitcher.apply(this.numberCounter, arguments);
}
});
BI.extend(BI.MultiSelectInsertCombo, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
BI.MultiSelectInsertCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiSelectInsertCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiSelectInsertCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiSelectInsertCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiSelectInsertCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiSelectInsertCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.MultiSelectInsertCombo.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
getValue() {
return deepClone(this.storeValue);
}
BI.shortcut("bi.multi_select_insert_combo", BI.MultiSelectInsertCombo);
populate() {
this._populate(...arguments);
this.numberCounter.populateSwitcher(...arguments);
}
}

543
src/widget/multiselect/multiselect.insert.combo.nobar.js

@ -1,47 +1,92 @@
/**
*
* @class BI.MultiSelectInsertCombo
* @extends BI.Single
*/
BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectInsertNoBarCombo.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
isKey,
remove,
deepClone,
createWidget,
toPix,
bind,
last,
initial,
i18nText,
nextTick,
Events,
AbsoluteLayout,
VerticalAdaptLayout,
isNotNull,
makeObject,
each,
Func,
map,
concat,
values,
filter,
contains,
isNull, endWith, pushDistinct, Selection
} from "@/core";
import { Single, Combo, Msg } from "@/base";
import { MultiSelectInsertTrigger } from "./multiselect.insert.trigger";
import { MultiSelectBar, TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "./trigger/switcher.checkselected";
import { MultiSelectNoBarPopupView } from "./multiselect.popup.view.nobar";
@shortcut()
export class MultiSelectInsertNoBarCombo extends Single {
static xtype = "bi.multi_select_insert_no_bar_combo";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-insert-combo-no-bar",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height: 24,
});
},
}
_init: function () {
var self = this, o = this.options;
BI.MultiSelectInsertNoBarCombo.superclass._init.apply(this, arguments);
var assertShowValue = function () {
if (BI.isKey(self._startValue)) {
if (self.storeValue.type === BI.Selection.All) {
BI.remove(self.storeValue.value, self._startValue);
_init() {
const self = this,
o = this.options;
super._init(...arguments);
const triggerBtn = createWidget({
type: TriggerIconButton.xtype,
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button",
});
function assertShowValue() {
if (isKey(self._startValue)) {
if (self.storeValue.type === Selection.All) {
remove(self.storeValue.value, self._startValue);
self.storeValue.assist = self.storeValue.assist || [];
BI.pushDistinct(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.assist, self._startValue);
} else {
BI.pushDistinct(self.storeValue.value, self._startValue);
BI.remove(self.storeValue.assist, self._startValue);
pushDistinct(self.storeValue.value, self._startValue);
remove(self.storeValue.assist, self._startValue);
}
}
self.trigger.getSearcher().setState(self.storeValue);
self.numberCounter.setButtonChecked(self.storeValue);
};
}
this.storeValue = {
type: BI.Selection.Multi,
value: BI.deepClone(o.value) || []
type: Selection.Multi,
value: deepClone(o.value) || [],
};
// 标记正在请求数据
this.requesting = false;
this.trigger = BI.createWidget({
type: "bi.multi_select_insert_trigger",
height: BI.toPix(o.height, o.simple ? 1 : 2),
this.trigger = createWidget({
type: MultiSelectInsertTrigger.xtype,
height: toPix(o.height, o.simple ? 1 : 2),
text: o.text,
// adapter: this.popup,
masker: {
@ -49,36 +94,41 @@ BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
left: 0,
top: 0,
right: 0,
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1
}
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
itemFormatter: o.itemFormatter,
itemHeight: o.itemHeight,
value: {
type: BI.Selection.Multi,
value: o.value
}
type: Selection.Multi,
value: o.value,
},
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_START, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_START, function () {
self._setStartValue("");
this.getSearcher().setValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_STOP, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_STOP, () => {
self._setStartValue("");
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_PAUSE, function () {
this.trigger.on(MultiSelectInsertTrigger.EVENT_PAUSE, function () {
self._addItem(assertShowValue, true);
self.fireEvent(BI.MultiSelectInsertNoBarCombo.EVENT_ADD_ITEM, this.getSearcher().getKeyword());
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_SEARCHING, function (keywords) {
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
self.fireEvent(
MultiSelectInsertNoBarCombo.EVENT_ADD_ITEM,
this.getSearcher().getKeyword()
);
});
this.trigger.on(
MultiSelectInsertTrigger.EVENT_SEARCHING,
function (keywords) {
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
self._joinKeywords(keywords, () => {
if (endWith(lastKeyword, BI.BlankSplitChar)) {
self.combo.setValue(self.storeValue);
assertShowValue();
self.combo.populate();
@ -89,121 +139,134 @@ BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
}
self._dataChange = true;
});
this.getSearcher().getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand"));
this.getSearcher().getKeywordsLength() > 2000 &&
Msg.alert(
i18nText("BI-Basic_Prompt"),
i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand")
);
}
});
}
);
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_CHANGE, function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
this.trigger.on(
MultiSelectInsertTrigger.EVENT_CHANGE,
function (value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
});
} else {
self._join(this.getValue(), function () {
self._join(this.getValue(), () => {
assertShowValue();
});
}
self._dataChange = true;
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW, function () {
}
);
this.trigger.on(
MultiSelectInsertTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW,
() => {
// counter的值随点击项的改变而改变, 点击counter的时候不需要setValue(counter会请求刷新计数)
// 只需要更新查看面板的selectedValue用以请求已选数据
self.numberCounter.updateSelectedValue(self.storeValue);
});
this.trigger.on(BI.MultiSelectInsertTrigger.EVENT_COUNTER_CLICK, function () {
}
);
this.trigger.on(
MultiSelectInsertTrigger.EVENT_COUNTER_CLICK,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
}
);
this.combo = BI.createWidget({
type: "bi.combo",
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"),
this.combo = createWidget({
type: Combo.xtype,
cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: false,
container: o.container,
el: this.trigger,
adjustLength: 1,
popup: {
type: "bi.multi_select_no_bar_popup_view",
ref: function () {
type: MultiSelectNoBarPopupView.xtype,
ref() {
self.popup = this;
self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this);
},
listeners: [
{
eventName: BI.MultiSelectPopupView.EVENT_CHANGE,
action: function () {
eventName: MultiSelectNoBarPopupView.EVENT_CHANGE,
action() {
self._dataChange = true;
self.storeValue = this.getValue();
self._adjust(function () {
self._adjust(() => {
assertShowValue();
});
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM,
action: function () {
},
},
{
eventName: MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM,
action() {
self._defaultState();
}
}, {
eventName: BI.MultiSelectPopupView.EVENT_CLICK_CLEAR,
action: function () {
},
},
{
eventName: MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR,
action() {
self._dataChange = true;
self.setValue();
self._defaultState();
}
},
}
],
itemsCreator: o.itemsCreator,
itemHeight: o.itemHeight,
valueFormatter: o.valueFormatter,
onLoaded: function () {
BI.nextTick(function () {
onLoaded() {
nextTick(() => {
self.combo.adjustWidth();
self.combo.adjustHeight();
self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView();
});
}
},
},
value: {
type: BI.Selection.Multi,
value: o.value
type: Selection.Multi,
value: o.value,
},
hideChecker(e) {
return (
triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0
);
},
hideChecker: function (e) {
return triggerBtn.element.find(e.target).length === 0 &&
self.numberCounter.element.find(e.target).length === 0;
}
});
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () {
this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (!this.isViewVisible()) {
self._dataChange = false; // 标记数据是否发生变化
}
this.setValue(self.storeValue);
BI.nextTick(function () {
nextTick(() => {
self._populate();
});
});
// 当退出的时候如果还在处理请求,则等请求结束后再对外发确定事件
this.wants2Quit = false;
this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () {
this.combo.on(Combo.EVENT_AFTER_HIDEVIEW, () => {
// important:关闭弹出时又可能没有退出编辑状态
self._stopEditing();
if (self.requesting === true) {
self.wants2Quit = true;
} else {
self._dataChange && self.fireEvent(BI.MultiSelectInsertNoBarCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectInsertNoBarCombo.EVENT_CONFIRM);
}
});
var triggerBtn = BI.createWidget({
type: "bi.trigger_icon_button",
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button"
});
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView();
if (self.combo.isViewVisible()) {
self.combo.hideView();
@ -212,52 +275,65 @@ BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
}
});
this.numberCounter = BI.createWidget({
type: "bi.multi_select_check_selected_switcher",
this.numberCounter = createWidget({
type: MultiSelectCheckSelectedSwitcher.xtype,
masker: {
offset: {
left: 0,
top: 0,
right: 0,
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1
}
bottom: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT + 1,
},
},
valueFormatter: o.valueFormatter,
itemsCreator: BI.bind(this._itemsCreator4Trigger, this),
itemsCreator: bind(this._itemsCreator4Trigger, this),
value: {
type: BI.Selection.Multi,
value: o.value
}
type: Selection.Multi,
value: o.value,
},
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
() => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () {
}
);
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
function () {
this.updateSelectedValue(self.storeValue);
});
}
);
this.numberCounter.on(BI.Events.VIEW, function (b) {
BI.nextTick(function () {// 自动调整宽度
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0));
this.numberCounter.on(Events.VIEW, b => {
nextTick(() => {
// 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
});
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () {
BI.nextTick(function () {// 收起时自动调整宽度
this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
() => {
nextTick(() => {
// 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
});
}
);
this.trigger.element.click(function (e) {
this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView();
}
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [
{
@ -265,46 +341,51 @@ BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
left: 0,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: triggerBtn,
right: 0,
top: 0,
bottom: 0
}, {
bottom: 0,
},
{
el: {
type: "bi.vertical_adapt",
items: [this.numberCounter]
type: VerticalAdaptLayout.xtype,
items: [this.numberCounter],
},
right: o.height,
top: 0,
height: o.height
height: o.height,
}
]
],
});
},
}
_itemsCreator4Trigger: function (op, callback) {
var self = this, o = this.options;
_itemsCreator4Trigger(op, callback) {
const self = this,
o = this.options;
o.itemsCreator(op, function (res) {
if (op.times === 1 && BI.isNotNull(op.keywords)) {
if (op.times === 1 && isNotNull(op.keywords)) {
// 预防trigger内部把当前的storeValue改掉
self.trigger.setValue(BI.deepClone(self.storeValue));
self.trigger.setValue(deepClone(self.storeValue));
}
callback.apply(self, arguments);
});
},
}
_addItem: function (assertShowValue) {
var self = this;
var keyword = this.trigger.getSearcher().getKeyword();
this._join({
type: BI.Selection.Multi,
value: [keyword]
}, function () {
_addItem(assertShowValue) {
const self = this;
const keyword = this.trigger.getSearcher().getKeyword();
this._join(
{
type: Selection.Multi,
value: [keyword],
},
() => {
// 如果在不选的状态下直接把该值添加进来
if (self.storeValue.type === BI.Selection.Multi) {
BI.pushDistinct(self.storeValue.value, keyword);
if (self.storeValue.type === Selection.Multi) {
pushDistinct(self.storeValue.value, keyword);
}
self.combo.setValue(self.storeValue);
self._setStartValue(keyword);
@ -312,179 +393,183 @@ BI.MultiSelectInsertNoBarCombo = BI.inherit(BI.Single, {
self.populate();
self._setStartValue("");
self._dataChange = true;
});
},
}
);
}
_stopEditing: function () {
_stopEditing() {
this.trigger.stopEditing();
this.numberCounter.hideView();
},
}
_defaultState: function () {
_defaultState() {
this._stopEditing();
this.combo.hideView();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
},
}
_makeMap: function (values) {
return BI.makeObject(values || []);
},
_makeMap(values) {
return makeObject(values || []);
}
_joinKeywords: function (keywords, callback) {
var self = this, o = this.options;
_joinKeywords(keywords, callback) {
const self = this;
this._assertValue(this.storeValue);
this.requesting = true;
digest();
function digest() {
BI.each(keywords, function (i, val) {
self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val);
each(keywords, (i, val) => {
self.storeValue.type === Selection.Multi
? pushDistinct(self.storeValue.value, val)
: remove(self.storeValue.value, val);
});
self._adjust(callback);
}
},
}
_joinAll: function (res, callback) {
var self = this, o = this.options;
_joinAll(res, callback) {
const self = this,
o = this.options;
this._assertValue(res);
this.requesting = true;
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v
value: v,
};
}), this.trigger.getKey());
var change = false;
var map = this._makeMap(this.storeValue.value);
BI.each(BI.concat(result.match, result.find), function (i, obj) {
var v = obj.value;
if (BI.isNotNull(map[v])) {
}),
this.trigger.getKey()
);
let change = false;
const tempMap = this._makeMap(this.storeValue.value);
each(concat(result.match, result.find), (i, obj) => {
const v = obj.value;
if (isNotNull(tempMap[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
delete map[v];
self.storeValue.assist &&
self.storeValue.assist.push(tempMap[v]);
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
this._adjust(callback);
return;
}
o.itemsCreator({
type: BI.MultiSelectInsertNoBarCombo.REQ_GET_ALL_DATA,
o.itemsCreator(
{
type: MultiSelectInsertNoBarCombo.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKey()],
selectedValues: BI.filter(this.storeValue.value, function (_i, v) {
return !BI.contains(res.value, v);
}),
}, function (ob) {
var items = BI.map(ob.items, "value");
var selectedMap = self._makeMap(self.storeValue.value);
var notSelectedMap = self._makeMap(res.value);
var newItems = [];
BI.each(items, function (i, item) {
if (BI.isNotNull(selectedMap[items[i]])) {
self.storeValue.assist && self.storeValue.assist.push(selectedMap[items[i]]);
selectedValues: filter(this.storeValue.value, (_i, v) => !contains(res.value, v)),
},
ob => {
const items = map(ob.items, "value");
const selectedMap = self._makeMap(self.storeValue.value);
const notSelectedMap = self._makeMap(res.value);
const newItems = [];
each(items, (i, item) => {
if (isNotNull(selectedMap[items[i]])) {
self.storeValue.assist &&
self.storeValue.assist.push(selectedMap[items[i]]);
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
BI.remove(self.storeValue.assist, item);
if (isNull(notSelectedMap[items[i]])) {
remove(self.storeValue.assist, item);
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
self.storeValue.value = newItems.concat(values(selectedMap));
self._adjust(callback);
});
},
}
);
}
_adjust: function (callback) {
var self = this, o = this.options;
_adjust(callback) {
const self = this;
adjust();
callback();
function adjust() {
if (self.wants2Quit === true) {
self._dataChange && self.fireEvent(BI.MultiSelectInsertNoBarCombo.EVENT_CONFIRM);
self._dataChange &&
self.fireEvent(MultiSelectInsertNoBarCombo.EVENT_CONFIRM);
self.wants2Quit = false;
}
self.requesting = false;
}
},
}
_join: function (res, callback) {
var self = this, o = this.options;
_join(res, callback) {
const self = this;
this._assertValue(res);
this._assertValue(this.storeValue);
if (this.storeValue.type === res.type) {
var map = this._makeMap(this.storeValue.value);
BI.each(res.value, function (i, v) {
const map = this._makeMap(this.storeValue.value);
each(res.value, (i, v) => {
if (!map[v]) {
self.storeValue.value.push(v);
BI.remove(self.storeValue.assist, v);
remove(self.storeValue.assist, v);
map[v] = v;
}
});
var change = false;
BI.each(res.assist, function (i, v) {
if (BI.isNotNull(map[v])) {
let change = false;
each(res.assist, (i, v) => {
if (isNotNull(map[v])) {
change = true;
self.storeValue.assist && self.storeValue.assist.push(map[v]);
self.storeValue.assist &&
self.storeValue.assist.push(map[v]);
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
self._adjust(callback);
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.popup.setStartValue(value);
},
}
_populate: function () {
this.combo.populate.apply(this.combo, arguments);
},
_populate() {
this.combo.populate(...arguments);
}
showView: function () {
showView() {
this.combo.showView();
},
}
hideView: function () {
hideView() {
this.combo.hideView();
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = {
type: BI.Selection.Multi,
value: v || []
type: Selection.Multi,
value: v || [],
};
this.combo.setValue(this.storeValue);
this.numberCounter.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue.value);
},
populate: function () {
this._populate.apply(this, arguments);
this.numberCounter.populateSwitcher.apply(this.numberCounter, arguments);
}
});
BI.extend(BI.MultiSelectInsertNoBarCombo, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
BI.MultiSelectInsertNoBarCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.MultiSelectInsertNoBarCombo.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
getValue() {
return deepClone(this.storeValue.value);
}
BI.shortcut("bi.multi_select_insert_no_bar_combo", BI.MultiSelectInsertNoBarCombo);
populate() {
this._populate(...arguments);
this.numberCounter.populateSwitcher(...arguments);
}
}

190
src/widget/multiselect/multiselect.insert.trigger.js

@ -1,40 +1,55 @@
/**
*
* 复选下拉框
* @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), {
import {
shortcut,
extend,
emptyFn,
createWidget,
Layout,
HTapeLayout,
AbsoluteLayout
} from "@/core";
import { Trigger, Text } from "@/base";
import { MultiSelectInsertSearcher } from "./trigger/searcher.multiselect.insert";
@shortcut()
export class MultiSelectInsertTrigger extends Trigger {
static xtype = "bi.multi_select_insert_trigger";
constants = { height: 14, rgap: 4, lgap: 4 };
static EVENT_TRIGGER_CLICK = "EVENT_TRIGGER_CLICK";
static EVENT_COUNTER_CLICK = "EVENT_COUNTER_CLICK";
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_BEFORE_COUNTER_POPUPVIEW = "EVENT_BEFORE_COUNTER_POPUPVIEW";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-trigger",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
itemHeight: 24,
searcher: {},
switcher: {},
adapter: null,
masker: {},
allowEdit: true
allowEdit: true,
});
},
}
_init: function () {
BI.MultiSelectInsertTrigger.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, o = this.options;
const self = this,
o = this.options;
this.searcher = BI.createWidget(o.searcher, {
type: "bi.multi_select_insert_searcher",
this.searcher = createWidget(o.searcher, {
type: MultiSelectInsertSearcher.xtype,
height: o.height,
text: o.text,
defaultText: o.defaultText,
@ -46,113 +61,106 @@ BI.MultiSelectInsertTrigger = BI.inherit(BI.Trigger, {
popup: {},
adapter: o.adapter,
masker: o.masker,
value: o.value
value: o.value,
});
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_START, function () {
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_START);
this.searcher.on(MultiSelectInsertSearcher.EVENT_START, () => {
self.fireEvent(MultiSelectInsertTrigger.EVENT_START);
});
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_PAUSE, function () {
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_PAUSE);
this.searcher.on(MultiSelectInsertSearcher.EVENT_PAUSE, () => {
self.fireEvent(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(
MultiSelectInsertSearcher.EVENT_SEARCHING,
function () {
self.fireEvent(
MultiSelectInsertTrigger.EVENT_SEARCHING,
arguments
);
}
);
this.searcher.on(MultiSelectInsertSearcher.EVENT_STOP, () => {
self.fireEvent(MultiSelectInsertTrigger.EVENT_STOP);
});
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_CHANGE, arguments);
this.searcher.on(MultiSelectInsertSearcher.EVENT_CHANGE, function () {
self.fireEvent(MultiSelectInsertTrigger.EVENT_CHANGE, arguments);
});
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_BLUR, function () {
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_BLUR);
this.searcher.on(MultiSelectInsertSearcher.EVENT_BLUR, () => {
self.fireEvent(MultiSelectInsertTrigger.EVENT_BLUR);
});
this.searcher.on(BI.MultiSelectInsertSearcher.EVENT_FOCUS, function () {
self.fireEvent(BI.MultiSelectInsertTrigger.EVENT_FOCUS);
this.searcher.on(MultiSelectInsertSearcher.EVENT_FOCUS, () => {
self.fireEvent(MultiSelectInsertTrigger.EVENT_FOCUS);
});
this.wrapNumberCounter = BI.createWidget({
type: "bi.layout"
this.wrapNumberCounter = createWidget({
type: Layout.xtype,
});
this.wrapper = BI.createWidget({
type: "bi.htape",
this.wrapper = createWidget({
type: HTapeLayout.xtype,
element: this,
items: [
{
el: this.searcher,
width: "fill"
}, {
width: "fill",
},
{
el: this.wrapNumberCounter,
width: 0
}, {
el: BI.createWidget(),
width: 24
width: 0,
},
{
el: createWidget(),
width: 24,
}
]
],
});
!o.allowEdit && BI.createWidget({
type: "bi.absolute",
!o.allowEdit &&
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [
{
el: {
type: "bi.text",
title: function () {
type: Text.xtype,
title() {
return self.searcher.getState();
}
},
},
left: 0,
right: 24,
top: 0,
bottom: 0
bottom: 0,
}
]
],
});
},
}
/**
* 重新调整numberCounter的空白占位符
*/
refreshPlaceHolderWidth: function (width) {
refreshPlaceHolderWidth(width) {
this.wrapper.attr("items")[1].width = width;
this.wrapper.resize();
},
}
getSearcher: function () {
getSearcher() {
return this.searcher;
},
}
stopEditing: function () {
stopEditing() {
this.searcher.stopSearch();
},
}
setAdapter: function (adapter) {
setAdapter(adapter) {
this.searcher.setAdapter(adapter);
},
}
setValue: function (ob) {
setValue(ob) {
this.searcher.setValue(ob);
},
}
getKey: function () {
getKey() {
return this.searcher.getKey();
},
}
getValue: function () {
getValue() {
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_FOCUS = "EVENT_FOCUS";
BI.MultiSelectInsertTrigger.EVENT_BLUR = "EVENT_BLUR";
BI.shortcut("bi.multi_select_insert_trigger", BI.MultiSelectInsertTrigger);
}

254
src/widget/multiselect/multiselect.loader.js

@ -1,75 +1,107 @@
/**
* 多选加载数据面板
* Created by guy on 15/11/2.
* @class BI.MultiSelectLoader
* @extends Widget
*/
BI.MultiSelectLoader = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectLoader.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
isKey,
map,
contains,
remove,
Controller,
delay,
isNotNull,
Selection, Direction, LogicFactory, pushDistinct
} from "@/core";
import { SelectList, MultiSelectBar, MultiSelectItem } from "@/case";
import { MultiSelectInnerLoader } from "./loader";
@shortcut()
export class MultiSelectLoader extends Widget {
static xtype = "bi.multi_select_loader";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-loader",
logic: {
dynamic: true
dynamic: true,
},
el: {
height: 400
height: 400,
},
valueFormatter: BI.emptyFn,
itemsCreator: BI.emptyFn,
itemFormatter: BI.emptyFn,
onLoaded: BI.emptyFn,
valueFormatter: emptyFn,
itemsCreator: emptyFn,
itemFormatter: emptyFn,
onLoaded: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
isDefaultInit: false,
});
},
}
_init: function () {
BI.MultiSelectLoader.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, opts = this.options;
var hasNext = false;
const self = this,
opts = this.options;
let hasNext = false;
this.storeValue = opts.value || {};
this._assertValue(this.storeValue);
this.button_group = BI.createWidget({
type: "bi.select_list",
this.button_group = createWidget({
type: SelectList.xtype,
logic: opts.logic,
toolbar: {
type: "bi.multi_select_bar",
type: MultiSelectBar.xtype,
cls: "bi-list-item-active",
height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
iconWrapperWidth: 36
height:
this.options.itemHeight ||
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
iconWrapperWidth: 36,
},
el: BI.extend({
el: extend(
{
onLoaded: opts.onLoaded,
el: {
type: "bi.multi_select_inner_loader",
type: MultiSelectInnerLoader.xtype,
isDefaultInit: opts.isDefaultInit,
}
}, opts.el),
itemsCreator: function (op, callback) {
var startValue = self._startValue;
self.storeValue && (op = BI.extend(op || {}, {
selectedValues: BI.isKey(startValue) && self.storeValue.type === BI.Selection.Multi
? self.storeValue.value.concat(startValue) : self.storeValue.value
},
},
opts.el
),
itemsCreator(op, callback) {
const startValue = self._startValue;
self.storeValue &&
(op = extend(op || {}, {
selectedValues:
isKey(startValue) &&
self.storeValue.type === Selection.Multi
? self.storeValue.value.concat(startValue)
: self.storeValue.value,
}));
opts.itemsCreator(op, function (ob) {
opts.itemsCreator(op, ob => {
hasNext = ob.hasNext;
var firstItems = [];
let firstItems = [];
if (op.times === 1 && self.storeValue) {
var json = BI.map(self.storeValue.value, function (i, v) {
var txt = opts.valueFormatter(v) || v;
const json = map(self.storeValue.value, (i, v) => {
const txt = opts.valueFormatter(v) || v;
return {
text: txt,
value: v,
title: txt,
selected: self.storeValue.type === BI.Selection.Multi,
selected:
self.storeValue.type === Selection.Multi,
};
});
if (BI.isKey(self._startValue) && !BI.contains(self.storeValue.value, self._startValue)) {
var txt = opts.valueFormatter(startValue) || startValue;
if (
isKey(self._startValue) &&
!contains(self.storeValue.value, self._startValue)
) {
const txt =
opts.valueFormatter(startValue) || startValue;
json.unshift({
text: txt,
value: startValue,
@ -79,108 +111,134 @@ BI.MultiSelectLoader = BI.inherit(BI.Widget, {
}
firstItems = self._createItems(json);
}
callback(firstItems.concat(self._createItems(ob.items)), ob.keyword || "");
callback(
firstItems.concat(self._createItems(ob.items)),
ob.keyword || ""
);
if (op.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));
isKey(startValue) &&
(self.storeValue.type === Selection.All
? remove(self.storeValue.value, startValue)
: pushDistinct(
self.storeValue.value,
startValue
));
self.setValue(self.storeValue);
}
(op.times === 1) && self._scrollToTop();
op.times === 1 && self._scrollToTop();
});
},
hasNext: function () {
hasNext() {
return hasNext;
},
value: this.storeValue
value: this.storeValue,
});
BI.createWidget(BI.extend({
element: this
}, BI.LogicFactory.createLogic(BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Top), BI.extend({
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
LogicFactory.createLogicTypeByDirection(
Direction.Top
),
extend(
{
scrolly: true,
vgap: 5
}, opts.logic, {
items: BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Top, this.button_group)
}))));
this.button_group.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
vgap: 5,
},
opts.logic,
{
items: LogicFactory.createLogicItemsByDirection(
Direction.Top,
this.button_group
),
}
)
)
)
);
this.button_group.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.button_group.on(BI.SelectList.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectLoader.EVENT_CHANGE, arguments);
this.button_group.on(SelectList.EVENT_CHANGE, function () {
self.fireEvent(MultiSelectLoader.EVENT_CHANGE, arguments);
});
},
}
_createItems(items) {
const allSelected = this.isAllSelected();
const itemFormatter = this.options.itemFormatter;
_createItems: function (items) {
var allSelected = this.isAllSelected();
var itemFormatter = this.options.itemFormatter;
return BI.map(items, (i, item) => {
return map(items, (i, item) => {
return {
type: "bi.multi_select_item",
type: MultiSelectItem.xtype,
logic: this.options.logic,
cls: "bi-list-item-active",
height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height:
this.options.itemHeight ||
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
selected: allSelected,
iconWrapperWidth: 36,
...item,
...itemFormatter(item),
};
});
},
}
_scrollToTop: function () {
var self = this;
BI.delay(function () {
_scrollToTop() {
const self = this;
delay(() => {
self.button_group.element.scrollTop(0);
}, 30);
},
}
isAllSelected: function () {
isAllSelected() {
return this.button_group.isAllSelected();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
},
}
setStartValue: function (v) {
setStartValue(v) {
this._startValue = v;
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.button_group.setValue(this.storeValue);
},
}
getValue: function () {
getValue() {
return this.button_group.getValue();
},
}
getAllButtons: function () {
getAllButtons() {
return this.button_group.getAllButtons();
},
}
empty: function () {
empty() {
this.button_group.empty();
},
}
populate: function (items) {
// arguments.length为0时对arguments[0]赋值后不同环境对其length的取值不同(nashorn)
if (BI.isNotNull(items)) {
arguments[0] = this._createItems(items);
populate(...args) {
const items = args[0];
if (isNotNull(items)) {
args[0] = this._createItems(items);
}
this.button_group.populate(...args);
}
this.button_group.populate.apply(this.button_group, arguments);
},
resetHeight: function (h) {
resetHeight(h) {
this.button_group.resetHeight(h - 10);
},
}
resetWidth: function (w) {
resetWidth(w) {
this.button_group.resetWidth(w);
}
});
BI.MultiSelectLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_loader", BI.MultiSelectLoader);
}

251
src/widget/multiselect/multiselect.loader.nobar.js

@ -1,185 +1,242 @@
/**
* 多选加载数据面板
* Created by guy on 15/11/2.
* @class BI.MultiSelectNoBarLoader
* @extends Widget
*/
BI.MultiSelectNoBarLoader = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectNoBarLoader.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
isKey,
map,
contains,
remove,
Controller,
VerticalLayout,
delay,
isNotNull,
toPix,
Selection,
pushDistinct
} from "@/core";
import { ButtonGroup, Loader } from "@/base";
import { SelectList, ListPane, MultiSelectItem } from "@/case";
@shortcut()
export class MultiSelectNoBarLoader extends Widget {
static xtype = "bi.multi_select_no_bar_loader";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-loader",
logic: {
dynamic: true
dynamic: true,
},
el: {
height: 400
height: 400,
},
valueFormatter: BI.emptyFn,
itemsCreator: BI.emptyFn,
valueFormatter: emptyFn,
itemsCreator: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
onLoaded: BI.emptyFn,
itemFormatter: BI.emptyFn,
onLoaded: emptyFn,
itemFormatter: emptyFn,
});
},
}
_init: function () {
BI.MultiSelectNoBarLoader.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, opts = this.options;
var hasNext = false;
const self = this,
opts = this.options;
let hasNext = false;
this.storeValue = opts.value || {};
this._assertValue(this.storeValue);
this.button_group = BI.createWidget(BI.extend({
type: "bi.list_pane",
this.button_group = createWidget(
extend(
{
type: ListPane.xtype,
onLoaded: opts.onLoaded,
el: {
type: "bi.loader",
type: Loader.xtype,
isDefaultInit: false,
logic: {
dynamic: true,
scrolly: true
scrolly: true,
},
el: {
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI,
behaviors: {
redmark: function () {
redmark() {
return true;
}
},
layouts: [{
type: "bi.vertical"
}]
}
},
itemsCreator: function (op, callback) {
var startValue = self._startValue;
self.storeValue && (op = BI.extend(op || {}, {
selectedValues: BI.isKey(startValue) && self.storeValue.type === BI.Selection.Multi
? self.storeValue.value.concat(startValue) : self.storeValue.value
layouts: [
{
type: VerticalLayout.xtype,
}
],
},
},
itemsCreator(op, callback) {
const startValue = self._startValue;
self.storeValue &&
(op = extend(op || {}, {
selectedValues:
isKey(startValue) &&
self.storeValue.type === Selection.Multi
? self.storeValue.value.concat(
startValue
)
: self.storeValue.value,
}));
opts.itemsCreator(op, function (ob) {
opts.itemsCreator(op, ob => {
hasNext = ob.hasNext;
var firstItems = [];
let firstItems = [];
if (op.times === 1 && self.storeValue) {
var json = BI.map(self.storeValue.value, function (i, v) {
var txt = opts.valueFormatter(v) || v;
const json = map(
self.storeValue.value,
(i, v) => {
const txt = opts.valueFormatter(v) || v;
return {
text: txt,
value: v,
title: txt,
selected: self.storeValue.type === BI.Selection.Multi
selected:
self.storeValue.type ===
Selection.Multi,
};
});
if (BI.isKey(self._startValue) && !BI.contains(self.storeValue.value, self._startValue)) {
var txt = opts.valueFormatter(startValue) || startValue;
}
);
if (
isKey(self._startValue) &&
!contains(
self.storeValue.value,
self._startValue
)
) {
const txt =
opts.valueFormatter(startValue) ||
startValue;
json.unshift({
text: txt,
value: startValue,
title: txt,
selected: true
selected: true,
});
}
firstItems = self._createItems(json);
}
callback(firstItems.concat(self._createItems(ob.items)), ob.keyword || "");
callback(
firstItems.concat(self._createItems(ob.items)),
ob.keyword || ""
);
if (op.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));
isKey(startValue) &&
(self.storeValue.type === Selection.All
? remove(
self.storeValue.value,
startValue
)
: pushDistinct(
self.storeValue.value,
startValue
));
self.setValue(self.storeValue);
}
(op.times === 1) && self._scrollToTop();
op.times === 1 && self._scrollToTop();
});
},
hasNext: function () {
hasNext() {
return hasNext;
},
value: this.storeValue
}, opts.el));
value: this.storeValue,
},
opts.el
)
);
BI.createWidget({
type: "bi.vertical",
createWidget({
type: VerticalLayout.xtype,
element: this,
items: [this.button_group],
vgap: 5
vgap: 5,
});
this.button_group.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.button_group.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.button_group.on(BI.SelectList.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectNoBarLoader.EVENT_CHANGE, arguments);
this.button_group.on(SelectList.EVENT_CHANGE, function () {
self.fireEvent(MultiSelectNoBarLoader.EVENT_CHANGE, arguments);
});
},
}
_createItems: function (items) {
return BI.map(items, (index, item) => {
_createItems(items) {
return map(items, (index, item) => {
return {
type: "bi.multi_select_item",
type: MultiSelectItem.xtype,
cls: "bi-list-item-active",
logic: this.options.logic,
height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height:
this.options.itemHeight ||
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
iconWrapperWidth: 36,
...item,
...this.options.itemFormatter(item),
};
});
},
}
_scrollToTop: function () {
var self = this;
BI.delay(function () {
_scrollToTop() {
const self = this;
delay(() => {
self.button_group.element.scrollTop(0);
}, 30);
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
},
}
setStartValue: function (v) {
setStartValue(v) {
this._startValue = v;
},
}
setValue: function (v) {
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.button_group.setValue(this.storeValue.value);
},
}
getValue: function () {
getValue() {
return {
type: BI.Selection.Multi,
value: this.button_group.getValue()
type: Selection.Multi,
value: this.button_group.getValue(),
};
},
}
getAllButtons: function () {
getAllButtons() {
return this.button_group.getAllButtons();
},
}
empty: function () {
empty() {
this.button_group.empty();
},
}
populate: function (items) {
if (BI.isNotNull(items)) {
populate(items) {
if (isNotNull(items)) {
arguments[0] = this._createItems(items);
}
this.button_group.populate.apply(this.button_group, arguments);
},
resetHeight: function (h) {
this.button_group.element.css({ "max-height": BI.toPix(h) });
},
resetWidth: function () {
this.button_group.populate(...arguments);
}
resetHeight(h) {
this.button_group.element.css({ "max-height": toPix(h) });
}
});
BI.MultiSelectNoBarLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_no_bar_loader", BI.MultiSelectNoBarLoader);
resetWidth() {
}
}

123
src/widget/multiselect/multiselect.popup.view.js

@ -1,100 +1,113 @@
/**
* 带加载的多选下拉面板
* @class BI.MultiSelectPopupView
* @extends Widget
*/
BI.MultiSelectPopupView = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectPopupView.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
i18nText
} from "@/core";
import { MultiPopupView } from "@/case";
import { MultiSelectLoader } from "./multiselect.loader";
@shortcut()
export class MultiSelectPopupView extends Widget {
static xtype = "bi.multi_select_popup_view";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-popup-view",
maxWidth: "auto",
minWidth: 135,
maxHeight: 400,
valueFormatter: BI.emptyFn,
itemsCreator: BI.emptyFn,
onLoaded: BI.emptyFn,
valueFormatter: emptyFn,
itemsCreator: emptyFn,
onLoaded: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
});
},
}
_init: function () {
BI.MultiSelectPopupView.superclass._init.apply(this, arguments);
var self = this, opts = this.options;
_init() {
super._init(...arguments);
const self = this,
opts = this.options;
this.loader = BI.createWidget({
type: "bi.multi_select_loader",
this.loader = createWidget({
type: MultiSelectLoader.xtype,
itemsCreator: opts.itemsCreator,
itemHeight: opts.itemHeight,
valueFormatter: opts.valueFormatter,
itemFormatter: opts.itemFormatter,
onLoaded: opts.onLoaded,
value: opts.value
value: opts.value,
});
this.popupView = BI.createWidget({
type: "bi.multi_popup_view",
this.popupView = createWidget({
type: MultiPopupView.xtype,
stopPropagation: false,
maxWidth: opts.maxWidth,
minWidth: opts.minWidth,
maxHeight: opts.maxHeight,
element: this,
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")],
buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")],
el: this.loader,
value: opts.value
value: opts.value,
});
this.popupView.on(BI.MultiPopupView.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectPopupView.EVENT_CHANGE);
this.popupView.on(MultiPopupView.EVENT_CHANGE, () => {
self.fireEvent(MultiSelectPopupView.EVENT_CHANGE);
});
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) {
this.popupView.on(
MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON,
index => {
switch (index) {
case 0:
self.fireEvent(BI.MultiSelectPopupView.EVENT_CLICK_CLEAR);
self.fireEvent(MultiSelectPopupView.EVENT_CLICK_CLEAR);
break;
case 1:
self.fireEvent(BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM);
self.fireEvent(
MultiSelectPopupView.EVENT_CLICK_CONFIRM
);
break;
default:
break;
}
});
},
}
);
}
isAllSelected: function () {
isAllSelected() {
return this.loader.isAllSelected();
},
}
setStartValue: function (v) {
setStartValue(v) {
this.loader.setStartValue(v);
},
}
setValue: function (v) {
setValue(v) {
this.popupView.setValue(v);
},
}
getValue: function () {
getValue() {
return this.popupView.getValue();
},
}
populate: function (items) {
this.popupView.populate.apply(this.popupView, arguments);
},
populate(items) {
this.popupView.populate(...arguments);
}
resetHeight: function (h) {
resetHeight(h) {
this.popupView.resetHeight(h);
},
}
resetWidth: function (w) {
resetWidth(w) {
this.popupView.resetWidth(w);
},
}
setDirection: function (direction, position) {
setDirection(direction, position) {
this.popupView.setDirection(direction, position);
},
});
BI.MultiSelectPopupView.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiSelectPopupView.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
BI.MultiSelectPopupView.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
BI.shortcut("bi.multi_select_popup_view", BI.MultiSelectPopupView);
}
}

117
src/widget/multiselect/multiselect.popup.view.nobar.js

@ -1,96 +1,109 @@
/**
* 带加载的多选下拉面板
* @class BI.MultiSelectPopupView
* @extends Widget
*/
BI.MultiSelectNoBarPopupView = BI.inherit(BI.Widget, {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
i18nText
} from "@/core";
import { MultiPopupView } from "@/case";
import { MultiSelectNoBarLoader } from "./multiselect.loader.nobar";
_defaultConfig: function () {
return BI.extend(BI.MultiSelectNoBarPopupView.superclass._defaultConfig.apply(this, arguments), {
@shortcut()
export class MultiSelectNoBarPopupView extends Widget {
static xtype = "bi.multi_select_no_bar_popup_view";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-popup-view",
maxWidth: "auto",
minWidth: 135,
maxHeight: 400,
valueFormatter: BI.emptyFn,
itemsCreator: BI.emptyFn,
valueFormatter: emptyFn,
itemsCreator: emptyFn,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
onLoaded: BI.emptyFn
onLoaded: emptyFn,
});
},
}
_init: function () {
BI.MultiSelectNoBarPopupView.superclass._init.apply(this, arguments);
var self = this, opts = this.options;
_init() {
super._init(...arguments);
const self = this,
opts = this.options;
this.loader = BI.createWidget({
type: "bi.multi_select_no_bar_loader",
this.loader = createWidget({
type: MultiSelectNoBarLoader.xtype,
itemsCreator: opts.itemsCreator,
itemHeight: opts.itemHeight,
valueFormatter: opts.valueFormatter,
itemFormatter: opts.itemFormatter,
onLoaded: opts.onLoaded,
value: opts.value
value: opts.value,
});
this.popupView = BI.createWidget({
type: "bi.multi_popup_view",
this.popupView = createWidget({
type: MultiPopupView.xtype,
stopPropagation: false,
maxWidth: opts.maxWidth,
minWidth: opts.minWidth,
maxHeight: opts.maxHeight,
element: this,
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")],
buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")],
el: this.loader,
value: opts.value
value: opts.value,
});
this.popupView.on(BI.MultiPopupView.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CHANGE);
this.popupView.on(MultiPopupView.EVENT_CHANGE, () => {
self.fireEvent(MultiSelectNoBarPopupView.EVENT_CHANGE);
});
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) {
this.popupView.on(
MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON,
index => {
switch (index) {
case 0:
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR);
self.fireEvent(
MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR
);
break;
case 1:
self.fireEvent(BI.MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM);
self.fireEvent(
MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM
);
break;
}
});
},
}
);
}
setStartValue: function (v) {
setStartValue(v) {
this.loader.setStartValue(v);
},
}
setValue: function (v) {
setValue(v) {
this.popupView.setValue(v);
},
}
getValue: function () {
getValue() {
return this.popupView.getValue();
},
}
populate: function (items) {
this.popupView.populate.apply(this.popupView, arguments);
},
populate(items) {
this.popupView.populate(...arguments);
}
resetHeight: function (h) {
resetHeight(h) {
this.popupView.resetHeight(h);
},
}
resetWidth: function (w) {
resetWidth(w) {
this.popupView.resetWidth(w);
},
}
setDirection: function (direction, position) {
setDirection(direction, position) {
this.popupView.setDirection(direction, position);
},
});
BI.MultiSelectNoBarPopupView.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiSelectNoBarPopupView.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
BI.MultiSelectNoBarPopupView.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
BI.shortcut("bi.multi_select_no_bar_popup_view", BI.MultiSelectNoBarPopupView);
}
}

2
src/widget/multiselect/multiselect.trigger.js

@ -9,7 +9,7 @@ import {
AbsoluteLayout
} from "@/core";
import { Trigger, Text } from "@/base";
import { MultiSelectSearcher } from "trigger/searcher.multiselect";
import { MultiSelectSearcher } from "./trigger/searcher.multiselect";
@shortcut()
export class MultiSelectTrigger extends Trigger {

134
src/widget/multiselect/search/multiselect.search.insert.pane.js

@ -1,99 +1,109 @@
/**
*
* 在搜索框中输入文本弹出的面板
* @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), {
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
i18nText,
Controller, VerticalFillLayout
} from "@/core";
import { Label } from "@/base";
import { MultiSelectSearchLoader } from "./multiselect.search.loader";
@shortcut()
export class MultiSelectSearchInsertPane extends Widget {
static xtype = "bi.multi_select_search_insert_pane";
constants = { height: 24, lgap: 10, tgap: 5 };
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-search-pane bi-card",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
keywordGetter: BI.emptyFn,
itemHeight: 24
itemsCreator: emptyFn,
valueFormatter: emptyFn,
keywordGetter: emptyFn,
itemHeight: 24,
});
},
}
_init: function () {
BI.MultiSelectSearchInsertPane.superclass._init.apply(this, arguments);
var self = this, o = this.options;
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.addNotMatchTip = BI.createWidget({
type: "bi.label",
text: BI.i18nText("BI-Basic_Press_Enter_To_Add_Text", ""),
this.addNotMatchTip = createWidget({
type: Label.xtype,
text: i18nText("BI-Basic_Press_Enter_To_Add_Text", ""),
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
cls: "bi-keyword-red-mark",
hgap: 5,
});
this.loader = BI.createWidget({
type: "bi.multi_select_search_loader",
this.loader = createWidget({
type: MultiSelectSearchLoader.xtype,
keywordGetter: o.keywordGetter,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
itemsCreator: function (op, callback) {
o.itemsCreator.apply(self, [op, function (res) {
itemsCreator(op, callback) {
o.itemsCreator.apply(self, [
op,
function (res) {
callback(res);
self.setKeyword(o.keywordGetter());
}]);
}
]);
},
itemHeight: o.itemHeight,
value: o.value
value: o.value,
});
this.loader.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.loader.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.resizer = BI.createWidget({
type: "bi.vertical_fill",
this.resizer = createWidget({
type: VerticalFillLayout.xtype,
rowSize: ["", "fill"],
element: this,
items: [{
items: [
{
el: this.addNotMatchTip,
}, {
},
{
el: this.loader,
}],
}
],
});
},
}
setKeyword: function (keyword) {
this.addNotMatchTip.setText(BI.i18nText("BI-Basic_Press_Enter_To_Add_Text", keyword));
},
setKeyword(keyword) {
this.addNotMatchTip.setText(
i18nText("BI-Basic_Press_Enter_To_Add_Text", keyword)
);
}
isAllSelected: function () {
isAllSelected() {
return this.loader.isAllSelected();
},
}
hasMatched: function () {
hasMatched() {
return false;
},
}
setValue: function (v) {
setValue(v) {
this.loader.setValue(v);
},
}
getValue: function () {
getValue() {
return this.loader.getValue();
},
}
empty: function () {
empty() {
this.loader.empty();
},
populate: function (items) {
this.loader.populate.apply(this.loader, arguments);
}
});
BI.MultiSelectSearchInsertPane.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_search_insert_pane", BI.MultiSelectSearchInsertPane);
populate(items) {
this.loader.populate(...arguments);
}
}

203
src/widget/multiselect/search/multiselect.search.loader.js

@ -1,136 +1,160 @@
/**
* 多选加载数据搜索loader面板
* Created by guy on 15/11/4.
* @class BI.MultiSelectSearchLoader
* @extends Widget
*/
BI.MultiSelectSearchLoader = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectSearchLoader.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
Widget,
extend,
emptyFn,
deepClone,
createWidget,
i18nText,
Controller,
VerticalLayout,
map,
isKey,
Func
} from "@/core";
import { ButtonGroup, Loader } from "@/base";
import { SelectList, MultiSelectBar, MultiSelectItem } from "@/case";
@shortcut()
export class MultiSelectSearchLoader extends Widget {
static xtype = "bi.multi_select_search_loader";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-search-loader",
itemsCreator: BI.emptyFn,
keywordGetter: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemFormatter: BI.emptyFn,
itemHeight: 24
itemsCreator: emptyFn,
keywordGetter: emptyFn,
valueFormatter: emptyFn,
itemFormatter: emptyFn,
itemHeight: 24,
});
},
}
_init: function () {
BI.MultiSelectSearchLoader.superclass._init.apply(this, arguments);
_init() {
super._init(...arguments);
var self = this, opts = this.options;
var hasNext = false;
this.storeValue = BI.deepClone(opts.value);
this.button_group = BI.createWidget({
type: "bi.select_list",
const self = this,
opts = this.options;
let hasNext = false;
this.storeValue = deepClone(opts.value);
this.button_group = createWidget({
type: SelectList.xtype,
toolbar: {
type: "bi.multi_select_bar",
type: MultiSelectBar.xtype,
cls: "bi-list-item-active",
iconWrapperWidth: 36
iconWrapperWidth: 36,
},
element: this,
logic: {
dynamic: false
dynamic: false,
},
value: opts.value,
el: {
tipText: BI.i18nText("BI-No_Select"),
tipText: i18nText("BI-No_Select"),
el: {
type: "bi.loader",
type: Loader.xtype,
isDefaultInit: false,
logic: {
dynamic: true,
scrolly: true
scrolly: true,
},
el: {
chooseType: BI.ButtonGroup.CHOOSE_TYPE_MULTI,
chooseType: ButtonGroup.CHOOSE_TYPE_MULTI,
behaviors: {
redmark: function () {
redmark() {
return true;
}
},
},
layouts: [
{
type: "bi.vertical"
}
]
}
type: VerticalLayout.xtype,
}
],
},
itemsCreator: function (op, callback) {
self.storeValue && (op = BI.extend(op || {}, {
selectedValues: self.storeValue.value
},
},
itemsCreator(op, callback) {
self.storeValue &&
(op = extend(op || {}, {
selectedValues: self.storeValue.value,
}));
opts.itemsCreator(op, function (ob) {
var keyword = ob.keyword = opts.keywordGetter();
opts.itemsCreator(op, ob => {
const keyword = (ob.keyword = opts.keywordGetter());
hasNext = ob.hasNext;
var firstItems = [];
let firstItems = [];
if (op.times === 1 && self.storeValue) {
var json = self._filterValues(self.storeValue);
const json = self._filterValues(self.storeValue);
firstItems = self._createItems(json);
}
var context = {
const context = {
tipText: ob.tipText,
};
callback(firstItems.concat(self._createItems(ob.items)), keyword, context);
callback(
firstItems.concat(self._createItems(ob.items)),
keyword,
context
);
if (op.times === 1 && self.storeValue) {
self.setValue(self.storeValue);
}
});
},
hasNext: function () {
hasNext() {
return hasNext;
}
},
});
this.button_group.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.button_group.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.button_group.on(BI.SelectList.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectSearchLoader.EVENT_CHANGE, arguments);
this.button_group.on(SelectList.EVENT_CHANGE, function () {
self.fireEvent(MultiSelectSearchLoader.EVENT_CHANGE, arguments);
});
},
}
_createItems: function (items) {
var allSelected = this.isAllSelected();
var itemFormatter = this.options.itemFormatter;
_createItems(items) {
const allSelected = this.isAllSelected();
const itemFormatter = this.options.itemFormatter;
return BI.map(items, (index, item) => {
return map(items, (index, item) => {
return {
type: "bi.multi_select_item",
type: MultiSelectItem.xtype,
logic: {
dynamic: false
dynamic: false,
},
height: this.options.itemHeight || BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
height:
this.options.itemHeight ||
BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
selected: allSelected,
cls: "bi-list-item-active",
iconWrapperWidth: 36,
...item,
...itemFormatter(item)
...itemFormatter(item),
};
});
},
}
isAllSelected: function () {
isAllSelected() {
return this.button_group.isAllSelected();
},
}
_filterValues: function (src) {
var o = this.options;
var keyword = o.keywordGetter();
var values = BI.deepClone(src.value) || [];
var newValues = BI.map(values, function (i, v) {
_filterValues(src) {
const o = this.options;
const keyword = o.keywordGetter();
let values = deepClone(src.value) || [];
const newValues = map(values, (i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v,
};
});
if (BI.isKey(keyword)) {
var search = BI.Func.getSearchResult(newValues, keyword);
if (isKey(keyword)) {
const search = Func.getSearchResult(newValues, keyword);
values = search.match.concat(search.find);
}
return BI.map(values, function (i, v) {
return map(values, (i, v) => {
return {
text: v.text,
title: v.text,
@ -139,38 +163,35 @@ BI.MultiSelectSearchLoader = BI.inherit(BI.Widget, {
...o.itemFormatter(v),
};
});
},
}
setValue: function (v) {
setValue(v) {
// 暂存的值一定是新的值,不然v改掉后,storeValue也跟着改了
this.storeValue = BI.deepClone(v);
this.storeValue = deepClone(v);
this.button_group.setValue(v);
},
}
getValue: function () {
getValue() {
return this.button_group.getValue();
},
}
getAllButtons: function () {
getAllButtons() {
return this.button_group.getAllButtons();
},
}
empty: function () {
empty() {
this.button_group.empty();
},
}
populate: function (items) {
this.button_group.populate.apply(this.button_group, arguments);
},
populate(items) {
this.button_group.populate(...arguments);
}
resetHeight: function (h) {
resetHeight(h) {
this.button_group.resetHeight(h);
},
}
resetWidth: function (w) {
resetWidth(w) {
this.button_group.resetWidth(w);
}
});
BI.MultiSelectSearchLoader.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_search_loader", BI.MultiSelectSearchLoader);
}

108
src/widget/multiselect/search/multiselect.search.pane.js

@ -1,86 +1,92 @@
/**
*
* 在搜索框中输入文本弹出的面板
* @class BI.MultiSelectSearchPane
* @extends Widget
*/
import {
shortcut,
Widget,
extend,
emptyFn,
createWidget,
Controller,
AbsoluteLayout
} from "@/core";
import { MultiSelectSearchLoader } from "./multiselect.search.loader";
BI.MultiSelectSearchPane = BI.inherit(BI.Widget, {
@shortcut()
export class MultiSelectSearchPane extends Widget {
static xtype = "bi.multi_select_search_pane";
constants: {
height: 24,
lgap: 10,
tgap: 5
},
constants = { height: 24, lgap: 10, tgap: 5 };
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig: function () {
return BI.extend(BI.MultiSelectSearchPane.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-search-pane bi-card",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
keywordGetter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
keywordGetter: emptyFn,
itemHeight: 24,
});
},
}
_init: function () {
BI.MultiSelectSearchPane.superclass._init.apply(this, arguments);
var self = this, o = this.options;
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.loader = BI.createWidget({
type: "bi.multi_select_search_loader",
this.loader = createWidget({
type: MultiSelectSearchLoader.xtype,
keywordGetter: o.keywordGetter,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
itemsCreator: function (op, callback) {
o.itemsCreator.apply(self, [op, function (res) {
itemsCreator(op, callback) {
o.itemsCreator.apply(self, [
op,
function (res) {
callback(res);
}]);
}
]);
},
itemHeight: o.itemHeight,
value: o.value
value: o.value,
});
this.loader.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.loader.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.resizer = BI.createWidget({
type: "bi.absolute",
this.resizer = createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [{
items: [
{
el: this.loader,
left: 0,
right: 0,
bottom: 0,
top: 0,
}],
}
],
});
},
}
isAllSelected: function () {
isAllSelected() {
return this.loader.isAllSelected();
},
}
hasMatched: function () {
},
hasMatched() {
}
setValue: function (v) {
setValue(v) {
this.loader.setValue(v);
},
}
getValue: function () {
getValue() {
return this.loader.getValue();
},
}
empty: function () {
empty() {
this.loader.empty();
},
populate: function (items) {
this.loader.populate.apply(this.loader, arguments);
}
});
BI.MultiSelectSearchPane.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_search_pane", BI.MultiSelectSearchPane);
populate(items) {
this.loader.populate(...arguments);
}
}

10
src/widget/multiselect/trigger/button.checkselected.js

@ -7,7 +7,8 @@ import {
i18nText,
isNotNull,
isNotEmptyString,
nextTick
nextTick,
Selection
} from "@/core";
import { Single, TextButton } from "@/base";
import { MultiSelectCombo } from "../multiselect.combo";
@ -67,13 +68,13 @@ export class MultiSelectCheckSelectedButton extends Single {
_populate(ob) {
const self = this,
o = this.options;
if (ob.type === BI.Selection.All) {
if (ob.type === Selection.All) {
o.itemsCreator(
{
type: MultiSelectCombo.REQ_GET_DATA_LENGTH,
},
res => {
if (self.options.value.type !== BI.Selection.All) {
if (self.options.value.type !== Selection.All) {
return;
}
if (isNotEmptyString(res.count)) {
@ -118,5 +119,6 @@ export class MultiSelectCheckSelectedButton extends Single {
this._populate(this._assertValue(this.options.value));
}
getValue() {}
getValue() {
}
}

5
src/widget/multiselect/trigger/editor.multiselect.js

@ -9,6 +9,7 @@ import {
isEmptyArray
} from "@/core";
import { StateEditor } from "@/case";
import { SelectPatchEditor } from "./editor/editor.patch";
@shortcut()
export class MultiSelectEditor extends Widget {
@ -31,7 +32,7 @@ export class MultiSelectEditor extends Widget {
const self = this,
o = this.options;
this.editor = createWidget(o.el, {
type: "bi.select_patch_editor",
type: SelectPatchEditor.xtype,
element: this,
height: o.height,
watermark: o.watermark,
@ -105,8 +106,6 @@ export class MultiSelectEditor extends Widget {
return isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
}
populate(items) {}
setWaterMark(v) {
this.editor.setWaterMark(v);
}

260
src/widget/multiselect/trigger/editor/editor.patch.js

@ -1,23 +1,38 @@
/**
* @author windy
* @version 2.0
* Created by windy on 2021/5/18
*/
BI.SelectPatchEditor = BI.inherit(BI.Widget, {
props: {
baseCls: "bi-patch-select-editor",
height: 24,
},
render: function () {
var self = this, o = this.options;
var debounceInputChange = BI.debounce(BI.bind(this._dealChange, this), 300);
return BI.extend({
type: "bi.state_editor",
ref: function (_ref) {
import {
shortcut,
Widget,
debounce,
bind,
extend,
Controller,
contains,
isKey,
Events,
trim, replaceAll
} from "@/core";
import { Editor, TextAreaEditor } from "@/base";
import { StateEditor } from "@/case";
@shortcut()
export class SelectPatchEditor extends Widget {
static xtype = "bi.select_patch_editor";
props = { baseCls: "bi-patch-select-editor", height: 24 };
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
render() {
const self = this,
o = this.options;
const debounceInputChange = debounce(bind(this._dealChange, this), 300);
return extend(
{
type: StateEditor.xtype,
ref(_ref) {
self.editor = _ref;
},
hgap: o.hgap,
@ -35,180 +50,199 @@ BI.SelectPatchEditor = BI.inherit(BI.Widget, {
tipType: o.tipType,
warningTitle: o.warningTitle,
el: {
type: 'bi.textarea_editor',
type: TextAreaEditor.xtype,
scrolly: false,
validationChecker: function () {
validationChecker() {
return true;
},
throttle: true,
},
listeners: [{
eventName: BI.Controller.EVENT_CHANGE,
action: function (type, v) {
if (BI.contains(v, "\n")) {
listeners: [
{
eventName: Controller.EVENT_CHANGE,
action(type, v) {
if (contains(v, "\n")) {
self._dealChange(type, v);
} else {
debounceInputChange(type, v);
}
},
}, {
eventName: BI.Editor.EVENT_KEY_DOWN,
action: function (keyCode) {
},
{
eventName: Editor.EVENT_KEY_DOWN,
action(keyCode) {
if (keyCode === BI.KeyCode.ENTER) {
self._clearSplitValue();
}
},
}, {
eventName: BI.Editor.EVENT_FOCUS,
action: function () {
self.fireEvent(BI.SelectPatchEditor.EVENT_FOCUS, arguments);
},
}, {
eventName: BI.Editor.EVENT_BLUR,
action: function () {
{
eventName: Editor.EVENT_FOCUS,
action() {
self.fireEvent(
SelectPatchEditor.EVENT_FOCUS,
arguments
);
},
},
{
eventName: Editor.EVENT_BLUR,
action() {
self._start = false;
self.fireEvent(BI.SelectPatchEditor.EVENT_BLUR, arguments);
self.fireEvent(
SelectPatchEditor.EVENT_BLUR,
arguments
);
},
}],
}, o.el);
}
],
},
o.el
);
}
_clearSplitValue: function () {
_clearSplitValue() {
this.editor.setValue("");
},
}
_dealChange: function (type, v) {
var value = "";
_dealChange(type, v) {
let value = "";
if (v !== this.editor.getValue()) {
return;
}
if (BI.isKey(v)) {
if (isKey(v)) {
value = this._formatText(v);
}
if (type === BI.Events.CHANGE) {
if (type === Events.CHANGE) {
this._setValue(value);
if (this._trimValue(value) !== "") {
if (!this._start || !BI.isKey(this._lastValue) || (this._pause === true && this._trimValue(this._lastValue) !== this._trimValue(value))) {
if (
!this._start ||
!isKey(this._lastValue) ||
(this._pause === true &&
this._trimValue(this._lastValue) !==
this._trimValue(value))
) {
this._start = true;
this._pause = false;
this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.STARTEDIT, this.getValue(), this);
this.fireEvent(
Controller.EVENT_CHANGE,
Events.STARTEDIT,
this.getValue(),
this
);
}
}
if (this._trimValue(this._lastValue) !== this._trimValue(value)) {
this.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.fireEvent(Controller.EVENT_CHANGE, arguments);
}
if (BI.endWith(value, BI.BlankSplitChar)) {
this._pause = true;
this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.PAUSE, "", this);
this.fireEvent(Controller.EVENT_CHANGE, Events.PAUSE, "", this);
}
}
if (type === BI.Events.EMPTY || type === BI.Events.STOPEDIT) {
this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.EMPTY);
if (type === Events.EMPTY || type === Events.STOPEDIT) {
this.fireEvent(Controller.EVENT_CHANGE, Events.EMPTY);
}
this._lastValue = value;
},
}
_trimValue: function (v) {
return BI.trim(BI.replaceAll(v || "", BI.BlankSplitChar, ""));
},
_trimValue(v) {
return trim(replaceAll(v || "", BI.BlankSplitChar, ""));
}
_formatText: function (v) {
return BI.replaceAll(v || "", "\n", BI.BlankSplitChar);
},
_formatText(v) {
return replaceAll(v || "", "\n", BI.BlankSplitChar);
}
setWaterMark: function (v) {
setWaterMark(v) {
this.editor.setWaterMark(v);
},
}
doRedMark: function () {
this.editor.doRedMark.apply(this.editor, arguments);
},
doRedMark() {
this.editor.doRedMark(...arguments);
}
unRedMark: function () {
this.editor.unRedMark.apply(this.editor, arguments);
},
unRedMark() {
this.editor.unRedMark(...arguments);
}
doHighLight: function () {
this.editor.doHighLight.apply(this.editor, arguments);
},
doHighLight() {
this.editor.doHighLight(...arguments);
}
unHighLight: function () {
this.text.unHighLight.apply(this.text, arguments);
},
unHighLight() {
this.text.unHighLight(...arguments);
}
focus: function () {
focus() {
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
},
}
_setValue: function (v) {
_setValue(v) {
this.editor.setValue(this._formatText(v));
},
}
_showInput: function () {
_showInput() {
this.editor.visible();
this.text.invisible();
},
}
_showHint: function () {
_showHint() {
this.editor.invisible();
this.text.visible();
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
setErrorText: function (text) {
setErrorText(text) {
this.editor.setErrorText(text);
},
}
getErrorText: function () {
getErrorText() {
return this.editor.getErrorText();
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (v) {
setValue(v) {
this._setValue(v);
this._lastValue = this._trimValue(v);
},
}
getValue: function () {
return BI.trim(this.editor.getValue());
},
getValue() {
return trim(this.editor.getValue());
}
getState: function () {
getState() {
return this.editor.getState();
},
}
setState: function (v) {
setState(v) {
this.editor.setState(v);
},
}
setTipType: function (v) {
setTipType(v) {
this.editor.setTipType(v);
},
}
getText: function () {
getText() {
return this.editor.getText();
},
});
BI.SelectPatchEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.SelectPatchEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.SelectPatchEditor.EVENT_BLUR = "EVENT_BLUR";
BI.shortcut("bi.select_patch_editor", BI.SelectPatchEditor);
}
}

249
src/widget/multiselect/trigger/searcher.multiselect.insert.js

@ -1,161 +1,196 @@
/**
* 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), {
import {
shortcut,
Widget,
extend,
emptyFn,
i18nText,
createWidget,
isNotNull,
isEmptyArray,
size,
each
} from "@/core";
import { MultiSelectEditor } from "./editor.multiselect";
import { Searcher } from "@/base";
import { MultiSelectSearchInsertPane } from "../search/multiselect.search.insert.pane";
@shortcut()
export class MultiSelectInsertSearcher extends Widget {
static xtype = "bi.multi_select_insert_searcher";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
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_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-searcher",
itemsCreator: BI.emptyFn,
itemsCreator: emptyFn,
itemHeight: 24,
el: {},
popup: {},
valueFormatter: BI.emptyFn,
valueFormatter: emptyFn,
adapter: null,
masker: {},
watermark: BI.i18nText("BI-Basic_Search_And_Patch_Paste"),
watermark: i18nText("BI-Basic_Search_And_Patch_Paste"),
});
},
}
_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",
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.editor = createWidget(o.el, {
type: MultiSelectEditor.xtype,
watermark: o.watermark,
height: o.height,
text: o.text,
defaultText: o.defaultText,
listeners: [
{
eventName: BI.MultiSelectEditor.EVENT_FOCUS,
action: function () {
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_FOCUS);
}
}, {
eventName: BI.MultiSelectEditor.EVENT_BLUR,
action: function () {
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_BLUR);
}
eventName: MultiSelectEditor.EVENT_FOCUS,
action() {
self.fireEvent(MultiSelectInsertSearcher.EVENT_FOCUS);
},
},
{
eventName: MultiSelectEditor.EVENT_BLUR,
action() {
self.fireEvent(MultiSelectInsertSearcher.EVENT_BLUR);
},
}
]
],
});
this.searcher = BI.createWidget({
type: "bi.searcher",
this.searcher = createWidget({
type: Searcher.xtype,
element: this,
height: o.height,
isAutoSearch: false,
isAutoSync: false,
onSearch: function (op, callback) {
onSearch(op, callback) {
callback();
},
el: this.editor,
popup: BI.extend({
type: "bi.multi_select_search_insert_pane",
popup: extend(
{
type: MultiSelectSearchInsertPane.xtype,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
keywordGetter: function () {
keywordGetter() {
return self.editor.getKeyword();
},
itemsCreator: function (op, callback) {
var keyword = self.editor.getKeyword();
itemsCreator(op, callback) {
const keyword = self.editor.getKeyword();
op.keywords = [keyword];
this.setKeyword(keyword);
o.itemsCreator(op, function () {
if (keyword === self.editor.getValue()) {
callback.apply(null, arguments);
callback(...arguments);
}
});
},
itemHeight: o.itemHeight,
value: o.value,
}, o.popup),
},
o.popup
),
adapter: o.adapter,
masker: o.masker
masker: o.masker,
});
this.searcher.on(BI.Searcher.EVENT_START, function () {
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_START);
this.searcher.on(Searcher.EVENT_START, () => {
self.fireEvent(MultiSelectInsertSearcher.EVENT_START);
});
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () {
if (this.hasMatched()) {
}
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_PAUSE);
this.searcher.on(Searcher.EVENT_PAUSE, () => {
self.fireEvent(MultiSelectInsertSearcher.EVENT_PAUSE);
});
this.searcher.on(BI.Searcher.EVENT_STOP, function () {
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_STOP);
this.searcher.on(Searcher.EVENT_STOP, () => {
self.fireEvent(MultiSelectInsertSearcher.EVENT_STOP);
});
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_CHANGE, arguments);
this.searcher.on(Searcher.EVENT_CHANGE, function () {
self.fireEvent(MultiSelectInsertSearcher.EVENT_CHANGE, arguments);
});
this.searcher.on(BI.Searcher.EVENT_SEARCHING, function () {
var keywords = this.getKeywords();
self.fireEvent(BI.MultiSelectInsertSearcher.EVENT_SEARCHING, keywords.length > 2000 ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) : keywords.slice(0, 2000));
this.searcher.on(Searcher.EVENT_SEARCHING, function () {
const keywords = this.getKeywords();
self.fireEvent(
MultiSelectInsertSearcher.EVENT_SEARCHING,
keywords.length > 2000
? keywords.slice(0, 2000).concat([BI.BlankSplitChar])
: keywords.slice(0, 2000)
);
});
if (BI.isNotNull(o.value)) {
if (isNotNull(o.value)) {
this.setState(o.value);
}
},
}
adjustView: function () {
adjustView() {
this.searcher.adjustView();
},
}
isSearching: function () {
isSearching() {
return this.searcher.isSearching();
},
}
stopSearch: function () {
stopSearch() {
this.searcher.stopSearch();
},
}
getKeywordsLength: function () {
var keywords = this.editor.getKeywords();
getKeywordsLength() {
const keywords = this.editor.getKeywords();
return keywords[keywords.length - 1] === BI.BlankSplitChar ? keywords.length - 1 : keywords.length;
},
return keywords[keywords.length - 1] === BI.BlankSplitChar
? keywords.length - 1
: keywords.length;
}
getKeyword: function () {
var keywords = this.editor.getKeywords().slice(0, 2000);
getKeyword() {
let keywords = this.editor.getKeywords().slice(0, 2000);
if (keywords[keywords.length - 1] === BI.BlankSplitChar) {
keywords = keywords.slice(0, keywords.length - 1);
}
return BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
},
return isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
}
hasMatched: function () {
hasMatched() {
return this.searcher.hasMatched();
},
}
hasChecked: function () {
hasChecked() {
return this.searcher.getView() && this.searcher.getView().hasChecked();
},
}
setAdapter: function (adapter) {
setAdapter(adapter) {
this.searcher.setAdapter(adapter);
},
}
setState: function (ob) {
var o = this.options;
setState(ob) {
let state;
const 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) {
} else if (size(ob.assist) <= 20) {
state = "";
each(ob.assist, (i, v) => {
if (i === 0) {
state += "" + (v === null ? "" : (o.valueFormatter(v + "") || v));
state +=
`${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} else {
state += "," + (v === null ? "" : (o.valueFormatter(v + "") || v));
state +=
`,${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
}
});
this.editor.setState(state);
@ -165,13 +200,17 @@ BI.MultiSelectInsertSearcher = BI.inherit(BI.Widget, {
} 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) {
} else if (size(ob.value) <= 20) {
state = "";
each(ob.value, (i, v) => {
if (i === 0) {
state += "" + (v === null ? "" : (o.valueFormatter(v + "") || v));
state +=
`${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} else {
state += "," + (v === null ? "" : (o.valueFormatter(v + "") || v));
state +=
`,${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
}
});
this.editor.setState(state);
@ -179,36 +218,26 @@ BI.MultiSelectInsertSearcher = BI.inherit(BI.Widget, {
this.editor.setState(BI.Selection.Multi);
}
}
},
}
getState: function () {
getState() {
return this.editor.getState();
},
}
setValue: function (ob) {
setValue(ob) {
this.setState(ob);
this.searcher.setValue(ob);
},
}
getKey: function () {
getKey() {
return this.editor.getValue();
},
}
getValue: function () {
getValue() {
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_FOCUS = "EVENT_FOCUS";
BI.MultiSelectInsertSearcher.EVENT_BLUR = "EVENT_BLUR";
BI.shortcut("bi.multi_select_insert_searcher", BI.MultiSelectInsertSearcher);
populate(items) {
this.searcher.populate(...arguments);
}
}

18
src/widget/multiselect/trigger/searcher.multiselect.js

@ -9,8 +9,9 @@ import {
size,
each
} from "@/core";
import { MultiSelectEditor } from "editor.multiselect";
import { MultiSelectEditor } from "./editor.multiselect";
import { Searcher } from "@/base";
import { MultiSelectSearchPane } from "../search/multiselect.search.pane";
@shortcut()
export class MultiSelectSearcher extends Widget {
@ -77,7 +78,7 @@ export class MultiSelectSearcher extends Widget {
el: this.editor,
popup: extend(
{
type: "bi.multi_select_search_pane",
type: MultiSelectSearchPane.xtype,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
keywordGetter() {
@ -91,7 +92,7 @@ export class MultiSelectSearcher extends Widget {
op.keywords = [keyword];
o.itemsCreator(op, function () {
if (keyword === self.editor.getValue()) {
callback.apply(null, arguments);
callback(...arguments);
}
});
});
@ -108,9 +109,7 @@ export class MultiSelectSearcher extends Widget {
this.searcher.on(Searcher.EVENT_START, () => {
self.fireEvent(MultiSelectSearcher.EVENT_START);
});
this.searcher.on(Searcher.EVENT_PAUSE, function () {
if (this.hasMatched()) {
}
this.searcher.on(Searcher.EVENT_PAUSE, () => {
self.fireEvent(MultiSelectSearcher.EVENT_PAUSE);
});
this.searcher.on(Searcher.EVENT_STOP, () => {
@ -165,6 +164,7 @@ export class MultiSelectSearcher extends Widget {
}
setState(ob) {
let state;
const o = this.options;
ob || (ob = {});
ob.value || (ob.value = []);
@ -172,7 +172,7 @@ export class MultiSelectSearcher extends Widget {
if (ob.value.length === 0) {
this.editor.setState(BI.Selection.All);
} else if (size(ob.assist) <= 20) {
var state = "";
state = "";
each(ob.assist, (i, v) => {
if (i === 0) {
state +=
@ -192,7 +192,7 @@ export class MultiSelectSearcher extends Widget {
if (ob.value.length === 0) {
this.editor.setState(BI.Selection.None);
} else if (size(ob.value) <= 20) {
var state = "";
state = "";
each(ob.value, (i, v) => {
if (i === 0) {
state +=
@ -229,6 +229,6 @@ export class MultiSelectSearcher extends Widget {
}
populate(items) {
this.searcher.populate.apply(this.searcher, arguments);
this.searcher.populate(...arguments);
}
}

8
src/widget/multiselect/trigger/switcher.checkselected.js

@ -8,7 +8,8 @@ import {
nextTick
} from "@/core";
import { Switcher } from "@/base";
import { MultiSelectCheckSelectedButton } from "button.checkselected";
import { MultiSelectCheckSelectedButton } from "./button.checkselected";
import { MultiSelectCheckPane } from "../check/multiselect.check.pane";
@shortcut()
export class MultiSelectCheckSelectedSwitcher extends Widget {
@ -50,7 +51,7 @@ export class MultiSelectCheckSelectedSwitcher extends Widget {
el: this.button,
popup: extend(
{
type: "bi.multi_select_check_pane",
type: MultiSelectCheckPane.xtype,
valueFormatter: o.valueFormatter,
itemsCreator: o.itemsCreator,
onClickContinueSelect() {
@ -114,7 +115,8 @@ export class MultiSelectCheckSelectedSwitcher extends Widget {
this.button.setValue(v);
}
getValue() {}
getValue() {
}
populate(items) {
this.switcher.populate.apply(this.switcher, arguments);

4
src/widget/multitree/multi.tree.combo.js

@ -11,8 +11,8 @@ import {
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearcher } from "trigger/searcher.multi.tree";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiTreeSearcher } from "./trigger/searcher.multi.tree";
import { MultiTreePopup } from "./multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import { TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "../multiselect/trigger/switcher.checkselected";

4
src/widget/multitree/multi.tree.insert.combo.js

@ -11,8 +11,8 @@ import {
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearchInsertPane } from "trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiTreeSearchInsertPane } from "./trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "./multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import { TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "../multiselect/trigger/switcher.checkselected";

4
src/widget/multitree/multi.tree.list.combo.js

@ -11,8 +11,8 @@ import {
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearchInsertPane } from "trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiTreeSearchInsertPane } from "./trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "./multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import {
TriggerIconButton,

2
src/widget/multitree/trigger/searcher.list.multi.tree.js

@ -14,7 +14,7 @@ import { MultiSelectEditor } from "../../multiselect/trigger/editor.multiselect"
import { MultiSelectSearcher } from "../../multiselect/trigger/searcher.multiselect";
import { Searcher } from "@/base";
import { SimpleStateEditor } from "@/case";
import { MultiTreeSearchPane } from "multi.tree.search.pane";
import { MultiTreeSearchPane } from "./multi.tree.search.pane";
@shortcut()
export class MultiListTreeSearcher extends Widget {

2
src/widget/multitree/trigger/searcher.multi.tree.js

@ -13,7 +13,7 @@ import {
} from "@/core";
import { MultiSelectEditor } from "../../multiselect/trigger/editor.multiselect";
import { MultiSelectSearcher } from "../../multiselect/trigger/searcher.multiselect";
import { MultiTreeSearchPane } from "multi.tree.search.pane";
import { MultiTreeSearchPane } from "./multi.tree.search.pane";
import { Searcher } from "@/base";
import { SimpleStateEditor } from "@/case";

Loading…
Cancel
Save