Browse Source

KERNEL-14066 feat: case/tree和case/ztree

es6
zsmj 2 years ago
parent
commit
752f147579
  1. 6
      src/case/index.js
  2. 3
      src/case/tree/index.js
  3. 131
      src/case/tree/tree.level.js
  4. 64
      src/case/tree/treeexpander/tree.expander.js
  5. 63
      src/case/tree/treeexpander/tree.expander.popup.js
  6. 226
      src/case/ztree/asynctree.js
  7. 14
      src/case/ztree/index.js
  8. 1
      src/case/ztree/jquery.ztree.core-3.5.js
  9. 51
      src/case/ztree/jquery.ztree.excheck-3.5.js
  10. 118
      src/case/ztree/list/0.listtreeview.js
  11. 123
      src/case/ztree/list/1.listasynctree.js
  12. 122
      src/case/ztree/list/listasynctree.js
  13. 74
      src/case/ztree/list/listparttree.js
  14. 121
      src/case/ztree/list/listtreeview.js
  15. 173
      src/case/ztree/parttree.js
  16. 65
      src/case/ztree/tree.display.js
  17. 82
      src/case/ztree/tree.list.display.js
  18. 132
      src/case/ztree/tree.simple.js
  19. 72
      src/case/ztree/treerender.page.service.js
  20. 95
      src/case/ztree/treerender.scroll.service.js
  21. 76
      src/case/ztree/treetrender.page.service.js
  22. 434
      src/case/ztree/treeview.js
  23. 29
      src/core/platform/web/jquery/jquery.mousewheel.js

6
src/case/index.js

@ -2,16 +2,22 @@ import * as button from "./button";
import * as calendarItem from "./calendar"; import * as calendarItem from "./calendar";
import * as pager from "./pager"; import * as pager from "./pager";
import * as editor from "./editor"; import * as editor from "./editor";
import * as tree from "./tree";
import * as ztree from "./ztree";
Object.assign(BI, { Object.assign(BI, {
...button, ...button,
...calendarItem, ...calendarItem,
...pager, ...pager,
...editor, ...editor,
...ztree,
...tree,
}); });
export * from "./button"; export * from "./button";
export * from "./calendar"; export * from "./calendar";
export * from "./pager"; export * from "./pager";
export * from "./editor"; export * from "./editor";
export * from "./tree";
export * from "./ztree";

3
src/case/tree/index.js

@ -0,0 +1,3 @@
export * from "./tree.level";
export * from "./treeexpander/tree.expander";
export * from "./treeexpander/tree.expander.popup";

131
src/case/tree/tree.level.js

@ -1,130 +1,127 @@
/** import { shortcut, Widget, extend, isKey, each, UUID, defaults, isNotEmptyArray, Tree, createWidget } from "@/core";
* guy
* 二级树 @shortcut()
* @class BI.LevelTree export class LevelTree extends Widget {
* @extends BI.Single static xtype = "bi.level_tree";
*/
BI.LevelTree = BI.inherit(BI.Widget, { static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig: function () {
return BI.extend(BI.LevelTree.superclass._defaultConfig.apply(this, arguments), { props = {
baseCls: "bi-level-tree", baseCls: "bi-level-tree",
el: { el: {
chooseType: 0 chooseType: 0,
}, },
expander: {}, expander: {},
items: [], items: [],
value: "" value: "",
}); };
},
_init: function () { _init() {
BI.LevelTree.superclass._init.apply(this, arguments); super._init(...arguments);
this.initTree(this.options.items); this.initTree(this.options.items);
}, }
_formatItems: function (nodes, layer, pNode) { _formatItems(nodes, layer, pNode) {
var self = this; const self = this;
BI.each(nodes, function (i, node) { each(nodes, (i, node) => {
var extend = { const extend = {
layer: layer, layer,
height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT, height: BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT,
isFirstNode: i === 0, isFirstNode: i === 0,
isLastNode: i === nodes.length - 1, isLastNode: i === nodes.length - 1,
}; };
if (!BI.isKey(node.id)) { if (!isKey(node.id)) {
node.id = BI.UUID(); node.id = UUID();
} }
extend.pNode = pNode; extend.pNode = pNode;
if (node.isParent === true || node.parent === true || BI.isNotEmptyArray(node.children)) { if (node.isParent === true || node.parent === true || isNotEmptyArray(node.children)) {
extend.type = "bi.tree_node"; extend.type = "bi.tree_node";
extend.selectable = false; extend.selectable = false;
BI.defaults(node, extend); defaults(node, extend);
self._formatItems(node.children, layer + 1, node); self._formatItems(node.children, layer + 1, node);
} else { } else {
extend.type = "bi.tree_item"; extend.type = "bi.tree_item";
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) => {
if (!BI.isKey(node.id)) { if (!isKey(node.id)) {
node.id = BI.UUID(); node.id = UUID();
} }
}); });
}, }
// 构造树结构, initTree(nodes) {
initTree: function (nodes) { const self = this, o = this.options;
var self = this, o = this.options;
this.empty(); this.empty();
this._assertId(nodes); this._assertId(nodes);
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.custom_tree", type: "bi.custom_tree",
element: this, element: this,
expander: BI.extend({ expander: extend({
type: "bi.tree_expander", type: "bi.tree_expander",
el: {}, el: {},
isDefaultInit: false, isDefaultInit: false,
selectable: false, selectable: false,
popup: { popup: {
type: "bi.custom_tree" type: "bi.custom_tree",
} },
}, o.expander), }, o.expander),
items: this._formatItems(BI.Tree.transformToTreeFormat(nodes), 0), items: this._formatItems(Tree.transformToTreeFormat(nodes), 0),
value: o.value, value: o.value,
el: BI.extend({ el: extend({
type: "bi.button_tree", type: "bi.button_tree",
chooseType: 0, chooseType: 0,
layouts: [{ layouts: [
type: "bi.vertical" {
}] type: "bi.vertical",
}, o.el) }
],
}, o.el),
}); });
this.tree.on(BI.Controller.EVENT_CHANGE, function (type, value, ob) { this.tree.on(BI.Controller.EVENT_CHANGE, function (type, value, ob) {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
if (type === BI.Events.CLICK) { if (type === BI.Events.CLICK) {
self.fireEvent(BI.LevelTree.EVENT_CHANGE, value, ob); self.fireEvent(LevelTree.EVENT_CHANGE, value, ob);
self.setValue(value); self.setValue(value);
} }
}); });
}, }
// 生成树方法 stroke(nodes) {
stroke: function (nodes) { this.tree.stroke(nodes);
this.tree.stroke.apply(this.tree, arguments); }
},
populate: function (items, keyword) { populate(items, keyword) {
items = this._formatItems(BI.Tree.transformToTreeFormat(items), 0); items = this._formatItems(Tree.transformToTreeFormat(items), 0);
this.tree.populate(items, keyword); this.tree.populate(items, keyword);
}, }
setValue: function (v) { setValue(v) {
this.tree.setValue(v); this.tree.setValue(v);
}, }
getValue: function () { getValue() {
return this.tree.getValue(); return this.tree.getValue();
}, }
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.LevelTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.level_tree", BI.LevelTree);

64
src/case/tree/treeexpander/tree.expander.js

@ -1,29 +1,32 @@
!(function () { import { contains, Controller, createWidget, isArray, shortcut, Widget } from "@/core";
var Widget = BI.inherit(BI.Widget, {
props: { @shortcut()
export class TreeExpander extends Widget {
static xtype = "bi.tree_expander";
props = {
baseCls: "bi-tree-expander", baseCls: "bi-tree-expander",
layer: 0, // 第几层级 layer: 0, // 第几层级
isLastNode: false, // 是不是最后一个 isLastNode: false, // 是不是最后一个
isFirstNode: false, // 是不是第一个 isFirstNode: false, // 是不是第一个
selectable: false, selectable: false,
showLine: true, showLine: true,
}, };
render: function () {
var self = this; render() {
var o = this.options; const self = this;
const o = this.options;
this.trigger = BI.createWidget(o.el, { this.trigger = createWidget(o.el, {
forceNotSelected: !o.selectable, forceNotSelected: !o.selectable,
}); });
this.trigger.on(BI.Controller.EVENT_CHANGE, function (type) { this.trigger.on(Controller.EVENT_CHANGE, function (type) {
o.selectable && self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); o.selectable && self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
return { return {
type: "bi.expander", type: "bi.expander",
ref: function (_ref) { ref(_ref) {
self.expander = _ref; self.expander = _ref;
}, },
trigger: o.selectable ? "" : "click", trigger: o.selectable ? "" : "click",
@ -40,41 +43,40 @@
value: o.value, value: o.value,
listeners: [ listeners: [
{ {
eventName: BI.Controller.EVENT_CHANGE, eventName: Controller.EVENT_CHANGE,
action: function (type) { action: (...args) => {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); this.fireEvent(Controller.EVENT_CHANGE, ...args);
},
}, },
}
], ],
}; };
}, }
setValue: function (v) { setValue(v) {
if (BI.contains(v, this.trigger.getValue())) { if (contains(v, this.trigger.getValue())) {
this.trigger.setSelected(true); this.trigger.setSelected(true);
this.expander.setValue([]); this.expander.setValue([]);
} else { } else {
this.trigger.setSelected(false); this.trigger.setSelected(false);
this.expander.setValue(v); this.expander.setValue(v);
} }
}, }
getValue: function () { getValue() {
if (this.trigger.isSelected()) { if (this.trigger.isSelected()) {
var value = this.trigger.getValue(); const value = this.trigger.getValue();
return BI.isArray(value) ? value : [value];
return isArray(value) ? value : [value];
} }
return this.expander.getValue(); return this.expander.getValue();
}, }
populate: function (items) { populate(items) {
this.expander.populate(items); this.expander.populate(items);
}, }
getAllLeaves: function () { getAllLeaves() {
return this.expander && this.expander.getAllLeaves(); return this.expander && this.expander.getAllLeaves();
} }
}); }
BI.shortcut("bi.tree_expander", Widget);
}());

63
src/case/tree/treeexpander/tree.expander.popup.js

@ -1,6 +1,10 @@
!(function () { import { Controller, createWidget, pixFormat, shortcut, Widget } from "@/core";
var Widget = BI.inherit(BI.Widget, {
props: function () { @shortcut()
export class TreeExpanderPopup extends Widget {
static xtype = "bi.tree_expander.popup";
props() {
return { return {
baseCls: "bi-tree-expander-popup", baseCls: "bi-tree-expander-popup",
layer: 0, // 第几层级 layer: 0, // 第几层级
@ -8,53 +12,50 @@
isLastNode: false, isLastNode: false,
showLine: true, showLine: true,
}; };
}, }
render: function () {
var self = this; render() {
var o = this.options; const self = this;
var offset = BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2; const { el, value, layer, showLine, isLastNode } = this.options;
const offset = BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2;
this.popupView = BI.createWidget(BI.extend(o.el, { this.popupView = createWidget({
value: o.value ...el,
}), this); value,
}, this);
this.popupView.on(BI.Controller.EVENT_CHANGE, function () { this.popupView.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments); self.fireEvent(Controller.EVENT_CHANGE, arguments);
}); });
if (o.showLine) { if (showLine) {
this.popupView.element.css("margin-left", BI.pixFormat(-offset * (o.layer + 1))); this.popupView.element.css("margin-left", pixFormat(-offset * (layer + 1)));
this.element.css("margin-left", BI.pixFormat(offset * (o.layer + 1))); this.element.css("margin-left", pixFormat(offset * (layer + 1)));
} }
return { return {
type: "bi.vertical", type: "bi.vertical",
cls: (o.showLine && !o.isLastNode) ? (BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? "line solid" : "line") : "", cls: (showLine && !isLastNode) ? (BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? "line solid" : "line") : "",
scrolly: null, scrolly: null,
items: [ items: [
this.popupView, this.popupView
], ],
}; };
}, }
setValue: function (v) { setValue(v) {
this.popupView.setValue(v); this.popupView.setValue(v);
}, }
getValue: function () { getValue() {
return this.popupView.getValue(); return this.popupView.getValue();
}, }
populate: function (items) { populate(items) {
this.popupView.populate(items); this.popupView.populate(items);
}, }
getAllLeaves: function () { getAllLeaves() {
return this.popupView && this.popupView.getAllLeaves(); return this.popupView && this.popupView.getAllLeaves();
} }
}); }
BI.shortcut("bi.tree_expander.popup", Widget);
}());

226
src/case/ztree/1.asynctree.js → src/case/ztree/asynctree.js

