zsmj 1 year ago
parent
commit
19ed4a665f
  1. 5
      src/case/button/index.js
  2. 92
      src/case/button/node/node.first.plus.js
  3. 89
      src/case/button/node/node.last.plus.js
  4. 91
      src/case/button/node/node.mid.plus.js
  5. 142
      src/case/button/node/treenode.js
  6. 28
      src/case/button/treeitem/treeitem.js
  7. 7
      src/widget/index.js
  8. 83
      src/widget/multilayerselecttree/__test__/multilayerselecttree.combo.test.js
  9. 2
      src/widget/multilayerselecttree/index.js
  10. 420
      src/widget/multilayerselecttree/multilayerselecttree.combo.js
  11. 151
      src/widget/multilayerselecttree/multilayerselecttree.insert.search.pane.js
  12. 234
      src/widget/multilayerselecttree/multilayerselecttree.leveltree.js
  13. 86
      src/widget/multilayerselecttree/multilayerselecttree.popup.js
  14. 334
      src/widget/multilayerselecttree/multilayerselecttree.trigger.js
  15. 99
      src/widget/multilayerselecttree/node/node.first.plus.js
  16. 88
      src/widget/multilayerselecttree/node/node.last.plus.js
  17. 88
      src/widget/multilayerselecttree/node/node.mid.plus.js
  18. 92
      src/widget/multilayerselecttree/node/node.plus.js
  19. 2
      src/widget/multilayersingletree/index.js
  20. 402
      src/widget/multilayersingletree/multilayersingletree.combo.js
  21. 151
      src/widget/multilayersingletree/multilayersingletree.insert.search.pane.js
  22. 232
      src/widget/multilayersingletree/multilayersingletree.leveltree.js
  23. 86
      src/widget/multilayersingletree/multilayersingletree.popup.js
  24. 329
      src/widget/multilayersingletree/multilayersingletree.trigger.js
  25. 91
      src/widget/multilayersingletree/node/node.first.plus.js
  26. 90
      src/widget/multilayersingletree/node/node.last.plus.js
  27. 90
      src/widget/multilayersingletree/node/node.mid.plus.js
  28. 102
      src/widget/multilayersingletree/node/node.plus.js
  29. 86
      src/widget/multilayersingletree/treeitem/item.first.treeleaf.js
  30. 86
      src/widget/multilayersingletree/treeitem/item.last.treeleaf.js
  31. 86
      src/widget/multilayersingletree/treeitem/item.mid.treeleaf.js

5
src/case/button/index.js

@ -10,10 +10,7 @@ export { HalfIconButton } from "./icon/iconhalf/icon.half.image";
export { HalfButton } from "./icon/iconhalf/icon.half"; export { HalfButton } from "./icon/iconhalf/icon.half";
export { ArrowNode } from "./node/node.arrow"; export { ArrowNode } from "./node/node.arrow";
export { FirstPlusGroupNode } from "./node/node.first.plus";
export { IconArrowNode } from "./node/node.icon.arrow"; export { IconArrowNode } from "./node/node.icon.arrow";
export { LastPlusGroupNode } from "./node/node.last.plus";
export { MidPlusGroupNode } from "./node/node.mid.plus";
export { MultiLayerIconArrowNode } from "./node/node.multilayer.icon.arrow"; export { MultiLayerIconArrowNode } from "./node/node.multilayer.icon.arrow";
export { PlusGroupNode } from "./node/node.plus"; export { PlusGroupNode } from "./node/node.plus";
export { TreeNodeSwitcher } from "./node/siwtcher.tree.node"; export { TreeNodeSwitcher } from "./node/siwtcher.tree.node";
@ -26,3 +23,5 @@ export { MultiLayerIconTreeLeafItem } from "./treeitem/item.multilayer.icon.tree
export { export {
BasicTreeItem, FirstTreeLeafItem, MidTreeLeafItem, LastTreeLeafItem, RootTreeLeafItem BasicTreeItem, FirstTreeLeafItem, MidTreeLeafItem, LastTreeLeafItem, RootTreeLeafItem
} from "./treeitem/treeitem"; } from "./treeitem/treeitem";
export * from "./node/treenode";

92
src/case/button/node/node.first.plus.js

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

89
src/case/button/node/node.last.plus.js

@ -1,89 +0,0 @@
import { NodeButton } from "../../../base/single/button/button.node";
import { shortcut, extend, createWidget, isNotNull, Controller } from "../../../core";
/**
* 加号表示的组节点
* Created by GUY on 2015/9/6.
* @class LastPlusGroupNode
* @extends NodeButton
*/
@shortcut()
export class LastPlusGroupNode extends NodeButton {
static xtype = "bi.last_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-last-plus-group-node bi-list-item`,
logic: {
dynamic: false,
},
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
BI.LastPlusGroupNode.superclass._init.apply(this, arguments);
const o = this.options;
this.checkbox = createWidget({
type: "bi.last_tree_node_checkbox",
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.height,
});
this.text = createWidget({
type: "bi.label",
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
});
this.checkbox.on(Controller.EVENT_CHANGE, type => {
if (type === BI.Events.CLICK) {
if (this.checkbox.isSelected()) {
this.triggerExpand();
} else {
this.triggerCollapse();
}
}
});
const type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left);
const items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, {
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
el: this.checkbox,
}, this.text);
createWidget(extend({
element: this,
}, BI.LogicFactory.createLogic(type, extend(o.logic, {
items,
}))));
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.checkbox.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

91
src/case/button/node/node.mid.plus.js

@ -1,91 +0,0 @@
import { NodeButton } from "../../../base/single/button/button.node";
import { shortcut, extend, createWidget, Controller } from "../../../core";
/**
* 加号表示的组节点
* Created by GUY on 2015/9/6.
* @class BI.MidPlusGroupNode
* @extends BI.NodeButton
*/
@shortcut
export class MidPlusGroupNode extends NodeButton {
static xtype = "bi.mid_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-mid-plus-group-node bi-list-item`,
logic: {
dynamic: false,
},
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const o = this.options;
this.checkbox = createWidget({
type: "bi.mid_tree_node_checkbox",
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.height,
});
this.text = createWidget({
type: "bi.label",
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
});
this.checkbox.on(Controller.EVENT_CHANGE, type => {
if (type === BI.Events.CLICK) {
if (this.checkbox.isSelected()) {
this.triggerExpand();
} else {
this.triggerCollapse();
}
}
});
const type = BI.LogicFactory.createLogicTypeByDirection(BI.Direction.Left);
const items = BI.LogicFactory.createLogicItemsByDirection(BI.Direction.Left, {
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
el: this.checkbox,
}, this.text);
createWidget(extend({
element: this,
}, BI.LogicFactory.createLogic(type, extend(o.logic, {
items,
}))));
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.checkbox.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (BI.isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

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

@ -1,5 +1,5 @@
import { Label, NodeButton } from "@/base"; import { IconLabel, Label, NodeButton } from "@/base";
import { shortcut, extend, VerticalAdaptLayout } from "@/core"; import { shortcut, extend, VerticalAdaptLayout, Layout, isKey, compact } from "@/core";
import { TreeNodeSwitcher } from "@/case"; import { TreeNodeSwitcher } from "@/case";
@shortcut() @shortcut()
@ -25,21 +25,41 @@ export class BasicTreeNode extends NodeButton {
} }
render() { render() {
const o = this.options; const {
open,
layer,
height,
hgap,
textHgap,
textVgap,
textLgap,
textRgap,
text,
value,
isFirstNode,
isLastNode,
keyword,
iconWidth,
iconHeight,
iconWrapperWidth,
iconCls,
switcherIcon,
selectable,
} = this.options;
const checkbox = { const checkbox = {
type: TreeNodeSwitcher.xtype, type: TreeNodeSwitcher.xtype,
ref: _ref => { ref: _ref => {
this.switcher = _ref; this.switcher = _ref;
}, },
iconHeight: o.height, iconHeight: height,
iconWidth: o.iconWrapperWidth || o.height, iconWidth: iconWrapperWidth || height,
open: o.open, open,
isFirstNode: o.isFirstNode, isFirstNode,
isLastNode: o.isLastNode, isLastNode,
layer: o.layer, layer,
...o.switcherIcon, ...switcherIcon,
stopPropagation: o.selectable, stopPropagation: selectable,
mounted() { mounted() {
this.setEnable(true); this.setEnable(true);
}, },
@ -47,7 +67,7 @@ export class BasicTreeNode extends NodeButton {
{ {
eventName: "EVENT_CHANGE", eventName: "EVENT_CHANGE",
action: () => { action: () => {
if (!this.isEnabled() || o.selectable) { if (!this.isEnabled() || selectable) {
this.isOpened() ? this.triggerCollapse() : this.triggerExpand(); this.isOpened() ? this.triggerCollapse() : this.triggerExpand();
} }
}, },
@ -55,14 +75,39 @@ export class BasicTreeNode extends NodeButton {
], ],
}; };
// const indent = {
// el: {
// type: Layout.xtype,
// height,
// width: height,
// cls: this.getLineCls(),
// },
// lgap: layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2, // 偏移公式为每一层的偏移量为节点高度的一半
// width: "",
// };
const icon = isKey(iconCls) ? {
el: {
type: IconLabel.xtype,
// iconWidth,
// iconHeight,
cls: iconCls,
},
// width: 24,
} : null;
return { return {
type: VerticalAdaptLayout.xtype, type: VerticalAdaptLayout.xtype,
columnSize: [o.iconWrapperWidth || o.height, "fill"], items: compact([
items: [
{ {
el: checkbox, el: checkbox,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2, // 偏移公式为每一层的偏移量为节点高度的一半 lgap: layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2, // 偏移公式为每一层的偏移量为节点高度的一半
}, { width: iconWrapperWidth || height,
},
icon,
{
el: { el: {
type: Label.xtype, type: Label.xtype,
ref: _ref => { ref: _ref => {
@ -70,19 +115,19 @@ export class BasicTreeNode extends NodeButton {
}, },
textAlign: "left", textAlign: "left",
whiteSpace: "nowrap", whiteSpace: "nowrap",
textHeight: o.height, textHeight: height,
height: o.height, height,
hgap: o.hgap || o.textHgap, hgap: hgap || textHgap,
vgap: o.textVgap, vgap: textVgap,
lgap: o.textLgap, lgap: textLgap,
rgap: o.textRgap, rgap: textRgap,
text: o.text, text,
value: o.value, value,
keyword: o.keyword, keyword,
py: o.py,
}, },
width: "fill",
} }
], ]),
}; };
} }
@ -111,4 +156,47 @@ export class BasicTreeNode extends NodeButton {
} }
} }
@shortcut()
export class FirstPlusGroupNode extends BasicTreeNode {
static xtype = "bi.first_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-first-plus-group-node`,
isFirstNode: true,
isLastNode: false,
});
}
}
@shortcut
export class MidPlusGroupNode extends BasicTreeNode {
static xtype = "bi.mid_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-mid-plus-group-node`,
isFirstNode: false,
isLastNode: false,
});
}
}
@shortcut()
export class LastPlusGroupNode extends BasicTreeNode {
static xtype = "bi.last_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls: `${conf.baseCls || ""} bi-last-plus-group-node`,
isFirstNode: false,
isLastNode: true,
});
}
}

28
src/case/button/treeitem/treeitem.js

