Browse Source

Merge branch 'es6' of ssh://code.fineres.com:7999/~zhenfei.li/fineui into es6

es6
Zhenfei.Li 2 years ago
parent
commit
2799feb5b7
  1. 81
      es6.js
  2. 3
      es6.xtype.js
  3. 30
      src/case/list/list.select.js
  4. 14
      src/widget/index.js
  5. 4
      src/widget/multiselect/index.js
  6. 3
      src/widget/multiselectlist/index.js
  7. 444
      src/widget/multiselectlist/multiselectlist.insert.js
  8. 463
      src/widget/multiselectlist/multiselectlist.insert.nobar.js
  9. 448
      src/widget/multiselectlist/multiselectlist.js

81
es6.js

@ -4,6 +4,22 @@ const prettier = require("prettier");
const { exec } = require("child_process"); const { exec } = require("child_process");
const { search, initDepts, depts } = require("./es6.xtype"); const { search, initDepts, depts } = require("./es6.xtype");
// const XTYPE_ONLY = false;
// const THIS_REPLACE = false;
function objHaveFunction(obj) {
return Object.keys(obj).some(key => {
const value = obj[key];
if (typeof value === "object") {
return objHaveFunction(value);
} else if (typeof value === "function") {
return true;
}
return false;
});
}
async function fix(path) { async function fix(path) {
new Promise(res => { new Promise(res => {
exec(`yarn eslint --fix ${path}`, () => { exec(`yarn eslint --fix ${path}`, () => {
@ -54,7 +70,7 @@ const target = [
// 加载模块 // 加载模块
const loader = { const loader = {
G: { "@/core": { shortcut: true } }, // G: { "@/core": { shortcut: true } },
load(srcName, module) { load(srcName, module) {
const G = loader.G; const G = loader.G;
if (target.indexOf(module) >= 0) { if (target.indexOf(module) >= 0) {
@ -88,24 +104,27 @@ const loader = {
}; };
async function handleFile(srcName) { async function handleFile(srcName) {
const G = loader.G; // 全局状态回归
const G = loader.G = { "@/core": { shortcut: true } };
const sourceCode = fs.readFileSync(srcName).toString(); const sourceCode = fs.readFileSync(srcName).toString();
const result = /BI\.(.*?)\s\=\sBI\.inherit\(/.exec(sourceCode); const result = /BI\.(.*?)\s=\sBI\.inherit\(/.exec(sourceCode);
if (!result) { if (!result) {
console.log(`可能是已经es6过了 ${srcName}, 尝试替换 xtype`); console.log(`已经es6过,替换 xtype => ${srcName}`);
// 处理 xtype // 处理 xtype
// 尝试对 xtype 进行替换 // 尝试对 xtype 进行替换
const noXtypeCode = sourceCode.replace(/"bi\.(.*?)"/g, matchedSentence => { const noXtypeCode = sourceCode.replace(/type:\s?"bi\.(.*?)"/g, v => {
const matchedSentence = v.replace(/type:\s?/, "");
const loadSuccess = loader.load(srcName, matchedSentence); const loadSuccess = loader.load(srcName, matchedSentence);
if (loadSuccess) { if (loadSuccess) {
const clzName = depts[matchedSentence].clzName; const clzName = depts[matchedSentence].clzName;
return `${clzName}.xtype`; return `type: ${clzName}.xtype`;
} else { } else {
console.log(`加载 ${matchedSentence}失败`); console.log(`xtype 替换失败 ${matchedSentence} `);
return matchedSentence; return matchedSentence;
} }
@ -128,6 +147,7 @@ async function handleFile(srcName) {
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
const BI = { const BI = {
[clzName]: clzName,
inherit(_, options) { inherit(_, options) {
collection.methods = Object.keys(options) collection.methods = Object.keys(options)
.filter(key => typeof options[key] === "function") .filter(key => typeof options[key] === "function")
@ -140,6 +160,9 @@ async function handleFile(srcName) {
return collection.static; return collection.static;
}, },
extend(targetClz, o) {
Object.assign(collection.static, o);
},
shortcut(xtype) { shortcut(xtype) {
collection.xtype = xtype; collection.xtype = xtype;
}, },
@ -156,12 +179,35 @@ async function handleFile(srcName) {
loader.load(srcName, superName); loader.load(srcName, superName);
Object.keys(collection.attr).forEach(key => { Object.keys(collection.attr).forEach(key => {
A = `${key} = ${JSON.stringify(collection.attr[key])};`; const value = collection.attr[key];
if (typeof value === "function" || typeof value === "number") {
A += `\t${key} = ${value}\n`;
} else if (typeof value === "string") {
A += `\t${key} = "${value}"\n`;
} else if (typeof value === "object") {
if (objHaveFunction(value)) {
throw new Error("G");
} else {
A += `\t${key} = ${JSON.stringify(value)}\n`;
}
}
}); });
// 静态方法 // 静态方法
Object.keys(collection.static).forEach(key => { Object.keys(collection.static).forEach(key => {
E += `\tstatic ${key} = "${collection.static[key]}"\n`; // console.log(key, collection.static[key], typeof collection.static[key])
const value = collection.static[key];
if (typeof value === "function" || typeof value === "number") {
E += `\tstatic ${key} = ${value}\n`;
} else if (typeof value === "string") {
E += `\tstatic ${key} = "${value}"\n`;
} else if (typeof value === "object") {
if (objHaveFunction(value)) {
throw new Error("G");
} else {
E += `\tstatic ${key} = ${JSON.stringify(value)}\n`;
}
}
}); });
// 对函数进行替换 // 对函数进行替换
@ -194,7 +240,7 @@ async function handleFile(srcName) {
if (loadSuccess) { if (loadSuccess) {
return target + end; return target + end;
} else { } else {
console.log(`BI.xxx 加载 ${target}失败`); console.log(`BI 变量替换失败 BI.${target}`);
return matchedSentence; return matchedSentence;
} }
@ -208,7 +254,7 @@ async function handleFile(srcName) {
return `${clzName}.xtype`; return `${clzName}.xtype`;
} else { } else {
console.log(`加载 ${matchedSentence}失败`); // console.log(`(没事) xtype 替换失败 ${matchedSentence} `);
return matchedSentence; return matchedSentence;
} }
@ -226,8 +272,10 @@ async function handleFile(srcName) {
Object.keys(G[moduleKey]).forEach(key => { Object.keys(G[moduleKey]).forEach(key => {
i += `${key}, `; i += `${key}, `;
}); });
const single = !/\//.test(moduleKey);
if (single) { // 必须以 . 开头
const moduleInValid = /^[^@.]/.test(moduleKey);
if (moduleInValid) {
moduleKey = `./${moduleKey}`; moduleKey = `./${moduleKey}`;
} }
@ -251,6 +299,7 @@ ${M}
const prettierCode = prettier.format(outputCode, { const prettierCode = prettier.format(outputCode, {
tabWidth: 4, tabWidth: 4,
parser: 'babel',
}); });
fs.writeFileSync(srcName, prettierCode); fs.writeFileSync(srcName, prettierCode);
await fix(srcName); await fix(srcName);
@ -262,7 +311,13 @@ async function traverse(srcName) {
if (srcName.indexOf("__test__") >= 0) return; if (srcName.indexOf("__test__") >= 0) return;
if (srcName.endsWith(".js")) { if (srcName.endsWith(".js")) {
try {
return await handleFile(srcName); return await handleFile(srcName);
} catch (error) {
console.log(`文件处理失败 ${srcName} \n${error}`);
return;
}
} else { } else {
const stat = fs.statSync(srcName); const stat = fs.statSync(srcName);
const flag = stat.isDirectory(); const flag = stat.isDirectory();

3
es6.xtype.js

@ -10,9 +10,8 @@ async function handle(filename) {
let clzName; let clzName;
if (inheritRegResult) { if (inheritRegResult) {
clzName = inheritRegResult[1]; clzName = inheritRegResult[1];
// 把
} else { } else {
const clzRegResult = /export\sclass\s(.*?)\sextend/.exec(code); const clzRegResult = /export\s+class\s+(.*?)\s+/.exec(code);
if (clzRegResult) { if (clzRegResult) {
clzName = clzRegResult[1]; clzName = clzRegResult[1];

30
src/case/list/list.select.js

@ -1,16 +1,32 @@
/* eslint-disable no-mixed-spaces-and-tabs */ /* eslint-disable no-mixed-spaces-and-tabs */
import { shortcut, Widget, extend, emptyFn, Controller, createWidget, Events, isNotNull, isEmptyString, isEmptyArray, Direction, get, LogicFactory, each, pixFormat } from "@/core"; import {
shortcut,
Widget,
extend,
emptyFn,
Controller,
createWidget,
Events,
isNotNull,
isEmptyString,
isEmptyArray,
Direction,
get,
LogicFactory,
each,
pixFormat
} from "@/core";
import { ButtonGroup } from "@/base"; import { ButtonGroup } from "@/base";
import { MultiSelectBar } from "../toolbar/toolbar.multiselect";
import { ListPane } from "../layer/pane.list";
@shortcut() @shortcut()
export class SelectList extends Widget { export class SelectList extends Widget {
static xtype = "bi.select_list"; static xtype = "bi.select_list";
static EVENT_CHANGE = "EVENT_CHANGE"; static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() { _defaultConfig() {
return extend(super._defaultConfig(...arguments), { return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-list", baseCls: "bi-select-list",
@ -23,11 +39,11 @@ export class SelectList extends Widget {
hasNext: emptyFn, hasNext: emptyFn,
onLoaded: emptyFn, onLoaded: emptyFn,
toolbar: { toolbar: {
type: "bi.multi_select_bar", type: MultiSelectBar.xtype,
iconWrapperWidth: 36, iconWrapperWidth: 36,
}, },
el: { el: {
type: "bi.list_pane", type: ListPane.xtype,
}, },
}); });
} }
@ -49,7 +65,7 @@ export class SelectList extends Widget {
}); });
this.list = createWidget(o.el, { this.list = createWidget(o.el, {
type: "bi.list_pane", type: ListPane.xtype,
items: o.items, items: o.items,
itemsCreator(op, callback) { itemsCreator(op, callback) {
op.times === 1 && this.toolbar.setVisible(false); op.times === 1 && this.toolbar.setVisible(false);

14
src/widget/index.js

@ -14,6 +14,8 @@ import { MultiTreeInsertCombo } from "./multitree/multi.tree.insert.combo";
import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo"; import { MultiTreeListCombo } from "./multitree/multi.tree.list.combo";
import { NumberEditor } from "./numbereditor/number.editor"; import { NumberEditor } from "./numbereditor/number.editor";
import { NumberInterval } from "./numberinterval/numberinterval"; import { NumberInterval } from "./numberinterval/numberinterval";
import * as multiselect from "./multiselect";
import * as multiselectlist from "./multiselectlist";
Object.assign(BI, { Object.assign(BI, {
Collapse, Collapse,
@ -32,6 +34,8 @@ Object.assign(BI, {
MultiTreeListCombo, MultiTreeListCombo,
NumberEditor, NumberEditor,
NumberInterval, NumberInterval,
...multiselect,
...multiselectlist,
}); });
export * from "./date/calendar"; export * from "./date/calendar";
@ -40,8 +44,16 @@ export * from "./datepane";
export * from "./datetime"; export * from "./datetime";
export * from "./datetimepane"; export * from "./datetimepane";
export * from "./dynamicdatetime"; export * from "./dynamicdatetime";
export * from "./time"; export * from "./time
export * from "./editor"; export * from "./editor";
export { SelectTreeCombo } from "./selecttree/selecttree.combo";
export { SingleTreeCombo } from "./singletree/singletree.combo";
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 { export {
Collapse, Collapse,
NumberEditor, NumberEditor,

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";

444
src/widget/multiselectlist/multiselectlist.insert.js

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

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

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

448
src/widget/multiselectlist/multiselectlist.js

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

Loading…
Cancel
Save