@ -1,77 +1,43 @@
/** import { cjkEncodeDO, deepClone, each, extend, isEmpty, isNotNull, isNull, shortcut } from "@/core";
* guy import { TreeView } from "./treeview";
* 异步树 import { TreeRenderPageService } from "./treerender.page.service";
* @class BI.AsyncTree
* @extends BI.TreeView @shortcut()
*/ export class Asynctree extends TreeView {
BI.AsyncTree = BI.inherit(BI.TreeView, { static xtype = "bi.async_tree";
_defaultConfig: function () {
return BI.extend(BI.AsyncTree.superclass._defaultConfig.apply(this, arguments), { _defaultConfig() {
return extend(super._defaultConfig(...arguments), {
showIcon: false, showIcon: false,
showLine: true, showLine: true,
}); });
},
_init: function () {
BI.AsyncTree.superclass._init.apply(this, arguments);
var self = this;
this.service = new BI.TreeRenderPageService({
subNodeListGetter: function (tId) {
// 获取待检测的子节点列表, ztree并没有获取节点列表dom的API, 此处使用BI.$获取
return BI.$("#" + self.id + " #" + tId + "_ul");
} }
});
},
// 配置属性 _init() {
_configSetting: function () { super._init(...arguments);
var o = this.options; const self = this;
var paras = this.options.paras; this.service = new TreeRenderPageService({
var self = this; subNodeListGetter(tId) {
var setting = { // 获取待检测的子节点列表, ztree并没有获取节点列表dom的API, 此处使用BI.$获取
async: { return BI.$(`#${self.id} #${tId}_ul`);
enable: false, // 很明显这棵树把异步请求关掉了,所有的异步请求都是手动控制的
otherParam: BI.cjkEncodeDO(paras)
},
check: {
enable: true
},
data: {
key: {
title: "title",
name: "text"
},
simpleData: {
enable: true
}
},
view: {
showIcon: o.showIcon,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false,
showLine: o.showLine,
nodeClasses: function (treeId, treeNode) {
return { add: [treeNode.iconCls || ""] };
}
}, },
callback: { });
beforeCheck: beforeCheck,
onCheck: onCheck,
beforeExpand: beforeExpand,
onExpand: onExpand,
onCollapse: onCollapse,
onClick: onClick,
} }
};
// 配置属性
_configSetting() {
const o = this.options;
const paras = this.options.paras;
const self = this;
function onClick(event, treeId, treeNode) { function onClick(event, treeId, treeNode) {
if (treeNode.disabled) { if (treeNode.disabled) {
return false; return false;
} }
var zTree = BI.$.fn.zTree.getZTreeObj(treeId); const zTree = BI.$.fn.zTree.getZTreeObj(treeId);
// 当前点击节点的状态是半选,且为true_part, 则将其改为false_part,使得点击半选后切换到的是全选 // 当前点击节点的状态是半选,且为true_part, 则将其改为false_part,使得点击半选后切换到的是全选
var checked = treeNode.checked; let checked = treeNode.checked;
var status = treeNode.getCheckStatus(); const status = treeNode.getCheckStatus();
if (status.half === true && status.checked === true) { if (status.half === true && status.checked === true) {
checked = false; checked = false;
} }
@ -83,13 +49,13 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
return false; return false;
} }
// 下面主动修改了node的halfCheck属性, 节点属性的判断依赖halfCheck,改之前就获取一下 // 下面主动修改了node的halfCheck属性, 节点属性的判断依赖halfCheck,改之前就获取一下
var status = treeNode.getCheckStatus(); const status = treeNode.getCheckStatus();
treeNode.halfCheck = false; treeNode.halfCheck = false;
if (treeNode.checked === true) { if (treeNode.checked === true) {
// 将展开的节点halfCheck设为false,解决展开节点存在halfCheck=true的情况 guy // 将展开的节点halfCheck设为false,解决展开节点存在halfCheck=true的情况 guy
// 所有的半选状态都需要取消halfCheck=true的情况 // 所有的半选状态都需要取消halfCheck=true的情况
function track(children) { function track(children) {
BI.each(children, function (i, ch) { each(children, (i, ch) => {
ch.halfCheck = false; ch.halfCheck = false;
track(ch.children); track(ch.children);
}); });
@ -97,9 +63,9 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
track(treeNode.children); track(treeNode.children);
var treeObj = BI.$.fn.zTree.getZTreeObj(treeId); const treeObj = BI.$.fn.zTree.getZTreeObj(treeId);
var nodes = treeObj.getSelectedNodes(); const nodes = treeObj.getSelectedNodes();
BI.each(nodes, function (index, node) { each(nodes, (index, node) => {
node.halfCheck = false; node.halfCheck = false;
}); });
} }
@ -128,24 +94,59 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
treeNode.halfCheck = false; treeNode.halfCheck = false;
} }
return setting; return {
async: {
enable: false, // 很明显这棵树把异步请求关掉了,所有的异步请求都是手动控制的
otherParam: cjkEncodeDO(paras),
},
check: {
enable: true,
}, },
data: {
key: {
title: "title",
name: "text",
},
simpleData: {
enable: true,
},
},
view: {
showIcon: o.showIcon,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false,
showLine: o.showLine,
nodeClasses(treeId, treeNode) {
return { add: [treeNode.iconCls || ""] };
},
},
callback: {
beforeCheck,
onCheck,
beforeExpand,
onExpand,
onCollapse,
onClick,
},
};
}
// 用来更新this.options.paras.selectedValues, 和ztree内部无关 // 用来更新this.options.paras.selectedValues, 和ztree内部无关
_selectTreeNode: function (treeId, treeNode) { _selectTreeNode(treeId, treeNode) {
var self = this, o = this.options; const self = this;
var parentValues = BI.deepClone(treeNode.parentValues || self._getParentValues(treeNode)); let parentValues = deepClone(treeNode.parentValues || self._getParentValues(treeNode));
var name = this._getNodeValue(treeNode); let name = this._getNodeValue(treeNode);
// var values = parentValues.concat([name]); // var values = parentValues.concat([name]);
if (treeNode.checked === true) { if (treeNode.checked === true) {
this._addTreeNode(this.options.paras.selectedValues, parentValues, name, {}); this._addTreeNode(this.options.paras.selectedValues, parentValues, name, {});
} else { } else {
var tNode = treeNode; let tNode = treeNode;
var pNode = this._getTree(this.options.paras.selectedValues, parentValues); let pNode = this._getTree(this.options.paras.selectedValues, parentValues);
if (BI.isNotNull(pNode[name])) { if (isNotNull(pNode[name])) {
delete pNode[name]; delete pNode[name];
} }
while (tNode != null && BI.isEmpty(pNode)) { while (tNode != null && isEmpty(pNode)) {
parentValues = parentValues.slice(0, parentValues.length - 1); parentValues = parentValues.slice(0, parentValues.length - 1);
tNode = tNode.getParentNode(); tNode = tNode.getParentNode();
if (tNode != null) { if (tNode != null) {
@ -156,14 +157,15 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
} }
this.options.paras.selectedValues = this._getJoinValue(); this.options.paras.selectedValues = this._getJoinValue();
} }
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments); super._selectTreeNode(...arguments);
}, }
// 展开节点 // 展开节点
_beforeExpandNode: function (treeId, treeNode) { _beforeExpandNode(treeId, treeNode) {
var self = this, o = this.options; const self = this, o = this.options;
var complete = function (d) {
var nodes = d.items || []; function complete(d) {
const nodes = d.items || [];
if (nodes.length > 0) { if (nodes.length > 0) {
callback(self._dealWidthNodes(nodes), !!d.hasNext); callback(self._dealWidthNodes(nodes), !!d.hasNext);
} }
@ -176,49 +178,48 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
} else { } else {
self.service.removeNodeList(treeNode.tId); self.service.removeNodeList(treeNode.tId);
} }
} }
function getNodes(options) { function getNodes(options) {
// console.log(times); // console.log(times);
options = options || {}; options = options || {};
var parentValues = treeNode.parentValues || self._getParentValues(treeNode); const parentValues = treeNode.parentValues || self._getParentValues(treeNode);
var op = BI.extend({}, o.paras, { const op = extend({}, o.paras, {
id: treeNode.id, id: treeNode.id,
times: options.times, times: options.times,
parentValues: parentValues.concat(self._getNodeValue(treeNode)), parentValues: parentValues.concat(self._getNodeValue(treeNode)),
checkState: treeNode.getCheckStatus() checkState: treeNode.getCheckStatus(),
}, options); }, options);
o.itemsCreator(op, complete); o.itemsCreator(op, complete);
} }
// 展开节点会将halfCheck置为false以开启自动计算半选, 所以第一次展开节点的时候需要在置为false之前获取配置 // 展开节点会将halfCheck置为false以开启自动计算半选, 所以第一次展开节点的时候需要在置为false之前获取配置
var checkState = treeNode.getCheckStatus(); const checkState = treeNode.getCheckStatus();
if (!treeNode.children && !treeNode.requested) { if (!treeNode.children && !treeNode.requested) {
treeNode.requested = true; treeNode.requested = true;
setTimeout(function () { setTimeout(() => {
getNodes({ getNodes({
times: 1, times: 1,
checkState: checkState checkState,
}); });
}, 17); }, 17);
} }
}, }
// a,b 两棵树 // a,b 两棵树
// a->b b->a 做两次校验, 构造一个校验后的map // a->b b->a 做两次校验, 构造一个校验后的map
// e.g. 以a为基准,如果b没有此节点,则在map中添加。 如b有,且是全选的, 则在map中构造全选(为什么不添加a的值呢? 因为这次是取并集), 如果b中也有和a一样的存值,就递归 // e.g. 以a为基准,如果b没有此节点,则在map中添加。 如b有,且是全选的, 则在map中构造全选(为什么不添加a的值呢? 因为这次是取并集), 如果b中也有和a一样的存值,就递归
_join: function (valueA, valueB) { _join(valueA, valueB) {
var self = this; const self = this;
var map = {}; const map = {};
track([], valueA, valueB); track([], valueA, valueB);
track([], valueB, valueA); track([], valueB, valueA);
function track(parent, node, compare) { function track(parent, node, compare) {
BI.each(node, function (n, item) { each(node, (n, item) => {
if (BI.isNull(compare[n])) { if (isNull(compare[n])) {
self._addTreeNode(map, parent, n, item); self._addTreeNode(map, parent, n, item);
} else if (BI.isEmpty(compare[n])) { } else if (isEmpty(compare[n])) {
self._addTreeNode(map, parent, n, item); self._addTreeNode(map, parent, n, item);
} else { } else {
track(parent.concat([n]), node[n], compare[n]); track(parent.concat([n]), node[n], compare[n]);
@ -227,38 +228,37 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
} }
return map; return map;
}, }
hasChecked: function () { hasChecked() {
return !BI.isEmpty(this.options.paras.selectedValues) || BI.AsyncTree.superclass.hasChecked.apply(this, arguments); return !isEmpty(this.options.paras.selectedValues) || super.hasChecked(...arguments);
}, }
_getJoinValue: function () { _getJoinValue() {
if (!this.nodes) { if (!this.nodes) {
return this.options.paras.selectedValues || {}; return this.options.paras.selectedValues || {};
} }
var checkedValues = this._getSelectedValues(); const checkedValues = this._getSelectedValues();
if (BI.isEmpty(checkedValues)) { if (isEmpty(checkedValues)) {
return BI.deepClone(this.options.paras.selectedValues); return deepClone(this.options.paras.selectedValues);
} }
if (BI.isEmpty(this.options.paras.selectedValues)) { if (isEmpty(this.options.paras.selectedValues)) {
return checkedValues; return checkedValues;
} }
return this._join(checkedValues, this.options.paras.selectedValues); return this._join(checkedValues, this.options.paras.selectedValues);
}, }
getValue: function () { getValue() {
return this._getJoinValue(); return this._getJoinValue();
}, }
// 生成树方法 // 生成树方法
stroke: function (config) { stroke(config) {
delete this.options.keyword; delete this.options.keyword;
this.service.clear(); this.service.clear();
BI.extend(this.options.paras, config); extend(this.options.paras, config);
var setting = this._configSetting(); const setting = this._configSetting();
this._initTree(setting); this._initTree(setting);
} }
}); }
BI.shortcut("bi.async_tree", BI.AsyncTree);

14
src/case/ztree/index.js

@ -0,0 +1,14 @@
import "./jquery.ztree.core-3.5";
import "./jquery.ztree.excheck-3.5";
export * from "./treeview";
export * from "./asynctree";
export * from "./parttree";
export * from "./tree.display";
export * from "./tree.list.display";
export * from "./tree.simple";
export * from "./treerender.scroll.service";
export * from "./treerender.page.service";
export * from "./list/listtreeview";
export * from "./list/listasynctree";
export * from "./list/listparttree";

1
src/case/ztree/jquery.ztree.core-3.5.js

@ -1,3 +1,4 @@
/* eslint-disable */
/* /*
* JQuery zTree core * JQuery zTree core
* v3.5.48 * v3.5.48

51
src/case/ztree/jquery.ztree.excheck-3.5.js

@ -1,3 +1,4 @@
/* eslint-disable */
/* /*
* JQuery zTree excheck v3.5.18 * JQuery zTree excheck v3.5.18
* http://zTree.me/ * http://zTree.me/
@ -65,7 +66,8 @@
r.radioCheckedList = []; r.radioCheckedList = [];
}, },
//default cache of excheck //default cache of excheck
_initCache = function(treeId) {}, _initCache = function (treeId) {
},
//default bind event of excheck //default bind event of excheck
_bindEvent = function (setting) { _bindEvent = function (setting) {
var o = setting.treeObj, var o = setting.treeObj,
@ -126,7 +128,7 @@
treeEventType: treeEventType, treeEventType: treeEventType,
treeEventCallback: treeEventCallback treeEventCallback: treeEventCallback
}; };
return proxyResult return proxyResult;
}, },
//default init node of excheck //default init node of excheck
_initNode = function (setting, level, n, parentNode, isFirstNode, isLastNode, openFlag) { _initNode = function (setting, level, n, parentNode, isFirstNode, isLastNode, openFlag) {
@ -143,7 +145,9 @@
n.halfCheck = !!n.halfCheck; n.halfCheck = !!n.halfCheck;
n.check_Child_State = -1; n.check_Child_State = -1;
n.check_Focus = false; n.check_Focus = false;
n.getCheckStatus = function() {return data.getCheckStatus(setting, n);}; n.getCheckStatus = function () {
return data.getCheckStatus(setting, n);
};
if (setting.check.chkStyle == consts.radio.STYLE && setting.check.radioType == consts.radio.TYPE_ALL && n[checkedKey]) { if (setting.check.chkStyle == consts.radio.STYLE && setting.check.radioType == consts.radio.TYPE_ALL && n[checkedKey]) {
var r = data.getRoot(setting); var r = data.getRoot(setting);
@ -183,22 +187,22 @@
this.setting.treeObj.trigger(consts.event.CHECK, [null, this.setting.treeId, node]); this.setting.treeObj.trigger(consts.event.CHECK, [null, this.setting.treeId, node]);
} }
} }
} };
zTreeTools.checkAllNodes = function (checked) { zTreeTools.checkAllNodes = function (checked) {
view.repairAllChk(this.setting, !!checked); view.repairAllChk(this.setting, !!checked);
} };
zTreeTools.getCheckedNodes = function (checked) { zTreeTools.getCheckedNodes = function (checked) {
var childKey = this.setting.data.key.children; var childKey = this.setting.data.key.children;
checked = (checked !== false); checked = (checked !== false);
return data.getTreeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey], checked); return data.getTreeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey], checked);
} };
zTreeTools.getChangeCheckedNodes = function () { zTreeTools.getChangeCheckedNodes = function () {
var childKey = this.setting.data.key.children; var childKey = this.setting.data.key.children;
return data.getTreeChangeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey]); return data.getTreeChangeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey]);
} };
zTreeTools.setChkDisabled = function (node, disabled, inheritParent, inheritChildren) { zTreeTools.setChkDisabled = function (node, disabled, inheritParent, inheritChildren) {
disabled = !!disabled; disabled = !!disabled;
@ -206,7 +210,7 @@
inheritChildren = !!inheritChildren; inheritChildren = !!inheritChildren;
view.repairSonChkDisabled(this.setting, node, disabled, inheritChildren); view.repairSonChkDisabled(this.setting, node, disabled, inheritChildren);
view.repairParentChkDisabled(this.setting, node.getParentNode(), disabled, inheritParent); view.repairParentChkDisabled(this.setting, node.getParentNode(), disabled, inheritParent);
} };
var _updateNode = zTreeTools.updateNode; var _updateNode = zTreeTools.updateNode;
zTreeTools.updateNode = function (node, checkTypeFlag) { zTreeTools.updateNode = function (node, checkTypeFlag) {
@ -219,7 +223,7 @@
view.setChkClass(this.setting, checkObj, node); view.setChkClass(this.setting, checkObj, node);
view.repairParentChkClassWithSelf(this.setting, node); view.repairParentChkClassWithSelf(this.setting, node);
} }
} };
}, },
//method of operate data //method of operate data
_data = { _data = {
@ -228,7 +232,8 @@
for (var i = 0, j = checkedList.length; i < j; i++) { for (var i = 0, j = checkedList.length; i < j; i++) {
if (!data.getNodeCache(setting, checkedList[i].tId)) { if (!data.getNodeCache(setting, checkedList[i].tId)) {
checkedList.splice(i, 1); checkedList.splice(i, 1);
i--; j--; i--;
j--;
} }
} }
return checkedList; return checkedList;
@ -295,7 +300,8 @@
tmp = cNode.check_Child_State > 0 ? 2 : 0; tmp = cNode.check_Child_State > 0 ? 2 : 0;
} }
if (tmp == 2) { if (tmp == 2) {
chkFlag = 2; break; chkFlag = 2;
break;
} else if (tmp == 0) { } else if (tmp == 0) {
chkFlag = 0; chkFlag = 0;
} }
@ -310,11 +316,14 @@
tmp = (cNode.check_Child_State > 0) ? 1 : 0; tmp = (cNode.check_Child_State > 0) ? 1 : 0;
} }
if (tmp === 1) { if (tmp === 1) {
chkFlag = 1; break; chkFlag = 1;
break;
} else if (tmp === 2 && chkFlag > -1 && i > 0 && tmp !== chkFlag) { } else if (tmp === 2 && chkFlag > -1 && i > 0 && tmp !== chkFlag) {
chkFlag = 1; break; chkFlag = 1;
break;
} else if (chkFlag === 2 && tmp > -1 && tmp < 2) { } else if (chkFlag === 2 && tmp > -1 && tmp < 2) {
chkFlag = 1; break; chkFlag = 1;
break;
} else if (tmp > -1) { } else if (tmp > -1) {
chkFlag = tmp; chkFlag = tmp;
} }
@ -325,9 +334,7 @@
} }
}, },
//method of event proxy //method of event proxy
_event = { _event = {},
},
//method of event handler //method of event handler
_handler = { _handler = {
onCheckNode: function (event, node) { onCheckNode: function (event, node) {
@ -361,9 +368,7 @@
} }
}, },
//method of tools for zTree //method of tools for zTree
_tools = { _tools = {},
},
//method of operate ztree dom //method of operate ztree dom
_view = { _view = {
checkNodeRelation: function (setting, node) { checkNodeRelation: function (setting, node) {
@ -622,7 +627,7 @@
if (_createNodes) _createNodes.apply(view, arguments); if (_createNodes) _createNodes.apply(view, arguments);
if (!nodes) return; if (!nodes) return;
view.repairParentChkClassWithSelf(setting, parentNode); view.repairParentChkClassWithSelf(setting, parentNode);
} };
var _removeNode = view.removeNode; var _removeNode = view.removeNode;
view.removeNode = function (setting, node) { view.removeNode = function (setting, node) {
var parentNode = node.getParentNode(); var parentNode = node.getParentNode();
@ -630,7 +635,7 @@
if (!node || !parentNode) return; if (!node || !parentNode) return;
view.repairChkClass(setting, parentNode); view.repairChkClass(setting, parentNode);
view.repairParentChkClass(setting, parentNode); view.repairParentChkClass(setting, parentNode);
} };
var _appendNodes = view.appendNodes; var _appendNodes = view.appendNodes;
view.appendNodes = function (setting, level, nodes, parentNode, initFlag, openFlag) { view.appendNodes = function (setting, level, nodes, parentNode, initFlag, openFlag) {
@ -642,5 +647,5 @@
data.makeChkFlag(setting, parentNode); data.makeChkFlag(setting, parentNode);
} }
return html; return html;
} };
})(BI.jQuery); })(BI.jQuery);

118
src/case/ztree/list/0.listtreeview.js

@ -1,118 +0,0 @@
/**
* author: windy
* 继承自treeView, 此树的父子节点的勾选状态互不影响, 此树不会有半选节点
* 返回value格式为[["A"], ["A", "a"]]表示勾选了A且勾选了a
* @class BI.ListTreeView
* @extends BI.TreeView
*/
BI.ListTreeView = BI.inherit(BI.TreeView, {
_constants: {
SPLIT: "<|>"
},
_defaultConfig: function () {
return BI.extend(BI.ListTreeView.superclass._defaultConfig.apply(this, arguments), {
value: {}
});
},
_init: function () {
BI.ListTreeView.superclass._init.apply(this, arguments);
var o = this.options;
if(BI.isNotNull(o.value)) {
this.setSelectedValue(o.value);
}
},
// 配置属性
_configSetting: function () {
var paras = this.options.paras;
var self = this;
var setting = {
async: {
enable: false
},
check: {
enable: true,
chkboxType: {Y: "", N: ""}
},
data: {
key: {
title: "title",
name: "text"
},
simpleData: {
enable: true
}
},
view: {
showIcon: false,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false
},
callback: {
onCheck: onCheck,
onClick: onClick
}
};
function onClick (event, treeId, treeNode) {
var zTree = BI.$.fn.zTree.getZTreeObj(treeId);
var checked = treeNode.checked;
self._checkValue(treeNode, !checked);
zTree.checkNode(treeNode, !checked, true, true);
}
function onCheck (event, treeId, treeNode) {
self._selectTreeNode(treeId, treeNode);
}
return setting;
},
_selectTreeNode: function (treeId, treeNode) {
this._checkValue(treeNode, treeNode.checked);
BI.ListTreeView.superclass._selectTreeNode.apply(this, arguments);
},
_transArrayToMap: function (treeArrays) {
var self = this;
var map = {};
BI.each(treeArrays, function (idx, array) {
var key = array.join(self._constants.SPLIT);
map[key] = true;
});
return map;
},
_transMapToArray: function (treeMap) {
var self = this;
var array = [];
BI.each(treeMap, function (key) {
var item = key.split(self._constants.SPLIT);
array.push(item);
});
return array;
},
_checkValue: function (treeNode, checked) {
var key = BI.concat(this._getParentValues(treeNode), this._getNodeValue(treeNode)).join(this._constants.SPLIT);
if(checked) {
this.storeValue[key] = true;
} else {
delete this.storeValue[key];
}
},
setSelectedValue: function (value) {
this.options.paras.selectedValues = value || [];
this.storeValue = this._transArrayToMap(value);
},
getValue: function () {
return this._transMapToArray(this.storeValue);
}
});
BI.shortcut("bi.list_tree_view", BI.ListTreeView);

123
src/case/ztree/list/1.listasynctree.js

@ -1,123 +0,0 @@
/**
* author: windy
* 继承自treeView, 此树的父子节点的勾选状态互不影响, 此树不会有半选节点
* 返回value格式为["A", ["A", "a"]]表示勾选了A且勾选了a
* @class BI.ListListAsyncTree
* @extends BI.TreeView
*/
BI.ListAsyncTree = BI.inherit(BI.ListTreeView, {
_defaultConfig: function () {
return BI.extend(BI.ListAsyncTree.superclass._defaultConfig.apply(this, arguments), {});
},
_init: function () {
BI.ListAsyncTree.superclass._init.apply(this, arguments);
},
// 配置属性
_configSetting: function () {
var paras = this.options.paras;
var self = this;
var setting = {
async: {
enable: false, // 很明显这棵树把异步请求关掉了,所有的异步请求都是手动控制的
otherParam: BI.cjkEncodeDO(paras)
},
check: {
enable: true,
chkboxType: {Y: "", N: ""}
},
data: {
key: {
title: "title",
name: "text"
},
simpleData: {
enable: true
}
},
view: {
showIcon: false,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false
},
callback: {
onCheck: onCheck,
beforeExpand: beforeExpand,
beforeCheck: beforeCheck,
onClick: onClick
}
};
function beforeCheck (treeId, treeNode) {
treeNode.half = false;
}
function onClick (event, treeId, treeNode) {
var zTree = BI.$.fn.zTree.getZTreeObj(treeId);
var checked = treeNode.checked;
self._checkValue(treeNode, !checked);
zTree.checkNode(treeNode, !checked, true, true);
}
function beforeExpand (treeId, treeNode) {
self._beforeExpandNode(treeId, treeNode);
}
function onCheck (event, treeId, treeNode) {
self._selectTreeNode(treeId, treeNode);
}
return setting;
},
// 展开节点
_beforeExpandNode: function (treeId, treeNode) {
var self = this, o = this.options;
var parentValues = treeNode.parentValues || self._getParentValues(treeNode);
var op = BI.extend({}, o.paras, {
id: treeNode.id,
times: 1,
parentValues: parentValues.concat(this._getNodeValue(treeNode))
});
var complete = function (d) {
var nodes = d.items || [];
if (nodes.length > 0) {
callback(self._dealWidthNodes(nodes), !!d.hasNext);
}
};
var times = 1;
function callback (nodes, hasNext) {
self.nodes.addNodes(treeNode, nodes);
// 展开节点是没有分页的
if (hasNext === true) {
BI.delay(function () {
times++;
op.times = times;
o.itemsCreator(op, complete);
}, 100);
}
}
if (!treeNode.children) {
setTimeout(function () {
o.itemsCreator(op, complete);
}, 17);
}
},
hasChecked: function () {
return !BI.isEmpty(this.options.paras.selectedValues) || BI.ListAsyncTree.superclass.hasChecked.apply(this, arguments);
},
// 生成树方法
stroke: function (config) {
delete this.options.keyword;
BI.extend(this.options.paras, config);
var setting = this._configSetting();
this._initTree(setting);
}
});
BI.shortcut("bi.list_async_tree", BI.ListAsyncTree);

122
src/case/ztree/list/listasynctree.js

@ -0,0 +1,122 @@
/**
* author: windy
* 继承自treeView, 此树的父子节点的勾选状态互不影响, 此树不会有半选节点
* 返回value格式为["A", ["A", "a"]]表示勾选了A且勾选了a
* @class ListListAsyncTree
* @extends TreeView
*/
import { Listtreeview } from "./listtreeview";
import { cjkEncodeDO, delay, isEmpty, shortcut, extend } from "@/core";
@shortcut()
export class Listasynctree extends Listtreeview {
static xtype = "bi.list_async_tree";
// 配置属性
_configSetting() {
const paras = this.options.paras;
const self = this;
function beforeCheck(treeId, treeNode) {
treeNode.half = false;
}
function onClick(event, treeId, treeNode) {
const zTree = BI.$.fn.zTree.getZTreeObj(treeId);
const checked = treeNode.checked;
self._checkValue(treeNode, !checked);
zTree.checkNode(treeNode, !checked, true, true);
}
function beforeExpand(treeId, treeNode) {
self._beforeExpandNode(treeId, treeNode);
}
function onCheck(event, treeId, treeNode) {
self._selectTreeNode(treeId, treeNode);
}
return {
async: {
enable: false, // 很明显这棵树把异步请求关掉了,所有的异步请求都是手动控制的
otherParam: cjkEncodeDO(paras),
},
check: {
enable: true,
chkboxType: { Y: "", N: "" },
},
data: {
key: {
title: "title",
name: "text",
},
simpleData: {
enable: true,
},
},
view: {
showIcon: false,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false,
},
callback: {
onCheck,
beforeExpand,
beforeCheck,
onClick,
},
};
}
// 展开节点
_beforeExpandNode(treeId, treeNode) {
const self = this, o = this.options;
const parentValues = treeNode.parentValues || self._getParentValues(treeNode);
const op = extend({}, o.paras, {
id: treeNode.id,
times: 1,
parentValues: parentValues.concat(this._getNodeValue(treeNode)),
});
function complete(d) {
const nodes = d.items || [];
if (nodes.length > 0) {
callback(self._dealWidthNodes(nodes), !!d.hasNext);
}
};
let times = 1;
function callback(nodes, hasNext) {
self.nodes.addNodes(treeNode, nodes);
// 展开节点是没有分页的
if (hasNext === true) {
delay(() => {
times++;
op.times = times;
o.itemsCreator(op, complete);
}, 100);
}
}
if (!treeNode.children) {
setTimeout(() => {
o.itemsCreator(op, complete);
}, 17);
}
}
hasChecked() {
return !isEmpty(this.options.paras.selectedValues) || super.hasChecked(...arguments);
}
// 生成树方法
stroke(config) {
delete this.options.keyword;
extend(this.options.paras, config);
const setting = this._configSetting();
this._initTree(setting);
}
}

74
src/case/ztree/list/listparttree.js

@ -1,27 +1,28 @@
/** /**
* guy * guy
* 局部树两个请求树 第一个请求构造树第二个请求获取节点 * 局部树两个请求树 第一个请求构造树第二个请求获取节点
* @class BI.ListPartTree * @class ListPartTree
* @extends BI.AsyncTree * @extends Asynctree
*/ */
BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
_defaultConfig: function () {
return BI.extend(BI.ListPartTree.superclass._defaultConfig.apply(this, arguments), {});
},
_init: function () {
BI.ListPartTree.superclass._init.apply(this, arguments);
},
_loadMore: function () { import { Listasynctree } from "./listasynctree";
var self = this, o = this.options; import { shortcut, extend, Events, delay } from "@/core";
var op = BI.extend({}, o.paras, { import { TreeView } from "../treeview";
type: BI.TreeView.REQ_TYPE_INIT_DATA,
times: ++this.times @shortcut()
export class ListPartTree extends Listasynctree {
static xtype = "bi.list_part_tree";
_loadMore() {
const self = this, o = this.options;
const op = extend({}, o.paras, {
type: TreeView.REQ_TYPE_INIT_DATA,
times: ++this.times,
}); });
this.tip.setLoading(); this.tip.setLoading();
o.itemsCreator(op, function (d) { o.itemsCreator(op, d => {
var hasNext = !!d.hasNext, nodes = d.items || []; const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue; o.paras.lastSearchValue = d.lastSearchValue;
if (self._stop === true) { if (self._stop === true) {
return; return;
@ -35,24 +36,25 @@ BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
self.nodes.addNodes(null, self._dealWidthNodes(nodes)); self.nodes.addNodes(null, self._dealWidthNodes(nodes));
} }
}); });
}, }
_initTree: function (setting, keyword) { _initTree(setting, keyword) {
var self = this, o = this.options; const self = this, o = this.options;
this.times = 1; this.times = 1;
var tree = this.tree; const tree = this.tree;
tree.empty(); tree.empty();
self.tip.setVisible(false); self.tip.setVisible(false);
this.loading(); this.loading();
var op = BI.extend({}, o.paras, { const op = extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA, type: TreeView.REQ_TYPE_INIT_DATA,
times: this.times times: this.times,
}); });
var complete = function (d) {
if (self._stop === true || keyword != o.paras.keyword) { function complete(d) {
if (self._stop === true || keyword !== o.paras.keyword) {
return; return;
} }
var hasNext = !!d.hasNext, nodes = d.items || []; const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue; o.paras.lastSearchValue = d.lastSearchValue;
// 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的 // 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的
callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []); callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []);
@ -63,8 +65,8 @@ BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
} else { } else {
self.tip.setLoaded(); self.tip.setLoaded();
} }
self.fireEvent(BI.Events.AFTERINIT); self.fireEvent(Events.AFTERINIT);
}; }
function callback(nodes) { function callback(nodes) {
if (self._stop === true) { if (self._stop === true) {
@ -73,20 +75,18 @@ BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes); self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes);
} }
BI.delay(function () { delay(() => {
o.itemsCreator(op, complete); o.itemsCreator(op, complete);
}, 100); }, 100);
}, }
// 生成树方法 // 生成树方法
stroke: function (config) { stroke(config) {
var o = this.options; const o = this.options;
delete o.paras.keyword; delete o.paras.keyword;
BI.extend(o.paras, config); extend(o.paras, config);
delete o.paras.lastSearchValue; delete o.paras.lastSearchValue;
var setting = this._configSetting(); const setting = this._configSetting();
this._initTree(setting, o.paras.keyword); this._initTree(setting, o.paras.keyword);
} }
}); }
BI.shortcut("bi.list_part_tree", BI.ListPartTree);

