zsmj 2 years ago
parent
commit
101b3352fa
  1. 280
      src/widget/editor/editor.search.js
  2. 3
      src/widget/index.js
  3. 4
      src/widget/multiselect/index.js
  4. 3
      src/widget/multiselectlist/index.js
  5. 528
      src/widget/multiselectlist/multiselectlist.insert.js
  6. 547
      src/widget/multiselectlist/multiselectlist.insert.nobar.js
  7. 534
      src/widget/multiselectlist/multiselectlist.js

280
src/widget/editor/editor.search.js

@ -1,26 +1,69 @@
/**
* Created by roy on 15/9/14.
*/
BI.SearchEditor = BI.inherit(BI.Widget, {
_defaultConfig: function (config) {
var conf = BI.SearchEditor.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
baseCls: "bi-search-editor bi-focus-shadow " + (config.simple ? "bi-border-bottom" : "bi-border bi-border-radius"),
import {
shortcut,
Widget,
extend,
i18nText,
emptyFn,
createWidget,
toPix,
isKey,
Controller,
Events,
HTapeLayout,
isEndWithBlank
} from "@/core";
import { IconButton, Editor, IconLabel } from "@/base";
@shortcut()
export class SearchEditor extends Widget {
static xtype = "bi.search_editor";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_CLICK = "EVENT_CLICK";
static EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
static EVENT_SPACE = "EVENT_SPACE";
static EVENT_BACKSPACE = "EVENT_BACKSPACE";
static EVENT_CLEAR = "EVENT_CLEAR";
static EVENT_START = "EVENT_START";
static EVENT_PAUSE = "EVENT_PAUSE";
static EVENT_STOP = "EVENT_STOP";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
static EVENT_VALID = "EVENT_VALID";
static EVENT_ERROR = "EVENT_ERROR";
static EVENT_ENTER = "EVENT_ENTER";
static EVENT_RESTRICT = "EVENT_RESTRICT";
static EVENT_REMOVE = "EVENT_REMOVE";
static EVENT_EMPTY = "EVENT_EMPTY";
_defaultConfig(config) {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`bi-search-editor bi-focus-shadow ${
config.simple
? "bi-border-bottom"
: "bi-border bi-border-radius"}`,
height: 24,
errorText: "",
watermark: BI.i18nText("BI-Basic_Search"),
validationChecker: BI.emptyFn,
quitChecker: BI.emptyFn,
value: ""
});
},
_init: function () {
BI.SearchEditor.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.editor = BI.createWidget(o.el, {
type: "bi.editor",
watermark: i18nText("BI-Basic_Search"),
validationChecker: emptyFn,
quitChecker: emptyFn,
value: "",
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.editor = createWidget(o.el, {
type: Editor.xtype,
simple: o.simple,
height: BI.toPix(o.height, o.simple ? 1 : 2),
height: toPix(o.height, o.simple ? 1 : 2),
watermark: o.watermark,
allowBlank: true,
hgap: 1,
@ -30,189 +73,172 @@ BI.SearchEditor = BI.inherit(BI.Widget, {
value: o.value,
autoTrim: o.autoTrim,
});
this.clear = BI.createWidget({
type: "bi.icon_button",
this.clear = createWidget({
type: IconButton.xtype,
stopEvent: true,
cls: "close-font",
invisible: !BI.isKey(o.value)
invisible: !isKey(o.value),
});
this.clear.on(BI.IconButton.EVENT_CHANGE, function () {
this.clear.on(IconButton.EVENT_CHANGE, () => {
self.setValue("");
self.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.STOPEDIT, self.getValue());
self.fireEvent(
Controller.EVENT_CHANGE,
Events.STOPEDIT,
self.getValue()
);
// 从有内容到无内容的清空也是一次change
self.fireEvent(BI.SearchEditor.EVENT_CHANGE);
self.fireEvent(BI.SearchEditor.EVENT_CLEAR);
self.fireEvent(SearchEditor.EVENT_CHANGE);
self.fireEvent(SearchEditor.EVENT_CLEAR);
});
BI.createWidget({
createWidget({
element: this,
height: BI.toPix(o.height, o.simple ? 1 : 2),
type: "bi.htape",
height: toPix(o.height, o.simple ? 1 : 2),
type: HTapeLayout.xtype,
items: [
{
el: {
type: "bi.icon_label",
cls: "search-font"
type: IconLabel.xtype,
cls: "search-font",
},
width: 24
width: 24,
},
{
el: self.editor
el: self.editor,
},
{
el: this.clear,
width: 24
width: 24,
}
]
],
});
this.editor.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.editor.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
this.editor.on(BI.Editor.EVENT_FOCUS, function () {
self.fireEvent(BI.SearchEditor.EVENT_FOCUS);
this.editor.on(Editor.EVENT_FOCUS, () => {
self.fireEvent(SearchEditor.EVENT_FOCUS);
});
this.editor.on(BI.Editor.EVENT_BLUR, function () {
self.fireEvent(BI.SearchEditor.EVENT_BLUR);
this.editor.on(Editor.EVENT_BLUR, () => {
self.fireEvent(SearchEditor.EVENT_BLUR);
});
this.editor.on(BI.Editor.EVENT_CLICK, function () {
self.fireEvent(BI.SearchEditor.EVENT_CLICK);
this.editor.on(Editor.EVENT_CLICK, () => {
self.fireEvent(SearchEditor.EVENT_CLICK);
});
this.editor.on(BI.Editor.EVENT_CHANGE, function () {
this.editor.on(Editor.EVENT_CHANGE, () => {
self._checkClear();
self.fireEvent(BI.SearchEditor.EVENT_CHANGE);
self.fireEvent(SearchEditor.EVENT_CHANGE);
});
this.editor.on(BI.Editor.EVENT_KEY_DOWN, function (v) {
self.fireEvent(BI.SearchEditor.EVENT_KEY_DOWN, v);
this.editor.on(Editor.EVENT_KEY_DOWN, v => {
self.fireEvent(SearchEditor.EVENT_KEY_DOWN, v);
});
this.editor.on(BI.Editor.EVENT_SPACE, function () {
self.fireEvent(BI.SearchEditor.EVENT_SPACE);
this.editor.on(Editor.EVENT_SPACE, () => {
self.fireEvent(SearchEditor.EVENT_SPACE);
});
this.editor.on(BI.Editor.EVENT_BACKSPACE, function () {
self.fireEvent(BI.SearchEditor.EVENT_BACKSPACE);
this.editor.on(Editor.EVENT_BACKSPACE, () => {
self.fireEvent(SearchEditor.EVENT_BACKSPACE);
});
this.editor.on(BI.Editor.EVENT_VALID, function () {
self.fireEvent(BI.SearchEditor.EVENT_VALID);
this.editor.on(Editor.EVENT_VALID, () => {
self.fireEvent(SearchEditor.EVENT_VALID);
});
this.editor.on(BI.Editor.EVENT_ERROR, function () {
self.fireEvent(BI.SearchEditor.EVENT_ERROR);
this.editor.on(Editor.EVENT_ERROR, () => {
self.fireEvent(SearchEditor.EVENT_ERROR);
});
this.editor.on(BI.Editor.EVENT_ENTER, function () {
self.fireEvent(BI.SearchEditor.EVENT_ENTER);
this.editor.on(Editor.EVENT_ENTER, () => {
self.fireEvent(SearchEditor.EVENT_ENTER);
});
this.editor.on(BI.Editor.EVENT_RESTRICT, function () {
self.fireEvent(BI.SearchEditor.EVENT_RESTRICT);
this.editor.on(Editor.EVENT_RESTRICT, () => {
self.fireEvent(SearchEditor.EVENT_RESTRICT);
});
this.editor.on(BI.Editor.EVENT_EMPTY, function () {
this.editor.on(Editor.EVENT_EMPTY, () => {
self._checkClear();
self.fireEvent(BI.SearchEditor.EVENT_EMPTY);
self.fireEvent(SearchEditor.EVENT_EMPTY);
});
this.editor.on(BI.Editor.EVENT_REMOVE, function () {
self.fireEvent(BI.SearchEditor.EVENT_REMOVE);
this.editor.on(Editor.EVENT_REMOVE, () => {
self.fireEvent(SearchEditor.EVENT_REMOVE);
});
this.editor.on(BI.Editor.EVENT_CONFIRM, function () {
self.fireEvent(BI.SearchEditor.EVENT_CONFIRM);
this.editor.on(Editor.EVENT_CONFIRM, () => {
self.fireEvent(SearchEditor.EVENT_CONFIRM);
});
this.editor.on(BI.Editor.EVENT_CHANGE_CONFIRM, function () {
self.fireEvent(BI.SearchEditor.EVENT_CHANGE_CONFIRM);
this.editor.on(Editor.EVENT_CHANGE_CONFIRM, () => {
self.fireEvent(SearchEditor.EVENT_CHANGE_CONFIRM);
});
this.editor.on(BI.Editor.EVENT_START, function () {
self.fireEvent(BI.SearchEditor.EVENT_START);
this.editor.on(Editor.EVENT_START, () => {
self.fireEvent(SearchEditor.EVENT_START);
});
this.editor.on(BI.Editor.EVENT_PAUSE, function () {
self.fireEvent(BI.SearchEditor.EVENT_PAUSE);
this.editor.on(Editor.EVENT_PAUSE, () => {
self.fireEvent(SearchEditor.EVENT_PAUSE);
});
this.editor.on(BI.Editor.EVENT_STOP, function () {
self.fireEvent(BI.SearchEditor.EVENT_STOP);
this.editor.on(Editor.EVENT_STOP, () => {
self.fireEvent(SearchEditor.EVENT_STOP);
});
},
}
_checkClear: function () {
_checkClear() {
if (!this.getValue()) {
this.clear.invisible();
} else {
this.clear.visible();
}
},
}
setWaterMark: function (v) {
setWaterMark(v) {
this.options.watermark = v;
this.editor.setWaterMark(v);
},
}
focus: function () {
focus() {
this.editor.focus();
},
}
blur: function () {
blur() {
this.editor.blur();
},
}
getValue: function () {
getValue() {
if (this.isValid()) {
return this.editor.getValue();
}
},
}
getKeywords: function () {
var val = this.editor.getLastChangedValue();
var keywords = val.match(/[\S]+/g);
if (BI.isEndWithBlank(val)) {
getKeywords() {
const val = this.editor.getLastChangedValue();
const keywords = val.match(/[\S]+/g);
if (isEndWithBlank(val)) {
return keywords.concat([" "]);
}
return keywords;
},
}
getLastValidValue: function () {
getLastValidValue() {
return this.editor.getLastValidValue();
},
}
getLastChangedValue: function () {
getLastChangedValue() {
return this.editor.getLastChangedValue();
},
}
setValue: function (v) {
setValue(v) {
this.editor.setValue(v);
if (BI.isKey(v)) {
if (isKey(v)) {
this.clear.visible();
}
},
}
isEditing: function () {
isEditing() {
return this.editor.isEditing();
},
}
isValid: function () {
isValid() {
return this.editor.isValid();
},
}
showClearIcon: function () {
showClearIcon() {
this.clear.visible();
},
}
hideClearIcon: function () {
hideClearIcon() {
this.clear.invisible();
}
});
BI.SearchEditor.EVENT_CHANGE = "EVENT_CHANGE";
BI.SearchEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.SearchEditor.EVENT_BLUR = "EVENT_BLUR";
BI.SearchEditor.EVENT_CLICK = "EVENT_CLICK";
BI.SearchEditor.EVENT_KEY_DOWN = "EVENT_KEY_DOWN";
BI.SearchEditor.EVENT_SPACE = "EVENT_SPACE";
BI.SearchEditor.EVENT_BACKSPACE = "EVENT_BACKSPACE";
BI.SearchEditor.EVENT_CLEAR = "EVENT_CLEAR";
BI.SearchEditor.EVENT_START = "EVENT_START";
BI.SearchEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.SearchEditor.EVENT_STOP = "EVENT_STOP";
BI.SearchEditor.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.SearchEditor.EVENT_CHANGE_CONFIRM = "EVENT_CHANGE_CONFIRM";
BI.SearchEditor.EVENT_VALID = "EVENT_VALID";
BI.SearchEditor.EVENT_ERROR = "EVENT_ERROR";
BI.SearchEditor.EVENT_ENTER = "EVENT_ENTER";
BI.SearchEditor.EVENT_RESTRICT = "EVENT_RESTRICT";
BI.SearchEditor.EVENT_REMOVE = "EVENT_REMOVE";
BI.SearchEditor.EVENT_EMPTY = "EVENT_EMPTY";
BI.shortcut("bi.search_editor", BI.SearchEditor);
}

3
src/widget/index.js

@ -12,6 +12,7 @@ import { MultiTreeCombo } from "./multitree/multi.tree.combo";
import { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
import * as multiselect from "./multiselect";
import * as multiselectlist from "./multiselectlist";
Object.assign(BI, {
Collapse,
@ -28,6 +29,7 @@ Object.assign(BI, {
MultiTreeInsertCombo,
MultiTreeListCombo,
...multiselect,
...multiselectlist,
});
export * from "./date/calendar";
@ -43,6 +45,7 @@ export { MultiTreeCombo } from "./multitree/multi.tree.combo";
export { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
export { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
export * from "./multiselect";
export * from "./multiselectlist";
export {
Collapse

4
src/widget/multiselect/index.js

@ -0,0 +1,4 @@
export { MultiSelectCombo } from "./multiselect.combo";
export { MultiSelectNoBarCombo } from "./multiselect.combo.nobar";
export { MultiSelectInsertCombo } from "./multiselect.insert.combo";
export { MultiSelectInsertNoBarCombo } from "./multiselect.insert.combo.nobar";

3
src/widget/multiselectlist/index.js

@ -0,0 +1,3 @@
export * from "./multiselectlist.insert";
export * from "./multiselectlist.insert.nobar";
export * from "./multiselectlist";

528
src/widget/multiselectlist/multiselectlist.insert.js

@ -1,59 +1,105 @@
/**
* Created by zcf_1 on 2017/5/2.
*/
BI.MultiSelectInsertList = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectInsertList.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
deepClone,
isKey,
Selection,
remove,
pushDistinct,
createWidget,
isNotEmptyString,
i18nText,
isEmptyArray,
last,
initial,
endWith,
AbsoluteLayout,
isEmptyString,
makeObject,
each,
Func,
map,
concat,
isNotNull,
values,
filter,
contains,
isNull, VerticalFillLayout
} from "@/core";
import { Single, Searcher } from "@/base";
import { MultiSelectBar } from "@/case";
import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch";
import { MultiSelectLoader } from "../multiselect/multiselect.loader";
import { MultiSelectSearchInsertPane } from "../multiselect/search/multiselect.search.insert.pane";
import { SearchEditor } from "@/widget/editor/editor.search";
@shortcut()
export class MultiSelectInsertList extends Single {
static xtype = "bi.multi_select_insert_list";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-insert-list",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
searcherHeight: BI.SIZE_CONSANTS.TRIGGER_HEIGHT,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
});
},
_init: function () {
BI.MultiSelectInsertList.superclass._init.apply(this, arguments);
}
var self = this, o = this.options;
this.storeValue = this._assertValue(BI.deepClone(o.value) || {});
_init() {
super._init(...arguments);
var assertShowValue = function () {
BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue));
const self = this,
o = this.options;
this.storeValue = this._assertValue(deepClone(o.value) || {});
function assertShowValue() {
isKey(self._startValue) &&
(self.storeValue.type === Selection.All
? remove(self.storeValue.value, self._startValue)
: pushDistinct(self.storeValue.value, self._startValue));
// self.trigger.setValue(self.storeValue);
};
}
this.adapter = BI.createWidget({
type: "bi.multi_select_loader",
this.adapter = createWidget({
type: MultiSelectLoader.xtype,
cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
itemsCreator: o.itemsCreator,
itemHeight: o.itemHeight,
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
logic: {
dynamic: false
dynamic: false,
},
// onLoaded: o.onLoaded,
el: {},
isDefaultInit: true,
value: o.value
value: o.value,
});
this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
this.adapter.on(MultiSelectLoader.EVENT_CHANGE, function () {
self.storeValue = this.getValue();
assertShowValue();
self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE);
self.fireEvent(MultiSelectInsertList.EVENT_CHANGE);
});
this.searcherPane = BI.createWidget({
type: "bi.multi_select_search_insert_pane",
this.searcherPane = createWidget({
type: MultiSelectSearchInsertPane.xtype,
cls: "bi-border-left bi-border-right bi-border-bottom",
valueFormatter: o.valueFormatter,
itemFormatter: o.itemFormatter,
keywordGetter: function () {
keywordGetter() {
return self.trigger.getKeyword();
},
itemsCreator: function (op, callback) {
var keyword = self.trigger.getKeyword();
if (BI.isNotEmptyString(keyword)) {
itemsCreator(op, callback) {
const keyword = self.trigger.getKeyword();
if (isNotEmptyString(keyword)) {
op.keywords = [keyword];
this.setKeyword(op.keywords[0]);
o.itemsCreator(op, callback);
@ -63,298 +109,338 @@ BI.MultiSelectInsertList = BI.inherit(BI.Single, {
});
this.searcherPane.setVisible(false);
this.trigger = BI.createWidget({
type: "bi.searcher",
this.trigger = createWidget({
type: Searcher.xtype,
el: {
type: "bi.select_patch_editor",
type: SelectPatchEditor.xtype,
el: {
type: "bi.search_editor",
watermark: BI.i18nText("BI-Basic_Search_And_Patch_Paste"),
type: SearchEditor.xtype,
watermark: i18nText("BI-Basic_Search_And_Patch_Paste"),
},
ref: function (ref) {
ref(ref) {
self.editor = ref;
},
},
isAutoSearch: false,
isAutoSync: false,
onSearch: function (op, callback) {
onSearch(op, callback) {
callback();
},
adapter: this.adapter,
popup: this.searcherPane,
masker: false,
listeners: [{
eventName: BI.Searcher.EVENT_START,
action: function () {
self._showSearcherPane();
self._setStartValue("");
this.setValue(BI.deepClone(self.storeValue));
}
}, {
eventName: BI.Searcher.EVENT_STOP,
action: function () {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
}
}, {
eventName: BI.Searcher.EVENT_PAUSE,
action: function () {
var keywords = self._getKeywords();
if (keywords[keywords.length - 1] === BI.BlankSplitChar) {
keywords = keywords.slice(0, keywords.length - 1);
}
var keyword = BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
self._join({
type: BI.Selection.Multi,
value: [keyword]
}, function () {
if (self.storeValue.type === BI.Selection.Multi) {
BI.pushDistinct(self.storeValue.value, keyword);
}
listeners: [
{
eventName: Searcher.EVENT_START,
action() {
self._showSearcherPane();
self._setStartValue("");
this.setValue(deepClone(self.storeValue));
},
},
{
eventName: Searcher.EVENT_STOP,
action() {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
self._setStartValue(keyword);
assertShowValue();
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
self._setStartValue("");
self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE);
});
self._showAdapter();
}
}, {
eventName: BI.Searcher.EVENT_SEARCHING,
action: function () {
var keywords = self._getKeywords();
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
},
},
{
eventName: Searcher.EVENT_PAUSE,
action() {
let keywords = self._getKeywords();
if (
keywords[keywords.length - 1] === BI.BlankSplitChar
) {
keywords = keywords.slice(0, keywords.length - 1);
}
const keyword = isEmptyArray(keywords)
? ""
: keywords[keywords.length - 1];
self._join(
{
type: Selection.Multi,
value: [keyword],
},
() => {
if (self.storeValue.type === Selection.Multi) {
pushDistinct(
self.storeValue.value,
keyword
);
}
self._showAdapter();
self.adapter.setValue(self.storeValue);
self._setStartValue(keyword);
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
assertShowValue();
self.fireEvent(
MultiSelectInsertList.EVENT_CHANGE
);
}
self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE);
});
self._getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand"));
}
}
}, {
eventName: BI.Searcher.EVENT_CHANGE,
action: function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE);
});
} else {
self._join(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertList.EVENT_CHANGE);
});
}
);
self._showAdapter();
},
},
{
eventName: Searcher.EVENT_SEARCHING,
action() {
let keywords = self._getKeywords();
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, () => {
if (endWith(lastKeyword, BI.BlankSplitChar)) {
self.adapter.setValue(self.storeValue);
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
assertShowValue();
}
self.fireEvent(
MultiSelectInsertList.EVENT_CHANGE
);
});
self._getKeywordsLength() > 2000 &&
BI.Msg.alert(
i18nText("BI-Basic_Prompt"),
i18nText(
"BI-Basic_Too_Much_Value_Get_Two_Thousand"
)
);
}
},
},
{
eventName: Searcher.EVENT_CHANGE,
action(value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
self.fireEvent(
MultiSelectInsertList.EVENT_CHANGE
);
});
} else {
self._join(this.getValue(), () => {
assertShowValue();
self.fireEvent(
MultiSelectInsertList.EVENT_CHANGE
);
});
}
},
}
}],
value: o.value
],
value: o.value,
});
BI.createWidget({
type: "bi.vertical_fill",
createWidget({
type: VerticalFillLayout.xtype,
rowSize: ["", "fill"],
element: this,
items: [{
el: this.trigger,
}, {
el: this.adapter,
}]
items: [
{
el: this.trigger,
},
{
el: this.adapter,
}
],
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [{
el: this.searcherPane,
top: o.searcherHeight || BI.SIZE_CONSANTS.TRIGGER_HEIGHT,
bottom: 0,
left: 0,
right: 0
}]
items: [
{
el: this.searcherPane,
top: o.searcherHeight || BI.SIZE_CONSANTS.TRIGGER_HEIGHT,
bottom: 0,
left: 0,
right: 0,
}
],
});
},
}
_getKeywords: function () {
var val = this.editor.getValue();
var keywords = val.split(/\u200b\s\u200b/);
if (BI.isEmptyString(keywords[keywords.length - 1])) {
_getKeywords() {
const val = this.editor.getValue();
let keywords = val.split(/\u200b\s\u200b/);
if (isEmptyString(keywords[keywords.length - 1])) {
keywords = keywords.slice(0, keywords.length - 1);
}
if (/\u200b\s\u200b$/.test(val)) {
keywords = keywords.concat([BI.BlankSplitChar]);
}
return keywords.length > 2000 ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) : keywords.slice(0, 2000);
},
return keywords.length > 2000
? keywords.slice(0, 2000).concat([BI.BlankSplitChar])
: keywords.slice(0, 2000);
}
_getKeywordsLength: function () {
var val = this.editor.getValue();
var keywords = val.split(/\u200b\s\u200b/);
_getKeywordsLength() {
const val = this.editor.getValue();
const keywords = val.split(/\u200b\s\u200b/);
return keywords.length - 1;
},
}
_showAdapter: function () {
_showAdapter() {
this.adapter.setVisible(true);
this.searcherPane.setVisible(false);
},
}
_showSearcherPane: function () {
_showSearcherPane() {
this.searcherPane.setVisible(true);
this.adapter.setVisible(false);
},
}
_defaultState: function () {
_defaultState() {
this.trigger.stopEditing();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
return val;
},
}
_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);
// 和复选下拉框同步,allData做缓存是会爆炸的
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);
});
callback();
}
},
}
_joinAll: function (res, callback) {
var self = this, o = this.options;
_joinAll(res, callback) {
const self = this,
o = this.options;
this._assertValue(res);
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
return {
text: o.valueFormatter(v) || v,
value: v
};
}), this.trigger.getKeyword());
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])) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v,
};
}),
this.trigger.getKeyword()
);
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;
delete map[v];
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
callback();
return;
}
o.itemsCreator({
type: BI.MultiSelectInsertList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
callback();
});
},
o.itemsCreator(
{
type: MultiSelectInsertList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(values(selectedMap));
callback();
}
);
}
_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);
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;
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
callback();
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.adapter.setStartValue(value);
},
}
isAllSelected: function () {
isAllSelected() {
return this.adapter.isAllSelected();
},
}
resize: function () {
resize() {
// this.trigger.getCounter().adjustView();
// this.trigger.adjustView();
},
setValue: function (v) {
}
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.adapter.setValue(this.storeValue);
this.trigger.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue);
},
populate: function () {
this.adapter.populate.apply(this.adapter, arguments);
this.trigger.populate.apply(this.trigger, arguments);
}
});
BI.extend(BI.MultiSelectInsertList, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
getValue() {
return deepClone(this.storeValue);
}
BI.MultiSelectInsertList.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_insert_list", BI.MultiSelectInsertList);
populate() {
this.adapter.populate(...arguments);
this.trigger.populate(...arguments);
}
}

547
src/widget/multiselectlist/multiselectlist.insert.nobar.js

@ -1,61 +1,107 @@
/**
* Created by zcf_1 on 2017/5/2.
*/
BI.MultiSelectInsertNoBarList = BI.inherit(BI.Single, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectInsertNoBarList.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
extend,
emptyFn,
Selection,
deepClone,
isKey,
remove,
pushDistinct,
createWidget,
isNotEmptyString,
i18nText,
isEmptyArray,
last,
initial,
endWith,
AbsoluteLayout,
isEmptyString,
makeObject,
each,
Func,
map,
concat,
isNotNull,
values,
filter,
contains,
isNull, VTapeLayout
} from "@/core";
import { Single, Searcher, Msg } from "@/base";
import { MultiSelectBar } from "@/case";
import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch";
import { MultiSelectNoBarLoader } from "../multiselect/multiselect.loader.nobar";
import { MultiSelectSearchInsertPane } from "../multiselect/search/multiselect.search.insert.pane";
import { SearchEditor } from "../editor/editor.search";
@shortcut()
export class MultiSelectInsertNoBarList extends Single {
static xtype = "bi.multi_select_insert_no_bar_list";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-insert-list",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
searcherHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
});
},
_init: function () {
BI.MultiSelectInsertNoBarList.superclass._init.apply(this, arguments);
}
var self = this, o = this.options;
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.storeValue = {
type: BI.Selection.Multi,
value: BI.deepClone(o.value) || []
type: Selection.Multi,
value: deepClone(o.value) || [],
};
var assertShowValue = function () {
BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue));
function assertShowValue() {
isKey(self._startValue) &&
(self.storeValue.type === Selection.All
? remove(self.storeValue.value, self._startValue)
: pushDistinct(self.storeValue.value, self._startValue));
// self.trigger.setValue(self.storeValue);
};
}
this.adapter = BI.createWidget({
type: "bi.multi_select_no_bar_loader",
this.adapter = createWidget({
type: MultiSelectNoBarLoader.xtype,
cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
itemsCreator: o.itemsCreator,
itemHeight: o.itemHeight,
valueFormatter: o.valueFormatter,
logic: {
dynamic: false
dynamic: false,
},
// onLoaded: o.onLoaded,
el: {},
value: {
type: BI.Selection.Multi,
value: o.value || []
}
type: Selection.Multi,
value: o.value || [],
},
});
this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
this.adapter.on(MultiSelectNoBarLoader.EVENT_CHANGE, function () {
self.storeValue = this.getValue();
assertShowValue();
self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE);
self.fireEvent(MultiSelectInsertNoBarList.EVENT_CHANGE);
});
this.searcherPane = BI.createWidget({
type: "bi.multi_select_search_insert_pane",
this.searcherPane = createWidget({
type: MultiSelectSearchInsertPane.xtype,
cls: "bi-border-left bi-border-right bi-border-bottom",
valueFormatter: o.valueFormatter,
keywordGetter: function () {
keywordGetter() {
return self.trigger.getKeyword();
},
itemsCreator: function (op, callback) {
var keyword = self.trigger.getKeyword();
if (BI.isNotEmptyString(keyword)) {
itemsCreator(op, callback) {
const keyword = self.trigger.getKeyword();
if (isNotEmptyString(keyword)) {
op.keywords = [keyword];
this.setKeyword(op.keywords[0]);
o.itemsCreator(op, callback);
@ -64,303 +110,342 @@ BI.MultiSelectInsertNoBarList = BI.inherit(BI.Single, {
});
this.searcherPane.setVisible(false);
this.trigger = BI.createWidget({
type: "bi.searcher",
this.trigger = createWidget({
type: Searcher.xtype,
el: {
type: "bi.select_patch_editor",
type: SelectPatchEditor.xtype,
el: {
type: "bi.search_editor",
watermark: BI.i18nText("BI-Basic_Search_And_Patch_Paste"),
type: SearchEditor.xtype,
watermark: i18nText("BI-Basic_Search_And_Patch_Paste"),
},
ref: function (ref) {
ref(ref) {
self.editor = ref;
},
height: o.searcherHeight
height: o.searcherHeight,
},
isAutoSearch: false,
isAutoSync: false,
onSearch: function (op, callback) {
onSearch(op, callback) {
callback();
},
adapter: this.adapter,
popup: this.searcherPane,
height: 200,
masker: false,
listeners: [{
eventName: BI.Searcher.EVENT_START,
action: function () {
self._showSearcherPane();
self._setStartValue("");
this.setValue(BI.deepClone(self.storeValue));
}
}, {
eventName: BI.Searcher.EVENT_STOP,
action: function () {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
}
}, {
eventName: BI.Searcher.EVENT_PAUSE,
action: function () {
var keywords = self._getKeywords();
if (keywords[keywords.length - 1] === BI.BlankSplitChar) {
keywords = keywords.slice(0, keywords.length - 1);
}
var keyword = BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
self._join({
type: BI.Selection.Multi,
value: [keyword]
}, function () {
if (self.storeValue.type === BI.Selection.Multi) {
BI.pushDistinct(self.storeValue.value, keyword);
}
listeners: [
{
eventName: Searcher.EVENT_START,
action() {
self._showSearcherPane();
self._setStartValue("");
this.setValue(deepClone(self.storeValue));
},
},
{
eventName: Searcher.EVENT_STOP,
action() {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
self._setStartValue(keyword);
assertShowValue();
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
self._setStartValue("");
self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE);
});
}
}, {
eventName: BI.Searcher.EVENT_SEARCHING,
action: function () {
var keywords = self._getKeywords();
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
},
},
{
eventName: Searcher.EVENT_PAUSE,
action() {
let keywords = self._getKeywords();
if (
keywords[keywords.length - 1] === BI.BlankSplitChar
) {
keywords = keywords.slice(0, keywords.length - 1);
}
const keyword = isEmptyArray(keywords)
? ""
: keywords[keywords.length - 1];
self._join(
{
type: Selection.Multi,
value: [keyword],
},
() => {
if (self.storeValue.type === Selection.Multi) {
pushDistinct(
self.storeValue.value,
keyword
);
}
self._showAdapter();
self.adapter.setValue(self.storeValue);
self._setStartValue(keyword);
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
assertShowValue();
self.fireEvent(
MultiSelectInsertNoBarList.EVENT_CHANGE
);
}
self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE);
});
self._getKeywordsLength() > 2000 && BI.Msg.alert(BI.i18nText("BI-Basic_Prompt"), BI.i18nText("BI-Basic_Too_Much_Value_Get_Two_Thousand"));
}
}
}, {
eventName: BI.Searcher.EVENT_CHANGE,
action: function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE);
});
} else {
self._join(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectInsertNoBarList.EVENT_CHANGE);
});
}
);
},
},
{
eventName: Searcher.EVENT_SEARCHING,
action() {
let keywords = self._getKeywords();
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, () => {
if (endWith(lastKeyword, BI.BlankSplitChar)) {
self.adapter.setValue(self.storeValue);
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
assertShowValue();
}
self.fireEvent(
MultiSelectInsertNoBarList.EVENT_CHANGE
);
});
self._getKeywordsLength() > 2000 &&
Msg.alert(
i18nText("BI-Basic_Prompt"),
i18nText(
"BI-Basic_Too_Much_Value_Get_Two_Thousand"
)
);
}
},
},
{
eventName: Searcher.EVENT_CHANGE,
action(value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
self.fireEvent(
MultiSelectInsertNoBarList.EVENT_CHANGE
);
});
} else {
self._join(this.getValue(), () => {
assertShowValue();
self.fireEvent(
MultiSelectInsertNoBarList.EVENT_CHANGE
);
});
}
},
}
}],
],
value: {
type: BI.Selection.Multi,
value: o.value || []
}
type: Selection.Multi,
value: o.value || [],
},
});
BI.createWidget({
type: "bi.vtape",
createWidget({
type: VTapeLayout.xtype,
element: this,
items: [{
el: this.trigger,
height: o.searcherHeight
}, {
el: this.adapter,
height: "fill"
}]
items: [
{
el: this.trigger,
height: o.searcherHeight,
},
{
el: this.adapter,
height: "fill",
}
],
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [{
el: this.searcherPane,
top: o.searcherHeight,
bottom: 0,
left: 0,
right: 0
}]
items: [
{
el: this.searcherPane,
top: o.searcherHeight,
bottom: 0,
left: 0,
right: 0,
}
],
});
},
}
_getKeywords: function () {
var val = this.editor.getValue();
var keywords = val.split(/\u200b\s\u200b/);
if (BI.isEmptyString(keywords[keywords.length - 1])) {
_getKeywords() {
const val = this.editor.getValue();
let keywords = val.split(/\u200b\s\u200b/);
if (isEmptyString(keywords[keywords.length - 1])) {
keywords = keywords.slice(0, keywords.length - 1);
}
if (/\u200b\s\u200b$/.test(val)) {
keywords = keywords.concat([BI.BlankSplitChar]);
}
return keywords.length > 2000 ? keywords.slice(0, 2000).concat([BI.BlankSplitChar]) : keywords.slice(0, 2000);
},
return keywords.length > 2000
? keywords.slice(0, 2000).concat([BI.BlankSplitChar])
: keywords.slice(0, 2000);
}
_getKeywordsLength: function () {
var val = this.editor.getValue();
var keywords = val.split(/\u200b\s\u200b/);
_getKeywordsLength() {
const val = this.editor.getValue();
const keywords = val.split(/\u200b\s\u200b/);
return keywords.length - 1;
},
}
_showAdapter: function () {
_showAdapter() {
this.adapter.setVisible(true);
this.searcherPane.setVisible(false);
},
}
_showSearcherPane: function () {
_showSearcherPane() {
this.searcherPane.setVisible(true);
this.adapter.setVisible(false);
},
}
_defaultState: function () {
_defaultState() {
this.trigger.stopEditing();
},
}
_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);
// 和复选下拉框同步,allData做缓存是会爆炸的
digest();
function digest (items) {
BI.each(keywords, function (i, val) {
self.storeValue.type === BI.Selection.Multi ? BI.pushDistinct(self.storeValue.value, val) : BI.remove(self.storeValue.value, val);
function digest(items) {
each(keywords, (i, val) => {
self.storeValue.type === Selection.Multi
? pushDistinct(self.storeValue.value, val)
: remove(self.storeValue.value, val);
});
callback();
}
},
}
_joinAll: function (res, callback) {
var self = this, o = this.options;
_joinAll(res, callback) {
const self = this,
o = this.options;
this._assertValue(res);
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
return {
text: o.valueFormatter(v) || v,
value: v
};
}), this.trigger.getKeyword());
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])) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v,
};
}),
this.trigger.getKeyword()
);
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;
delete map[v];
delete tempMap[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(tempMap));
callback();
return;
}
o.itemsCreator({
type: BI.MultiSelectInsertNoBarList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
callback();
});
},
o.itemsCreator(
{
type: MultiSelectInsertNoBarList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(values(selectedMap));
callback();
}
);
}
_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);
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;
delete map[v];
}
});
change && (this.storeValue.value = BI.values(map));
change && (this.storeValue.value = values(map));
callback();
return;
}
this._joinAll(res, callback);
},
}
_setStartValue: function (value) {
_setStartValue(value) {
this._startValue = value;
this.adapter.setStartValue(value);
},
}
isAllSelected: function () {
isAllSelected() {
return this.adapter.isAllSelected();
},
}
resize: function () {
resize() {
// this.trigger.getCounter().adjustView();
// this.trigger.adjustView();
},
setValue: function (v) {
}
setValue(v) {
this.storeValue = {
type: BI.Selection.Multi,
value: v || []
type: Selection.Multi,
value: v || [],
};
this.adapter.setValue(this.storeValue);
this.trigger.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue.value);
},
populate: function () {
this.adapter.populate.apply(this.adapter, arguments);
this.trigger.populate.apply(this.trigger, arguments);
}
});
BI.extend(BI.MultiSelectInsertNoBarList, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
getValue() {
return deepClone(this.storeValue.value);
}
BI.MultiSelectInsertNoBarList.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_insert_no_bar_list", BI.MultiSelectInsertNoBarList);
populate() {
this.adapter.populate(...arguments);
this.trigger.populate(...arguments);
}
}