@ -17,8 +17,8 @@ export class BasicTreeItem extends NodeButton {
isFirstNode: false, isFirstNode: false,
isLastNode: false, isLastNode: false,
layer: 0, layer: 0,
iconWidth: 16, iconWidth: null,
iconHeight: 16, iconHeight: null,
iconCls: "", iconCls: "",
}); });
} }
@ -34,6 +34,8 @@ export class BasicTreeItem extends NodeButton {
textRgap, textRgap,
text, text,
value, value,
isFirstNode,
isLastNode,
py, py,
keyword, keyword,
iconWidth, iconWidth,
@ -41,15 +43,6 @@ export class BasicTreeItem extends NodeButton {
iconCls, iconCls,
} = this.options; } = this.options;
const icon = isKey(iconCls) ? {
el: {
type: IconLabel.xtype,
iconWidth,
iconHeight,
cls: iconCls,
},
width: 24,
} : null;
const indent = { const indent = {
el: { el: {
@ -62,11 +55,22 @@ export class BasicTreeItem extends NodeButton {
width: "", width: "",
}; };
const icon = isKey(iconCls) ? {
el: {
type: IconLabel.xtype,
// iconWidth,
// iconHeight,
cls: iconCls,
},
// width: 24,
} : null;
return { return {
type: VerticalAdaptLayout.xtype, type: VerticalAdaptLayout.xtype,
items: compact([ items: compact([
icon,
indent, indent,
icon,
{ {
el: { el: {
type: Label.xtype, type: Label.xtype,

7
src/widget/index.js

@ -19,8 +19,11 @@ import { NumberEditor } from "./numbereditor/number.editor";
import { NumberInterval } from "./numberinterval/numberinterval"; import { NumberInterval } from "./numberinterval/numberinterval";
import * as multiselect from "./multiselect"; import * as multiselect from "./multiselect";
import * as multiselectlist from "./multiselectlist"; import * as multiselectlist from "./multiselectlist";
import * as multilayerselectree from "./multilayerselecttree";
import * as multilayersingletree from "./multilayersingletree";
import * as year from "./year"; import * as year from "./year";
import { YearInterval } from "./yearinterval/yearinterval"; import { YearInterval } from "./yearinterval/yearinterval";
Object.assign(BI, { Object.assign(BI, {
Collapse, Collapse,
...calendar, ...calendar,
@ -45,6 +48,8 @@ Object.assign(BI, {
YearInterval, YearInterval,
...multiselect, ...multiselect,
...multiselectlist, ...multiselectlist,
...multilayerselectree,
...multilayersingletree,
}); });
export * from "./date/calendar"; export * from "./date/calendar";
@ -61,6 +66,8 @@ export * from "./downlist";
export * from "./singleslider"; export * from "./singleslider";
export * from "./intervalslider"; export * from "./intervalslider";
export * from "./year"; export * from "./year";
export * from "./multilayersingletree";
export * from "./multilayerselecttree";
export { export {
Collapse, Collapse,
NumberEditor, NumberEditor,

83
src/widget/multilayerselecttree/__test__/multilayerselecttree.combo.test.js

@ -4,39 +4,40 @@
* Created by windy on 2019/9/18 * Created by windy on 2019/9/18
*/ */
describe("multilayer_select_tree", function () { describe("multilayer_select_tree", () => {
const items = [
var items = [{id: -1, pId: -2, value: "根目录", text: "根目录"}, { id: -1, pId: -2, value: "根目录", text: "根目录" },
{id: 1, pId: -1, value: "第一级目录1", text: "第一级目录1"}, { id: 1, pId: -1, value: "第一级目录1", text: "第一级目录1" },
{id: 11, pId: 1, value: "第二级文件1", text: "第二级文件1"}, { id: 11, pId: 1, value: "第二级文件1", text: "第二级文件1" },
{id: 12, pId: 1, value: "第二级目录2", text: "第二级目录2"}, { id: 12, pId: 1, value: "第二级目录2", text: "第二级目录2" },
{id: 121, pId: 12, value: "第三级目录1", text: "第三级目录1"}, { id: 121, pId: 12, value: "第三级目录1", text: "第三级目录1" },
{id: 122, pId: 12, value: "第三级文件1", text: "第三级文件1"}, { id: 122, pId: 12, value: "第三级文件1", text: "第三级文件1" },
{id: 1211, pId: 121, value: "第四级目录1", text: "第四级目录1"}, { id: 1211, pId: 121, value: "第四级目录1", text: "第四级目录1" },
{ {
id: 12111, id: 12111,
pId: 1211, pId: 1211,
value: "第五级文件1", value: "第五级文件1",
text: "第五级文件111111111111111111111111111111111111111111111111111111111111111111111111111111111111111" text: "第五级文件111111111111111111111111111111111111111111111111111111111111111111111111111111111111111",
}, },
{id: 2, pId: -1, value: "第一级目录2", text: "第一级目录2"}, { id: 2, pId: -1, value: "第一级目录2", text: "第一级目录2" },
{id: 21, pId: 2, value: "第二级目录3", text: "第二级目录3"}, { id: 21, pId: 2, value: "第二级目录3", text: "第二级目录3" },
{id: 22, pId: 2, value: "第二级文件2", text: "第二级文件2"}, { id: 22, pId: 2, value: "第二级文件2", text: "第二级文件2" },
{id: 211, pId: 21, value: "第三级目录2", text: "第三级目录2"}, { id: 211, pId: 21, value: "第三级目录2", text: "第三级目录2" },
{id: 212, pId: 21, value: "第三级文件2", text: "第三级文件2"}, { id: 212, pId: 21, value: "第三级文件2", text: "第三级文件2" },
{id: 2111, pId: 211, value: "第四级文件1", text: "第四级文件1"}]; { id: 2111, pId: 211, value: "第四级文件1", text: "第四级文件1" }
];
/** /**
* test_author_windy * test_author_windy
**/ **/
it("defaultValue_allowEdit", function () { it("defaultValue_allowEdit", () => {
var tree = BI.Test.createWidget({ const tree = BI.Test.createWidget({
type: "bi.multilayer_select_tree_combo", type: "bi.multilayer_select_tree_combo",
width: 300, width: 300,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
items: BI.deepClone(items), items: BI.deepClone(items),
value: "第一级目录2" value: "第一级目录2",
}); });
expect(tree.getValue()).to.equal("第一级目录2"); expect(tree.getValue()).to.equal("第一级目录2");
tree.destroy(); tree.destroy();
@ -45,13 +46,13 @@ describe("multilayer_select_tree", function () {
/** /**
* test_author_windy * test_author_windy
**/ **/
it("defaultValue_not_allowEdit", function () { it("defaultValue_not_allowEdit", () => {
var tree = BI.Test.createWidget({ const tree = BI.Test.createWidget({
type: "bi.multilayer_select_tree_combo", type: "bi.multilayer_select_tree_combo",
width: 300, width: 300,
height: 24, height: 24,
items: BI.deepClone(items), items: BI.deepClone(items),
value: "第一级目录2" value: "第一级目录2",
}); });
expect(tree.getValue()).to.equal("第一级目录2"); expect(tree.getValue()).to.equal("第一级目录2");
tree.destroy(); tree.destroy();
@ -60,17 +61,17 @@ describe("multilayer_select_tree", function () {
/** /**
* test_author_windy * test_author_windy
**/ **/
it("点选选值", function (done) { it("点选选值", done => {
var tree = BI.Test.createWidget({ const tree = BI.Test.createWidget({
type: "bi.multilayer_select_tree_combo", type: "bi.multilayer_select_tree_combo",
width: 300, width: 300,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
items: BI.deepClone(items), items: BI.deepClone(items),
value: "第一级目录2" value: "第一级目录2",
}); });
tree.element.find(".bi-multi-layer-select-tree-trigger").click(); tree.element.find(".bi-multi-layer-select-tree-trigger").click();
BI.nextTick(function () { BI.nextTick(() => {
tree.element.find(".bi-select-tree-plus-group-node").click(); tree.element.find(".bi-select-tree-plus-group-node").click();
expect(tree.getValue()[0]).to.equal("根目录"); expect(tree.getValue()[0]).to.equal("根目录");
tree.destroy(); tree.destroy();
@ -81,20 +82,20 @@ describe("multilayer_select_tree", function () {
/** /**
* test_author_windy * test_author_windy
**/ **/
it("搜索选值", function (done) { it("搜索选值", done => {
var tree = BI.Test.createWidget({ const tree = BI.Test.createWidget({
type: "bi.multilayer_select_tree_combo", type: "bi.multilayer_select_tree_combo",
width: 300, width: 300,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
items: BI.deepClone(items) items: BI.deepClone(items),
}); });
BI.nextTick(function () { BI.nextTick(() => {
tree.element.find(".bi-multi-layer-select-tree-trigger .tip-text-style").click(); tree.element.find(".bi-multi-layer-select-tree-trigger .tip-text-style").click();
// 这边为啥要加呢,因为input的setValue中有nextTick // 这边为啥要加呢,因为input的setValue中有nextTick
BI.nextTick(function () { BI.nextTick(() => {
BI.Test.triggerKeyDown(tree.element.find(".bi-multi-layer-select-tree-trigger .bi-input"), "2", 50, function () { BI.Test.triggerKeyDown(tree.element.find(".bi-multi-layer-select-tree-trigger .bi-input"), "2", 50, () => {
BI.nextTick(function () { BI.nextTick(() => {
tree.element.find(".bi-select-tree-mid-plus-group-node").click(); tree.element.find(".bi-select-tree-mid-plus-group-node").click();
expect(tree.getValue()[0]).to.equal("第一级目录2"); expect(tree.getValue()[0]).to.equal("第一级目录2");
tree.destroy(); tree.destroy();
@ -108,21 +109,21 @@ describe("multilayer_select_tree", function () {
/** /**
* test_author_windy * test_author_windy
**/ **/
it("新增值", function (done) { it("新增值", done => {
var tree = BI.Test.createWidget({ const tree = BI.Test.createWidget({
type: "bi.multilayer_select_tree_combo", type: "bi.multilayer_select_tree_combo",
width: 300, width: 300,
height: 24, height: 24,
allowEdit: true, allowEdit: true,
allowInsertValue: true, allowInsertValue: true,
items: BI.deepClone(items) items: BI.deepClone(items),
}); });
BI.nextTick(function () { BI.nextTick(() => {
tree.element.find(".bi-multi-layer-select-tree-trigger .tip-text-style").click(); tree.element.find(".bi-multi-layer-select-tree-trigger .tip-text-style").click();
// 这边为啥要加呢,因为input的setValue中有nextTick // 这边为啥要加呢,因为input的setValue中有nextTick
BI.nextTick(function () { BI.nextTick(() => {
BI.Test.triggerKeyDown(tree.element.find(".bi-multi-layer-select-tree-trigger .bi-input"), "z", 50, function () { BI.Test.triggerKeyDown(tree.element.find(".bi-multi-layer-select-tree-trigger .bi-input"), "z", 50, () => {
BI.nextTick(function () { BI.nextTick(() => {
tree.element.find(".bi-text-button:contains(+点击新增\"z\")").click(); tree.element.find(".bi-text-button:contains(+点击新增\"z\")").click();
expect(tree.getValue()[0]).to.equal("z"); expect(tree.getValue()[0]).to.equal("z");
tree.destroy(); tree.destroy();
@ -132,4 +133,4 @@ describe("multilayer_select_tree", function () {
}); });
}); });
}); });
}); });

2
src/widget/multilayerselecttree/index.js

@ -0,0 +1,2 @@
export { MultiLayerSelectTreeCombo } from "./multilayerselecttree.combo";
export { MultiLayerSelectLevelTree } from "./multilayerselecttree.leveltree";

420
src/widget/multilayerselecttree/multilayerselecttree.combo.js

@ -1,17 +1,40 @@
/** import {
* @class BI.MultiLayerSelectTreeCombo shortcut,
* @extends BI.Widget Widget,
*/ extend,
BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, { emptyFn,
isKey,
toPix,
AbsoluteLayout,
nextTick,
isArray
} from "@/core";
import { SingleTreeTrigger } from "../singletree/singletree.trigger";
import { MultiLayerSelectTreePopup } from "./multilayerselecttree.popup";
import { Combo } from "@/base";
import { MultiLayerSelectTreeTrigger } from "./multilayerselecttree.trigger";
import { TriggerIconButton } from "@/case";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiLayerSelectTreeCombo.superclass._defaultConfig.apply(this, arguments), { export class MultiLayerSelectTreeCombo extends Widget {
static xtype = "bi.multilayer_select_tree_combo";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_STOP = "EVENT_STOP";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
static EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-select-tree-combo", baseCls: "bi-multilayer-select-tree-combo",
isDefaultInit: false, isDefaultInit: false,
height: 24, height: 24,
text: "", text: "",
defaultText: "", defaultText: "",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
allowEdit: false, allowEdit: false,
allowSearchValue: false, allowSearchValue: false,
@ -19,268 +42,327 @@ BI.MultiLayerSelectTreeCombo = BI.inherit(BI.Widget, {
isNeedAdjustWidth: true, isNeedAdjustWidth: true,
status: "", // "error","warning" status: "", // "error","warning"
}); });
}, }
render: function () { render() {
var self = this, o = this.options; const self = this,
o = this.options;
var cls = (o.simple ? "bi-border-bottom " : "bi-border bi-border-radius ") + (BI.isKey(o.status) ? ("status-" + o.status) : ""); const cls =
(o.simple ? "bi-border-bottom " : "bi-border bi-border-radius ") +
(isKey(o.status) ? `status-${o.status}` : "");
var baseConfig = this._getBaseConfig(); const baseConfig = this._getBaseConfig();
if (o.allowEdit) { if (o.allowEdit) {
return { return {
type: "bi.absolute", type: AbsoluteLayout.xtype,
width: BI.toPix(o.width, 2), width: toPix(o.width, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
cls, cls,
items: [ items: [
{ {
el: BI.extend(baseConfig, this._getSearchConfig()), el: extend(baseConfig, this._getSearchConfig()),
top: 0, bottom: 0, right: 0, left: 0 top: 0,
}, { bottom: 0,
el: self._getTriggerIconButton(), right: 0,
top: 0, bottom: 0, right: 0, left: 0,
}, },
] {
el: self._getTriggerIconButton(),
top: 0,
bottom: 0,
right: 0,
}
],
}; };
} }
return BI.extend(baseConfig, { return extend(
el: { baseConfig,
type: "bi.single_tree_trigger", {
ref: function (_ref) { el: {
self.textTrigger = _ref; type: SingleTreeTrigger.xtype,
ref(_ref) {
self.textTrigger = _ref;
},
text: o.text,
defaultText: o.defaultText,
height: toPix(o.height, 2),
items: o.items,
value: o.value,
tipType: o.tipType,
warningTitle: o.warningTitle,
valueFormatter: o.valueFormatter,
}, },
text: o.text, },
defaultText: o.defaultText, { cls }
height: BI.toPix(o.height, 2), );
items: o.items, }
value: o.value,
tipType: o.tipType, _getBaseConfig() {
warningTitle: o.warningTitle, const self = this,
valueFormatter: o.valueFormatter, o = this.options;
}
}, { cls });
},
_getBaseConfig: function () {
var self = this, o = this.options;
return { return {
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,
destroyWhenHide: o.destroyWhenHide, destroyWhenHide: o.destroyWhenHide,
adjustLength: 2, adjustLength: 2,
ref: function (_ref) { ref(_ref) {
self.combo = _ref; self.combo = _ref;
}, },
popup: { popup: {
el: { el: {
type: "bi.multilayer_select_tree_popup", type: MultiLayerSelectTreePopup.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
items: o.items, items: o.items,
ref: function (_ref) { ref(_ref) {
self.trigger && self.trigger.getSearcher().setAdapter(_ref); self.trigger &&
self.trigger.getSearcher().setAdapter(_ref);
}, },
listeners: [{ listeners: [
eventName: BI.MultiLayerSelectTreePopup.EVENT_CHANGE, {
action: function () { eventName: MultiLayerSelectTreePopup.EVENT_CHANGE,
self.setValue(this.getValue()); action() {
self.combo.hideView(); self.setValue(this.getValue());
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); self.combo.hideView();
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_CHANGE
);
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM,
self.combo.getValue()
);
},
} }
}], ],
onLoaded: function () { onLoaded() {
BI.nextTick(function () { nextTick(() => {
self.combo.adjustWidth(); self.combo.adjustWidth();
self.combo.adjustHeight(); self.combo.adjustHeight();
}); });
} },
}, },
value: o.value, value: o.value,
maxHeight: 400, maxHeight: 400,
maxWidth: o.isNeedAdjustWidth ? "auto" : 500, maxWidth: o.isNeedAdjustWidth ? "auto" : 500,
minHeight: 240 minHeight: 240,
}, },
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
listeners: [{ listeners: [
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, {
action: function () { eventName: Combo.EVENT_BEFORE_POPUPVIEW,
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW); action() {
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW
);
},
} }
}] ],
}; };
}, }
_getSearchConfig() {
const self = this,
o = this.options;
_getSearchConfig: function () {
var self = this, o = this.options;
return { return {
el: { el: {
type: "bi.multilayer_select_tree_trigger", type: MultiLayerSelectTreeTrigger.xtype,
container: o.container, container: o.container,
allowInsertValue: o.allowInsertValue, allowInsertValue: o.allowInsertValue,
allowSearchValue: o.allowSearchValue, allowSearchValue: o.allowSearchValue,
allowEdit: o.allowEdit, allowEdit: o.allowEdit,
cls: "multilayer-select-tree-trigger", cls: "multilayer-select-tree-trigger",
ref: function (_ref) { ref(_ref) {
self.trigger = _ref; self.trigger = _ref;
}, },
items: o.items, items: o.items,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
watermark: o.watermark, watermark: o.watermark,
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
value: o.value, value: o.value,
tipType: o.tipType, tipType: o.tipType,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
title: o.title, title: o.title,
listeners: [{ listeners: [
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_CHANGE, {
action: function () { eventName: MultiLayerSelectTreeTrigger.EVENT_CHANGE,
self.setValue(this.getValue()); action() {
self.combo.hideView(); self.setValue(this.getValue());
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); self.combo.hideView();
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); self.fireEvent(
} MultiLayerSelectTreeCombo.EVENT_CHANGE
}, { );
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_FOCUS, self.fireEvent(
action: function () { MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM,
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_FOCUS); self.combo.getValue()
} );
}, { },
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_BLUR, },
action: function () { {
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_BLUR); eventName: MultiLayerSelectTreeTrigger.EVENT_FOCUS,
} action() {
}, { self.fireEvent(
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_SEARCHING, MultiLayerSelectTreeCombo.EVENT_FOCUS
action: function () { );
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_SEARCHING); },
} },
}, { {
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_STOP, eventName: MultiLayerSelectTreeTrigger.EVENT_BLUR,
action: function () { action() {
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_STOP); self.fireEvent(
} MultiLayerSelectTreeCombo.EVENT_BLUR
}, { );
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM, },
action: function () { },
var value = self.trigger.getSearcher().getKeyword(); {
self.combo.setValue([value]); eventName: MultiLayerSelectTreeTrigger.EVENT_SEARCHING,
self.combo.hideView(); action() {
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_SEARCHING
);
},
},
{
eventName: MultiLayerSelectTreeTrigger.EVENT_STOP,
action() {
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_STOP
);
},
},
{
eventName: MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM,
action() {
const value = self.trigger.getSearcher().getKeyword();
self.combo.setValue([value]);
self.combo.hideView();
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_CHANGE
);
},
} }
}] ],
}, },
toggle: !o.allowEdit, toggle: !o.allowEdit,
hideChecker: function (e) { hideChecker(e) {
// 新增传配置container后对应hideChecker的修改 // 新增传配置container后对应hideChecker的修改
// IE11下,popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿 // IE11下,popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿
// 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页,所以 // 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页,所以
// 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪 // 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪
return (o.container && self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().getView().element.find(e.target).length > 0) ? false : self.triggerBtn?.element.find(e.target).length === 0; return o.container &&
self.trigger.getSearcher().isSearching() &&
self.trigger.getSearcher().getView().element.find(e.target)
.length > 0
? false
: self.triggerBtn?.element.find(e.target).length === 0;
}, },
listeners: [{ listeners: [
eventName: BI.Combo.EVENT_AFTER_HIDEVIEW, {
action: function () { eventName: Combo.EVENT_AFTER_HIDEVIEW,
self.trigger.stopEditing(); action() {
} self.trigger.stopEditing();
}, { },
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, },
action: function () { {
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW); eventName: Combo.EVENT_BEFORE_POPUPVIEW,
action() {
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW
);
},
} }
}] ],
}; };
}, }
_getTriggerIconButton() {
const self = this,
o = this.options;
_getTriggerIconButton: function () {
var self = this, o = this.options;
return { return {
type: "bi.trigger_icon_button", type: TriggerIconButton.xtype,
cls: "bi-trigger trigger-icon-button", cls: "bi-trigger trigger-icon-button",
ref: function (_ref) { ref(_ref) {
self.triggerBtn = _ref; self.triggerBtn = _ref;
}, },
width: BI.toPix(o.height, 2), width: toPix(o.height, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
listeners: [ listeners: [
{ {
eventName: BI.TriggerIconButton.EVENT_CHANGE, eventName: TriggerIconButton.EVENT_CHANGE,
action: function () { action() {
if (self.combo.isViewVisible()) { if (self.combo.isViewVisible()) {
self.combo.hideView(); self.combo.hideView();
} else { } else {
self.combo.showView(); self.combo.showView();
} }
} },
} }
] ],
}; };
}, }
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.combo.setValue(v); this.combo.setValue(v);
}, }
getValue: function () { getValue() {
return this.combo.getValue(); return this.combo.getValue();
}, }
getSearcher: function () { getSearcher() {
return this.trigger ? this.trigger.getSearcher() : this.textTrigger.getTextor(); return this.trigger
}, ? this.trigger.getSearcher()
: this.textTrigger.getTextor();
}
clear: function () { clear() {
// do some work // do some work
}, }
setStatus: function (status) { setStatus(status) {
if (BI.isKey(this.options.status)) { if (isKey(this.options.status)) {
this.element.removeClass("status-" + this.options.status); this.element.removeClass(`status-${this.options.status}`);
} }
this.element.addClass("status-" + status); this.element.addClass(`status-${status}`);
this.options.status = status; this.options.status = status;
}, }
setTipType: function (v) { setTipType(v) {
this.trigger ? this.trigger.setTipType(v) : this.textTrigger.setTipType(v); this.trigger
}, ? this.trigger.setTipType(v)
: this.textTrigger.setTipType(v);
}
populate: function (items) { populate(items) {
this.combo.populate(items); this.combo.populate(items);
}, }
focus: function () { focus() {
this.trigger ? this.trigger.focus() : this.textTrigger.focus(); this.trigger ? this.trigger.focus() : this.textTrigger.focus();
}, }
blur: function () { blur() {
this.trigger ? this.trigger.blur() : this.textTrigger.blur(); this.trigger ? this.trigger.blur() : this.textTrigger.blur();
}, }
showView: function () { showView() {
this.combo.showView(); this.combo.showView();
},
setWaterMark: function (v) {
this.trigger ? this.trigger.setWaterMark(v) : this.textTrigger.setWaterMark(v);
} }
});
BI.MultiLayerSelectTreeCombo.EVENT_SEARCHING = "EVENT_SEARCHING"; setWaterMark(v) {
BI.MultiLayerSelectTreeCombo.EVENT_BLUR = "EVENT_BLUR"; this.trigger
BI.MultiLayerSelectTreeCombo.EVENT_FOCUS = "EVENT_FOCUS"; ? this.trigger.setWaterMark(v)
BI.MultiLayerSelectTreeCombo.EVENT_CHANGE = "EVENT_CHANGE"; : this.textTrigger.setWaterMark(v);
BI.MultiLayerSelectTreeCombo.EVENT_STOP = "EVENT_STOP"; }
BI.MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW"; }
BI.MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM = "EVENT_CLICK_ITEM";
BI.shortcut("bi.multilayer_select_tree_combo", BI.MultiLayerSelectTreeCombo);

151
src/widget/multilayerselecttree/multilayerselecttree.insert.search.pane.js

@ -1,92 +1,119 @@
/** import {
* Created by GUY on 2016/1/26. shortcut,
* Widget,
* @class BI.MultiLayerSelectTreeInsertSearchPane i18nText,
* @extends BI.Pane emptyFn,
*/ createWidget,
Controller,
VerticalLayout,
isEmptyArray,
isArray
} from "@/core";
import { MultiLayerSelectLevelTree } from "./multilayerselecttree.leveltree";
import { TextButton } from "@/base";
BI.MultiLayerSelectTreeInsertSearchPane = BI.inherit(BI.Widget, { @shortcut()
export class MultiLayerSelectTreeInsertSearchPane extends Widget {
static xtype = "bi.multilayer_select_tree_insert_search_pane";
props: function() { static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
static EVENT_CHANGE = "EVENT_CHANGE";
props() {
return { return {
baseCls: "bi-multilayer-select-tree-popup", baseCls: "bi-multilayer-select-tree-popup",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
isDefaultInit: false, isDefaultInit: false,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
value: "" value: "",
}; };
}, }
render: function() { render() {
var self = this, o = this.options; const self = this,
this.tree = BI.createWidget({ o = this.options;
type: "bi.multilayer_select_level_tree", this.tree = createWidget({
type: MultiLayerSelectLevelTree.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
items: o.items, items: o.items,
itemsCreator: o.itemsCreator === BI.emptyFn ? BI.emptyFn : function (op, callback) { itemsCreator:
o.itemsCreator(op, function (res) { o.itemsCreator === emptyFn
callback(res); ? emptyFn
self.setKeyword(o.keywordGetter()); : function (op, callback) {
}); o.itemsCreator(op, res => {
}, callback(res);
self.setKeyword(o.keywordGetter());
});
},
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
value: o.value, value: o.value,
scrollable: null, scrollable: null,
listeners: [{ listeners: [
eventName: BI.Controller.EVENT_CHANGE, {
action: function () { eventName: Controller.EVENT_CHANGE,
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); action() {
} self.fireEvent(Controller.EVENT_CHANGE, arguments);
}, { },
eventName: BI.MultiLayerSelectLevelTree.EVENT_CHANGE, },
action: function () { {
self.fireEvent(BI.MultiLayerSelectTreeInsertSearchPane.EVENT_CHANGE); eventName: MultiLayerSelectLevelTree.EVENT_CHANGE,
action() {
self.fireEvent(
MultiLayerSelectTreeInsertSearchPane.EVENT_CHANGE
);
},
} }
}] ],
}); });
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
scrolly: false, scrolly: false,
scrollable: true, scrollable: true,
vgap: 5, vgap: 5,
items: [{ items: [
type: "bi.text_button", {
invisible: true, type: TextButton.xtype,
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), invisible: true,
height: 24, text: i18nText("BI-Basic_Click_To_Add_Text", ""),
cls: "bi-high-light", height: 24,
hgap: 5, cls: "bi-high-light",
ref: function (_ref) { hgap: 5,
self.addNotMatchTip = _ref; ref(_ref) {
self.addNotMatchTip = _ref;
},
handler() {
self.fireEvent(
MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM,
o.keywordGetter()
);
},
}, },
handler: function () { this.tree
self.fireEvent(BI.MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM, o.keywordGetter()); ],
}
}, this.tree]
}; };
}, }
setKeyword: function (keyword) { setKeyword(keyword) {
var showTip = BI.isEmptyArray(this.tree.getAllLeaves()); const showTip = isEmptyArray(this.tree.getAllLeaves());
this.addNotMatchTip.setVisible(showTip); this.addNotMatchTip.setVisible(showTip);
showTip && this.addNotMatchTip.setText(BI.i18nText("BI-Basic_Click_To_Add_Text", keyword)); showTip &&
}, this.addNotMatchTip.setText(
i18nText("BI-Basic_Click_To_Add_Text", keyword)
);
}
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) {
this.tree.populate(items); this.tree.populate(items);
} }
}); }
BI.MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
BI.MultiLayerSelectTreeInsertSearchPane.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_select_tree_insert_search_pane", BI.MultiLayerSelectTreeInsertSearchPane);

234
src/widget/multilayerselecttree/multilayerselecttree.leveltree.js

@ -1,98 +1,135 @@
/** import {
* guy shortcut,
* 二级树 extend,
* @class BI.MultiLayerSelectLevelTree emptyFn,
* @extends BI.Pane each,
*/ isKey,
BI.MultiLayerSelectLevelTree = BI.inherit(BI.Pane, { UUID,
_defaultConfig: function () { isNotEmptyArray,
return BI.extend(BI.MultiLayerSelectLevelTree.superclass._defaultConfig.apply(this, arguments), { defaults,
createWidget,
Tree,
nextTick,
Selection,
Controller,
Events,
VerticalLayout,
AdaptiveLayout,
isNull,
isArray
} from "@/core";
import { Pane, CustomTree, Loader, ButtonTree } from "@/base";
import { BasicTreeNode, BasicTreeItem, TreeExpander } from "@/case";
@shortcut()
export class MultiLayerSelectLevelTree extends Pane {
static xtype = "bi.multilayer_select_level_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-select-level-tree", baseCls: "bi-multilayer-select-level-tree",
isDefaultInit: false, isDefaultInit: false,
items: [], items: [],
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
keywordGetter: BI.emptyFn, keywordGetter: emptyFn,
value: "", value: "",
scrollable: true scrollable: true,
}); });
}, }
_init: function () { _init() {
var o = this.options; const o = this.options;
BI.MultiLayerSelectLevelTree.superclass._init.apply(this, arguments); super._init(...arguments);
this.storeValue = o.value; this.storeValue = o.value;
this.initTree(this.options.items); this.initTree(this.options.items);
this.check(); this.check();
}, }
_formatItems: function (nodes, layer, pNode) { _formatItems(nodes, layer, pNode) {
var self = this, o = this.options; const self = this,
var keyword = o.keywordGetter(); o = this.options;
BI.each(nodes, function (i, node) { const keyword = o.keywordGetter();
var extend = { each(nodes, (i, node) => {
const extend = {
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,
}; };
node.layer = layer; node.layer = layer;
if (!BI.isKey(node.id)) { if (!isKey(node.id)) {
node.id = BI.UUID(); node.id = UUID();
} }
node.keyword = node.keyword || keyword; node.keyword = node.keyword || keyword;
extend.pNode = pNode; extend.pNode = pNode;
if (node.isParent === true || node.parent === true || BI.isNotEmptyArray(node.children)) { if (
extend.type = "bi.tree_node"; node.isParent === true ||
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;
}, }
_assertId: function (sNodes) { _assertId(sNodes) {
BI.each(sNodes, function (i, node) { each(sNodes, (i, node) => {
node.id = node.id || BI.UUID(); node.id = node.id || UUID();
}); });
}, }
// 构造树结构, initTree(nodes) {
initTree: function (nodes) { const self = this,
var self = this, o = this.options; o = this.options;
var hasNext = false; let hasNext = false;
this.empty(); this.empty();
this._assertId(nodes); this._assertId(nodes);
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.custom_tree", type: CustomTree.xtype,
cls: "tree-view display-table", cls: "tree-view display-table",
expander: { expander: {
// type: "bi.select_tree_expander", type: TreeExpander.xtype,
type: "bi.tree_expander",
selectable: true, selectable: true,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
el: {}, el: {},
popup: { popup: {
type: "bi.custom_tree" type: CustomTree.xtype,
} },
}, },
items: this._formatItems(BI.Tree.transformToTreeFormat(nodes), 0), items: this._formatItems(Tree.transformToTreeFormat(nodes), 0),
itemsCreator: function (op, callback) { itemsCreator(op, callback) {
(op.times === 1 && !op.node) && BI.nextTick(function () { op.times === 1 &&
!op.node &&
nextTick(() => {
self.loading(); self.loading();
}); });
o.itemsCreator(op, function (ob) { o.itemsCreator(op, ob => {
hasNext = ob.hasNext; hasNext = ob.hasNext;
(op.times === 1 && !op.node) && self._populate(ob.items); op.times === 1 && !op.node && self._populate(ob.items);
callback(self._formatItems(BI.Tree.transformToTreeFormat(ob.items), op.node ? op.node.layer + 1 : 0, op.node)); callback(
self._formatItems(
Tree.transformToTreeFormat(ob.items),
op.node ? op.node.layer + 1 : 0,
op.node
)
);
self.setValue(self.storeValue); self.setValue(self.storeValue);
(op.times === 1 && !op.node) && BI.nextTick(function () { op.times === 1 &&
!op.node &&
nextTick(() => {
self.loaded(); self.loaded();
}); });
}); });
@ -100,73 +137,84 @@ BI.MultiLayerSelectLevelTree = BI.inherit(BI.Pane, {
value: o.value, value: o.value,
el: { el: {
type: "bi.loader", type: Loader.xtype,
isDefaultInit: o.itemsCreator !== BI.emptyFn, isDefaultInit: o.itemsCreator !== emptyFn,
el: { el: {
type: "bi.button_tree", type: ButtonTree.xtype,
chooseType: o.chooseType === BI.Selection.None ? BI.Selection.None : BI.Selection.Default, // 不使用buttontree内部getValue逻辑 chooseType:
o.chooseType === Selection.None
? Selection.None
: Selection.Default, // 不使用buttontree内部getValue逻辑
behaviors: o.behaviors, behaviors: o.behaviors,
layouts: [{ layouts: [
type: "bi.vertical" {
}] type: VerticalLayout.xtype,
}
],
}, },
hasNext: function () { hasNext() {
return hasNext; return hasNext;
} },
} },
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function (type, value) { this.tree.on(Controller.EVENT_CHANGE, function (type, value) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
self.setValue(value); self.setValue(value);
self.fireEvent(BI.MultiLayerSelectLevelTree.EVENT_CHANGE, arguments); self.fireEvent(
MultiLayerSelectLevelTree.EVENT_CHANGE,
arguments
);
} }
}); });
BI.createWidget({ createWidget({
type: "bi.adaptive", type: AdaptiveLayout.xtype,
element: this, element: this,
scrollable: o.scrollable, scrollable: o.scrollable,
items: [this.tree] items: [this.tree],
}); });
}, }
_populate: function () { _populate() {
BI.MultiLayerSelectLevelTree.superclass.populate.apply(this, arguments); super.populate(...arguments);
}, }
populate: function (nodes) { populate(nodes) {
this._populate(nodes); this._populate(nodes);
BI.isNull(nodes) ? this.tree.populate() : this.tree.populate(this._formatItems(BI.Tree.transformToTreeFormat(nodes), 0)); isNull(nodes)
}, ? this.tree.populate()
: this.tree.populate(
this._formatItems(Tree.transformToTreeFormat(nodes), 0)
);
}
setValue: function (v) { setValue(v) {
// getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了 // getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了
if (this.options.chooseType === BI.Selection.None) { if (this.options.chooseType === Selection.None) {
} else { } else {
this.storeValue = v; this.storeValue = v;
this.tree.setValue(v); this.tree.setValue(v);
} }
}, }
getValue: function () { getValue() {
return BI.isArray(this.storeValue) ? return isArray(this.storeValue)
this.storeValue : BI.isNull(this.storeValue) ? ? this.storeValue
[] : [this.storeValue]; : isNull(this.storeValue)
}, ? []
: [this.storeValue];
}
getAllLeaves: function () { getAllLeaves() {
return this.tree.getAllLeaves(); return this.tree.getAllLeaves();
}, }
getNodeById: function (id) { getNodeById(id) {
return this.tree.getNodeById(id); return this.tree.getNodeById(id);
}, }
getNodeByValue: function (id) { getNodeByValue(id) {
return this.tree.getNodeByValue(id); return this.tree.getNodeByValue(id);
} }
}); }
BI.MultiLayerSelectLevelTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_select_level_tree", BI.MultiLayerSelectLevelTree);

86
src/widget/multilayerselecttree/multilayerselecttree.popup.js

@ -1,77 +1,85 @@
/** import {
* Created by GUY on 2016/1/26. shortcut,
* Widget,
* @class BI.MultiLayerSelectTreePopup extend,
* @extends BI.Pane i18nText,
*/ emptyFn,
createWidget,
Controller,
VerticalLayout,
isArray
} from "@/core";
import { MultiLayerSelectLevelTree } from "./multilayerselecttree.leveltree";
BI.MultiLayerSelectTreePopup = BI.inherit(BI.Widget, { @shortcut()
export class MultiLayerSelectTreePopup extends Widget {
static xtype = "bi.multilayer_select_tree_popup";
_defaultConfig: function () { static EVENT_CHANGE = "EVENT_CHANGE";
return BI.extend(BI.MultiLayerSelectTreePopup.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-select-tree-popup", baseCls: "bi-multilayer-select-tree-popup",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
isDefaultInit: false, isDefaultInit: false,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
value: "", value: "",
onLoaded: BI.emptyFn, onLoaded: emptyFn,
minHeight: 240 minHeight: 240,
}); });
}, }
_init: function () { _init() {
BI.MultiLayerSelectTreePopup.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.multilayer_select_level_tree", type: MultiLayerSelectLevelTree.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
items: o.items, items: o.items,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
value: o.value, value: o.value,
scrollable: null, scrollable: null,
onLoaded: function () { onLoaded() {
self.tree.check(); self.tree.check();
o.onLoaded(); o.onLoaded();
} },
}); });
BI.createWidget({ createWidget({
type: "bi.vertical", type: VerticalLayout.xtype,
scrolly: false, scrolly: false,
scrollable: true, scrollable: true,
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.MultiLayerSelectLevelTree.EVENT_CHANGE, function () { this.tree.on(MultiLayerSelectLevelTree.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiLayerSelectTreePopup.EVENT_CHANGE); self.fireEvent(MultiLayerSelectTreePopup.EVENT_CHANGE);
}); });
this.tree.css("min-height", BI.pixFormat(o.minHeight - 10)); this.tree.css("min-height", BI.pixFormat(o.minHeight - 10));
}, }
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) {
this.tree.populate(items); this.tree.populate(items);
} }
}); }
BI.MultiLayerSelectTreePopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_select_tree_popup", BI.MultiLayerSelectTreePopup);

334
src/widget/multilayerselecttree/multilayerselecttree.trigger.js

@ -1,237 +1,301 @@
/** import {
* Created by Windy on 2018/2/2. shortcut,
*/ emptyFn,
BI.MultiLayerSelectTreeTrigger = BI.inherit(BI.Trigger, { i18nText,
isNotNull,
isKey,
HorizontalFillLayout,
Tree,
deepClone,
Func,
concat,
isNotEmptyArray,
each,
uniqBy,
map,
isFunction,
find
} from "@/core";
import { Trigger, Searcher } from "@/base";
import { StateEditor, DefaultTextEditor } from "@/case";
import { MultiLayerSelectTreeInsertSearchPane } from "./multilayerselecttree.insert.search.pane";
import { MultiLayerSelectTreePopup } from "./multilayerselecttree.popup";
props: function () { @shortcut()
export class MultiLayerSelectTreeTrigger extends Trigger {
static xtype = "bi.multilayer_select_tree_trigger";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_STOP = "EVENT_STOP";
static EVENT_START = "EVENT_START";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
props() {
return { return {
extraCls: "bi-multi-layer-select-tree-trigger", extraCls: "bi-multi-layer-select-tree-trigger",
height: 24, height: 24,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
watermark: BI.i18nText("BI-Basic_Search"), watermark: i18nText("BI-Basic_Search"),
allowSearchValue: false, allowSearchValue: false,
title: BI.bind(this._getShowText, this) title: () => this._getShowText(),
}; };
}, }
render: function () { render() {
var self = this, o = this.options; const self = this,
o = this.options;
if (o.itemsCreator === BI.emptyFn) { if (o.itemsCreator === BI.emptyFn) {
this._initData(); this._initData();
} }
return { return {
type: "bi.horizontal_fill", type: HorizontalFillLayout.xtype,
items: [ items: [
{ {
el: { el: {
type: "bi.searcher", type: Searcher.xtype,
ref: function () { ref() {
self.searcher = this; self.searcher = this;
}, },
masker: BI.isNotNull(o.container) ? { masker: isNotNull(o.container)
offset: {}, ? {
container: o.container offset: {},
} : { container: o.container,
offset: {} }
}, : {
offset: {},
},
isAutoSearch: false, isAutoSearch: false,
el: { el: {
type: "bi.default_text_editor", type: DefaultTextEditor.xtype,
ref: function () { ref() {
self.editor = this; self.editor = this;
}, },
defaultText: o.defaultText, defaultText: o.defaultText,
text: BI.isKey(o.value) ? this._digest(o.value) : o.text, text: isKey(o.value)
? this._digest(o.value)
: o.text,
value: o.value, value: o.value,
height: o.height, height: o.height,
tipText: "", tipText: "",
watermark: o.watermark, watermark: o.watermark,
listeners: [{ listeners: [
eventName: BI.StateEditor.EVENT_FOCUS, {
action: function () { eventName: StateEditor.EVENT_FOCUS,
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_FOCUS); action() {
} self.fireEvent(
}, { MultiLayerSelectTreeTrigger.EVENT_FOCUS
eventName: BI.StateEditor.EVENT_BLUR, );
action: function () { },
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_BLUR); },
{
eventName: StateEditor.EVENT_BLUR,
action() {
self.fireEvent(
MultiLayerSelectTreeTrigger.EVENT_BLUR
);
},
},
{
eventName: StateEditor.EVENT_CHANGE,
action() {
self.fireEvent(
MultiLayerSelectTreeTrigger.EVENT_SEARCHING
);
},
} }
}, { ],
eventName: BI.StateEditor.EVENT_CHANGE,
action: function () {
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_SEARCHING);
}
}]
}, },
popup: { popup: {
type: o.allowInsertValue ? "bi.multilayer_select_tree_insert_search_pane" : "bi.multilayer_select_tree_popup", type: o.allowInsertValue
itemsCreator: o.itemsCreator === BI.emptyFn ? BI.emptyFn : function (op, callback) { ? MultiLayerSelectTreeInsertSearchPane.xtype
op.keyword = self.editor.getValue(); : MultiLayerSelectTreePopup.xtype,
o.itemsCreator(op, callback); itemsCreator:
}, o.itemsCreator === emptyFn
keywordGetter: function () { ? emptyFn
: function (op, callback) {
op.keyword = self.editor.getValue();
o.itemsCreator(op, callback);
},
keywordGetter() {
return self.editor.getValue(); return self.editor.getValue();
}, },
cls: "bi-card", cls: "bi-card",
listeners: [{ listeners: [
eventName: BI.MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM, {
action: function () { eventName:
self.options.text = self.getSearcher().getKeyword(); MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM,
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM); action() {
self.options.text = self
.getSearcher()
.getKeyword();
self.fireEvent(
MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM
);
},
} }
}], ],
ref: function (_ref) { ref(_ref) {
self.popup = _ref; self.popup = _ref;
} },
}, },
onSearch: function (obj, callback) { onSearch(obj, callback) {
var keyword = obj.keyword; const keyword = obj.keyword;
if (o.itemsCreator === BI.emptyFn) { if (o.itemsCreator === BI.emptyFn) {
callback(self._getSearchItems(keyword)); callback(self._getSearchItems(keyword));
o.allowInsertValue && self.popup.setKeyword(keyword); o.allowInsertValue &&
self.popup.setKeyword(keyword);
} else { } else {
callback(); callback();
} }
}, },
listeners: [{ listeners: [
eventName: BI.Searcher.EVENT_CHANGE, {
action: function () { eventName: Searcher.EVENT_CHANGE,
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_CHANGE); action() {
self.fireEvent(
MultiLayerSelectTreeTrigger.EVENT_CHANGE
);
},
} }
}] ],
}, },
width: "fill", width: "fill",
rgap: 24 rgap: 24,
}, }
] ],
}; };
}, }
_initData: function () { _initData() {
var o = this.options; const o = this.options;
this.tree = new BI.Tree(); this.tree = new Tree();
this.nodes = BI.Tree.treeFormat(BI.deepClone(o.items)); this.nodes = Tree.treeFormat(deepClone(o.items));
this.tree.initTree(this.nodes); this.tree.initTree(this.nodes);
}, }
_getSearchItems: function (keyword) { _getSearchItems(keyword) {
var self = this, o = this.options; const self = this,
o = this.options;
// 把数组搜索换成用BI.tree搜索节点, 搜到了就不再往下搜索 // 把数组搜索换成用BI.tree搜索节点, 搜到了就不再往下搜索
var items = []; const items = [];
this.tree.traverse(function (node) { this.tree.traverse(node => {
var find = BI.Func.getSearchResult(self.tree.isRoot(node) ? [] : BI.concat([node.text], (o.allowSearchValue ? [node.value] : [])), keyword); const find = Func.getSearchResult(
self.tree.isRoot(node)
? []
: concat(
[node.text],
o.allowSearchValue ? [node.value] : []
),
keyword
);
if (find.find.length > 0 || find.match.length > 0) { if (find.find.length > 0 || find.match.length > 0) {
items.push(node); items.push(node);
return true; return true;
} }
}); });
return this._fillTreeStructure4Search(items, "id"); return this._fillTreeStructure4Search(items, "id");
}, }
_createJson: function (node, open) { _createJson(node, open) {
return { return {
id: node.id, id: node.id,
pId: node.pId, pId: node.pId,
text: node.text, text: node.text,
value: node.value, value: node.value,
isParent: BI.isNotEmptyArray(node.children), isParent: isNotEmptyArray(node.children),
open: open open,
}; };
}, }
_getChildren: function (node) { _getChildren(node) {
var self = this; const self = this;
node.children = node.children || []; node.children = node.children || [];
var nodes = []; let nodes = [];
BI.each(node.children, function (idx, child) { each(node.children, (idx, child) => {
var children = self._getChildren(child); const children = self._getChildren(child);
nodes = nodes.concat(children); nodes = nodes.concat(children);
}); });
return node.children.concat(nodes); return node.children.concat(nodes);
}, }
// 将搜索到的节点进行补充,构造成一棵完整的树 _fillTreeStructure4Search(leaves) {
_fillTreeStructure4Search: function (leaves) { const self = this;
var self = this; let result = [];
var result = []; const queue = [];
var queue = []; each(leaves, (idx, node) => {
BI.each(leaves, function (idx, node) {
queue.push({ pId: node.pId }); queue.push({ pId: node.pId });
result.push(node); result.push(node);
result = result.concat(self._getChildren(node)); result = result.concat(self._getChildren(node));
}); });
queue.reverse(); queue.reverse();
while (BI.isNotEmptyArray(queue)) { while (isNotEmptyArray(queue)) {
var node = queue.pop(); const node = queue.pop();
var pNode = this.tree.search(this.tree.getRoot(), node.pId, "id"); const pNode = this.tree.search(this.tree.getRoot(), node.pId, "id");
if (pNode != null) { if (pNode != null) {
pNode.open = true; pNode.open = true;
queue.push({ pId: pNode.pId }); queue.push({ pId: pNode.pId });
result.push(pNode); result.push(pNode);
} }
} }
return BI.uniqBy(BI.map(result, function (idx, node) {
return self._createJson(node, node.open); return uniqBy(
}), "id"); map(result, (idx, node) => self._createJson(node, node.open)),
}, "id"
);
_digest: function (v) { }
var o = this.options;
if (BI.isFunction(o.valueFormatter)) { _digest(v) {
const o = this.options;
if (isFunction(o.valueFormatter)) {
return o.valueFormatter(v); return o.valueFormatter(v);
} }
var result = BI.find(o.items, function (i, item) { const result = find(o.items, (i, item) => item.value === v);
return item.value === v;
});
return BI.isNotNull(result) ? result.text : (o.text ?? v); return isNotNull(result) ? result.text : o.text ?? v;
}, }
_getShowText: function () { _getShowText() {
return this.editor.getText(); return this.editor.getText();
}, }
stopEditing: function () { stopEditing() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
getSearcher: function () { getSearcher() {
return this.searcher; return this.searcher;
}, }
populate: function (items) { populate(items) {
this.options.items = items; this.options.items = items;
this._initData(items); this._initData(items);
}, }
setValue: function (v) { setValue(v) {
this.editor.setState(this._digest(v[0])); this.editor.setState(this._digest(v[0]));
}, }
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.MultiLayerSelectTreeTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiLayerSelectTreeTrigger.EVENT_BLUR = "EVENT_BLUR";
BI.MultiLayerSelectTreeTrigger.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiLayerSelectTreeTrigger.EVENT_STOP = "EVENT_STOP";
BI.MultiLayerSelectTreeTrigger.EVENT_START = "EVENT_START";
BI.MultiLayerSelectTreeTrigger.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
BI.shortcut("bi.multilayer_select_tree_trigger", BI.MultiLayerSelectTreeTrigger);

99
src/widget/multilayerselecttree/node/node.first.plus.js

@ -1,99 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSelectTreeFirstPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSelectTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSelectTreeFirstPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-select-tree-first-plus-group-node bi-list-item-active",
layer: 0, // 第几层级
id: "",
pId: "",
readonly: true,
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSelectTreeFirstPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = BI.createWidget({
type: "bi.select_tree_first_plus_group_node",
cls: "bi-list-item-none",
stopPropagation: true,
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
keyword: o.keyword,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py
});
this.node.on(BI.Controller.EVENT_CHANGE, function (type) {
self.setSelected(self.isSelected());
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
// BI.count(0, o.layer, function (index) {
// items.push({
// type: "bi.layout",
// cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
// width: 12,
// height: o.height
// });
// });
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
isOnce: function () {
return true;
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
isSelected: function () {
return this.node.isSelected();
},
setSelected: function (b) {
BI.MultiLayerSelectTreeFirstPlusGroupNode.superclass.setSelected.apply(this, arguments);
this.node.setSelected(b);
},
doClick: function () {
BI.NodeButton.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSelectTreeFirstPlusGroupNode.superclass.setOpened.apply(this, arguments);
this.node.setOpened(v);
}
});
BI.shortcut("bi.multilayer_select_tree_first_plus_group_node", BI.MultiLayerSelectTreeFirstPlusGroupNode);

88
src/widget/multilayerselecttree/node/node.last.plus.js

@ -1,88 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSelectTreeLastPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSelectTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSelectTreeLastPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-select-tree-last-plus-group-node bi-list-item-active",
layer: 0, // 第几层级
id: "",
pId: "",
readonly: true,
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSelectTreeLastPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = BI.createWidget({
type: "bi.select_tree_last_plus_group_node",
cls: "bi-list-item-none",
stopPropagation: true,
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
keyword: o.keyword,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py
});
this.node.on(BI.Controller.EVENT_CHANGE, function (type) {
self.setSelected(self.isSelected());
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
isSelected: function () {
return this.node.isSelected();
},
setSelected: function (b) {
BI.MultiLayerSelectTreeLastPlusGroupNode.superclass.setSelected.apply(this, arguments);
this.node.setSelected(b);
},
doClick: function () {
BI.MultiLayerSelectTreeLastPlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSelectTreeLastPlusGroupNode.superclass.setOpened.apply(this, arguments);
this.node.setOpened(v);
}
});
BI.shortcut("bi.multilayer_select_tree_last_plus_group_node", BI.MultiLayerSelectTreeLastPlusGroupNode);

88
src/widget/multilayerselecttree/node/node.mid.plus.js

@ -1,88 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSelectTreeMidPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSelectTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSelectTreeMidPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-select-tree-mid-plus-group-node bi-list-item-active",
layer: 0, // 第几层级
id: "",
pId: "",
readonly: true,
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSelectTreeMidPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = BI.createWidget({
type: "bi.select_tree_mid_plus_group_node",
cls: "bi-list-item-none",
stopPropagation: true,
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
keyword: o.keyword,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py
});
this.node.on(BI.Controller.EVENT_CHANGE, function (type) {
self.setSelected(self.isSelected());
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
isSelected: function () {
return this.node.isSelected();
},
setSelected: function (b) {
BI.MultiLayerSelectTreeMidPlusGroupNode.superclass.setSelected.apply(this, arguments);
this.node.setSelected(b);
},
doClick: function () {
BI.MultiLayerSelectTreeMidPlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSelectTreeMidPlusGroupNode.superclass.setOpened.apply(this, arguments);
this.node.setOpened(v);
}
});
BI.shortcut("bi.multilayer_select_tree_mid_plus_group_node", BI.MultiLayerSelectTreeMidPlusGroupNode);

92
src/widget/multilayerselecttree/node/node.plus.js

@ -1,92 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSelectTreePlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSelectTreePlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSelectTreePlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-select-tree-first-plus-group-node bi-list-item-active",
layer: 0, // 第几层级
id: "",
pId: "",
readonly: true,
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSelectTreePlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = BI.createWidget({
type: "bi.select_tree_plus_group_node",
cls: "bi-list-item-none",
stopPropagation: true,
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
keyword: o.keyword,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py
});
this.node.on(BI.Controller.EVENT_CHANGE, function (type) {
self.setSelected(self.isSelected());
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
isOnce: function () {
return true;
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
isSelected: function () {
return this.node.isSelected();
},
setSelected: function (b) {
BI.MultiLayerSelectTreePlusGroupNode.superclass.setSelected.apply(this, arguments);
this.node.setSelected(b);
},
doClick: function () {
BI.NodeButton.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSelectTreePlusGroupNode.superclass.setOpened.apply(this, arguments);
this.node.setOpened(v);
}
});
BI.shortcut("bi.multilayer_select_tree_plus_group_node", BI.MultiLayerSelectTreePlusGroupNode);

2
src/widget/multilayersingletree/index.js

@ -0,0 +1,2 @@
export { MultiLayerSingleTreeCombo } from "./multilayersingletree.combo";
export { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";

402
src/widget/multilayersingletree/multilayersingletree.combo.js

@ -1,279 +1,353 @@
/** import {
* 多层级下拉单选树 shortcut,
* Created by GUY on 2016/1/26. Widget,
* extend,
* @class BI.MultiLayerSingleTreeCombo emptyFn,
* @extends BI.Widget isKey,
*/ toPix,
BI.MultiLayerSingleTreeCombo = BI.inherit(BI.Widget, { AbsoluteLayout,
nextTick,
isArray
} from "@/core";
import { SingleTreeTrigger } from "../singletree/singletree.trigger";
import { MultiLayerSingleTreePopup } from "./multilayersingletree.popup";
import { Combo } from "@/base";
import { MultiLayerSingleTreeTrigger } from "./multilayersingletree.trigger";
import { TriggerIconButton } from "@/case";
_defaultConfig: function () { @shortcut()
return BI.extend(BI.MultiLayerSingleTreeCombo.superclass._defaultConfig.apply(this, arguments), { export class MultiLayerSingleTreeCombo extends Widget {
static xtype = "bi.multilayer_single_tree_combo";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_STOP = "EVENT_STOP";
static EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-single-tree-combo", baseCls: "bi-multilayer-single-tree-combo",
isDefaultInit: false, isDefaultInit: false,
height: 24, height: 24,
text: "", text: "",
defaultText: "", defaultText: "",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
allowEdit: false, allowEdit: false,
allowSearchValue: false, allowSearchValue: false,
allowInsertValue: false, allowInsertValue: false,
isNeedAdjustWidth: true, isNeedAdjustWidth: true,
}); });
}, }
render: function () { render() {
var self = this, o = this.options; const self = this,
o = this.options;
var cls = (o.simple ? "bi-border-bottom bi-focus-shadow " : "bi-border bi-border-radius bi-focus-shadow ") + (BI.isKey(o.status) ? ("status-" + o.status) : ""); const cls =
(o.simple
? "bi-border-bottom bi-focus-shadow "
: "bi-border bi-border-radius bi-focus-shadow ") +
(isKey(o.status) ? `status-${o.status}` : "");
var baseConfig = this._getBaseConfig(); const baseConfig = this._getBaseConfig();
if (o.allowEdit) { if (o.allowEdit) {
return { return {
type: "bi.absolute", type: AbsoluteLayout.xtype,
width: BI.toPix(o.width, 2), width: toPix(o.width, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
cls, cls,
items: [ items: [
{ {
el: BI.extend(baseConfig, this._getSearchConfig()), el: extend(baseConfig, this._getSearchConfig()),
top: 0, bottom: 0, right: 0, left: 0 top: 0,
}, { bottom: 0,
el: self._getTriggerIconButton(), right: 0,
top: 0, bottom: 0, right: 0, left: 0,
}, },
] {
el: self._getTriggerIconButton(),
top: 0,
bottom: 0,
right: 0,
}
],
}; };
} }
return BI.extend(baseConfig, { return extend(
width: BI.toPix(o.width, 2), baseConfig,
height: BI.toPix(o.height, 2), {
el: { width: toPix(o.width, 2),
type: "bi.single_tree_trigger", height: toPix(o.height, 2),
ref: function (_ref) { el: {
self.textTrigger = _ref; type: SingleTreeTrigger.xtype,
ref(_ref) {
self.textTrigger = _ref;
},
text: o.text,
defaultText: o.defaultText,
height: toPix(o.height, 2),
items: o.items,
value: o.value,
tipType: o.tipType,
warningTitle: o.warningTitle,
valueFormatter: o.valueFormatter,
}, },
text: o.text,
defaultText: o.defaultText,
height: BI.toPix(o.height, 2),
items: o.items,
value: o.value,
tipType: o.tipType,
warningTitle: o.warningTitle,
valueFormatter: o.valueFormatter,
}, },
}, { cls }); { cls }
}, );
}
_getBaseConfig() {
const self = this,
o = this.options;
_getBaseConfig: function () {
var self = this, o = this.options;
return { return {
type: "bi.combo", type: Combo.xtype,
container: o.container, container: o.container,
destroyWhenHide: o.destroyWhenHide, destroyWhenHide: o.destroyWhenHide,
adjustLength: 2, adjustLength: 2,
ref: function (_ref) { ref(_ref) {
self.combo = _ref; self.combo = _ref;
}, },
popup: { popup: {
el: { el: {
type: "bi.multilayer_single_tree_popup", type: MultiLayerSingleTreePopup.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
items: o.items, items: o.items,
ref: function (_ref) { ref(_ref) {
self.trigger && self.trigger.getSearcher().setAdapter(_ref); self.trigger &&
self.trigger.getSearcher().setAdapter(_ref);
}, },
listeners: [{ listeners: [
eventName: BI.MultiLayerSingleTreePopup.EVENT_CHANGE, {
action: function () { eventName: MultiLayerSingleTreePopup.EVENT_CHANGE,
self.setValue(this.getValue()); action() {
self.combo.hideView(); self.setValue(this.getValue());
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); self.combo.hideView();
self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_CHANGE
);
},
} }
}], ],
onLoaded: function () { onLoaded() {
BI.nextTick(function () { nextTick(() => {
self.combo.adjustWidth(); self.combo.adjustWidth();
self.combo.adjustHeight(); self.combo.adjustHeight();
}); });
} },
}, },
value: o.value, value: o.value,
maxHeight: 400, maxHeight: 400,
maxWidth: o.isNeedAdjustWidth ? "auto" : 500, maxWidth: o.isNeedAdjustWidth ? "auto" : 500,
minHeight: 240 minHeight: 240,
}, },
isNeedAdjustWidth: o.isNeedAdjustWidth, isNeedAdjustWidth: o.isNeedAdjustWidth,
listeners: [{ listeners: [
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, {
action: function () { eventName: Combo.EVENT_BEFORE_POPUPVIEW,
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); action() {
self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW
);
},
} }
}] ],
}; };
}, }
_getSearchConfig() {
const self = this,
o = this.options;
_getSearchConfig: function () {
var self = this, o = this.options;
return { return {
el: { el: {
type: "bi.multilayer_single_tree_trigger", type: MultiLayerSingleTreeTrigger.xtype,
container: o.container, container: o.container,
allowInsertValue: o.allowInsertValue, allowInsertValue: o.allowInsertValue,
allowSearchValue: o.allowSearchValue, allowSearchValue: o.allowSearchValue,
cls: "multilayer-single-tree-trigger", cls: "multilayer-single-tree-trigger",
ref: function (_ref) { ref(_ref) {
self.trigger = _ref; self.trigger = _ref;
}, },
watermark: o.watermark, watermark: o.watermark,
items: o.items, items: o.items,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
valueFormatter: o.valueFormatter, valueFormatter: o.valueFormatter,
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
value: o.value, value: o.value,
tipType: o.tipType, tipType: o.tipType,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
title: o.title, title: o.title,
listeners: [{ listeners: [
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_CHANGE, {
action: function () { eventName: MultiLayerSingleTreeTrigger.EVENT_CHANGE,
self.setValue(this.getValue()); action() {
self.combo.hideView(); self.setValue(this.getValue());
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); self.combo.hideView();
} self.fireEvent(
}, { MultiLayerSingleTreeCombo.EVENT_CHANGE
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_FOCUS, );
action: function () { },
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_FOCUS); },
} {
}, { eventName: MultiLayerSingleTreeTrigger.EVENT_FOCUS,
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_BLUR, action() {
action: function () { self.fireEvent(
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BLUR); MultiLayerSingleTreeCombo.EVENT_FOCUS
} );
}, { },
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_SEARCHING, },
action: function () { {
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_SEARCHING); eventName: MultiLayerSingleTreeTrigger.EVENT_BLUR,
} action() {
}, { self.fireEvent(
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_STOP, MultiLayerSingleTreeCombo.EVENT_BLUR
action: function () { );
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_STOP); },
} },
}, { {
eventName: BI.MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM, eventName: MultiLayerSingleTreeTrigger.EVENT_SEARCHING,
action: function () { action() {
var value = self.trigger.getSearcher().getKeyword(); self.fireEvent(
self.combo.setValue([value]); MultiLayerSingleTreeCombo.EVENT_SEARCHING
self.combo.hideView(); );
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_CHANGE); },
},
{
eventName: MultiLayerSingleTreeTrigger.EVENT_STOP,
action() {
self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_STOP
);
},
},
{
eventName: MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM,
action() {
const value = self.trigger.getSearcher().getKeyword();
self.combo.setValue([value]);
self.combo.hideView();
self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_CHANGE
);
},
} }
}] ],
}, },
toggle: !o.allowEdit, toggle: !o.allowEdit,
hideChecker: function (e) { hideChecker(e) {
// 新增传配置container后对应hideChecker的修改 // 新增传配置container后对应hideChecker的修改
// IE11下,popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿 // IE11下,popover(position: fixed)下放置下拉控件(position: fixed), 滚动的时候会异常卡顿
// 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页,所以 // 通过container参数将popup放置于popover之外解决此问题, 其他下拉控件由于元素少或者有分页,所以
// 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪 // 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪
return (o.container && self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().getView().element.find(e.target).length > 0) ? false : self.triggerBtn?.element.find(e.target).length === 0; return o.container &&
self.trigger.getSearcher().isSearching() &&
self.trigger.getSearcher().getView().element.find(e.target)
.length > 0
? false
: self.triggerBtn?.element.find(e.target).length === 0;
}, },
listeners: [{ listeners: [
eventName: BI.Combo.EVENT_AFTER_HIDEVIEW, {
action: function () { eventName: Combo.EVENT_AFTER_HIDEVIEW,
self.trigger.stopEditing(); action() {
} self.trigger.stopEditing();
}, { },
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW, },
action: function () { {
self.fireEvent(BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); eventName: Combo.EVENT_BEFORE_POPUPVIEW,
action() {
self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW
);
},
} }
}] ],
}; };
}, }
_getTriggerIconButton() {
const self = this,
o = this.options;
_getTriggerIconButton: function () {
var self = this, o = this.options;
return { return {
type: "bi.trigger_icon_button", type: TriggerIconButton.xtype,
cls: "bi-trigger trigger-icon-button", cls: "bi-trigger trigger-icon-button",
ref: function (_ref) { ref(_ref) {
self.triggerBtn = _ref; self.triggerBtn = _ref;
}, },
width: BI.toPix(o.height, 2), width: toPix(o.height, 2),
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
listeners: [ listeners: [
{ {
eventName: BI.TriggerIconButton.EVENT_CHANGE, eventName: TriggerIconButton.EVENT_CHANGE,
action: function () { action() {
if (self.combo.isViewVisible()) { if (self.combo.isViewVisible()) {
self.combo.hideView(); self.combo.hideView();
} else { } else {
self.combo.showView(); self.combo.showView();
} }
} },
} }
] ],
}; };
}, }
getSearcher: function () { getSearcher() {
return this.trigger ? this.trigger.getSearcher() : this.textTrigger.getTextor(); return this.trigger
}, ? this.trigger.getSearcher()
: this.textTrigger.getTextor();
}
setValue: function (v) { setValue(v) {
v = BI.isArray(v) ? v : [v]; v = isArray(v) ? v : [v];
this.combo.setValue(v); this.combo.setValue(v);
}, }
getValue: function () { getValue() {
return this.combo.getValue(); return this.combo.getValue();
}, }
setStatus: function (status) { setStatus(status) {
if (BI.isKey(this.options.status)) { if (isKey(this.options.status)) {
this.element.removeClass("status-" + this.options.status); this.element.removeClass(`status-${this.options.status}`);
} }
this.element.addClass("status-" + status); this.element.addClass(`status-${status}`);
this.options.status = status; this.options.status = status;
}, }
setTipType: function (v) { setTipType(v) {
this.trigger ? this.trigger.setTipType(v) : this.textTrigger.setTipType(v); this.trigger
}, ? this.trigger.setTipType(v)
: this.textTrigger.setTipType(v);
}
populate: function (items) { populate(items) {
this.combo.populate(items); this.combo.populate(items);
}, }
focus: function () { focus() {
this.trigger.focus(); this.trigger.focus();
}, }
blur: function () { blur() {
this.trigger.blur(); this.trigger.blur();
}, }
showView: function () { showView() {
this.combo.showView(); this.combo.showView();
}, }
setWaterMark: function (v) { setWaterMark(v) {
this.trigger.setWaterMark(v); this.trigger.setWaterMark(v);
} }
}); }
BI.MultiLayerSingleTreeCombo.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiLayerSingleTreeCombo.EVENT_BLUR = "EVENT_BLUR";
BI.MultiLayerSingleTreeCombo.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiLayerSingleTreeCombo.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiLayerSingleTreeCombo.EVENT_STOP = "EVENT_STOP";
BI.MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW = "EVENT_BEFORE_POPUPVIEW";
BI.shortcut("bi.multilayer_single_tree_combo", BI.MultiLayerSingleTreeCombo);

151
src/widget/multilayersingletree/multilayersingletree.insert.search.pane.js

@ -1,92 +1,119 @@
/** import {
* Created by GUY on 2016/1/26. shortcut,
* Widget,
* @class BI.MultiLayerSingleTreeInsertSearchPane i18nText,
* @extends BI.Pane emptyFn,
*/ createWidget,
Controller,
VerticalLayout,
isEmptyArray,
isArray
} from "@/core";
import { TextButton } from "@/base";
import { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";
BI.MultiLayerSingleTreeInsertSearchPane = BI.inherit(BI.Widget, { @shortcut()
export class MultiLayerSingleTreeInsertSearchPane extends Widget {
static xtype = "bi.multilayer_single_tree_insert_search_pane";
props: function() { static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
static EVENT_CHANGE = "EVENT_CHANGE";
props() {
return { return {
baseCls: "bi-multilayer-single-tree-popup", baseCls: "bi-multilayer-single-tree-popup",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
isDefaultInit: false, isDefaultInit: false,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
value: "" value: "",
}; };
}, }
render: function() { render() {
var self = this, o = this.options; const self = this,
this.tree = BI.createWidget({ o = this.options;
type: "bi.multilayer_single_level_tree", this.tree = createWidget({
type: MultiLayerSingleLevelTree.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
items: o.items, items: o.items,
itemsCreator: o.itemsCreator === BI.emptyFn ? BI.emptyFn : function (op, callback) { itemsCreator:
o.itemsCreator(op, function (res) { o.itemsCreator === emptyFn
callback(res); ? emptyFn
self.setKeyword(o.keywordGetter()); : function (op, callback) {
}); o.itemsCreator(op, res => {
}, callback(res);
self.setKeyword(o.keywordGetter());
});
},
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
value: o.value, value: o.value,
scrollable: null, scrollable: null,
listeners: [{ listeners: [
eventName: BI.Controller.EVENT_CHANGE, {
action: function () { eventName: Controller.EVENT_CHANGE,
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); action() {
} self.fireEvent(Controller.EVENT_CHANGE, arguments);
}, { },
eventName: BI.MultiLayerSelectLevelTree.EVENT_CHANGE, },
action: function () { {
self.fireEvent(BI.MultiLayerSingleTreeInsertSearchPane.EVENT_CHANGE); eventName: MultiLayerSingleLevelTree.EVENT_CHANGE,
action() {
self.fireEvent(
MultiLayerSingleTreeInsertSearchPane.EVENT_CHANGE
);
},
} }
}] ],
}); });
return { return {
type: "bi.vertical", type: VerticalLayout.xtype,
scrolly: false, scrolly: false,
scrollable: true, scrollable: true,
vgap: 5, vgap: 5,
items: [{ items: [
type: "bi.text_button", {
invisible: true, type: TextButton.xtype,
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), invisible: true,
height: 24, text: i18nText("BI-Basic_Click_To_Add_Text", ""),
cls: "bi-high-light", height: 24,
hgap: 5, cls: "bi-high-light",
ref: function (_ref) { hgap: 5,
self.addNotMatchTip = _ref; ref(_ref) {
self.addNotMatchTip = _ref;
},
handler() {
self.fireEvent(
MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM,
o.keywordGetter()
);
},
}, },
handler: function () { this.tree
self.fireEvent(BI.MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM, o.keywordGetter()); ],
}
}, this.tree]
}; };
}, }
setKeyword: function (keyword) { setKeyword(keyword) {
var showTip = BI.isEmptyArray(this.tree.getAllLeaves()); const showTip = isEmptyArray(this.tree.getAllLeaves());
this.addNotMatchTip.setVisible(showTip); this.addNotMatchTip.setVisible(showTip);
showTip && this.addNotMatchTip.setText(BI.i18nText("BI-Basic_Click_To_Add_Text", keyword)); showTip &&
}, this.addNotMatchTip.setText(
i18nText("BI-Basic_Click_To_Add_Text", keyword)
);
}
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) {
this.tree.populate(items); this.tree.populate(items);
} }
}); }
BI.MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
BI.MultiLayerSingleTreeInsertSearchPane.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_single_tree_insert_search_pane", BI.MultiLayerSingleTreeInsertSearchPane);

232
src/widget/multilayersingletree/multilayersingletree.leveltree.js

@ -1,170 +1,216 @@
/** import {
* guy shortcut,
* 二级树 extend,
* @class BI.MultiLayerSingleLevelTree emptyFn,
* @extends BI.Single Selection,
*/ each,
BI.MultiLayerSingleLevelTree = BI.inherit(BI.Pane, { isKey,
_defaultConfig: function () { UUID,
return BI.extend(BI.MultiLayerSingleLevelTree.superclass._defaultConfig.apply(this, arguments), { isNotEmptyArray,
defaults,
createWidget,
Tree,
nextTick,
Controller,
Events,
VerticalLayout,
AdaptiveLayout,
isNull,
isArray
} from "@/core";
import { Pane, CustomTree, Loader, ButtonTree } from "@/base";
import { BasicTreeNode, BasicTreeItem, TreeExpander } from "@/case";
@shortcut()
export class MultiLayerSingleLevelTree extends Pane {
static xtype = "bi.multilayer_single_level_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-single-level-tree", baseCls: "bi-multilayer-single-level-tree",
isDefaultInit: false, isDefaultInit: false,
items: [], items: [],
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
keywordGetter: BI.emptyFn, keywordGetter: emptyFn,
chooseType: BI.Selection.Single, chooseType: Selection.Single,
scrollable: true scrollable: true,
}); });
}, }
_init: function () { _init() {
var o = this.options; const o = this.options;
BI.MultiLayerSingleLevelTree.superclass._init.apply(this, arguments); super._init(...arguments);
this.storeValue = o.value; this.storeValue = o.value;
this.initTree(this.options.items); this.initTree(this.options.items);
this.check(); this.check();
}, }
_formatItems: function (nodes, layer, pNode) { _formatItems(nodes, layer, pNode) {
var self = this, o = this.options; const self = this,
var keyword = o.keywordGetter(); o = this.options;
BI.each(nodes, function (i, node) { const keyword = o.keywordGetter();
var extend = { each(nodes, (i, node) => {
const extend = {
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,
}; };
node.layer = layer; node.layer = layer;
if (!BI.isKey(node.id)) { if (!isKey(node.id)) {
node.id = BI.UUID(); node.id = UUID();
} }
node.keyword = node.keyword || keyword; node.keyword = node.keyword || keyword;
extend.pNode = pNode; extend.pNode = pNode;
if (node.isParent === true || node.parent === true || BI.isNotEmptyArray(node.children)) { if (
extend.type = "bi.tree_node"; node.isParent === true ||
node.parent === true ||
isNotEmptyArray(node.children)
) {
extend.type = BasicTreeNode.xtype;
extend.selectable = false; extend.selectable = false;
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;
}, }
_assertId: function (sNodes) { _assertId(sNodes) {
BI.each(sNodes, function (i, node) { each(sNodes, (i, node) => {
node.id = node.id || BI.UUID(); node.id = node.id || UUID();
}); });
}, }
// 构造树结构, initTree(nodes) {
initTree: function (nodes) { const self = this,
var self = this, o = this.options; o = this.options;
var hasNext = false; let hasNext = false;
this.empty(); this.empty();
this._assertId(nodes); this._assertId(nodes);
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.custom_tree", type: CustomTree.xtype,
cls: "tree-view display-table", cls: "tree-view display-table",
expander: { expander: {
type: "bi.tree_expander", type: TreeExpander.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
el: {}, el: {},
popup: { popup: {
type: "bi.custom_tree" type: CustomTree.xtype,
} },
}, },
items: this._formatItems(BI.Tree.transformToTreeFormat(nodes), 0), items: this._formatItems(Tree.transformToTreeFormat(nodes), 0),
value: o.value, value: o.value,
itemsCreator: function (op, callback) { itemsCreator(op, callback) {
(op.times === 1 && !op.node) && BI.nextTick(function () { op.times === 1 &&
!op.node &&
nextTick(() => {
self.loading(); self.loading();
}); });
o.itemsCreator(op, function (ob) { o.itemsCreator(op, ob => {
hasNext = ob.hasNext; hasNext = ob.hasNext;
(op.times === 1 && !op.node) && self._populate(ob.items); op.times === 1 && !op.node && self._populate(ob.items);
callback(self._formatItems(BI.Tree.transformToTreeFormat(ob.items), op.node ? op.node.layer + 1 : 0, op.node)); callback(
self._formatItems(
Tree.transformToTreeFormat(ob.items),
op.node ? op.node.layer + 1 : 0,
op.node
)
);
self.setValue(self.storeValue); self.setValue(self.storeValue);
(op.times === 1 && !op.node) && BI.nextTick(function () { op.times === 1 &&
!op.node &&
nextTick(() => {
self.loaded(); self.loaded();
}); });
}); });
}, },
el: { el: {
type: "bi.loader", type: Loader.xtype,
isDefaultInit: o.itemsCreator !== BI.emptyFn, isDefaultInit: o.itemsCreator !== emptyFn,
el: { el: {
type: "bi.button_tree", type: ButtonTree.xtype,
chooseType: o.chooseType === BI.Selection.None ? BI.Selection.None : BI.Selection.Default, // 不使用buttontree内部getValue逻辑 chooseType:
o.chooseType === Selection.None
? Selection.None
: Selection.Default, // 不使用buttontree内部getValue逻辑
behaviors: o.behaviors, behaviors: o.behaviors,
layouts: [{ layouts: [
type: "bi.vertical" {
}] type: VerticalLayout.xtype,
}
],
}, },
hasNext: function () { hasNext() {
return hasNext; return hasNext;
} },
} },
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function (type, v) { this.tree.on(Controller.EVENT_CHANGE, function (type, v) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
if (type === BI.Events.CLICK) { if (type === Events.CLICK) {
self.setValue(v); self.setValue(v);
self.fireEvent(BI.MultiLayerSingleLevelTree.EVENT_CHANGE, v); self.fireEvent(MultiLayerSingleLevelTree.EVENT_CHANGE, v);
} }
}); });
BI.createWidget({ createWidget({
type: "bi.adaptive", type: AdaptiveLayout.xtype,
element: this, element: this,
scrollable: o.scrollable, scrollable: o.scrollable,
items: [this.tree] items: [this.tree],
}); });
}, }
_populate: function () { _populate() {
BI.MultiLayerSelectLevelTree.superclass.populate.apply(this, arguments); super.populate(...arguments);
}, }
populate: function (nodes) { populate(nodes) {
this._populate(nodes); this._populate(nodes);
BI.isNull(nodes) ? this.tree.populate() : this.tree.populate(this._formatItems(BI.Tree.transformToTreeFormat(nodes), 0)); isNull(nodes)
}, ? this.tree.populate()
: this.tree.populate(
this._formatItems(Tree.transformToTreeFormat(nodes), 0)
);
}
setValue: function (v) { setValue(v) {
// getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了 // getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了
if (this.options.chooseType === BI.Selection.None) { if (this.options.chooseType === Selection.None) {
} else { } else {
this.storeValue = v; this.storeValue = v;
this.tree.setValue(v); this.tree.setValue(v);
} }
}, }
getValue: function () { getValue() {
return BI.isArray(this.storeValue) ? return isArray(this.storeValue)
this.storeValue : BI.isNull(this.storeValue) ? ? this.storeValue
[] : [this.storeValue]; : isNull(this.storeValue)
}, ? []
: [this.storeValue];
}
getAllLeaves: function () { getAllLeaves() {
return this.tree.getAllLeaves(); return this.tree.getAllLeaves();
}, }
getNodeById: function (id) { getNodeById(id) {
return this.tree.getNodeById(id); return this.tree.getNodeById(id);
}, }
getNodeByValue: function (id) { getNodeByValue(id) {
return this.tree.getNodeByValue(id); return this.tree.getNodeByValue(id);
} }
}); }
BI.MultiLayerSingleLevelTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_single_level_tree", BI.MultiLayerSingleLevelTree);

86
src/widget/multilayersingletree/multilayersingletree.popup.js

@ -1,76 +1,84 @@
/** import {
* Created by GUY on 2016/1/26. shortcut,
* Widget,
* @class BI.MultiLayerSingleTreePopup extend,
* @extends BI.Pane i18nText,
*/ emptyFn,
createWidget,
Controller,
VerticalLayout,
isArray
} from "@/core";
import { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";
BI.MultiLayerSingleTreePopup = BI.inherit(BI.Widget, { @shortcut()
export class MultiLayerSingleTreePopup extends Widget {
static xtype = "bi.multilayer_single_tree_popup";
_defaultConfig: function () { static EVENT_CHANGE = "EVENT_CHANGE";
return BI.extend(BI.MultiLayerSingleTreePopup.superclass._defaultConfig.apply(this, arguments), {
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
baseCls: "bi-multilayer-singletree-popup", baseCls: "bi-multilayer-singletree-popup",
tipText: BI.i18nText("BI-No_Selected_Item"), tipText: i18nText("BI-No_Selected_Item"),
isDefaultInit: false, isDefaultInit: false,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: [], items: [],
onLoaded: BI.emptyFn, onLoaded: emptyFn,
minHeight: 240 minHeight: 240,
}); });
}, }
_init: function () { _init() {
BI.MultiLayerSingleTreePopup.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.multilayer_single_level_tree", type: MultiLayerSingleLevelTree.xtype,
isDefaultInit: o.isDefaultInit, isDefaultInit: o.isDefaultInit,
items: o.items, items: o.items,
itemsCreator: o.itemsCreator, itemsCreator: o.itemsCreator,
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
value: o.value, value: o.value,
scrollable: null, scrollable: null,
onLoaded: function () { onLoaded() {
self.tree.check(); self.tree.check();
o.onLoaded(); o.onLoaded();
} },
}); });
BI.createWidget({ createWidget({
type: "bi.vertical", type: VerticalLayout.xtype,
scrolly: false, scrolly: false,
scrollable: true, scrollable: true,
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.MultiLayerSingleLevelTree.EVENT_CHANGE, function () { this.tree.on(MultiLayerSingleLevelTree.EVENT_CHANGE, () => {
self.fireEvent(BI.MultiLayerSingleTreePopup.EVENT_CHANGE); self.fireEvent(MultiLayerSingleTreePopup.EVENT_CHANGE);
}); });
this.tree.css("min-height", BI.pixFormat(o.minHeight - 10)); this.tree.css("min-height", BI.pixFormat(o.minHeight - 10));
}, }
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) {
this.tree.populate(items); this.tree.populate(items);
} }
}); }
BI.MultiLayerSingleTreePopup.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.multilayer_single_tree_popup", BI.MultiLayerSingleTreePopup);

329
src/widget/multilayersingletree/multilayersingletree.trigger.js

@ -1,237 +1,302 @@
/** import {
* Created by Windy on 2018/2/2. shortcut,
*/ emptyFn,
BI.MultiLayerSingleTreeTrigger = BI.inherit(BI.Trigger, { i18nText,
isNotNull,
isKey,
HorizontalFillLayout,
Tree,
deepClone,
Func,
concat,
isNotEmptyArray,
each,
uniqBy,
map,
isFunction,
find
} from "@/core";
import { Trigger, Searcher } from "@/base";
import { StateEditor, DefaultTextEditor } from "@/case";
import { MultiLayerSingleTreeInsertSearchPane } from "./multilayersingletree.insert.search.pane";
import { MultiLayerSingleTreePopup } from "./multilayersingletree.popup";
props: function () { @shortcut()
export class MultiLayerSingleTreeTrigger extends Trigger {
static xtype = "bi.multilayer_single_tree_trigger";
static EVENT_FOCUS = "EVENT_FOCUS";
static EVENT_BLUR = "EVENT_BLUR";
static EVENT_SEARCHING = "EVENT_SEARCHING";
static EVENT_STOP = "EVENT_STOP";
static EVENT_START = "EVENT_START";
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
props() {
return { return {
extraCls: "bi-multi-layer-single-tree-trigger", extraCls: "bi-multi-layer-single-tree-trigger",
height: 24, height: 24,
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
watermark: BI.i18nText("BI-Basic_Search"), watermark: i18nText("BI-Basic_Search"),
allowSearchValue: false, allowSearchValue: false,
title: BI.bind(this._getShowText, this) title: () => this._getShowText(),
}; };
}, }
render: function () { render() {
var self = this, o = this.options; const self = this,
o = this.options;
if (o.itemsCreator === BI.emptyFn) { if (o.itemsCreator === BI.emptyFn) {
this._initData(); this._initData();
} }
return { return {
type: "bi.horizontal_fill", type: HorizontalFillLayout.xtype,
items: [ items: [
{ {
el: { el: {
type: "bi.searcher", type: Searcher.xtype,
ref: function () { ref() {
self.searcher = this; self.searcher = this;
}, },
masker: BI.isNotNull(o.container) ? { masker: isNotNull(o.container)
offset: {}, ? {
container: o.container offset: {},
} : { container: o.container,
offset: {} }
}, : {
offset: {},
},
isAutoSearch: false, isAutoSearch: false,
el: { el: {
type: "bi.default_text_editor", type: DefaultTextEditor.xtype,
ref: function () { ref() {
self.editor = this; self.editor = this;
}, },
defaultText: o.defaultText, defaultText: o.defaultText,
text: BI.isKey(o.value) ? this._digest(o.value) : o.text, text: isKey(o.value)
? this._digest(o.value)
: o.text,
value: o.value, value: o.value,
height: o.height, height: o.height,
tipText: "", tipText: "",
watermark: o.watermark, watermark: o.watermark,
listeners: [{ listeners: [
eventName: BI.StateEditor.EVENT_FOCUS, {
action: function () { eventName: StateEditor.EVENT_FOCUS,
self.fireEvent(BI.MultiLayerSingleTreeTrigger.EVENT_FOCUS); action() {
} self.fireEvent(
}, { MultiLayerSingleTreeTrigger.EVENT_FOCUS
eventName: BI.StateEditor.EVENT_BLUR, );
action: function () { },
self.fireEvent(BI.MultiLayerSingleTreeTrigger.EVENT_BLUR); },
} {
}, { eventName: StateEditor.EVENT_BLUR,
eventName: BI.StateEditor.EVENT_CHANGE, action() {
action: function () { self.fireEvent(
self.fireEvent(BI.MultiLayerSingleTreeTrigger.EVENT_SEARCHING); MultiLayerSingleTreeTrigger.EVENT_BLUR
);
},
},
{
eventName: StateEditor.EVENT_CHANGE,
action() {
self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_SEARCHING
);
},
} }
}] ],
}, },
popup: { popup: {
type: o.allowInsertValue ? "bi.multilayer_single_tree_insert_search_pane" : "bi.multilayer_single_tree_popup", type: o.allowInsertValue
itemsCreator: o.itemsCreator === BI.emptyFn ? BI.emptyFn : function (op, callback) { ? MultiLayerSingleTreeInsertSearchPane.xtype
op.keyword = self.editor.getValue(); : MultiLayerSingleTreePopup.xtype,
o.itemsCreator(op, callback); itemsCreator:
}, o.itemsCreator === emptyFn
keywordGetter: function () { ? emptyFn
: function (op, callback) {
op.keyword = self.editor.getValue();
o.itemsCreator(op, callback);
},
keywordGetter() {
return self.editor.getValue(); return self.editor.getValue();
}, },
cls: "bi-card", cls: "bi-card",
listeners: [{ listeners: [
eventName: BI.MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM, {
action: function () { eventName:
self.options.text = self.getSearcher().getKeyword(); MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM,
self.fireEvent(BI.MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM); action() {
self.options.text = self
.getSearcher()
.getKeyword();
self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM
);
},
} }
}], ],
ref: function (_ref) { ref(_ref) {
self.popup = _ref; self.popup = _ref;
} },
}, },
onSearch: function (obj, callback) { onSearch(obj, callback) {
var keyword = obj.keyword; const keyword = obj.keyword;
if (o.itemsCreator === BI.emptyFn) { if (o.itemsCreator === BI.emptyFn) {
callback(self._getSearchItems(keyword)); callback(self._getSearchItems(keyword));
o.allowInsertValue && self.popup.setKeyword(keyword); o.allowInsertValue &&
self.popup.setKeyword(keyword);
} else { } else {
callback(); callback();
} }
}, },
listeners: [{ listeners: [
eventName: BI.Searcher.EVENT_CHANGE, {
action: function () { eventName: Searcher.EVENT_CHANGE,
self.fireEvent(BI.MultiLayerSingleTreeTrigger.EVENT_CHANGE); action() {
self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_CHANGE
);
},
} }
}] ],
}, },
width: "fill", width: "fill",
rgap: 24, rgap: 24,
}, }
] ],
}; };
}, }
_initData: function () { _initData() {
var o = this.options; const o = this.options;
this.tree = new BI.Tree(); this.tree = new Tree();
this.nodes = BI.Tree.treeFormat(BI.deepClone(o.items)); this.nodes = Tree.treeFormat(deepClone(o.items));
this.tree.initTree(this.nodes); this.tree.initTree(this.nodes);
}, }
_getSearchItems: function (keyword) { _getSearchItems(keyword) {
var self = this, o = this.options; const self = this,
o = this.options;
// 把数组搜索换成用BI.tree搜索节点, 搜到了就不再往下搜索 // 把数组搜索换成用BI.tree搜索节点, 搜到了就不再往下搜索
var items = []; const items = [];
this.tree.traverse(function (node) { this.tree.traverse(node => {
var find = BI.Func.getSearchResult(self.tree.isRoot(node) ? [] : BI.concat([node.text], (o.allowSearchValue ? [node.value] : [])), keyword); const find = Func.getSearchResult(
self.tree.isRoot(node)
? []
: concat(
[node.text],
o.allowSearchValue ? [node.value] : []
),
keyword
);
if (find.find.length > 0 || find.match.length > 0) { if (find.find.length > 0 || find.match.length > 0) {
items.push(node); items.push(node);
return true; return true;
} }
}); });
return this._fillTreeStructure4Search(items, "id"); return this._fillTreeStructure4Search(items, "id");
}, }
_createJson: function (node, open) { _createJson(node, open) {
return { return {
id: node.id, id: node.id,
pId: node.pId, pId: node.pId,
text: node.text, text: node.text,
value: node.value, value: node.value,
isParent: BI.isNotEmptyArray(node.children), isParent: isNotEmptyArray(node.children),
open: open open,
}; };
}, }
_getChildren: function (node) { _getChildren(node) {
var self = this; const self = this;
node.children = node.children || []; node.children = node.children || [];
var nodes = []; let nodes = [];
BI.each(node.children, function (idx, child) { each(node.children, (idx, child) => {
var children = self._getChildren(child); const children = self._getChildren(child);
nodes = nodes.concat(children); nodes = nodes.concat(children);
}); });
return node.children.concat(nodes); return node.children.concat(nodes);
}, }
// 将搜索到的节点进行补充,构造成一棵完整的树 _fillTreeStructure4Search(leaves) {
_fillTreeStructure4Search: function (leaves) { const self = this;
var self = this; let result = [];
var result = []; const queue = [];
var queue = []; each(leaves, (idx, node) => {
BI.each(leaves, function (idx, node) {
queue.push({ pId: node.pId }); queue.push({ pId: node.pId });
result.push(node); result.push(node);
result = result.concat(self._getChildren(node)); result = result.concat(self._getChildren(node));
}); });
queue.reverse(); queue.reverse();
while (BI.isNotEmptyArray(queue)) { while (isNotEmptyArray(queue)) {
var node = queue.pop(); const node = queue.pop();
var pNode = this.tree.search(this.tree.getRoot(), node.pId, "id"); const pNode = this.tree.search(this.tree.getRoot(), node.pId, "id");
if (pNode != null) { if (pNode != null) {
pNode.open = true; pNode.open = true;
queue.push({ pId: pNode.pId }); queue.push({ pId: pNode.pId });
result.push(pNode); result.push(pNode);
} }
} }
return BI.uniqBy(BI.map(result, function (idx, node) {
return self._createJson(node, node.open);
}), "id");
},
_digest: function (v) { return uniqBy(
var o = this.options; map(result, (idx, node) => self._createJson(node, node.open)),
"id"
);
}
_digest(v) {
const o = this.options;
if (BI.isFunction(o.valueFormatter)) { if (isFunction(o.valueFormatter)) {
return o.valueFormatter(v); return o.valueFormatter(v);
} }
var result = BI.find(o.items, function (i, item) { const result = find(o.items, (i, item) => item.value === v);
return item.value === v;
});
return BI.isNotNull(result) ? result.text : (o.text ?? v); return isNotNull(result) ? result.text : o.text ?? v;
}, }
_getShowText: function () { _getShowText() {
return this.editor.getText(); return this.editor.getText();
}, }
stopEditing: function () { stopEditing() {
this.searcher.stopSearch(); this.searcher.stopSearch();
}, }
getSearcher: function () { getSearcher() {
return this.searcher; return this.searcher;
}, }
populate: function (items) { populate(items) {
this.options.items = items; this.options.items = items;
this._initData(); this._initData();
}, }
setValue: function (v) { setValue(v) {
this.editor.setState(this._digest(v[0])); this.editor.setState(this._digest(v[0]));
}, }
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.MultiLayerSingleTreeTrigger.EVENT_FOCUS = "EVENT_FOCUS";
BI.MultiLayerSingleTreeTrigger.EVENT_BLUR = "EVENT_BLUR";
BI.MultiLayerSingleTreeTrigger.EVENT_SEARCHING = "EVENT_SEARCHING";
BI.MultiLayerSingleTreeTrigger.EVENT_STOP = "EVENT_STOP";
BI.MultiLayerSingleTreeTrigger.EVENT_START = "EVENT_START";
BI.MultiLayerSingleTreeTrigger.EVENT_CHANGE = "EVENT_CHANGE";
BI.MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM = "EVENT_ADD_ITEM";
BI.shortcut("bi.multilayer_single_tree_trigger", BI.MultiLayerSingleTreeTrigger);

91
src/widget/multilayersingletree/node/node.first.plus.js

@ -1,91 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeFirstPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSingleTreeFirstPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSingleTreeFirstPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-single-tree-first-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeFirstPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = this._createNode();
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
doClick: function () {
BI.MultiLayerSingleTreeFirstPlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSingleTreeFirstPlusGroupNode.superclass.setOpened.apply(this, arguments);
if (BI.isNotNull(this.node)) {
this.node.setOpened(v);
}
},
_createNode: function () {
var self = this, o = this.options;
return BI.createWidget({
type: "bi.first_plus_group_node",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
open: o.open,
isLastNode: o.isLastNode,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
listeners: [{
eventName: BI.Controller.EVENT_CHANGE,
action: function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
}
}]
});
}
});
BI.shortcut("bi.multilayer_single_tree_first_plus_group_node", BI.MultiLayerSingleTreeFirstPlusGroupNode);

90
src/widget/multilayersingletree/node/node.last.plus.js

@ -1,90 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeLastPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSingleTreeLastPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSingleTreeLastPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-single-tree-last-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeLastPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = this._createNode();
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
doClick: function () {
BI.MultiLayerSingleTreeLastPlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSingleTreeLastPlusGroupNode.superclass.setOpened.apply(this, arguments);
if (BI.isNotNull(this.node)) {
this.node.setOpened(v);
}
},
_createNode: function () {
var self = this, o = this.options;
return BI.createWidget({
type: "bi.last_plus_group_node",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
listeners: [{
eventName: BI.Controller.EVENT_CHANGE,
action: function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
}
}]
});
}
});
BI.shortcut("bi.multilayer_single_tree_last_plus_group_node", BI.MultiLayerSingleTreeLastPlusGroupNode);

