Browse Source

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

es6
Zhenfei.Li 2 years ago
parent
commit
88ebbb75ad
  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. 30
      src/case/button/treeitem/treeitem.js
  7. 5
      src/widget/index.js
  8. 59
      src/widget/multilayerselecttree/__test__/multilayerselecttree.combo.test.js
  9. 2
      src/widget/multilayerselecttree/index.js
  10. 386
      src/widget/multilayerselecttree/multilayerselecttree.combo.js
  11. 133
      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. 322
      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. 70
      src/widget/multilayersingletree/multilayersingletree.combo.js
  21. 39
      src/widget/multilayersingletree/multilayersingletree.insert.search.pane.js
  22. 24
      src/widget/multilayersingletree/multilayersingletree.leveltree.js
  23. 27
      src/widget/multilayersingletree/multilayersingletree.popup.js
  24. 48
      src/widget/multilayersingletree/multilayersingletree.trigger.js
  25. 4
      src/widget/multilayersingletree/node/index.js
  26. 104
      src/widget/multilayersingletree/node/node.first.plus.js
  27. 103
      src/widget/multilayersingletree/node/node.last.plus.js
  28. 103
      src/widget/multilayersingletree/node/node.mid.plus.js
  29. 120
      src/widget/multilayersingletree/node/node.plus.js
  30. 3
      src/widget/multilayersingletree/treeitem/index.js
  31. 87
      src/widget/multilayersingletree/treeitem/item.first.treeleaf.js
  32. 87
      src/widget/multilayersingletree/treeitem/item.last.treeleaf.js
  33. 87
      src/widget/multilayersingletree/treeitem/item.mid.treeleaf.js
  34. 109
      src/widget/selecttree/nodes/node.first.plus.js
  35. 109
      src/widget/selecttree/nodes/node.last.plus.js
  36. 109
      src/widget/selecttree/nodes/node.mid.plus.js
  37. 109
      src/widget/selecttree/nodes/node.plus.js
  38. 2
      src/widget/singletree/singletree.popup.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,
});
}
}

