zui.datatable.min.js 13.8 KB
/*!
 * ZUI: 数据表格 - v1.6.0 - 2017-03-16
 * http://zui.sexy
 * GitHub: https://github.com/easysoft/zui.git 
 * Copyright (c) 2017 cnezsoft.com; Licensed MIT
 */
!function(t){"use strict";var a="zui.datatable",e=t.zui.store,s=function(e,s){this.name=a,this.$=t(e),this.isTable="TABLE"===this.$[0].tagName,this.firstShow=!0,this.isTable?(this.$table=this.$,this.id="datatable-"+(this.$.attr("id")||t.zui.uuid())):(this.$datatable=this.$.addClass("datatable"),this.$.attr("id")?this.id=this.$.attr("id"):(this.id="datatable-"+t.zui.uuid(),this.$.attr("id",this.id))),this.getOptions(s),this.load(),this.callEvent("ready")};s.DEFAULTS={checkable:!1,checkByClickRow:!0,checkedClass:"active",checkboxName:null,selectable:!0,sortable:!1,storage:!0,fixedHeader:!1,fixedHeaderOffset:0,fixedLeftWidth:"30%",fixedRightWidth:"30%",flexHeadDrag:!0,scrollPos:"in",rowHover:!0,colHover:!0,hoverClass:"hover",colHoverClass:"col-hover",mergeRows:!1,minColWidth:20,minFixedLeftWidth:200,minFixedRightWidth:200,minFlexAreaWidth:200},s.prototype.getOptions=function(a){var e=this.$;a=t.extend({},s.DEFAULTS,this.$.data(),a),a.tableClass=a.tableClass||"",a.tableClass=" "+a.tableClass+" table-datatable",t.each(["bordered","condensed","striped","condensed","fixed"],function(t,s){s="table-"+s,e.hasClass(s)&&(a.tableClass+=" "+s)}),(e.hasClass("table-hover")||a.rowHover)&&(a.tableClass+=" table-hover"),a.checkable&&t.fn.selectable||(a.selectable=!1),this.options=a},s.prototype.load=function(e){var s,l=this.options;if(t.isFunction(e))e=e(this.data,this),e.keepSort=!0;else if(t.isPlainObject(e))this.data=e;else if("string"==typeof e){var d=t(e);d.length&&(this.$table=d.first(),this.$table.data(a,this),this.isTable=!0),e=null}else e=l.data;if(!e){if(!this.isTable)throw new Error("No data avaliable!");e={cols:[],rows:[]},s=e.cols;var i,r,o,n,c,h,f=e.rows,p=this.$table;p.find("thead > tr:first").children("th").each(function(){r=t(this),s.push(t.extend({text:r.html(),flex:r.hasClass("flex-col"),width:"auto",cssClass:r.attr("class"),css:r.attr("style"),type:"string",ignore:r.hasClass("ignore"),sort:!r.hasClass("sort-disabled"),mergeRows:r.attr("merge-rows")},r.data()))}),p.find("tbody > tr").each(function(){o=t(this),c=t.extend({data:[],checked:!1,cssClass:o.attr("class"),css:o.attr("style"),id:o.attr("id")},o.data()),o.children("td").each(function(){if(n=t(this),h=n.attr("colspan")||1,c.data.push(t.extend({cssClass:n.attr("class"),css:n.attr("style"),text:n.html(),colSpan:h,title:n.attr("title")},n.data())),h>1)for(i=1;h>i;i++)c.data.push({empty:!0})}),f.push(c)});var b=p.find("tfoot");b.length&&(e.footer=t('<table class="table'+l.tableClass+'"></table>').append(b))}e.flexStart=-1,e.flexEnd=-1,s=e.cols,e.colsLength=s.length;for(var i=0;i<e.colsLength;++i){var g=s[i];g.flex&&(e.flexStart<0&&(e.flexStart=i),e.flexEnd=i)}0===e.flexStart&&e.flexEnd===e.colsLength&&(e.flexStart=-1,e.flexEnd=-1),e.flexArea=e.flexStart>=0,e.fixedRight=e.flexEnd>=0&&e.flexEnd<e.colsLength-1,e.fixedLeft=e.flexStart>0,e.flexStart<0&&e.flexEnd<0&&(e.fixedLeft=!0,e.flexStart=e.colsLength,e.flexEnd=e.colsLength),this.data=e,this.callEvent("afterLoad",{data:e}),this.render()},s.prototype.render=function(){var e,s,l,d,i=this,r=i.$datatable||(i.isTable?t('<div class="datatable" id="'+i.id+'"/>'):i.$datatable),o=i.options,n=i.data,c=i.data.cols,h=i.data.rows,f=o.checkable,p='<div class="datatable-rows-span datatable-span"><div class="datatable-wrapper"><table class="table"></table></div></div>',b='<div class="datatable-head-span datatable-span"><div class="datatable-wrapper"><table class="table"><thead></thead></table></div></div>';r.children(".datatable-head, .datatable-rows, .scroll-wrapper").remove(),r.toggleClass("sortable",o.sortable);var g,v,x,u=t('<div class="datatable-head"/>');for(e=t("<tr/>"),l=t("<tr/>"),d=t("<tr/>"),s=0;s<c.length;s++)x=c[s],g=s<n.flexStart?e:s>=n.flexStart&&s<=n.flexEnd?d:l,0===s&&f&&g.append('<th data-index="check" class="check-all check-btn"><i class="icon-check-empty"></i></th>'),x.ignore||(v=t("<th/>"),v.toggleClass("sort-down","down"===x.sort).toggleClass("sort-up","up"===x.sort).toggleClass("sort-disabled",x.sort===!1),v.addClass(x.cssClass).addClass(x.colClass).html(x.text).attr({"data-index":s,"data-type":x.type,style:x.css}),g.append(v));var C;n.fixedLeft&&(C=t(b),C.addClass("fixed-left").find("table").addClass(o.tableClass).find("thead").append(e),u.append(C)),n.flexArea&&(C=t(b),C.addClass("flexarea").find(".datatable-wrapper").append('<div class="scrolled-shadow scrolled-in-shadow"></div><div class="scrolled-shadow scrolled-out-shadow"></div>').find("table").addClass(o.tableClass).find("thead").append(d),u.append(C)),n.fixedRight&&(C=t(b),C.addClass("fixed-right").find("table").addClass(o.tableClass).find("thead").append(l),u.append(C)),r.append(u);var w,k,m,y,$,S,E,L,A=t('<div class="datatable-rows">'),H=h.length;e=t("<tbody/>"),l=t("<tbody/>"),d=t("<tbody/>");for(var R=0;H>R;++R){for(S=h[R],"undefined"==typeof S.id&&(S.id=R),S.index=R,w=t("<tr/>"),w.addClass(S.cssClass).toggleClass(o.checkedClass,!!S.checked).attr({"data-index":R,"data-id":S.id}),k=w.clone(),m=w.clone(),L=S.data.length,s=0;L>s;++s)E=S.data[s],s>0&&E.empty||(g=s<n.flexStart?w:s>=n.flexStart&&s<=n.flexEnd?k:m,0===s&&f&&($=t('<td data-index="check" class="check-row check-btn"><i class="icon-check-empty"></i></td>'),o.checkboxName&&$.append('<input class="hide" type="checkbox" name="'+o.checkboxName+'" value="'+S.id+'">'),g.append($)),c[s].ignore||(t.isPlainObject(E)?(E.row=R,E.index=s):E={text:E,row:R,index:s},S.data[s]=E,y=t("<td/>"),y.html(E.text).addClass(E.cssClass).addClass(c[s].colClass).attr("colspan",E.colSpan).attr({"data-row":R,"data-index":s,"data-flex":!1,"data-type":c[s].type,style:E.css,title:E.title||""}),g.append(y)));e.append(w),d.append(k),l.append(m)}var T;n.fixedLeft&&(T=t(p),T.addClass("fixed-left").find("table").addClass(o.tableClass).append(e),A.append(T)),n.flexArea&&(T=t(p),T.addClass("flexarea").find(".datatable-wrapper").append('<div class="scrolled-shadow scrolled-in-shadow"></div><div class="scrolled-shadow scrolled-out-shadow"></div>').find("table").addClass(o.tableClass).append(d),A.append(T)),n.fixedRight&&(T=t(p),T.addClass("fixed-right").find("table").addClass(o.tableClass).append(l),A.append(T)),r.append(A),n.flexArea&&r.append('<div class="scroll-wrapper"><div class="scroll-slide scroll-pos-'+o.scrollPos+'"><div class="bar"></div></div></div>');var z=r.children(".datatable-footer").detach();n.footer?(r.append(t('<div class="datatable-footer"/>').append(n.footer)),n.footer=null):z.length&&r.append(z),i.$datatable=r.data(a,i),i.isTable&&i.firstShow&&(i.$table.attr("data-datatable-id",this.id).hide().after(r),i.firstShow=!1),i.bindEvents(),i.refreshSize(),i.callEvent("render")},s.prototype.bindEvents=function(){var a=this,s=this.data,l=this.options,d=this.$datatable,i=a.$dataSpans=d.children(".datatable-head, .datatable-rows").find(".datatable-span"),r=a.$rowsSpans=d.children(".datatable-rows").children(".datatable-rows-span"),o=a.$headSpans=d.children(".datatable-head").children(".datatable-head-span"),n=a.$cells=i.find("td, th"),c=a.$dataCells=n.filter("td");a.$headCells=n.filter("th");var h=a.$rows=a.$rowsSpans.find(".table > tbody > tr");if(l.rowHover){var f=l.hoverClass;r.on("mouseenter","td",function(){c.filter("."+f).removeClass(f),h.filter("."+f).removeClass(f),h.filter('[data-index="'+t(this).addClass(f).closest("tr").data("index")+'"]').addClass(f)}).on("mouseleave","td",function(){c.filter("."+f).removeClass(f),h.filter("."+f).removeClass(f)})}if(l.colHover){var p=l.colHoverClass;o.on("mouseenter","th",function(){n.filter("."+p).removeClass(p),n.filter('[data-index="'+t(this).data("index")+'"]').addClass(p)}).on("mouseleave","th",function(){n.filter("."+p).removeClass(p)})}if(s.flexArea){var b,g,v,x,u,C,w,k=d.find(".scroll-slide"),m=d.find(".datatable-span.flexarea"),y=d.find(".datatable-span.fixed-left"),$=d.find(".datatable-span.flexarea .table"),S=k.children(".bar"),E=a.id+"_scrollOffset";a.width=d.width(),d.resize(function(){a.width=d.width()});var L=function(t,a){u=Math.max(0,Math.min(b-g,t)),a||d.addClass("scrolling"),S.css("left",u),w=0-Math.floor((v-b)*u/(b-g)),$.css("left",w),x=u,d.toggleClass("scrolled-in",u>2).toggleClass("scrolled-out",b-g-2>u),l.storage&&e.pageSet(E,u)},A=function(){b=m.width(),k.width(b).css("left",y.width()),v=$.width(),g=Math.floor(b*b/v),S.css("width",g),$.css("min-width",b),d.toggleClass("show-scroll-slide",v>b),C||b===g||(C=!0,L(e.pageGet(E,0),!0)),d.hasClass("size-changing")&&L(u,!0)};m.resize(A),l.storage&&A();var H={move:!1,stopPropagation:!0,drag:function(t){L(S.position().left+t.smallOffset.x*(t.element.hasClass("bar")?1:-1))},finish:function(){d.removeClass("scrolling")}};t.fn.draggable?(S.draggable(H),l.flexHeadDrag&&d.find(".datatable-head-span.flexarea").draggable(H)):console.error("DataTable requires draggable.js to improve UI."),k.mousedown(function(t){var a=t.pageX-k.offset().left;L(a-g/2)})}if(l.checkable){var R,T=a.id+"_checkedStatus",z=l.checkedClass,O=function(){var d=r.first().find(".table > tbody > tr"),i=d.filter("."+z);l.checkboxName&&d.find(".check-row input:checkbox").prop("checked",!1);var n={checkedAll:d.length===i.length&&i.length>0,checks:i.map(function(){return R=t(this).data("id"),l.checkboxName&&t(this).find(".check-row input:checkbox").prop("checked",!0),R}).toArray()};a.checks=n,t.each(s.rows,function(a,e){e.checked=t.inArray(e.id,n.checks)>-1}),o.find(".check-all").toggleClass("checked",!!n.checkedAll),l.storage&&e.pageSet(T,n),a.callEvent("checksChanged",{checks:n})},F=function(a,e){var s=t(a).closest("tr");void 0===e&&(e=!s.hasClass(z)),h.filter('[data-index="'+s.data("index")+'"]').toggleClass(z,!!e)},N="click.zui.datatable.check";if(l.selectable){var W={selector:".datatable-rows tr",trigger:".datatable-rows",start:function(a){var e=t(a.target).closest(".check-row, .check-btn");return e.length?(e.is(".check-row")&&(F(e),O()),!1):void 0},rangeFunc:function(t,a){return Math.max(t.top,a.top)<Math.min(t.top+t.height,a.top+a.height)},select:function(t){F(t.target,!0)},unselect:function(t){F(t.target,!1)},finish:function(t){O()}};t.isPlainObject(l.selectable)&&t.extend(W,l.selectable),this.$datatable.selectable(W)}else this.$rowsSpans.off(N).on(N+"row",l.checkByClickRow?"tr":".check-row",function(){F(this),O()});if(this.$datatable.off(N).on("click.zui.datatable.check",".check-all",function(){h.toggleClass(z,t(this).toggleClass("checked").hasClass("checked")),O()}).on(N+".none",".check-none",function(){h.toggleClass(z,!1),O()}).on(N+".inverse",".check-inverse",function(){h.toggleClass(z),O()}),l.storage){var j=e.pageGet(T);j&&(o.find(".check-all").toggleClass("checked",j.checkedAll),j.checkedAll?h.addClass(z):(h.removeClass(z),t.each(j.checks,function(t,a){h.filter('[data-id="'+a+'"]').addClass(z)})),j.checks.length&&O())}}if(l.fixedHeader){var D,M,P,B=d.children(".datatable-head"),G=l.fixedHeaderOffset||t(".navbar.navbar-fixed-top").height()||0,U=function(){D=d.offset().top,P=t(window).scrollTop(),M=d.height(),d.toggleClass("head-fixed",P+G>D&&D+M>P+G),d.hasClass("head-fixed")?B.css({width:d.width(),top:G}):B.attr("style","")};t(window).scroll(U),U()}l.sortable?(o.on("click","th:not(.sort-disabled, .check-btn)",function(){d.hasClass("size-changing")||a.sortTable(t(this))}),l.storage&&a.sortTable()):l.mergeRows&&this.mergeRows()},s.prototype.mergeRows=function(){for(var a=this.$rowsSpans.find(".table > tbody > tr > td"),e=this.data.cols,s=0;s<e.length;s++){var l=e[s];if(l.mergeRows){var d=a.filter('[data-index="'+s+'"]');if(d.length>1){var i,r;d.each(function(){var a=t(this);i&&a.html()===i.html()?(r=i.attr("rowspan")||1,"number"!=typeof r&&(r=parseInt(r),isNaN(r)&&(r=1)),i.attr("rowspan",r+1).css("vertical-align","middle"),a.remove()):i=a})}}}},s.prototype.sortTable=function(a){var e=t.zui.store,s=this.options,l=this.id+"_datatableSorter",d=s.storage?e.pageGet(l):null;if(a||(a=d?this.$headCells.filter('[data-index="'+d.index+'"]').addClass("sort-"+d.type):this.$headCells.filter(".sort-up, .sort-down").first()),a.length){var i,r,o,n=this.data,c=n.cols,h=n.rows,f=this.$headCells;i=!a.hasClass("sort-up"),n.keepSort&&(i=!i),n.keepSort=null,f.removeClass("sort-up sort-down"),a.addClass(i?"sort-up":"sort-down"),o=a.data("index"),t.each(c,function(t,a){t==o||"up"!==a.sort&&"down"!==a.sort?t==o&&(a.sort=i?"up":"down",r=a.type):a.sort=!0});var p,b,g,v=this.$dataCells.filter('[data-index="'+o+'"]');h.sort(function(t,a){return t=t.data[o],a=a.data[o],p=v.filter('[data-row="'+t.row+'"]').text(),b=v.filter('[data-row="'+a.row+'"]').text(),"number"===r?(p=parseFloat(p),b=parseFloat(b)):"date"===r?(p=Date.parse(p),b=Date.parse(b)):(p=p.toLowerCase(),b=b.toLowerCase()),g=p>b?1:b>p?-1:0,i&&(g=-1*g),g});var x,u,C,w=this.$rows,k=[];t.each(h,function(a,e){x=w.filter('[data-index="'+e.index+'"]'),x.each(function(a){C=t(this),u=k[a],u?u.after(C):C.parent().prepend(C),k[a]=C})}),d={index:o,type:i?"up":"down"},s.storage&&e.pageSet(l,d),this.callEvent("sort",{sorter:d})}},s.prototype.refreshSize=function(){var a,e=this.$datatable,s=this.options,l=this.data.rows,d=this.data.cols;e.find(".datatable-span.fixed-left").css("width",s.fixedLeftWidth),e.find(".datatable-span.fixed-right").css("width",s.fixedRightWidth);var i=function(a){var e,s,l=0;return a.css("height","auto"),a.each(function(){e=t(this),s=e.attr("rowspan"),s&&1!=s||(l=Math.max(l,e.outerHeight()))}),l},r=this.$dataCells,o=this.$cells,n=this.$headCells;for(a=0;a<d.length;++a)o.filter('[data-index="'+a+'"]').css("width",d[a].width);var c=i(n);n.css("min-height",c).css("height",c);var h;for(a=0;a<l.length;++a){h=r.filter('[data-row="'+a+'"]');var f=i(h);h.css("min-height",f).css("height",f)}},s.prototype.callEvent=function(t,a){var e=this.$.callEvent(t+"."+this.name,a,this).result;return!(void 0!==e&&!e)},t.fn.datatable=function(e,l){return this.each(function(){var d=t(this),i=d.data(a),r="object"==typeof e&&e;i||d.data(a,i=new s(this,r)),"string"==typeof e&&("load"!==e||!t.isPlainObject(l)||void 0!==l.keepSort&&null!==l.keepSort||(l.keepSort=!0),i[e](l))})},t.fn.datatable.Constructor=s}(jQuery);