534
src/widget/multiselectlist/multiselectlist.js

@ -1,177 +1,233 @@
/**
* Created by zcf_1 on 2017/5/2.
*/
BI.MultiSelectList = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.MultiSelectList.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
Widget,
extend,
emptyFn,
deepClone,
isKey,
Selection,
remove,
pushDistinct,
createWidget,
isNotEmptyString,
last,
initial,
endWith,
AbsoluteLayout,
isEmptyString,
makeObject,
map,
each,
isNotNull,
Func,
concat,
values,
filter,
contains,
isNull, VTapeLayout
} from "@/core";
import { Searcher } from "@/base";
import { MultiSelectBar } from "@/case";
import { MultiSelectLoader } from "../multiselect/multiselect.loader";
import { MultiSelectSearchPane } from "../multiselect/search/multiselect.search.pane";
import { SelectPatchEditor } from "../multiselect/trigger/editor/editor.patch";
import { SearchEditor } from "../editor/editor.search";
@shortcut()
export class MultiSelectList extends Widget {
static xtype = "bi.multi_select_list";
static REQ_GET_DATA_LENGTH = "1";
static REQ_GET_ALL_DATA = "-1";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-list",
itemsCreator: BI.emptyFn,
valueFormatter: BI.emptyFn,
itemsCreator: emptyFn,
valueFormatter: emptyFn,
searcherHeight: 24,
itemHeight: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
});
},
_init: function () {
BI.MultiSelectList.superclass._init.apply(this, arguments);
}
_init() {
super._init(...arguments);
var self = this, o = this.options;
this.storeValue = this._assertValue(BI.deepClone(o.value) || {});
const self = this,
o = this.options;
this.storeValue = this._assertValue(deepClone(o.value) || {});
var assertShowValue = function () {
BI.isKey(self._startValue) && (self.storeValue.type === BI.Selection.All ? BI.remove(self.storeValue.value, self._startValue) : BI.pushDistinct(self.storeValue.value, self._startValue));
function assertShowValue() {
isKey(self._startValue) &&
(self.storeValue.type === Selection.All
? remove(self.storeValue.value, self._startValue)
: pushDistinct(self.storeValue.value, self._startValue));
// self.trigger.setValue(self.storeValue);
};
}
this.adapter = BI.createWidget({
type: "bi.multi_select_loader",
this.adapter = createWidget({
type: MultiSelectLoader.xtype,
cls: "popup-multi-select-list bi-border-left bi-border-right bi-border-bottom",
itemsCreator: o.itemsCreator,
valueFormatter: o.valueFormatter,
itemHeight: o.itemHeight,
logic: {
dynamic: false
dynamic: false,
},
value: o.value,
isDefaultInit: true,
// onLoaded: o.onLoaded,
el: {}
el: {},
});
this.adapter.on(BI.MultiSelectLoader.EVENT_CHANGE, function () {
this.adapter.on(MultiSelectLoader.EVENT_CHANGE, function () {
self.storeValue = this.getValue();
self._adjust(function () {
self._adjust(() => {
assertShowValue();
self.fireEvent(BI.MultiSelectList.EVENT_CHANGE);
self.fireEvent(MultiSelectList.EVENT_CHANGE);
});
});
this.searcherPane = BI.createWidget({
type: "bi.multi_select_search_pane",
this.searcherPane = createWidget({
type: MultiSelectSearchPane.xtype,
cls: "bi-border-left bi-border-right bi-border-bottom",
valueFormatter: o.valueFormatter,
keywordGetter: function () {
keywordGetter() {
return self.trigger.getKeyword();
},
itemsCreator: function (op, callback) {
var keyword = self.trigger.getKeyword();
if (BI.isNotEmptyString(keyword)) {
itemsCreator(op, callback) {
const keyword = self.trigger.getKeyword();
if (isNotEmptyString(keyword)) {
op.keywords = [keyword];
o.itemsCreator(op, callback);
}
},
itemHeight: o.itemHeight
itemHeight: o.itemHeight,
});
this.searcherPane.setVisible(false);
this.trigger = BI.createWidget({
type: "bi.searcher",
this.trigger = createWidget({
type: Searcher.xtype,
el: {
type: "bi.select_patch_editor",
type: SelectPatchEditor.xtype,
el: {
type: "bi.search_editor",
type: SearchEditor.xtype,
},
ref: function (ref) {
ref(ref) {
self.editor = ref;
},
height: o.searcherHeight
height: o.searcherHeight,
},
isAutoSearch: false,
isAutoSync: false,
onSearch: function (op, callback) {
onSearch(op, callback) {
callback();
},
adapter: this.adapter,
popup: this.searcherPane,
height: 200,
masker: false,
listeners: [{
eventName: BI.Searcher.EVENT_START,
action: function () {
self._showSearcherPane();
self._setStartValue("");
this.setValue(BI.deepClone(self.storeValue));
}
}, {
eventName: BI.Searcher.EVENT_STOP,
action: function () {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
}
}, {
eventName: BI.Searcher.EVENT_PAUSE,
action: function () {
self._showAdapter();
self.fireEvent(BI.MultiSelectList.EVENT_CHANGE);
listeners: [
{
eventName: Searcher.EVENT_START,
action() {
self._showSearcherPane();
self._setStartValue("");
this.setValue(deepClone(self.storeValue));
},
},
{
eventName: Searcher.EVENT_STOP,
action() {
self._showAdapter();
self._setStartValue("");
self.adapter.setValue(self.storeValue);
// 需要刷新回到初始界面,否则搜索的结果不能放在最前面
self.adapter.populate();
},
},
{
eventName: Searcher.EVENT_PAUSE,
action() {
self._showAdapter();
self.fireEvent(MultiSelectList.EVENT_CHANGE);
},
},
}, {
eventName: BI.Searcher.EVENT_SEARCHING,
action: function () {
var keywords = this.getKeyword();
var last = BI.last(keywords);
keywords = BI.initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, function () {
if (BI.endWith(last, BI.BlankSplitChar)) {
self.adapter.setValue(self.storeValue);
{
eventName: Searcher.EVENT_SEARCHING,
action() {
let keywords = this.getKeyword();
const lastKeyword = last(keywords);
keywords = initial(keywords || []);
if (keywords.length > 0) {
self._joinKeywords(keywords, () => {
if (endWith(lastKeyword, BI.BlankSplitChar)) {
self.adapter.setValue(self.storeValue);
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
assertShowValue();
}
self.fireEvent(MultiSelectList.EVENT_CHANGE);
});
}
},
},
{
eventName: Searcher.EVENT_CHANGE,
action(value, obj) {
if (obj instanceof MultiSelectBar) {
self._joinAll(this.getValue(), () => {
assertShowValue();
self.adapter.populate();
self._setStartValue("");
} else {
self.adapter.setValue(self.storeValue);
self.fireEvent(MultiSelectList.EVENT_CHANGE);
});
} else {
self._join(this.getValue(), () => {
assertShowValue();
}
self.fireEvent(BI.MultiSelectList.EVENT_CHANGE);
});
}
}
}, {
eventName: BI.Searcher.EVENT_CHANGE,
action: function (value, obj) {
if (obj instanceof BI.MultiSelectBar) {
self._joinAll(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectList.EVENT_CHANGE);
});
} else {
self._join(this.getValue(), function () {
assertShowValue();
self.fireEvent(BI.MultiSelectList.EVENT_CHANGE);
});
}
self.fireEvent(MultiSelectList.EVENT_CHANGE);
});
}
},
}
}]
],
});
BI.createWidget({
type: "bi.vtape",
createWidget({
type: VTapeLayout.xtype,
element: this,
items: [{
el: this.trigger,
height: o.searcherHeight
}, {
el: this.adapter,
height: "fill"
}]
items: [
{
el: this.trigger,
height: o.searcherHeight,
},
{
el: this.adapter,
height: "fill",
}
],
});
BI.createWidget({
type: "bi.absolute",
createWidget({
type: AbsoluteLayout.xtype,
element: this,
items: [{
el: this.searcherPane,
top: o.searcherHeight,
bottom: 0,
left: 0,
right: 0
}]
items: [
{
el: this.searcherPane,
top: o.searcherHeight,
bottom: 0,
left: 0,
right: 0,
}
],
});
},
}
_getKeywords: function () {
var val = this.editor.getValue();
var keywords = val.split(/\u200b\s\u200b/);
if (BI.isEmptyString(keywords[keywords.length - 1])) {
_getKeywords() {
const val = this.editor.getValue();
let keywords = val.split(/\u200b\s\u200b/);
if (isEmptyString(keywords[keywords.length - 1])) {
keywords = keywords.slice(0, keywords.length - 1);
}
if (/\u200b\s\u200b$/.test(val)) {
@ -179,193 +235,209 @@ BI.MultiSelectList = BI.inherit(BI.Widget, {
}
return keywords;
},
}
_showAdapter: function () {
_showAdapter() {
this.adapter.setVisible(true);
this.searcherPane.setVisible(false);
},
}
_showSearcherPane: function () {
_showSearcherPane() {
this.searcherPane.setVisible(true);
this.adapter.setVisible(false);
},
}
_defaultState: function () {
_defaultState() {
this.trigger.stopEditing();
},
}
_assertValue: function (val) {
_assertValue(val) {
val || (val = {});
val.type || (val.type = BI.Selection.Multi);
val.type || (val.type = Selection.Multi);
val.value || (val.value = []);
return val;
},
}
_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);
// 和复选下拉框同步,allData做缓存是会爆炸的
o.itemsCreator({
type: BI.MultiSelectList.REQ_GET_ALL_DATA,
keywords: keywords
}, function (ob) {
var values = BI.map(ob.items, "value");
digest(values);
});
o.itemsCreator(
{
type: MultiSelectList.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 === 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);
if (this.storeValue.type === res.type) {
var result = BI.Func.getSearchResult(BI.map(this.storeValue.value, function (_i, v) {
return {
text: o.valueFormatter(v) || v,
value: v
};
}), this.trigger.getKeyword());
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])) {
const result = Func.getSearchResult(
map(this.storeValue.value, (_i, v) => {
return {
text: o.valueFormatter(v) || v,
value: v,
};
}),
this.trigger.getKeyword()
);
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;
delete map[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.MultiSelectList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (BI.isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(BI.values(selectedMap));
self._adjust(callback);
});
},
o.itemsCreator(
{
type: MultiSelectList.REQ_GET_ALL_DATA,
keywords: [this.trigger.getKeyword()],
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]])) {
delete selectedMap[items[i]];
}
if (isNull(notSelectedMap[items[i]])) {
newItems.push(item);
}
});
self.storeValue.value = newItems.concat(values(selectedMap));
self._adjust(callback);
}
);
}
_adjust: function (callback) {
var self = this, o = this.options;
_adjust(callback) {
const self = this,
o = this.options;
if (!this._count) {
o.itemsCreator({
type: BI.MultiSelectList.REQ_GET_DATA_LENGTH
}, function (res) {
self._count = res.count;
adjust();
callback();
});
o.itemsCreator(
{
type: MultiSelectList.REQ_GET_DATA_LENGTH,
},
res => {
self._count = res.count;
adjust();
callback();
}
);
} else {
adjust();
callback();
}
function adjust() {
if (self.storeValue.type === BI.Selection.All && self.storeValue.value.length >= self._count) {
if (
self.storeValue.type === Selection.All &&
self.storeValue.value.length >= self._count
) {
self.storeValue = {
type: BI.Selection.Multi,
value: []
type: Selection.Multi,
value: [],
};
} else if (self.storeValue.type === BI.Selection.Multi && self.storeValue.value.length >= self._count) {
} else if (
self.storeValue.type === Selection.Multi &&
self.storeValue.value.length >= self._count
) {
self.storeValue = {
type: BI.Selection.All,
value: []
type: Selection.All,
value: [],
};
}
}
},
}
_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);
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;
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.adapter.setStartValue(value);
},
}
isAllSelected: function () {
isAllSelected() {
return this.adapter.isAllSelected();
},
}
resize: function () {
// this.trigger.getCounter().adjustView();
// this.trigger.adjustView();
},
setValue: function (v) {
resize() {
}
setValue(v) {
this.storeValue = v || {};
this._assertValue(this.storeValue);
this.adapter.setValue(this.storeValue);
this.trigger.setValue(this.storeValue);
},
getValue: function () {
return BI.deepClone(this.storeValue);
},
populate: function () {
this.adapter.populate.apply(this.adapter, arguments);
this.trigger.populate.apply(this.trigger, arguments);
}
});
BI.extend(BI.MultiSelectList, {
REQ_GET_DATA_LENGTH: 1,
REQ_GET_ALL_DATA: -1
});
getValue() {
return deepClone(this.storeValue);
}
BI.MultiSelectList.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_list", BI.MultiSelectList);
populate() {
this.adapter.populate(...arguments);
this.trigger.populate(...arguments);
}
}

Loading…
Cancel
Save