(function () {
'use strict';
var VueTreeItem = Vue.extend({
template: '
' +
'' +
'' +
' {{node.name}}' +
'' +
'',
props: {
node: {
type: Object
}
},
methods: {
showIcon: function (node) {
return node.icon || node.openedIcon || node.closedIcon;
},
nodeClass: function (node) {
if (node.isOpen) {
return node.openedIcon || node.icon;
} else {
return node.closedIcon || node.icon;
}
},
toggle: function (node) {
vm.listSub(node);
if (node.hasOwnProperty('isOpen')) {
node.isOpen = !node.isOpen;
} else {
Vue.set(node, 'isOpen', true);
}
},
dragEnter(ev){
vm.dragEnter(ev);
},
dragLeave(ev){
vm.dragLeave(ev);
},
draga:function(node){
vm.dragado(node.id,'directory');
},
listFil: function(node){
vm.listFiles(node.id);
Vue.set(node, 'isOpen', true);
vm.listSub(node,1);
}
},
watch: {
'node.isOpen': function (val) {
if (!this.node.hasOwnProperty('_loading')) {
Vue.set(this.node, '_loading', false);
}
if (val) {
if (typeof this.node.onOpened === 'function') {
this.node.onOpened(this.node);
}
} else {
if (typeof this.node.onClosed === 'function') {
this.node.onClosed(this.node);
}
}
}
}
});
Vue.component('vue-tree-item', VueTreeItem);
var VueTree = Vue.extend({
template: '',
props: {
option: {
type: Object
}
},
components: {
'tree-item': VueTreeItem
}
});
Vue.component('vue-tree', VueTree);
})();