Browse Source

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

es6
Zhenfei.Li 2 years ago
parent
commit
9d331edf5c
  1. 2
      es6.js
  2. 13
      src/case/button/node/treenode.js
  3. 10
      src/case/button/treeitem/treeitem.js
  4. 1
      src/case/index.js
  5. 8
      src/case/tree/tree.level.js
  6. 25
      src/core/func/function.js
  7. 15
      src/widget/index.js
  8. 216
      src/widget/multiselect/multiselect.trigger.js
  9. 146
      src/widget/multiselect/trigger/button.checkselected.js
  10. 121
      src/widget/multiselect/trigger/editor.multiselect.js
  11. 255
      src/widget/multiselect/trigger/searcher.multiselect.js
  12. 154
      src/widget/multiselect/trigger/switcher.checkselected.js
  13. 240
      src/widget/multiselecttree/multiselecttree.js
  14. 77
      src/widget/multiselecttree/multiselecttree.popup.js
  15. 147
      src/widget/multitree/check/multi.tree.check.pane.js
  16. 371
      src/widget/multitree/multi.tree.combo.js
  17. 371
      src/widget/multitree/multi.tree.insert.combo.js
  18. 460
      src/widget/multitree/multi.tree.list.combo.js
  19. 114
      src/widget/multitree/multi.tree.popup.js
  20. 93
      src/widget/multitree/trigger/multi.tree.button.checkselected.js
  21. 199
      src/widget/multitree/trigger/multi.tree.search.insert.pane.js
  22. 132
      src/widget/multitree/trigger/multi.tree.search.pane.js
  23. 235
      src/widget/multitree/trigger/searcher.list.multi.tree.js
  24. 290
      src/widget/multitree/trigger/searcher.multi.tree.js
  25. 129
      src/widget/selecttree/nodes/node.first.plus.js
  26. 129
      src/widget/selecttree/nodes/node.last.plus.js
  27. 129
      src/widget/selecttree/nodes/node.mid.plus.js
  28. 129
      src/widget/selecttree/nodes/node.plus.js
  29. 114
      src/widget/selecttree/selecttree.combo.js
  30. 77
      src/widget/selecttree/selecttree.expander.js
  31. 125
      src/widget/selecttree/selecttree.popup.js
  32. 147
      src/widget/singletree/singletree.combo.js
  33. 78
      src/widget/singletree/singletree.popup.js
  34. 91
      src/widget/singletree/singletree.trigger.js

2
es6.js

@ -45,6 +45,8 @@ const target = [
"VerticalAlign", "VerticalAlign",
"transformItems", "transformItems",
"print", "print",
"Tree",
"Func",
]; ];
// 加载模块 // 加载模块

13
src/case/button/node/treenode.js