30
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,17 +43,8 @@ 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 = layer === 0 ? null : { const indent = {
el: { el: {
type: Layout.xtype, type: Layout.xtype,
height, height,
@ -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,

5
src/widget/index.js

@ -19,12 +19,14 @@ 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 year from "./year"; import * as year from "./year";
import { YearInterval } from "./yearinterval/yearinterval"; import { YearInterval } from "./yearinterval/yearinterval";
import * as singleselect from "./singleselect"; import * as singleselect from "./singleselect";
import * as multilayerdownlist from "./multilayerdownlist"; import * as multilayerdownlist from "./multilayerdownlist";
import * as multilayersingletree from "./multilayersingletree"; import * as multilayersingletree from "./multilayersingletree";
Object.assign(BI, { Object.assign(BI, {
Collapse, Collapse,
...calendar, ...calendar,
@ -49,6 +51,7 @@ Object.assign(BI, {
YearInterval, YearInterval,
...multiselect, ...multiselect,
...multiselectlist, ...multiselectlist,
...multilayerselectree,
...singleselect, ...singleselect,
...multilayerdownlist, ...multilayerdownlist,
...multilayersingletree, ...multilayersingletree,
@ -68,6 +71,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 * from "./singleselect"; export * from "./singleselect";
export * from "./multilayerdownlist"; export * from "./multilayerdownlist";
export * from "./multilayersingletree"; export * from "./multilayersingletree";

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

@ -4,9 +4,9 @@
* 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" },
@ -17,26 +17,27 @@ describe("multilayer_select_tree", function () {
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();

2
src/widget/multilayerselecttree/index.js

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

386
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(
baseConfig,
{
el: { el: {
type: "bi.single_tree_trigger", type: SingleTreeTrigger.xtype,
ref: function (_ref) { ref(_ref) {
self.textTrigger = _ref; self.textTrigger = _ref;
}, },
text: o.text, text: o.text,
defaultText: o.defaultText, defaultText: o.defaultText,
height: BI.toPix(o.height, 2), height: toPix(o.height, 2),
items: o.items, items: o.items,
value: o.value, value: o.value,
tipType: o.tipType, tipType: o.tipType,
warningTitle: o.warningTitle, warningTitle: o.warningTitle,
valueFormatter: o.valueFormatter, 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,
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,
action() {
self.setValue(this.getValue()); self.setValue(this.getValue());
self.combo.hideView(); self.combo.hideView();
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); self.fireEvent(
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); 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,
action() {
self.setValue(this.getValue()); self.setValue(this.getValue());
self.combo.hideView(); self.combo.hideView();
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); self.fireEvent(
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM, self.combo.getValue()); MultiLayerSelectTreeCombo.EVENT_CHANGE
} );
}, { self.fireEvent(
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_FOCUS, MultiLayerSelectTreeCombo.EVENT_CLICK_ITEM,
action: function () { self.combo.getValue()
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_FOCUS); );
} },
}, { },
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_BLUR, {
action: function () { eventName: MultiLayerSelectTreeTrigger.EVENT_FOCUS,
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_BLUR); action() {
} self.fireEvent(
}, { MultiLayerSelectTreeCombo.EVENT_FOCUS
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_SEARCHING, );
action: function () { },
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_SEARCHING); },
} {
}, { eventName: MultiLayerSelectTreeTrigger.EVENT_BLUR,
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_STOP, action() {
action: function () { self.fireEvent(
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_STOP); MultiLayerSelectTreeCombo.EVENT_BLUR
} );
}, { },
eventName: BI.MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM, },
action: function () { {
var value = self.trigger.getSearcher().getKeyword(); eventName: MultiLayerSelectTreeTrigger.EVENT_SEARCHING,
action() {
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.setValue([value]);
self.combo.hideView(); self.combo.hideView();
self.fireEvent(BI.MultiLayerSelectTreeCombo.EVENT_CHANGE); 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,
action() {
self.trigger.stopEditing(); self.trigger.stopEditing();
},
},
{
eventName: Combo.EVENT_BEFORE_POPUPVIEW,
action() {
self.fireEvent(
MultiLayerSelectTreeCombo.EVENT_BEFORE_POPUPVIEW
);
},
} }
}, { ],
eventName: BI.Combo.EVENT_BEFORE_POPUPVIEW,
action: function () {
self.fireEvent(BI.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);

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

@ -1,31 +1,47 @@
/** 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
? emptyFn
: function (op, callback) {
o.itemsCreator(op, res => {
callback(res); callback(res);
self.setKeyword(o.keywordGetter()); self.setKeyword(o.keywordGetter());
}); });
@ -33,60 +49,71 @@ BI.MultiLayerSelectTreeInsertSearchPane = BI.inherit(BI.Widget, {
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", {
type: TextButton.xtype,
invisible: true, invisible: true,
text: BI.i18nText("BI-Basic_Click_To_Add_Text", ""), text: i18nText("BI-Basic_Click_To_Add_Text", ""),
height: 24, height: 24,
cls: "bi-high-light", cls: "bi-high-light",
hgap: 5, hgap: 5,
ref: function (_ref) { ref(_ref) {
self.addNotMatchTip = _ref; self.addNotMatchTip = _ref;
}, },
handler: function () { handler() {
self.fireEvent(BI.MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM, o.keywordGetter()); self.fireEvent(
} MultiLayerSelectTreeInsertSearchPane.EVENT_ADD_ITEM,
}, this.tree] 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);

322
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: {}, offset: {},
container: o.container
} : {
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,
eventName: BI.StateEditor.EVENT_CHANGE, action() {
action: function () { self.fireEvent(
self.fireEvent(BI.MultiLayerSelectTreeTrigger.EVENT_SEARCHING); MultiLayerSelectTreeTrigger.EVENT_BLUR
);
},
},
{
eventName: StateEditor.EVENT_CHANGE,
action() {
self.fireEvent(
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
: MultiLayerSelectTreePopup.xtype,
itemsCreator:
o.itemsCreator === emptyFn
? emptyFn
: function (op, callback) {
op.keyword = self.editor.getValue(); op.keyword = self.editor.getValue();
o.itemsCreator(op, callback); o.itemsCreator(op, callback);
}, },
keywordGetter: function () { 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()
ref: function (_ref) { .getKeyword();
self.popup = _ref; self.fireEvent(
MultiLayerSelectTreeTrigger.EVENT_ADD_ITEM
);
},
} }
],
ref(_ref) {
self.popup = _ref;
}, },
onSearch: function (obj, callback) { },
var keyword = obj.keyword; onSearch(obj, callback) {
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);
}), "id");
},
_digest: function (v) { return uniqBy(
var o = this.options; map(result, (idx, node) => self._createJson(node, node.open)),
if (BI.isFunction(o.valueFormatter)) { "id"
);
}
_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

@ -3,5 +3,3 @@ export { MultiLayerSingleTreeInsertSearchPane } from "./multilayersingletree.ins
export { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree"; export { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";
export { MultiLayerSingleTreePopup } from "./multilayersingletree.popup"; export { MultiLayerSingleTreePopup } from "./multilayersingletree.popup";
export { MultiLayerSingleTreeTrigger } from "./multilayersingletree.trigger"; export { MultiLayerSingleTreeTrigger } from "./multilayersingletree.trigger";
export * from "./node";
export * from "./treeitem";

70
src/widget/multilayersingletree/multilayersingletree.combo.js

@ -1,4 +1,14 @@
import { shortcut, Widget, extend, emptyFn, isKey, toPix, AbsoluteLayout, nextTick, isArray } from "@/core"; import {
shortcut,
Widget,
extend,
emptyFn,
isKey,
toPix,
AbsoluteLayout,
nextTick,
isArray
} from "@/core";
import { SingleTreeTrigger } from "../singletree/singletree.trigger"; import { SingleTreeTrigger } from "../singletree/singletree.trigger";
import { MultiLayerSingleTreePopup } from "./multilayersingletree.popup"; import { MultiLayerSingleTreePopup } from "./multilayersingletree.popup";
import { Combo } from "@/base"; import { Combo } from "@/base";
@ -37,7 +47,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
o = this.options; o = this.options;
const cls = const cls =
(o.simple ? "bi-border-bottom bi-focus-shadow " : "bi-border bi-border-radius bi-focus-shadow ") + (o.simple
? "bi-border-bottom bi-focus-shadow "
: "bi-border bi-border-radius bi-focus-shadow ") +
(isKey(o.status) ? `status-${o.status}` : ""); (isKey(o.status) ? `status-${o.status}` : "");
const baseConfig = this._getBaseConfig(); const baseConfig = this._getBaseConfig();
@ -104,12 +116,13 @@ export class MultiLayerSingleTreeCombo extends Widget {
}, },
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(_ref) { ref(_ref) {
self.trigger && self.trigger.getSearcher().setAdapter(_ref); self.trigger &&
self.trigger.getSearcher().setAdapter(_ref);
}, },
listeners: [ listeners: [
{ {
@ -117,7 +130,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
action() { action() {
self.setValue(this.getValue()); self.setValue(this.getValue());
self.combo.hideView(); self.combo.hideView();
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_CHANGE); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_CHANGE
);
}, },
} }
], ],
@ -138,7 +153,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
{ {
eventName: Combo.EVENT_BEFORE_POPUPVIEW, eventName: Combo.EVENT_BEFORE_POPUPVIEW,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW
);
}, },
} }
], ],
@ -151,7 +168,7 @@ export class MultiLayerSingleTreeCombo extends Widget {
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,
@ -176,31 +193,41 @@ export class MultiLayerSingleTreeCombo extends Widget {
action() { action() {
self.setValue(this.getValue()); self.setValue(this.getValue());
self.combo.hideView(); self.combo.hideView();
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_CHANGE); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_CHANGE
);
}, },
}, },
{ {
eventName: MultiLayerSingleTreeTrigger.EVENT_FOCUS, eventName: MultiLayerSingleTreeTrigger.EVENT_FOCUS,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_FOCUS); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_FOCUS
);
}, },
}, },
{ {
eventName: MultiLayerSingleTreeTrigger.EVENT_BLUR, eventName: MultiLayerSingleTreeTrigger.EVENT_BLUR,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_BLUR); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_BLUR
);
}, },
}, },
{ {
eventName: MultiLayerSingleTreeTrigger.EVENT_SEARCHING, eventName: MultiLayerSingleTreeTrigger.EVENT_SEARCHING,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_SEARCHING); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_SEARCHING
);
}, },
}, },
{ {
eventName: MultiLayerSingleTreeTrigger.EVENT_STOP, eventName: MultiLayerSingleTreeTrigger.EVENT_STOP,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_STOP); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_STOP
);
}, },
}, },
{ {
@ -209,7 +236,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
const value = self.trigger.getSearcher().getKeyword(); const value = self.trigger.getSearcher().getKeyword();
self.combo.setValue([value]); self.combo.setValue([value]);
self.combo.hideView(); self.combo.hideView();
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_CHANGE); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_CHANGE
);
}, },
} }
], ],
@ -222,7 +251,8 @@ export class MultiLayerSingleTreeCombo extends Widget {
// 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪 // 卡顿不明显, 先在此做尝试, 并在FineUI特殊处理待解决文档中标记跟踪
return o.container && return o.container &&
self.trigger.getSearcher().isSearching() && self.trigger.getSearcher().isSearching() &&
self.trigger.getSearcher().getView().element.find(e.target).length > 0 self.trigger.getSearcher().getView().element.find(e.target)
.length > 0
? false ? false
: self.triggerBtn?.element.find(e.target).length === 0; : self.triggerBtn?.element.find(e.target).length === 0;
}, },
@ -236,7 +266,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
{ {
eventName: Combo.EVENT_BEFORE_POPUPVIEW, eventName: Combo.EVENT_BEFORE_POPUPVIEW,
action() { action() {
self.fireEvent(MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW); self.fireEvent(
MultiLayerSingleTreeCombo.EVENT_BEFORE_POPUPVIEW
);
}, },
} }
], ],
@ -271,7 +303,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
} }
getSearcher() { getSearcher() {
return this.trigger ? this.trigger.getSearcher() : this.textTrigger.getTextor(); return this.trigger
? this.trigger.getSearcher()
: this.textTrigger.getTextor();
} }
setValue(v) { setValue(v) {
@ -292,7 +326,9 @@ export class MultiLayerSingleTreeCombo extends Widget {
} }
setTipType(v) { setTipType(v) {
this.trigger ? this.trigger.setTipType(v) : this.textTrigger.setTipType(v); this.trigger
? this.trigger.setTipType(v)
: this.textTrigger.setTipType(v);
} }
populate(items) { populate(items) {

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

@ -9,8 +9,8 @@ import {
isEmptyArray, isEmptyArray,
isArray isArray
} from "@/core"; } from "@/core";
import { MultiLayerSelectLevelTree } from "../multilayerselecttree/multilayerselecttree.leveltree";
import { TextButton } from "@/base"; import { TextButton } from "@/base";
import { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";
@shortcut() @shortcut()
export class MultiLayerSingleTreeInsertSearchPane extends Widget { export class MultiLayerSingleTreeInsertSearchPane extends Widget {
@ -31,18 +31,19 @@ export class MultiLayerSingleTreeInsertSearchPane extends Widget {
} }
render() { render() {
const o = this.options; const self = this,
o = this.options;
this.tree = 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: itemsCreator:
o.itemsCreator === emptyFn o.itemsCreator === emptyFn
? emptyFn ? emptyFn
: (op, callback) => { : function (op, callback) {
o.itemsCreator(op, res => { o.itemsCreator(op, res => {
callback(res); callback(res);
this.setKeyword(o.keywordGetter()); self.setKeyword(o.keywordGetter());
}); });
}, },
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
@ -51,14 +52,16 @@ export class MultiLayerSingleTreeInsertSearchPane extends Widget {
listeners: [ listeners: [
{ {
eventName: Controller.EVENT_CHANGE, eventName: Controller.EVENT_CHANGE,
action: (...args) => { action() {
this.fireEvent(Controller.EVENT_CHANGE, ...args); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}, },
}, },
{ {
eventName: MultiLayerSelectLevelTree.EVENT_CHANGE, eventName: MultiLayerSingleLevelTree.EVENT_CHANGE,
action: () => { action() {
this.fireEvent(MultiLayerSingleTreeInsertSearchPane.EVENT_CHANGE); self.fireEvent(
MultiLayerSingleTreeInsertSearchPane.EVENT_CHANGE
);
}, },
} }
], ],
@ -77,11 +80,14 @@ export class MultiLayerSingleTreeInsertSearchPane extends Widget {
height: 24, height: 24,
cls: "bi-high-light", cls: "bi-high-light",
hgap: 5, hgap: 5,
ref: _ref => { ref(_ref) {
this.addNotMatchTip = _ref; self.addNotMatchTip = _ref;
}, },
handler: () => { handler() {
this.fireEvent(MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM, o.keywordGetter()); self.fireEvent(
MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM,
o.keywordGetter()
);
}, },
}, },
this.tree this.tree
@ -92,7 +98,10 @@ export class MultiLayerSingleTreeInsertSearchPane extends Widget {
setKeyword(keyword) { setKeyword(keyword) {
const showTip = isEmptyArray(this.tree.getAllLeaves()); const showTip = isEmptyArray(this.tree.getAllLeaves());
this.addNotMatchTip.setVisible(showTip); this.addNotMatchTip.setVisible(showTip);
showTip && this.addNotMatchTip.setText(i18nText("BI-Basic_Click_To_Add_Text", keyword)); showTip &&
this.addNotMatchTip.setText(
i18nText("BI-Basic_Click_To_Add_Text", keyword)
);
} }
getValue() { getValue() {

24
src/widget/multilayersingletree/multilayersingletree.leveltree.js

@ -66,7 +66,11 @@ export class MultiLayerSingleLevelTree extends Pane {
} }
node.keyword = node.keyword || keyword; node.keyword = node.keyword || keyword;
extend.pNode = pNode; extend.pNode = pNode;
if (node.isParent === true || node.parent === true || isNotEmptyArray(node.children)) { if (
node.isParent === true ||
node.parent === true ||
isNotEmptyArray(node.children)
) {
extend.type = BasicTreeNode.xtype; extend.type = BasicTreeNode.xtype;
extend.selectable = false; extend.selectable = false;
defaults(node, extend); defaults(node, extend);
@ -136,7 +140,10 @@ export class MultiLayerSingleLevelTree extends Pane {
isDefaultInit: o.itemsCreator !== emptyFn, isDefaultInit: o.itemsCreator !== emptyFn,
el: { el: {
type: ButtonTree.xtype, type: ButtonTree.xtype,
chooseType: o.chooseType === Selection.None ? Selection.None : Selection.Default, // 不使用buttontree内部getValue逻辑 chooseType:
o.chooseType === Selection.None
? Selection.None
: Selection.Default, // 不使用buttontree内部getValue逻辑
behaviors: o.behaviors, behaviors: o.behaviors,
layouts: [ layouts: [
{ {
@ -173,19 +180,26 @@ export class MultiLayerSingleLevelTree extends Pane {
this._populate(nodes); this._populate(nodes);
isNull(nodes) isNull(nodes)
? this.tree.populate() ? this.tree.populate()
: this.tree.populate(this._formatItems(Tree.transformToTreeFormat(nodes), 0)); : this.tree.populate(
this._formatItems(Tree.transformToTreeFormat(nodes), 0)
);
} }
setValue(v) { setValue(v) {
// getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了 // getValue依赖于storeValue, 那么不选的时候就不要更新storeValue了
if (this.options.chooseType !== Selection.None) { if (this.options.chooseType === Selection.None) {
} else {
this.storeValue = v; this.storeValue = v;
this.tree.setValue(v); this.tree.setValue(v);
} }
} }
getValue() { getValue() {
return isArray(this.storeValue) ? this.storeValue : isNull(this.storeValue) ? [] : [this.storeValue]; return isArray(this.storeValue)
? this.storeValue
: isNull(this.storeValue)
? []
: [this.storeValue];
} }
getAllLeaves() { getAllLeaves() {

27
src/widget/multilayersingletree/multilayersingletree.popup.js

@ -1,4 +1,14 @@
import { shortcut, Widget, extend, i18nText, emptyFn, createWidget, Controller, VerticalLayout, isArray, pixFormat } from "@/core"; import {
shortcut,
Widget,
extend,
i18nText,
emptyFn,
createWidget,
Controller,
VerticalLayout,
isArray
} from "@/core";
import { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree"; import { MultiLayerSingleLevelTree } from "./multilayersingletree.leveltree";
@shortcut() @shortcut()
@ -22,7 +32,8 @@ export class MultiLayerSingleTreePopup extends Widget {
_init() { _init() {
super._init(...arguments); super._init(...arguments);
const o = this.options; const self = this,
o = this.options;
this.tree = createWidget({ this.tree = createWidget({
type: MultiLayerSingleLevelTree.xtype, type: MultiLayerSingleLevelTree.xtype,
@ -32,8 +43,8 @@ export class MultiLayerSingleTreePopup extends Widget {
keywordGetter: o.keywordGetter, keywordGetter: o.keywordGetter,
value: o.value, value: o.value,
scrollable: null, scrollable: null,
onLoaded: () => { onLoaded() {
this.tree.check(); self.tree.check();
o.onLoaded(); o.onLoaded();
}, },
}); });
@ -47,15 +58,15 @@ export class MultiLayerSingleTreePopup extends Widget {
items: [this.tree], items: [this.tree],
}); });
this.tree.on(Controller.EVENT_CHANGE, (...args) => { this.tree.on(Controller.EVENT_CHANGE, function () {
this.fireEvent(Controller.EVENT_CHANGE, ...args); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
this.tree.on(MultiLayerSingleLevelTree.EVENT_CHANGE, () => { this.tree.on(MultiLayerSingleLevelTree.EVENT_CHANGE, () => {
this.fireEvent(MultiLayerSingleTreePopup.EVENT_CHANGE); self.fireEvent(MultiLayerSingleTreePopup.EVENT_CHANGE);
}); });
this.tree.css("min-height", pixFormat(o.minHeight - 10)); this.tree.css("min-height", BI.pixFormat(o.minHeight - 10));
} }
getValue() { getValue() {

48
src/widget/multilayersingletree/multilayersingletree.trigger.js

@ -2,7 +2,6 @@ import {
shortcut, shortcut,
emptyFn, emptyFn,
i18nText, i18nText,
bind,
isNotNull, isNotNull,
isKey, isKey,
HorizontalFillLayout, HorizontalFillLayout,
@ -41,14 +40,14 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
itemsCreator: emptyFn, itemsCreator: emptyFn,
watermark: i18nText("BI-Basic_Search"), watermark: i18nText("BI-Basic_Search"),
allowSearchValue: false, allowSearchValue: false,
title: bind(this._getShowText, this), title: () => this._getShowText(),
}; };
} }
render() { render() {
const self = this, const self = this,
o = this.options; o = this.options;
if (o.itemsCreator === emptyFn) { if (o.itemsCreator === BI.emptyFn) {
this._initData(); this._initData();
} }
@ -76,7 +75,9 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
self.editor = this; self.editor = this;
}, },
defaultText: o.defaultText, defaultText: o.defaultText,
text: 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: "",
@ -85,19 +86,25 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
{ {
eventName: StateEditor.EVENT_FOCUS, eventName: StateEditor.EVENT_FOCUS,
action() { action() {
self.fireEvent(MultiLayerSingleTreeTrigger.EVENT_FOCUS); self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_FOCUS
);
}, },
}, },
{ {
eventName: StateEditor.EVENT_BLUR, eventName: StateEditor.EVENT_BLUR,
action() { action() {
self.fireEvent(MultiLayerSingleTreeTrigger.EVENT_BLUR); self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_BLUR
);
}, },
}, },
{ {
eventName: StateEditor.EVENT_CHANGE, eventName: StateEditor.EVENT_CHANGE,
action() { action() {
self.fireEvent(MultiLayerSingleTreeTrigger.EVENT_SEARCHING); self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_SEARCHING
);
}, },
} }
], ],
@ -119,10 +126,15 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
cls: "bi-card", cls: "bi-card",
listeners: [ listeners: [
{ {
eventName: MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM, eventName:
MultiLayerSingleTreeInsertSearchPane.EVENT_ADD_ITEM,
action() { action() {
self.options.text = self.getSearcher().getKeyword(); self.options.text = self
self.fireEvent(MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM); .getSearcher()
.getKeyword();
self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_ADD_ITEM
);
}, },
} }
], ],
@ -132,9 +144,10 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
}, },
onSearch(obj, callback) { onSearch(obj, callback) {
const keyword = obj.keyword; const keyword = obj.keyword;
if (o.itemsCreator === 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();
} }
@ -143,7 +156,9 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
{ {
eventName: Searcher.EVENT_CHANGE, eventName: Searcher.EVENT_CHANGE,
action() { action() {
self.fireEvent(MultiLayerSingleTreeTrigger.EVENT_CHANGE); self.fireEvent(
MultiLayerSingleTreeTrigger.EVENT_CHANGE
);
}, },
} }
], ],
@ -169,7 +184,12 @@ export class MultiLayerSingleTreeTrigger extends Trigger {
const items = []; const items = [];
this.tree.traverse(node => { this.tree.traverse(node => {
const find = Func.getSearchResult( const find = Func.getSearchResult(
self.tree.isRoot(node) ? [] : concat([node.text], o.allowSearchValue ? [node.value] : []), self.tree.isRoot(node)
? []
: concat(
[node.text],
o.allowSearchValue ? [node.value] : []
),
keyword keyword
); );
if (find.find.length > 0 || find.match.length > 0) { if (find.find.length > 0 || find.match.length > 0) {

4
src/widget/multilayersingletree/node/index.js

@ -1,4 +0,0 @@
export { MultiLayerSingleTreeFirstPlusGroupNode } from "./node.first.plus";
export { MultiLayerSingleTreeLastPlusGroupNode } from "./node.last.plus";
export { MultiLayerSingleTreeMidPlusGroupNode } from "./node.mid.plus";
export { MultiLayerSingleTreePlusGroupNode } from "./node.plus";

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

@ -1,104 +0,0 @@
import {
shortcut,
extend,
createWidget,
makeArray,
HorizontalAdaptLayout,
isNotNull,
Controller,
Events
} from "@/core";
import { NodeButton } from "@/base";
import { FirstPlusGroupNode } from "@/case";
@shortcut()
export class MultiLayerSingleTreeFirstPlusGroupNode extends NodeButton {
static xtype = "bi.multilayer_single_tree_first_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
extraCls: "bi-multilayer-single-tree-first-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const o = this.options;
this.node = this._createNode();
const items = [];
items.push({
el: this.node,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items,
});
}
doRedMark() {
this.node.doRedMark(...arguments);
}
unRedMark() {
this.node.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.node.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.node)) {
this.node.setOpened(v);
}
}
_createNode() {
const o = this.options;
return createWidget({
type: FirstPlusGroupNode.xtype,
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: Controller.EVENT_CHANGE,
action: (...args) => {
const [type] = args;
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
this.fireEvent(Controller.EVENT_CHANGE, ...args);
},
}
],
});
}
}

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

@ -1,103 +0,0 @@
import {
shortcut,
extend,
createWidget,
makeArray,
HorizontalAdaptLayout,
isNotNull,
Controller,
Events
} from "@/core";
import { NodeButton } from "@/base";
import { LastPlusGroupNode } from "@/case";
@shortcut()
export class MultiLayerSingleTreeLastPlusGroupNode extends NodeButton {
static xtype = "bi.multilayer_single_tree_last_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
extraCls: "bi-multilayer-single-tree-last-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const o = this.options;
this.node = this._createNode();
const items = [];
items.push({
el: this.node,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items,
});
}
doRedMark() {
this.node.doRedMark(...arguments);
}
unRedMark() {
this.node.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.node.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.node)) {
this.node.setOpened(v);
}
}
_createNode() {
const o = this.options;
return createWidget({
type: LastPlusGroupNode.xtype,
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: Controller.EVENT_CHANGE,
action: (...args) => {
const [type] = args;
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
this.fireEvent(Controller.EVENT_CHANGE, ...args);
},
}
],
});
}
}

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

@ -1,103 +0,0 @@
import {
shortcut,
extend,
createWidget,
makeArray,
HorizontalAdaptLayout,
isNotNull,
Controller,
Events
} from "@/core";
import { NodeButton } from "@/base";
import { MidPlusGroupNode } from "@/case";
@shortcut()
export class MultiLayerSingleTreeMidPlusGroupNode extends NodeButton {
static xtype = "bi.multilayer_single_tree_mid_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
extraCls: "bi-multilayer-single-tree-mid-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const o = this.options;
this.node = this._createNode();
const items = [];
items.push({
el: this.node,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, 12),
items,
});
}
doRedMark() {
this.node.doRedMark(...arguments);
}
unRedMark() {
this.node.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.node.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.node)) {
this.node.setOpened(v);
}
}
_createNode() {
const o = this.options;
return createWidget({
type: MidPlusGroupNode.xtype,
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: Controller.EVENT_CHANGE,
action: (...args) => {
const [type] = args;
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
this.fireEvent(Controller.EVENT_CHANGE, ...args);
},
}
],
});
}
}

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

@ -1,120 +0,0 @@
import {
shortcut,
extend,
count,
contains,
createWidget,
makeArray,
Layout,
HorizontalAdaptLayout,
isNotNull,
Controller,
Events
} from "@/core";
import { NodeButton } from "@/base";
import { PlusGroupNode } from "@/case";
@shortcut()
export class MultiLayerSingleTreePlusGroupNode extends NodeButton {
static xtype = "bi.multilayer_single_tree_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
extraCls: "bi-multilayer-single-tree-plus-group-node bi-list-item",
layer: 0, // 第几层级
id: "",
pId: "",
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const o = this.options;
this.node = this._createNode();
const needBlankLayers = [];
let pNode = o.pNode;
while (pNode) {
if (pNode.isLastNode) {
needBlankLayers.push(pNode.layer);
}
pNode = pNode.pNode;
}
const items = [];
count(0, o.layer, index => {
items.push({
type: Layout.xtype,
cls: contains(needBlankLayers, index) ? "" : "base-line-conn-background",
width: 12,
height: o.height,
});
});
items.push(this.node);
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, 12),
items,
});
}
doRedMark() {
this.node.doRedMark(...arguments);
}
unRedMark() {
this.node.unRedMark(...arguments);
}
doClick() {
super.doClick(...arguments);
this.node.setSelected(this.isSelected());
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.node)) {
this.node.setOpened(v);
}
}
_createNode() {
const o = this.options;
return createWidget({
type: PlusGroupNode.xtype,
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: Controller.EVENT_CHANGE,
action: (...args) => {
const [type] = args;
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
this.fireEvent(Controller.EVENT_CHANGE, ...args);
},
}
],
});
}
}

3
src/widget/multilayersingletree/treeitem/index.js

@ -1,3 +0,0 @@
export { MultiLayerSingleTreeFirstTreeLeafItem } from "./item.first.treeleaf";
export { MultiLayerSingleTreeLastTreeLeafItem } from "./item.last.treeleaf";
export { MultiLayerSingleTreeMidTreeLeafItem } from "./item.mid.treeleaf";

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

@ -1,87 +0,0 @@
import { shortcut, extend, createWidget, Controller, Events, makeArray, HorizontalAdaptLayout } from "@/core";
import { BasicButton } from "@/base";
@shortcut()
export class MultiLayerSingleTreeFirstTreeLeafItem extends BasicButton {
static xtype = "bi.multilayer_single_tree_first_tree_leaf_item";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-multilayer-single-tree-first-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false,
},
layer: 0,
id: "",
pId: "",
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.item = 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(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
const items = [];
items.push({
el: this.item,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items,
});
}
doHighLight() {
this.item.doHighLight(...arguments);
}
unHighLight() {
this.item.unHighLight(...arguments);
}
getId() {
return this.options.id;
}
getPId() {
return this.options.pId;
}
doClick() {
super.doClick(...arguments);
this.item.setSelected(this.isSelected());
}
setSelected(v) {
super.setSelected(...arguments);
this.item.setSelected(v);
}
}

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

@ -1,87 +0,0 @@
import { shortcut, extend, createWidget, Controller, Events, makeArray, HorizontalAdaptLayout } from "@/core";
import { BasicButton } from "@/base";
@shortcut()
export class MultiLayerSingleTreeLastTreeLeafItem extends BasicButton {
static xtype = "bi.multilayer_single_tree_last_tree_leaf_item";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-multilayer-single-tree-last-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false,
},
layer: 0,
id: "",
pId: "",
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.item = 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(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
const items = [];
items.push({
el: this.item,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items,
});
}
doHighLight() {
this.item.doHighLight(...arguments);
}
unHighLight() {
this.item.unHighLight(...arguments);
}
getId() {
return this.options.id;
}
getPId() {
return this.options.pId;
}
doClick() {
super.doClick(...arguments);
this.item.setSelected(this.isSelected());
}
setSelected(v) {
super.setSelected(...arguments);
this.item.setSelected(v);
}
}

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

@ -1,87 +0,0 @@
import { shortcut, extend, createWidget, Controller, Events, makeArray, HorizontalAdaptLayout } from "@/core";
import { BasicButton } from "@/base";
@shortcut()
export class MultiLayerSingleTreeMidTreeLeafItem extends BasicButton {
static xtype = "bi.multilayer_single_tree_mid_tree_leaf_item";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-multilayer-single-tree-mid-tree-leaf-item bi-list-item-active",
logic: {
dynamic: false,
},
layer: 0,
id: "",
pId: "",
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.item = 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(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
// 本身实现click功能
return;
}
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
const items = [];
items.push({
el: this.item,
lgap: (o.layer * BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT) / 2,
});
createWidget({
type: HorizontalAdaptLayout.xtype,
element: this,
columnSize: makeArray(o.layer, BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2),
items,
});
}
doHighLight() {
this.item.doHighLight(...arguments);
}
unHighLight() {
this.item.unHighLight(...arguments);
}
getId() {
return this.options.id;
}
getPId() {
return this.options.pId;
}
doClick() {
super.doClick(...arguments);
this.item.setSelected(this.isSelected());
}
setSelected(v) {
super.setSelected(...arguments);
this.item.setSelected(v);
}
}

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

@ -1,109 +0,0 @@
import {
shortcut,
extend,
createWidget,
Controller,
Events,
isNotNull, LogicFactory, Direction
} from "@/core";
import { NodeButton, Label } from "@/base";
import { FirstTreeNodeCheckbox } from "@/case";
@shortcut()
export class SelectTreeFirstPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_first_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-first-plus-group-node bi-list-item-active`,
logic: {
dynamic: false,
},
id: "",
pId: "",
readonly: true,
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.checkbox = createWidget({
type: FirstTreeNodeCheckbox.xtype,
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.height,
});
this.text = createWidget({
type: Label.xtype,
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
keyword: o.keyword,
py: o.py,
});
this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
if (this.isSelected()) {
self.triggerExpand();
} else {
self.triggerCollapse();
}
}
});
const type = LogicFactory.createLogicTypeByDirection(
Direction.Left
);
const items = LogicFactory.createLogicItemsByDirection(
Direction.Left,
{
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
el: this.checkbox,
},
this.text
);
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce() {
return true;
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

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

@ -1,109 +0,0 @@
import {
shortcut,
extend,
createWidget,
Controller,
Events,
isNotNull, LogicFactory, Direction
} from "@/core";
import { NodeButton, Label } from "@/base";
import { LastTreeNodeCheckbox } from "@/case";
@shortcut()
export class SelectTreeLastPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_last_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-last-plus-group-node bi-list-item-active`,
logic: {
dynamic: false,
},
id: "",
pId: "",
readonly: true,
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.checkbox = createWidget({
type: LastTreeNodeCheckbox.xtype,
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.height,
});
this.text = createWidget({
type: Label.xtype,
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
keyword: o.keyword,
py: o.py,
});
this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
if (this.isSelected()) {
self.triggerExpand();
} else {
self.triggerCollapse();
}
}
});
const type = LogicFactory.createLogicTypeByDirection(
Direction.Left
);
const items = LogicFactory.createLogicItemsByDirection(
Direction.Left,
{
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
el: this.checkbox,
},
this.text
);
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce() {
return true;
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

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

@ -1,109 +0,0 @@
import {
shortcut,
extend,
createWidget,
Controller,
Events,
isNotNull, Direction, LogicFactory
} from "@/core";
import { NodeButton, Label } from "@/base";
import { MidTreeNodeCheckbox } from "@/case";
@shortcut()
export class SelectTreeMidPlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_mid_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-mid-plus-group-node bi-list-item-active`,
logic: {
dynamic: false,
},
id: "",
pId: "",
readonly: true,
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.checkbox = createWidget({
type: MidTreeNodeCheckbox.xtype,
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.height,
});
this.text = createWidget({
type: Label.xtype,
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
keyword: o.keyword,
py: o.py,
});
this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
if (this.isSelected()) {
self.triggerExpand();
} else {
self.triggerCollapse();
}
}
});
const type = LogicFactory.createLogicTypeByDirection(
Direction.Left
);
const items = LogicFactory.createLogicItemsByDirection(
Direction.Left,
{
width: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
el: this.checkbox,
},
this.text
);
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce() {
return true;
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

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

@ -1,109 +0,0 @@
import {
shortcut,
extend,
createWidget,
Controller,
Events,
isNotNull, LogicFactory
} from "@/core";
import { NodeButton, Label } from "@/base";
import { TreeNodeCheckbox } from "@/case";
@shortcut()
export class SelectTreePlusGroupNode extends NodeButton {
static xtype = "bi.select_tree_plus_group_node";
_defaultConfig() {
const conf = super._defaultConfig(...arguments);
return extend(conf, {
baseCls:
`${conf.baseCls || ""
} bi-select-tree-plus-group-node bi-list-item-active`,
logic: {
dynamic: false,
},
id: "",
pId: "",
readonly: true,
open: false,
height: 24,
});
}
_init() {
super._init(...arguments);
const self = this,
o = this.options;
this.checkbox = createWidget({
type: TreeNodeCheckbox.xtype,
stopPropagation: true,
iconHeight: o.height,
iconWidth: o.iconWrapperWidth || o.height,
});
this.text = createWidget({
type: Label.xtype,
textAlign: "left",
whiteSpace: "nowrap",
textHeight: o.height,
height: o.height,
hgap: o.hgap,
text: o.text,
value: o.value,
keyword: o.keyword,
py: o.py,
});
this.checkbox.on(Controller.EVENT_CHANGE, function (type) {
if (type === Events.CLICK) {
if (this.isSelected()) {
self.triggerExpand();
} else {
self.triggerCollapse();
}
}
});
const type = LogicFactory.createLogicTypeByDirection(
BI.Direction.Left
);
const items = LogicFactory.createLogicItemsByDirection(
BI.Direction.Left,
{
width: 24,
el: this.checkbox,
},
this.text
);
createWidget(
extend(
{
element: this,
},
LogicFactory.createLogic(
type,
extend(o.logic, {
items,
})
)
)
);
}
isOnce() {
return true;
}
doRedMark() {
this.text.doRedMark(...arguments);
}
unRedMark() {
this.text.unRedMark(...arguments);
}
setOpened(v) {
super.setOpened(...arguments);
if (isNotNull(this.checkbox)) {
this.checkbox.setSelected(v);
}
}
}

2
src/widget/singletree/singletree.popup.js

@ -31,7 +31,7 @@ export class SingleTreePopup extends Pane {
o = this.options; o = this.options;
this.tree = createWidget({ this.tree = createWidget({
type: "bi.level_tree", type: LevelTree.xtype,
expander: { expander: {
isDefaultInit: true, isDefaultInit: true,
}, },

Loading…
Cancel
Save