You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
2.6 KiB
70 lines
2.6 KiB
;(function (window, undefined) {
|
|
var treeView = tools.$('#treeView');
|
|
var fileData = data;
|
|
|
|
// 初始化
|
|
treeView.innerHTML = treeHtml(fileData, 0);
|
|
// console.log(treeHtml(fileData,-1));
|
|
// 事件
|
|
var fileItem = tools.$('.treeNode');
|
|
var root_icon = tools.$('.icon-control', fileItem[0])[0];
|
|
|
|
root_icon.className = 'icon icon-control icon-minus';
|
|
|
|
tools.each(fileItem, function (item) {
|
|
filesHandle(item);
|
|
});
|
|
|
|
function treeHtml(fileData, fileId) {
|
|
var _html = '';
|
|
var children = getChildById(fileData, fileId);
|
|
var hideChild = fileId > 0 ? 'none' : '';
|
|
|
|
_html += '<ul class="' + hideChild + '">';
|
|
|
|
children.forEach(function (item, index) {
|
|
var level = getLevelById(fileData, item.id);
|
|
var distance = (level - 1) * 20 + 'px';
|
|
var hasChild = hasChilds(fileData, item.id);
|
|
var className = hasChild ? '' : 'treeNode-empty';
|
|
var treeRoot_cls = (fileId === 0 && hasChild) ? 'treeNode-cur' : '';
|
|
var url = item.url ? item.url : '';
|
|
_html += '<li><div class="treeNode '+ className + ' ' + treeRoot_cls + '" style="padding-left: '+distance+'" data-file-id="'+item.id+'"><i class="icon icon-control icon-add"></i> <i class="icon icon-file"></i>';
|
|
if(url){
|
|
_html += '<span class="title" onclick="parent.openTab(\''+ url +'\')">'+item.name+'</span>';
|
|
}else{
|
|
_html += '<span class="title">'+ item.name+'</span>';
|
|
}
|
|
_html += '</div>'+treeHtml(fileData, item.id)+'</li>';
|
|
});
|
|
|
|
_html += '</ul>';
|
|
|
|
return _html;
|
|
};
|
|
|
|
function filesHandle(item) {
|
|
tools.addEvent(item, 'click', function () {
|
|
var treeNode_cur = tools.$('.treeNode-cur')[0];
|
|
var fileId = item.dataset.fileId;
|
|
var curElem = document.querySelector('.treeNode[data-file-id="' + fileId + '"]');
|
|
var hasChild = hasChilds(fileData, fileId);
|
|
var icon_control = tools.$('.icon-control', item)[0];
|
|
var openStatus = true;
|
|
|
|
|
|
if (hasChild) {
|
|
tools.removeClass(treeNode_cur, 'treeNode-cur');
|
|
tools.addClass(curElem, 'treeNode-cur');
|
|
|
|
openStatus = tools.toggleClass(item.nextElementSibling, 'none');
|
|
|
|
if (openStatus) {
|
|
icon_control.className = 'icon icon-control icon-add';
|
|
} else {
|
|
icon_control.className = 'icon icon-control icon-minus';
|
|
}
|
|
}
|
|
});
|
|
};
|
|
})(window); |