Browse Source

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

es6
Treecat 2 years ago
parent
commit
f9c12f7f6e
  1. 22
      src/base/single/bar/bar.loading.js
  2. 1
      src/base/single/index.js
  3. 7
      src/case/index.js
  4. 3
      src/case/tree/index.js
  5. 156
      src/case/tree/tree.level.js
  6. 70
      src/case/tree/treeexpander/tree.expander.js
  7. 65
      src/case/tree/treeexpander/tree.expander.popup.js
  8. 226
      src/case/ztree/asynctree.js
  9. 14
      src/case/ztree/index.js
  10. 1
      src/case/ztree/jquery.ztree.core-3.5.js
  11. 161
      src/case/ztree/jquery.ztree.excheck-3.5.js
  12. 118
      src/case/ztree/list/0.listtreeview.js
  13. 123
      src/case/ztree/list/1.listasynctree.js
  14. 122
      src/case/ztree/list/listasynctree.js
  15. 76
      src/case/ztree/list/listparttree.js
  16. 121
      src/case/ztree/list/listtreeview.js
  17. 173
      src/case/ztree/parttree.js
  18. 65
      src/case/ztree/tree.display.js
  19. 82
      src/case/ztree/tree.list.display.js
  20. 132
      src/case/ztree/tree.simple.js
  21. 73
      src/case/ztree/treerender.page.service.js
  22. 97
      src/case/ztree/treerender.scroll.service.js
  23. 76
      src/case/ztree/treetrender.page.service.js
  24. 444
      src/case/ztree/treeview.js
  25. 1
      src/core/platform/web/index.js
  26. 81
      src/core/platform/web/jquery/jquery.mousewheel.js
  27. 106
      src/core/utils/color.js
  28. 2
      src/core/utils/dom.js
  29. 10
      src/core/utils/index.js
  30. 2
      src/core/wrapper/index.js

22
src/base/single/bar/bar.loading.js