@ -1,5 +1,6 @@
import { NodeButton } from "../../../base/single/button/button.node"; import { Label, NodeButton } from "@/base";
import { shortcut, extend } from "../../../core"; import { shortcut, extend, VerticalAdaptLayout } from "@/core";
import { TreeNodeSwitcher } from "@/case";
@shortcut() @shortcut()
export class BasicTreeNode extends NodeButton { export class BasicTreeNode extends NodeButton {
@ -27,7 +28,7 @@ export class BasicTreeNode extends NodeButton {
const o = this.options; const o = this.options;
const checkbox = { const checkbox = {
type: "bi.tree_node_switcher", type: TreeNodeSwitcher.xtype,
ref: _ref => { ref: _ref => {
this.switcher = _ref; this.switcher = _ref;
}, },
@ -39,7 +40,7 @@ export class BasicTreeNode extends NodeButton {
layer: o.layer, layer: o.layer,
...o.switcherIcon, ...o.switcherIcon,
stopPropagation: o.selectable, stopPropagation: o.selectable,
mounted () { mounted() {
this.setEnable(true); this.setEnable(true);
}, },
listeners: [ listeners: [
@ -55,7 +56,7 @@ export class BasicTreeNode extends NodeButton {
}; };
return { return {
type: "bi.vertical_adapt", type: VerticalAdaptLayout.xtype,
columnSize: [o.iconWrapperWidth || o.height, "fill"], columnSize: [o.iconWrapperWidth || o.height, "fill"],
items: [ items: [
{ {
@ -63,7 +64,7 @@ export class BasicTreeNode extends NodeButton {
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2, // 偏移公式为每一层的偏移量为节点高度的一半 lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2, // 偏移公式为每一层的偏移量为节点高度的一半
}, { }, {
el: { el: {
type: "bi.label", type: Label.xtype,
ref: _ref => { ref: _ref => {
this.text = _ref; this.text = _ref;
}, },

10
src/case/button/treeitem/treeitem.js

@ -1,5 +1,5 @@
import { NodeButton } from "../../../base/single/button/button.node"; import { shortcut, extend, VerticalAdaptLayout, Layout } from "@/core";
import { shortcut, extend } from "../../../core"; import { NodeButton, Label } from "@/base";
@shortcut() @shortcut()
export class BasicTreeItem extends NodeButton { export class BasicTreeItem extends NodeButton {
@ -23,12 +23,12 @@ export class BasicTreeItem extends NodeButton {
const o = this.options; const o = this.options;
return { return {
type: "bi.vertical_adapt", type: VerticalAdaptLayout.xtype,
columnSize: ["", "fill"], columnSize: ["", "fill"],
items: [ items: [
{ {
el: { el: {
type: "bi.layout", type: Layout.xtype,
height: o.height, height: o.height,
width: o.height, width: o.height,
cls: this.getLineCls(), cls: this.getLineCls(),
@ -37,7 +37,7 @@ export class BasicTreeItem extends NodeButton {
}, },
{ {
el: { el: {
type: "bi.label", type: Label.xtype,
ref: _ref => { ref: _ref => {
this.text = _ref; this.text = _ref;
}, },

1
src/case/index.js

@ -40,6 +40,7 @@ export * from "./loader";
export * from "./segment"; export * from "./segment";
export * from "./layer"; export * from "./layer";
export * from "./linearsegment"; export * from "./linearsegment";
export * from "./checkbox";
export { export {
MultiSelectBar, MultiSelectBar,
SelectList SelectList

8
src/case/tree/tree.level.js

@ -9,7 +9,7 @@ import {
isNotEmptyArray, isNotEmptyArray,
Tree, Tree,
createWidget, createWidget,
VerticalLayout VerticalLayout, Controller, Events
} from "@/core"; } from "@/core";
import { ButtonTree, CustomTree } from "@/base"; import { ButtonTree, CustomTree } from "@/base";
import { TreeExpander } from "./treeexpander/tree.expander"; import { TreeExpander } from "./treeexpander/tree.expander";
@ -102,9 +102,9 @@ export class LevelTree extends Widget {
], ],
}, o.el), }, o.el),
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function (type, value, ob) { this.tree.on(Controller.EVENT_CHANGE, function (type, value, ob) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
self.fireEvent(LevelTree.EVENT_CHANGE, value, ob); self.fireEvent(LevelTree.EVENT_CHANGE, value, ob);
self.setValue(value); self.setValue(value);
} }

25
src/core/func/function.js

@ -15,13 +15,12 @@ export function createDistinctName(array, name) {
let src = name, idx = 1; let src = name, idx = 1;
name = name || ""; name = name || "";
while (true) { while (true) {
if (every(array, function (i, item) { if (every(array, (i, item) => isKey(item) ? item !== name : item.name !== name)) {
return isKey(item) ? item !== name : item.name !== name;
})) {
break; break;
} }
name = src + (idx++); name = src + (idx++);
} }
return name; return name;
} }
@ -31,8 +30,9 @@ export function createDistinctName(array, name) {
* @return {number} * @return {number}
*/ */
export function getGBWidth(str) { export function getGBWidth(str) {
str = str + ""; str = `${str}`;
str = str.replace(/[^\x00-\xff]/g, "xx"); str = str.replace(/[^\x00-\xff]/g, "xx");
return Math.ceil(str.length / 2); return Math.ceil(str.length / 2);
} }
@ -55,7 +55,7 @@ export function getSearchResult(items, keyword, param) {
let t, text, py; let t, text, py;
keyword = toUpperCase(keyword); keyword = toUpperCase(keyword);
const matched = array ? [] : {}, find = array ? [] : {}; const matched = array ? [] : {}, find = array ? [] : {};
each(items, function (i, item) { each(items, (i, item) => {
// 兼容item为null的处理 // 兼容item为null的处理
if (isNull(item)) { if (isNull(item)) {
return; return;
@ -77,7 +77,7 @@ export function getSearchResult(items, keyword, param) {
} else { } else {
array ? find.push(item) : (find[i] = item); array ? find.push(item) : (find[i] = item);
} }
} else { // BI-56386 这边两个pid / text.length是为了防止截取的首字符串不是完整的,但光这样做还不够,即时错位了,也不能说明就不符合条件 } else { // BI-56386 这边两个pid / text.length是为了防止截取的首字符串不是完整的,但光这样做还不够,即时错位了,也不能说明就不符合条件
pidx = py.indexOf(keyword); pidx = py.indexOf(keyword);
if (pidx > -1) { if (pidx > -1) {
if (text === keyword || keyword.length === text.length) { if (text === keyword || keyword.length === text.length) {
@ -88,9 +88,10 @@ export function getSearchResult(items, keyword, param) {
} }
} }
}); });
return { return {
match: matched, match: matched,
find: find, find,
}; };
} }
@ -100,7 +101,7 @@ export function getSearchResult(items, keyword, param) {
* @param key * @param key
* @return {any[]} * @return {any[]}
*/ */
export function getSortedResult(items, key) { export function getSortedResult(items, key = null) {
const getTextOfItem = BI.isFunction(key) ? key : const getTextOfItem = BI.isFunction(key) ? key :
function (item, key) { function (item, key) {
if (BI.isNotNull(key)) { if (BI.isNotNull(key)) {
@ -112,10 +113,11 @@ export function getSortedResult(items, key) {
if (BI.isNotNull(item.value)) { if (BI.isNotNull(item.value)) {
return item.value; return item.value;
} }
return item; return item;
}; };
return items.sort(function (item1, item2) { return items.sort((item1, item2) => {
const str1 = getTextOfItem(item1, key); const str1 = getTextOfItem(item1, key);
const str2 = getTextOfItem(item2, key); const str2 = getTextOfItem(item2, key);
if (BI.isNull(str1) && BI.isNull(str2)) { if (BI.isNull(str1) && BI.isNull(str2)) {
@ -139,28 +141,33 @@ export function getSortedResult(items, key) {
return (BI.isNull(BI.CODE_INDEX[char1]) ? BI.MAX : BI.CODE_INDEX[char1]) - (BI.isNull(BI.CODE_INDEX[char2]) ? BI.MAX : BI.CODE_INDEX[char2]); return (BI.isNull(BI.CODE_INDEX[char1]) ? BI.MAX : BI.CODE_INDEX[char1]) - (BI.isNull(BI.CODE_INDEX[char2]) ? BI.MAX : BI.CODE_INDEX[char2]);
} }
} }
return len1 - len2; return len1 - len2;
}); });
} }
export function beforeFunc(sFunc, func) { export function beforeFunc(sFunc, func) {
const __self = sFunc; const __self = sFunc;
return function () { return function () {
if (func.apply(sFunc, arguments) === false) { if (func.apply(sFunc, arguments) === false) {
return false; return false;
} }
return __self.apply(sFunc, arguments); return __self.apply(sFunc, arguments);
}; };
} }
export function afterFunc(sFunc, func) { export function afterFunc(sFunc, func) {
const __self = sFunc; const __self = sFunc;
return function () { return function () {
const ret = __self.apply(sFunc, arguments); const ret = __self.apply(sFunc, arguments);
if (ret === false) { if (ret === false) {
return false; return false;
} }
func.apply(sFunc, arguments); func.apply(sFunc, arguments);
return ret; return ret;
}; };
} }

15
src/widget/index.js

@ -6,6 +6,11 @@ import * as datetime from "./datetime";
import * as datetimepane from "./datetimepane"; import * as datetimepane from "./datetimepane";
import * as dynamicdatetime from "./dynamicdatetime"; import * as dynamicdatetime from "./dynamicdatetime";
import * as time from "./time"; import * as time from "./time";
import { SelectTreeCombo } from "./selecttree/selecttree.combo";
import { SingleTreeCombo } from "./singletree/singletree.combo";
import { MultiTreeCombo } from "/multitree/multi.tree.combo";
import { MultiTreeInsertCombo } from "/multitree/multi.tree.insert.combo";
import { MultiTreeListCombo } from "/multitree/multi.tree.list.combo";
Object.assign(BI, { Object.assign(BI, {
Collapse, Collapse,
@ -16,6 +21,11 @@ Object.assign(BI, {
...datetimepane, ...datetimepane,
...dynamicdatetime, ...dynamicdatetime,
...time, ...time,
SelectTreeCombo,
SingleTreeCombo,
MultiTreeCombo,
MultiTreeInsertCombo,
MultiTreeListCombo
}); });
export * from "./date/calendar"; export * from "./date/calendar";
@ -25,6 +35,11 @@ export * from "./datetime";
export * from "./datetimepane"; export * from "./datetimepane";
export * from "./dynamicdatetime"; export * from "./dynamicdatetime";
export * from "./time"; export * from "./time";
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 { export {
Collapse Collapse
}; };

216
src/widget/multiselect/multiselect.trigger.js

@ -1,40 +1,56 @@
/** import {
* shortcut,
* 复选下拉框 extend,
* @class BI.MultiSelectTrigger emptyFn,
* @extends BI.Trigger createWidget,
*/ isFunction,
Layout,
BI.MultiSelectTrigger = BI.inherit(BI.Trigger, { HTapeLayout,
AbsoluteLayout
constants: { } from "@/core";
height: 14, import { Trigger, Text } from "@/base";
rgap: 4, import { MultiSelectSearcher } from "trigger/searcher.multiselect";
lgap: 4
}, @shortcut()
export class MultiSelectTrigger extends Trigger {
_defaultConfig: function () { static xtype = "bi.multi_select_trigger";
return BI.extend(BI.MultiSelectTrigger.superclass._defaultConfig.apply(this, arguments), {
constants = { height: 14, rgap: 4, lgap: 4 };
static EVENT_TRIGGER_CLICK = "EVENT_TRIGGER_CLICK";
static EVENT_COUNTER_CLICK = "EVENT_COUNTER_CLICK";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_START = "EVENT_START";
static EVENT_STOP = "EVENT_STOP";
static EVENT_PAUSE = "EVENT_PAUSE";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_BEFORE_COUNTER_POPUPVIEW = "EVENT_BEFORE_COUNTER_POPUPVIEW";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_FOCUS = "EVENT_FOCUS";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-trigger", baseCls: "bi-multi-select-trigger",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
searcher: {}, searcher: {},
switcher: {}, switcher: {},
adapter: null, adapter: null,
masker: {}, masker: {},
allowEdit: true, allowEdit: true,
itemHeight: 24 itemHeight: 24,
}); });
}, }
_init: function () { _init() {
BI.MultiSelectTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.searcher = BI.createWidget(o.searcher, { this.searcher = createWidget(o.searcher, {
type: "bi.multi_select_searcher", type: MultiSelectSearcher.xtype,
height: o.height, height: o.height,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
@ -46,125 +62,111 @@ BI.MultiSelectTrigger = BI.inherit(BI.Trigger, {
popup: {}, popup: {},
adapter: o.adapter, adapter: o.adapter,
masker: o.masker, masker: o.masker,
value: o.value value: o.value,
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_START, function () { this.searcher.on(MultiSelectSearcher.EVENT_START, () => {
self.fireEvent(BI.MultiSelectTrigger.EVENT_START); self.fireEvent(MultiSelectTrigger.EVENT_START);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_PAUSE, function () { this.searcher.on(MultiSelectSearcher.EVENT_PAUSE, () => {
self.fireEvent(BI.MultiSelectTrigger.EVENT_PAUSE); self.fireEvent(MultiSelectTrigger.EVENT_PAUSE);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_SEARCHING, function () { this.searcher.on(MultiSelectSearcher.EVENT_SEARCHING, function () {
self.fireEvent(BI.MultiSelectTrigger.EVENT_SEARCHING, arguments); self.fireEvent(MultiSelectTrigger.EVENT_SEARCHING, arguments);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_STOP, function () { this.searcher.on(MultiSelectSearcher.EVENT_STOP, () => {
self.fireEvent(BI.MultiSelectTrigger.EVENT_STOP); self.fireEvent(MultiSelectTrigger.EVENT_STOP);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_CHANGE, function () { this.searcher.on(MultiSelectSearcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectTrigger.EVENT_CHANGE, arguments); self.fireEvent(MultiSelectTrigger.EVENT_CHANGE, arguments);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_BLUR, function () { this.searcher.on(MultiSelectSearcher.EVENT_BLUR, () => {
self.fireEvent(BI.MultiSelectTrigger.EVENT_BLUR); self.fireEvent(MultiSelectTrigger.EVENT_BLUR);
}); });
this.searcher.on(BI.MultiSelectSearcher.EVENT_FOCUS, function () { this.searcher.on(MultiSelectSearcher.EVENT_FOCUS, () => {
self.fireEvent(BI.MultiSelectTrigger.EVENT_FOCUS); self.fireEvent(MultiSelectTrigger.EVENT_FOCUS);
}); });
this.wrapNumberCounter = BI.createWidget({ this.wrapNumberCounter = createWidget({
type: "bi.layout" type: Layout.xtype,
}); });
this.wrapper = BI.createWidget({ this.wrapper = createWidget({
type: "bi.htape", type: HTapeLayout.xtype,
element: this, element: this,
items: [ items: [
{ {
el: this.searcher, el: this.searcher,
width: "fill", width: "fill",
rgap: 24 rgap: 24,
} }
] ],
}); });
!o.allowEdit && BI.createWidget({ !o.allowEdit &&
type: "bi.absolute", createWidget({
element: this, type: AbsoluteLayout.xtype,
items: [ element: this,
{ items: [
el: { {
type: "bi.text", el: {
title: function () { type: Text.xtype,
/** 修正REPORT-73699引入,需要考虑到传递过来的值是方法的情况 */ title () {
var state = self.searcher.getState(); /** 修正REPORT-73699引入,需要考虑到传递过来的值是方法的情况 */
if (BI.isFunction(state)) { const state = self.searcher.getState();
return state(); if (isFunction(state)) {
} return state();
return state; }
}
}, return state;
left: 0, },
right: 24, },
top: 0, left: 0,
bottom: 0 right: 24,
} top: 0,
] bottom: 0,
}); }
}, ],
});
}
/** refreshPlaceHolderWidth(width) {
* 重新调整numberCounter的空白占位符
*/
refreshPlaceHolderWidth: function (width) {
this.wrapper.attr("items")[0].rgap = 24 + width; this.wrapper.attr("items")[0].rgap = 24 + width;
this.wrapper.resize(); this.wrapper.resize();
}, }
getSearcher: function () { getSearcher() {
return this.searcher; return this.searcher;
}, }
stopEditing: function () { stopEditing() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
setAdapter: function (adapter) { setAdapter(adapter) {
this.searcher.setAdapter(adapter); this.searcher.setAdapter(adapter);
}, }
setValue: function (ob) { setValue(ob) {
this.searcher.setValue(ob); this.searcher.setValue(ob);
}, }
getKey: function () { getKey() {
return this.searcher.getKey(); return this.searcher.getKey();
}, }
getValue: function () { getValue() {
return this.searcher.getValue(); return this.searcher.getValue();
}, }
focus: function () { focus() {
this.searcher.focus(); this.searcher.focus();
}, }
blur: function () { blur() {
this.searcher.blur(); this.searcher.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.searcher.setWaterMark(v); this.searcher.setWaterMark(v);
} }
}); }
BI.MultiSelectTrigger.EVENT_TRIGGER_CLICK = "EVENT_TRIGGER_CLICK";
BI.MultiSelectTrigger.EVENT_COUNTER_CLICK = "EVENT_COUNTER_CLICK";
BI.MultiSelectTrigger.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiSelectTrigger.EVENT_START = "EVENT_START";
BI.MultiSelectTrigger.EVENT_STOP = "EVENT_STOP";
BI.MultiSelectTrigger.EVENT_PAUSE = "EVENT_PAUSE";
BI.MultiSelectTrigger.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiSelectTrigger.EVENT_BEFORE_COUNTER_POPUPVIEW = "EVENT_BEFORE_COUNTER_POPUPVIEW";
BI.MultiSelectTrigger.EVENT_BLUR = "EVENT_BLUR";
BI.MultiSelectTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.shortcut("bi.multi_select_trigger", BI.MultiSelectTrigger);

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

@ -1,102 +1,122 @@
/** import {
* 查看已选按钮 shortcut,
* Created by guy on 15/11/3. extend,
* @class BI.MultiSelectCheckSelectedButton emptyFn,
* @extends BI.Single createWidget,
*/ Controller,
BI.MultiSelectCheckSelectedButton = BI.inherit(BI.Single, { i18nText,
isNotNull,
isNotEmptyString,
nextTick
} from "@/core";
import { Single, TextButton } from "@/base";
import { MultiSelectCombo } from "../multiselect.combo";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiSelectCheckSelectedButton.superclass._defaultConfig.apply(this, arguments), { export class MultiSelectCheckSelectedButton extends Single {
static xtype = "bi.multi_select_check_selected_button";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-check-selected-button", baseCls: "bi-multi-select-check-selected-button",
itemsCreator: BI.emptyFn itemsCreator: emptyFn,
}); });
}, }
_init: function () { _init() {
BI.MultiSelectCheckSelectedButton.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.numberCounter = BI.createWidget({ o = this.options;
type: "bi.text_button", this.numberCounter = createWidget({
type: TextButton.xtype,
element: this, element: this,
hgap: 4, hgap: 4,
text: "0", text: "0",
textAlign: "center", textAlign: "center",
textHeight: 16, textHeight: 16,
cls: "bi-high-light-background count-tip" cls: "bi-high-light-background count-tip",
}); });
this.numberCounter.on(BI.Controller.EVENT_CHANGE, function () { this.numberCounter.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.numberCounter.on(BI.TextButton.EVENT_CHANGE, function () { this.numberCounter.on(TextButton.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectCheckSelectedButton.EVENT_CHANGE, arguments); self.fireEvent(
MultiSelectCheckSelectedButton.EVENT_CHANGE,
arguments
);
}); });
this.numberCounter.element.hover(function () { this.numberCounter.element.hover(
self.numberCounter.setTag(self.numberCounter.getText()); () => {
self.numberCounter.setText(BI.i18nText("BI-Check_Selected")); self.numberCounter.setTag(self.numberCounter.getText());
}, function () { self.numberCounter.setText(i18nText("BI-Check_Selected"));
self.numberCounter.setText(self.numberCounter.getTag()); },
}); () => {
self.numberCounter.setText(self.numberCounter.getTag());
}
);
this.setVisible(false); this.setVisible(false);
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setValue(o.value); this.setValue(o.value);
} }
}, }
_populate: function (ob) { _populate(ob) {
var self = this, o = this.options; const self = this,
o = this.options;
if (ob.type === BI.Selection.All) { if (ob.type === BI.Selection.All) {
o.itemsCreator({ o.itemsCreator(
type: BI.MultiSelectCombo.REQ_GET_DATA_LENGTH {
}, function (res) { type: MultiSelectCombo.REQ_GET_DATA_LENGTH,
if (self.options.value.type !== BI.Selection.All) { },
return; res => {
} if (self.options.value.type !== BI.Selection.All) {
if (BI.isNotEmptyString(res.count)) { return;
BI.nextTick(function () { }
self.numberCounter.setText(res.count); if (isNotEmptyString(res.count)) {
self.setVisible(true); nextTick(() => {
}); self.numberCounter.setText(res.count);
self.setVisible(true);
});
return; return;
}
const length = res.count - ob.value.length;
nextTick(() => {
self.numberCounter.setText(length);
self.setVisible(length > 0);
});
} }
var length = res.count - ob.value.length; );
BI.nextTick(function () {
self.numberCounter.setText(length);
self.setVisible(length > 0);
});
});
return; return;
} }
BI.nextTick(function () { nextTick(() => {
self.numberCounter.setText(ob.value.length); self.numberCounter.setText(ob.value.length);
self.setVisible(ob.value.length > 0); self.setVisible(ob.value.length > 0);
}); });
}, }
_assertValue: function (ob) { _assertValue(ob) {
ob || (ob = {}); ob || (ob = {});
ob.type || (ob.type = BI.Selection.Multi); ob.type || (ob.type = BI.Selection.Multi);
ob.value || (ob.value = []); ob.value || (ob.value = []);
return ob; return ob;
}, }
setValue: function (ob) { setValue(ob) {
ob = this._assertValue(ob); ob = this._assertValue(ob);
this.options.value = ob; this.options.value = ob;
this._populate(ob); this._populate(ob);
}, }
populate: function () { populate() {
this._populate(this._assertValue(this.options.value)); this._populate(this._assertValue(this.options.value));
},
getValue: function () {
} }
});
BI.MultiSelectCheckSelectedButton.EVENT_CHANGE = "EVENT_CHANGE"; getValue() {}
BI.shortcut("bi.multi_select_check_selected_button", BI.MultiSelectCheckSelectedButton); }

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

@ -1,23 +1,36 @@
/** import {
* 多选输入框 shortcut,
* Created by guy on 15/11/3. Widget,
* @class BI.MultiSelectEditor extend,
* @extends Widget i18nText,
*/ createWidget,
BI.MultiSelectEditor = BI.inherit(BI.Widget, { Controller,
isEmptyString,
_defaultConfig: function () { isEmptyArray
return BI.extend(BI.MultiSelectEditor.superclass._defaultConfig.apply(this, arguments), { } from "@/core";
import { StateEditor } from "@/case";
@shortcut()
export class MultiSelectEditor extends Widget {
static xtype = "bi.multi_select_editor";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_PAUSE = "EVENT_PAUSE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-editor", baseCls: "bi-multi-select-editor",
el: {}, el: {},
watermark: BI.i18nText("BI-Basic_Search") watermark: i18nText("BI-Basic_Search"),
}); });
}, }
_init: function () { _init() {
BI.MultiSelectEditor.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.editor = BI.createWidget(o.el, { o = this.options;
this.editor = createWidget(o.el, {
type: "bi.select_patch_editor", type: "bi.select_patch_editor",
element: this, element: this,
height: o.height, height: o.height,
@ -30,49 +43,49 @@ BI.MultiSelectEditor = BI.inherit(BI.Widget, {
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
}); });
this.editor.on(BI.Controller.EVENT_CHANGE, function () { this.editor.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.editor.on(BI.StateEditor.EVENT_FOCUS, function () { this.editor.on(StateEditor.EVENT_FOCUS, () => {
self.fireEvent(BI.MultiSelectEditor.EVENT_FOCUS); self.fireEvent(MultiSelectEditor.EVENT_FOCUS);
}); });
this.editor.on(BI.StateEditor.EVENT_BLUR, function () { this.editor.on(StateEditor.EVENT_BLUR, () => {
self.fireEvent(BI.MultiSelectEditor.EVENT_BLUR); self.fireEvent(MultiSelectEditor.EVENT_BLUR);
}); });
}, }
focus: function () { focus() {
this.editor.focus(); this.editor.focus();
}, }
blur: function () { blur() {
this.editor.blur(); this.editor.blur();
}, }
setState: function (state) { setState(state) {
this.editor.setState(state); this.editor.setState(state);
}, }
setValue: function (v) { setValue(v) {
this.editor.setValue(v); this.editor.setValue(v);
}, }
setTipType: function (v) { setTipType(v) {
this.editor.setTipType(v); this.editor.setTipType(v);
}, }
getValue: function () { getValue() {
return this.editor.getValue(); return this.editor.getValue();
}, }
getState: function () { getState() {
return this.editor.getText(); return this.editor.getText();
}, }
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)) {
@ -80,27 +93,21 @@ BI.MultiSelectEditor = BI.inherit(BI.Widget, {
} }
return keywords; return keywords;
}, }
getKeyword: function () { getKeyword() {
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);
} }
return BI.isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
},
populate: function (items) { return isEmptyArray(keywords) ? "" : keywords[keywords.length - 1];
}
}, populate(items) {}
setWaterMark: function (v) { setWaterMark(v) {
this.editor.setWaterMark(v); this.editor.setWaterMark(v);
} }
}); }
BI.MultiSelectEditor.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiSelectEditor.EVENT_BLUR = "EVENT_BLUR";
BI.MultiSelectEditor.EVENT_PAUSE = "EVENT_PAUSE";
BI.shortcut("bi.multi_select_editor", BI.MultiSelectEditor);

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

@ -1,160 +1,187 @@
/** import {
* searcher shortcut,
* Created by guy on 15/11/3. Widget,
* @class BI.MultiSelectSearcher extend,
* @extends Widget emptyFn,
*/ i18nText,
BI.MultiSelectSearcher = BI.inherit(BI.Widget, { createWidget,
isNotNull,
_defaultConfig: function () { size,
return BI.extend(BI.MultiSelectSearcher.superclass._defaultConfig.apply(this, arguments), { each
} from "@/core";
import { MultiSelectEditor } from "editor.multiselect";
import { Searcher } from "@/base";
@shortcut()
export class MultiSelectSearcher extends Widget {
static xtype = "bi.multi_select_searcher";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_START = "EVENT_START";
static EVENT_STOP = "EVENT_STOP";
static EVENT_PAUSE = "EVENT_PAUSE";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-searcher", baseCls: "bi-multi-select-searcher",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
el: {}, el: {},
popup: {}, popup: {},
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
adapter: null, adapter: null,
masker: {}, masker: {},
defaultText: BI.i18nText("BI-Basic_Please_Select"), defaultText: i18nText("BI-Basic_Please_Select"),
itemHeight: 24 itemHeight: 24,
}); });
}, }
_init: function () { _init() {
BI.MultiSelectSearcher.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.editor = BI.createWidget(o.el, { o = this.options;
type: "bi.multi_select_editor", this.editor = createWidget(o.el, {
type: MultiSelectEditor.xtype,
height: o.height, height: o.height,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
watermark: o.watermark, watermark: o.watermark,
listeners: [ listeners: [
{ {
eventName: BI.MultiSelectEditor.EVENT_FOCUS, eventName: MultiSelectEditor.EVENT_FOCUS,
action: function () { action () {
self.fireEvent(BI.MultiSelectSearcher.EVENT_FOCUS); self.fireEvent(MultiSelectSearcher.EVENT_FOCUS);
} },
}, { },
eventName: BI.MultiSelectEditor.EVENT_BLUR, {
action: function () { eventName: MultiSelectEditor.EVENT_BLUR,
self.fireEvent(BI.MultiSelectSearcher.EVENT_BLUR); action () {
} self.fireEvent(MultiSelectSearcher.EVENT_BLUR);
},
} }
] ],
}); });
this.searcher = BI.createWidget({ this.searcher = createWidget({
type: "bi.searcher", type: Searcher.xtype,
element: this, element: this,
height: o.height, height: o.height,
isAutoSearch: false, isAutoSearch: false,
isAutoSync: false, isAutoSync: false,
onSearch: function (op, callback) { onSearch (op, callback) {
callback(); callback();
}, },
el: this.editor, el: this.editor,
popup: BI.extend({ popup: extend(
type: "bi.multi_select_search_pane", {
valueFormatter: o.valueFormatter, type: "bi.multi_select_search_pane",
itemFormatter: o.itemFormatter, valueFormatter: o.valueFormatter,
keywordGetter: function () { itemFormatter: o.itemFormatter,
return self.editor.getValue(); keywordGetter () {
}, return self.editor.getValue();
itemsCreator: function (op, callback) { },
var keyword = self.editor.getValue(); itemsCreator (op, callback) {
op.keywords = [keyword]; const keyword = self.editor.getValue();
o.itemsCreator(op, function () {
var keyword = self.editor.getValue();
op.keywords = [keyword]; op.keywords = [keyword];
o.itemsCreator(op, function () { o.itemsCreator(op, () => {
if (keyword === self.editor.getValue()) { const keyword = self.editor.getValue();
callback.apply(null, arguments); op.keywords = [keyword];
} o.itemsCreator(op, function () {
if (keyword === self.editor.getValue()) {
callback.apply(null, arguments);
}
});
}); });
}); },
itemHeight: o.itemHeight,
value: o.value,
}, },
itemHeight: o.itemHeight, o.popup
value: o.value ),
}, o.popup),
adapter: o.adapter, adapter: o.adapter,
masker: o.masker masker: o.masker,
}); });
this.searcher.on(BI.Searcher.EVENT_START, function () { this.searcher.on(Searcher.EVENT_START, () => {
self.fireEvent(BI.MultiSelectSearcher.EVENT_START); self.fireEvent(MultiSelectSearcher.EVENT_START);
}); });
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () { this.searcher.on(Searcher.EVENT_PAUSE, function () {
if (this.hasMatched()) { if (this.hasMatched()) {
} }
self.fireEvent(BI.MultiSelectSearcher.EVENT_PAUSE); self.fireEvent(MultiSelectSearcher.EVENT_PAUSE);
}); });
this.searcher.on(BI.Searcher.EVENT_STOP, function () { this.searcher.on(Searcher.EVENT_STOP, () => {
self.fireEvent(BI.MultiSelectSearcher.EVENT_STOP); self.fireEvent(MultiSelectSearcher.EVENT_STOP);
}); });
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () { this.searcher.on(Searcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectSearcher.EVENT_CHANGE, arguments); self.fireEvent(MultiSelectSearcher.EVENT_CHANGE, arguments);
}); });
this.searcher.on(BI.Searcher.EVENT_SEARCHING, function () { this.searcher.on(Searcher.EVENT_SEARCHING, function () {
var keywords = this.getKeywords(); const keywords = this.getKeywords();
self.fireEvent(BI.MultiSelectSearcher.EVENT_SEARCHING, keywords); self.fireEvent(MultiSelectSearcher.EVENT_SEARCHING, keywords);
}); });
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setState(o.value); this.setState(o.value);
} }
}, }
focus: function () { focus() {
this.editor.focus(); this.editor.focus();
}, }
blur: function () { blur() {
this.editor.blur(); this.editor.blur();
}, }
adjustView: function () { adjustView() {
this.searcher.adjustView(); this.searcher.adjustView();
}, }
isSearching: function () { isSearching() {
return this.searcher.isSearching(); return this.searcher.isSearching();
}, }
stopSearch: function () { stopSearch() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
getKeyword: function () { getKeyword() {
return this.editor.getValue(); return this.editor.getValue();
}, }
hasMatched: function () { hasMatched() {
return this.searcher.hasMatched(); return this.searcher.hasMatched();
}, }
hasChecked: function () { hasChecked() {
return this.searcher.getView() && this.searcher.getView().hasChecked(); return this.searcher.getView() && this.searcher.getView().hasChecked();
}, }
setAdapter: function (adapter) { setAdapter(adapter) {
this.searcher.setAdapter(adapter); this.searcher.setAdapter(adapter);
}, }
setState: function (ob) { setState(ob) {
var o = this.options; const o = this.options;
ob || (ob = {}); ob || (ob = {});
ob.value || (ob.value = []); ob.value || (ob.value = []);
if (ob.type === BI.Selection.All) { if (ob.type === BI.Selection.All) {
if (ob.value.length === 0) { if (ob.value.length === 0) {
this.editor.setState(BI.Selection.All); this.editor.setState(BI.Selection.All);
} else if (BI.size(ob.assist) <= 20) { } else if (size(ob.assist) <= 20) {
var state = ""; var state = "";
BI.each(ob.assist, function (i, v) { each(ob.assist, (i, v) => {
if (i === 0) { if (i === 0) {
state += "" + (v === null ? "" : (o.valueFormatter(v + "") || v)); state +=
`${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} else { } else {
state += "," + (v === null ? "" : (o.valueFormatter(v + "") || v)); state +=
`,${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} }
}); });
this.editor.setState(state); this.editor.setState(state);
@ -164,13 +191,17 @@ BI.MultiSelectSearcher = BI.inherit(BI.Widget, {
} else { } else {
if (ob.value.length === 0) { if (ob.value.length === 0) {
this.editor.setState(BI.Selection.None); this.editor.setState(BI.Selection.None);
} else if (BI.size(ob.value) <= 20) { } else if (size(ob.value) <= 20) {
var state = ""; var state = "";
BI.each(ob.value, function (i, v) { each(ob.value, (i, v) => {
if (i === 0) { if (i === 0) {
state += "" + (v === null ? "" : (o.valueFormatter(v + "") || v)); state +=
`${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} else { } else {
state += "," + (v === null ? "" : (o.valueFormatter(v + "") || v)); state +=
`,${
v === null ? "" : o.valueFormatter(`${v}`) || v}`;
} }
}); });
this.editor.setState(state); this.editor.setState(state);
@ -178,36 +209,26 @@ BI.MultiSelectSearcher = BI.inherit(BI.Widget, {
this.editor.setState(BI.Selection.Multi); this.editor.setState(BI.Selection.Multi);
} }
} }
}, }
getState: function () { getState() {
return this.editor.getState(); return this.editor.getState();
}, }
setValue: function (ob) { setValue(ob) {
this.setState(ob); this.setState(ob);
this.searcher.setValue(ob); this.searcher.setValue(ob);
}, }
getKey: function () { getKey() {
return this.editor.getValue(); return this.editor.getValue();
}, }
getValue: function () { getValue() {
return this.searcher.getValue(); return this.searcher.getValue();
}, }
populate: function (items) { populate(items) {
this.searcher.populate.apply(this.searcher, arguments); this.searcher.populate.apply(this.searcher, arguments);
} }
}); }
BI.MultiSelectSearcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.MultiSelectSearcher.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiSelectSearcher.EVENT_START = "EVENT_START";
BI.MultiSelectSearcher.EVENT_STOP = "EVENT_STOP";
BI.MultiSelectSearcher.EVENT_PAUSE = "EVENT_PAUSE";
BI.MultiSelectSearcher.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiSelectSearcher.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiSelectSearcher.EVENT_BLUR = "EVENT_BLUR";
BI.shortcut("bi.multi_select_searcher", BI.MultiSelectSearcher);

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

@ -1,112 +1,126 @@
/** import {
* 查看已选switcher shortcut,
* Created by guy on 15/11/3. Widget,
* @class BI.MultiSelectCheckSelectedSwitcher extend,
* @extends Widget emptyFn,
*/ createWidget,
BI.MultiSelectCheckSelectedSwitcher = BI.inherit(BI.Widget, { Events,
nextTick
} from "@/core";
import { Switcher } from "@/base";
import { MultiSelectCheckSelectedButton } from "button.checkselected";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiSelectCheckSelectedSwitcher.superclass._defaultConfig.apply(this, arguments), { export class MultiSelectCheckSelectedSwitcher extends Widget {
static xtype = "bi.multi_select_check_selected_switcher";
static EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-check-selected-switcher", baseCls: "bi-multi-select-check-selected-switcher",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
el: {}, el: {},
popup: {}, popup: {},
adapter: null, adapter: null,
masker: {} masker: {},
}); });
}, }
_init: function () { _init() {
BI.MultiSelectCheckSelectedSwitcher.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.button = BI.createWidget(o.el, { this.button = createWidget(o.el, {
type: "bi.multi_select_check_selected_button", type: MultiSelectCheckSelectedButton.xtype,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
value: o.value value: o.value,
}); });
this.button.on(BI.Events.VIEW, function () { this.button.on(Events.VIEW, function () {
self.fireEvent(BI.Events.VIEW, arguments); self.fireEvent(Events.VIEW, arguments);
}); });
this.switcher = BI.createWidget({ this.switcher = createWidget({
type: "bi.switcher", type: Switcher.xtype,
toggle: false, toggle: false,
element: this, element: this,
el: this.button, el: this.button,
popup: BI.extend({ popup: extend(
type: "bi.multi_select_check_pane", {
valueFormatter: o.valueFormatter, type: "bi.multi_select_check_pane",
itemsCreator: o.itemsCreator, valueFormatter: o.valueFormatter,
onClickContinueSelect: function () { itemsCreator: o.itemsCreator,
self.switcher.hideView(); onClickContinueSelect () {
}, self.switcher.hideView();
ref: function (_ref) { },
self.checkPane = _ref; ref (_ref) {
self.checkPane = _ref;
},
value: o.value,
}, },
value: o.value o.popup
}, o.popup), ),
adapter: o.adapter, adapter: o.adapter,
masker: o.masker masker: o.masker,
}); });
this.switcher.on(BI.Switcher.EVENT_TRIGGER_CHANGE, function () { this.switcher.on(Switcher.EVENT_TRIGGER_CHANGE, () => {
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE); self.fireEvent(
MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE
);
}); });
this.switcher.on(BI.Switcher.EVENT_BEFORE_POPUPVIEW, function () { this.switcher.on(Switcher.EVENT_BEFORE_POPUPVIEW, () => {
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW); self.fireEvent(
MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW
);
}); });
this.switcher.on(BI.Switcher.EVENT_AFTER_HIDEVIEW, function () { this.switcher.on(Switcher.EVENT_AFTER_HIDEVIEW, () => {
self.fireEvent(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW); self.fireEvent(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW
);
}); });
this.switcher.on(BI.Switcher.EVENT_AFTER_POPUPVIEW, function () { this.switcher.on(Switcher.EVENT_AFTER_POPUPVIEW, function () {
var me = this; const me = this;
BI.nextTick(function () { nextTick(() => {
me._populate(); me._populate();
}); });
}); });
}, }
adjustView: function () { adjustView() {
this.switcher.adjustView(); this.switcher.adjustView();
}, }
hideView: function () { hideView() {
this.switcher.empty(); this.switcher.empty();
this.switcher.hideView(); this.switcher.hideView();
}, }
setAdapter: function (adapter) { setAdapter(adapter) {
this.switcher.setAdapter(adapter); this.switcher.setAdapter(adapter);
}, }
setValue: function (v) { setValue(v) {
this.switcher.setValue(v); this.switcher.setValue(v);
}, }
// 与setValue的区别是只更新查看已选面板的的selectedValue, 不会更新按钮的计数 updateSelectedValue(v) {
updateSelectedValue: function (v) {
this.checkPane.setValue(v); this.checkPane.setValue(v);
}, }
setButtonChecked: function (v) { setButtonChecked(v) {
this.button.setValue(v); this.button.setValue(v);
}, }
getValue: function () {
}, getValue() {}
populate: function (items) { populate(items) {
this.switcher.populate.apply(this.switcher, arguments); this.switcher.populate.apply(this.switcher, arguments);
}, }
populateSwitcher: function () { populateSwitcher() {
this.button.populate.apply(this.button, arguments); this.button.populate.apply(this.button, arguments);
} }
}); }
BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE = "EVENT_TRIGGER_CHANGE";
BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
BI.shortcut("bi.multi_select_check_selected_switcher", BI.MultiSelectCheckSelectedSwitcher);

240
src/widget/multiselecttree/multiselecttree.js

@ -1,171 +1,193 @@
/** import {
* Created by zcf_1 on 2017/5/11. shortcut,
*/ extend,
BI.MultiSelectTree = BI.inherit(BI.Single, { emptyFn,
_constant: { createWidget,
EDITOR_HEIGHT: 24 nextTick,
}, AbsoluteLayout
} from "@/core";
_defaultConfig: function () { import { Single, Searcher } from "@/base";
return BI.extend(BI.MultiSelectTree.superclass._defaultConfig.apply(this, arguments), { import { MultiSelectTreePopup } from "./multiselecttree.popup";
@shortcut()
export class MultiSelectTree extends Single {
static xtype = "bi.multi_select_tree";
_constant = { EDITOR_HEIGHT: 24 };
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-select-tree", baseCls: "bi-multi-select-tree",
itemsCreator: BI.emptyFn itemsCreator: emptyFn,
}); });
}, }
_init: function () { _init() {
BI.MultiSelectTree.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.storeValue = {value: {}}; o = this.options;
this.storeValue = { value: {} };
this.adapter = BI.createWidget({ this.adapter = createWidget({
type: "bi.multi_select_tree_popup", type: MultiSelectTreePopup.xtype,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
showLine: o.showLine showLine: o.showLine,
}); });
this.adapter.on(BI.MultiSelectTreePopup.EVENT_CHANGE, function () { this.adapter.on(MultiSelectTreePopup.EVENT_CHANGE, () => {
if (self.searcher.isSearching()) { if (self.searcher.isSearching()) {
self.storeValue = {value: self.searcherPane.getValue()}; self.storeValue = { value: self.searcherPane.getValue() };
} else { } else {
self.storeValue = {value: self.adapter.getValue()}; self.storeValue = { value: self.adapter.getValue() };
} }
self.setSelectedValue(self.storeValue.value); self.setSelectedValue(self.storeValue.value);
self.fireEvent(BI.MultiSelectTree.EVENT_CHANGE); self.fireEvent(MultiSelectTree.EVENT_CHANGE);
}); });
// 搜索中的时候用的是parttree,同adapter中的synctree不一样 // 搜索中的时候用的是parttree,同adapter中的synctree不一样
this.searcherPane = BI.createWidget({ this.searcherPane = createWidget({
type: "bi.multi_tree_search_pane", type: "bi.multi_tree_search_pane",
cls: "bi-border-left bi-border-right bi-border-bottom", cls: "bi-border-left bi-border-right bi-border-bottom",
keywordGetter: function () { keywordGetter() {
return self.searcher.getKeyword(); return self.searcher.getKeyword();
}, },
itemsCreator: function (op, callback) { itemsCreator(op, callback) {
op.keyword = self.searcher.getKeyword(); op.keyword = self.searcher.getKeyword();
o.itemsCreator(op, callback); o.itemsCreator(op, callback);
} },
}); });
this.searcherPane.setVisible(false); this.searcherPane.setVisible(false);
this.searcher = BI.createWidget({ this.searcher = createWidget({
type: "bi.searcher", type: Searcher.xtype,
isAutoSearch: false, isAutoSearch: false,
isAutoSync: false, isAutoSync: false,
onSearch: function (op, callback) { onSearch(op, callback) {
callback({ callback({
keyword: self.searcher.getKeyword() keyword: self.searcher.getKeyword(),
}); });
}, },
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,
self._showSearcherPane(); action() {
// self.storeValue = {value: self.adapter.getValue()}; self._showSearcherPane();
// self.searcherPane.setSelectedValue(self.storeValue.value); // self.storeValue = {value: self.adapter.getValue()};
} // self.searcherPane.setSelectedValue(self.storeValue.value);
}, { },
eventName: BI.Searcher.EVENT_STOP, },
action: function () { {
self._showAdapter(); eventName: Searcher.EVENT_STOP,
// self.storeValue = {value: self.searcherPane.getValue()}; action() {
// self.adapter.setSelectedValue(self.storeValue.value); self._showAdapter();
BI.nextTick(function () { // self.storeValue = {value: self.searcherPane.getValue()};
self.adapter.populate(); // self.adapter.setSelectedValue(self.storeValue.value);
}); nextTick(() => {
} self.adapter.populate();
}, { });
eventName: BI.Searcher.EVENT_CHANGE, },
action: function () { },
if (self.searcher.isSearching()) { {
self.storeValue = {value: self.searcherPane.getValue()}; eventName: Searcher.EVENT_CHANGE,
} else { action() {
self.storeValue = {value: self.adapter.getValue()}; if (self.searcher.isSearching()) {
} self.storeValue = {
self.setSelectedValue(self.storeValue.value); value: self.searcherPane.getValue(),
self.fireEvent(BI.MultiSelectTree.EVENT_CHANGE); };
} else {
self.storeValue = {
value: self.adapter.getValue(),
};
}
self.setSelectedValue(self.storeValue.value);
self.fireEvent(MultiSelectTree.EVENT_CHANGE);
},
},
{
eventName: Searcher.EVENT_PAUSE,
action() {
self._showAdapter();
// BI-64732 pause 和stop一致, 都应该刷新adapter
nextTick(() => {
self.adapter.populate();
});
},
} }
}, { ],
eventName: BI.Searcher.EVENT_PAUSE,
action: function () {
self._showAdapter();
// BI-64732 pause 和stop一致, 都应该刷新adapter
BI.nextTick(function () {
self.adapter.populate();
});
}
}]
}); });
BI.createWidget({ createWidget({
type: "bi.vertical_fill", type: "bi.vertical_fill",
element: this, element: this,
items: [{ items: [
el: this.searcher, {
height: "" el: this.searcher,
}, { height: "",
el: this.adapter, },
height: "fill" {
}] el: this.adapter,
height: "fill",
}
],
}); });
BI.createWidget({ createWidget({
type: "bi.absolute", type: AbsoluteLayout.xtype,
element: this, element: this,
items: [{ items: [
el: this.searcherPane, {
top: this._constant.EDITOR_HEIGHT, el: this.searcherPane,
bottom: 0, top: this._constant.EDITOR_HEIGHT,
left: 0, bottom: 0,
right: 0 left: 0,
}] right: 0,
}
],
}); });
}
}, _showAdapter() {
_showAdapter: function () {
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);
}, }
resize: function () {
}, resize() {
}
setSelectedValue: function (v) { setSelectedValue(v) {
this.storeValue.value = v || {}; this.storeValue.value = v || {};
this.adapter.setSelectedValue(v); this.adapter.setSelectedValue(v);
this.searcherPane.setSelectedValue(v); this.searcherPane.setSelectedValue(v);
this.searcher.setValue({ this.searcher.setValue({
value: v || {} value: v || {},
}); });
}, }
setValue: function (v) { setValue(v) {
this.adapter.setValue(v); this.adapter.setValue(v);
}, }
stopSearch: function () { stopSearch() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
updateValue: function (v) { updateValue(v) {
this.adapter.updateValue(v); this.adapter.updateValue(v);
}, }
getValue: function () { getValue() {
return this.storeValue.value; return this.storeValue.value;
}, }
populate: function () { populate() {
this.adapter.populate(); this.adapter.populate();
} }
}); }
BI.MultiSelectTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_tree", BI.MultiSelectTree);

77
src/widget/multiselecttree/multiselecttree.popup.js

@ -1,58 +1,63 @@
/** import { shortcut, Widget, extend, emptyFn, createWidget } from "@/core";
* Created by zcf on 2016/12/21. import { TreeView, Asynctree } from "@/case";
*/
BI.MultiSelectTreePopup = BI.inherit(BI.Widget, { @shortcut()
_defaultConfig: function () { export class MultiSelectTreePopup extends Widget {
return BI.extend(BI.MultiSelectTreePopup.superclass._defaultConfig.apply(this, arguments), { static xtype = "bi.multi_select_tree_popup";
baseCls: "bi-multi-select-tree-popup bi-border-left bi-border-right bi-border-bottom",
itemsCreator: BI.emptyFn static EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls:
"bi-multi-select-tree-popup bi-border-left bi-border-right bi-border-bottom",
itemsCreator: emptyFn,
}); });
}, }
_init: function () {
BI.MultiSelectTreePopup.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.popup = BI.createWidget({ const self = this,
type: "bi.async_tree", o = this.options;
this.popup = createWidget({
type: Asynctree.xtype,
showLine: o.showLine, showLine: o.showLine,
element: this, element: this,
itemsCreator: o.itemsCreator itemsCreator: o.itemsCreator,
}); });
this.popup.on(BI.TreeView.EVENT_AFTERINIT, function () { this.popup.on(TreeView.EVENT_AFTERINIT, () => {
self.fireEvent(BI.MultiSelectTreePopup.EVENT_AFTER_INIT); self.fireEvent(MultiSelectTreePopup.EVENT_AFTER_INIT);
}); });
this.popup.on(BI.TreeView.EVENT_CHANGE, function () { this.popup.on(TreeView.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiSelectTreePopup.EVENT_CHANGE); self.fireEvent(MultiSelectTreePopup.EVENT_CHANGE);
}); });
}, }
hasChecked: function () { hasChecked() {
return this.popup.hasChecked(); return this.popup.hasChecked();
}, }
getValue: function () { getValue() {
return this.popup.getValue(); return this.popup.getValue();
}, }
setValue: function (v) { setValue(v) {
v || (v = {}); v || (v = {});
this.popup.setValue(v); this.popup.setValue(v);
}, }
setSelectedValue: function (v) { setSelectedValue(v) {
v || (v = {}); v || (v = {});
this.popup.setSelectedValue(v); this.popup.setSelectedValue(v);
}, }
updateValue: function (v) { updateValue(v) {
this.popup.updateValue(v); this.popup.updateValue(v);
this.popup.refresh(); this.popup.refresh();
}, }
populate: function (config) { populate(config) {
this.popup.stroke(config); this.popup.stroke(config);
} }
}
});
BI.MultiSelectTreePopup.EVENT_AFTER_INIT = "EVENT_AFTER_INIT";
BI.MultiSelectTreePopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_select_tree_popup", BI.MultiSelectTreePopup);

147
src/widget/multitree/check/multi.tree.check.pane.js

@ -1,121 +1,128 @@
/** import {
* shortcut,
* @class BI.MultiTreeCheckPane extend,
* @extends BI.Pane emptyFn,
*/ createWidget,
BI.MultiTreeCheckPane = BI.inherit(BI.Pane, { i18nText,
nextTick,
constants: { Events,
height: 25, VerticalAdaptLayout, VTapeLayout
lgap: 10, } from "@/core";
tgap: 5 import { Pane, TextButton, Label } from "@/base";
}, import { DisplayTree, TreeView } from "@/case";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiTreeCheckPane.superclass._defaultConfig.apply(this, arguments), { export class MultiTreeCheckPane extends Pane {
static xtype = "bi.multi_tree_check_pane";
constants = { height: 25, lgap: 10, tgap: 5 };
static EVENT_CONTINUE_CLICK = "EVENT_CONTINUE_CLICK";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-check-pane bi-background", baseCls: "bi-multi-tree-check-pane bi-background",
onClickContinueSelect: BI.emptyFn, onClickContinueSelect: emptyFn,
el: { el: {
type: "bi.display_tree" type: DisplayTree.xtype,
} },
}); });
}, }
_init: function () { _init() {
BI.MultiTreeCheckPane.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, opts = this.options; const self = this,
opts = this.options;
this.selectedValues = {}; this.selectedValues = {};
var continueSelect = BI.createWidget({ const continueSelect = createWidget({
type: "bi.text_button", type: TextButton.xtype,
title: BI.i18nText("BI-Continue_Select"), title: i18nText("BI-Continue_Select"),
text: BI.i18nText("BI-Continue_Select"), text: i18nText("BI-Continue_Select"),
cls: "multi-tree-check-selected" cls: "multi-tree-check-selected",
}); });
continueSelect.on(BI.TextButton.EVENT_CHANGE, function () { continueSelect.on(TextButton.EVENT_CHANGE, () => {
opts.onClickContinueSelect(); opts.onClickContinueSelect();
BI.nextTick(function () { nextTick(() => {
self.empty(); self.empty();
}); });
}); });
var backToPopup = BI.createWidget({ const backToPopup = createWidget({
type: "bi.vertical_adapt", type: VerticalAdaptLayout.xtype,
columnSize: ["auto", "auto"], columnSize: ["auto", "auto"],
cls: "multi-tree-continue-select", cls: "multi-tree-continue-select",
items: [ items: [
{ {
el: { el: {
type: "bi.label", type: Label.xtype,
title: BI.i18nText("BI-Selected_Data"), title: i18nText("BI-Selected_Data"),
text: BI.i18nText("BI-Selected_Data") text: i18nText("BI-Selected_Data"),
}, },
lgap: this.constants.lgap, lgap: this.constants.lgap,
tgap: this.constants.tgap tgap: this.constants.tgap,
}, },
{ {
el: continueSelect, el: continueSelect,
hgap: this.constants.lgap, hgap: this.constants.lgap,
tgap: this.constants.tgap tgap: this.constants.tgap,
}] }
],
}); });
this.display = BI.createWidget(opts.el, { this.display = createWidget(opts.el, {
type: "bi.display_tree", type: DisplayTree.xtype,
cls: "bi-multi-tree-display", cls: "bi-multi-tree-display",
itemsCreator: function (op, callback) { itemsCreator(op, callback) {
op.type = BI.TreeView.REQ_TYPE_GET_SELECTED_DATA; op.type = TreeView.REQ_TYPE_GET_SELECTED_DATA;
opts.itemsCreator(op, callback); opts.itemsCreator(op, callback);
}, },
value: (opts.value || {}).value value: (opts.value || {}).value,
}); });
this.display.on(BI.Events.AFTERINIT, function () { this.display.on(Events.AFTERINIT, () => {
self.fireEvent(BI.Events.AFTERINIT); self.fireEvent(Events.AFTERINIT);
}); });
this.display.on(BI.TreeView.EVENT_INIT, function () { this.display.on(TreeView.EVENT_INIT, () => {
backToPopup.setVisible(false); backToPopup.setVisible(false);
}); });
this.display.on(BI.TreeView.EVENT_AFTERINIT, function () { this.display.on(TreeView.EVENT_AFTERINIT, () => {
backToPopup.setVisible(true); backToPopup.setVisible(true);
}); });
BI.createWidget({ createWidget({
type: "bi.vtape", type: VTapeLayout.xtype,
element: this, element: this,
items: [{ items: [
height: this.constants.height, {
el: backToPopup height: this.constants.height,
}, { el: backToPopup,
height: "fill", },
el: this.display {
}] height: "fill",
el: this.display,
}
],
}); });
}, }
empty: function () { empty() {
this.display.empty(); this.display.empty();
}, }
populate: function (configs) { populate(configs) {
this.display.stroke(configs); this.display.stroke(configs);
}, }
setValue: function (v) { setValue(v) {
v || (v = {}); v || (v = {});
this.display.setSelectedValue(v.value); this.display.setSelectedValue(v.value);
},
getValue: function () {
} }
});
BI.MultiTreeCheckPane.EVENT_CONTINUE_CLICK = "EVENT_CONTINUE_CLICK"; getValue() {
}
}
BI.shortcut("bi.multi_tree_check_pane", BI.MultiTreeCheckPane);

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

@ -1,33 +1,67 @@
/** import {
* shortcut,
* @class BI.MultiTreeCombo extend,
* @extends BI.Single emptyFn,
*/ createWidget,
toPix,
BI.MultiTreeCombo = BI.inherit(BI.Single, { nextTick,
_defaultConfig: function () { Events,
return BI.extend(BI.MultiTreeCombo.superclass._defaultConfig.apply(this, arguments), { AbsoluteLayout,
VerticalAdaptLayout,
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearcher } from "trigger/searcher.multi.tree";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import { TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "../multiselect/trigger/switcher.checkselected";
@shortcut()
export class MultiTreeCombo extends Single {
static xtype = "bi.multi_tree_combo";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_STOP = "EVENT_STOP";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-combo", baseCls: "bi-multi-tree-combo",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
isNeedAdjustWidth: true, isNeedAdjustWidth: true,
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const triggerBtn = createWidget({
BI.MultiTreeCombo.superclass._init.apply(this, arguments); type: TriggerIconButton.xtype,
var isInit = false; width: o.height,
var want2showCounter = false; height: o.height,
cls: "multi-select-trigger-icon-button",
});
let clear;
let change;
const self = this,
o = this.options;
super._init(...arguments);
let isInit = false;
let want2showCounter = false;
this.storeValue = { value: o.value || {} }; this.storeValue = { value: o.value || {} };
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.multi_select_trigger", type: "bi.multi_select_trigger",
allowEdit: o.allowEdit, allowEdit: o.allowEdit,
height: BI.toPix(o.height, o.simple ? 1 : 2), height: toPix(o.height, o.simple ? 1 : 2),
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
@ -45,72 +79,78 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
listeners: [ listeners: [
{ {
eventName: BI.MultiTreeSearcher.EVENT_CLICK_TREE_NODE, eventName: MultiTreeSearcher.EVENT_CLICK_TREE_NODE,
action: function () { action() {
self._dataChange = true; self._dataChange = true;
} },
} }
], ],
}, },
value: { value: o.value || {} } value: { value: o.value || {} },
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: !o.allowEdit, toggle: !o.allowEdit,
container: o.container, container: o.container,
el: this.trigger, el: this.trigger,
adjustLength: 1, adjustLength: 1,
popup: { popup: {
type: "bi.multi_tree_popup_view", type: "bi.multi_tree_popup_view",
ref: function () { ref() {
self.popup = this; self.popup = this;
self.trigger.setAdapter(this); self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this); self.numberCounter.setAdapter(this);
}, },
listeners: [ listeners: [
{ {
eventName: BI.MultiTreePopup.EVENT_AFTERINIT, eventName: MultiTreePopup.EVENT_AFTERINIT,
action: function () { action() {
self.numberCounter.adjustView(); self.numberCounter.adjustView();
isInit = true; isInit = true;
if (want2showCounter === true) { if (want2showCounter === true) {
showCounter(); showCounter();
} }
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CHANGE, {
action: function () { eventName: MultiTreePopup.EVENT_CHANGE,
action() {
change = true; change = true;
var val = { const val = {
type: BI.Selection.Multi, type: BI.Selection.Multi,
value: this.hasChecked() ? this.getValue() : {} value: this.hasChecked() ? this.getValue() : {},
}; };
self.trigger.getSearcher().setState(val); self.trigger.getSearcher().setState(val);
self.numberCounter.setButtonChecked(val); self.numberCounter.setButtonChecked(val);
self.storeValue = { value: self.combo.getValue() }; self.storeValue = { value: self.combo.getValue() };
self.fireEvent(BI.MultiTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
MultiTreeCombo.EVENT_CLICK_ITEM,
self.combo.getValue()
);
self._dataChange = true; self._dataChange = true;
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CLICK_CONFIRM, {
action: function () { eventName: MultiTreePopup.EVENT_CLICK_CONFIRM,
action() {
self.combo.hideView(); self.combo.hideView();
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CLICK_CLEAR, {
action: function () { eventName: MultiTreePopup.EVENT_CLICK_CLEAR,
action() {
clear = true; clear = true;
self._dataChange = true; self._dataChange = true;
self.setValue(); self.setValue();
self._defaultState(); self._defaultState();
} },
} }
], ],
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
onLoaded: function () { onLoaded() {
BI.nextTick(function () { nextTick(() => {
self.numberCounter.adjustView(); self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView(); self.trigger.getSearcher().adjustView();
}); });
@ -119,49 +159,51 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
}, },
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
value: { value: o.value || {} }, value: { value: o.value || {} },
hideChecker: function (e) { hideChecker(e) {
return triggerBtn.element.find(e.target).length === 0 && return (
self.numberCounter.element.find(e.target).length === 0; triggerBtn.element.find(e.target).length === 0 &&
} self.numberCounter.element.find(e.target).length === 0
);
},
}); });
var change = false; change = false;
var clear = false; // 标识当前是否点击了清空 clear = false; // 标识当前是否点击了清空
var isSearching = function () { function isSearching() {
return self.trigger.getSearcher().isSearching(); return self.trigger.getSearcher().isSearching();
}; }
var isPopupView = function () { function isPopupView() {
return self.combo.isViewVisible(); return self.combo.isViewVisible();
}; }
this.trigger.on(BI.MultiSelectTrigger.EVENT_FOCUS, function () { this.trigger.on(MultiSelectTrigger.EVENT_FOCUS, () => {
self.fireEvent(BI.MultiTreeCombo.EVENT_FOCUS); self.fireEvent(MultiTreeCombo.EVENT_FOCUS);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_BLUR, function () { this.trigger.on(MultiSelectTrigger.EVENT_BLUR, () => {
self.fireEvent(BI.MultiTreeCombo.EVENT_BLUR); self.fireEvent(MultiTreeCombo.EVENT_BLUR);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { this.trigger.on(MultiSelectTrigger.EVENT_START, function () {
self.storeValue = { value: self.combo.getValue() }; self.storeValue = { value: self.combo.getValue() };
this.setValue(self.storeValue); this.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { this.trigger.on(MultiSelectTrigger.EVENT_STOP, function () {
self.storeValue = { value: this.getValue() }; self.storeValue = { value: this.getValue() };
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
BI.nextTick(function () { nextTick(() => {
if (isPopupView()) { if (isPopupView()) {
self.combo.populate(); self.combo.populate();
} }
}); });
self.fireEvent(BI.MultiTreeCombo.EVENT_STOP); self.fireEvent(MultiTreeCombo.EVENT_STOP);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_SEARCHING, function () { this.trigger.on(MultiSelectTrigger.EVENT_SEARCHING, () => {
self.fireEvent(BI.MultiTreeCombo.EVENT_SEARCHING); self.fireEvent(MultiTreeCombo.EVENT_SEARCHING);
}); });
function showCounter() { function showCounter() {
@ -174,28 +216,33 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
} }
this.trigger.on(BI.MultiSelectTrigger.EVENT_TRIGGER_CLICK, function () { this.trigger.on(MultiSelectTrigger.EVENT_TRIGGER_CLICK, () => {
self.combo.toggle(); self.combo.toggle();
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_COUNTER_CLICK, function () { this.trigger.on(MultiSelectTrigger.EVENT_COUNTER_CLICK, () => {
if (!self.combo.isViewVisible()) { if (!self.combo.isViewVisible()) {
self.combo.showView(); self.combo.showView();
} }
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_CHANGE, function () { this.trigger.on(MultiSelectTrigger.EVENT_CHANGE, function () {
var checked = this.getSearcher().hasChecked(); const checked = this.getSearcher().hasChecked();
var val = { const val = {
type: BI.Selection.Multi, type: BI.Selection.Multi,
value: checked ? { 1: 1 } : {} value: checked ? { 1: 1 } : {},
}; };
this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); this.getSearcher().setState(
checked ? BI.Selection.Multi : BI.Selection.None
);
self.numberCounter.setButtonChecked(val); self.numberCounter.setButtonChecked(val);
self.fireEvent(BI.MultiTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
MultiTreeCombo.EVENT_CLICK_ITEM,
self.combo.getValue()
);
self._dataChange = true; self._dataChange = true;
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (isSearching()) { if (isSearching()) {
return; return;
} }
@ -209,12 +256,13 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
self.populate(); self.populate();
self.fireEvent(BI.MultiTreeCombo.EVENT_BEFORE_POPUPVIEW); self.fireEvent(MultiTreeCombo.EVENT_BEFORE_POPUPVIEW);
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_HIDEVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_HIDEVIEW, () => {
if (isSearching()) { if (isSearching()) {
self._stopEditing(); self._stopEditing();
self._dataChange && self.fireEvent(BI.MultiTreeCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeCombo.EVENT_CONFIRM);
} else { } else {
if (isPopupView()) { if (isPopupView()) {
self._stopEditing(); self._stopEditing();
@ -222,23 +270,18 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
if (clear === true) { if (clear === true) {
self.storeValue = { value: {} }; self.storeValue = { value: {} };
} }
self._dataChange && self.fireEvent(BI.MultiTreeCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeCombo.EVENT_CONFIRM);
} }
} }
clear = false; clear = false;
change = false; change = false;
}); });
this.combo.on(BI.Combo.EVENT_AFTER_HIDEVIEW, function () { this.combo.on(Combo.EVENT_AFTER_HIDEVIEW, () => {
self.fireEvent(BI.MultiTreeCombo.EVENT_AFTER_HIDEVIEW); self.fireEvent(MultiTreeCombo.EVENT_AFTER_HIDEVIEW);
}); });
var triggerBtn = BI.createWidget({ triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
type: "bi.trigger_icon_button",
width: o.height,
height: o.height,
cls: "multi-select-trigger-icon-button"
});
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () {
self.numberCounter.hideView(); self.numberCounter.hideView();
if (self.combo.isViewVisible()) { if (self.combo.isViewVisible()) {
self.combo.hideView(); self.combo.hideView();
@ -247,13 +290,13 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
} }
}); });
this.numberCounter = BI.createWidget({ this.numberCounter = createWidget({
type: "bi.multi_select_check_selected_switcher", type: "bi.multi_select_check_selected_switcher",
el: { el: {
type: "bi.multi_tree_check_selected_button" type: "bi.multi_tree_check_selected_button",
}, },
popup: { popup: {
type: "bi.multi_tree_check_pane" type: "bi.multi_tree_check_pane",
}, },
masker: { masker: {
offset: { offset: {
@ -265,43 +308,56 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
}, },
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
value: { value: o.value || {} } value: { value: o.value || {} },
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
}); });
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () { this.numberCounter.on(
if (want2showCounter === false) { MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
want2showCounter = true; () => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
} }
if (isInit === true) { );
want2showCounter = null; this.numberCounter.on(
showCounter(); MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
() => {
if (want2showCounter === false) {
want2showCounter = true;
}
if (isInit === true) {
want2showCounter = null;
showCounter();
}
} }
}); );
this.numberCounter.on(BI.Events.VIEW, function (b) { this.numberCounter.on(Events.VIEW, b => {
BI.nextTick(function () {// 自动调整宽度 nextTick(() => {
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0)); // 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
}); });
}); });
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () { this.numberCounter.on(
BI.nextTick(function () {// 收起时自动调整宽度 MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
self.trigger.refreshPlaceHolderWidth(0); () => {
}); nextTick(() => {
}); // 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
}
);
this.trigger.element.click(function (e) { this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) { if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView(); self.numberCounter.hideView();
} }
}); });
BI.createWidget({ createWidget({
type: "bi.absolute", type: AbsoluteLayout.xtype,
element: this, element: this,
items: [ items: [
{ {
@ -309,85 +365,76 @@ BI.MultiTreeCombo = BI.inherit(BI.Single, {
left: 0, left: 0,
right: 0, right: 0,
top: 0, top: 0,
bottom: 0 bottom: 0,
}, { },
{
el: triggerBtn, el: triggerBtn,
right: 0, right: 0,
top: 0, top: 0,
bottom: 0 bottom: 0,
}, { },
{
el: { el: {
type: "bi.vertical_adapt", type: VerticalAdaptLayout.xtype,
items: [this.numberCounter] items: [this.numberCounter],
}, },
right: o.height, right: o.height,
top: 0, top: 0,
bottom: 0 bottom: 0,
} }
] ],
}); });
}, }
_stopEditing: function () { _stopEditing() {
this.trigger.stopEditing(); this.trigger.stopEditing();
this.numberCounter.hideView(); this.numberCounter.hideView();
}, }
_defaultState: function () { _defaultState() {
this._stopEditing(); this._stopEditing();
this.combo.hideView(); this.combo.hideView();
}, }
showView: function () { showView() {
this.combo.showView(); this.combo.showView();
}, }
hideView: function () { hideView() {
this.combo.hideView(); this.combo.hideView();
}, }
setValue: function (v) { setValue(v) {
this.storeValue.value = v || {}; this.storeValue.value = v || {};
this.combo.setValue({ this.combo.setValue({
value: v || {} value: v || {},
}); });
this.numberCounter.setValue({ this.numberCounter.setValue({
value: v || {} value: v || {},
}); });
}, }
getSearcher: function () { getSearcher() {
return this.trigger.getSearcher(); return this.trigger.getSearcher();
}, }
getValue: function () { getValue() {
return BI.deepClone(this.storeValue.value); return deepClone(this.storeValue.value);
}, }
populate: function () { populate() {
this.combo.populate(); this.combo.populate();
}, }
focus: function () { focus() {
this.trigger.focus(); this.trigger.focus();
}, }
blur: function () { blur() {
this.trigger.blur(); this.trigger.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.trigger.setWaterMark(v); this.trigger.setWaterMark(v);
} }
}); }
BI.MultiTreeCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiTreeCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiTreeCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiTreeCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiTreeCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiTreeCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.MultiTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.MultiTreeCombo.EVENT_AFTER_HIDEVIEW = "EVENT_AFTER_HIDEVIEW";
BI.shortcut("bi.multi_tree_combo", BI.MultiTreeCombo);

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

@ -1,34 +1,58 @@
/** import {
* 可以往当前选中节点下添加新值的下拉树 shortcut,
* @class BI.MultiTreeInsertCombo extend,
* @extends BI.Single emptyFn,
*/ createWidget,
toPix,
BI.MultiTreeInsertCombo = BI.inherit(BI.Single, { nextTick,
Events,
_defaultConfig: function () { AbsoluteLayout,
return BI.extend(BI.MultiTreeInsertCombo.superclass._defaultConfig.apply(this, arguments), { VerticalAdaptLayout,
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearchInsertPane } from "trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import { TriggerIconButton } from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "../multiselect/trigger/switcher.checkselected";
@shortcut()
export class MultiTreeInsertCombo extends Single {
static xtype = "bi.multi_tree_insert_combo";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_STOP = "EVENT_STOP";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-insert-combo", baseCls: "bi-multi-tree-insert-combo",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
isNeedAdjustWidth: true, isNeedAdjustWidth: true,
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const self = this,
BI.MultiTreeInsertCombo.superclass._init.apply(this, arguments); o = this.options;
var isInit = false; super._init(...arguments);
var want2showCounter = false; let isInit = false;
let want2showCounter = false;
this.storeValue = { value: o.value || {} }; this.storeValue = { value: o.value || {} };
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.multi_select_trigger", type: "bi.multi_select_trigger",
allowEdit: o.allowEdit, allowEdit: o.allowEdit,
height: BI.toPix(o.height, o.simple ? 1 : 2), height: toPix(o.height, o.simple ? 1 : 2),
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
@ -49,85 +73,94 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
type: "bi.multi_tree_search_insert_pane", type: "bi.multi_tree_search_insert_pane",
listeners: [ listeners: [
{ {
eventName: BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM, eventName: MultiTreeSearchInsertPane.EVENT_ADD_ITEM,
action: function () { action () {
self.storeValue.value[self.trigger.getSearcher().getKeyword()] = {}; self.storeValue.value[
self.trigger.getSearcher().getKeyword()
] = {};
self._assertShowValue(); self._assertShowValue();
// setValue以更新paras.value, 之后从search popup中拿到的就能有add的值了 // setValue以更新paras.value, 之后从search popup中拿到的就能有add的值了
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
self._stopEditing(); self._stopEditing();
self._dataChange = true; self._dataChange = true;
} },
}, { },
eventName: BI.MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE, {
action: function () { eventName:
MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE,
action () {
self._dataChange = true; self._dataChange = true;
} },
} }
] ],
} },
}, },
value: { value: o.value || {} } value: { value: o.value || {} },
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: !o.allowEdit, toggle: !o.allowEdit,
container: o.container, container: o.container,
el: this.trigger, el: this.trigger,
adjustLength: 1, adjustLength: 1,
popup: { popup: {
type: "bi.multi_tree_popup_view", type: "bi.multi_tree_popup_view",
ref: function () { ref () {
self.popup = this; self.popup = this;
self.trigger.setAdapter(this); self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this); self.numberCounter.setAdapter(this);
}, },
listeners: [ listeners: [
{ {
eventName: BI.MultiTreePopup.EVENT_AFTERINIT, eventName: MultiTreePopup.EVENT_AFTERINIT,
action: function () { action () {
self.numberCounter.adjustView(); self.numberCounter.adjustView();
isInit = true; isInit = true;
if (want2showCounter === true) { if (want2showCounter === true) {
showCounter(); showCounter();
} }
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CHANGE, {
action: function () { eventName: MultiTreePopup.EVENT_CHANGE,
action () {
change = true; change = true;
var val = { const val = {
type: BI.Selection.Multi, type: BI.Selection.Multi,
value: this.hasChecked() ? this.getValue() : {} value: this.hasChecked() ? this.getValue() : {},
}; };
self.trigger.getSearcher().setState(val); self.trigger.getSearcher().setState(val);
self.numberCounter.setButtonChecked(val); self.numberCounter.setButtonChecked(val);
self.storeValue = { value: self.combo.getValue() }; self.storeValue = { value: self.combo.getValue() };
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_CLICK_ITEM, self.getValue()); self.fireEvent(
MultiTreeInsertCombo.EVENT_CLICK_ITEM,
self.getValue()
);
self._dataChange = true; self._dataChange = true;
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CLICK_CONFIRM, {
action: function () { eventName: MultiTreePopup.EVENT_CLICK_CONFIRM,
action () {
self.combo.hideView(); self.combo.hideView();
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CLICK_CLEAR, {
action: function () { eventName: MultiTreePopup.EVENT_CLICK_CLEAR,
action () {
clear = true; clear = true;
self._dataChange = true; self._dataChange = true;
self.setValue(); self.setValue();
self._defaultState(); self._defaultState();
} },
} }
], ],
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
onLoaded: function () { onLoaded () {
BI.nextTick(function () { nextTick(() => {
self.numberCounter.adjustView(); self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView(); self.trigger.getSearcher().adjustView();
}); });
@ -136,49 +169,51 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
}, },
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
value: { value: o.value || {} }, value: { value: o.value || {} },
hideChecker: function (e) { hideChecker (e) {
return triggerBtn.element.find(e.target).length === 0 && return (
self.numberCounter.element.find(e.target).length === 0; triggerBtn.element.find(e.target).length === 0 &&
} self.numberCounter.element.find(e.target).length === 0
);
},
}); });
var change = false; var change = false;
var clear = false; // 标识当前是否点击了清空 var clear = false; // 标识当前是否点击了清空
var isSearching = function () { const isSearching = function () {
return self.trigger.getSearcher().isSearching(); return self.trigger.getSearcher().isSearching();
}; };
var isPopupView = function () { const isPopupView = function () {
return self.combo.isViewVisible(); return self.combo.isViewVisible();
}; };
this.trigger.on(BI.MultiSelectTrigger.EVENT_FOCUS, function () { this.trigger.on(MultiSelectTrigger.EVENT_FOCUS, () => {
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_FOCUS); self.fireEvent(MultiTreeInsertCombo.EVENT_FOCUS);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_BLUR, function () { this.trigger.on(MultiSelectTrigger.EVENT_BLUR, () => {
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_BLUR); self.fireEvent(MultiTreeInsertCombo.EVENT_BLUR);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { this.trigger.on(MultiSelectTrigger.EVENT_START, function () {
self.storeValue = { value: self.combo.getValue() }; self.storeValue = { value: self.combo.getValue() };
this.setValue(self.storeValue); this.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { this.trigger.on(MultiSelectTrigger.EVENT_STOP, function () {
self.storeValue = { value: this.getValue() }; self.storeValue = { value: this.getValue() };
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
BI.nextTick(function () { nextTick(() => {
if (isPopupView()) { if (isPopupView()) {
self.combo.populate(); self.combo.populate();
} }
}); });
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_STOP); self.fireEvent(MultiTreeInsertCombo.EVENT_STOP);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_SEARCHING, function () { this.trigger.on(MultiSelectTrigger.EVENT_SEARCHING, () => {
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_SEARCHING); self.fireEvent(MultiTreeInsertCombo.EVENT_SEARCHING);
}); });
function showCounter() { function showCounter() {
@ -191,23 +226,28 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
} }
this.trigger.on(BI.MultiSelectTrigger.EVENT_TRIGGER_CLICK, function () { this.trigger.on(MultiSelectTrigger.EVENT_TRIGGER_CLICK, () => {
self.combo.toggle(); self.combo.toggle();
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_CHANGE, function () { this.trigger.on(MultiSelectTrigger.EVENT_CHANGE, function () {
var checked = this.getSearcher().hasChecked(); const checked = this.getSearcher().hasChecked();
var val = { const val = {
type: BI.Selection.Multi, type: BI.Selection.Multi,
value: checked ? { 1: 1 } : {} value: checked ? { 1: 1 } : {},
}; };
this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); this.getSearcher().setState(
checked ? BI.Selection.Multi : BI.Selection.None
);
self.numberCounter.setButtonChecked(val); self.numberCounter.setButtonChecked(val);
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
MultiTreeInsertCombo.EVENT_CLICK_ITEM,
self.combo.getValue()
);
self._dataChange = true; self._dataChange = true;
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (isSearching()) { if (isSearching()) {
return; return;
} }
@ -221,12 +261,13 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
self.populate(); self.populate();
self.fireEvent(BI.MultiTreeInsertCombo.EVENT_BEFORE_POPUPVIEW); self.fireEvent(MultiTreeInsertCombo.EVENT_BEFORE_POPUPVIEW);
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_HIDEVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_HIDEVIEW, () => {
if (isSearching()) { if (isSearching()) {
self._stopEditing(); self._stopEditing();
self._dataChange && self.fireEvent(BI.MultiTreeInsertCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeInsertCombo.EVENT_CONFIRM);
} else { } else {
if (isPopupView()) { if (isPopupView()) {
self._stopEditing(); self._stopEditing();
@ -234,20 +275,21 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
if (clear === true) { if (clear === true) {
self.storeValue = { value: {} }; self.storeValue = { value: {} };
} }
self._dataChange && self.fireEvent(BI.MultiTreeInsertCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeInsertCombo.EVENT_CONFIRM);
} }
} }
clear = false; clear = false;
change = false; change = false;
}); });
var triggerBtn = BI.createWidget({ var triggerBtn = createWidget({
type: "bi.trigger_icon_button", type: TriggerIconButton.xtype,
width: o.height, width: o.height,
height: o.height, height: o.height,
cls: "multi-select-trigger-icon-button" cls: "multi-select-trigger-icon-button",
}); });
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView(); self.numberCounter.hideView();
if (self.combo.isViewVisible()) { if (self.combo.isViewVisible()) {
self.combo.hideView(); self.combo.hideView();
@ -256,13 +298,13 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
} }
}); });
this.numberCounter = BI.createWidget({ this.numberCounter = createWidget({
type: "bi.multi_select_check_selected_switcher", type: "bi.multi_select_check_selected_switcher",
el: { el: {
type: "bi.multi_tree_check_selected_button" type: "bi.multi_tree_check_selected_button",
}, },
popup: { popup: {
type: "bi.multi_tree_check_pane" type: "bi.multi_tree_check_pane",
}, },
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
masker: { masker: {
@ -274,43 +316,56 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
}, },
}, },
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
value: o.value value: o.value,
}); });
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () { this.numberCounter.on(
if (!self.combo.isViewVisible()) { MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
self.combo.showView(); () => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
} }
}); );
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () { this.numberCounter.on(
if (want2showCounter === false) { MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
want2showCounter = true; () => {
if (want2showCounter === false) {
want2showCounter = true;
}
if (isInit === true) {
want2showCounter = null;
showCounter();
}
} }
if (isInit === true) { );
want2showCounter = null;
showCounter(); this.numberCounter.on(
MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
() => {
nextTick(() => {
// 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
} }
}); );
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () { this.numberCounter.on(Events.VIEW, b => {
BI.nextTick(function () {// 收起时自动调整宽度 nextTick(() => {
self.trigger.refreshPlaceHolderWidth(0); // 自动调整宽度
}); self.trigger.refreshPlaceHolderWidth(
}); b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
this.numberCounter.on(BI.Events.VIEW, function (b) {
BI.nextTick(function () {// 自动调整宽度
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0));
}); });
}); });
this.trigger.element.click(function (e) { this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) { if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView(); self.numberCounter.hideView();
} }
}); });
BI.createWidget({ createWidget({
type: "bi.absolute", type: AbsoluteLayout.xtype,
element: this, element: this,
items: [ items: [
{ {
@ -318,89 +373,81 @@ BI.MultiTreeInsertCombo = BI.inherit(BI.Single, {
left: 0, left: 0,
right: 0, right: 0,
top: 0, top: 0,
bottom: 0 bottom: 0,
}, { },
{
el: triggerBtn, el: triggerBtn,
right: 0, right: 0,
top: 0, top: 0,
bottom: 0 bottom: 0,
}, { },
{
el: { el: {
type: "bi.vertical_adapt", type: VerticalAdaptLayout.xtype,
items: [this.numberCounter] items: [this.numberCounter],
}, },
right: o.height, right: o.height,
top: 0, top: 0,
height: o.height, height: o.height,
} }
] ],
}); });
}, }
_assertShowValue: function () { _assertShowValue() {
this.trigger.getSearcher().setState(this.storeValue); this.trigger.getSearcher().setState(this.storeValue);
this.numberCounter.setButtonChecked(this.storeValue); this.numberCounter.setButtonChecked(this.storeValue);
}, }
_stopEditing: function () { _stopEditing() {
this.trigger.stopEditing(); this.trigger.stopEditing();
this.numberCounter.hideView(); this.numberCounter.hideView();
}, }
_defaultState: function () { _defaultState() {
this._stopEditing(); this._stopEditing();
this.combo.hideView(); this.combo.hideView();
}, }
getSearcher: function () { getSearcher() {
return this.trigger.getSearcher(); return this.trigger.getSearcher();
}, }
showView: function () { showView() {
this.combo.showView(); this.combo.showView();
}, }
hideView: function () { hideView() {
this.combo.hideView(); this.combo.hideView();
}, }
setValue: function (v) { setValue(v) {
this.storeValue.value = v || {}; this.storeValue.value = v || {};
this.combo.setValue({ this.combo.setValue({
value: v || {} value: v || {},
}); });
this.numberCounter.setValue({ this.numberCounter.setValue({
value: v || {} value: v || {},
}); });
}, }
getValue: function () { getValue() {
return BI.deepClone(this.storeValue.value); return deepClone(this.storeValue.value);
}, }
populate: function () { populate() {
this.combo.populate(); this.combo.populate();
}, }
focus: function () { focus() {
this.trigger.focus(); this.trigger.focus();
}, }
blur: function () { blur() {
this.trigger.blur(); this.trigger.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.trigger.setWaterMark(v); this.trigger.setWaterMark(v);
} }
}); }
BI.MultiTreeInsertCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiTreeInsertCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiTreeInsertCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiTreeInsertCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiTreeInsertCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiTreeInsertCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.MultiTreeInsertCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.shortcut("bi.multi_tree_insert_combo", BI.MultiTreeInsertCombo);

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

@ -1,38 +1,68 @@
/** import {
* 选中节点不影响父子节点状态的下拉树 shortcut,
* @class BI.MultiTreeListCombo extend,
* @extends BI.Single emptyFn,
*/ createWidget,
toPix,
BI.MultiTreeListCombo = BI.inherit(BI.Single, { nextTick,
_defaultConfig: function () { Events,
return BI.extend(BI.MultiTreeListCombo.superclass._defaultConfig.apply(this, arguments), { AbsoluteLayout,
VerticalAdaptLayout,
deepClone
} from "@/core";
import { Single, Combo } from "@/base";
import { MultiTreeSearchInsertPane } from "trigger/multi.tree.search.insert.pane";
import { MultiTreePopup } from "multi.tree.popup";
import { MultiSelectTrigger } from "../multiselect/multiselect.trigger";
import {
TriggerIconButton,
ListPartTree,
ListDisplayTree,
Listasynctree
} from "@/case";
import { MultiSelectCheckSelectedSwitcher } from "../multiselect/trigger/switcher.checkselected";
@shortcut()
export class MultiTreeListCombo extends Single {
static xtype = "bi.multi_tree_list_combo";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_STOP = "EVENT_STOP";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_CONFIRM = "EVENT_CONFIRM";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-list-combo", baseCls: "bi-multi-tree-list-combo",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
allowInsertValue: true, allowInsertValue: true,
isNeedAdjustWidth: true, isNeedAdjustWidth: true,
text: "", text: "",
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const self = this,
BI.MultiTreeListCombo.superclass._init.apply(this, arguments); o = this.options;
var isInit = false; super._init(...arguments);
var want2showCounter = false; let isInit = false;
let want2showCounter = false;
this.storeValue = { value: o.value || [] }; this.storeValue = { value: o.value || [] };
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.multi_select_trigger", type: "bi.multi_select_trigger",
allowEdit: o.allowEdit, allowEdit: o.allowEdit,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
watermark: o.watermark, watermark: o.watermark,
height: BI.toPix(o.height, o.simple ? 1 : 2), height: toPix(o.height, o.simple ? 1 : 2),
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
masker: { masker: {
offset: { offset: {
@ -46,96 +76,110 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
type: "bi.multi_list_tree_searcher", type: "bi.multi_list_tree_searcher",
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
popup: { popup: {
type: o.allowInsertValue ? "bi.multi_tree_search_insert_pane" : "bi.multi_tree_search_pane", type: o.allowInsertValue
? "bi.multi_tree_search_insert_pane"
: "bi.multi_tree_search_pane",
el: { el: {
type: "bi.list_part_tree" type: ListPartTree.xtype,
}, },
listeners: [{ listeners: [
eventName: BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM, {
action: function () { eventName: MultiTreeSearchInsertPane.EVENT_ADD_ITEM,
self.storeValue.value.unshift([self.trigger.getSearcher().getKeyword()]); action () {
self._assertShowValue(); self.storeValue.value.unshift([
// setValue以更新paras.value, 之后从search popup中拿到的就能有add的值了 self.trigger.getSearcher().getKeyword()
self.combo.setValue(self.storeValue); ]);
self.numberCounter.setValue(self.storeValue); self._assertShowValue();
self._stopEditing(); // setValue以更新paras.value, 之后从search popup中拿到的就能有add的值了
self._dataChange = true; self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue);
self._stopEditing();
self._dataChange = true;
},
} }
}] ],
} },
}, },
switcher: { switcher: {
el: { el: {
type: "bi.multi_tree_check_selected_button" type: "bi.multi_tree_check_selected_button",
}, },
popup: { popup: {
type: "bi.multi_tree_check_pane", type: "bi.multi_tree_check_pane",
el: { el: {
type: "bi.list_display_tree" type: ListDisplayTree.xtype,
}, },
itemsCreator: o.itemsCreator itemsCreator: o.itemsCreator,
} },
}, },
value: this.storeValue value: this.storeValue,
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
cls: (o.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), cls: o.simple ? "bi-border-bottom" : "bi-border bi-border-radius",
toggle: !o.allowEdit, toggle: !o.allowEdit,
container: o.container, container: o.container,
el: this.trigger, el: this.trigger,
adjustLength: 1, adjustLength: 1,
popup: { popup: {
type: "bi.multi_tree_popup_view", type: MultiTreePopup.xtype,
ref: function () { ref () {
self.popup = this; self.popup = this;
self.trigger.setAdapter(this); self.trigger.setAdapter(this);
self.numberCounter.setAdapter(this); self.numberCounter.setAdapter(this);
}, },
el: { el: {
type: "bi.list_async_tree" type: Listasynctree.xtype,
}, },
listeners: [{ listeners: [
eventName: BI.MultiTreePopup.EVENT_AFTERINIT, {
action: function () { eventName: MultiTreePopup.EVENT_AFTERINIT,
self.numberCounter.adjustView(); action () {
isInit = true; self.numberCounter.adjustView();
if (want2showCounter === true) { isInit = true;
showCounter(); if (want2showCounter === true) {
} showCounter();
} }
}, { },
eventName: BI.MultiTreePopup.EVENT_CHANGE, },
action: function () { {
change = true; eventName: MultiTreePopup.EVENT_CHANGE,
var val = { action () {
type: BI.Selection.Multi, change = true;
value: this.hasChecked() ? this.getValue() : [] const val = {
}; type: BI.Selection.Multi,
self.trigger.getSearcher().setState(val); value: this.hasChecked() ? this.getValue() : [],
self.numberCounter.setButtonChecked(val); };
self.storeValue = { value: self.combo.getValue() }; self.trigger.getSearcher().setState(val);
self.fireEvent(BI.MultiTreeListCombo.EVENT_CLICK_ITEM, self.getValue()); self.numberCounter.setButtonChecked(val);
self._dataChange = true; self.storeValue = { value: self.combo.getValue() };
} self.fireEvent(
}, { MultiTreeListCombo.EVENT_CLICK_ITEM,
eventName: BI.MultiTreePopup.EVENT_CLICK_CONFIRM, self.getValue()
action: function () { );
self.combo.hideView(); self._dataChange = true;
} },
}, { },
eventName: BI.MultiTreePopup.EVENT_CLICK_CLEAR, {
action: function () { eventName: MultiTreePopup.EVENT_CLICK_CONFIRM,
clear = true; action () {
self._dataChange = true; self.combo.hideView();
self.setValue(); },
self._defaultState(); },
{
eventName: MultiTreePopup.EVENT_CLICK_CLEAR,
action () {
clear = true;
self._dataChange = true;
self.setValue();
self._defaultState();
},
} }
}], ],
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
onLoaded: function () { onLoaded () {
BI.nextTick(function () { nextTick(() => {
self.numberCounter.adjustView(); self.numberCounter.adjustView();
self.trigger.getSearcher().adjustView(); self.trigger.getSearcher().adjustView();
}); });
@ -144,49 +188,51 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
}, },
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
value: this.storeValue, value: this.storeValue,
hideChecker: function (e) { hideChecker (e) {
return triggerBtn.element.find(e.target).length === 0 && return (
self.numberCounter.element.find(e.target).length === 0; triggerBtn.element.find(e.target).length === 0 &&
} self.numberCounter.element.find(e.target).length === 0
);
},
}); });
var change = false; var change = false;
var clear = false; // 标识当前是否点击了清空 var clear = false; // 标识当前是否点击了清空
var isSearching = function () { const isSearching = function () {
return self.trigger.getSearcher().isSearching(); return self.trigger.getSearcher().isSearching();
}; };
var isPopupView = function () { const isPopupView = function () {
return self.combo.isViewVisible(); return self.combo.isViewVisible();
}; };
this.trigger.on(BI.MultiSelectTrigger.EVENT_FOCUS, function () { this.trigger.on(MultiSelectTrigger.EVENT_FOCUS, () => {
self.fireEvent(BI.MultiTreeListCombo.EVENT_FOCUS); self.fireEvent(MultiTreeListCombo.EVENT_FOCUS);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_BLUR, function () { this.trigger.on(MultiSelectTrigger.EVENT_BLUR, () => {
self.fireEvent(BI.MultiTreeListCombo.EVENT_BLUR); self.fireEvent(MultiTreeListCombo.EVENT_BLUR);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_START, function () { this.trigger.on(MultiSelectTrigger.EVENT_START, function () {
self.storeValue = { value: self.combo.getValue() }; self.storeValue = { value: self.combo.getValue() };
this.setValue(self.storeValue); this.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_STOP, function () { this.trigger.on(MultiSelectTrigger.EVENT_STOP, function () {
self.storeValue = { value: this.getValue() }; self.storeValue = { value: this.getValue() };
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
BI.nextTick(function () { nextTick(() => {
if (isPopupView()) { if (isPopupView()) {
self.combo.populate(); self.combo.populate();
} }
}); });
self.fireEvent(BI.MultiTreeListCombo.EVENT_STOP); self.fireEvent(MultiTreeListCombo.EVENT_STOP);
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_SEARCHING, function () { this.trigger.on(MultiSelectTrigger.EVENT_SEARCHING, () => {
self.fireEvent(BI.MultiTreeListCombo.EVENT_SEARCHING); self.fireEvent(MultiTreeListCombo.EVENT_SEARCHING);
}); });
function showCounter() { function showCounter() {
@ -199,23 +245,28 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
} }
this.trigger.on(BI.MultiSelectTrigger.EVENT_TRIGGER_CLICK, function () { this.trigger.on(MultiSelectTrigger.EVENT_TRIGGER_CLICK, () => {
self.combo.toggle(); self.combo.toggle();
}); });
this.trigger.on(BI.MultiSelectTrigger.EVENT_CHANGE, function () { this.trigger.on(MultiSelectTrigger.EVENT_CHANGE, function () {
var checked = this.getSearcher().hasChecked(); const checked = this.getSearcher().hasChecked();
var val = { const val = {
type: BI.Selection.Multi, type: BI.Selection.Multi,
value: checked ? { 1: 1 } : {} value: checked ? { 1: 1 } : {},
}; };
this.getSearcher().setState(checked ? BI.Selection.Multi : BI.Selection.None); this.getSearcher().setState(
checked ? BI.Selection.Multi : BI.Selection.None
);
self.numberCounter.setButtonChecked(val); self.numberCounter.setButtonChecked(val);
self.fireEvent(BI.MultiTreeListCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
MultiTreeListCombo.EVENT_CLICK_ITEM,
self.combo.getValue()
);
self._dataChange = true; self._dataChange = true;
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
if (isSearching()) { if (isSearching()) {
return; return;
} }
@ -229,12 +280,13 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
self.combo.setValue(self.storeValue); self.combo.setValue(self.storeValue);
self.numberCounter.setValue(self.storeValue); self.numberCounter.setValue(self.storeValue);
self.populate(); self.populate();
self.fireEvent(BI.MultiTreeListCombo.EVENT_BEFORE_POPUPVIEW); self.fireEvent(MultiTreeListCombo.EVENT_BEFORE_POPUPVIEW);
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_HIDEVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_HIDEVIEW, () => {
if (isSearching()) { if (isSearching()) {
self.trigger.stopEditing(); self.trigger.stopEditing();
self._dataChange && self.fireEvent(BI.MultiTreeListCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeListCombo.EVENT_CONFIRM);
} else { } else {
if (isPopupView()) { if (isPopupView()) {
self._stopEditing(); self._stopEditing();
@ -242,20 +294,21 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
if (clear === true) { if (clear === true) {
self.storeValue = { value: [] }; self.storeValue = { value: [] };
} }
self._dataChange && self.fireEvent(BI.MultiTreeListCombo.EVENT_CONFIRM); self._dataChange &&
self.fireEvent(MultiTreeListCombo.EVENT_CONFIRM);
} }
} }
clear = false; clear = false;
change = false; change = false;
}); });
var triggerBtn = BI.createWidget({ var triggerBtn = createWidget({
type: "bi.trigger_icon_button", type: TriggerIconButton.xtype,
width: o.height, width: o.height,
height: o.height, height: o.height,
cls: "multi-select-trigger-icon-button" cls: "multi-select-trigger-icon-button",
}); });
triggerBtn.on(BI.TriggerIconButton.EVENT_CHANGE, function () { triggerBtn.on(TriggerIconButton.EVENT_CHANGE, () => {
self.numberCounter.hideView(); self.numberCounter.hideView();
if (self.combo.isViewVisible()) { if (self.combo.isViewVisible()) {
self.combo.hideView(); self.combo.hideView();
@ -264,13 +317,13 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
} }
}); });
this.numberCounter = BI.createWidget({ this.numberCounter = createWidget({
type: "bi.multi_select_check_selected_switcher", type: "bi.multi_select_check_selected_switcher",
el: { el: {
type: "bi.multi_tree_check_selected_button" type: "bi.multi_tree_check_selected_button",
}, },
popup: { popup: {
type: "bi.multi_tree_check_pane" type: "bi.multi_tree_check_pane",
}, },
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
masker: { masker: {
@ -282,131 +335,138 @@ BI.MultiTreeListCombo = BI.inherit(BI.Single, {
}, },
}, },
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
value: o.value value: o.value,
});
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE, function () {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
}); });
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW, function () { this.numberCounter.on(
if (want2showCounter === false) { MultiSelectCheckSelectedSwitcher.EVENT_TRIGGER_CHANGE,
want2showCounter = true; () => {
if (!self.combo.isViewVisible()) {
self.combo.showView();
}
} }
if (isInit === true) { );
want2showCounter = null; this.numberCounter.on(
showCounter(); MultiSelectCheckSelectedSwitcher.EVENT_BEFORE_POPUPVIEW,
() => {
if (want2showCounter === false) {
want2showCounter = true;
}
if (isInit === true) {
want2showCounter = null;
showCounter();
}
} }
}); );
this.numberCounter.on(BI.Events.VIEW, function (b) { this.numberCounter.on(Events.VIEW, b => {
BI.nextTick(function () {// 自动调整宽度 nextTick(() => {
self.trigger.refreshPlaceHolderWidth((b === true ? self.numberCounter.element.outerWidth() + 8 : 0)); // 自动调整宽度
self.trigger.refreshPlaceHolderWidth(
b === true ? self.numberCounter.element.outerWidth() + 8 : 0
);
}); });
}); });
this.numberCounter.on(BI.MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW, function () { this.numberCounter.on(
BI.nextTick(function () {// 收起时自动调整宽度 MultiSelectCheckSelectedSwitcher.EVENT_AFTER_HIDEVIEW,
self.trigger.refreshPlaceHolderWidth(0); () => {
}); nextTick(() => {
}); // 收起时自动调整宽度
self.trigger.refreshPlaceHolderWidth(0);
});
}
);
this.trigger.element.click(function (e) { this.trigger.element.click(e => {
if (self.trigger.element.find(e.target).length > 0) { if (self.trigger.element.find(e.target).length > 0) {
self.numberCounter.hideView(); self.numberCounter.hideView();
} }
}); });
BI.createWidget({ createWidget({
type: "bi.absolute", type: AbsoluteLayout.xtype,
element: this, element: this,
items: [{ items: [
el: this.combo, {
left: 0, el: this.combo,
right: 0, left: 0,
top: 0, right: 0,
bottom: 0 top: 0,
}, { bottom: 0,
el: triggerBtn, },
right: 0, {
top: 0, el: triggerBtn,
bottom: 0 right: 0,
}, { top: 0,
el: { bottom: 0,
type: "bi.vertical_adapt",
items: [this.numberCounter]
}, },
right: o.height, {
top: 0, el: {
height: o.height, type: VerticalAdaptLayout.xtype,
}] items: [this.numberCounter],
},
right: o.height,
top: 0,
height: o.height,
}
],
}); });
}, }
_assertShowValue: function () { _assertShowValue() {
this.trigger.getSearcher().setState(this.storeValue); this.trigger.getSearcher().setState(this.storeValue);
this.numberCounter.setButtonChecked(this.storeValue); this.numberCounter.setButtonChecked(this.storeValue);
}, }
_stopEditing: function () { _stopEditing() {
this.trigger.stopEditing(); this.trigger.stopEditing();
this.numberCounter.hideView(); this.numberCounter.hideView();
}, }
_defaultState: function () { _defaultState() {
this._stopEditing(); this._stopEditing();
this.combo.hideView(); this.combo.hideView();
}, }
showView: function () { showView() {
this.combo.showView(); this.combo.showView();
}, }
hideView: function () { hideView() {
this.combo.hideView(); this.combo.hideView();
}, }
getSearcher: function () { getSearcher() {
return this.trigger.getSearcher(); return this.trigger.getSearcher();
}, }
setValue: function (v) { setValue(v) {
this.storeValue.value = v || []; this.storeValue.value = v || [];
this.combo.setValue({ this.combo.setValue({
value: v || [] value: v || [],
}); });
this.numberCounter.setValue({ this.numberCounter.setValue({
value: v || [] value: v || [],
}); });
}, }
getValue: function () { getValue() {
return BI.deepClone(this.storeValue.value); return deepClone(this.storeValue.value);
}, }
populate: function () { populate() {
this.combo.populate(); this.combo.populate();
}, }
focus: function () { focus() {
this.trigger.focus(); this.trigger.focus();
}, }
blur: function () { blur() {
this.trigger.blur(); this.trigger.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.trigger.setWaterMark(v); this.trigger.setWaterMark(v);
} }
}); }
BI.MultiTreeListCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiTreeListCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiTreeListCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiTreeListCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.MultiTreeListCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiTreeListCombo.EVENT_CONFIRM = "EVENT_CONFIRM";
BI.MultiTreeListCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.shortcut("bi.multi_tree_list_combo", BI.MultiTreeListCombo);

114
src/widget/multitree/multi.tree.popup.js

@ -1,106 +1,108 @@
/** import { shortcut, extend, emptyFn, createWidget, i18nText } from "@/core";
* 带加载的多选下拉面板 import { Pane } from "@/base";
* @class BI.MultiTreePopup import { Asynctree, MultiPopupView, TreeView } from "@/case";
* @extends BI.Pane
*/ @shortcut()
BI.MultiTreePopup = BI.inherit(BI.Pane, { export class MultiTreePopup extends Pane {
static xtype = "bi.multi_tree_popup_view";
_defaultConfig: function () {
return BI.extend(BI.MultiTreePopup.superclass._defaultConfig.apply(this, arguments), { static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
static EVENT_AFTERINIT = "EVENT_AFTERINIT";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-popup", baseCls: "bi-multi-tree-popup",
maxWidth: "auto", maxWidth: "auto",
minWidth: 140, minWidth: 140,
maxHeight: 400, maxHeight: 400,
onLoaded: BI.emptyFn, onLoaded: emptyFn,
el: { el: {
type: "bi.async_tree" type: Asynctree.xtype,
} },
}); });
}, }
_init: function () { _init() {
BI.MultiTreePopup.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, opts = this.options, v = opts.value; const self = this,
opts = this.options,
v = opts.value;
this.selectedValues = {}; this.selectedValues = {};
this.tree = BI.createWidget(opts.el, { this.tree = createWidget(opts.el, {
type: "bi.async_tree", type: Asynctree.xtype,
showLine: opts.showLine, showLine: opts.showLine,
height: 400, height: 400,
cls: "popup-view-tree", cls: "popup-view-tree",
itemsCreator: opts.itemsCreator, itemsCreator: opts.itemsCreator,
onLoaded: opts.onLoaded, onLoaded: opts.onLoaded,
value: v.value || {} value: v.value || {},
}); });
this.popupView = BI.createWidget({ this.popupView = createWidget({
type: "bi.multi_popup_view", type: MultiPopupView.xtype,
element: this, element: this,
stopPropagation: false, stopPropagation: false,
maxWidth: opts.maxWidth, maxWidth: opts.maxWidth,
minWidth: opts.minWidth, minWidth: opts.minWidth,
maxHeight: opts.maxHeight, maxHeight: opts.maxHeight,
buttons: [BI.i18nText("BI-Basic_Clears"), BI.i18nText("BI-Basic_OK")], buttons: [i18nText("BI-Basic_Clears"), i18nText("BI-Basic_OK")],
el: this.tree el: this.tree,
}); });
this.popupView.on(BI.MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON, function (index) { this.popupView.on(
switch (index) { MultiPopupView.EVENT_CLICK_TOOLBAR_BUTTON,
index => {
switch (index) {
case 0: case 0:
self.fireEvent(BI.MultiTreePopup.EVENT_CLICK_CLEAR); self.fireEvent(MultiTreePopup.EVENT_CLICK_CLEAR);
break; break;
case 1: case 1:
self.fireEvent(BI.MultiTreePopup.EVENT_CLICK_CONFIRM); self.fireEvent(MultiTreePopup.EVENT_CLICK_CONFIRM);
break; break;
}
} }
}); );
this.tree.on(BI.TreeView.EVENT_CHANGE, function () { this.tree.on(TreeView.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiTreePopup.EVENT_CHANGE); self.fireEvent(MultiTreePopup.EVENT_CHANGE);
}); });
this.tree.on(BI.TreeView.EVENT_AFTERINIT, function () { this.tree.on(TreeView.EVENT_AFTERINIT, () => {
self.fireEvent(BI.MultiTreePopup.EVENT_AFTERINIT); self.fireEvent(MultiTreePopup.EVENT_AFTERINIT);
}); });
}
}, getValue() {
getValue: function () {
return this.tree.getValue(); return this.tree.getValue();
}, }
setValue: function (v) { setValue(v) {
v || (v = {}); v || (v = {});
this.tree.setSelectedValue(v.value); this.tree.setSelectedValue(v.value);
}, }
populate: function (config) { populate(config) {
this.tree.stroke(config); this.tree.stroke(config);
}, }
hasChecked: function () { hasChecked() {
return this.tree.hasChecked(); return this.tree.hasChecked();
}, }
setDirection: function (direction, position) { setDirection(direction, position) {
this.popupView.setDirection(direction, position); this.popupView.setDirection(direction, position);
}, }
resetHeight: function (h) { resetHeight(h) {
this.popupView.resetHeight(h); this.popupView.resetHeight(h);
}, }
resetWidth: function (w) { resetWidth(w) {
this.popupView.resetWidth(w); this.popupView.resetWidth(w);
} }
}); }
BI.MultiTreePopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiTreePopup.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
BI.MultiTreePopup.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
BI.MultiTreePopup.EVENT_AFTERINIT = "EVENT_AFTERINIT";
BI.shortcut("bi.multi_tree_popup_view", BI.MultiTreePopup);

93
src/widget/multitree/trigger/multi.tree.button.checkselected.js

@ -1,67 +1,80 @@
/** import {
* 查看已选按钮 shortcut,
* Created by guy on 15/11/3. extend,
* @class BI.MultiTreeCheckSelectedButton emptyFn,
* @extends BI.Single createWidget,
*/ i18nText,
BI.MultiTreeCheckSelectedButton = BI.inherit(BI.Single, { Controller,
size
} from "@/core";
import { Single, TextButton, IconButton } from "@/base";
import { MultiSelectCheckSelectedButton } from "../../multiselect/trigger/button.checkselected";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiTreeCheckSelectedButton.superclass._defaultConfig.apply(this, arguments), { export class MultiTreeCheckSelectedButton extends Single {
static xtype = "bi.multi_tree_check_selected_button";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-check-selected-button", baseCls: "bi-multi-tree-check-selected-button",
itemsCreator: BI.emptyFn itemsCreator: emptyFn,
}); });
}, }
_init: function () { _init() {
BI.MultiTreeCheckSelectedButton.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this; const self = this;
this.indicator = BI.createWidget({ this.indicator = createWidget({
type: "bi.icon_button", type: IconButton.xtype,
cls: "check-font trigger-check-selected icon-size-12", cls: "check-font trigger-check-selected icon-size-12",
width: 16, width: 16,
height: 16, height: 16,
stopPropagation: true stopPropagation: true,
}); });
this.checkSelected = BI.createWidget({ this.checkSelected = createWidget({
type: "bi.text_button", type: TextButton.xtype,
cls: "bi-high-light-background trigger-check-text", cls: "bi-high-light-background trigger-check-text",
invisible: true, invisible: true,
hgap: 4, hgap: 4,
text: BI.i18nText("BI-Check_Selected"), text: i18nText("BI-Check_Selected"),
textAlign: "center", textAlign: "center",
}); });
this.checkSelected.on(BI.Controller.EVENT_CHANGE, function () { this.checkSelected.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.checkSelected.on(BI.TextButton.EVENT_CHANGE, function () { this.checkSelected.on(TextButton.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiSelectCheckSelectedButton.EVENT_CHANGE, arguments); self.fireEvent(
MultiSelectCheckSelectedButton.EVENT_CHANGE,
arguments
);
}); });
BI.createWidget({ createWidget({
type: "bi.horizontal", type: "bi.horizontal",
element: this, element: this,
items: [this.indicator, this.checkSelected] items: [this.indicator, this.checkSelected],
}); });
this.element.hover(function () { this.element.hover(
self.indicator.setVisible(false); () => {
self.checkSelected.setVisible(true); self.indicator.setVisible(false);
}, function () { self.checkSelected.setVisible(true);
self.indicator.setVisible(true); },
self.checkSelected.setVisible(false); () => {
}); self.indicator.setVisible(true);
self.checkSelected.setVisible(false);
}
);
this.setVisible(false); this.setVisible(false);
}, }
setValue: function (v) { setValue(v) {
v || (v = {}); v || (v = {});
var show = BI.size(v.value) > 0; const show = size(v.value) > 0;
this.setVisible(show); this.setVisible(show);
} }
}); }
BI.MultiTreeCheckSelectedButton.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multi_tree_check_selected_button", BI.MultiTreeCheckSelectedButton);

199
src/widget/multitree/trigger/multi.tree.search.insert.pane.js

@ -1,129 +1,148 @@
/** import {
* shortcut,
* 在搜索框中输入文本弹出的面板 Widget,
* @class BI.MultiTreeSearchInsertPane i18nText,
* @extends BI.Pane extend,
*/ Controller,
AbsoluteLayout,
isEmptyArray
} from "@/core";
import { TreeView, PartTree } from "@/case";
import { TextButton } from "@/base";
BI.MultiTreeSearchInsertPane = BI.inherit(BI.Widget, { @shortcut()
export class MultiTreeSearchInsertPane extends Widget {
static xtype = "bi.multi_tree_search_insert_pane";
constants: { props = {
height: 24,
},
props: {
baseCls: "bi-multi-tree-search-insert-pane bi-card", baseCls: "bi-multi-tree-search-insert-pane bi-card",
itemsCreator: BI.emptyFn, el: { type: PartTree.xtype },
keywordGetter: BI.emptyFn, };
el: {
type: "bi.part_tree" static EVENT_CHANGE = "EVENT_CHANGE";
} static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
}, static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
render: function () { render() {
var self = this, opts = this.options; const self = this,
opts = this.options;
return { return {
type: "bi.absolute", type: AbsoluteLayout.xtype,
items: [ items: [
{ {
el: { el: {
type: "bi.text_button", type: TextButton.xtype,
invisible: true, invisible: true,
ref: function (_ref) { ref(_ref) {
self.addTip = _ref; self.addTip = _ref;
}, },
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), text: i18nText("BI-Basic_Click_To_Add_Text", ""),
height: this.constants.height, height: this.constants.height,
cls: "bi-high-light", cls: "bi-high-light",
handler: function () { handler() {
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM, opts.keywordGetter()); self.fireEvent(
} MultiTreeSearchInsertPane.EVENT_ADD_ITEM,
opts.keywordGetter()
);
},
}, },
top: 5, top: 5,
left: 0, left: 0,
right: 0 right: 0,
}, { },
el: BI.extend({ {
type: "bi.part_tree", el: extend(
tipText: BI.i18nText("BI-No_Select"), {
itemsCreator: function (op, callback) { type: PartTree.xtype,
op.keyword = opts.keywordGetter(); tipText: i18nText("BI-No_Select"),
opts.itemsCreator(op, function (res) { itemsCreator(op, callback) {
callback(res); op.keyword = opts.keywordGetter();
self.setKeyword(opts.keywordGetter(), res.items); opts.itemsCreator(op, res => {
}); callback(res);
}, self.setKeyword(
ref: function (_ref) { opts.keywordGetter(),
self.partTree = _ref; res.items
}, );
value: opts.value, });
listeners: [ },
{ ref(_ref) {
eventName: BI.Controller.EVENT_CHANGE, self.partTree = _ref;
action: function () { },
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); value: opts.value,
} listeners: [
}, { {
eventName: BI.TreeView.EVENT_CHANGE, eventName: Controller.EVENT_CHANGE,
action: function () { action() {
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_CHANGE); self.fireEvent(
} Controller.EVENT_CHANGE,
}, { arguments
eventName: BI.PartTree.EVENT_CLICK_TREE_NODE, );
action: function () { },
self.fireEvent(BI.MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE); },
{
eventName: TreeView.EVENT_CHANGE,
action() {
self.fireEvent(
MultiTreeSearchInsertPane.EVENT_CHANGE
);
},
},
{
eventName: PartTree.EVENT_CLICK_TREE_NODE,
action() {
self.fireEvent(
MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE
);
},
} }
} ],
] },
}, opts.el), opts.el
),
left: 0, left: 0,
top: 0, top: 0,
bottom: 0, bottom: 0,
right: 0 right: 0,
} }
] ],
}; };
}, }
setKeyword: function (keyword, nodes) { setKeyword(keyword, nodes) {
var isAddTipVisible = BI.isEmptyArray(nodes); const isAddTipVisible = isEmptyArray(nodes);
this.addTip.setVisible(isAddTipVisible); this.addTip.setVisible(isAddTipVisible);
this.partTree.setVisible(!isAddTipVisible); this.partTree.setVisible(!isAddTipVisible);
isAddTipVisible && this.addTip.setText(BI.i18nText("BI-Basic_Click_To_Add_Text", keyword)); isAddTipVisible &&
}, this.addTip.setText(
i18nText("BI-Basic_Click_To_Add_Text", keyword)
);
}
hasChecked: function () { hasChecked() {
return this.partTree.hasChecked(); return this.partTree.hasChecked();
}, }
setValue: function (v) { setValue(v) {
this.setSelectedValue(v.value); this.setSelectedValue(v.value);
}, }
setSelectedValue: function (v) { setSelectedValue(v) {
v || (v = {}); v || (v = {});
this.partTree.setSelectedValue(v); this.partTree.setSelectedValue(v);
}, }
getValue: function () { getValue() {
return this.partTree.getValue(); return this.partTree.getValue();
}, }
empty: function () { empty() {
this.partTree.empty(); this.partTree.empty();
},
populate: function (op) {
this.partTree.stroke.apply(this.partTree, arguments);
} }
});
BI.MultiTreeSearchInsertPane.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiTreeSearchInsertPane.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; populate(op) {
BI.MultiTreeSearchInsertPane.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; this.partTree.stroke(...arguments);
BI.MultiTreeSearchInsertPane.EVENT_ADD_ITEM = "EVENT_ADD_ITEM"; }
BI.MultiTreeSearchInsertPane.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE"; }
BI.shortcut("bi.multi_tree_search_insert_pane", BI.MultiTreeSearchInsertPane);

132
src/widget/multitree/trigger/multi.tree.search.pane.js

@ -1,84 +1,84 @@
/** import { shortcut, extend, i18nText, Controller } from "@/core";
* import { Pane } from "@/base";
* 在搜索框中输入文本弹出的面板 import { TreeView, PartTree } from "@/case";
* @class BI.MultiTreeSearchPane
* @extends BI.Pane
*/
BI.MultiTreeSearchPane = BI.inherit(BI.Pane, { @shortcut()
export class MultiTreeSearchPane extends Pane {
static xtype = "bi.multi_tree_search_pane";
props: { props = { baseCls: "bi-multi-tree-search-pane bi-card" };
baseCls: "bi-multi-tree-search-pane bi-card",
itemsCreator: BI.emptyFn,
keywordGetter: BI.emptyFn
},
render: function () { static EVENT_CHANGE = "EVENT_CHANGE";
var self = this, opts = this.options; static EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM";
static EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR";
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
return BI.extend({ render() {
type: "bi.part_tree", const self = this,
element: this, opts = this.options;
tipText: BI.i18nText("BI-No_Select"),
itemsCreator: function (op, callback) { return extend(
op.keyword = opts.keywordGetter(); {
opts.itemsCreator(op, callback); type: PartTree.xtype,
}, element: this,
value: opts.value, tipText: i18nText("BI-No_Select"),
listeners: [ itemsCreator(op, callback) {
{ op.keyword = opts.keywordGetter();
eventName: BI.Controller.EVENT_CHANGE, opts.itemsCreator(op, callback);
action: function () { },
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); value: opts.value,
} listeners: [
}, { {
eventName: BI.TreeView.EVENT_CHANGE, eventName: Controller.EVENT_CHANGE,
action: function () { action() {
self.fireEvent(BI.MultiTreeSearchPane.EVENT_CHANGE); self.fireEvent(Controller.EVENT_CHANGE, arguments);
} },
}, { },
eventName: BI.PartTree.EVENT_CLICK_TREE_NODE, {
action: function () { eventName: TreeView.EVENT_CHANGE,
self.fireEvent(BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE); action() {
self.fireEvent(MultiTreeSearchPane.EVENT_CHANGE);
},
},
{
eventName: PartTree.EVENT_CLICK_TREE_NODE,
action() {
self.fireEvent(
MultiTreeSearchPane.EVENT_CLICK_TREE_NODE
);
},
} }
} ],
], ref(_ref) {
ref: function (_ref) { self.partTree = _ref;
self.partTree = _ref; },
} },
}, opts.el); opts.el
}, );
}
hasChecked: function () { hasChecked() {
return this.partTree.hasChecked(); return this.partTree.hasChecked();
}, }
setValue: function (v) { setValue(v) {
this.setSelectedValue(v.value); this.setSelectedValue(v.value);
}, }
setSelectedValue: function (v) { setSelectedValue(v) {
v || (v = {}); v || (v = {});
this.partTree.setSelectedValue(v); this.partTree.setSelectedValue(v);
}, }
getValue: function () { getValue() {
return this.partTree.getValue(); return this.partTree.getValue();
}, }
empty: function () { empty() {
this.partTree.empty(); this.partTree.empty();
},
populate: function (op) {
this.partTree.stroke.apply(this.partTree, arguments);
} }
});
BI.MultiTreeSearchPane.EVENT_CHANGE = "EVENT_CHANGE"; populate(op) {
this.partTree.stroke(...arguments);
BI.MultiTreeSearchPane.EVENT_CLICK_CONFIRM = "EVENT_CLICK_CONFIRM"; }
BI.MultiTreeSearchPane.EVENT_CLICK_CLEAR = "EVENT_CLICK_CLEAR"; }
BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
BI.shortcut("bi.multi_tree_search_pane", BI.MultiTreeSearchPane);

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

@ -1,140 +1,168 @@
/** import {
* searcher shortcut,
* Created by guy on 15/11/3. Widget,
* @class BI.MultiListTreeSearcher extend,
* @extends Widget emptyFn,
*/ createWidget,
BI.MultiListTreeSearcher = BI.inherit(BI.Widget, { isNotNull,
isNumber,
_defaultConfig: function () { size,
return BI.extend(BI.MultiListTreeSearcher.superclass._defaultConfig.apply(this, arguments), { each,
last
} from "@/core";
import { MultiSelectEditor } from "../../multiselect/trigger/editor.multiselect";
import { MultiSelectSearcher } from "../../multiselect/trigger/searcher.multiselect";
import { Searcher } from "@/base";
import { SimpleStateEditor } from "@/case";
import { MultiTreeSearchPane } from "multi.tree.search.pane";
@shortcut()
export class MultiListTreeSearcher extends Widget {
static xtype = "bi.multi_list_tree_searcher";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_START = "EVENT_START";
static EVENT_STOP = "EVENT_STOP";
static EVENT_PAUSE = "EVENT_PAUSE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-list-tree-searcher", baseCls: "bi-multi-list-tree-searcher",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: function (v) { valueFormatter(v) {
return v; return v;
}, },
popup: {}, popup: {},
adapter: null, adapter: null,
masker: {} masker: {},
}); });
}, }
_init: function () { _init() {
BI.MultiListTreeSearcher.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.editor = BI.createWidget({ o = this.options;
type: "bi.multi_select_editor", this.editor = createWidget({
type: MultiSelectEditor.xtype,
height: o.height, height: o.height,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
watermark: o.watermark, watermark: o.watermark,
el: { el: {
type: "bi.simple_state_editor", type: SimpleStateEditor.xtype,
height: o.height height: o.height,
}, },
listeners: [{ listeners: [
eventName: BI.MultiSelectEditor.EVENT_FOCUS, {
action: function () { eventName: MultiSelectEditor.EVENT_FOCUS,
self.fireEvent(BI.MultiSelectSearcher.EVENT_FOCUS); action() {
} self.fireEvent(MultiSelectSearcher.EVENT_FOCUS);
}, { },
eventName: BI.MultiSelectEditor.EVENT_BLUR, },
action: function () { {
self.fireEvent(BI.MultiSelectSearcher.EVENT_BLUR); eventName: MultiSelectEditor.EVENT_BLUR,
action() {
self.fireEvent(MultiSelectSearcher.EVENT_BLUR);
},
} }
}] ],
}); });
this.searcher = BI.createWidget({ this.searcher = createWidget({
type: "bi.searcher", type: Searcher.xtype,
element: this, element: this,
isAutoSearch: false, isAutoSearch: false,
isAutoSync: false, isAutoSync: false,
onSearch: function (op, callback) { onSearch(op, callback) {
callback({ callback({
keyword: self.editor.getValue() keyword: self.editor.getValue(),
}); });
}, },
el: this.editor, el: this.editor,
popup: BI.extend({ popup: extend(
type: "bi.multi_tree_search_pane", {
keywordGetter: function () { type: MultiTreeSearchPane.xtype,
return self.editor.getValue(); keywordGetter() {
return self.editor.getValue();
},
itemsCreator(op, callback) {
op.keyword = self.editor.getValue();
o.itemsCreator(op, callback);
},
value: o.value,
}, },
itemsCreator: function (op, callback) { o.popup
op.keyword = self.editor.getValue(); ),
o.itemsCreator(op, callback);
},
value: o.value
}, o.popup),
adapter: o.adapter, adapter: o.adapter,
masker: o.masker masker: o.masker,
}); });
this.searcher.on(BI.Searcher.EVENT_START, function () { this.searcher.on(Searcher.EVENT_START, () => {
self.fireEvent(BI.MultiListTreeSearcher.EVENT_START); self.fireEvent(MultiListTreeSearcher.EVENT_START);
}); });
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () { this.searcher.on(Searcher.EVENT_PAUSE, () => {
if (this.hasMatched()) { self.fireEvent(MultiListTreeSearcher.EVENT_PAUSE);
}
self.fireEvent(BI.MultiListTreeSearcher.EVENT_PAUSE);
}); });
this.searcher.on(BI.Searcher.EVENT_STOP, function () { this.searcher.on(Searcher.EVENT_STOP, () => {
self.fireEvent(BI.MultiListTreeSearcher.EVENT_STOP); self.fireEvent(MultiListTreeSearcher.EVENT_STOP);
}); });
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () { this.searcher.on(Searcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiListTreeSearcher.EVENT_CHANGE, arguments); self.fireEvent(MultiListTreeSearcher.EVENT_CHANGE, arguments);
}); });
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setState(o.value); this.setState(o.value);
} }
}, }
adjustView: function () { adjustView() {
this.searcher.adjustView(); this.searcher.adjustView();
}, }
setAdapter: function (adapter) { setAdapter(adapter) {
this.searcher.setAdapter(adapter); this.searcher.setAdapter(adapter);
}, }
isSearching: function () { isSearching() {
return this.searcher.isSearching(); return this.searcher.isSearching();
}, }
stopSearch: function () { stopSearch() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
getKeyword: function () { getKeyword() {
return this.editor.getValue(); return this.editor.getValue();
}, }
hasMatched: function () { hasMatched() {
return this.searcher.hasMatched(); return this.searcher.hasMatched();
}, }
hasChecked: function () { hasChecked() {
return this.searcher.getView() && this.searcher.getView().hasChecked(); return this.searcher.getView() && this.searcher.getView().hasChecked();
}, }
setState: function (ob) { setState(ob) {
var o = this.options; const o = this.options;
ob || (ob = {}); ob || (ob = {});
ob.value || (ob.value = []); ob.value || (ob.value = []);
var count = 0; let count = 0;
if (BI.isNumber(ob)) { if (isNumber(ob)) {
this.editor.setState(ob); this.editor.setState(ob);
} else if (BI.size(ob.value) === 0) { } else if (size(ob.value) === 0) {
this.editor.setState(BI.Selection.None); this.editor.setState(BI.Selection.None);
} else { } else {
var text = ""; let text = "";
BI.each(ob.value, function (idx, path) { each(ob.value, (idx, path) => {
var childValue = BI.last(path); const childValue = last(path);
text += (path === "null" ? "" : (o.valueFormatter(childValue + "") || childValue) + "; "); text +=
path === "null"
? ""
: `${o.valueFormatter(`${childValue}`) || childValue
}; `;
count++; count++;
}); });
@ -144,45 +172,38 @@ BI.MultiListTreeSearcher = BI.inherit(BI.Widget, {
this.editor.setState(text); this.editor.setState(text);
} }
} }
}, }
getState: function () { getState() {
return this.editor.getState(); return this.editor.getState();
}, }
setValue: function (ob) { setValue(ob) {
this.setState(ob); this.setState(ob);
this.searcher.setValue(ob); this.searcher.setValue(ob);
}, }
getKey: function () { getKey() {
return this.editor.getValue(); return this.editor.getValue();
}, }
getValue: function () { getValue() {
return this.searcher.getValue(); return this.searcher.getValue();
}, }
populate: function (items) { populate(items) {
this.searcher.populate.apply(this.searcher, arguments); this.searcher.populate(...arguments);
}, }
focus: function () { focus() {
this.editor.focus(); this.editor.focus();
}, }
blur: function () { blur() {
this.editor.blur(); this.editor.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.editor.setWaterMark(v); this.editor.setWaterMark(v);
} }
}); }
BI.MultiListTreeSearcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.MultiListTreeSearcher.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiListTreeSearcher.EVENT_START = "EVENT_START";
BI.MultiListTreeSearcher.EVENT_STOP = "EVENT_STOP";
BI.MultiListTreeSearcher.EVENT_PAUSE = "EVENT_PAUSE";
BI.shortcut("bi.multi_list_tree_searcher", BI.MultiListTreeSearcher);

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

@ -1,220 +1,260 @@
/** import {
* searcher shortcut,
* Created by guy on 15/11/3. Widget,
* @class BI.MultiTreeSearcher extend,
* @extends Widget emptyFn,
*/ createWidget,
BI.MultiTreeSearcher = BI.inherit(BI.Widget, { isNotNull,
isNumber,
_defaultConfig: function () { size,
return BI.extend(BI.MultiTreeSearcher.superclass._defaultConfig.apply(this, arguments), { keys,
each,
isEmptyObject, Func
} from "@/core";
import { MultiSelectEditor } from "../../multiselect/trigger/editor.multiselect";
import { MultiSelectSearcher } from "../../multiselect/trigger/searcher.multiselect";
import { MultiTreeSearchPane } from "multi.tree.search.pane";
import { Searcher } from "@/base";
import { SimpleStateEditor } from "@/case";
@shortcut()
export class MultiTreeSearcher extends Widget {
static xtype = "bi.multi_tree_searcher";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_START = "EVENT_START";
static EVENT_STOP = "EVENT_STOP";
static EVENT_PAUSE = "EVENT_PAUSE";
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multi-tree-searcher", baseCls: "bi-multi-tree-searcher",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
valueFormatter: function (v) { valueFormatter(v) {
return v; return v;
}, },
popup: {}, popup: {},
adapter: null, adapter: null,
masker: {} masker: {},
}); });
}, }
_init: function () { _init() {
BI.MultiTreeSearcher.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
this.editor = BI.createWidget({ o = this.options;
this.editor = createWidget({
type: "bi.multi_select_editor", type: "bi.multi_select_editor",
watermark: o.watermark, watermark: o.watermark,
height: o.height, height: o.height,
el: { el: {
type: "bi.simple_state_editor", type: SimpleStateEditor.xtype,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
height: o.height height: o.height,
}, },
listeners: [ listeners: [
{ {
eventName: BI.MultiSelectEditor.EVENT_FOCUS, eventName: MultiSelectEditor.EVENT_FOCUS,
action: function () { action() {
self.fireEvent(BI.MultiSelectSearcher.EVENT_FOCUS); self.fireEvent(MultiSelectSearcher.EVENT_FOCUS);
} },
}, { },
eventName: BI.MultiSelectEditor.EVENT_BLUR, {
action: function () { eventName: MultiSelectEditor.EVENT_BLUR,
self.fireEvent(BI.MultiSelectSearcher.EVENT_BLUR); action() {
} self.fireEvent(MultiSelectSearcher.EVENT_BLUR);
},
} }
] ],
}); });
this.searcher = BI.createWidget({ this.searcher = createWidget({
type: "bi.searcher", type: Searcher.xtype,
element: this, element: this,
isAutoSearch: false, isAutoSearch: false,
isAutoSync: false, isAutoSync: false,
onSearch: function (op, callback) { onSearch(op, callback) {
callback({ callback({
keyword: self.editor.getValue() keyword: self.editor.getValue(),
}); });
}, },
el: this.editor, el: this.editor,
popup: BI.extend({ popup: extend(
type: "bi.multi_tree_search_pane", {
keywordGetter: function () { type: MultiTreeSearchPane.xtype,
return self.editor.getValue(); keywordGetter() {
}, return self.editor.getValue();
itemsCreator: function (op, callback) { },
op.keyword = self.editor.getValue(); itemsCreator(op, callback) {
o.itemsCreator(op, callback); op.keyword = self.editor.getValue();
}, o.itemsCreator(op, callback);
listeners: [ },
{ listeners: [
eventName: BI.MultiTreeSearchPane.EVENT_CLICK_TREE_NODE, {
action: function () { eventName:
self.fireEvent(BI.MultiTreeSearcher.EVENT_CLICK_TREE_NODE, arguments); MultiTreeSearchPane.EVENT_CLICK_TREE_NODE,
action() {
self.fireEvent(
MultiTreeSearcher.EVENT_CLICK_TREE_NODE,
arguments
);
},
} }
} ],
], value: o.value,
value: o.value },
}, o.popup), o.popup
),
adapter: o.adapter, adapter: o.adapter,
masker: o.masker masker: o.masker,
}); });
this.searcher.on(BI.Searcher.EVENT_START, function () { this.searcher.on(Searcher.EVENT_START, () => {
self.fireEvent(BI.MultiTreeSearcher.EVENT_START); self.fireEvent(MultiTreeSearcher.EVENT_START);
}); });
this.searcher.on(BI.Searcher.EVENT_PAUSE, function () { this.searcher.on(Searcher.EVENT_PAUSE, () => {
self.fireEvent(BI.MultiTreeSearcher.EVENT_PAUSE); self.fireEvent(MultiTreeSearcher.EVENT_PAUSE);
}); });
this.searcher.on(BI.Searcher.EVENT_STOP, function () { this.searcher.on(Searcher.EVENT_STOP, () => {
self.fireEvent(BI.MultiTreeSearcher.EVENT_STOP); self.fireEvent(MultiTreeSearcher.EVENT_STOP);
}); });
this.searcher.on(BI.Searcher.EVENT_CHANGE, function () { this.searcher.on(Searcher.EVENT_CHANGE, function () {
self.fireEvent(BI.MultiTreeSearcher.EVENT_CHANGE, arguments); self.fireEvent(MultiTreeSearcher.EVENT_CHANGE, arguments);
}); });
this.searcher.on(BI.Searcher.EVENT_SEARCHING, function () { this.searcher.on(Searcher.EVENT_SEARCHING, function () {
var keywords = this.getKeywords(); const keywords = this.getKeywords();
self.fireEvent(BI.MultiTreeSearcher.EVENT_SEARCHING, keywords); self.fireEvent(MultiTreeSearcher.EVENT_SEARCHING, keywords);
}); });
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setState(o.value); this.setState(o.value);
} }
}, }
adjustView: function () { adjustView() {
this.searcher.adjustView(); this.searcher.adjustView();
}, }
setAdapter: function (adapter) { setAdapter(adapter) {
this.searcher.setAdapter(adapter); this.searcher.setAdapter(adapter);
}, }
isSearching: function () { isSearching() {
return this.searcher.isSearching(); return this.searcher.isSearching();
}, }
stopSearch: function () { stopSearch() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
getKeyword: function () { getKeyword() {
return this.editor.getValue(); return this.editor.getValue();
}, }
hasMatched: function () { hasMatched() {
return this.searcher.hasMatched(); return this.searcher.hasMatched();
}, }
hasChecked: function () { hasChecked() {
return this.searcher.getView() && this.searcher.getView().hasChecked(); return this.searcher.getView() && this.searcher.getView().hasChecked();
}, }
setState: function (ob) { setState(ob) {
var o = this.options; const o = this.options;
ob || (ob = {}); ob || (ob = {});
ob.value || (ob.value = {}); ob.value || (ob.value = {});
var count = 0; let count = 0;
if (BI.isNumber(ob)) { if (isNumber(ob)) {
this.editor.setState(ob); this.editor.setState(ob);
} else if (BI.size(ob.value) === 0) { } else if (size(ob.value) === 0) {
this.editor.setState(BI.Selection.None); this.editor.setState(BI.Selection.None);
} else { } else {
var text = ""; let text = "";
var value = ob.value; const value = ob.value;
var names = BI.Func.getSortedResult(BI.keys(value)); const names = BI.Func.getSortedResult(keys(value));
BI.each(names, function (idx, name) { each(names, (idx, name) => {
var childNodes = getChildrenNode(value[name]); const childNodes = getChildrenNode(value[name]);
text += (name === "null" ? "" : (o.valueFormatter(name + "") || name)) + (childNodes === "" ? (BI.isEmptyObject(value[name]) ? "" : ":") : (":" + childNodes)) + "; "; text +=
`${(name === "null"
? ""
: o.valueFormatter(`${name}`) || name) +
(childNodes === ""
? isEmptyObject(value[name])
? ""
: ":"
: `:${childNodes}`)
}; `;
if (childNodes === "") { if (childNodes === "") {
count++; count++;
} }
}); });
if (count > 20) { if (count > 20) {
this.editor.setState(BI.Selection.Multi); this.editor.setState(Selection.Multi);
} else { } else {
this.editor.setState(text); this.editor.setState(text);
} }
} }
function getChildrenNode(ob) { function getChildrenNode(ob) {
var text = ""; let text = "";
var index = 0, size = BI.size(ob); const size = size(ob);
var names = BI.Func.getSortedResult(BI.keys(ob)); let index = 0;
BI.each(names, function (idx, name) {
const names = Func.getSortedResult(keys(ob));
each(names, (idx, name) => {
index++; index++;
var childNodes = getChildrenNode(ob[name]); const childNodes = getChildrenNode(ob[name]);
text += (name === "null" ? "" : (o.valueFormatter(name + "") || name)) + (childNodes === "" ? "" : (":" + childNodes)) + (index === size ? "" : ","); text +=
(name === "null"
? ""
: o.valueFormatter(`${name}`) || name) +
(childNodes === "" ? "" : `:${childNodes}`) +
(index === size ? "" : ",");
if (childNodes === "") { if (childNodes === "") {
count++; count++;
} }
}); });
return text; return text;
} }
}, }
getState: function () { getState() {
return this.editor.getState(); return this.editor.getState();
}, }
setValue: function (ob) { setValue(ob) {
this.setState(ob); this.setState(ob);
this.searcher.setValue(ob); this.searcher.setValue(ob);
}, }
getKey: function () { getKey() {
return this.editor.getValue(); return this.editor.getValue();
}, }
getValue: function () { getValue() {
return this.searcher.getValue(); return this.searcher.getValue();
}, }
populate: function (items) { populate(items) {
this.searcher.populate.apply(this.searcher, arguments); this.searcher.populate(...arguments);
}, }
focus: function () { focus() {
this.editor.focus(); this.editor.focus();
}, }
blur: function () { blur() {
this.editor.blur(); this.editor.blur();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.editor.setWaterMark(v); this.editor.setWaterMark(v);
} }
}); }
BI.MultiTreeSearcher.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiTreeSearcher.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.MultiTreeSearcher.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiTreeSearcher.EVENT_START = "EVENT_START";
BI.MultiTreeSearcher.EVENT_STOP = "EVENT_STOP";
BI.MultiTreeSearcher.EVENT_PAUSE = "EVENT_PAUSE";
BI.MultiTreeSearcher.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
BI.shortcut("bi.multi_tree_searcher", BI.MultiTreeSearcher);

129
src/widget/selecttree/nodes/node.first.plus.js

@ -1,35 +1,48 @@
/** import {
* 加号表示的组节点 shortcut,
* Created by GUY on 2015/9/6. extend,
* @class BI.SelectTreeFirstPlusGroupNode createWidget,
* @extends BI.NodeButton Controller,
*/ Events,
BI.SelectTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, { isNotNull, LogicFactory, Direction
_defaultConfig: function () { } from "@/core";
var conf = BI.SelectTreeFirstPlusGroupNode.superclass._defaultConfig.apply(this, arguments); import { NodeButton, Label } from "@/base";
return BI.extend(conf, { import { FirstTreeNodeCheckbox } from "@/case";
baseCls: (conf.baseCls || "") + " bi-select-tree-first-plus-group-node bi-list-item-active",
@shortcut()
export class SelectTreeFirstPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_first_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-first-plus-group-node bi-list-item-active`,
logic: { logic: {
dynamic: false dynamic: false,
}, },
id: "", id: "",
pId: "", pId: "",
readonly: true, readonly: true,
open: false, open: false,
height: 24 height: 24,
}); });
}, }
_init: function () {
BI.SelectTreeFirstPlusGroupNode.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.checkbox = BI.createWidget({ const self = this,
type: "bi.first_tree_node_checkbox", o = this.options;
this.checkbox = createWidget({
type: FirstTreeNodeCheckbox.xtype,
stopPropagation: true, stopPropagation: true,
iconHeight: o.height, iconHeight: o.height,
iconWidth: o.height iconWidth: o.height,
}); });
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: Label.xtype,
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
textHeight: o.height, textHeight: o.height,
@ -38,10 +51,10 @@ BI.SelectTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
text: o.text, text: o.text,
value: o.value, value: o.value,
keyword: o.keyword, keyword: o.keyword,
py: o.py py: o.py,
}); });
this.checkbox.on(BI.Controller.EVENT_CHANGE, function (type) { this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
if (this.isSelected()) { if (this.isSelected()) {
self.triggerExpand(); self.triggerExpand();
} else { } else {
@ -49,40 +62,48 @@ BI.SelectTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
} }
} }
}); });
var type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left); const type = LogicFactory.createLogicTypeByDirection(
var items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, { Direction.Left
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, );
el: this.checkbox const items = LogicFactory.createLogicItemsByDirection(
}, this.text); Direction.Left,
BI.createWidget(BI.extend({ {
element: this width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
}, BI.LogicFactory.createLogic(type, BI.extend(o.logic, { el: this.checkbox,
items: items },
})))); this.text
}, );
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce: function () { isOnce() {
return true; return true;
}, }
doRedMark: function () {
this.text.doRedMark.apply(this.text, arguments);
},
unRedMark: function () { doRedMark() {
this.text.unRedMark.apply(this.text, arguments); this.text.doRedMark(...arguments);
}, }
doClick: function () { unRedMark() {
BI.NodeButton.superclass.doClick.apply(this, arguments); this.text.unRedMark(...arguments);
}, }
setOpened: function (v) { setOpened(v) {
BI.SelectTreeFirstPlusGroupNode.superclass.setOpened.apply(this, arguments); super.setOpened(...arguments);
if (BI.isNotNull(this.checkbox)) { if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v); this.checkbox.setSelected(v);
} }
} }
}); }
BI.shortcut("bi.select_tree_first_plus_group_node", BI.SelectTreeFirstPlusGroupNode);

129
src/widget/selecttree/nodes/node.last.plus.js

@ -1,35 +1,48 @@
/** import {
* 加号表示的组节点 shortcut,
* Created by GUY on 2015/9/6. extend,
* @class BI.SelectTreeLastPlusGroupNode createWidget,
* @extends BI.NodeButton Controller,
*/ Events,
BI.SelectTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, { isNotNull, LogicFactory, Direction
_defaultConfig: function () { } from "@/core";
var conf = BI.SelectTreeLastPlusGroupNode.superclass._defaultConfig.apply(this, arguments); import { NodeButton, Label } from "@/base";
return BI.extend(conf, { import { LastTreeNodeCheckbox } from "@/case";
baseCls: (conf.baseCls || "") + " bi-select-tree-last-plus-group-node bi-list-item-active",
@shortcut()
export class SelectTreeLastPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_last_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-last-plus-group-node bi-list-item-active`,
logic: { logic: {
dynamic: false dynamic: false,
}, },
id: "", id: "",
pId: "", pId: "",
readonly: true, readonly: true,
open: false, open: false,
height: 24 height: 24,
}); });
}, }
_init: function () {
BI.SelectTreeLastPlusGroupNode.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.checkbox = BI.createWidget({ const self = this,
type: "bi.last_tree_node_checkbox", o = this.options;
this.checkbox = createWidget({
type: LastTreeNodeCheckbox.xtype,
stopPropagation: true, stopPropagation: true,
iconHeight: o.height, iconHeight: o.height,
iconWidth: o.height iconWidth: o.height,
}); });
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: Label.xtype,
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
textHeight: o.height, textHeight: o.height,
@ -38,10 +51,10 @@ BI.SelectTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, {
text: o.text, text: o.text,
value: o.value, value: o.value,
keyword: o.keyword, keyword: o.keyword,
py: o.py py: o.py,
}); });
this.checkbox.on(BI.Controller.EVENT_CHANGE, function (type) { this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
if (this.isSelected()) { if (this.isSelected()) {
self.triggerExpand(); self.triggerExpand();
} else { } else {
@ -49,40 +62,48 @@ BI.SelectTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, {
} }
} }
}); });
var type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left); const type = LogicFactory.createLogicTypeByDirection(
var items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, { Direction.Left
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, );
el: this.checkbox const items = LogicFactory.createLogicItemsByDirection(
}, this.text); Direction.Left,
BI.createWidget(BI.extend({ {
element: this width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
}, BI.LogicFactory.createLogic(type, BI.extend(o.logic, { el: this.checkbox,
items: items },
})))); this.text
}, );
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce: function () { isOnce() {
return true; return true;
}, }
doRedMark: function () {
this.text.doRedMark.apply(this.text, arguments);
},
unRedMark: function () { doRedMark() {
this.text.unRedMark.apply(this.text, arguments); this.text.doRedMark(...arguments);
}, }
doClick: function () { unRedMark() {
BI.NodeButton.superclass.doClick.apply(this, arguments); this.text.unRedMark(...arguments);
}, }
setOpened: function (v) { setOpened(v) {
BI.SelectTreeLastPlusGroupNode.superclass.setOpened.apply(this, arguments); super.setOpened(...arguments);
if (BI.isNotNull(this.checkbox)) { if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v); this.checkbox.setSelected(v);
} }
} }
}); }
BI.shortcut("bi.select_tree_last_plus_group_node", BI.SelectTreeLastPlusGroupNode);

129
src/widget/selecttree/nodes/node.mid.plus.js

@ -1,35 +1,48 @@
/** import {
* 加号表示的组节点 shortcut,
* Created by GUY on 2015/9/6. extend,
* @class BI.SelectTreeMidPlusGroupNode createWidget,
* @extends BI.NodeButton Controller,
*/ Events,
BI.SelectTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, { isNotNull, Direction, LogicFactory
_defaultConfig: function () { } from "@/core";
var conf = BI.SelectTreeMidPlusGroupNode.superclass._defaultConfig.apply(this, arguments); import { NodeButton, Label } from "@/base";
return BI.extend(conf, { import { MidTreeNodeCheckbox } from "@/case";
baseCls: (conf.baseCls || "") + " bi-select-tree-mid-plus-group-node bi-list-item-active",
@shortcut()
export class SelectTreeMidPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_mid_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-mid-plus-group-node bi-list-item-active`,
logic: { logic: {
dynamic: false dynamic: false,
}, },
id: "", id: "",
pId: "", pId: "",
readonly: true, readonly: true,
open: false, open: false,
height: 24 height: 24,
}); });
}, }
_init: function () {
BI.SelectTreeMidPlusGroupNode.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.checkbox = BI.createWidget({ const self = this,
type: "bi.mid_tree_node_checkbox", o = this.options;
this.checkbox = createWidget({
type: MidTreeNodeCheckbox.xtype,
stopPropagation: true, stopPropagation: true,
iconHeight: o.height, iconHeight: o.height,
iconWidth: o.height iconWidth: o.height,
}); });
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: Label.xtype,
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
textHeight: o.height, textHeight: o.height,
@ -38,10 +51,10 @@ BI.SelectTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, {
text: o.text, text: o.text,
value: o.value, value: o.value,
keyword: o.keyword, keyword: o.keyword,
py: o.py py: o.py,
}); });
this.checkbox.on(BI.Controller.EVENT_CHANGE, function (type) { this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
if (this.isSelected()) { if (this.isSelected()) {
self.triggerExpand(); self.triggerExpand();
} else { } else {
@ -49,40 +62,48 @@ BI.SelectTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, {
} }
} }
}); });
var type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left); const type = LogicFactory.createLogicTypeByDirection(
var items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, { Direction.Left
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, );
el: this.checkbox const items = LogicFactory.createLogicItemsByDirection(
}, this.text); Direction.Left,
BI.createWidget(BI.extend({ {
element: this width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
}, BI.LogicFactory.createLogic(type, BI.extend(o.logic, { el: this.checkbox,
items: items },
})))); this.text
}, );
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce: function () { isOnce() {
return true; return true;
}, }
doRedMark: function () {
this.text.doRedMark.apply(this.text, arguments);
},
unRedMark: function () { doRedMark() {
this.text.unRedMark.apply(this.text, arguments); this.text.doRedMark(...arguments);
}, }
doClick: function () { unRedMark() {
BI.NodeButton.superclass.doClick.apply(this, arguments); this.text.unRedMark(...arguments);
}, }
setOpened: function (v) { setOpened(v) {
BI.SelectTreeMidPlusGroupNode.superclass.setOpened.apply(this, arguments); super.setOpened(...arguments);
if (BI.isNotNull(this.checkbox)) { if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v); this.checkbox.setSelected(v);
} }
} }
}); }
BI.shortcut("bi.select_tree_mid_plus_group_node", BI.SelectTreeMidPlusGroupNode);

129
src/widget/selecttree/nodes/node.plus.js

@ -1,35 +1,48 @@
/** import {
* 加号表示的组节点 shortcut,
* Created by GUY on 2015/9/6. extend,
* @class BI.SelectTreePlusGroupNode createWidget,
* @extends BI.NodeButton Controller,
*/ Events,
BI.SelectTreePlusGroupNode = BI.inherit(BI.NodeButton, { isNotNull, LogicFactory
_defaultConfig: function () { } from "@/core";
var conf = BI.SelectTreePlusGroupNode.superclass._defaultConfig.apply(this, arguments); import { NodeButton, Label } from "@/base";
return BI.extend(conf, { import { TreeNodeCheckbox } from "@/case";
baseCls: (conf.baseCls || "") + " bi-select-tree-plus-group-node bi-list-item-active",
@shortcut()
export class SelectTreePlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-plus-group-node bi-list-item-active`,
logic: { logic: {
dynamic: false dynamic: false,
}, },
id: "", id: "",
pId: "", pId: "",
readonly: true, readonly: true,
open: false, open: false,
height: 24 height: 24,
}); });
}, }
_init: function () {
BI.SelectTreePlusGroupNode.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.checkbox = BI.createWidget({ const self = this,
type: "bi.tree_node_checkbox", o = this.options;
this.checkbox = createWidget({
type: TreeNodeCheckbox.xtype,
stopPropagation: true, stopPropagation: true,
iconHeight: o.height, iconHeight: o.height,
iconWidth: o.iconWrapperWidth || o.height iconWidth: o.iconWrapperWidth || o.height,
}); });
this.text = BI.createWidget({ this.text = createWidget({
type: "bi.label", type: Label.xtype,
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
textHeight: o.height, textHeight: o.height,
@ -38,10 +51,10 @@ BI.SelectTreePlusGroupNode = BI.inherit(BI.NodeButton, {
text: o.text, text: o.text,
value: o.value, value: o.value,
keyword: o.keyword, keyword: o.keyword,
py: o.py py: o.py,
}); });
this.checkbox.on(BI.Controller.EVENT_CHANGE, function (type) { this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
if (this.isSelected()) { if (this.isSelected()) {
self.triggerExpand(); self.triggerExpand();
} else { } else {
@ -49,40 +62,48 @@ BI.SelectTreePlusGroupNode = BI.inherit(BI.NodeButton, {
} }
} }
}); });
var type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left); const type = LogicFactory.createLogicTypeByDirection(
var items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, { BI.Direction.Left
width: 24, );
el: this.checkbox const items = LogicFactory.createLogicItemsByDirection(
}, this.text); BI.Direction.Left,
BI.createWidget(BI.extend({ {
element: this width: 24,
}, BI.LogicFactory.createLogic(type, BI.extend(o.logic, { el: this.checkbox,
items: items },
})))); this.text
}, );
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce: function () { isOnce() {
return true; return true;
}, }
doRedMark: function () {
this.text.doRedMark.apply(this.text, arguments);
},
unRedMark: function () { doRedMark() {
this.text.unRedMark.apply(this.text, arguments); this.text.doRedMark(...arguments);
}, }
doClick: function () { unRedMark() {
BI.NodeButton.superclass.doClick.apply(this, arguments); this.text.unRedMark(...arguments);
}, }
setOpened: function (v) { setOpened(v) {
BI.SelectTreePlusGroupNode.superclass.setOpened.apply(this, arguments); super.setOpened(...arguments);
if (BI.isNotNull(this.checkbox)) { if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v); this.checkbox.setSelected(v);
} }
} }
}); }
BI.shortcut("bi.select_tree_plus_group_node", BI.SelectTreePlusGroupNode);

114
src/widget/selecttree/selecttree.combo.js

@ -1,11 +1,32 @@
/** /**
* @class BI.SelectTreeCombo * @class SelectTreeCombo
* @extends BI.Widget * @extends Widget
*/ */
BI.SelectTreeCombo = BI.inherit(BI.Widget, { import {
shortcut,
_defaultConfig: function () { Widget,
return BI.extend(BI.SelectTreeCombo.superclass._defaultConfig.apply(this, arguments), { extend,
createWidget,
Controller,
contains,
isArray,
toPix,
isKey,
isEmptyArray,
isEmptyString,
find,
isNull
} from "@/core";
import { Combo } from "@/base";
import { SingleTreeTrigger } from "@/widget/singletree/singletree.trigger";
import { SelectTreePopup } from "./selecttree.popup";
@shortcut()
export class SelectTreeCombo extends Widget {
static xtype = "bi.select_tree_combo";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-tree-combo bi-border bi-border-radius", baseCls: "bi-select-tree-combo bi-border bi-border-radius",
height: 24, height: 24,
text: "", text: "",
@ -13,70 +34,68 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
value: "", value: "",
allowClear: false, allowClear: false,
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const self = this, o = this.options;
BI.SelectTreeCombo.superclass._init.apply(this, arguments); super._init(...arguments);
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.single_tree_trigger", type: SingleTreeTrigger.xtype,
text: o.text, text: o.text,
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
items: o.items, items: o.items,
value: o.value, value: o.value,
allowClear: o.allowClear, allowClear: o.allowClear,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
}); });
this.trigger.on(BI.SingleTreeTrigger.EVENT_CLEAR, function () { this.trigger.on(SingleTreeTrigger.EVENT_CLEAR, () => {
self._clear(); this._clear();
}); });
this.popup = BI.createWidget({ this.popup = createWidget({
type: "bi.select_level_tree", type: SelectTreePopup.xtype,
items: o.items, items: o.items,
value: o.value value: o.value,
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
width: BI.toPix(o.width, 2), width: toPix(o.width, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
container: o.container, container: o.container,
element: this, element: this,
adjustLength: 2, adjustLength: 2,
el: this.trigger, el: this.trigger,
popup: { popup: {
el: this.popup el: this.popup,
} },
}); });
this.combo.on(BI.Controller.EVENT_CHANGE, function () { this.combo.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.popup.on(BI.SingleTreePopup.EVENT_CHANGE, function () { this.popup.on(SelectTreePopup.EVENT_CHANGE, () => {
self.setValue(self.popup.getValue()); self.setValue(self.popup.getValue());
self.combo.hideView(); self.combo.hideView();
}); });
if (BI.isKey(o.value)) { if (isKey(o.value)) {
this._checkError(o.value); this._checkError(o.value);
} }
}, }
_checkError: function (v) { _checkError(v) {
if (BI.isNull(v) || BI.isEmptyArray(v) || BI.isEmptyString(v)) { if (isNull(v) || isEmptyArray(v) || isEmptyString(v)) {
this.trigger.options.tipType = "success"; this.trigger.options.tipType = "success";
this.trigger.element.removeClass("error"); this.trigger.element.removeClass("error");
this.element.removeClass("error"); this.element.removeClass("error");
} else { } else {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
var result = BI.find(this.options.items, function (idx, item) { const result = find(this.options.items, (idx, item) => contains(v, item.value));
return BI.contains(v, item.value); if (isNull(result)) {
});
if (BI.isNull(result)) {
this.trigger.setTipType("warning"); this.trigger.setTipType("warning");
this.element.removeClass("error").addClass("error"); this.element.removeClass("error").addClass("error");
this.trigger.element.removeClass("error").addClass("error"); this.trigger.element.removeClass("error").addClass("error");
@ -86,27 +105,24 @@ BI.SelectTreeCombo = BI.inherit(BI.Widget, {
this.element.removeClass("error"); this.element.removeClass("error");
} }
} }
}, }
_clear: function () { _clear() {
this.setValue([]); this.setValue([]);
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.trigger.setValue(v); this.trigger.setValue(v);
this.popup.setValue(v); this.popup.setValue(v);
this._checkError(v); this._checkError(v);
}, }
getValue: function () { getValue() {
return this.popup.getValue(); return this.popup.getValue();
}, }
populate: function (items) { populate(items) {
this.combo.populate(items); this.combo.populate(items);
} }
}); }
BI.shortcut("bi.select_tree_combo", BI.SelectTreeCombo);

77
src/widget/selecttree/selecttree.expander.js

@ -1,77 +1,86 @@
/** import {
* @class BI.SelectTreeExpander shortcut,
* @extends BI.Widget Widget,
*/ extend,
BI.SelectTreeExpander = BI.inherit(BI.Widget, { createWidget,
Controller,
Events,
contains
} from "@/core";
import { Expander } from "@/base";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.SelectTreeExpander.superclass._defaultConfig.apply(this, arguments), { export class SelectTreeExpander extends Widget {
static xtype = "bi.select_tree_expander";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-tree-expander", baseCls: "bi-select-tree-expander",
trigger: "", trigger: "",
toggle: true, toggle: true,
direction: "bottom", direction: "bottom",
isDefaultInit: true, isDefaultInit: true,
el: {}, el: {},
popup: {} popup: {},
}); });
}, }
_init: function () { _init() {
BI.SelectTreeExpander.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.trigger = BI.createWidget(o.el); this.trigger = createWidget(o.el);
this.trigger.on(BI.Controller.EVENT_CHANGE, function (type) { this.trigger.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
if (this.isSelected()) { if (this.isSelected()) {
self.expander.setValue([]); self.expander.setValue([]);
} }
} }
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.expander = BI.createWidget({ this.expander = createWidget({
type: "bi.expander", type: Expander.xtype,
element: this, element: this,
trigger: o.trigger, trigger: o.trigger,
toggle: o.toggle, toggle: o.toggle,
direction: o.direction, direction: o.direction,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
el: this.trigger, el: this.trigger,
popup: o.popup popup: o.popup,
}); });
this.expander.on(BI.Controller.EVENT_CHANGE, function (type) { this.expander.on(Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
self.trigger.setSelected(false); self.trigger.setSelected(false);
} }
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
}, }
getAllLeaves: function () { getAllLeaves() {
return this.expander.getAllLeaves(); return this.expander.getAllLeaves();
}, }
setValue: function (v) { setValue(v) {
if (BI.contains(v, this.trigger.getValue())) { if (contains(v, this.trigger.getValue())) {
this.trigger.setSelected(true); this.trigger.setSelected(true);
this.expander.setValue([]); this.expander.setValue([]);
} else { } else {
this.trigger.setSelected(false); this.trigger.setSelected(false);
this.expander.setValue(v); this.expander.setValue(v);
} }
}, }
getValue: function () { getValue() {
if (this.trigger.isSelected()) { if (this.trigger.isSelected()) {
return [this.trigger.getValue()]; return [this.trigger.getValue()];
} }
return this.expander.getValue(); return this.expander.getValue();
}, }
populate: function (items) { populate(items) {
this.expander.populate(items); this.expander.populate(items);
} }
}); }
BI.shortcut("bi.select_tree_expander", BI.SelectTreeExpander);

125
src/widget/selecttree/selecttree.popup.js

@ -1,94 +1,109 @@
/** import {
* @class BI.SelectTreePopup shortcut,
* @extends BI.Pane extend,
*/ i18nText,
each,
BI.SelectTreePopup = BI.inherit(BI.Pane, { createWidget,
Controller,
_defaultConfig: function () { isArray, isNotEmptyArray, UUID, defaults, Tree, VerticalLayout
return BI.extend(BI.SelectTreePopup.superclass._defaultConfig.apply(this, arguments), { } from "@/core";
import { Pane } from "@/base";
import { BasicTreeItem, BasicTreeNode, LevelTree, TreeExpander } from "@/case";
@shortcut()
export class SelectTreePopup extends Pane {
static xtype = "bi.select_level_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-select-level-tree", baseCls: "bi-select-level-tree",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
items: [], items: [],
value: "" value: "",
}); });
}, }
_formatItems: function (nodes, layer, pNode) { _formatItems(nodes, layer, pNode) {
var self = this; const self = this;
BI.each(nodes, function (i, node) { each(nodes, (i, node) => {
var extend = { const extend = {
layer: layer, layer,
isFirstNode: i === 0, isFirstNode: i === 0,
isLastNode: i === nodes.length - 1, isLastNode: i === nodes.length - 1,
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
pNode: pNode, pNode,
}; };
node.id = node.id || BI.UUID(); node.id = node.id || UUID();
if (node.isParent === true || node.parent === true || BI.isNotEmptyArray(node.children)) { if (
node.isParent === true ||
extend.type = "bi.tree_node"; node.parent === true ||
isNotEmptyArray(node.children)
) {
extend.type = BasicTreeNode.xtype;
extend.selectable = true; extend.selectable = true;
BI.defaults(node, extend); defaults(node, extend);
self._formatItems(node.children, layer + 1, node); self._formatItems(node.children, layer + 1, node);
} else { } else {
extend.type = "bi.tree_item"; extend.type = BasicTreeItem.xtype;
BI.defaults(node, extend); defaults(node, extend);
} }
}); });
return nodes; return nodes;
}, }
_init: function () { _init() {
BI.SelectTreePopup.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.level_tree", type: LevelTree.xtype,
expander: { expander: {
type: "bi.tree_expander", type: TreeExpander.xtype,
// isDefaultInit: true, // isDefaultInit: true,
selectable: true, selectable: true,
}, },
items: this._formatItems(BI.Tree.transformToTreeFormat(o.items), 0), items: this._formatItems(Tree.transformToTreeFormat(o.items), 0),
value: o.value, value: o.value,
chooseType: BI.Selection.Single chooseType: Selection.Single,
}); });
BI.createWidget({ createWidget({
type: "bi.vertical", type: VerticalLayout.xtype,
element: this, element: this,
vgap: 5, vgap: 5,
items: [this.tree] items: [this.tree],
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function () { this.tree.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.tree.on(BI.LevelTree.EVENT_CHANGE, function () { this.tree.on(LevelTree.EVENT_CHANGE, () => {
self.fireEvent(BI.SelectTreePopup.EVENT_CHANGE); self.fireEvent(SelectTreePopup.EVENT_CHANGE);
}); });
this.check(); this.check();
}, }
getValue: function () { getValue() {
return this.tree.getValue(); return this.tree.getValue();
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.tree.setValue(v); this.tree.setValue(v);
},
populate: function (items) {
BI.SelectTreePopup.superclass.populate.apply(this, arguments);
this.tree.populate(this._formatItems(BI.Tree.transformToTreeFormat(items)));
} }
});
BI.SelectTreePopup.EVENT_CHANGE = "EVENT_CHANGE"; populate(items) {
BI.shortcut("bi.select_level_tree", BI.SelectTreePopup); super.populate(...arguments);
this.tree.populate(
this._formatItems(Tree.transformToTreeFormat(items))
);
}
}

147
src/widget/singletree/singletree.combo.js

@ -1,12 +1,35 @@
/** import {
* @class BI.SingleTreeCombo shortcut,
* @extends BI.Widget Widget,
*/ extend,
BI.SingleTreeCombo = BI.inherit(BI.Widget, { createWidget,
toPix,
_defaultConfig: function (config) { Controller,
return BI.extend(BI.SingleTreeCombo.superclass._defaultConfig.apply(this, arguments), { isKey,
baseCls: "bi-single-tree-combo " + (config.simple ? "bi-border-bottom" : "bi-border bi-border-radius"), isNull,
isEmptyArray,
isEmptyString,
isArray,
contains, find
} from "@/core";
import { Combo } from "@/base";
import { SingleTreeTrigger } from "./singletree.trigger";
import { SingleTreePopup } from "./singletree.popup";
@shortcut()
export class SingleTreeCombo extends Widget {
static xtype = "bi.single_tree_combo";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
_defaultConfig(config) {
return extend(super._defaultConfig(...arguments), {
baseCls:
`bi-single-tree-combo ${
config.simple
? "bi-border-bottom"
: "bi-border bi-border-radius"}`,
trigger: {}, trigger: {},
height: 24, height: 24,
text: "", text: "",
@ -14,75 +37,79 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
value: "", value: "",
allowClear: false, allowClear: false,
}); });
}, }
_init: function () { _init() {
var self = this, o = this.options; const self = this,
BI.SingleTreeCombo.superclass._init.apply(this, arguments); o = this.options;
super._init(...arguments);
this.trigger = BI.createWidget(BI.extend({ this.trigger = createWidget(
type: "bi.single_tree_trigger", extend(
text: o.text, {
defaultText: o.defaultText, type: SingleTreeTrigger.xtype,
height: BI.toPix(o.height, 2), text: o.text,
items: o.items, defaultText: o.defaultText,
value: o.value, height: toPix(o.height, 2),
allowClear: o.allowClear, items: o.items,
warningTitle: o.warningTitle, value: o.value,
}, o.trigger)); allowClear: o.allowClear,
warningTitle: o.warningTitle,
},
o.trigger
)
);
this.trigger.on(BI.SingleTreeTrigger.EVENT_CLEAR, function () { this.trigger.on(SingleTreeTrigger.EVENT_CLEAR, () => {
self._clear(); self._clear();
}); });
this.popup = BI.createWidget({ this.popup = createWidget({
type: "bi.single_level_tree", type: SingleTreePopup.xtype,
items: o.items, items: o.items,
value: o.value value: o.value,
}); });
this.combo = BI.createWidget({ this.combo = createWidget({
type: "bi.combo", type: Combo.xtype,
width: BI.toPix(o.width, 2), width: toPix(o.width, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
container: o.container, container: o.container,
element: this, element: this,
adjustLength: 2, adjustLength: 2,
el: this.trigger, el: this.trigger,
popup: { popup: {
el: this.popup el: this.popup,
} },
}); });
this.combo.on(BI.Controller.EVENT_CHANGE, function () { this.combo.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.combo.on(BI.Combo.EVENT_BEFORE_POPUPVIEW, function () { this.combo.on(Combo.EVENT_BEFORE_POPUPVIEW, function () {
self.fireEvent(BI.SingleTreeCombo.EVENT_BEFORE_POPUPVIEW, arguments); self.fireEvent(SingleTreeCombo.EVENT_BEFORE_POPUPVIEW, arguments);
}); });
this.popup.on(BI.SingleTreePopup.EVENT_CHANGE, function () { this.popup.on(SingleTreePopup.EVENT_CHANGE, () => {
self.setValue(self.popup.getValue()); self.setValue(self.popup.getValue());
self.combo.hideView(); self.combo.hideView();
self.fireEvent(BI.SingleTreeCombo.EVENT_CHANGE); self.fireEvent(SingleTreeCombo.EVENT_CHANGE);
}); });
if (BI.isKey(o.value)) { if (isKey(o.value)) {
this._checkError(o.value); this._checkError(o.value);
} }
}, }
_checkError: function (v) { _checkError(v) {
if (BI.isNull(v) || BI.isEmptyArray(v) || BI.isEmptyString(v)) { if (isNull(v) || isEmptyArray(v) || isEmptyString(v)) {
this.trigger.options.tipType = "success"; this.trigger.options.tipType = "success";
this.trigger.element.removeClass("error"); this.trigger.element.removeClass("error");
this.element.removeClass("error"); this.element.removeClass("error");
} else { } else {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
var result = BI.find(this.options.items, function (idx, item) { const result = find(this.options.items, (idx, item) => contains(v, item.value));
return BI.contains(v, item.value); if (isNull(result)) {
});
if (BI.isNull(result)) {
this.trigger.setTipType("warning"); this.trigger.setTipType("warning");
this.element.removeClass("error").addClass("error"); this.element.removeClass("error").addClass("error");
this.trigger.element.removeClass("error").addClass("error"); this.trigger.element.removeClass("error").addClass("error");
@ -92,28 +119,24 @@ BI.SingleTreeCombo = BI.inherit(BI.Widget, {
this.element.removeClass("error"); this.element.removeClass("error");
} }
} }
}, }
_clear: function () { _clear() {
this.setValue([]); this.setValue([]);
}, }
populate: function (items) { populate(items) {
this.combo.populate(items); this.combo.populate(items);
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.trigger.setValue(v); this.trigger.setValue(v);
this.popup.setValue(v); this.popup.setValue(v);
this._checkError(v); this._checkError(v);
}, }
getValue: function () { getValue() {
return this.popup.getValue(); return this.popup.getValue();
} }
}); }
BI.SingleTreeCombo.EVENT_CHANGE = "EVENT_CHANGE";
BI.SingleTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.shortcut("bi.single_tree_combo", BI.SingleTreeCombo);

78
src/widget/singletree/singletree.popup.js

@ -1,66 +1,74 @@
/** import {
* @class BI.SingleTreePopup shortcut,
* @extends BI.Pane extend,
*/ i18nText,
createWidget,
Controller,
isArray, VerticalLayout
} from "@/core";
import { Pane } from "@/base";
import { LevelTree } from "@/case";
BI.SingleTreePopup = BI.inherit(BI.Pane, { @shortcut()
export class SingleTreePopup extends Pane {
static xtype = "bi.single_level_tree";
_defaultConfig: function () { static EVENT_CHANGE = "EVENT_CHANGE";
return BI.extend(BI.SingleTreePopup.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-single-level-tree", baseCls: "bi-single-level-tree",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
items: [], items: [],
value: "" value: "",
}); });
}, }
_init: function () { _init() {
BI.SingleTreePopup.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.level_tree", type: "bi.level_tree",
expander: { expander: {
isDefaultInit: true isDefaultInit: true,
}, },
items: o.items, items: o.items,
value: o.value, value: o.value,
chooseType: BI.Selection.Single chooseType: Selection.Single,
}); });
BI.createWidget({ createWidget({
type: "bi.vertical", type: VerticalLayout.xtype,
element: this, element: this,
vgap: 5, vgap: 5,
items: [this.tree] items: [this.tree],
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function () { this.tree.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.tree.on(BI.LevelTree.EVENT_CHANGE, function () { this.tree.on(LevelTree.EVENT_CHANGE, () => {
self.fireEvent(BI.SingleTreePopup.EVENT_CHANGE); self.fireEvent(SingleTreePopup.EVENT_CHANGE);
}); });
this.check(); this.check();
}, }
getValue: function () { getValue() {
return this.tree.getValue(); return this.tree.getValue();
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.tree.setValue(v); this.tree.setValue(v);
}, }
populate: function (items) { populate(items) {
BI.SingleTreePopup.superclass.populate.apply(this, arguments); super.populate(...arguments);
this.tree.populate(items); this.tree.populate(items);
} }
}); }
BI.SingleTreePopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.single_level_tree", BI.SingleTreePopup);

91
src/widget/singletree/singletree.trigger.js

@ -1,29 +1,41 @@
/** import {
* @class BI.SingleTreeTrigger shortcut,
* @extends BI.Trigger extend,
*/ emptyFn,
createWidget,
contains,
isArray,
some
} from "@/core";
import { Trigger } from "@/base";
import { SelectTextTrigger } from "@/case";
BI.SingleTreeTrigger = BI.inherit(BI.Trigger, { @shortcut()
export class SingleTreeTrigger extends Trigger {
static xtype = "bi.single_tree_trigger";
_defaultConfig: function () { static EVENT_CLEAR = "EVENT_CLEAR";
return BI.extend(BI.SingleTreeTrigger.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-single-tree-trigger", baseCls: "bi-single-tree-trigger",
height: 24, height: 24,
text: "", text: "",
items: [], items: [],
value: "", value: "",
allowClear: false, allowClear: false,
valueFormatter: BI.emptyFn, valueFormatter: emptyFn,
}); });
}, }
_init: function () { _init() {
BI.SingleTreeTrigger.superclass._init.apply(this, arguments); super._init(...arguments);
var self = this, o = this.options; const self = this,
o = this.options;
this.trigger = BI.createWidget({ this.trigger = createWidget({
type: "bi.select_text_trigger", type: SelectTextTrigger.xtype,
element: this, element: this,
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
@ -36,50 +48,47 @@ BI.SingleTreeTrigger = BI.inherit(BI.Trigger, {
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
listeners: [ listeners: [
{ {
eventName: BI.SelectTextTrigger.EVENT_CLEAR, eventName: SelectTextTrigger.EVENT_CLEAR,
action: function () { action() {
self.fireEvent(BI.SingleTreeTrigger.EVENT_CLEAR); self.fireEvent(SingleTreeTrigger.EVENT_CLEAR);
} },
} }
] ],
}); });
}, }
_checkTitle() {
const val = this.getValue();
some(this.options.items, (i, item) => {
if (contains(val, item.value)) {
this.trigger.setTitle(item.text || item.value);
_checkTitle: function () {
var self = this, val = this.getValue();
BI.any(this.options.items, function (i, item) {
if (BI.contains(val, item.value)) {
self.trigger.setTitle(item.text || item.value);
return true; return true;
} }
}); });
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.options.value = v; this.options.value = v;
this.trigger.setValue(v); this.trigger.setValue(v);
this._checkTitle(); this._checkTitle();
}, }
setTipType: function (v) { setTipType(v) {
this.options.tipType = v; this.options.tipType = v;
this.trigger.setTipType(v); this.trigger.setTipType(v);
}, }
getValue: function () { getValue() {
return this.options.value || []; return this.options.value || [];
}, }
getTextor: function () { getTextor() {
return this.trigger.getTextor(); return this.trigger.getTextor();
}, }
populate: function (items) { populate(items) {
this.trigger.populate(items); this.trigger.populate(items);
} }
}
});
BI.SingleTreeTrigger.EVENT_CLEAR = "EVENT_CLEAR";
BI.shortcut("bi.single_tree_trigger", BI.SingleTreeTrigger);

Loading…
Cancel
Save