121
src/case/ztree/list/listtreeview.js

@ -0,0 +1,121 @@
/**
* author: windy
* 继承自treeView, 此树的父子节点的勾选状态互不影响, 此树不会有半选节点
* 返回value格式为[["A"], ["A", "a"]]表示勾选了A且勾选了a
* @class BI.ListTreeView
* @extends BI.TreeView
*/
import { TreeView } from "../treeview";
import { extend, isNotNull, concat, each, shortcut } from "@/core";
@shortcut()
export class Listtreeview extends TreeView {
static xtype = "bi.list_tree_view";
_constants = {
SPLIT: "<|>",
};
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
value: {},
});
}
_init() {
super._init(...arguments);
const o = this.options;
if (isNotNull(o.value)) {
this.setSelectedValue(o.value);
}
}
// 配置属性
_configSetting() {
const self = this;
function onClick(event, treeId, treeNode) {
const zTree = BI.$.fn.zTree.getZTreeObj(treeId);
const checked = treeNode.checked;
self._checkValue(treeNode, !checked);
zTree.checkNode(treeNode, !checked, true, true);
}
function onCheck(event, treeId, treeNode) {
self._selectTreeNode(treeId, treeNode);
}
return {
async: {
enable: false,
},
check: {
enable: true,
chkboxType: { Y: "", N: "" },
},
data: {
key: {
title: "title",
name: "text",
},
simpleData: {
enable: true,
},
},
view: {
showIcon: false,
expandSpeed: "",
nameIsHTML: true,
dblClickExpand: false,
},
callback: {
onCheck,
onClick,
},
};
}
_selectTreeNode(treeId, treeNode) {
this._checkValue(treeNode, treeNode.checked);
super._selectTreeNode(...arguments);
}
_transArrayToMap(treeArrays) {
const map = {};
each(treeArrays, (idx, array) => {
const key = array.join(this._constants.SPLIT);
map[key] = true;
});
return map;
}
_transMapToArray(treeMap) {
const array = [];
BI.each(treeMap, key => {
const item = key.split(this._constants.SPLIT);
array.push(item);
});
return array;
}
_checkValue(treeNode, checked) {
const key = concat(this._getParentValues(treeNode), this._getNodeValue(treeNode)).join(this._constants.SPLIT);
if (checked) {
this.storeValue[key] = true;
} else {
delete this.storeValue[key];
}
}
setSelectedValue(value) {
this.options.paras.selectedValues = value || [];
this.storeValue = this._transArrayToMap(value);
}
getValue() {
return this._transMapToArray(this.storeValue);
}
}

