1818 </div>
1919 <div class="tree-actions">
2020 <?php if ($ root ):?>
21- <a id="colapseAll" href="#"><?= $ block ->escapeHtml (__ ('Collapse All ' )) ?> </a>
21+ <a id="colapseAll" href="#"><?= $ escaper ->escapeHtml (__ ('Collapse All ' )) ?> </a>
2222 <span class="separator">|</span>
23- <a id="expandAll" href="#"><?= $ block ->escapeHtml (__ ('Expand All ' )) ?> </a>
23+ <a id="expandAll" href="#"><?= $ escaper ->escapeHtml (__ ('Expand All ' )) ?> </a>
2424 <?php endif ; ?>
2525 </div>
2626 <?php if ($ root ):?>
3939 </div>
4040</div>
4141
42- <div data-id="information-dialog-tree" class="messages">
43- <div class="message message-notice">
44- <div><?= $ block ->escapeHtml (__ ('This operation can take a long time ' )) ?> </div>
42+ <div data-id="information-dialog-tree" class="messages">
43+ <div class="message message-notice">
44+ <div><?= $ escaper ->escapeHtml (__ ('This operation can take a long time ' )) ?> </div>
45+ </div>
4546 </div>
46- </div>
4747
4848 <?= /* @noEscape */ $ secureRenderer ->renderStyleAsTag (
4949 'display: none; ' ,
7373 treeInstance,
7474script ;
7575 $ scriptString .= 'currentNodeId = ' . (int )$ block ->getCategoryId () . ',
76-
76+ defaultTree = ' . $ block -> getTreeJson () . ' ,
7777 defaultParams = {
7878 text: ' . /* @noEscape */ json_encode (htmlentities ($ root ->getName ())) . ',
7979 allowDrop: ' . ($ root ->getIsVisible () ? 'true ' : 'false ' ) . ',
@@ -93,6 +93,32 @@ script;
9393 */
9494 treeDiv.jstree({
9595 core: {
96+ 'data' : function (obj, callback) {
97+ if(obj.id != '#' && obj.children.length === 0){
98+ let data = {
99+ id: obj.id,
100+ store: defaultParams.store_id,
101+ form_key: FORM_KEY
102+ };
103+
104+ $.ajax({
105+ url: ' {$ block ->escapeJs ($ block ->getLoadTreeUrl ())}',
106+ type: "POST",
107+ data: data,
108+ dataType: 'json',
109+ success: function (response) {
110+ TreeConfig.updateChildrenKey(response);
111+ callback.call(this, response);
112+ },
113+ error: function (jqXHR, status, error) {
114+ console.log(status + ': ' + error);
115+ }
116+ });
117+ }else{
118+ TreeConfig.updateChildrenKey(defaultTree);
119+ callback.call(this, defaultTree);
120+ }
121+ },
96122 check_callback: function (operation, node) {
97123 //Draggable false for root categories
98124 return !(operation === 'move_node' &&
@@ -102,57 +128,10 @@ script;
102128 plugins: ['dnd'],
103129 }).bind('move_node.jstree', function (e, data) {
104130 TreeConfig.categoryMove(data);
131+ }).bind('ready.jstree', function(e, data) {
132+ TreeConfig.selectNode(data);
105133 });
106-
107134 treeInstance = treeDiv.jstree(true);
108- let root = treeInstance.get_node('#');
109- this.buildCategoryTree(treeDiv, root, ' {$ block ->getTreeJson ()}', true);
110-
111- let catId = treeInstance.get_node(defaultParams.category_id);
112- if (catId) {
113- currentNodeId = defaultParams.category_id;
114- } else if (defaultParams.parent > 0 && defaultParams.category_id === 0) {
115- currentNodeId = defaultParams.parent;
116- }
117-
118- // select and open child node
119- if (defaultParams.expanded) {
120- treeInstance.open_all();
121- } else {
122- let selectedNode = treeInstance.get_node(currentNodeId);
123- treeInstance.select_node(selectedNode, true);
124-
125- setTimeout(function () {
126- treeInstance.open_node(selectedNode);
127- }, 15);
128- }
129- },
130-
131- buildCategoryTree: function(treeDiv, parent, config, firstLoad){
132- if (!config) return;
133-
134- if(firstLoad){
135- config = $.parseJSON(config);
136- }
137-
138- for (let i = 0; i < config.length; i++) {
139- let nodeConfig = config[i],
140- newNode = {
141- text: nodeConfig.text,
142- id: nodeConfig.id,
143- allowDrag: nodeConfig.allowDrag,
144- allowDrop: nodeConfig.allowDrop,
145- cls: nodeConfig.cls,
146- store: nodeConfig.store,
147- li_attr: { class: nodeConfig.cls}
148- };
149-
150- const parentTree = treeInstance.create_node(parent, newNode, 'last');
151-
152- if (nodeConfig.children) {
153- this.buildCategoryTree(treeDiv, parentTree, nodeConfig.children, false);
154- }
155- }
156135 },
157136
158137 categoryMove : function (obj){
@@ -237,10 +216,33 @@ script;
237216 treeDiv.on('changed.jstree', function (e, data) {
238217 TreeConfig.categoryClick(data);
239218 });
219+ },
240220
241- treeDiv.on("open_node.jstree", function (e, data) {
242- TreeConfig.handleOpenNode(data);
243- });
221+ updateChildrenKey : function(treeJson) {
222+ treeJson.forEach(node => {
223+ if (Array.isArray(node.children) && node.children.length === 0) {
224+ node.children = true;
225+ } else if (Array.isArray(node.children)) {
226+ TreeConfig.updateChildrenKey(node.children);
227+ }
228+ });
229+ },
230+
231+ selectNode : function(data){
232+ if (defaultParams.expanded) {
233+ treeInstance.open_all();
234+ } else {
235+ let catId = treeInstance.get_node(defaultParams.category_id);
236+ if (catId) {
237+ currentNodeId = defaultParams.category_id;
238+ } else if (defaultParams.parent > 0 && defaultParams.category_id === 0) {
239+ currentNodeId = defaultParams.parent;
240+ }
241+
242+ let selectedNode = treeInstance.get_node(currentNodeId);
243+ treeInstance.select_node(selectedNode, true);
244+ treeInstance.open_node(selectedNode);
245+ }
244246 },
245247
246248 categoryClick : function(data){
@@ -257,63 +259,6 @@ script;
257259 }
258260 },
259261
260- handleOpenNode : function(data){
261- let parentNode = data.node;
262- if (parentNode && parentNode.children.length > 0) {
263-
264- parentNode.children.forEach(function(childId) {
265-
266- let childNode = data.instance.get_node(childId, false);
267-
268- // Check if the child node has no children (is not yet loaded)
269- if (childNode.children && childNode.children.length === 0
270- && childNode.original && !childNode.original.lastNode) {
271-
272- $.ajax({
273- url: ' {$ block ->escapeJs ($ block ->escapeUrl ($ block ->getLoadTreeUrl ()))}',
274- type: "POST",
275- data: {
276- id: childNode.original.id,
277- store: childNode.original.store,
278- form_key: FORM_KEY
279- },
280- dataType: 'json',
281- success: function (response) {
282- TreeConfig.handleSuccessResponse(response, childNode, data);
283- },
284- error: function (jqXHR, status, error) {
285- console.log(status + ': ' + error);
286- }
287- });
288- }
289- });
290- }
291- },
292-
293- handleSuccessResponse : function(response, childNode, data){
294- if (response.length > 0) {
295- response.forEach(newNode => {
296- TreeConfig.addLastNodeFlag(newNode);
297-
298- // Create the new node and execute node callback
299- data.instance.create_node(childNode, newNode, 'last');
300- });
301-
302- // open all node if, expand all link clicked
303- if(expandAll === true){
304- data.instance.open_all();
305- }
306- }
307- },
308-
309- addLastNodeFlag : function(treeData) {
310- if (treeData.children) {
311- treeData.children.forEach(child => TreeConfig.addLastNodeFlag(child));
312- } else {
313- treeData.lastNode = true;
314- }
315- },
316-
317262 expandAll : function(){
318263 expandAll = true;
319264 treeInstance.open_all();
@@ -343,13 +288,6 @@ script;
343288 TreeConfig.categoryClick(data);
344289 });
345290
346- /**
347- * jstree handle open node
348- */
349- treeDiv.on('open_node.jstree', function (e, data) {
350- TreeConfig.handleOpenNode(data);
351- });
352-
353291 /**
354292 * create default tree
355293 */
0 commit comments