fix(atree): 2.0.0-beta
This commit is contained in:
smallwei
parent
a34c39a1dd
commit
ea24b7635d
@ -33,6 +33,8 @@
|
||||
// drag: true,
|
||||
spreadAll:true,
|
||||
props:{
|
||||
addBtnLabel:'新增',
|
||||
deleteBtnLabel:'删除',
|
||||
name: 'name',
|
||||
id: 'id',
|
||||
children:'children',
|
||||
|
||||
@ -14,12 +14,14 @@ layui.define('jquery', function(exports) {
|
||||
//勾选集合
|
||||
var changeList = [];
|
||||
//变量别名
|
||||
var props ={
|
||||
var props = {
|
||||
name: 'name',
|
||||
id: 'id',
|
||||
children:'children',
|
||||
checkbox:'checkbox',
|
||||
spread:'spread'
|
||||
children: 'children',
|
||||
checkbox: 'checkbox',
|
||||
spread: 'spread',
|
||||
deleteBtnLabelKey: 'delete',
|
||||
addBtnLabelKey: 'add',
|
||||
};
|
||||
|
||||
var enterSkin = 'layui-tree-enter',
|
||||
@ -32,6 +34,8 @@ layui.define('jquery', function(exports) {
|
||||
this.childrenKey = this.props.children || props.children;
|
||||
this.checkboxKey = this.props.checkbox || props.checkbox;
|
||||
this.spreadKey = this.props.spread || props.spread;
|
||||
this.addBtnLabelKey = this.props.addBtnLabel || props.addBtnLabel;
|
||||
this.deleteBtnLabelKey = this.props.deleteBtnLabel || props.deleteBtnLabel;
|
||||
};
|
||||
//图标
|
||||
var icon = {
|
||||
@ -65,7 +69,7 @@ layui.define('jquery', function(exports) {
|
||||
var li = $(that.getNode(item));
|
||||
|
||||
//如果被选中加入checkbox集合里
|
||||
if(item[that.checkboxKey]){
|
||||
if(item[that.checkboxKey]) {
|
||||
changeList.push(item);
|
||||
}
|
||||
|
||||
@ -82,7 +86,7 @@ layui.define('jquery', function(exports) {
|
||||
});
|
||||
};
|
||||
|
||||
//节点dom拼接
|
||||
//节点dom拼接
|
||||
Tree.prototype.getDom = function(item) {
|
||||
var that = this,
|
||||
options = that.options,
|
||||
@ -96,12 +100,12 @@ layui.define('jquery', function(exports) {
|
||||
},
|
||||
checkbox: function() {
|
||||
return options.check ? (
|
||||
'<i class="layui-icon layui-tree-check'+(item[that.checkboxKey]?' is-checked':'')+'">' + (
|
||||
item[that.checkboxKey]? icon.checkbox[1] : icon.checkbox[0]
|
||||
'<i class="layui-icon layui-tree-check' + (item[that.checkboxKey] ? ' is-checked' : '') + '">' + (
|
||||
item[that.checkboxKey] ? icon.checkbox[1] : icon.checkbox[0]
|
||||
) + '</i>'
|
||||
) : '';
|
||||
},
|
||||
ul:function(){
|
||||
ul: function() {
|
||||
return '<ul class="' + (item[that.spreadKey] || options.spreadAll ? "layui-show" : "") + '"></ul>'
|
||||
},
|
||||
node: function() {
|
||||
@ -112,8 +116,8 @@ layui.define('jquery', function(exports) {
|
||||
},
|
||||
menu: function() {
|
||||
return '<div class="layui-tree-menu">' +
|
||||
'<span class="layui-tree-add">Add</span>' +
|
||||
'<span class="layui-tree-delete">Delete</span>' +
|
||||
'<span class="layui-tree-add">' + that.addBtnLabelKey + '</span>' +
|
||||
'<span class="layui-tree-delete">' + that.deleteBtnLabelKey + '</span>' +
|
||||
'</div>'
|
||||
}
|
||||
}
|
||||
@ -124,11 +128,11 @@ layui.define('jquery', function(exports) {
|
||||
var that = this,
|
||||
options = that.options
|
||||
var dom = that.getDom(item);
|
||||
var li = ['<li '
|
||||
+ (item[that.spreadKey] || options.spreadAll ? 'data-spread="' + (item[that.spreadKey] || true) + '"' : '')
|
||||
+(item[that.checkboxKey] ? 'data-check="' + item[that.checkboxKey] + '"' : '')
|
||||
+('data-id=' + item[that.idKey])
|
||||
+ '><div class="layui-tree-node">'
|
||||
var li = ['<li ' +
|
||||
(item[that.spreadKey] || options.spreadAll ? 'data-spread="' + (item[that.spreadKey] || true) + '"' : '') +
|
||||
(item[that.checkboxKey] ? 'data-check="' + item[that.checkboxKey] + '"' : '') +
|
||||
('data-id=' + item[that.idKey]) +
|
||||
'><div class="layui-tree-node">'
|
||||
//展开箭头
|
||||
,
|
||||
dom.spread()
|
||||
@ -142,8 +146,7 @@ layui.define('jquery', function(exports) {
|
||||
dom.node()
|
||||
//菜单
|
||||
,
|
||||
dom.menu()
|
||||
,
|
||||
dom.menu(),
|
||||
'</div></li>'
|
||||
].join('');
|
||||
return li;
|
||||
@ -180,7 +183,7 @@ layui.define('jquery', function(exports) {
|
||||
Tree.prototype.add = function(elem, item) {
|
||||
var that = this,
|
||||
options = that.options;
|
||||
var node =elem.children('.layui-tree-node');
|
||||
var node = elem.children('.layui-tree-node');
|
||||
var addBtn = node.children('.layui-tree-menu').children('.layui-tree-add')
|
||||
var arrow = node.children('.layui-tree-spread')
|
||||
var ul = elem.children('ul'),
|
||||
@ -189,7 +192,7 @@ layui.define('jquery', function(exports) {
|
||||
layui.stope(e);
|
||||
var _addEvent = {
|
||||
add: function(itemAddObj) {
|
||||
if(!item[that.childrenKey]){
|
||||
if(!item[that.childrenKey]) {
|
||||
item[that.childrenKey] = [];
|
||||
}
|
||||
item[that.childrenKey].push(itemAddObj);
|
||||
@ -200,7 +203,7 @@ layui.define('jquery', function(exports) {
|
||||
}
|
||||
if(!arrow[0]) {
|
||||
arrow = $(dom.spread());
|
||||
elem.prepend(arrow);
|
||||
node.prepend(arrow);
|
||||
that.spread(elem, item);
|
||||
}
|
||||
if(!elem.data('spread')) {
|
||||
@ -220,7 +223,7 @@ layui.define('jquery', function(exports) {
|
||||
Tree.prototype.delete = function(elem, item) {
|
||||
var that = this,
|
||||
options = that.options;
|
||||
var node =elem.children('.layui-tree-node');
|
||||
var node = elem.children('.layui-tree-node');
|
||||
var deleteBtn = node.children('.layui-tree-menu').children('.layui-tree-delete')
|
||||
var ul = elem.children('ul'),
|
||||
a = elem.children('a');
|
||||
@ -228,9 +231,9 @@ layui.define('jquery', function(exports) {
|
||||
layui.stope(e);
|
||||
var _deleteEvent = {
|
||||
done: function() {
|
||||
var parent =elem.parent();
|
||||
var parent = elem.parent();
|
||||
var arrow = parent.parent().children('.layui-tree-spread')
|
||||
if(parent.children('li').length===1){
|
||||
if(parent.children('li').length === 1) {
|
||||
arrow.remove();
|
||||
}
|
||||
elem.remove();
|
||||
@ -245,7 +248,7 @@ layui.define('jquery', function(exports) {
|
||||
Tree.prototype.click = function(elem, item) {
|
||||
var that = this,
|
||||
options = that.options;
|
||||
var node =elem.children('.layui-tree-node');
|
||||
var node = elem.children('.layui-tree-node');
|
||||
node.children('a').on('click', function(e) {
|
||||
layui.stope(e);
|
||||
options.click(item)
|
||||
@ -256,26 +259,48 @@ layui.define('jquery', function(exports) {
|
||||
Tree.prototype.checkbox = function(elem, item) {
|
||||
var that = this,
|
||||
options = that.options;
|
||||
var node =elem.children('.layui-tree-node');
|
||||
var node = elem.children('.layui-tree-node');
|
||||
var checkbox = node.children('.layui-tree-check')
|
||||
var ul = elem.children('ul'),
|
||||
a = node.children('a');
|
||||
var check = function() {
|
||||
var index = layui.findObj(changeList, item);
|
||||
if(elem.data('check')) {
|
||||
elem.data('check', null)
|
||||
checkbox.removeClass(' is-checked');
|
||||
checkbox.html(icon.checkbox[0]);
|
||||
} else {
|
||||
elem.data('check', true);
|
||||
checkbox.addClass(' is-checked');
|
||||
checkbox.html(icon.checkbox[1]);
|
||||
var whileAllCheck = function(dom, item, type) {
|
||||
var list = dom.children('.layui-show').find('li');
|
||||
var children = item ? item.children || [] : [];
|
||||
for(var i = 0; i < list.length; i++) {
|
||||
var li = $(list[i]);
|
||||
setCheck(li, children[i], type);
|
||||
whileAllCheck(li, children[i], type);
|
||||
}
|
||||
if(index === -1) {
|
||||
changeList.push(item);
|
||||
}
|
||||
var setCheck = function(elem, item, type) {
|
||||
var checkbox = elem.children('.layui-tree-node').find('.layui-tree-check');
|
||||
if(type) {
|
||||
elem.data('check', true)
|
||||
checkbox.html(icon.checkbox[1])
|
||||
checkbox.addClass(' is-checked');
|
||||
} else {
|
||||
elem.data('check', null);
|
||||
checkbox.removeClass(' is-checked');
|
||||
checkbox.html(icon.checkbox[0])
|
||||
}
|
||||
if(item) {
|
||||
var index = layui.findObj(changeList, item[that.idKey], that.idKey);
|
||||
if(index === -1 && type === true) {
|
||||
changeList.push(item);
|
||||
} else if(type === false) {
|
||||
changeList.splice(index, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
var check = function() {
|
||||
var checkFlag;
|
||||
if(elem.data('check')) {
|
||||
checkFlag = false;
|
||||
} else {
|
||||
checkFlag = true;
|
||||
}
|
||||
setCheck(elem, item, checkFlag)
|
||||
whileAllCheck(elem, item, checkFlag);
|
||||
that.change();
|
||||
}
|
||||
checkbox.on('click', check);
|
||||
@ -286,7 +311,7 @@ layui.define('jquery', function(exports) {
|
||||
Tree.prototype.spread = function(elem, item) {
|
||||
var that = this,
|
||||
options = that.options;
|
||||
var node =elem.children('.layui-tree-node');
|
||||
var node = elem.children('.layui-tree-node');
|
||||
var arrow = node.children('.layui-tree-spread')
|
||||
var ul = elem.children('ul'),
|
||||
a = node.children('a');
|
||||
|
||||
@ -437,11 +437,11 @@
|
||||
}
|
||||
|
||||
//寻找对象是否存在数组中
|
||||
Layui.prototype.findObj = function(list,obj) {
|
||||
Layui.prototype.findObj = function(list,value,key) {
|
||||
var that = this,
|
||||
result = -1;
|
||||
that.each(list, function(index, item) {
|
||||
if(that.isEqualObj(obj,item))result = index;
|
||||
if(item[key] == value)result = index;
|
||||
})
|
||||
return result;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user