173
src/case/ztree/parttree.js

@ -4,20 +4,30 @@
* @class BI.PartTree * @class BI.PartTree
* @extends BI.AsyncTree * @extends BI.AsyncTree
*/ */
BI.PartTree = BI.inherit(BI.AsyncTree, { import { isEmpty, shortcut, extend, deepClone, each, isNotEmptyArray, Events, delay, isNull } from "@/core";
_defaultConfig: function () { import { Asynctree } from "./asynctree";
return BI.extend(BI.PartTree.superclass._defaultConfig.apply(this, arguments), {}); import { TreeView } from "./treeview";
},
@shortcut()
_loadMore: function () { export class PartTree extends Asynctree {
var self = this, o = this.options; static xtype = "bi.part_tree";
var op = BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA, static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
times: ++this.times
constructor(...args) {
super(...args);
this.seMethos = super._selectTreeNode;
}
_loadMore() {
const self = this, o = this.options;
const op = extend({}, o.paras, {
type: TreeView.REQ_TYPE_INIT_DATA,
times: ++this.times,
}); });
this.tip.setLoading(); this.tip.setLoading();
o.itemsCreator(op, function (d) { o.itemsCreator(op, d => {
var hasNext = !!d.hasNext, nodes = d.items || []; const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue; o.paras.lastSearchValue = d.lastSearchValue;
if (self._stop === true) { if (self._stop === true) {
return; return;
@ -31,71 +41,73 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
self.nodes.addNodes(null, self._dealWidthNodes(nodes)); self.nodes.addNodes(null, self._dealWidthNodes(nodes));
} }
}); });
}, }
_selectTreeNode: function (treeId, treeNode) { _selectTreeNode(...args) {
var self = this, o = this.options; const self = this, o = this.options;
var parentValues = BI.deepClone(treeNode.parentValues || self._getParentValues(treeNode)); const [treeId, treeNode] = args;
var name = this._getNodeValue(treeNode); const parentValues = deepClone(treeNode.parentValues || self._getParentValues(treeNode));
this.fireEvent(BI.PartTree.EVENT_CLICK_TREE_NODE); const name = this._getNodeValue(treeNode);
this.fireEvent(PartTree.EVENT_CLICK_TREE_NODE);
if (treeNode.checked === true) { if (treeNode.checked === true) {
this.options.paras.selectedValues = this._getUnionValue(); this.options.paras.selectedValues = this._getUnionValue();
// this._buildTree(self.options.paras.selectedValues, BI.concat(parentValues, name)); // this._buildTree(self.options.paras.selectedValues, concat(parentValues, name));
o.itemsCreator(BI.extend({}, o.paras, { o.itemsCreator(extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_ADJUST_DATA, type: TreeView.REQ_TYPE_ADJUST_DATA,
curSelectedValue: name, curSelectedValue: name,
parentValues: parentValues parentValues,
}), function (res) { }), function (res) {
self.options.paras.selectedValues = res; self.options.paras.selectedValues = res;
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments); this.seMethos(...args);
}); });
} else { } else {
// 如果选中的值中不存在该值不处理 // 如果选中的值中不存在该值不处理
// 因为反正是不选中,没必要管 // 因为反正是不选中,没必要管
var t = this.options.paras.selectedValues; let t = this.options.paras.selectedValues;
var p = parentValues.concat(name); const p = parentValues.concat(name);
for (var i = 0, len = p.length; i < len; i++) { for (let i = 0, len = p.length; i < len; i++) {
t = t[p[i]]; t = t[p[i]];
if (t == null) { if (t == null) {
return; return;
} }
// 选中中国-江苏, 搜索南京,取消勾选 // 选中中国-江苏, 搜索南京,取消勾选
if (BI.isEmpty(t)) { if (isEmpty(t)) {
break; break;
} }
} }
o.itemsCreator(BI.extend({}, o.paras, { o.itemsCreator(extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_SELECT_DATA, type: TreeView.REQ_TYPE_SELECT_DATA,
notSelectedValue: name, notSelectedValue: name,
parentValues: parentValues parentValues,
}), function (new_values) { }), new_values => {
self.options.paras.selectedValues = new_values; self.options.paras.selectedValues = new_values;
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments); this.seMethos(...args);
}); });
} }
}, }
_getSelectedValues: function () { _getSelectedValues() {
var self = this; const self = this;
var hashMap = {}; const hashMap = {};
var rootNoots = this.nodes.getNodes(); const rootNodes = this.nodes.getNodes();
track(rootNoots); track(rootNodes);
function track(nodes) { function track(nodes) {
BI.each(nodes, function (i, node) { each(nodes, (i, node) => {
var checkState = node.getCheckStatus(); const checkState = node.getCheckStatus();
if (checkState.checked === false) { if (checkState.checked === false) {
return true; return true;
} }
var parentValues = node.parentValues || self._getParentValues(node); const parentValues = node.parentValues || self._getParentValues(node);
// 把文字中的html去掉,其实就是把文字颜色去掉 // 把文字中的html去掉,其实就是把文字颜色去掉
var values = parentValues.concat([self._getNodeValue(node)]); const values = parentValues.concat([self._getNodeValue(node)]);
self._buildTree(hashMap, values); self._buildTree(hashMap, values);
// if(checkState.checked === true && checkState.half === false && nodes[i].flag === true){ // if(checkState.checked === true && checkState.half === false && nodes[i].flag === true){
// continue; // continue;
// } // }
if (BI.isNotEmptyArray(node.children)) { if (isNotEmptyArray(node.children)) {
track(node.children); track(node.children);
return true; return true;
} }
if (checkState.half === true) { if (checkState.half === true) {
@ -105,24 +117,25 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
} }
return hashMap; return hashMap;
}, }
_initTree: function (setting, keyword) { _initTree(setting, keyword) {
var self = this, o = this.options; const self = this, o = this.options;
this.times = 1; this.times = 1;
var tree = this.tree; const tree = this.tree;
tree.empty(); tree.empty();
self.tip.setVisible(false); self.tip.setVisible(false);
this.loading(); this.loading();
var op = BI.extend({}, o.paras, { const op = extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA, type: TreeView.REQ_TYPE_INIT_DATA,
times: this.times times: this.times,
}); });
var complete = function (d) {
if (self._stop === true || keyword != o.paras.keyword) { function complete(d) {
if (self._stop === true || keyword !== o.paras.keyword) {
return; return;
} }
var hasNext = !!d.hasNext, nodes = d.items || []; const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue; o.paras.lastSearchValue = d.lastSearchValue;
// 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的 // 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的
callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []); callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []);
@ -133,8 +146,8 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
} else { } else {
self.tip.setLoaded(); self.tip.setLoaded();
} }
self.fireEvent(BI.Events.AFTERINIT); self.fireEvent(Events.AFTERINIT);
}; }
function callback(nodes) { function callback(nodes) {
if (self._stop === true) { if (self._stop === true) {
@ -143,40 +156,41 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes); self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes);
} }
BI.delay(function () { delay(() => {
o.itemsCreator(op, complete); o.itemsCreator(op, complete);
}, 100); }, 100);
}, }
getValue: function () { getValue() {
return BI.deepClone(this.options.paras.selectedValues || {}); return deepClone(this.options.paras.selectedValues || {});
}, }
_getUnionValue: function () { _getUnionValue() {
if (!this.nodes) { if (!this.nodes) {
return {}; return {};
} }
var checkedValues = this._getSelectedValues(); const checkedValues = this._getSelectedValues();
if (BI.isEmpty(checkedValues)) { if (isEmpty(checkedValues)) {
return BI.deepClone(this.options.paras.selectedValues); return deepClone(this.options.paras.selectedValues);
} }
if (BI.isEmpty(this.options.paras.selectedValues)) { if (isEmpty(this.options.paras.selectedValues)) {
return checkedValues; return checkedValues;
} }
return this._union(checkedValues, this.options.paras.selectedValues); return this._union(checkedValues, this.options.paras.selectedValues);
}, }
_union: function (valueA, valueB) { _union(valueA, valueB) {
var self = this; const self = this;
var map = {}; const map = {};
track([], valueA, valueB); track([], valueA, valueB);
track([], valueB, valueA); track([], valueB, valueA);
function track(parent, node, compare) { function track(parent, node, compare) {
BI.each(node, function (n, item) { each(node, (n, item) => {
if (BI.isNull(compare[n])) { if (isNull(compare[n])) {
self._addTreeNode(map, parent, n, item); self._addTreeNode(map, parent, n, item);
} else if (BI.isEmpty(compare[n])) { } else if (isEmpty(compare[n])) {
self._addTreeNode(map, parent, n, {}); self._addTreeNode(map, parent, n, {});
} else { } else {
track(parent.concat([n]), node[n], compare[n]); track(parent.concat([n]), node[n], compare[n]);
@ -185,18 +199,15 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
} }
return map; return map;
}, }
// 生成树方法 // 生成树方法
stroke: function (config) { stroke(config) {
var o = this.options; const o = this.options;
delete o.paras.keyword; delete o.paras.keyword;
BI.extend(o.paras, config); extend(o.paras, config);
delete o.paras.lastSearchValue; delete o.paras.lastSearchValue;
var setting = this._configSetting(); const setting = this._configSetting();
this._initTree(setting, o.paras.keyword); this._initTree(setting, o.paras.keyword);
} }
}); }
BI.PartTree.EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
BI.shortcut("bi.part_tree", BI.PartTree);

65
src/case/ztree/tree.display.js

@ -4,63 +4,64 @@
* @class BI.DisplayTree * @class BI.DisplayTree
* @extends BI.TreeView * @extends BI.TreeView
*/ */
BI.DisplayTree = BI.inherit(BI.TreeView, {
_defaultConfig: function () { import { extend } from "@/core";
return BI.extend(BI.DisplayTree.superclass._defaultConfig.apply(this, arguments), { import { TreeView } from "./treeview";
extraCls: "bi-display-tree"
export class DisplayTree extends TreeView {
static xtype = "bi.display_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
extraCls: "bi-display-tree",
}); });
}, }
// 配置属性 // 配置属性
_configSetting: function () { _configSetting() {
var setting = { function beforeCollapse(treeId, treeNode) {
return false;
}
return {
view: { view: {
selectedMulti: false, selectedMulti: false,
dblClickExpand: false, dblClickExpand: false,
showIcon: false, showIcon: false,
nameIsHTML: true, nameIsHTML: true,
showTitle: false showTitle: false,
}, },
data: { data: {
key: { key: {
title: "title", title: "title",
name: "text" name: "text",
}, },
simpleData: { simpleData: {
enable: true enable: true,
} },
}, },
callback: { callback: {
beforeCollapse: beforeCollapse beforeCollapse,
} },
}; };
function beforeCollapse(treeId, treeNode) {
return false;
} }
return setting; _dealWidthNodes(nodes) {
}, nodes = super._dealWidthNodes(...arguments);
BI.each(nodes, (i, node) => {
_dealWidthNodes: function (nodes) {
nodes = BI.DisplayTree.superclass._dealWidthNodes.apply(this, arguments);
var self = this, o = this.options;
BI.each(nodes, function (i, node) {
node.isParent = node.isParent || node.parent; node.isParent = node.isParent || node.parent;
if (node.text == null) { if (node.text == null) {
if (node.count > 0) { if (node.count > 0) {
node.text = node.value + "(" + BI.i18nText("BI-Basic_Altogether") + node.count + BI.i18nText("BI-Basic_Count") + ")"; node.text = `${node.value}(${BI.i18nText("BI-Basic_Altogether")}${node.count}${BI.i18nText("BI-Basic_Count")})`;
} }
} }
}); });
return nodes;
},
initTree: function (nodes, setting) { return nodes;
var setting = setting || this._configSetting();
this.nodes = BI.$.fn.zTree.init(this.tree.element, setting, nodes);
} }
});
BI.DisplayTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.display_tree", BI.DisplayTree); initTree(nodes, setting) {
this.nodes = BI.$.fn.zTree.init(this.tree.element, setting || this._configSetting(), nodes);
}
}

