guy 7 years ago
parent
commit
0a259a65c0
  1. 108
      demo/js/category/sortTree/demo.sortTree.js
  2. 110
      dist/demo.js

108
demo/js/category/sortTree/demo.sortTree.js

@ -27,6 +27,7 @@ BI.shortcut("demo.sort_tree_expander", Demo.Expander);
Demo.SortTree = BI.inherit(BI.Widget, { Demo.SortTree = BI.inherit(BI.Widget, {
render: function () { render: function () {
BI.$import("https://coding.net/u/fanruan/p/bi-components/git/raw/master/dist/jqueryui.js");
var self = this, o = this.options; var self = this, o = this.options;
var tree = new BI.Tree(); var tree = new BI.Tree();
tree.initTree(BI.Tree.transformToTreeFormat(Demo.CONSTANTS.TREEITEMS)); tree.initTree(BI.Tree.transformToTreeFormat(Demo.CONSTANTS.TREEITEMS));
@ -47,64 +48,65 @@ Demo.SortTree = BI.inherit(BI.Widget, {
}] }]
} }
}); });
BI.delay(function () {
self.tree.element.sortable({
items: ".sort-item",
placeholder: {
element: function ($currentItem) {
var holder = BI.createWidget({
type: "bi.layout",
cls: "bi-sortable-holder",
height: $currentItem.outerHeight()
});
holder.element.css({
"margin-left": $currentItem.css("margin-left"),
"margin-right": $currentItem.css("margin-right"),
"margin-top": $currentItem.css("margin-top"),
"margin-bottom": $currentItem.css("margin-bottom"),
margin: $currentItem.css("margin")
});
return holder.element;
},
update: function () {
this.tree.element.sortable({ }
items: ".sort-item",
placeholder: {
element: function ($currentItem) {
var holder = BI.createWidget({
type: "bi.layout",
cls: "bi-sortable-holder",
height: $currentItem.outerHeight()
});
holder.element.css({
"margin-left": $currentItem.css("margin-left"),
"margin-right": $currentItem.css("margin-right"),
"margin-top": $currentItem.css("margin-top"),
"margin-bottom": $currentItem.css("margin-bottom"),
margin: $currentItem.css("margin")
});
return holder.element;
}, },
update: function () { update: function (event, ui) {
var node = ui.item.data("node");
} var findTheNode = tree.search(node.id);
}, // 这里简单处理下找到它的父节点
update: function (event, ui) { var currentIndex = 0, parentNode;
var node = ui.item.data("node"); if (ui.item.next().length > 0) {
var findTheNode = tree.search(node.id); var n = ui.item.next().data("node");
// 这里简单处理下找到它的父节点 var nextId = n.id;
var currentIndex = 0, parentNode; var nextNode = tree.search(nextId);
if (ui.item.next().length > 0) { parentNode = nextNode.getParent();
var n = ui.item.next().data("node"); var nextIndex = parentNode.getChildIndex(nextId);
var nextId = n.id; currentIndex = nextIndex > 0 && (nextIndex - 1);
var nextNode = tree.search(nextId);
parentNode = nextNode.getParent();
var nextIndex = parentNode.getChildIndex(nextId);
currentIndex = nextIndex > 0 && (nextIndex - 1);
} else if (ui.item.prev().length > 0) { } else if (ui.item.prev().length > 0) {
var n = ui.item.prev().data("node"); var n = ui.item.prev().data("node");
var prevId = n.id; var prevId = n.id;
var prevNode = tree.search(prevId); var prevNode = tree.search(prevId);
parentNode = prevNode.getParent(); parentNode = prevNode.getParent();
var prevIndex = parentNode.getChildIndex(prevId); var prevIndex = parentNode.getChildIndex(prevId);
currentIndex = prevIndex + 1; currentIndex = prevIndex + 1;
} }
findTheNode.getParent().removeChild(node.id); findTheNode.getParent().removeChild(node.id);
parentNode.addChild(findTheNode, currentIndex); parentNode.addChild(findTheNode, currentIndex);
console.log(tree.toJSON()); console.log(tree.toJSON());
self.tree.populate(self._formatItems(0, tree.toJSON())); self.tree.populate(self._formatItems(0, tree.toJSON()));
}, },
start: function (event, ui) { start: function (event, ui) {
}, },
stop: function (event, ui) { stop: function (event, ui) {
}, },
over: function (event, ui) { over: function (event, ui) {
} }
}); });
}, 2000);
}, },
_formatItems: function (layer, nodes) { _formatItems: function (layer, nodes) {

110
dist/demo.js vendored

@ -4350,6 +4350,7 @@ BI.shortcut("demo.sort_tree_expander", Demo.Expander);
Demo.SortTree = BI.inherit(BI.Widget, { Demo.SortTree = BI.inherit(BI.Widget, {
render: function () { render: function () {
BI.$import("https://coding.net/u/fanruan/p/bi-components/git/raw/master/dist/jqueryui.js");
var self = this, o = this.options; var self = this, o = this.options;
var tree = new BI.Tree(); var tree = new BI.Tree();
tree.initTree(BI.Tree.transformToTreeFormat(Demo.CONSTANTS.TREEITEMS)); tree.initTree(BI.Tree.transformToTreeFormat(Demo.CONSTANTS.TREEITEMS));
@ -4370,64 +4371,65 @@ Demo.SortTree = BI.inherit(BI.Widget, {
}] }]
} }
}); });
BI.delay(function () {
self.tree.element.sortable({
items: ".sort-item",
placeholder: {
element: function ($currentItem) {
var holder = BI.createWidget({
type: "bi.layout",
cls: "bi-sortable-holder",
height: $currentItem.outerHeight()
});
holder.element.css({
"margin-left": $currentItem.css("margin-left"),
"margin-right": $currentItem.css("margin-right"),
"margin-top": $currentItem.css("margin-top"),
"margin-bottom": $currentItem.css("margin-bottom"),
margin: $currentItem.css("margin")
});
return holder.element;
},
update: function () {
this.tree.element.sortable({ }
items: ".sort-item",
placeholder: {
element: function ($currentItem) {
var holder = BI.createWidget({
type: "bi.layout",
cls: "bi-sortable-holder",
height: $currentItem.outerHeight()
});
holder.element.css({
"margin-left": $currentItem.css("margin-left"),
"margin-right": $currentItem.css("margin-right"),
"margin-top": $currentItem.css("margin-top"),
"margin-bottom": $currentItem.css("margin-bottom"),
margin: $currentItem.css("margin")
});
return holder.element;
}, },
update: function () { update: function (event, ui) {
var node = ui.item.data("node");
} var findTheNode = tree.search(node.id);
}, // 这里简单处理下找到它的父节点
update: function (event, ui) { var currentIndex = 0, parentNode;
var node = ui.item.data("node"); if (ui.item.next().length > 0) {
var findTheNode = tree.search(node.id); var n = ui.item.next().data("node");
// 这里简单处理下找到它的父节点 var nextId = n.id;
var currentIndex = 0, parentNode; var nextNode = tree.search(nextId);
if (ui.item.next().length > 0) { parentNode = nextNode.getParent();
var n = ui.item.next().data("node"); var nextIndex = parentNode.getChildIndex(nextId);
var nextId = n.id; currentIndex = nextIndex > 0 && (nextIndex - 1);
var nextNode = tree.search(nextId);
parentNode = nextNode.getParent(); } else if (ui.item.prev().length > 0) {
var nextIndex = parentNode.getChildIndex(nextId); var n = ui.item.prev().data("node");
currentIndex = nextIndex > 0 && (nextIndex - 1); var prevId = n.id;
var prevNode = tree.search(prevId);
} else if (ui.item.prev().length > 0) { parentNode = prevNode.getParent();
var n = ui.item.prev().data("node"); var prevIndex = parentNode.getChildIndex(prevId);
var prevId = n.id; currentIndex = prevIndex + 1;
var prevNode = tree.search(prevId); }
parentNode = prevNode.getParent(); findTheNode.getParent().removeChild(node.id);
var prevIndex = parentNode.getChildIndex(prevId); parentNode.addChild(findTheNode, currentIndex);
currentIndex = prevIndex + 1; console.log(tree.toJSON());
} self.tree.populate(self._formatItems(0, tree.toJSON()));
findTheNode.getParent().removeChild(node.id); },
parentNode.addChild(findTheNode, currentIndex); start: function (event, ui) {
console.log(tree.toJSON());
self.tree.populate(self._formatItems(0, tree.toJSON()));
},
start: function (event, ui) {
}, },
stop: function (event, ui) { stop: function (event, ui) {
}, },
over: function (event, ui) { over: function (event, ui) {
} }
}); });
}, 2000);
}, },
_formatItems: function (layer, nodes) { _formatItems: function (layer, nodes) {

Loading…
Cancel
Save