90
src/widget/multilayersingletree/node/node.mid.plus.js

@ -1,90 +0,0 @@
/**
* 加号表示的组节点
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeMidPlusGroupNode
* @extends BI.NodeButton
*/
BI.MultiLayerSingleTreeMidPlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSingleTreeMidPlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-single-tree-mid-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeMidPlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = this._createNode();
var items = [];
items.push({
el: this.node,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, 12),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
doClick: function () {
BI.MultiLayerSingleTreeMidPlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSingleTreeMidPlusGroupNode.superclass.setOpened.apply(this, arguments);
if (BI.isNotNull(this.node)) {
this.node.setOpened(v);
}
},
_createNode: function () {
var self = this, o = this.options;
return BI.createWidget({
type: "bi.mid_plus_group_node",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
open: o.open,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
listeners: [{
eventName: BI.Controller.EVENT_CHANGE,
action: function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
}
}]
});
}
});
BI.shortcut("bi.multilayer_single_tree_mid_plus_group_node", BI.MultiLayerSingleTreeMidPlusGroupNode);

102
src/widget/multilayersingletree/node/node.plus.js

@ -1,102 +0,0 @@
/**
*@desc 根节点,既是第一个又是最后一个
*@author dailer
*@date 2018/09/16
*/
BI.MultiLayerSingleTreePlusGroupNode = BI.inherit(BI.NodeButton, {
_defaultConfig: function () {
var conf = BI.MultiLayerSingleTreePlusGroupNode.superclass._defaultConfig.apply(this, arguments);
return BI.extend(conf, {
extraCls: "bi-multilayer-single-tree-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreePlusGroupNode.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.node = this._createNode();
var needBlankLayers = [];
var pNode = o.pNode;
while (pNode) {
if (pNode.isLastNode) {
needBlankLayers.push(pNode.layer)
}
pNode = pNode.pNode;
}
var items = [];
BI.count(0, o.layer, function (index) {
items.push({
type: "bi.layout",
cls: BI.contains(needBlankLayers, index) ? "" : "base-line-conn-background",
width: 12,
height: o.height
});
});
items.push(this.node);
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, 12),
items: items
});
},
doRedMark: function () {
this.node.doRedMark.apply(this.node, arguments);
},
unRedMark: function () {
this.node.unRedMark.apply(this.node, arguments);
},
doClick: function () {
BI.MultiLayerSingleTreePlusGroupNode.superclass.doClick.apply(this, arguments);
this.node.setSelected(this.isSelected());
},
setOpened: function (v) {
BI.MultiLayerSingleTreePlusGroupNode.superclass.setOpened.apply(this, arguments);
if (BI.isNotNull(this.node)) {
this.node.setOpened(v);
}
},
_createNode: function () {
var self = this, o = this.options;
return BI.createWidget({
type: "bi.plus_group_node",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
open: o.open,
isLastNode: o.isLastNode,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword,
listeners: [{
eventName: BI.Controller.EVENT_CHANGE,
action: function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
}
}]
});
}
});
BI.shortcut("bi.multilayer_single_tree_plus_group_node", BI.MultiLayerSingleTreePlusGroupNode);

