|
|
|
import { ButtonTree, Expander } from "../combination";
|
|
|
|
import {
|
|
|
|
VerticalLayout,
|
|
|
|
Widget,
|
|
|
|
shortcut,
|
|
|
|
extend,
|
|
|
|
emptyFn,
|
|
|
|
Tree,
|
|
|
|
each,
|
|
|
|
isNotEmptyArray,
|
|
|
|
deepClone,
|
|
|
|
stripEL,
|
|
|
|
isWidget,
|
|
|
|
clone,
|
|
|
|
isNotNull,
|
|
|
|
isNull,
|
|
|
|
createWidget,
|
|
|
|
Controller,
|
|
|
|
Events
|
|
|
|
} from "@/core";
|
|
|
|
|
|
|
|
/**
|
|
|
|
*
|
|
|
|
* 自定义树
|
|
|
|
*
|
|
|
|
* Created by GUY on 2015/9/7.
|
|
|
|
* @class CustomTree
|
|
|
|
* @extends Single
|
|
|
|
*/
|
|
|
|
|
|
|
|
@shortcut()
|
|
|
|
export class CustomTree extends Widget {
|
|
|
|
static xtype = "bi.custom_tree";
|
|
|
|
static EVENT_CHANGE = "EVENT_CHANGE";
|
|
|
|
|
|
|
|
_defaultConfig() {
|
|
|
|
return extend(super._defaultConfig(...arguments), {
|
|
|
|
baseCls: "bi-custom-tree",
|
|
|
|
expander: {
|
|
|
|
el: {},
|
|
|
|
popup: {
|
|
|
|
type: CustomTree.xtype,
|
|
|
|
},
|
|
|
|
},
|
|
|
|
|
|
|
|
items: [],
|
|
|
|
itemsCreator: emptyFn,
|
|
|
|
|
|
|
|
el: {
|
|
|
|
type: ButtonTree.xtype,
|
|
|
|
chooseType: 0,
|
|
|
|
layouts: [
|
|
|
|
{
|
|
|
|
type: VerticalLayout.xtype,
|
|
|
|
}
|
|
|
|
],
|
|
|
|
},
|
|
|
|
});
|
|
|
|
}
|
|
|
|
_init() {
|
|
|
|
super._init(...arguments);
|
|
|
|
this.initTree(this.options.items);
|
|
|
|
}
|
|
|
|
|
|
|
|
_formatItems(nodes) {
|
|
|
|
const { expander, itemsCreator } = this.options;
|
|
|
|
nodes = Tree.transformToTreeFormat(nodes);
|
|
|
|
|
|
|
|
const items = [];
|
|
|
|
each(nodes, (i, node) => {
|
|
|
|
if (isNotEmptyArray(node.children) || node.isParent === true) {
|
|
|
|
const item = extend(
|
|
|
|
{
|
|
|
|
type: Expander.xtype,
|
|
|
|
el: {
|
|
|
|
value: node.value,
|
|
|
|
},
|
|
|
|
popup: { type: CustomTree.xtype },
|
|
|
|
},
|
|
|
|
deepClone(expander),
|
|
|
|
{
|
|
|
|
id: node.id,
|
|
|
|
pId: node.pId,
|
|
|
|
key: node.key,
|
|
|
|
}
|
|
|
|
);
|
|
|
|
let el = stripEL(node);
|
|
|
|
if (!isWidget(el)) {
|
|
|
|
el = clone(el);
|
|
|
|
delete el.children;
|
|
|
|
extend(item.el, el);
|
|
|
|
} else {
|
|
|
|
item.el = el;
|
|
|
|
}
|
|
|
|
item.popup.expander = deepClone(expander);
|
|
|
|
item.items = item.popup.items = node.children;
|
|
|
|
item.itemsCreator = item.popup.itemsCreator = (op, ...arg) => {
|
|
|
|
if (isNotNull(op.node)) {
|
|
|
|
// 从子节点传过来的itemsCreator直接向上传递
|
|
|
|
return itemsCreator(op, ...arg);
|
|
|
|
}
|
|
|
|
const args = Array.prototype.slice.call([op, ...arg], 0);
|
|
|
|
args[0].node = node;
|
|
|
|
|
|
|
|
return itemsCreator.apply(this, args);
|
|
|
|
};
|
|
|
|
isNull(item.popup.el) && (item.popup.el = deepClone(this.options.el));
|
|
|
|
items.push(item);
|
|
|
|
} else {
|
|
|
|
items.push(node);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
return items;
|
|
|
|
}
|
|
|
|
// 构造树结构,
|
|
|
|
initTree(nodes) {
|
|
|
|
const { el, itemsCreator, value } = this.options;
|
|
|
|
this.tree = createWidget(el, {
|
|
|
|
element: this,
|
|
|
|
items: this._formatItems(nodes),
|
|
|
|
itemsCreator: (op, callback) => {
|
|
|
|
itemsCreator.apply(this, [
|
|
|
|
op,
|
|
|
|
items => {
|
|
|
|
const args = Array.prototype.slice.call(arguments, 0);
|
|
|
|
args[0] = this._formatItems(items);
|
|
|
|
callback(...args);
|
|
|
|
}
|
|
|
|
]);
|
|
|
|
},
|
|
|
|
value,
|
|
|
|
});
|
|
|
|
this.tree.on(Controller.EVENT_CHANGE, (type, val, obj, ...args) => {
|
|
|
|
this.fireEvent(Controller.EVENT_CHANGE, type, val, obj, ...args);
|
|
|
|
if (type === Events.CLICK) {
|
|
|
|
this.fireEvent(CustomTree.EVENT_CHANGE, val, obj);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
// 生成树方法
|
|
|
|
stroke(nodes) {
|
|
|
|
this.populate(...arguments);
|
|
|
|
}
|
|
|
|
|
|
|
|
populate(nodes) {
|
|
|
|
const args = Array.prototype.slice.call(arguments, 0);
|
|
|
|
if (arguments.length > 0) {
|
|
|
|
args[0] = this._formatItems(nodes);
|
|
|
|
}
|
|
|
|
this.tree.populate(...args);
|
|
|
|
}
|
|
|
|
|
|
|
|
setValue(v) {
|
|
|
|
this.tree && this.tree.setValue(v);
|
|
|
|
}
|
|
|
|
|
|
|
|
getValue() {
|
|
|
|
return this.tree ? this.tree.getValue() : [];
|
|
|
|
}
|
|
|
|
|
|
|
|
getAllButtons() {
|
|
|
|
return this.tree ? this.tree.getAllButtons() : [];
|
|
|
|
}
|
|
|
|
|
|
|
|
getAllLeaves() {
|
|
|
|
return this.tree ? this.tree.getAllLeaves() : [];
|
|
|
|
}
|
|
|
|
|
|
|
|
getNodeById(id) {
|
|
|
|
return this.tree && this.tree.getNodeById(id);
|
|
|
|
}
|
|
|
|
|
|
|
|
getNodeByValue(id) {
|
|
|
|
return this.tree && this.tree.getNodeByValue(id);
|
|
|
|
}
|
|
|
|
|
|
|
|
empty() {
|
|
|
|
this.tree.empty();
|
|
|
|
}
|
|
|
|
}
|