82
src/case/ztree/tree.list.display.js

@ -4,75 +4,69 @@
* @class BI.ListListDisplayTree * @class BI.ListListDisplayTree
* @extends BI.TreeView * @extends BI.TreeView
*/ */
BI.ListDisplayTree = BI.inherit(BI.ListTreeView, { import { Listtreeview } from "./list/listtreeview";
_defaultConfig: function () { import { each, shortcut } from "@/core";
return BI.extend(BI.ListDisplayTree.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-list-display-tree" @shortcut()
}); export class ListDisplayTree extends Listtreeview {
}, static xtype = "bi.list_display_tree";
_init: function () { static EVENT_CHANGE = "EVENT_CHANGE";
BI.ListDisplayTree.superclass._init.apply(this, arguments);
}, props() {
return {
extraCls: "bi-list-display-tree",
};
}
// 配置属性 // 配置属性
_configSetting: function () { _configSetting() {
var setting = { function beforeCollapse(treeId, treeNode) {
return false;
}
function getFont(treeId, node) {
return node.isLeaf ? {} : { color: "#999999" };
}
return {
view: { view: {
selectedMulti: false, selectedMulti: false,
dblClickExpand: false, dblClickExpand: false,
showIcon: false, showIcon: false,
nameIsHTML: true, nameIsHTML: true,
showTitle: false, showTitle: false,
fontCss: getFont fontCss: getFont,
}, },
data: { data: {
key: { key: {
title: "title", title: "title",
name: "text" name: "text",
}, },
simpleData: { simpleData: {
enable: true enable: true,
} },
}, },
callback: { callback: {
beforeCollapse: beforeCollapse beforeCollapse,
} },
}; };
function beforeCollapse(treeId, treeNode) {
return false;
} }
function getFont(treeId, node) { _dealWidthNodes(nodes) {
return node.isLeaf ? {} : {color: "#999999"}; nodes = super._dealWidthNodes(...arguments);
} each(nodes, (i, node) => {
return setting;
},
_dealWidthNodes: function (nodes) {
nodes = BI.ListDisplayTree.superclass._dealWidthNodes.apply(this, arguments);
var self = this, o = this.options;
BI.each(nodes, function (i, node) {
node.isParent = node.isParent || node.parent; node.isParent = node.isParent || node.parent;
if (node.text == null) { if (node.text == null) {
if (node.count > 0) { if (node.count > 0) {
node.text = node.value + "(" + BI.i18nText("BI-Basic_Altogether") + node.count + BI.i18nText("BI-Basic_Count") + ")"; node.text = `${node.value}(${BI.i18nText("BI-Basic_Altogether")}${node.count}${BI.i18nText("BI-Basic_Count")})`;
} }
} }
}); });
return nodes;
},
initTree: function (nodes, setting) {
var setting = setting || this._configSetting();
this.nodes = BI.$.fn.zTree.init(this.tree.element, setting, nodes);
},
destroy: function () { return nodes;
BI.ListDisplayTree.superclass.destroy.apply(this, arguments);
} }
});
BI.ListDisplayTree.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.list_display_tree", BI.ListDisplayTree); initTree(nodes, setting) {
this.nodes = BI.$.fn.zTree.init(this.tree.element, setting || this._configSetting(), nodes);
}
}

132
src/case/ztree/tree.simple.js

