layui.define(['jquery', 'form'], function(exports){ $ = layui.jquery; form = layui.form; obj = { // 渲染 + 绑定事件 /** * 渲染DOM并绑定事件 * @param {[type]} dst [目标ID,如:#test1] * @param {[type]} trees [数据,格式:{}] * @param {[type]} inputname [上传表单名] * @param {[type]} layfilter [lay-filter的值] * @param {[type]} openall [默认展开全部] * @param {[type]} opengrade [展开的节点级别] * @param {[type]} checkboxrelated [多选是否关联节点] * @return {[type]} selecttype [checkbox or radio] */ render: function(dst, trees, opt){ var inputname = opt.inputname ? opt.inputname : 'menuids[]'; var layfilter = opt.layfilter ? opt.layfilter : 'checkauth'; var openall = opt.openall ? opt.openall : false; var selecttype = opt.selecttype ? opt.selecttype : 'checkbox'; var checkboxrelated = opt.checkboxrelated ? opt.checkboxrelated : 0; var opengrade = opt.opengrade ? opt.opengrade : 0; $(dst).html(obj.renderAuth(trees, 0, {inputname: inputname, layfilter: layfilter, openall: openall,selecttype:selecttype,opengrade:opengrade,checkboxrelated:checkboxrelated})); form.render(); $(dst).find('.auth-single:first').unbind('click').on('click', '.layui-form-checkbox', function(){ if(checkboxrelated==1){ return; } var elem = $(this).prev(); var checked = elem.is(':checked'); var childs = elem.parent().next().find('input[type="checkbox"]').prop('checked', checked); if(checked){ /*查找child的前边一个元素,并将里边的checkbox选中状态改为true。*/ elem.parents('.auth-child').prev().find('input[type="checkbox"]').prop('checked', true); } /*console.log(childs);*/ form.render('checkbox'); }); /* $(dst).find('.auth-single:first').unbind('click').on('click', '.layui-form-radio', function(){ obj.getRadio(dst); }); */ /*动态绑定展开事件*/ $(dst).unbind('click').on('click', '.auth-icon', function(){ var origin = $(this); var child = origin.parent().parent().find('.auth-child:first'); if(origin.is('.active')){ /*收起*/ origin.removeClass('active').html(''); child.slideUp('fast'); } else { /*展开*/ origin.addClass('active').html(''); child.slideDown('fast'); } return false; }) return obj; }, // 递归创建格式 renderAuth: function(tree, dept, opt){ var inputname = opt.inputname; var layfilter = opt.layfilter; var openall = opt.openall; var opengrade = opt.opengrade; var selecttype = opt.selecttype; var str = '
'; layui.each(tree, function(index, item){ var hasChild = item.list ? 1 : 0; // 注意:递归调用时,this的环境会改变! var append = hasChild ? obj.renderAuth(item.list, dept+1, opt) : ''; // '+new Array(dept * 4).join(' ')+' if(dept<=opengrade){ openall=true; } str += '
'+(hasChild?''+(openall?'':'')+'':'')+(dept > 0 ? '├─ ':'')+'
'+append+'
' }); str += '
'; return str; }, // 获取选中叶子结点 getLeaf: function(dst){ var leafs = $(dst).find('.auth-leaf').parent().find('input[type="checkbox"]:checked'); var data = []; leafs.each(function(index, item){ // console.log(item); data.push(item.value); }); // console.log(data); return data; }, // 获取所有选中的数据 getAll: function(dst){ var inputs = $(dst).find('input[type="checkbox"]'); var data = []; inputs.each(function(index, item){ data.push(item.value); }); // console.log(data); return data; }, // 获取所有选中的数据 getChecked: function(dst){ var inputs = $(dst).find('input[type="checkbox"]:checked'); var val = [],title=[]; inputs.each(function(index, item){ val.push(item.value); title.push($(item).attr('title')); }); res={val:val,title:title}; // console.log(data); return res; }, // 获取未选中数据 getNotChecked: function(dst){ var inputs = $(dst).find('input[type="checkbox"]:not(:checked)'); var val = [],title=[]; inputs.each(function(index, item){ val.push(item.value); title.push($(item).attr('title')); }); res={val:val,title:title}; // console.log(data); return res; }, // 获取所有选中的radio数据 getRadio: function(dst){ var radios=$(dst).find('input[type="radio"]:checked'); var res={val:'',title:''}; var val = radios.val(); var title=radios.attr('title'); if(radios){ res={val:val,title:title}; } return res; } } exports('authtree', obj); });