Я не могу развернуть свой узел дерева, когда я могу видеть объект Children в моем узле, а также, когда я пытаюсь развернуть, он может вызвать событие TreeExpand. также я не могу видеть свою панель инструментов и кнопки. Я попытался украсить модальный объект, а также попытался вручную развернуть событие дерева на дереве, вызвав tree.expandTree(node.getPath()).
Пожалуйста, помогите мне с этим.
Форма моего дерева :
Ext.define('puf.view.PI.OrgansitesTree', {
extend: 'Ext.tree.Panel',
alias: 'widget.organsitesTree',
id: 'organsitesTree',
itemId: 'organsitesTree',
requires: ['Ext.tree.Column', 'Ext.tree.View', 'Ext.toolbar.Toolbar'],
rowLines: true,
scrollable: 'vertical',
rootVisible: false,
initComponent: function() {
var me = this;
Ext.applyIf(me, {
nodesAndParents: null,
columns: [{
xtype: 'treecolumn',
dataIndex: 'title',
text: 'Title',
flex: 1
}],
listeners: {
checkchange: {
fn: me.onTreepanelCheckChange,
scope: me
}
},
viewConfig: {
},
dockedItems: [{
xtype: 'toolbar',
items: [{
xtype: 'triggerfield',
triggerCls: 'x-form-clear-trigger',
onTriggerClick: function() {
this.reset();
var tree = this.up('panel');
tree.clearFilter();
this.focus();
},
enableKeyEvents: true,
listeners: {
keyup: function(field, event) {
var k = event.getKey();
if (k == event.BACKSPACE) {
this.reset();
var tree = this.up('panel');
tree.clearFilter();
this.focus();
} else {
var v = this.getValue();
if (v.length <= 2)
return;
var tree = this.up('panel');
tree.filterBy(v, 'title');
}
},
buffer: 400
}
}, {
xtype: 'button',
text: 'Select All',
listeners: {
click: function() {
var tree = this.up('panel');
tree.treeSelect(this, true);
}
}
}, {
xtype: 'button',
text: 'Deselect All',
listeners: {
click: function() {
var tree = this.up('panel');
tree.treeSelect(this, false);
}
}
}],
dock: 'top'
}]
});
me.callParent(arguments);
},
onTreepanelCheckChange: function(node, checked, eOpts) {
node.cascadeBy(function(n) {
n.set('checked', checked);
});
if (checked) {
node.bubble(function(n) {
n.set('checked', checked);
});
} else {
node.bubble(function(n) {
var childNodes = this.childNodes;
var length = childNodes.length;
var allUnchecked = true;
for (var i = 0; i < length; i++) {
if (childNodes[i].get('checked')) {
allUnchecked = false;
break;
}
}
if (allUnchecked) {
n.set('checked', false);
}
});
}
node.fireEvent('customCheck');
},
treeSelect: function(caller, selected) {
/**
Tree select will select nodes
**/
var tree = caller.up('panel');
var view = tree.getView();
var me = this;
if (me.nodesAndParents === null) {
/* no search criteria given, select everything */
tree.getRootNode().cascadeBy(
function() {
if (this.data && !this.data.disabled &&
this.data.checked !== null)
this.set('checked', selected);
});
} else {
/* use the array nodesAndParents to determine what to selecdt */
tree.getRootNode().cascadeBy(
function(tree, view) {
var uiNode = view.getNodeByRecord(this);
if (uiNode &&
this.data &&
!this.data.disabled &&
this.data.checked !== null &&
Ext.Array.contains(me.nodesAndParents,
this.id)) {
this.set('checked', selected);
}
}, null, [caller, view]);
}
},
clearFilter: function() {
var view = this.getView();
var me = this;
this.getRootNode().cascadeBy(function(tree, view) {
var uiNode = view.getNodeByRecord(this);
if (uiNode) {
Ext.get(uiNode).setDisplayed('table-row');
}
}, null, [this, view]);
this.collapseAll();
me.nodesAndParents = null;
},
filterBy: function(text, by) {
/**
* Filter the tree on a string, hiding all nodes expect those which match and their parents.
* @param The term to filter on.
* @param The field to filter on (i.e. 'text').
-- Patch for Table.js ---
vi +858 src/view/Table.js
if (node == undefined) return -1;
*/
Ext.suspendLayouts();
try {
var view = this.getView(),
me = this;
me.clearFilter();
/* reset */
me.nodesAndParents = [];
// Find the nodes which match the search term, expand them.
// Then add them and their parents to nodesAndParents.
this.getRootNode().cascadeBy(
function(tree, view) {
var currNode = this;
if (currNode &&
currNode.data[by] &&
currNode.data[by].toString().toLowerCase()
.indexOf(text.toLowerCase()) > -1) {
me.expandPath(currNode.getPath());
while (currNode.parentNode) {
me.nodesAndParents.push(currNode.id);
currNode = currNode.parentNode;
}
}
}, null, [me, view]);
// Hide all of the nodes which aren't in nodesAndParents
this.getRootNode().cascadeBy(
function(tree, view) {
var uiNode = view.getNodeByRecord(this);
if (uiNode &&
!Ext.Array.contains(me.nodesAndParents,
this.id)) {
Ext.get(uiNode).setDisplayed('none');
}
}, null, [me, view]);
} catch (e) {
console.log(e);
}
Ext.resumeLayouts();
}
});
Это мой ответ obj:
CNode [
title=All data,
key=__ALL__,
expanded=false,
leaf=false,
checked=false,
isFolder=true,
disabled=false,
hideCheckbox=false,
visible=true,
tooltip=null,
children=[
CNode [
title=AAAA,
key=20,
expanded=false,
leaf=false,
checked=false,
isFolder=true,
disabled=false,
hideCheckbox=false,
visible=true,
tooltip=null,
children=[
CNode [
title=A1,
key=20010,
expanded=false,
leaf=true,
checked=false,
isFolder=false,
disabled=false,
hideCheckbox=false,
visible=true,
tooltip=,
children=null],
CNode [
title=A2,
key=20020,
expanded=false,
leaf=true,
checked=false,
isFolder=false,
disabled=false,
hideCheckbox=false,
visible=true,
tooltip=,
children=null],
CNode [
title=A3,
key=20030,
expanded=false,
leaf=true,
checked=false,
isFolder=false,
disabled=false,
hideCheckbox=false,
visible=true,
tooltip=,
children=null]