@ -2,66 +2,86 @@
* 简单的多选树 * 简单的多选树
* *
* Created by GUY on 2016/2/16. * Created by GUY on 2016/2/16.
* @class BI.SimpleTreeView * @class SimpleTreeView
* @extends BI.Widget * @extends Widget
*/ */
BI.SimpleTreeView = BI.inherit(BI.Widget, { import {
_defaultConfig: function () { shortcut,
return BI.extend(BI.SimpleTreeView.superclass._defaultConfig.apply(this, arguments), { Widget,
Tree,
createWidget,
emptyFn,
isNotNull,
isNotEmptyArray,
each,
makeObject,
isEmpty
} from "@/core";
import { TreeView } from "./treeview";
@shortcut()
export class SimpleTreeView extends Widget {
static xtype = "bi.simple_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
props() {
return {
baseCls: "bi-simple-tree", baseCls: "bi-simple-tree",
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
items: null items: null,
}); };
}, }
_init: function () {
BI.SimpleTreeView.superclass._init.apply(this, arguments); _init() {
var self = this, o = this.options; super._init(...arguments);
this.structure = new BI.Tree(); const self = this, o = this.options;
this.tree = BI.createWidget({ this.structure = new Tree();
type: "bi.tree_view", this.tree = createWidget({
type: TreeView.xtype,
element: this, element: this,
itemsCreator: function (op, callback) { itemsCreator(op, callback) {
var fn = function (items) { function fn(items) {
callback({ callback({
items: items items,
}); });
self.structure.initTree(BI.Tree.transformToTreeFormat(items)); self.structure.initTree(Tree.transformToTreeFormat(items));
}; };
if (BI.isNotNull(o.items)) { if (isNotNull(o.items)) {
fn(o.items); fn(o.items);
} else { } else {
o.itemsCreator(op, fn); o.itemsCreator(op, fn);
} }
} },
}); });
this.tree.on(BI.TreeView.EVENT_CHANGE, function () { this.tree.on(TreeView.EVENT_CHANGE, function () {
self.fireEvent(BI.SimpleTreeView.EVENT_CHANGE, arguments); self.fireEvent(SimpleTreeView.EVENT_CHANGE, arguments);
}); });
if (BI.isNotEmptyArray(o.items)) { if (isNotEmptyArray(o.items)) {
this.populate(); this.populate();
} }
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setValue(o.value); this.setValue(o.value);
} }
}, }
populate: function (items, keyword) { populate(items, keyword) {
if (items) { if (items) {
this.options.items = items; this.options.items = items;
} }
this.tree.stroke({ this.tree.stroke({
keyword: keyword keyword,
}); });
}, }
_digest: function (v) { _digest(v) {
v || (v = []); v || (v = []);
var self = this, map = {}; const self = this, map = {};
var selected = []; const selected = [];
BI.each(v, function (i, val) { each(v, (i, val) => {
var node = self.structure.search(val, "value"); const node = self.structure.search(val, "value");
if (node) { if (node) {
var p = node; let p = node;
p = p.getParent(); p = p.getParent();
if (p) { if (p) {
if (!map[p.value]) { if (!map[p.value]) {
@ -82,18 +102,20 @@ BI.SimpleTreeView = BI.inherit(BI.Widget, {
} }
} }
}); });
return BI.makeObject(v.concat(selected));
},
setValue: function (v) { return makeObject(v.concat(selected));
}
setValue(v) {
this.tree.setValue(this._digest(v)); this.tree.setValue(this._digest(v));
}, }
_getValue() {
const result = [], val = this.tree.getValue();
_getValue: function () { function track(nodes) {
var self = this, result = [], val = this.tree.getValue(); each(nodes, (key, node) => {
var track = function (nodes) { if (isEmpty(node)) {
BI.each(nodes, function (key, node) {
if (BI.isEmpty(node)) {
result.push(key); result.push(key);
} else { } else {
track(node); track(node);
@ -101,27 +123,27 @@ BI.SimpleTreeView = BI.inherit(BI.Widget, {
}); });
}; };
track(val); track(val);
return result; return result;
}, }
empty: function () { empty() {
this.tree.empty(); this.tree.empty();
}, }
getValue: function () { getValue() {
var self = this, result = [], val = this._getValue(); const self = this, result = [], val = this._getValue();
BI.each(val, function (i, key) { each(val, (i, key) => {
var target = self.structure.search(key, "value"); const target = self.structure.search(key, "value");
if (target) { if (target) {
self.structure._traverse(target, function (node) { self.structure._traverse(target, node => {
if (node.isLeaf()) { if (node.isLeaf()) {
result.push(node.value); result.push(node.value);
} }
}); });
} }
}); });
return result; return result;
} }
}); }
BI.SimpleTreeView.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.simple_tree", BI.SimpleTreeView);

72
src/case/ztree/treerender.page.service.js

@ -0,0 +1,72 @@
/**
* @author windy
* @version 2.0
* Created by windy on 2020/1/8
* 提供节点分页加载方式
*/
import { createWidget, debounce, has, OB, size, each } from "@/core";
export class TreeRenderPageService extends OB {
nodeLists = {};
_getLoadingBar(tId) {
const tip = createWidget({
type: "bi.loading_bar",
height: 25,
handler: () => {
this.refreshNodes(tId);
},
});
tip.setLoaded();
return tip;
}
pushNodeList(tId, populate) {
const o = this.options;
const tip = this._getLoadingBar(tId);
if (!has(this.nodeLists, tId)) {
this.nodeLists[tId] = {
populate: debounce(populate, 0),
options: {
times: 1,
},
loadWidget: tip,
};
} else {
this.nodeLists[tId].loadWidget.destroy();
this.nodeLists[tId].loadWidget = tip;
}
createWidget({
type: "bi.vertical",
element: o.subNodeListGetter(tId),
items: [tip],
});
}
refreshNodes(tId) {
const nodeList = this.nodeLists[tId];
nodeList.options.times++;
nodeList.loadWidget.setLoading();
nodeList.populate({
times: nodeList.options.times,
});
}
removeNodeList(tId) {
this.nodeLists[tId] && this.nodeLists[tId].loadWidget.destroy();
this.nodeLists[tId] && (this.nodeLists[tId].loadWidget = null);
delete this.nodeLists[tId];
if (size(this.nodeLists) === 0) {
this.clear();
}
}
clear() {
each(this.nodeLists, tId => {
this.removeNodeList(tId);
});
this.nodeLists = {};
}
}

95
src/case/ztree/treerender.scroll.service.js

@ -5,9 +5,10 @@
* 提供节点滚动加载方式 * 提供节点滚动加载方式
*/ */
!(function () { import { debounce, each, has, isNotNull, OB, size } from "@/core";
BI.TreeRenderScrollService = BI.inherit(BI.OB, {
_init: function () { export class TreeRenderScrollService extends OB {
_init() {
this.nodeLists = {}; this.nodeLists = {};
this.id = this.options.id; this.id = this.options.id;
@ -15,62 +16,63 @@
this.hasBinded = false; this.hasBinded = false;
this.container = this.options.container; this.container = this.options.container;
}, }
_getNodeListBounds(tId) {
const nodeList = this.options.subNodeListGetter(tId)[0];
_getNodeListBounds: function (tId) {
var nodeList = this.options.subNodeListGetter(tId)[0];
return { return {
top: nodeList.offsetTop, top: nodeList.offsetTop,
left: nodeList.offsetLeft, left: nodeList.offsetLeft,
width: nodeList.offsetWidth, width: nodeList.offsetWidth,
height: nodeList.offsetHeight height: nodeList.offsetHeight,
};
} }
},
_getTreeContainerBounds: function () { _getTreeContainerBounds() {
var nodeList = this.container[0]; const nodeList = this.container[0];
if (BI.isNotNull(nodeList)) { if (isNotNull(nodeList)) {
return { return {
top: nodeList.offsetTop + nodeList.scrollTop, top: nodeList.offsetTop + nodeList.scrollTop,
left: nodeList.offsetLeft + nodeList.scrollLeft, left: nodeList.offsetLeft + nodeList.scrollLeft,
width: nodeList.offsetWidth, width: nodeList.offsetWidth,
height: nodeList.offsetHeight height: nodeList.offsetHeight,
}; };
} }
return {}; return {};
}, }
_canNodePopulate: function (tId) { _canNodePopulate(tId) {
if (this.nodeLists[tId].locked) { if (this.nodeLists[tId].locked) {
return false; return false;
} }
// 获取ul, 即子节点列表的bounds // 获取ul, 即子节点列表的bounds
// 是否需要继续加载,只需要看子节点列表的下边界与container是否无交集 // 是否需要继续加载,只需要看子节点列表的下边界与container是否无交集
var bounds = this._getNodeListBounds(tId); const bounds = this._getNodeListBounds(tId);
var containerBounds = this._getTreeContainerBounds(tId); const containerBounds = this._getTreeContainerBounds(tId);
// ul底部是不是漏出来了 // ul底部是不是漏出来了
if (bounds.top + bounds.height < containerBounds.top + containerBounds.height) { return bounds.top + bounds.height < containerBounds.top + containerBounds.height;
return true;
} }
return false;
},
_isNodeInVisible: function (tId) { _isNodeInVisible(tId) {
var nodeList = this.options.subNodeListGetter(tId); const nodeList = this.options.subNodeListGetter(tId);
return nodeList.length === 0 || nodeList.css("display") === "none"; return nodeList.length === 0 || nodeList.css("display") === "none";
}, }
pushNodeList: function (tId, populate) { pushNodeList(tId, populate) {
var self = this; const self = this;
if (!BI.has(this.nodeLists, tId)) { if (!has(this.nodeLists, tId)) {
this.nodeLists[tId] = { this.nodeLists[tId] = {
populate: BI.debounce(populate, 0), populate: debounce(populate, 0),
options: { options: {
times: 1 times: 1,
}, },
// 在上一次请求返回前, 通过滚动再次触发加载的时候, 不应该认为是下一次分页, 需要等待上次请求返回 // 在上一次请求返回前, 通过滚动再次触发加载的时候, 不应该认为是下一次分页, 需要等待上次请求返回
// 以保证顺序和请求次数的完整 // 以保证顺序和请求次数的完整
locked: false locked: false,
}; };
} else { } else {
this.nodeLists[tId].locked = false; this.nodeLists[tId].locked = false;
@ -78,41 +80,41 @@
if (!this.hasBinded) { if (!this.hasBinded) {
// console.log("绑定事件"); // console.log("绑定事件");
this.hasBinded = true; this.hasBinded = true;
this.container && this.container.on("scroll", BI.debounce(function () { this.container && this.container.on("scroll", debounce(() => {
self.refreshAllNodes(); self.refreshAllNodes();
}, 30)); }, 30));
} }
}, }
refreshAllNodes: function () { refreshAllNodes() {
var self = this; const self = this;
BI.each(this.nodeLists, function (tId) { each(this.nodeLists, tId => {
// 不展开的节点就不看了 // 不展开的节点就不看了
!self._isNodeInVisible(tId) && self.refreshNodes(tId); !self._isNodeInVisible(tId) && self.refreshNodes(tId);
}); });
}, }
refreshNodes: function (tId) { refreshNodes(tId) {
if (this._canNodePopulate(tId)) { if (this._canNodePopulate(tId)) {
var nodeList = this.nodeLists[tId]; const nodeList = this.nodeLists[tId];
nodeList.options.times++; nodeList.options.times++;
nodeList.locked = true; nodeList.locked = true;
nodeList.populate({ nodeList.populate({
times: nodeList.options.times times: nodeList.options.times,
}); });
} }
}, }
removeNodeList: function (tId) { removeNodeList(tId) {
delete this.nodeLists[tId]; delete this.nodeLists[tId];
if (BI.size(this.nodeLists) === 0) { if (size(this.nodeLists) === 0) {
this.clear(); this.clear();
} }
}, }
clear: function () { clear() {
var self = this; const self = this;
BI.each(this.nodeLists, function (tId) { each(this.nodeLists, tId => {
self.removeNodeList(tId); self.removeNodeList(tId);
}); });
this.nodeLists = {}; this.nodeLists = {};
@ -120,5 +122,4 @@
this.container.off("scroll"); this.container.off("scroll");
this.hasBinded = false; this.hasBinded = false;
} }
}); }
})();

76
src/case/ztree/treetrender.page.service.js

@ -1,76 +0,0 @@
/**
* @author windy
* @version 2.0
* Created by windy on 2020/1/8
* 提供节点分页加载方式
*/
!(function () {
BI.TreeRenderPageService = BI.inherit(BI.OB, {
_init: function () {
this.nodeLists = {};
},
_getLoadingBar: function(tId) {
var self = this;
var tip = BI.createWidget({
type: "bi.loading_bar",
height: 25,
handler: function () {
self.refreshNodes(tId);
}
});
tip.setLoaded();
return tip;
},
pushNodeList: function (tId, populate) {
var self = this, o = this.options;
var tip = this._getLoadingBar(tId);
if (!BI.has(this.nodeLists, tId)) {
this.nodeLists[tId] = {
populate: BI.debounce(populate, 0),
options: {
times: 1
},
loadWidget: tip
};
} else {
this.nodeLists[tId].loadWidget.destroy();
this.nodeLists[tId].loadWidget = tip;
}
BI.createWidget({
type: "bi.vertical",
element: o.subNodeListGetter(tId),
items: [tip]
});
},
refreshNodes: function (tId) {
var nodeList = this.nodeLists[tId];
nodeList.options.times++;
nodeList.loadWidget.setLoading();
nodeList.populate({
times: nodeList.options.times
});
},
removeNodeList: function (tId) {
this.nodeLists[tId] && this.nodeLists[tId].loadWidget.destroy();
this.nodeLists[tId] && (this.nodeLists[tId].loadWidget = null);
delete this.nodeLists[tId];
if (BI.size(this.nodeLists) === 0) {
this.clear();
}
},
clear: function () {
var self = this;
BI.each(this.nodeLists, function (tId) {
self.removeNodeList(tId);
});
this.nodeLists = {};
}
});
})();

434
src/case/ztree/0.treeview.js → src/case/ztree/treeview.js

@ -1,94 +1,112 @@
/** import {
* guy cjkEncodeDO,
* 异步树 Controller,
* @class BI.TreeView createWidget,
* @extends BI.Pane emptyFn,
*/ Events,
BI.TreeView = BI.inherit(BI.Pane, { extend,
_defaultConfig: function () { UUID,
return BI.extend(BI.TreeView.superclass._defaultConfig.apply(this, arguments), { isNotNull,
jsonEncode,
delay, each, replaceAll,
isUndefined, isNotEmptyArray, deepClone, map, Tree,
isNull, shortcut
} from "@/core";
import { Msg, Pane } from "@/base";
@shortcut()
export class TreeView extends Pane {
static xtype = "bi.tree_view";
static REQ_TYPE_INIT_DATA = 1;
static REQ_TYPE_ADJUST_DATA = 2;
static REQ_TYPE_SELECT_DATA = 3;
static REQ_TYPE_GET_SELECTED_DATA = 4;
static EVENT_CHANGE = "EVENT_CHANGE";
static EVENT_INIT = Events.INIT;
static EVENT_AFTERINIT = Events.AFTERINIT;
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
_baseCls: "bi-tree", _baseCls: "bi-tree",
paras: { paras: {
selectedValues: {} selectedValues: {},
}, },
itemsCreator: BI.emptyFn, itemsCreator: emptyFn,
showLine: true showLine: true,
}); });
}, }
_init: function () {
BI.TreeView.superclass._init.apply(this, arguments); _init() {
var o = this.options; super._init(...arguments);
const o = this.options;
this._stop = false; this._stop = false;
this._createTree(); this._createTree();
this.tip = BI.createWidget({ this.tip = createWidget({
type: "bi.loading_bar", type: "bi.loading_bar",
invisible: true, invisible: true,
handler: BI.bind(this._loadMore, this) handler: () => this._loadMore(),
}); });
BI.createWidget({ createWidget({
type: "bi.vertical", type: "bi.vertical",
scrollable: true, scrollable: true,
scrolly: false, scrolly: false,
element: this, element: this,
items: [this.tip] items: [this.tip],
}); });
if (BI.isNotNull(o.value)) { if (isNotNull(o.value)) {
this.setSelectedValue(o.value); this.setSelectedValue(o.value);
} }
if (BI.isIE9Below && BI.isIE9Below()) {
this.element.addClass("hack");
} }
},
_createTree: function () { _createTree() {
this.id = "bi-tree" + BI.UUID(); this.id = `bi-tree${UUID()}`;
if (this.nodes) { if (this.nodes) {
this.nodes.destroy(); this.nodes.destroy();
} }
if (this.tree) { if (this.tree) {
this.tree.destroy(); this.tree.destroy();
} }
this.tree = BI.createWidget({ this.tree = createWidget({
type: "bi.layout", type: "bi.layout",
element: "<ul id='" + this.id + "' class='ztree" + (BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? " solid'" : "'") + "></ul>" element: `<ul id='${this.id}' class='ztree${BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? " solid'" : "'"}></ul>`,
}); });
BI.createWidget({ createWidget({
type: "bi.default", type: "bi.default",
element: this, element: this,
items: [this.tree] items: [this.tree],
}); });
}, }
// 选择节点触发方法 // 选择节点触发方法
_selectTreeNode: function (treeId, treeNode) { _selectTreeNode(treeId, treeNode) {
this.fireEvent(BI.Controller.EVENT_CHANGE, BI.Events.CLICK, treeNode, this); this.fireEvent(Controller.EVENT_CHANGE, Events.CLICK, treeNode, this);
this.fireEvent(BI.TreeView.EVENT_CHANGE, treeNode, this); this.fireEvent(TreeView.EVENT_CHANGE, treeNode, this);
}, }
// 配置属性 // 配置属性
_configSetting: function () { _configSetting() {
var paras = this.options.paras; const paras = this.options.paras;
var self = this; const self = this;
var o = this.options; const o = this.options;
var setting = { const setting = {
async: { async: {
enable: true, enable: true,
url: getUrl, url: getUrl,
autoParam: ["id", "name"], // 节点展开异步请求自动提交id和name autoParam: ["id", "name"], // 节点展开异步请求自动提交id和name
otherParam: BI.cjkEncodeDO(paras) // 静态参数 otherParam: cjkEncodeDO(paras), // 静态参数
}, },
check: { check: {
enable: true enable: true,
}, },
data: { data: {
key: { key: {
title: "title", title: "title",
name: "text" // 节点的name属性替换成text name: "text", // 节点的name属性替换成text
}, },
simpleData: { simpleData: {
enable: true // 可以穿id,pid属性的对象数组 enable: true, // 可以穿id,pid属性的对象数组
} },
}, },
view: { view: {
showIcon: false, showIcon: false,
@ -98,22 +116,22 @@ BI.TreeView = BI.inherit(BI.Pane, {
showLine: o.showLine, showLine: o.showLine,
}, },
callback: { callback: {
beforeExpand: beforeExpand, beforeExpand,
onAsyncSuccess: onAsyncSuccess, onAsyncSuccess,
onAsyncError: onAsyncError, onAsyncError,
beforeCheck: beforeCheck, beforeCheck,
onCheck: onCheck, onCheck,
onExpand: onExpand, onExpand,
onCollapse: onCollapse, onCollapse,
onClick: onClick onClick,
} },
}; };
var className = "dark", perTime = 100; const className = "dark", perTime = 100;
function onClick(event, treeId, treeNode) { function onClick(event, treeId, treeNode) {
// 当前点击节点的状态是半选,且为true_part, 则将其改为false_part,使得点击半选后切换到的是全选 // 当前点击节点的状态是半选,且为true_part, 则将其改为false_part,使得点击半选后切换到的是全选
var checked = treeNode.checked; let checked = treeNode.checked;
var status = treeNode.getCheckStatus(); const status = treeNode.getCheckStatus();
if (status.half === true && status.checked === true) { if (status.half === true && status.checked === true) {
checked = false; checked = false;
} }
@ -122,14 +140,14 @@ BI.TreeView = BI.inherit(BI.Pane, {
} }
function getUrl(treeId, treeNode) { function getUrl(treeId, treeNode) {
var parentNode = self._getParentValues(treeNode); const parentNode = self._getParentValues(treeNode);
treeNode.times = treeNode.times || 1; treeNode.times = treeNode.times || 1;
var param = "id=" + treeNode.id const param = `id=${treeNode.id
+ "&times=" + (treeNode.times++) }&times=${treeNode.times++
+ "&parentValues= " + _global.encodeURIComponent(BI.jsonEncode(parentNode)) }&parentValues= ${_global.encodeURIComponent(jsonEncode(parentNode))
+ "&checkState=" + _global.encodeURIComponent(BI.jsonEncode(treeNode.getCheckStatus())); }&checkState=${_global.encodeURIComponent(jsonEncode(treeNode.getCheckStatus()))}`;
return "&" + param; return `&${param}`;
} }
function beforeExpand(treeId, treeNode) { function beforeExpand(treeId, treeNode) {
@ -138,13 +156,14 @@ BI.TreeView = BI.inherit(BI.Pane, {
treeNode.times = 1; treeNode.times = 1;
ajaxGetNodes(treeNode, "refresh"); ajaxGetNodes(treeNode, "refresh");
} }
return true; return true;
} }
BI.Msg.toast("Please Wait。", { Msg.toast("Please Wait。", {
level: "warning" level: "warning",
}); // 不展开节点,也不触发onExpand事件 }); // 不展开节点,也不触发onExpand事件
return false;
return false;
} }
function onAsyncSuccess(event, treeId, treeNode, msg) { function onAsyncSuccess(event, treeId, treeNode, msg) {
@ -152,14 +171,14 @@ BI.TreeView = BI.inherit(BI.Pane, {
if (!msg || msg.length === 0 || /^<html>[\s,\S]*<\/html>$/gi.test(msg) || self._stop) { if (!msg || msg.length === 0 || /^<html>[\s,\S]*<\/html>$/gi.test(msg) || self._stop) {
return; return;
} }
var zTree = self.nodes; const zTree = self.nodes;
var totalCount = treeNode.count || 0; const totalCount = treeNode.count || 0;
// 尝试去获取下一组节点,若获取值为空数组,表示获取完成 // 尝试去获取下一组节点,若获取值为空数组,表示获取完成
// TODO by GUY // TODO by GUY
if (treeNode.children.length > totalCount) { if (treeNode.children.length > totalCount) {
treeNode.count = treeNode.children.length; treeNode.count = treeNode.children.length;
BI.delay(function () { delay(() => {
ajaxGetNodes(treeNode); ajaxGetNodes(treeNode);
}, perTime); }, perTime);
} else { } else {
@ -171,15 +190,15 @@ BI.TreeView = BI.inherit(BI.Pane, {
} }
function onAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) { function onAsyncError(event, treeId, treeNode, XMLHttpRequest, textStatus, errorThrown) {
var zTree = self.nodes; const zTree = self.nodes;
BI.Msg.toast("Error!", "warning"); Msg.toast("Error!", "warning");
// treeNode.icon = ""; // treeNode.icon = "";
// zTree.updateNode(treeNode); // zTree.updateNode(treeNode);
} }
function ajaxGetNodes(treeNode, reloadType) { function ajaxGetNodes(treeNode, reloadType) {
var zTree = self.nodes; const zTree = self.nodes;
if (reloadType == "refresh") { if (reloadType === "refresh") {
zTree.updateNode(treeNode); // 刷新一下当前节点,如果treeNode.xxx被改了的话 zTree.updateNode(treeNode); // 刷新一下当前节点,如果treeNode.xxx被改了的话
} }
zTree.reAsyncChildNodes(treeNode, reloadType, true); // 强制加载子节点,reloadType === refresh为先清空再加载,否则为追加到现有子节点之后 zTree.reAsyncChildNodes(treeNode, reloadType, true); // 强制加载子节点,reloadType === refresh为先清空再加载,否则为追加到现有子节点之后
@ -190,13 +209,13 @@ BI.TreeView = BI.inherit(BI.Pane, {
return false; return false;
} }
// 下面主动修改了node的halfCheck属性, 节点属性的判断依赖halfCheck,改之前就获取一下 // 下面主动修改了node的halfCheck属性, 节点属性的判断依赖halfCheck,改之前就获取一下
var status = treeNode.getCheckStatus(); const status = treeNode.getCheckStatus();
treeNode.halfCheck = false; treeNode.halfCheck = false;
if (treeNode.checked === true) { if (treeNode.checked === true) {
// 将展开的节点halfCheck设为false,解决展开节点存在halfCheck=true的情况 guy // 将展开的节点halfCheck设为false,解决展开节点存在halfCheck=true的情况 guy
// 所有的半选状态都需要取消halfCheck=true的情况 // 所有的半选状态都需要取消halfCheck=true的情况
function track(children) { function track(children) {
BI.each(children, function (i, ch) { each(children, (i, ch) => {
if (ch.halfCheck === true) { if (ch.halfCheck === true) {
ch.halfCheck = false; ch.halfCheck = false;
track(ch.children); track(ch.children);
@ -205,9 +224,9 @@ BI.TreeView = BI.inherit(BI.Pane, {
} }
track(treeNode.children); track(treeNode.children);
var treeObj = self.nodes; const treeObj = self.nodes;
var nodes = treeObj.getSelectedNodes(); const nodes = treeObj.getSelectedNodes();
BI.$.each(nodes, function (index, node) { BI.$.each(nodes, (index, node) => {
node.halfCheck = false; node.halfCheck = false;
}); });
} }
@ -232,102 +251,106 @@ BI.TreeView = BI.inherit(BI.Pane, {
} }
return setting; return setting;
}, }
_getParentValues: function (treeNode) { _getParentValues(treeNode) {
if (!treeNode.getParentNode()) { if (!treeNode.getParentNode()) {
return []; return [];
} }
var parentNode = treeNode.getParentNode(); const parentNode = treeNode.getParentNode();
var result = this._getParentValues(parentNode); let result = this._getParentValues(parentNode);
result = result.concat([this._getNodeValue(parentNode)]); result = result.concat([this._getNodeValue(parentNode)]);
return result; return result;
}, }
_getNodeValue: function (node) { _getNodeValue(node) {
// 去除标红 // 去除标红
return BI.isUndefined(node.value) ? BI.replaceAll(node.text.replace(/<[^>]+>/g, ""), "&nbsp;", " ") : node.value; return isUndefined(node.value) ? replaceAll(node.text.replace(/<[^>]+>/g, ""), "&nbsp;", " ") : node.value;
}, }
// 获取半选框值 // 获取半选框值
_getHalfSelectedValues: function (map, node) { _getHalfSelectedValues(map, node) {
var self = this; const self = this;
var checkState = node.getCheckStatus(); const checkState = node.getCheckStatus();
// 将未选的去掉 // 将未选的去掉
if (checkState.checked === false && checkState.half === false) { if (checkState.checked === false && checkState.half === false) {
return; return;
} }
// 如果节点已展开,并且是半选 // 如果节点已展开,并且是半选
if (BI.isNotEmptyArray(node.children) && checkState.half === true) { if (isNotEmptyArray(node.children) && checkState.half === true) {
var children = node.children; const children = node.children;
BI.each(children, function (i, ch) { each(children, (i, ch) => {
self._getHalfSelectedValues(map, ch); self._getHalfSelectedValues(map, ch);
}); });
return; return;
} }
var parent = node.parentValues || self._getParentValues(node); const parent = node.parentValues || self._getParentValues(node);
var path = parent.concat(this._getNodeValue(node)); const path = parent.concat(this._getNodeValue(node));
// 当前节点是全选的,因为上面的判断已经排除了不选和半选 // 当前节点是全选的,因为上面的判断已经排除了不选和半选
if (BI.isNotEmptyArray(node.children) || checkState.half === false) { if (isNotEmptyArray(node.children) || checkState.half === false) {
this._buildTree(map, path); this._buildTree(map, path);
return; return;
} }
// 剩下的就是半选不展开的节点,因为不知道里面是什么情况,所以借助selectedValues(这个是完整的选中情况) // 剩下的就是半选不展开的节点,因为不知道里面是什么情况,所以借助selectedValues(这个是完整的选中情况)
var storeValues = BI.deepClone(this.options.paras.selectedValues); const storeValues = deepClone(this.options.paras.selectedValues);
var treeNode = this._getTree(storeValues, path); const treeNode = this._getTree(storeValues, path);
this._addTreeNode(map, parent, this._getNodeValue(node), treeNode); this._addTreeNode(map, parent, this._getNodeValue(node), treeNode);
}, }
// 获取的是以values最后一个节点为根的子树 // 获取的是以values最后一个节点为根的子树
_getTree: function (map, values) { _getTree(map, values) {
var cur = map; let cur = map;
BI.any(values, function (i, value) { some(values, (i, value) => {
if (cur[value] == null) { if (cur[value] == null) {
return true; return true;
} }
cur = cur[value]; cur = cur[value];
}); });
return cur; return cur;
}, }
// 以values为path一路向里补充map, 并在末尾节点添加key: value节点 // 以values为path一路向里补充map, 并在末尾节点添加key: value节点
_addTreeNode: function (map, values, key, value) { _addTreeNode(map, values, key, value) {
var cur = map; let cur = map;
BI.each(values, function (i, value) { each(values, (i, value) => {
if (cur[value] == null) { if (cur[value] == null) {
cur[value] = {}; cur[value] = {};
} }
cur = cur[value]; cur = cur[value];
}); });
cur[key] = value; cur[key] = value;
}, }
// 构造树节点 // 构造树节点
_buildTree: function (map, values) { _buildTree(map, values) {
var cur = map; let cur = map;
BI.each(values, function (i, value) { each(values, (i, value) => {
if (cur[value] == null) { if (cur[value] == null) {
cur[value] = {}; cur[value] = {};
} }
cur = cur[value]; cur = cur[value];
}); });
}, }
// 获取选中的值 // 获取选中的值
_getSelectedValues: function () { _getSelectedValues() {
var self = this; const self = this;
var hashMap = {}; const hashMap = {};
var rootNoots = this.nodes.getNodes(); const rootNoots = this.nodes.getNodes();
track(rootNoots); // 可以看到这个方法没有递归调用,所以在_getHalfSelectedValues中需要关心全选的节点 track(rootNoots); // 可以看到这个方法没有递归调用,所以在_getHalfSelectedValues中需要关心全选的节点
function track(nodes) { function track(nodes) {
BI.each(nodes, function (i, node) { each(nodes, (i, node) => {
var checkState = node.getCheckStatus(); const checkState = node.getCheckStatus();
if (checkState.checked === true || checkState.half === true) { if (checkState.checked === true || checkState.half === true) {
if (checkState.half === true) { if (checkState.half === true) {
self._getHalfSelectedValues(hashMap, node); self._getHalfSelectedValues(hashMap, node);
} else { } else {
var parentValues = node.parentValues || self._getParentValues(node); const parentValues = node.parentValues || self._getParentValues(node);
var values = parentValues.concat([self._getNodeValue(node)]); const values = parentValues.concat([self._getNodeValue(node)]);
self._buildTree(hashMap, values); self._buildTree(hashMap, values);
} }
} }
@ -335,27 +358,28 @@ BI.TreeView = BI.inherit(BI.Pane, {
} }
return hashMap; return hashMap;
}, }
// 处理节点 // 处理节点
_dealWidthNodes: function (nodes) { _dealWidthNodes(nodes) {
var self = this, o = this.options; const self = this, o = this.options;
var ns = BI.Tree.arrayFormat(nodes); const ns = Tree.arrayFormat(nodes);
return BI.map(ns, function (i, n) {
var newNode = BI.extend({}, n); return map(ns, (i, n) => {
const newNode = extend({}, n);
newNode.isParent = newNode.isParent || newNode.parent; newNode.isParent = newNode.isParent || newNode.parent;
// n.value = BI.isUndefined(n.value) ? n.text : n.value; // n.value = BI.isUndefined(n.value) ? n.text : n.value;
// n.text = BI.isUndefined(n.text) ? n.value : n.text; // n.text = BI.isUndefined(n.text) ? n.value : n.text;
// if (n.text === null) { // if (n.text === null) {
// n.text = ""; // n.text = "";
// } // }
if (BI.isNull(newNode.title)) { if (isNull(newNode.title)) {
newNode.title = newNode.text; newNode.title = newNode.text;
} }
if (newNode.disabled) { if (newNode.disabled) {
newNode.title = newNode.warningTitle || newNode.title; newNode.title = newNode.warningTitle || newNode.title;
} }
var text = BI.createWidget(BI.extend({ const text = createWidget(extend({
cls: "tree-node-text", cls: "tree-node-text",
tagName: "span", tagName: "span",
whiteSpace: "nowrap", whiteSpace: "nowrap",
@ -363,9 +387,9 @@ BI.TreeView = BI.inherit(BI.Pane, {
keyword: o.paras.keyword, keyword: o.paras.keyword,
}, newNode, { }, newNode, {
type: "bi.text", type: "bi.text",
text: BI.replaceAll(newNode.text, "\n", " ") text: replaceAll(newNode.text, "\n", " "),
})); }));
var fragment = BI.Widget._renderEngine.createElement("<div>"); const fragment = BI.Widget._renderEngine.createElement("<div>");
fragment.append(text.element[0]); fragment.append(text.element[0]);
newNode.text = fragment.html(); newNode.text = fragment.html();
// // 处理标红 // // 处理标红
@ -376,21 +400,22 @@ BI.TreeView = BI.inherit(BI.Pane, {
// n.text = BI.htmlEncode(BI.Text.formatText(n.text + "")); // n.text = BI.htmlEncode(BI.Text.formatText(n.text + ""));
// } // }
// } // }
return newNode; return newNode;
}); });
}, }
_loadMore: function () { _loadMore() {
var self = this, o = this.options; const self = this, o = this.options;
this.tip.setLoading(); this.tip.setLoading();
var op = BI.extend({}, o.paras, { const op = extend({}, o.paras, {
times: ++this.times times: ++this.times,
}); });
o.itemsCreator(op, function (res) { o.itemsCreator(op, res => {
if (self._stop === true) { if (self._stop === true) {
return; return;
} }
var hasNext = !!res.hasNext, nodes = res.items || []; const hasNext = !!res.hasNext, nodes = res.items || [];
if (!hasNext) { if (!hasNext) {
self.tip.setEnd(); self.tip.setEnd();
@ -401,32 +426,34 @@ BI.TreeView = BI.inherit(BI.Pane, {
self.nodes.addNodes(null, self._dealWidthNodes(nodes)); self.nodes.addNodes(null, self._dealWidthNodes(nodes));
} }
}); });
}, }
// 生成树内部方法 // 生成树内部方法
_initTree: function (setting) { _initTree(setting) {
var self = this, o = this.options; const self = this, o = this.options;
self.fireEvent(BI.Events.INIT); self.fireEvent(Events.INIT);
this.times = 1; this.times = 1;
var tree = this.tree; const tree = this.tree;
tree.empty(); tree.empty();
this.loading(); this.loading();
this.tip.setVisible(false); this.tip.setVisible(false);
var callback = function (nodes) {
function callback(nodes) {
if (self._stop === true) { if (self._stop === true) {
return; return;
} }
self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes); self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes);
}; }
var op = BI.extend({}, o.paras, {
times: 1 const op = extend({}, o.paras, {
times: 1,
}); });
o.itemsCreator(op, function (res) { o.itemsCreator(op, res => {
if (self._stop === true) { if (self._stop === true) {
return; return;
} }
var hasNext = !!res.hasNext, nodes = res.items || []; const hasNext = !!res.hasNext, nodes = res.items || [];
if (nodes.length > 0) { if (nodes.length > 0) {
callback(self._dealWidthNodes(nodes)); callback(self._dealWidthNodes(nodes));
} }
@ -437,68 +464,69 @@ BI.TreeView = BI.inherit(BI.Pane, {
} else { } else {
self.tip.setLoaded(); self.tip.setLoaded();
} }
op.times === 1 && self.fireEvent(BI.Events.AFTERINIT); op.times === 1 && self.fireEvent(Events.AFTERINIT);
}); });
}, }
// 构造树结构, // 构造树结构,
initTree: function (nodes, setting) { initTree(nodes, setting) {
var setting = setting || { const defaultSetting = {
async: { async: {
enable: false enable: false,
}, },
check: { check: {
enable: false enable: false,
}, },
data: { data: {
key: { key: {
title: "title", title: "title",
name: "text" name: "text",
}, },
simpleData: { simpleData: {
enable: true enable: true,
} },
}, },
view: { view: {
showIcon: false, showIcon: false,
expandSpeed: "", expandSpeed: "",
nameIsHTML: true nameIsHTML: true,
}, },
callback: {} callback: {},
}; };
this.nodes = BI.$.fn.zTree.init(this.tree.element, setting, nodes); this.nodes = BI.$.fn.zTree.init(this.tree.element, setting || defaultSetting, nodes);
}, }
start: function () { start() {
this._stop = false; this._stop = false;
}, }
stop: function () { stop() {
this._stop = true; this._stop = true;
}, }
// 生成树方法 // 生成树方法
stroke: function (config) { stroke(config) {
delete this.options.keyword; delete this.options.keyword;
BI.extend(this.options.paras, config); extend(this.options.paras, config);
var setting = this._configSetting(); const setting = this._configSetting();
this._createTree(); this._createTree();
this.start(); this.start();
this._initTree(setting); this._initTree(setting);
}, }
populate: function () { populate() {
this.stroke.apply(this, arguments); this.stroke(...arguments);
}, }
hasChecked() {
const treeObj = this.nodes;
hasChecked: function () {
var treeObj = this.nodes;
return treeObj.getCheckedNodes(true).length > 0; return treeObj.getCheckedNodes(true).length > 0;
}, }
checkAll: function (checked) { checkAll(checked) {
function setNode(children) { function setNode(children) {
BI.each(children, function (i, child) { each(children, (i, child) => {
child.halfCheck = false; child.halfCheck = false;
setNode(child.children); setNode(child.children);
}); });
@ -508,68 +536,58 @@ BI.TreeView = BI.inherit(BI.Pane, {
return; return;
} }
BI.each(this.nodes.getNodes(), function (i, node) { each(this.nodes.getNodes(), (i, node) => {
node.halfCheck = false; node.halfCheck = false;
setNode(node.children); setNode(node.children);
}); });
this.nodes.checkAllNodes(checked); this.nodes.checkAllNodes(checked);
}, }
expandAll: function (flag) { expandAll(flag) {
this.nodes && this.nodes.expandAll(flag); this.nodes && this.nodes.expandAll(flag);
}, }
// 设置树节点的状态 // 设置树节点的状态
setValue: function (value, param) { setValue(value, param) {
this.checkAll(false); this.checkAll(false);
this.updateValue(value, param); this.updateValue(value, param);
this.refresh(); this.refresh();
}, }
setSelectedValue: function (value) { setSelectedValue(value) {
this.options.paras.selectedValues = BI.deepClone(value || {}); this.options.paras.selectedValues = deepClone(value || {});
}, }
updateValue: function (values, param) { updateValue(values, param) {
if (!this.nodes) { if (!this.nodes) {
return; return;
} }
param || (param = "value"); param || (param = "value");
var treeObj = this.nodes; const treeObj = this.nodes;
BI.each(values, function (v, op) { each(values, (v, op) => {
var nodes = treeObj.getNodesByParam(param, v, null); const nodes = treeObj.getNodesByParam(param, v, null);
BI.each(nodes, function (j, node) { each(nodes, (j, node) => {
BI.extend(node, { checked: true }, op); extend(node, { checked: true }, op);
treeObj.updateNode(node); treeObj.updateNode(node);
}); });
}); });
}, }
refresh: function () { refresh() {
this.nodes && this.nodes.refresh(); this.nodes && this.nodes.refresh();
}, }
getValue: function () { getValue() {
if (!this.nodes) { if (!this.nodes) {
return null; return null;
} }
return this._getSelectedValues(); return this._getSelectedValues();
}, }
destroyed: function () { destroyed() {
this.stop(); this.stop();
this.nodes && this.nodes.destroy(); this.nodes && this.nodes.destroy();
} }
}); }
BI.extend(BI.TreeView, {
REQ_TYPE_INIT_DATA: 1,
REQ_TYPE_ADJUST_DATA: 2,
REQ_TYPE_SELECT_DATA: 3,
REQ_TYPE_GET_SELECTED_DATA: 4
});
BI.TreeView.EVENT_CHANGE = "EVENT_CHANGE";
BI.TreeView.EVENT_INIT = BI.Events.INIT;
BI.TreeView.EVENT_AFTERINIT = BI.Events.AFTERINIT;
BI.shortcut("bi.tree_view", BI.TreeView);

29
src/core/platform/web/jquery/jquery.mousewheel.js

@ -1,3 +1,4 @@
/* eslint-disable */
/* ! /* !
* jQuery Mousewheel 3.1.13 * jQuery Mousewheel 3.1.13
* *
@ -86,10 +87,18 @@
event.type = "mousewheel"; event.type = "mousewheel";
// Old school scrollwheel delta // Old school scrollwheel delta
if ( "detail" in orgEvent ) { deltaY = orgEvent.detail * -1; } if ("detail" in orgEvent) {
if ( "wheelDelta" in orgEvent ) { deltaY = orgEvent.wheelDelta; } deltaY = orgEvent.detail * -1;
if ( "wheelDeltaY" in orgEvent ) { deltaY = orgEvent.wheelDeltaY; } }
if ( "wheelDeltaX" in orgEvent ) { deltaX = orgEvent.wheelDeltaX * -1; } if ("wheelDelta" in orgEvent) {
deltaY = orgEvent.wheelDelta;
}
if ("wheelDeltaY" in orgEvent) {
deltaY = orgEvent.wheelDeltaY;
}
if ("wheelDeltaX" in orgEvent) {
deltaX = orgEvent.wheelDeltaX * -1;
}
// Firefox < 17 horizontal scrolling related to DOMMouseScroll event // Firefox < 17 horizontal scrolling related to DOMMouseScroll event
if ("axis" in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS) { if ("axis" in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS) {
@ -107,11 +116,15 @@
} }
if ("deltaX" in orgEvent) { if ("deltaX" in orgEvent) {
deltaX = orgEvent.deltaX; deltaX = orgEvent.deltaX;
if ( deltaY === 0 ) { delta = deltaX * -1; } if (deltaY === 0) {
delta = deltaX * -1;
}
} }
// No change actually happened, no reason to go any further // No change actually happened, no reason to go any further
if ( deltaY === 0 && deltaX === 0 ) { return; } if (deltaY === 0 && deltaX === 0) {
return;
}
// Need to convert lines and pages to pixels if we aren't already in pixels // Need to convert lines and pages to pixels if we aren't already in pixels
// There are three delta modes: // There are three delta modes:
@ -180,7 +193,9 @@
// handle multiple device types that give different // handle multiple device types that give different
// a different lowestDelta // a different lowestDelta
// Ex: trackpad = 3 and mouse wheel = 120 // Ex: trackpad = 3 and mouse wheel = 120
if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); } if (nullLowestDeltaTimeout) {
clearTimeout(nullLowestDeltaTimeout);
}
nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200); nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200);
return ($.event.dispatch || $.event.handle).apply(this, args); return ($.event.dispatch || $.event.handle).apply(this, args);

Loading…
Cancel
Save