@ -1,12 +1,8 @@
import { shortcut, emptyFn } from "../../../core"
/**
* guy
* 加载条
* @type {*|void|Object}
*/
@shortcut()
class LoadingBar extends BI.Single {
import { shortcut, emptyFn } from "@/core";
import { Single } from "../0.single";
@shortcut()
class LoadingBar extends Single {
static xtype = "bi.loading_bar";
_defaultConfig() {
@ -14,10 +10,10 @@ class LoadingBar extends BI.Single {
return {
...conf,
baseCls: (conf.baseCls || "") + " bi-loading-bar bi-tips",
baseCls: `${conf.baseCls || ""} bi-loading-bar bi-tips`,
height: 30,
handler: emptyFn,
}
};
}
render() {
@ -49,13 +45,15 @@ class LoadingBar extends BI.Single {
this.cardLayout = BI.createWidget({
type: "bi.card",
element: this,
items: [{
items: [
{
el: loaded,
cardName: "loaded",
}, {
el: loading,
cardName: "loading",
}],
}
],
});
this.invisible();
}

1
src/base/single/index.js

@ -9,6 +9,7 @@ export { Link } from "./link/link";
export { Instruction } from "./instruction/instruction";
export { Img } from "./img/img";
export { Trigger } from "./trigger/trigger";
export { LoadingBar } from "./bar/bar.loading";
export * from "./tip";
export * from "./label";
export * from "./input";

7
src/case/index.js

@ -2,6 +2,8 @@ import * as button from "./button";
import * as calendarItem from "./calendar";
import * as pager from "./pager";
import * as editor from "./editor";
import * as tree from "./tree";
import * as ztree from "./ztree";
import * as trigger from "./trigger";
import * as loader from "./loader";
import * as segment from "./segment";
@ -12,6 +14,8 @@ Object.assign(BI, {
...calendarItem,
...pager,
...editor,
...ztree,
...tree,
...trigger,
...loader,
...segment,
@ -22,6 +26,9 @@ export * from "./button";
export * from "./calendar";
export * from "./pager";
export * from "./editor";
export * from "./tree";
export * from "./ztree";
export * from "./trigger";
export * from "./loader";
export * from "./segment";

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

156
src/case/tree/tree.level.js

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

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

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

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

@ -1,6 +1,10 @@
!(function () {
var Widget = BI.inherit(BI.Widget, {
props: function () {
import { Controller, createWidget, pixFormat, shortcut, VerticalLayout, Widget } from "@/core";
@shortcut()
export class TreeExpanderPopup extends Widget {
static xtype = "bi.tree_expander.popup";
props() {
return {
baseCls: "bi-tree-expander-popup",
layer: 0, // 第几层级
@ -8,53 +12,50 @@
isLastNode: false,
showLine: true,
};
},
render: function () {
}
var self = this;
var o = this.options;
var offset = BI.SIZE_CONSANTS.LIST_ITEM_HEIGHT / 2;
render() {
const self = this;
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, {
value: o.value
}), this);
this.popupView = createWidget({
...el,
value,
}, this);
this.popupView.on(BI.Controller.EVENT_CHANGE, function () {
self.fireEvent(BI.Controller.EVENT_CHANGE, arguments);
this.popupView.on(Controller.EVENT_CHANGE, function () {
self.fireEvent(Controller.EVENT_CHANGE, arguments);
});
if (o.showLine) {
this.popupView.element.css("margin-left", BI.pixFormat(-offset * (o.layer + 1)));
this.element.css("margin-left", BI.pixFormat(offset * (o.layer + 1)));
if (showLine) {
this.popupView.element.css("margin-left", pixFormat(-offset * (layer + 1)));
this.element.css("margin-left", pixFormat(offset * (layer + 1)));
}
return {
type: "bi.vertical",
cls: (o.showLine && !o.isLastNode) ? (BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? "line solid" : "line") : "",
type: VerticalLayout.xtype,
cls: (showLine && !isLastNode) ? (BI.STYLE_CONSTANTS.LINK_LINE_TYPE === "solid" ? "line solid" : "line") : "",
scrolly: null,
items: [
this.popupView,
this.popupView
],
};
},
}
setValue: function (v) {
setValue(v) {
this.popupView.setValue(v);
},
}
getValue: function () {
getValue() {
return this.popupView.getValue();
},
}
populate: function (items) {
populate(items) {
this.popupView.populate(items);
},
}
getAllLeaves: function () {
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 @@
/**
* guy
* 异步树
* @class BI.AsyncTree
* @extends BI.TreeView
*/
BI.AsyncTree = BI.inherit(BI.TreeView, {
_defaultConfig: function () {
return BI.extend(BI.AsyncTree.superclass._defaultConfig.apply(this, arguments), {
import { cjkEncodeDO, deepClone, each, extend, isEmpty, isNotNull, isNull, shortcut } from "@/core";
import { TreeView } from "./treeview";
import { TreeRenderPageService } from "./treerender.page.service";
@shortcut()
export class Asynctree extends TreeView {
static xtype = "bi.async_tree";
_defaultConfig() {
return extend(super._defaultConfig(...arguments), {
showIcon: false,
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");
}
});
},
// 配置属性
_configSetting: function () {
var o = this.options;
var paras = this.options.paras;
var self = this;
var setting = {
async: {
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 || ""] };
}
_init() {
super._init(...arguments);
const self = this;
this.service = new TreeRenderPageService({
subNodeListGetter(tId) {
// 获取待检测的子节点列表, ztree并没有获取节点列表dom的API, 此处使用BI.$获取
return BI.$(`#${self.id} #${tId}_ul`);
},
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) {
if (treeNode.disabled) {
return false;
}
var zTree = BI.$.fn.zTree.getZTreeObj(treeId);
const zTree = BI.$.fn.zTree.getZTreeObj(treeId);
// 当前点击节点的状态是半选,且为true_part, 则将其改为false_part,使得点击半选后切换到的是全选
var checked = treeNode.checked;
var status = treeNode.getCheckStatus();
let checked = treeNode.checked;
const status = treeNode.getCheckStatus();
if (status.half === true && status.checked === true) {
checked = false;
}
@ -83,13 +49,13 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
return false;
}
// 下面主动修改了node的halfCheck属性, 节点属性的判断依赖halfCheck,改之前就获取一下
var status = treeNode.getCheckStatus();
const status = treeNode.getCheckStatus();
treeNode.halfCheck = false;
if (treeNode.checked === true) {
// 将展开的节点halfCheck设为false,解决展开节点存在halfCheck=true的情况 guy
// 所有的半选状态都需要取消halfCheck=true的情况
function track(children) {
BI.each(children, function (i, ch) {
each(children, (i, ch) => {
ch.halfCheck = false;
track(ch.children);
});
@ -97,9 +63,9 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
track(treeNode.children);
var treeObj = BI.$.fn.zTree.getZTreeObj(treeId);
var nodes = treeObj.getSelectedNodes();
BI.each(nodes, function (index, node) {
const treeObj = BI.$.fn.zTree.getZTreeObj(treeId);
const nodes = treeObj.getSelectedNodes();
each(nodes, (index, node) => {
node.halfCheck = false;
});
}
@ -128,24 +94,59 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
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内部无关
_selectTreeNode: function (treeId, treeNode) {
var self = this, o = this.options;
var parentValues = BI.deepClone(treeNode.parentValues || self._getParentValues(treeNode));
var name = this._getNodeValue(treeNode);
_selectTreeNode(treeId, treeNode) {
const self = this;
let parentValues = deepClone(treeNode.parentValues || self._getParentValues(treeNode));
let name = this._getNodeValue(treeNode);
// var values = parentValues.concat([name]);
if (treeNode.checked === true) {
this._addTreeNode(this.options.paras.selectedValues, parentValues, name, {});
} else {
var tNode = treeNode;
var pNode = this._getTree(this.options.paras.selectedValues, parentValues);
if (BI.isNotNull(pNode[name])) {
let tNode = treeNode;
let pNode = this._getTree(this.options.paras.selectedValues, parentValues);
if (isNotNull(pNode[name])) {
delete pNode[name];
}
while (tNode != null && BI.isEmpty(pNode)) {
while (tNode != null && isEmpty(pNode)) {
parentValues = parentValues.slice(0, parentValues.length - 1);
tNode = tNode.getParentNode();
if (tNode != null) {
@ -156,14 +157,15 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
}
this.options.paras.selectedValues = this._getJoinValue();
}
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments);
},
super._selectTreeNode(...arguments);
}
// 展开节点
_beforeExpandNode: function (treeId, treeNode) {
var self = this, o = this.options;
var complete = function (d) {
var nodes = d.items || [];
_beforeExpandNode(treeId, treeNode) {
const self = this, o = this.options;
function complete(d) {
const nodes = d.items || [];
if (nodes.length > 0) {
callback(self._dealWidthNodes(nodes), !!d.hasNext);
}
@ -176,49 +178,48 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
} else {
self.service.removeNodeList(treeNode.tId);
}
}
function getNodes(options) {
// console.log(times);
options = options || {};
var parentValues = treeNode.parentValues || self._getParentValues(treeNode);
var op = BI.extend({}, o.paras, {
const parentValues = treeNode.parentValues || self._getParentValues(treeNode);
const op = extend({}, o.paras, {
id: treeNode.id,
times: options.times,
parentValues: parentValues.concat(self._getNodeValue(treeNode)),
checkState: treeNode.getCheckStatus()
checkState: treeNode.getCheckStatus(),
}, options);
o.itemsCreator(op, complete);
}
// 展开节点会将halfCheck置为false以开启自动计算半选, 所以第一次展开节点的时候需要在置为false之前获取配置
var checkState = treeNode.getCheckStatus();
const checkState = treeNode.getCheckStatus();
if (!treeNode.children && !treeNode.requested) {
treeNode.requested = true;
setTimeout(function () {
setTimeout(() => {
getNodes({
times: 1,
checkState: checkState
checkState,
});
}, 17);
}
},
}
// a,b 两棵树
// a->b b->a 做两次校验, 构造一个校验后的map
// e.g. 以a为基准,如果b没有此节点,则在map中添加。 如b有,且是全选的, 则在map中构造全选(为什么不添加a的值呢? 因为这次是取并集), 如果b中也有和a一样的存值,就递归
_join: function (valueA, valueB) {
var self = this;
var map = {};
_join(valueA, valueB) {
const self = this;
const map = {};
track([], valueA, valueB);
track([], valueB, valueA);
function track(parent, node, compare) {
BI.each(node, function (n, item) {
if (BI.isNull(compare[n])) {
each(node, (n, item) => {
if (isNull(compare[n])) {
self._addTreeNode(map, parent, n, item);
} else if (BI.isEmpty(compare[n])) {
} else if (isEmpty(compare[n])) {
self._addTreeNode(map, parent, n, item);
} else {
track(parent.concat([n]), node[n], compare[n]);
@ -227,38 +228,37 @@ BI.AsyncTree = BI.inherit(BI.TreeView, {
}
return map;
},
}
hasChecked: function () {
return !BI.isEmpty(this.options.paras.selectedValues) || BI.AsyncTree.superclass.hasChecked.apply(this, arguments);
},
hasChecked() {
return !isEmpty(this.options.paras.selectedValues) || super.hasChecked(...arguments);
}
_getJoinValue: function () {
_getJoinValue() {
if (!this.nodes) {
return this.options.paras.selectedValues || {};
}
var checkedValues = this._getSelectedValues();
if (BI.isEmpty(checkedValues)) {
return BI.deepClone(this.options.paras.selectedValues);
const checkedValues = this._getSelectedValues();
if (isEmpty(checkedValues)) {
return deepClone(this.options.paras.selectedValues);
}
if (BI.isEmpty(this.options.paras.selectedValues)) {
if (isEmpty(this.options.paras.selectedValues)) {
return checkedValues;
}
return this._join(checkedValues, this.options.paras.selectedValues);
},
}
getValue: function () {
getValue() {
return this._getJoinValue();
},
}
// 生成树方法
stroke: function (config) {
stroke(config) {
delete this.options.keyword;
this.service.clear();
BI.extend(this.options.paras, config);
var setting = this._configSetting();
extend(this.options.paras, config);
const setting = this._configSetting();
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
* v3.5.48

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

@ -1,3 +1,4 @@
/* eslint-disable */
/*
* JQuery zTree excheck v3.5.18
* http://zTree.me/
@ -10,7 +11,7 @@
* email: hunter.z@263.net
* Date: 2015-06-18
*/
(function($){
(function ($) {
//default consts of excheck
var _consts = {
event: {
@ -55,8 +56,8 @@
}
},
callback: {
beforeCheck:null,
onCheck:null
beforeCheck: null,
onCheck: null
}
},
//default root of excheck
@ -65,9 +66,10 @@
r.radioCheckedList = [];
},
//default cache of excheck
_initCache = function(treeId) {},
_initCache = function (treeId) {
},
//default bind event of excheck
_bindEvent = function(setting) {
_bindEvent = function (setting) {
var o = setting.treeObj,
c = consts.event;
o.bind(c.CHECK, function (event, srcEvent, treeId, node) {
@ -75,13 +77,13 @@
tools.apply(setting.callback.onCheck, [event, treeId, node]);
});
},
_unbindEvent = function(setting) {
_unbindEvent = function (setting) {
var o = setting.treeObj,
c = consts.event;
o.unbind(c.CHECK);
},
//default event proxy of excheck
_eventProxy = function(e) {
_eventProxy = function (e) {
var target = e.target,
setting = data.getSetting(e.data.treeId),
tId = "", node = null,
@ -89,22 +91,22 @@
nodeEventCallback = null, treeEventCallback = null;
if (tools.eqs(e.type, "mouseover")) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode" + consts.id.CHECK) !== null) {
tId = tools.getNodeMainDom(target).id;
nodeEventType = "mouseoverCheck";
}
} else if (tools.eqs(e.type, "mouseout")) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode" + consts.id.CHECK) !== null) {
tId = tools.getNodeMainDom(target).id;
nodeEventType = "mouseoutCheck";
}
} else if (tools.eqs(e.type, "click")) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode" + consts.id.CHECK) !== null) {
tId = tools.getNodeMainDom(target).id;
nodeEventType = "checkNode";
}
}
if (tId.length>0) {
if (tId.length > 0) {
node = data.getNodeCache(setting, tId);
switch (nodeEventType) {
case "checkNode" :
@ -126,10 +128,10 @@
treeEventType: treeEventType,
treeEventCallback: treeEventCallback
};
return proxyResult
return proxyResult;
},
//default init node of excheck
_initNode = function(setting, level, n, parentNode, isFirstNode, isLastNode, openFlag) {
_initNode = function (setting, level, n, parentNode, isFirstNode, isLastNode, openFlag) {
if (!n) return;
var checkedKey = setting.data.key.checked;
if (typeof n[checkedKey] == "string") n[checkedKey] = tools.eqs(n[checkedKey], "true");
@ -143,24 +145,26 @@
n.halfCheck = !!n.halfCheck;
n.check_Child_State = -1;
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);
r.radioCheckedList.push(n);
}
},
//add dom for check
_beforeA = function(setting, node, html) {
_beforeA = function (setting, node, html) {
var checkedKey = setting.data.key.checked;
if (setting.check.enable) {
data.makeChkFlag(setting, node);
html.push("<span ID='", node.tId, consts.id.CHECK, "' class='", view.makeChkClass(setting, node), "' treeNode", consts.id.CHECK, (node.nocheck === true?" style='display:none;'":""),"></span>");
html.push("<span ID='", node.tId, consts.id.CHECK, "' class='", view.makeChkClass(setting, node), "' treeNode", consts.id.CHECK, (node.nocheck === true ? " style='display:none;'" : ""), "></span>");
}
},
//update zTreeObj, add method of check
_zTreeTools = function(setting, zTreeTools) {
zTreeTools.checkNode = function(node, checked, checkTypeFlag, callbackFlag) {
_zTreeTools = function (setting, zTreeTools) {
zTreeTools.checkNode = function (node, checked, checkTypeFlag, callbackFlag) {
var checkedKey = this.setting.data.key.checked;
if (node.chkDisabled === true) return;
if (checked !== true && checked !== false) {
@ -183,33 +187,33 @@
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);
}
};
zTreeTools.getCheckedNodes = function(checked) {
zTreeTools.getCheckedNodes = function (checked) {
var childKey = this.setting.data.key.children;
checked = (checked !== false);
return data.getTreeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey], checked);
}
};
zTreeTools.getChangeCheckedNodes = function() {
zTreeTools.getChangeCheckedNodes = function () {
var childKey = this.setting.data.key.children;
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;
inheritParent = !!inheritParent;
inheritChildren = !!inheritChildren;
view.repairSonChkDisabled(this.setting, node, disabled, inheritChildren);
view.repairParentChkDisabled(this.setting, node.getParentNode(), disabled, inheritParent);
}
};
var _updateNode = zTreeTools.updateNode;
zTreeTools.updateNode = function(node, checkTypeFlag) {
zTreeTools.updateNode = function (node, checkTypeFlag) {
if (_updateNode) _updateNode.apply(zTreeTools, arguments);
if (!node || !this.setting.check.enable) return;
var nObj = $$(node, this.setting);
@ -219,21 +223,22 @@
view.setChkClass(this.setting, checkObj, node);
view.repairParentChkClassWithSelf(this.setting, node);
}
}
};
},
//method of operate data
_data = {
getRadioCheckedList: function(setting) {
getRadioCheckedList: function (setting) {
var checkedList = data.getRoot(setting).radioCheckedList;
for (var i=0, j=checkedList.length; i<j; i++) {
if(!data.getNodeCache(setting, checkedList[i].tId)) {
for (var i = 0, j = checkedList.length; i < j; i++) {
if (!data.getNodeCache(setting, checkedList[i].tId)) {
checkedList.splice(i, 1);
i--; j--;
i--;
j--;
}
}
return checkedList;
},
getCheckStatus: function(setting, node) {
getCheckStatus: function (setting, node) {
if (!setting.check.enable || node.nocheck || node.chkDisabled) return null;
var checkedKey = setting.data.key.checked,
r = {
@ -242,7 +247,7 @@
};
return r;
},
getTreeCheckedNodes: function(setting, nodes, checked, results) {
getTreeCheckedNodes: function (setting, nodes, checked, results) {
if (!nodes) return [];
var childKey = setting.data.key.children,
checkedKey = setting.data.key.checked,
@ -251,18 +256,18 @@
for (var i = 0, l = nodes.length; i < l; i++) {
if (nodes[i].nocheck !== true && nodes[i].chkDisabled !== true && nodes[i][checkedKey] == checked) {
results.push(nodes[i]);
if(onlyOne) {
if (onlyOne) {
break;
}
}
data.getTreeCheckedNodes(setting, nodes[i][childKey], checked, results);
if(onlyOne && results.length > 0) {
if (onlyOne && results.length > 0) {
break;
}
}
return results;
},
getTreeChangeCheckedNodes: function(setting, nodes, results) {
getTreeChangeCheckedNodes: function (setting, nodes, results) {
if (!nodes) return [];
var childKey = setting.data.key.children,
checkedKey = setting.data.key.checked;
@ -275,7 +280,7 @@
}
return results;
},
makeChkFlag: function(setting, node) {
makeChkFlag: function (setting, node) {
if (!node) return;
var childKey = setting.data.key.children,
checkedKey = setting.data.key.checked,
@ -292,11 +297,12 @@
} else if (cNode[checkedKey]) {
tmp = 2;
} else {
tmp = cNode.check_Child_State > 0 ? 2:0;
tmp = cNode.check_Child_State > 0 ? 2 : 0;
}
if (tmp == 2) {
chkFlag = 2; break;
} else if (tmp == 0){
chkFlag = 2;
break;
} else if (tmp == 0) {
chkFlag = 0;
}
} else if (setting.check.chkStyle == consts.checkbox.STYLE) {
@ -304,17 +310,20 @@
tmp = cNode.check_Child_State;
} else if (cNode.halfCheck === true) {
tmp = 1;
} else if (cNode[checkedKey] ) {
} else if (cNode[checkedKey]) {
tmp = (cNode.check_Child_State === -1 || cNode.check_Child_State === 2) ? 2 : 1;
} else {
tmp = (cNode.check_Child_State > 0) ? 1 : 0;
}
if (tmp === 1) {
chkFlag = 1; break;
chkFlag = 1;
break;
} else if (tmp === 2 && chkFlag > -1 && i > 0 && tmp !== chkFlag) {
chkFlag = 1; break;
chkFlag = 1;
break;
} else if (chkFlag === 2 && tmp > -1 && tmp < 2) {
chkFlag = 1; break;
chkFlag = 1;
break;
} else if (tmp > -1) {
chkFlag = tmp;
}
@ -325,9 +334,7 @@
}
},
//method of event proxy
_event = {
},
_event = {},
//method of event handler
_handler = {
onCheckNode: function (event, node) {
@ -343,7 +350,7 @@
setting.treeObj.trigger(consts.event.CHECK, [event, setting.treeId, node]);
return true;
},
onMouseoverCheck: function(event, node) {
onMouseoverCheck: function (event, node) {
if (node.chkDisabled === true) return false;
var setting = data.getSetting(event.data.treeId),
checkObj = $$(node, consts.id.CHECK, setting);
@ -351,7 +358,7 @@
view.setChkClass(setting, checkObj, node);
return true;
},
onMouseoutCheck: function(event, node) {
onMouseoutCheck: function (event, node) {
if (node.chkDisabled === true) return false;
var setting = data.getSetting(event.data.treeId),
checkObj = $$(node, consts.id.CHECK, setting);
@ -361,12 +368,10 @@
}
},
//method of tools for zTree
_tools = {
},
_tools = {},
//method of operate ztree dom
_view = {
checkNodeRelation: function(setting, node) {
checkNodeRelation: function (setting, node) {
var pNode, i, l,
childKey = setting.data.key.children,
checkedKey = setting.data.key.checked,
@ -375,7 +380,7 @@
var checkedList = data.getRadioCheckedList(setting);
if (node[checkedKey]) {
if (setting.check.radioType == r.TYPE_ALL) {
for (i = checkedList.length-1; i >= 0; i--) {
for (i = checkedList.length - 1; i >= 0; i--) {
pNode = checkedList[i];
if (pNode[checkedKey] && pNode != node) {
pNode[checkedKey] = false;
@ -408,10 +413,10 @@
}
} else {
if (node[checkedKey] && (!node[childKey] || node[childKey].length==0 || setting.check.chkboxType.Y.indexOf("s") > -1)) {
if (node[checkedKey] && (!node[childKey] || node[childKey].length == 0 || setting.check.chkboxType.Y.indexOf("s") > -1)) {
view.setSonNodeCheckBox(setting, node, true);
}
if (!node[checkedKey] && (!node[childKey] || node[childKey].length==0 || setting.check.chkboxType.N.indexOf("s") > -1)) {
if (!node[checkedKey] && (!node[childKey] || node[childKey].length == 0 || setting.check.chkboxType.N.indexOf("s") > -1)) {
view.setSonNodeCheckBox(setting, node, false);
}
if (node[checkedKey] && setting.check.chkboxType.Y.indexOf("p") > -1) {
@ -422,7 +427,7 @@
}
}
},
makeChkClass: function(setting, node) {
makeChkClass: function (setting, node) {
var checkedKey = setting.data.key.checked,
c = consts.checkbox, r = consts.radio,
checkboxType = setting.check.chkboxType;
@ -433,9 +438,9 @@
} else if (node.halfCheck) {
fullStyle = c.PART;
} else if (setting.check.chkStyle == r.STYLE) {
fullStyle = (node.check_Child_State < 1)? c.FULL:c.PART;
fullStyle = (node.check_Child_State < 1) ? c.FULL : c.PART;
} else {
fullStyle = node[checkedKey] ? ((node.check_Child_State === 2 || node.check_Child_State === -1) || notEffectByOtherNode ? c.FULL:c.PART) : ((node.check_Child_State < 1 || notEffectByOtherNode)? c.FULL:c.PART);
fullStyle = node[checkedKey] ? ((node.check_Child_State === 2 || node.check_Child_State === -1) || notEffectByOtherNode ? c.FULL : c.PART) : ((node.check_Child_State < 1 || notEffectByOtherNode) ? c.FULL : c.PART);
}
var chkName = setting.check.chkStyle + "_" + (node[checkedKey] ? c.TRUE : c.FALSE) + "_" + fullStyle;
chkName = (node.check_Focus && node.chkDisabled !== true) ? chkName + "_" + c.FOCUS : chkName;
@ -457,12 +462,12 @@
}
return chClass + (node.disabled ? " disabled" : "");
},
repairAllChk: function(setting, checked) {
repairAllChk: function (setting, checked) {
if (setting.check.enable && setting.check.chkStyle === consts.checkbox.STYLE) {
var checkedKey = setting.data.key.checked,
childKey = setting.data.key.children,
root = data.getRoot(setting);
for (var i = 0, l = root[childKey].length; i<l ; i++) {
for (var i = 0, l = root[childKey].length; i < l; i++) {
var node = root[childKey][i];
if (node.nocheck !== true && node.chkDisabled !== true) {
node[checkedKey] = checked;
@ -471,7 +476,7 @@
}
}
},
repairChkClass: function(setting, node) {
repairChkClass: function (setting, node) {
if (!node) return;
data.makeChkFlag(setting, node);
if (node.nocheck !== true) {
@ -479,13 +484,13 @@
view.setChkClass(setting, checkObj, node);
}
},
repairParentChkClass: function(setting, node) {
repairParentChkClass: function (setting, node) {
if (!node || !node.parentTId) return;
var pNode = node.getParentNode();
view.repairChkClass(setting, pNode);
view.repairParentChkClass(setting, pNode);
},
repairParentChkClassWithSelf: function(setting, node) {
repairParentChkClassWithSelf: function (setting, node) {
if (!node) return;
var childKey = setting.data.key.children;
if (node[childKey] && node[childKey].length > 0) {
@ -494,7 +499,7 @@
view.repairParentChkClass(setting, node);
}
},
repairSonChkDisabled: function(setting, node, chkDisabled, inherit) {
repairSonChkDisabled: function (setting, node, chkDisabled, inherit) {
if (!node) return;
var childKey = setting.data.key.children;
if (node.chkDisabled != chkDisabled) {
@ -508,7 +513,7 @@
}
}
},
repairParentChkDisabled: function(setting, node, chkDisabled, inherit) {
repairParentChkDisabled: function (setting, node, chkDisabled, inherit) {
if (!node) return;
if (node.chkDisabled != chkDisabled && inherit) {
node.chkDisabled = chkDisabled;
@ -516,7 +521,7 @@
view.repairChkClass(setting, node);
view.repairParentChkDisabled(setting, node.getParentNode(), chkDisabled, inherit);
},
setChkClass: function(setting, obj, node) {
setChkClass: function (setting, obj, node) {
if (!obj) return;
if (node.nocheck === true) {
obj.hide();
@ -525,7 +530,7 @@
}
obj.attr('class', view.makeChkClass(setting, node));
},
setParentNodeCheckBox: function(setting, node, value, srcNode) {
setParentNodeCheckBox: function (setting, node, value, srcNode) {
var childKey = setting.data.key.children,
checkedKey = setting.data.key.checked,
checkObj = $$(node, consts.id.CHECK, setting);
@ -555,7 +560,7 @@
}
}
},
setSonNodeCheckBox: function(setting, node, value, srcNode) {
setSonNodeCheckBox: function (setting, node, value, srcNode) {
if (!node) return;
var childKey = setting.data.key.children,
checkedKey = setting.data.key.checked,
@ -618,22 +623,22 @@
data.addZTreeTools(_zTreeTools);
var _createNodes = view.createNodes;
view.createNodes = function(setting, level, nodes, parentNode) {
view.createNodes = function (setting, level, nodes, parentNode) {
if (_createNodes) _createNodes.apply(view, arguments);
if (!nodes) return;
view.repairParentChkClassWithSelf(setting, parentNode);
}
};
var _removeNode = view.removeNode;
view.removeNode = function(setting, node) {
view.removeNode = function (setting, node) {
var parentNode = node.getParentNode();
if (_removeNode) _removeNode.apply(view, arguments);
if (!node || !parentNode) return;
view.repairChkClass(setting, parentNode);
view.repairParentChkClass(setting, parentNode);
}
};
var _appendNodes = view.appendNodes;
view.appendNodes = function(setting, level, nodes, parentNode, initFlag, openFlag) {
view.appendNodes = function (setting, level, nodes, parentNode, initFlag, openFlag) {
var html = "";
if (_appendNodes) {
html = _appendNodes.apply(view, arguments);
@ -642,5 +647,5 @@
data.makeChkFlag(setting, parentNode);
}
return html;
}
};
})(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);
}
}

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

@ -1,27 +1,28 @@
/**
* guy
* 局部树两个请求树 第一个请求构造树第二个请求获取节点
* @class BI.ListPartTree
* @extends BI.AsyncTree
* @class ListPartTree
* @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 () {
var self = this, o = this.options;
var op = BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA,
times: ++this.times
import { Listasynctree } from "./listasynctree";
import { shortcut, extend, Events, delay } from "@/core";
import { TreeView } from "../treeview";
@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();
o.itemsCreator(op, function (d) {
var hasNext = !!d.hasNext, nodes = d.items || [];
o.itemsCreator(op, d => {
const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue;
if (self._stop === true) {
return;
@ -35,24 +36,25 @@ BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
self.nodes.addNodes(null, self._dealWidthNodes(nodes));
}
});
},
}
_initTree: function (setting, keyword) {
var self = this, o = this.options;
_initTree(setting, keyword) {
const self = this, o = this.options;
this.times = 1;
var tree = this.tree;
const tree = this.tree;
tree.empty();
self.tip.setVisible(false);
this.loading();
var op = BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA,
times: this.times
const op = extend({}, o.paras, {
type: TreeView.REQ_TYPE_INIT_DATA,
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;
}
var hasNext = !!d.hasNext, nodes = d.items || [];
const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue;
// 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的
callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []);
@ -63,30 +65,28 @@ BI.ListPartTree = BI.inherit(BI.ListAsyncTree, {
} else {
self.tip.setLoaded();
}
self.fireEvent(BI.Events.AFTERINIT);
};
self.fireEvent(Events.AFTERINIT);
}
function callback (nodes) {
function callback(nodes) {
if (self._stop === true) {
return;
}
self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes);
}
BI.delay(function () {
delay(() => {
o.itemsCreator(op, complete);
}, 100);
},
}
// 生成树方法
stroke: function (config) {
var o = this.options;
stroke(config) {
const o = this.options;
delete o.paras.keyword;
BI.extend(o.paras, config);
extend(o.paras, config);
delete o.paras.lastSearchValue;
var setting = this._configSetting();
const setting = this._configSetting();
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
* @extends BI.AsyncTree
*/
BI.PartTree = BI.inherit(BI.AsyncTree, {
_defaultConfig: function () {
return BI.extend(BI.PartTree.superclass._defaultConfig.apply(this, arguments), {});
},
_loadMore: function () {
var self = this, o = this.options;
var op = BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA,
times: ++this.times
import { isEmpty, shortcut, extend, deepClone, each, isNotEmptyArray, Events, delay, isNull } from "@/core";
import { Asynctree } from "./asynctree";
import { TreeView } from "./treeview";
@shortcut()
export class PartTree extends Asynctree {
static xtype = "bi.part_tree";
static EVENT_CLICK_TREE_NODE = "EVENT_CLICK_TREE_NODE";
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();
o.itemsCreator(op, function (d) {
var hasNext = !!d.hasNext, nodes = d.items || [];
o.itemsCreator(op, d => {
const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue;
if (self._stop === true) {
return;
@ -31,71 +41,73 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
self.nodes.addNodes(null, self._dealWidthNodes(nodes));
}
});
},
}
_selectTreeNode: function (treeId, treeNode) {
var self = this, o = this.options;
var parentValues = BI.deepClone(treeNode.parentValues || self._getParentValues(treeNode));
var name = this._getNodeValue(treeNode);
this.fireEvent(BI.PartTree.EVENT_CLICK_TREE_NODE);
_selectTreeNode(...args) {
const self = this, o = this.options;
const [treeId, treeNode] = args;
const parentValues = deepClone(treeNode.parentValues || self._getParentValues(treeNode));
const name = this._getNodeValue(treeNode);
this.fireEvent(PartTree.EVENT_CLICK_TREE_NODE);
if (treeNode.checked === true) {
this.options.paras.selectedValues = this._getUnionValue();
// this._buildTree(self.options.paras.selectedValues, BI.concat(parentValues, name));
o.itemsCreator(BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_ADJUST_DATA,
// this._buildTree(self.options.paras.selectedValues, concat(parentValues, name));
o.itemsCreator(extend({}, o.paras, {
type: TreeView.REQ_TYPE_ADJUST_DATA,
curSelectedValue: name,
parentValues: parentValues
parentValues,
}), function (res) {
self.options.paras.selectedValues = res;
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments);
this.seMethos(...args);
});
} else {
// 如果选中的值中不存在该值不处理
// 因为反正是不选中,没必要管
var t = this.options.paras.selectedValues;
var p = parentValues.concat(name);
for (var i = 0, len = p.length; i < len; i++) {
let t = this.options.paras.selectedValues;
const p = parentValues.concat(name);
for (let i = 0, len = p.length; i < len; i++) {
t = t[p[i]];
if (t == null) {
return;
}
// 选中中国-江苏, 搜索南京,取消勾选
if (BI.isEmpty(t)) {
if (isEmpty(t)) {
break;
}
}
o.itemsCreator(BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_SELECT_DATA,
o.itemsCreator(extend({}, o.paras, {
type: TreeView.REQ_TYPE_SELECT_DATA,
notSelectedValue: name,
parentValues: parentValues
}), function (new_values) {
parentValues,
}), new_values => {
self.options.paras.selectedValues = new_values;
BI.AsyncTree.superclass._selectTreeNode.apply(self, arguments);
this.seMethos(...args);
});
}
},
}
_getSelectedValues: function () {
var self = this;
var hashMap = {};
var rootNoots = this.nodes.getNodes();
track(rootNoots);
_getSelectedValues() {
const self = this;
const hashMap = {};
const rootNodes = this.nodes.getNodes();
track(rootNodes);
function track(nodes) {
BI.each(nodes, function (i, node) {
var checkState = node.getCheckStatus();
each(nodes, (i, node) => {
const checkState = node.getCheckStatus();
if (checkState.checked === false) {
return true;
}
var parentValues = node.parentValues || self._getParentValues(node);
const parentValues = node.parentValues || self._getParentValues(node);
// 把文字中的html去掉,其实就是把文字颜色去掉
var values = parentValues.concat([self._getNodeValue(node)]);
const values = parentValues.concat([self._getNodeValue(node)]);
self._buildTree(hashMap, values);
// if(checkState.checked === true && checkState.half === false && nodes[i].flag === true){
// continue;
// }
if (BI.isNotEmptyArray(node.children)) {
if (isNotEmptyArray(node.children)) {
track(node.children);
return true;
}
if (checkState.half === true) {
@ -105,24 +117,25 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
}
return hashMap;
},
}
_initTree: function (setting, keyword) {
var self = this, o = this.options;
_initTree(setting, keyword) {
const self = this, o = this.options;
this.times = 1;
var tree = this.tree;
const tree = this.tree;
tree.empty();
self.tip.setVisible(false);
this.loading();
var op = BI.extend({}, o.paras, {
type: BI.TreeView.REQ_TYPE_INIT_DATA,
times: this.times
const op = extend({}, o.paras, {
type: TreeView.REQ_TYPE_INIT_DATA,
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;
}
var hasNext = !!d.hasNext, nodes = d.items || [];
const hasNext = !!d.hasNext, nodes = d.items || [];
o.paras.lastSearchValue = d.lastSearchValue;
// 没有请求到数据也要初始化空树, 如果不初始化, 树就是上一次构造的树, 节点信息都是过期的
callback(nodes.length > 0 ? self._dealWidthNodes(nodes) : []);
@ -133,8 +146,8 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
} else {
self.tip.setLoaded();
}
self.fireEvent(BI.Events.AFTERINIT);
};
self.fireEvent(Events.AFTERINIT);
}
function callback(nodes) {
if (self._stop === true) {
@ -143,40 +156,41 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
self.nodes = BI.$.fn.zTree.init(tree.element, setting, nodes);
}
BI.delay(function () {
delay(() => {
o.itemsCreator(op, complete);
}, 100);
},
}
getValue: function () {
return BI.deepClone(this.options.paras.selectedValues || {});
},
getValue() {
return deepClone(this.options.paras.selectedValues || {});
}
_getUnionValue: function () {
_getUnionValue() {
if (!this.nodes) {
return {};
}
var checkedValues = this._getSelectedValues();
if (BI.isEmpty(checkedValues)) {
return BI.deepClone(this.options.paras.selectedValues);
const checkedValues = this._getSelectedValues();
if (isEmpty(checkedValues)) {
return deepClone(this.options.paras.selectedValues);
}
if (BI.isEmpty(this.options.paras.selectedValues)) {
if (isEmpty(this.options.paras.selectedValues)) {
return checkedValues;
}
return this._union(checkedValues, this.options.paras.selectedValues);
},
}
_union: function (valueA, valueB) {
var self = this;
var map = {};
_union(valueA, valueB) {
const self = this;
const map = {};
track([], valueA, valueB);
track([], valueB, valueA);
function track(parent, node, compare) {
BI.each(node, function (n, item) {
if (BI.isNull(compare[n])) {
each(node, (n, item) => {
if (isNull(compare[n])) {
self._addTreeNode(map, parent, n, item);
} else if (BI.isEmpty(compare[n])) {
} else if (isEmpty(compare[n])) {
self._addTreeNode(map, parent, n, {});
} else {
track(parent.concat([n]), node[n], compare[n]);
@ -185,18 +199,15 @@ BI.PartTree = BI.inherit(BI.AsyncTree, {
}
return map;
},
}
// 生成树方法
stroke: function (config) {
var o = this.options;
stroke(config) {
const o = this.options;
delete o.paras.keyword;
BI.extend(o.paras, config);
extend(o.paras, config);
delete o.paras.lastSearchValue;
var setting = this._configSetting();
const setting = this._configSetting();
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
* @extends BI.TreeView
*/
BI.DisplayTree = BI.inherit(BI.TreeView, {
_defaultConfig: function () {
return BI.extend(BI.DisplayTree.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-display-tree"
import { extend } from "@/core";
import { TreeView } from "./treeview";
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 () {
var setting = {
_configSetting() {
function beforeCollapse(treeId, treeNode) {
return false;
}
return {
view: {
selectedMulti: false,
dblClickExpand: false,
showIcon: false,
nameIsHTML: true,
showTitle: false
showTitle: false,
},
data: {
key: {
title: "title",
name: "text"
name: "text",
},
simpleData: {
enable: true
}
enable: true,
},
},
callback: {
beforeCollapse: beforeCollapse
}
beforeCollapse,
},
};
function beforeCollapse(treeId, treeNode) {
return false;
}
return setting;
},
_dealWidthNodes: function (nodes) {
nodes = BI.DisplayTree.superclass._dealWidthNodes.apply(this, arguments);
var self = this, o = this.options;
BI.each(nodes, function (i, node) {
_dealWidthNodes(nodes) {
nodes = super._dealWidthNodes(...arguments);
BI.each(nodes, (i, node) => {
node.isParent = node.isParent || node.parent;
if (node.text == null) {
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);
return 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
* @extends BI.TreeView
*/
BI.ListDisplayTree = BI.inherit(BI.ListTreeView, {
_defaultConfig: function () {
return BI.extend(BI.ListDisplayTree.superclass._defaultConfig.apply(this, arguments), {
extraCls: "bi-list-display-tree"
});
},
_init: function () {
BI.ListDisplayTree.superclass._init.apply(this, arguments);
},
import { Listtreeview } from "./list/listtreeview";
import { each, shortcut } from "@/core";
@shortcut()
export class ListDisplayTree extends Listtreeview {
static xtype = "bi.list_display_tree";
static EVENT_CHANGE = "EVENT_CHANGE";
props() {
return {
extraCls: "bi-list-display-tree",
};
}
// 配置属性
_configSetting: function () {
var setting = {
_configSetting() {
function beforeCollapse(treeId, treeNode) {
return false;
}
function getFont(treeId, node) {
return node.isLeaf ? {} : { color: "#999999" };
}
return {
view: {
selectedMulti: false,
dblClickExpand: false,
showIcon: false,
nameIsHTML: true,
showTitle: false,
fontCss: getFont
fontCss: getFont,
},
data: {
key: {
title: "title",
name: "text"
name: "text",
},
simpleData: {
enable: true
}
enable: true,
},
},
callback: {
beforeCollapse: beforeCollapse
}
beforeCollapse,
},
};
function beforeCollapse(treeId, treeNode) {
return false;
}
function getFont(treeId, node) {
return node.isLeaf ? {} : {color: "#999999"};
}
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) {
_dealWidthNodes(nodes) {
nodes = super._dealWidthNodes(...arguments);
each(nodes, (i, node) => {
node.isParent = node.isParent || node.parent;
if (node.text == null) {
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 () {
BI.ListDisplayTree.superclass.destroy.apply(this, arguments);
return nodes;
}
});
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.
* @class BI.SimpleTreeView
* @extends BI.Widget
* @class SimpleTreeView
* @extends Widget
*/
BI.SimpleTreeView = BI.inherit(BI.Widget, {
_defaultConfig: function () {
return BI.extend(BI.SimpleTreeView.superclass._defaultConfig.apply(this, arguments), {
import {
shortcut,
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",
itemsCreator: BI.emptyFn,
items: null
});
},
_init: function () {
BI.SimpleTreeView.superclass._init.apply(this, arguments);
var self = this, o = this.options;
this.structure = new BI.Tree();
this.tree = BI.createWidget({
type: "bi.tree_view",
itemsCreator: emptyFn,
items: null,
};
}
_init() {
super._init(...arguments);
const self = this, o = this.options;
this.structure = new Tree();
this.tree = createWidget({
type: TreeView.xtype,
element: this,
itemsCreator: function (op, callback) {
var fn = function (items) {
itemsCreator(op, callback) {
function fn(items) {
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);
} else {
o.itemsCreator(op, fn);
}
}
},
});
this.tree.on(BI.TreeView.EVENT_CHANGE, function () {
self.fireEvent(BI.SimpleTreeView.EVENT_CHANGE, arguments);
this.tree.on(TreeView.EVENT_CHANGE, function () {
self.fireEvent(SimpleTreeView.EVENT_CHANGE, arguments);
});
if (BI.isNotEmptyArray(o.items)) {
if (isNotEmptyArray(o.items)) {
this.populate();
}
if (BI.isNotNull(o.value)) {
if (isNotNull(o.value)) {
this.setValue(o.value);
}
},
}
populate: function (items, keyword) {
populate(items, keyword) {
if (items) {
this.options.items = items;
}
this.tree.stroke({
keyword: keyword
keyword,
});
},
}
_digest: function (v) {
_digest(v) {
v || (v = []);
var self = this, map = {};
var selected = [];
BI.each(v, function (i, val) {
var node = self.structure.search(val, "value");
const self = this, map = {};
const selected = [];
each(v, (i, val) => {
const node = self.structure.search(val, "value");
if (node) {
var p = node;
let p = node;
p = p.getParent();
if (p) {
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));
},
}
_getValue() {
const result = [], val = this.tree.getValue();
_getValue: function () {
var self = this, result = [], val = this.tree.getValue();
var track = function (nodes) {
BI.each(nodes, function (key, node) {
if (BI.isEmpty(node)) {
function track(nodes) {
each(nodes, (key, node) => {
if (isEmpty(node)) {
result.push(key);
} else {
track(node);
@ -101,27 +123,27 @@ BI.SimpleTreeView = BI.inherit(BI.Widget, {
});
};
track(val);
return result;
},
}
empty: function () {
empty() {
this.tree.empty();
},
}
getValue: function () {
var self = this, result = [], val = this._getValue();
BI.each(val, function (i, key) {
var target = self.structure.search(key, "value");
getValue() {
const self = this, result = [], val = this._getValue();
each(val, (i, key) => {
const target = self.structure.search(key, "value");
if (target) {
self.structure._traverse(target, function (node) {
self.structure._traverse(target, node => {
if (node.isLeaf()) {
result.push(node.value);
}
});
}
});
return result;
}
});
BI.SimpleTreeView.EVENT_CHANGE = "EVENT_CHANGE";
BI.shortcut("bi.simple_tree", BI.SimpleTreeView);
}

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

@ -0,0 +1,73 @@
/**
* @author windy
* @version 2.0
* Created by windy on 2020/1/8
* 提供节点分页加载方式
*/
import { createWidget, debounce, has, OB, size, each, VerticalLayout } from "@/core";
import { LoadingBar } from "@/base";
export class TreeRenderPageService extends OB {
nodeLists = {};
_getLoadingBar(tId) {
const tip = createWidget({
type: LoadingBar.xtype,
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: VerticalLayout.xtype,
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 = {};
}
}

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

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

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

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

1
src/core/platform/web/index.js

@ -1,4 +1,3 @@
export * as DOM from "./dom";
export * from "./detectElementResize";
export * from "./function";
export * from "./load";

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

@ -1,3 +1,4 @@
/* eslint-disable */
/* !
* jQuery Mousewheel 3.1.13
*
@ -22,14 +23,14 @@
}(function ($) {
var toFix = ["wheel", "mousewheel", "DOMMouseScroll", "MozMousePixelScroll"],
toBind = ( "onwheel" in document || document.documentMode >= 9 ) ?
toBind = ("onwheel" in document || document.documentMode >= 9) ?
["wheel"] : ["mousewheel", "DomMouseScroll", "MozMousePixelScroll"],
slice = Array.prototype.slice,
nullLowestDeltaTimeout, lowestDelta;
if ( $.event.fixHooks ) {
for ( var i = toFix.length; i; ) {
$.event.fixHooks[ toFix[--i] ] = $.event.mouseHooks;
if ($.event.fixHooks) {
for (var i = toFix.length; i;) {
$.event.fixHooks[toFix[--i]] = $.event.mouseHooks;
}
}
@ -37,9 +38,9 @@
version: "3.1.12",
setup: function () {
if ( this.addEventListener ) {
for ( var i = toBind.length; i; ) {
this.addEventListener( toBind[--i], handler, false );
if (this.addEventListener) {
for (var i = toBind.length; i;) {
this.addEventListener(toBind[--i], handler, false);
}
} else {
this.onmousewheel = handler;
@ -47,9 +48,9 @@
},
teardown: function () {
if ( this.removeEventListener ) {
for ( var i = toBind.length; i; ) {
this.removeEventListener( toBind[--i], handler, false );
if (this.removeEventListener) {
for (var i = toBind.length; i;) {
this.removeEventListener(toBind[--i], handler, false);
}
} else {
this.onmousewheel = null;
@ -73,7 +74,7 @@
});
function handler (event) {
function handler(event) {
var orgEvent = event || _global.event,
args = slice.call(arguments, 1),
delta = 0,
@ -86,13 +87,21 @@
event.type = "mousewheel";
// Old school scrollwheel delta
if ( "detail" in orgEvent ) { deltaY = orgEvent.detail * -1; }
if ( "wheelDelta" in orgEvent ) { deltaY = orgEvent.wheelDelta; }
if ( "wheelDeltaY" in orgEvent ) { deltaY = orgEvent.wheelDeltaY; }
if ( "wheelDeltaX" in orgEvent ) { deltaX = orgEvent.wheelDeltaX * -1; }
if ("detail" in orgEvent) {
deltaY = orgEvent.detail * -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
if ( "axis" in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) {
if ("axis" in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS) {
deltaX = deltaY * -1;
deltaY = 0;
}
@ -101,29 +110,33 @@
delta = deltaY === 0 ? deltaX : deltaY;
// New school wheel delta (wheel event)
if ( "deltaY" in orgEvent ) {
if ("deltaY" in orgEvent) {
deltaY = orgEvent.deltaY * -1;
delta = deltaY;
}
if ( "deltaX" in orgEvent ) {
if ("deltaX" in orgEvent) {
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
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
// There are three delta modes:
// * deltaMode 0 is by pixels, nothing to do
// * deltaMode 1 is by lines
// * deltaMode 2 is by pages
if ( orgEvent.deltaMode === 1 ) {
if (orgEvent.deltaMode === 1) {
var lineHeight = 40;
delta *= lineHeight;
deltaY *= lineHeight;
deltaX *= lineHeight;
} else if ( orgEvent.deltaMode === 2 ) {
} else if (orgEvent.deltaMode === 2) {
var pageHeight = 800;
delta *= pageHeight;
deltaY *= pageHeight;
@ -131,19 +144,19 @@
}
// Store lowest absolute delta to normalize the delta values
absDelta = Math.max( Math.abs(deltaY), Math.abs(deltaX) );
absDelta = Math.max(Math.abs(deltaY), Math.abs(deltaX));
if ( !lowestDelta || absDelta < lowestDelta ) {
if (!lowestDelta || absDelta < lowestDelta) {
lowestDelta = absDelta;
// Adjust older deltas if necessary
if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
if (shouldAdjustOldDeltas(orgEvent, absDelta)) {
lowestDelta /= 40;
}
}
// Adjust older deltas if necessary
if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) {
if (shouldAdjustOldDeltas(orgEvent, absDelta)) {
// Divide all the things by 40!
delta /= 40;
deltaX /= 40;
@ -151,12 +164,12 @@
}
// Get a whole, normalized value for the deltas
delta = Math[ delta >= 1 ? "floor" : "ceil" ](delta / lowestDelta);
deltaX = Math[ deltaX >= 1 ? "floor" : "ceil" ](deltaX / lowestDelta);
deltaY = Math[ deltaY >= 1 ? "floor" : "ceil" ](deltaY / lowestDelta);
delta = Math[delta >= 1 ? "floor" : "ceil"](delta / lowestDelta);
deltaX = Math[deltaX >= 1 ? "floor" : "ceil"](deltaX / lowestDelta);
deltaY = Math[deltaY >= 1 ? "floor" : "ceil"](deltaY / lowestDelta);
// Normalise offsetX and offsetY properties
if ( special.settings.normalizeOffset && this.getBoundingClientRect ) {
if (special.settings.normalizeOffset && this.getBoundingClientRect) {
var boundingRect = this.getBoundingClientRect();
offsetX = event.clientX - boundingRect.left;
offsetY = event.clientY - boundingRect.top;
@ -180,17 +193,19 @@
// handle multiple device types that give different
// a different lowestDelta
// Ex: trackpad = 3 and mouse wheel = 120
if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); }
if (nullLowestDeltaTimeout) {
clearTimeout(nullLowestDeltaTimeout);
}
nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200);
return ($.event.dispatch || $.event.handle).apply(this, args);
}
function nullLowestDelta () {
function nullLowestDelta() {
lowestDelta = null;
}
function shouldAdjustOldDeltas (orgEvent, absDelta) {
function shouldAdjustOldDeltas(orgEvent, absDelta) {
// If this is an older event and the delta is divisable by 120,
// then we are assuming that the browser is treating this as an
// older mouse wheel event and that we should divide the deltas

106
src/core/utils/color.js

@ -1,53 +1,51 @@
import { parseInt, parseFloat, isNull, isKey } from "../2.base";
import * as DOMUtils from "../platform/web/dom";
export const DOM = {
isColor(color) {
return color && (this.isRGBColor(color) || this.isHexColor(color));
},
export function isColor(color) {
return color && (isRGBColor(color) || isHexColor(color));
}
isRGBColor(color) {
export function isRGBColor(color) {
if (!color) {
return false;
}
return color.substr(0, 3) === "rgb";
},
}
isHexColor(color) {
export function isHexColor(color) {
if (!color) {
return false;
}
return color[0] === "#" && color.length === 7;
},
}
isDarkColor(hex) {
if (!hex || !this.isHexColor(hex)) {
export function isDarkColor(hex) {
if (!hex || !isHexColor(hex)) {
return false;
}
const rgb = this.rgb2json(this.hex2rgb(hex));
const rgb = rgb2json(hex2rgb(hex));
const grayLevel = Math.round(rgb.r * 0.299 + rgb.g * 0.587 + rgb.b * 0.114);
if (grayLevel < 192/** 网上给的是140**/) {
return true;
}
return false;
},
}
// 获取对比颜色
getContrastColor(color) {
if (!color || !this.isColor(color)) {
// 获取对比颜色
export function getContrastColor(color) {
if (!color || !isColor(color)) {
return "";
}
if (this.isDarkColor(color)) {
if (isDarkColor(color)) {
return "#FFFFFF";
}
return "#3D4D66";
},
}
rgb2hex(rgbColour) {
export function rgb2hex(rgbColour) {
if (!rgbColour || rgbColour.substr(0, 3) !== "rgb") {
return "";
}
@ -56,31 +54,33 @@ export const DOM = {
const green = parseInt(rgbValues[1]);
const blue = parseInt(rgbValues[2]);
const hexColour = `#${this.int2hex(red)}${this.int2hex(green)}${this.int2hex(blue)}`;
const hexColour = `#${int2hex(red)}${int2hex(green)}${int2hex(blue)}`;
return hexColour;
},
}
_hue2rgb(m1, m2, h) {
function _hue2rgb(m1, m2, h) {
h = (h < 0) ? h + 1 : ((h > 1) ? h - 1 : h);
if (h * 6 < 1) return m1 + (m2 - m1) * h * 6;
if (h * 2 < 1) return m2;
if (h * 3 < 2) return m1 + (m2 - m1) * (0.66666 - h) * 6;
return m1;
},
}
hsl2rgb(hsl) {
export function hsl2rgb(hsl) {
const h = hsl[0], s = hsl[1], l = hsl[2];
const m2 = (l <= 0.5) ? l * (s + 1) : l + s - l * s;
const m1 = l * 2 - m2;
return [this._hue2rgb(m1, m2, h + 0.33333),
this._hue2rgb(m1, m2, h),
this._hue2rgb(m1, m2, h - 0.33333)];
},
return [
_hue2rgb(m1, m2, h + 0.33333),
_hue2rgb(m1, m2, h),
_hue2rgb(m1, m2, h - 0.33333)
];
}
rgb2hsl(rgb) {
export function rgb2hsl(rgb) {
let h, s;
const r = rgb[0], g = rgb[1], b = rgb[2];
const min = Math.min(r, Math.min(g, b));
@ -100,13 +100,13 @@ export const DOM = {
}
return [h, s, l];
},
}
rgb2json(rgbColour) {
export function rgb2json(rgbColour) {
if (!rgbColour) {
return {};
}
if (!this.isRGBColor(rgbColour)) {
if (!isRGBColor(rgbColour)) {
return {};
}
const rgbValues = rgbColour.match(/\d+(\.\d+)?/g);
@ -116,9 +116,9 @@ export const DOM = {
g: parseInt(rgbValues[1]),
b: parseInt(rgbValues[2]),
};
},
}
rgba2json(rgbColour) {
export function rgba2json(rgbColour) {
if (!rgbColour) {
return {};
}
@ -130,56 +130,60 @@ export const DOM = {
b: parseInt(rgbValues[2]),
a: parseFloat(rgbValues[3]),
};
},
}
json2rgb(rgb) {
export function json2rgb(rgb) {
if (!isKey(rgb.r) || !isKey(rgb.g) || !isKey(rgb.b)) {
return "";
}
return `rgb(${rgb.r},${rgb.g},${rgb.b})`;
},
}
json2rgba(rgba) {
export function json2rgba(rgba) {
if (!isKey(rgba.r) || !isKey(rgba.g) || !isKey(rgba.b)) {
return "";
}
return `rgba(${rgba.r},${rgba.g},${rgba.b},${rgba.a})`;
},
}
int2hex(strNum) {
export function int2hex(strNum) {
const hexdig = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f"];
return `${hexdig[strNum >>> 4]}${hexdig[strNum & 15]}`;
},
}
hex2rgb(color) {
export function hex2rgb(color) {
if (!color) {
return "";
}
if (!this.isHexColor(color)) {
if (!isHexColor(color)) {
return color;
}
let tempValue = "rgb(", colorArray;
if (color.length === 7) {
colorArray = [parseInt(`0x${color.substring(1, 3)}`),
colorArray = [
parseInt(`0x${color.substring(1, 3)}`),
parseInt(`0x${color.substring(3, 5)}`),
parseInt(`0x${color.substring(5, 7)}`)];
parseInt(`0x${color.substring(5, 7)}`)
];
} else if (color.length === 4) {
colorArray = [parseInt(`0x${color.substring(1, 2)}`),
colorArray = [
parseInt(`0x${color.substring(1, 2)}`),
parseInt(`0x${color.substring(2, 3)}`),
parseInt(`0x${color.substring(3, 4)}`)];
parseInt(`0x${color.substring(3, 4)}`)
];
}
tempValue += `${colorArray[0]},`;
tempValue += `${colorArray[1]},`;
tempValue += `${colorArray[2]})`;
return tempValue;
},
}
rgba2rgb(rgbColor, bgColor) {
export function rgba2rgb(rgbColor, bgColor) {
if (isNull(bgColor)) {
bgColor = 1;
}
@ -198,7 +202,5 @@ export const DOM = {
return `rgb(${Math.floor(255 * (bgColor * (1 - A)) + R * A)},${
Math.floor(255 * (bgColor * (1 - A)) + G * A)},${
Math.floor(255 * (bgColor * (1 - A)) + B * A)})`;
},
}
...DOMUtils,
};

2
src/core/platform/web/dom.js → src/core/utils/dom.js

@ -1,7 +1,7 @@
/**
* 对DOM操作的通用函数
*/
import { each, isEmpty, isNull } from "../../2.base";
import { each, isEmpty, isNull } from "../2.base";
export function ready(fn) {
BI.Widget._renderEngine.createElement(document).ready(fn);

10
src/core/utils/index.js

@ -1,4 +1,12 @@
export * from "./events";
export * from "./i18n";
export { makeFirstPY } from "./chinesePY";
export { DOM } from "./color";
import * as platformDom from "./dom";
import * as colorDom from "./color";
export const DOM = {
...platformDom,
...colorDom
};

2
src/core/wrapper/index.js

@ -1,2 +1,2 @@
export { Layout } from "./layout";
export { Layout } from "./layout.js";
export * from "./layout/index";

Loading…
Cancel
Save