86
src/widget/multilayersingletree/treeitem/item.first.treeleaf.js

@ -1,86 +0,0 @@
/**
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeFirstTreeLeafItem
* @extends BI.BasicButton
*/
BI.MultiLayerSingleTreeFirstTreeLeafItem = BI.inherit(BI.BasicButton, {
_defaultConfig: function () {
return BI.extend(BI.MultiLayerSingleTreeFirstTreeLeafItem.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-multilayer-single-tree-first-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false
},
layer: 0,
id: "",
pId: "",
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeFirstTreeLeafItem.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.item = BI.createWidget({
type: "bi.first_tree_leaf_item",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword
});
this.item.on(BI.Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.item,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doHighLight: function () {
this.item.doHighLight.apply(this.item, arguments);
},
unHighLight: function () {
this.item.unHighLight.apply(this.item, arguments);
},
getId: function () {
return this.options.id;
},
getPId: function () {
return this.options.pId;
},
doClick: function () {
BI.MultiLayerSingleTreeFirstTreeLeafItem.superclass.doClick.apply(this, arguments);
this.item.setSelected(this.isSelected());
},
setSelected: function (v) {
BI.MultiLayerSingleTreeFirstTreeLeafItem.superclass.setSelected.apply(this, arguments);
this.item.setSelected(v);
}
});
BI.shortcut("bi.multilayer_single_tree_first_tree_leaf_item", BI.MultiLayerSingleTreeFirstTreeLeafItem);

86
src/widget/multilayersingletree/treeitem/item.last.treeleaf.js

@ -1,86 +0,0 @@
/**
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeLastTreeLeafItem
* @extends BI.BasicButton
*/
BI.MultiLayerSingleTreeLastTreeLeafItem = BI.inherit(BI.BasicButton, {
_defaultConfig: function () {
return BI.extend(BI.MultiLayerSingleTreeLastTreeLeafItem.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-multilayer-single-tree-last-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false
},
layer: 0,
id: "",
pId: "",
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeLastTreeLeafItem.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.item = BI.createWidget({
type: "bi.last_tree_leaf_item",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword
});
this.item.on(BI.Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.item,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doHighLight: function () {
this.item.doHighLight.apply(this.item, arguments);
},
unHighLight: function () {
this.item.unHighLight.apply(this.item, arguments);
},
getId: function () {
return this.options.id;
},
getPId: function () {
return this.options.pId;
},
doClick: function () {
BI.MultiLayerSingleTreeLastTreeLeafItem.superclass.doClick.apply(this, arguments);
this.item.setSelected(this.isSelected());
},
setSelected: function (v) {
BI.MultiLayerSingleTreeLastTreeLeafItem.superclass.setSelected.apply(this, arguments);
this.item.setSelected(v);
}
});
BI.shortcut("bi.multilayer_single_tree_last_tree_leaf_item", BI.MultiLayerSingleTreeLastTreeLeafItem);

86
src/widget/multilayersingletree/treeitem/item.mid.treeleaf.js

@ -1,86 +0,0 @@
/**
*
* Created by GUY on 2016/1/27.
* @class BI.MultiLayerSingleTreeMidTreeLeafItem
* @extends BI.BasicButton
*/
BI.MultiLayerSingleTreeMidTreeLeafItem = BI.inherit(BI.BasicButton, {
_defaultConfig: function () {
return BI.extend(BI.MultiLayerSingleTreeMidTreeLeafItem.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-multilayer-single-tree-mid-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false
},
layer: 0,
id: "",
pId: "",
height: 24
});
},
_init: function () {
BI.MultiLayerSingleTreeMidTreeLeafItem.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.item = BI.createWidget({
type: "bi.mid_tree_leaf_item",
cls: "bi-list-item-none",
logic: {
dynamic: true
},
id: o.id,
pId: o.pId,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
py: o.py,
keyword: o.keyword
});
this.item.on(BI.Controller.EVENT_CHANGE, function (type) {
if (type === BI.Events.CLICK) {// 本身实现click功能
return;
}
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
});
var items = [];
items.push({
el: this.item,
lgap: o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2
});
BI.createWidget({
type: "bi.horizontal_adapt",
element: this,
columnSize: BI.makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items: items
});
},
doHighLight: function () {
this.item.doHighLight.apply(this.item, arguments);
},
unHighLight: function () {
this.item.unHighLight.apply(this.item, arguments);
},
getId: function () {
return this.options.id;
},
getPId: function () {
return this.options.pId;
},
doClick: function () {
BI.MultiLayerSingleTreeMidTreeLeafItem.superclass.doClick.apply(this, arguments);
this.item.setSelected(this.isSelected());
},
setSelected: function (v) {
BI.MultiLayerSingleTreeMidTreeLeafItem.superclass.setSelected.apply(this, arguments);
this.item.setSelected(v);
}
});
BI.shortcut("bi.multilayer_single_tree_mid_tree_leaf_item", BI.MultiLayerSingleTreeMidTreeLeafItem);
Loading…
Cancel
Save