/*! * Nestable jQuery Plugin - Copyright (c) 2012 David Bushell - http://dbushell.com/ * Dual-licensed under the BSD or MIT licenses */ ;(function($, window, document, undefined) { var hasTouch = 'ontouchstart' in document; /** * Detect CSS pointer-events property * events are normally disabled on the dragging element to avoid conflicts * https://github.com/ausi/Feature-detection-technique-for-pointer-events/blob/master/modernizr-pointerevents.js */ var hasPointerEvents = (function() { var el = document.createElement('div'), docEl = document.documentElement; if (!('pointerEvents' in el.style)) { return false; } el.style.pointerEvents = 'auto'; el.style.pointerEvents = 'x'; docEl.appendChild(el); var supports = window.getComputedStyle && window.getComputedStyle(el, '').pointerEvents === 'auto'; docEl.removeChild(el); return !!supports; })(); var defaults = { listNodeName : 'ol', itemNodeName : 'li', rootClass : 'dd', listClass : 'dd-list', itemClass : 'dd-item', dragClass : 'dd-dragel', handleClass : 'dd-handle', collapsedClass : 'dd-collapsed', placeClass : 'dd-placeholder', noDragClass : 'dd-nodrag', emptyClass : 'dd-empty', deleteClass : 'dd-del', itemKey :'', itemName :'', aliasName :'', expandBtnHTML : '', collapseBtnHTML : '', group : 0, maxDepth : 5, threshold : 20, rmSourceItem :true , addItemCloseBtn :false, dragFlag :true, addItemQuickBtn:false, quickKey:'quickKey', quickDesc:'quickDesc', quickTitle:'快捷', quickEnum:[{'key':'是','value':'是'},{'key':'否','value':'否'}], data:null, dataJsonKey:'json' }; function Plugin(element, options) { this.w = $(document); this.el = $(element); this.options = $.extend({}, defaults, options); this.init(); } Plugin.prototype = { init: function() { var list = this; list.buildOl(); list.reset(); list.el.data('nestable-group', this.options.group); list.placeEl = $('
'); $.each(this.el.find(list.options.itemNodeName), function(k, el) { list.setParent($(el)); }); list.el.on('click', 'button', function(e) { if (list.dragEl) { return; } var target = $(e.currentTarget), action = target.data('action'), item = target.parent(list.options.itemNodeName); if (action === 'collapse') { list.collapseItem(item); } if (action === 'expand') { list.expandItem(item); } }); var onStartEvent = function(e) { var handle = $(e.target); if (!handle.hasClass(list.options.handleClass)) { if (handle.closest('.' + list.options.noDragClass).length) { return; } handle = handle.closest('.' + list.options.handleClass); } if (!handle.length || list.dragEl) { return; } list.isTouch = /^touch/.test(e.type); if (list.isTouch && e.touches.length !== 1) { return; } e.preventDefault(); list.dragStart(e.touches ? e.touches[0] : e); }; var onMoveEvent = function(e) { if (list.dragEl) { e.preventDefault(); list.dragMove(e.touches ? e.touches[0] : e); } }; var onEndEvent = function(e) { if (list.dragEl) { e.preventDefault(); list.dragStop(e.touches ? e.touches[0] : e); } }; if (hasTouch) { list.el[0].addEventListener('touchstart', onStartEvent, false); window.addEventListener('touchmove', onMoveEvent, false); window.addEventListener('touchend', onEndEvent, false); window.addEventListener('touchcancel', onEndEvent, false); } if(this.options.dragFlag){ list.el.on('mousedown', onStartEvent); list.w.on('mousemove', onMoveEvent); list.w.on('mouseup', onEndEvent); } if(this.options.addItemCloseBtn){ list.el.delegate("."+this.options.deleteClass,'click',function(e){ var itemList = $(this).parent().parent(); var length = itemList.children().length; $(this).parent('.'+list.options.itemClass).remove(); if(length == 1){ itemList.remove(); list.el.append(""); } }); } //2020年2月19日19:59:49 增加没有数据时插入空图片 list.el.children().length == 0 && list.el.append(""); $.each(list.el.find("." + list.options.itemClass),function(i,item){ var id = $(item).attr("data-id"); if(id == null || id == undefined || id == ""){ if(util.isNull(list.options.itemKey)){ var num = list.randomNum(); $(item).attr("data-id",num) ; return true; } $(item).attr("data-id",$(item).data(list.options.itemKey.toLowerCase())) ; } }); }, randomNum:function(){ return new Date().getTime()+ parseInt(Math.random()*100000,10); }, serialize: function() { var data, depth = 0, list = this; step = function(level, depth) { var array = [ ], items = level.children(list.options.itemNodeName); items.each(function() { var li = $(this), item = $.extend({}, li.data()), sub = li.children(list.options.listNodeName); if (sub.length) { item.children = step(sub, depth + 1); } array.push(item); }); return array; }; data = step(list.el.find(list.options.listNodeName).first(), depth); return data; }, serialise: function() { return this.serialize(); }, reset: function() { this.mouse = { offsetX : 0, offsetY : 0, startX : 0, startY : 0, lastX : 0, lastY : 0, nowX : 0, nowY : 0, distX : 0, distY : 0, dirAx : 0, dirX : 0, dirY : 0, lastDirX : 0, lastDirY : 0, distAxX : 0, distAxY : 0 }; this.isTouch = false; this.moving = false; this.dragEl = null; this.dragRootEl = null; this.dragDepth = 0; this.hasNewRoot = false; this.pointEl = null; this.sourceIndex = null; this.sourceParent = null; }, expandItem: function(li) { li.removeClass(this.options.collapsedClass); li.children('[data-action="expand"]').hide(); li.children('[data-action="collapse"]').show(); li.children(this.options.listNodeName).show(); }, collapseItem: function(li) { var lists = li.children(this.options.listNodeName); if (lists.length) { li.addClass(this.options.collapsedClass); li.children('[data-action="collapse"]').hide(); li.children('[data-action="expand"]').show(); li.children(this.options.listNodeName).hide(); } }, expandAll: function() { var list = this; list.el.find(list.options.itemNodeName).each(function() { list.expandItem($(this)); }); }, collapseAll: function() { var list = this; list.el.find(list.options.itemNodeName).each(function() { list.collapseItem($(this)); }); }, setParent: function(li) { if (li.children(this.options.listNodeName).length) { li.prepend($(this.options.expandBtnHTML)); li.prepend($(this.options.collapseBtnHTML)); } li.children('[data-action="expand"]').hide(); }, unsetParent: function(li) { li.removeClass(this.options.collapsedClass); li.children('[data-action]').remove(); li.children(this.options.listNodeName).remove(); }, dragStart: function(e) { var mouse = this.mouse, target = $(e.target), dragItem = target.closest(this.options.itemNodeName); this.sourceIndex = dragItem.index(); this.sourceParent = dragItem.parent(); this.placeEl.css('height', dragItem.height()); mouse.offsetX = e.offsetX !== undefined ? e.offsetX : e.pageX - target.offset().left; mouse.offsetY = e.offsetY !== undefined ? e.offsetY : e.pageY - target.offset().top; mouse.startX = mouse.lastX = e.pageX; mouse.startY = mouse.lastY = e.pageY; this.dragRootEl = this.el; this.dragEl = $(document.createElement(this.options.listNodeName)).addClass(this.options.listClass + ' ' + this.options.dragClass); this.dragEl.css('width', dragItem.width()); dragItem.after(this.placeEl); dragItem[0].parentNode.removeChild(dragItem[0]); dragItem.appendTo(this.dragEl); $(document.body).append(this.dragEl); this.dragEl.css({ 'left' : e.pageX - mouse.offsetX, 'top' : e.pageY - mouse.offsetY }); // total depth of dragging item var i, depth, items = this.dragEl.find(this.options.itemNodeName); for (i = 0; i < items.length; i++) { depth = $(items[i]).parents(this.options.listNodeName).length; if (depth > this.dragDepth) { this.dragDepth = depth; } } }, getCloseBtnFlag:function(){ return this.options.addItemCloseBtn; }, getQuickBtn:function(){ return this.options.addItemQuickBtn; }, getItems:function(){ return this.el.find("."+this.options.itemClass); }, getItemData: function(){ var arr = new Array(); var that =this; $.each(that.getItems(),function(i,item){ var d = $(item).data("json"); var quickFlag = that.options.quickEnum[1].key; var checkbox = $(item).find("input[type=checkbox][name="+that.options.quickKey+"]:checked"); if(checkbox.length > 0 ){ quickFlag = that.options.quickEnum[0].key; } d[that.options.quickKey] = checkbox.length > 0 ? that.options.quickEnum[0].key : that.options.quickEnum[1].key; d[that.options.quickDesc] = checkbox.length > 0 ? that.options.quickEnum[0].value : that.options.quickEnum[1].value; arr.push(d); }); return arr; }, getQuickHtml:function(flag){ return '