theluyuan/layui-js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(atree): tree change atree

Browse Source
This commit is contained in:
smallwei 2018-07-24 14:24:33 +08:00
parent ae1a15259e
commit e67073c6aa
1 changed files with 41 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
src/lay/modules/atree.js
View File

@ -24,8 +24,8 @@ layui.define('jquery', function(exports) {
addBtnLabelKey: 'add', addBtnLabelKey: 'add',
}; };
var enterSkin = 'layui-tree-enter', var enterSkin = 'layui-atree-enter',
Tree = function(options) { Atree = function(options) {
this.options = options; this.options = options;
this.nodes = options.nodes || []; this.nodes = options.nodes || [];
this.props = this.options.props || props; this.props = this.options.props || props;
@ -47,18 +47,18 @@ layui.define('jquery', function(exports) {
}; };
//初始化 //初始化
Tree.prototype.init = function(elem) { Atree.prototype.init = function(elem) {
var that = this; var that = this;
elem.addClass('layui-box layui-tree'); //添加tree样式 elem.addClass('layui-box layui-atree'); //添加tree样式
if(that.options.skin) { if(that.options.skin) {
elem.addClass('layui-tree-skin-' + that.options.skin); elem.addClass('layui-atree-skin-' + that.options.skin);
} }
that.tree(elem); that.tree(elem);
that.on(elem); that.on(elem);
}; };
//树节点解析 //树节点解析
Tree.prototype.tree = function(elem, children) { Atree.prototype.tree = function(elem, children) {
var that = this, var that = this,
options = that.options options = that.options
var nodes = children || options.nodes; var nodes = children || options.nodes;
@ -87,20 +87,20 @@ layui.define('jquery', function(exports) {
}; };
//节点dom拼接 //节点dom拼接
Tree.prototype.getDom = function(item) { Atree.prototype.getDom = function(item) {
var that = this, var that = this,
options = that.options, options = that.options,
item = item, item = item,
hasChild = item[that.childrenKey] && item[that.childrenKey].length > 0; hasChild = item[that.childrenKey] && item[that.childrenKey].length > 0;
return { return {
spread: function() { spread: function() {
return hasChild ? '<i class="layui-icon layui-tree-spread">' + ( return hasChild ? '<i class="layui-icon layui-atree-spread">' + (
item[that.spreadKey] || options.spreadAll ? icon.arrow[1] : icon.arrow[0] item[that.spreadKey] || options.spreadAll ? icon.arrow[1] : icon.arrow[0]
) + '</i>' : ''; ) + '</i>' : '';
}, },
checkbox: function() { checkbox: function() {
return options.check ? ( return options.check ? (
'<i class="layui-icon layui-tree-check' + (item[that.checkboxKey] ? ' is-checked' : '') + '">' + ( '<i class="layui-icon layui-atree-check' + (item[that.checkboxKey] ? ' is-checked' : '') + '">' + (
item[that.checkboxKey] ? icon.checkbox[1] : icon.checkbox[0] item[that.checkboxKey] ? icon.checkbox[1] : icon.checkbox[0]
) + '</i>' ) + '</i>'
) : ''; ) : '';
@ -115,16 +115,16 @@ layui.define('jquery', function(exports) {
('<cite>' + (item[that.nameKey] || '未命名') + '</cite></a>') ('<cite>' + (item[that.nameKey] || '未命名') + '</cite></a>')
}, },
menu: function() { menu: function() {
return '<div class="layui-tree-menu">' + return '<div class="layui-atree-menu">' +
'<span class="layui-tree-add">' + that.addBtnLabelKey + '</span>' + '<span class="layui-atree-add">' + that.addBtnLabelKey + '</span>' +
'<span class="layui-tree-delete">' + that.deleteBtnLabelKey + '</span>' + '<span class="layui-atree-delete">' + that.deleteBtnLabelKey + '</span>' +
'</div>' '</div>'
} }
} }
} }
//获取树节点 //获取树节点
Tree.prototype.getNode = function(item) { Atree.prototype.getNode = function(item) {
var that = this, var that = this,
options = that.options options = that.options
var dom = that.getDom(item); var dom = that.getDom(item);
@ -132,7 +132,7 @@ layui.define('jquery', function(exports) {
(item[that.spreadKey] || options.spreadAll ? 'data-spread="' + (item[that.spreadKey] || true) + '"' : '') + (item[that.spreadKey] || options.spreadAll ? 'data-spread="' + (item[that.spreadKey] || true) + '"' : '') +
(item[that.checkboxKey] ? 'data-check="' + item[that.checkboxKey] + '"' : '') + (item[that.checkboxKey] ? 'data-check="' + item[that.checkboxKey] + '"' : '') +
('data-id=' + item[that.idKey]) + ('data-id=' + item[that.idKey]) +
'><div class="layui-tree-node">' '><div class="layui-atree-node">'
//展开箭头 //展开箭头
, ,
dom.spread() dom.spread()
@ -153,7 +153,7 @@ layui.define('jquery', function(exports) {
} }
//父绑定事件 //父绑定事件
Tree.prototype.bindUlEvent = function(li, item) { Atree.prototype.bindUlEvent = function(li, item) {
var that = this, var that = this,
options = that.options options = that.options
//触发点击节点回调 //触发点击节点回调
@ -173,19 +173,19 @@ layui.define('jquery', function(exports) {
} }
//选中回调函数 //选中回调函数
Tree.prototype.change = function() { Atree.prototype.change = function() {
var that = this, var that = this,
options = that.options; options = that.options;
options.change(changeList); options.change(changeList);
}, },
//新增方法回调 //新增方法回调
Tree.prototype.add = function(elem, item) { Atree.prototype.add = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var node = elem.children('.layui-tree-node'); var node = elem.children('.layui-atree-node');
var addBtn = node.children('.layui-tree-menu').children('.layui-tree-add') var addBtn = node.children('.layui-atree-menu').children('.layui-atree-add')
var arrow = node.children('.layui-tree-spread') var arrow = node.children('.layui-atree-spread')
var ul = elem.children('ul'), var ul = elem.children('ul'),
a = node.children('a'); a = node.children('a');
var addEvent = function(e) { var addEvent = function(e) {
@ -220,11 +220,11 @@ layui.define('jquery', function(exports) {
} }
//删除方法回调 //删除方法回调
Tree.prototype.delete = function(elem, item) { Atree.prototype.delete = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var node = elem.children('.layui-tree-node'); var node = elem.children('.layui-atree-node');
var deleteBtn = node.children('.layui-tree-menu').children('.layui-tree-delete') var deleteBtn = node.children('.layui-atree-menu').children('.layui-atree-delete')
var ul = elem.children('ul'), var ul = elem.children('ul'),
a = elem.children('a'); a = elem.children('a');
var deleteEvent = function(e) { var deleteEvent = function(e) {
@ -232,7 +232,7 @@ layui.define('jquery', function(exports) {
var _deleteEvent = { var _deleteEvent = {
done: function() { done: function() {
var parent = elem.parent(); var parent = elem.parent();
var arrow = parent.parent().children('.layui-tree-spread') var arrow = parent.parent().children('.layui-atree-spread')
if(parent.children('li').length === 1) { if(parent.children('li').length === 1) {
arrow.remove(); arrow.remove();
} }
@ -245,10 +245,10 @@ layui.define('jquery', function(exports) {
} }
//点击节点回调 //点击节点回调
Tree.prototype.click = function(elem, item) { Atree.prototype.click = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var node = elem.children('.layui-tree-node'); var node = elem.children('.layui-atree-node');
node.children('a').on('click', function(e) { node.children('a').on('click', function(e) {
layui.stope(e); layui.stope(e);
options.click(item) options.click(item)
@ -256,11 +256,11 @@ layui.define('jquery', function(exports) {
}; };
//节点选择 //节点选择
Tree.prototype.checkbox = function(elem, item) { Atree.prototype.checkbox = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var node = elem.children('.layui-tree-node'); var node = elem.children('.layui-atree-node');
var checkbox = node.children('.layui-tree-check') var checkbox = node.children('.layui-atree-check')
var ul = elem.children('ul'), var ul = elem.children('ul'),
a = node.children('a'); a = node.children('a');
var whileAllCheck = function(dom, item, type) { var whileAllCheck = function(dom, item, type) {
@ -273,7 +273,7 @@ layui.define('jquery', function(exports) {
} }
} }
var setCheck = function(elem, item, type) { var setCheck = function(elem, item, type) {
var checkbox = elem.children('.layui-tree-node').find('.layui-tree-check'); var checkbox = elem.children('.layui-atree-node').find('.layui-atree-check');
if(type) { if(type) {
elem.data('check', true) elem.data('check', true)
checkbox.html(icon.checkbox[1]) checkbox.html(icon.checkbox[1])
@ -308,11 +308,11 @@ layui.define('jquery', function(exports) {
}; };
//伸展节点 //伸展节点
Tree.prototype.spread = function(elem, item) { Atree.prototype.spread = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var node = elem.children('.layui-tree-node'); var node = elem.children('.layui-atree-node');
var arrow = node.children('.layui-tree-spread') var arrow = node.children('.layui-atree-spread')
var ul = elem.children('ul'), var ul = elem.children('ul'),
a = node.children('a'); a = node.children('a');
//如果没有子节点，则不执行 //如果没有子节点，则不执行
@ -323,7 +323,7 @@ layui.define('jquery', function(exports) {
} }
//打开节点 //打开节点
Tree.prototype.open = function(elem, ul, arrow) { Atree.prototype.open = function(elem, ul, arrow) {
if(elem.data('spread')) { if(elem.data('spread')) {
elem.data('spread', null) elem.data('spread', null)
ul.removeClass('layui-show'); ul.removeClass('layui-show');
@ -335,10 +335,10 @@ layui.define('jquery', function(exports) {
} }
}; };
//通用事件 //通用事件
Tree.prototype.on = function(elem) { Atree.prototype.on = function(elem) {
var that = this, var that = this,
options = that.options; options = that.options;
var dragStr = 'layui-tree-drag'; var dragStr = 'layui-atree-drag';
//屏蔽选中文字 //屏蔽选中文字
elem.find('i').on('selectstart', function(e) { elem.find('i').on('selectstart', function(e) {
@ -374,8 +374,8 @@ layui.define('jquery', function(exports) {
}; };
//拖拽节点 //拖拽节点
Tree.prototype.move = {}; Atree.prototype.move = {};
Tree.prototype.drag = function(elem, item) { Atree.prototype.drag = function(elem, item) {
var that = this, var that = this,
options = that.options; options = that.options;
var a = elem.children('a'), var a = elem.children('a'),
@ -410,11 +410,11 @@ layui.define('jquery', function(exports) {
//暴露接口 //暴露接口
exports('atree', function(options) { exports('atree', function(options) {
var tree = new Tree(options = options || {}); var atree = new Atree(options = options || {});
var elem = $(options.elem); var elem = $(options.elem);
if(!elem[0]) { if(!elem[0]) {
return hint.error('layui.tree 没有找到' + options.elem + '元素'); return hint.error('layui.atree 没有找到' + options.elem + '元素');
} }
tree.init(elem); atree.init(elem);
}); });
}); });