|
|
/*
|
|
|
* 功能：依赖bootstrap-table实现treegrid，参照landeanfen例子做了部分修改优化
|
|
|
* 作者：lds2013@163.com
|
|
|
* 日期：2017年10月5日
|
|
|
* 修改：2018年4月20日
|
|
|
* 内容：1、支持自定义收缩、展开图标；
|
|
|
* 2、支持自定义父级ID传入，默认ParentId；
|
|
|
* 3、父级ID最顶层改为0；
|
|
|
* 4、修改最后子级前的小图标；
|
|
|
* 5、支持展开、收缩事件；
|
|
|
* 6、支持定义是否层叠选中状态(选中父级，子级全部选中)的开关；
|
|
|
|
|
|
*用法： $('#tb').bootstrapTable({
|
|
|
method: 'post',
|
|
|
url: '/HR/HrDept/GetList',
|
|
|
singleSelect: true,//单行选择
|
|
|
clickToSelect: true,//点击行时自动选择
|
|
|
striped: true,//是否显示行间隔色
|
|
|
treeView: true,//是否显示树形视图
|
|
|
treeId: "DeptID",//定义关键字段来标识树节点
|
|
|
treeField: "DeptName",//定义树节点字段
|
|
|
treeParentId: "MasterID", //定义父级ID字段
|
|
|
treeRootLevel: 1,//树根的级别
|
|
|
treeCollapseAll: false,//是否全部折叠，默认折叠
|
|
|
uniqueId: "DeptID", //每一行的唯一标识，一般为主键列
|
|
|
columns:
|
|
|
[
|
|
|
{ field: 'ck', checkbox: true },
|
|
|
{ field: 'DeptID', title: '机构ID'},
|
|
|
{ field: 'MasterID', title: '上级ID', visible: false },
|
|
|
{ field: 'DeptName', title: '机构名称' }
|
|
|
]
|
|
|
});
|
|
|
|
|
|
* 注意事项：暂无
|
|
|
*
|
|
|
*/
|
|
|
(function(d){var g=function(p){var n=arguments,m=true,o=1;p=p.replace(/%s/g,function(){var q=n[o++];if(typeof q==="undefined"){m=false;return""}return q});return m?p:""};var b=function(n,o){var m=-1;d.each(n,function(p,q){if(q.field===o){m=p;return false}return true});return m};var k=function(m){if(typeof m==="string"){return m.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'").replace(/`/g,"`")}return m};var l=function(n,p,o,m){var q=p;if(typeof p==="string"){var r=p.split(".");if(r.length>1){q=window;d.each(r,function(s,t){q=q[t]})}else{q=window[p]}}if(typeof q==="object"){return q}if(typeof q==="function"){return q.apply(n,o)}if(!q&&typeof p==="string"&&g.apply(this,[p].concat(o))){return g.apply(this,[p].concat(o))}return m};var i=function(n,r){var o=n;if(typeof r!=="string"||n.hasOwnProperty(r)){return n[r]}var m=r.split(".");for(var q in m){o=o[m[q]]}return o};var c=function(r,n,p,q){var o=[];var m=d.grep(p,function(u,s){for(var t in u){if(t==r){return u[t]==n[q]}}});d.each(m,function(s,t){o.splice(0,0,t);var u=c(t,p,q);d.each(u,function(v,w){o.splice(0,0,w)})});return o};var h=function(q,n,o,p){var m=d.grep(o,function(t,r){for(var s in t){if(s==q){return t[s]==n[p]}}});return m};var f=function(s,n,p,q){var o=[];var m=function(t){d.each(t,function(u,w){o.push(w);var v=h(s,w,p,q);if(v!=null&&v.length>0){m(v)}})};var r=h(s,n,p,q);m(r);return o};var a=d.fn.bootstrapTable.Constructor,j=a.prototype.initData,e=a.prototype.initPagination;a.prototype.initData=function(){j.apply(this,Array.prototype.slice.apply(arguments));var p=this;if(p.options.treeView&&this.data.length>0){var q=[],n=1;var m=d.grep(this.data,function(t,r){for(var s in t){if(s==p.options.treeParentId){return t[s]==0}}});var o=function(s){var r=p.options.treeRootLevel+n;d.each(s,function(t,v){v.level=r;if(p.options.treeCollapseAll){v.hidden=true}var u=h(p.options.treeParentId,v,p.data,p.options.treeId);if(u==null||u.length==0){v.isLast=true}q.push(v);if(u!=null&&u.length>0){n++;o(u)}else{n=1}})};d.each(m,function(r,s){s.level=p.options.treeRootLevel;var t=h(p.options.treeParentId,s,p.data,p.options.treeId);if(t==null||t.length==0){s.isLast=true}q.push(s);o(t)});p.options.data=p.data=q}};a.prototype.initPagination=function(){if(this.options.treeView){}e.apply(this,Array.prototype.slice.apply(arguments))};a.prototype.initRow=function(x,s,r,p){var u=this,w,t=[],m={},n=[],o="",q={},v=[];if(d.inArray(x,this.hiddenRows)>-1){return}m=l(this.options,this.options.rowStyle,[x,s],m);if(m&&m.css){for(w in m.css){n.push(w+": "+m.css[w])}}q=l(this.options,this.options.rowAttributes,[x,s],q);if(q){for(w in q){v.push(g('%s="%s"',w,k(q[w])))}}if(x._data&&!d.isEmptyObject(x._data)){d.each(x._data,function(z,y){if(z==="index"){return}o+=g(' data-%s="%s"',z,y)})}t.push("<tr",g(" %s",v.join(" ")),g(' id="%s"',d.isArray(x)?undefined:x._id),g(' class="%s"',m.classes||(d.isArray(x)?undefined:x._class)),g(' data-index="%s"',s),g(' data-uniqueid="%s"',x[this.options.uniqueId]),g("%s",o),">");if(this.options.cardView){t.push(g('<td colspan="%s"><div class="card-views">',this.header.fields.length))}if(!this.options.cardView&&this.options.detailView){t.push("<td>",'<a class="detail-icon" href="#">',g('<i class="%s %s"></i>',this.options.iconsPrefix,this.options.icons.detailOpen),"</a>","</td>")}d.each(this.header.fields,function(M,y){var H="",I=i(x,y,u.options.escape),K="",C="",O={},z="",P=u.header.classes[M],E="",J="",L="",F="",A=u.columns[M];if(u.fromHtml&&typeof I==="undefined"){return}if(!A.visible){return}if(u.options.cardView&&(!A.cardVisible)){return}if(A.escape){I=k(I)}m=g('style="%s"',n.concat(u.header.styles[M]).join("; "));if(x["_"+y+"_id"]){z=g(' id="%s"',x["_"+y+"_id"])}if(x["_"+y+"_class"]){P=g(' class="%s"',x["_"+y+"_class"])}if(x["_"+y+"_rowspan"]){J=g(' rowspan="%s"',x["_"+y+"_rowspan"])}if(x["_"+y+"_colspan"]){L=g(' colspan="%s"',x["_"+y+"_colspan"])}if(x["_"+y+"_title"]){F=g(' title="%s"',x["_"+y+"_title"])}O=l(u.header,u.header.cellStyles[M],[I,x,s,y],O);if(O.classes){P=g(' class="%s"',O.classes)}if(O.css){var B=[];for(var Q in O.css){B.push(Q+": "+O.css[Q])}m=g('style="%s"',B.concat(u.header.styles[M]).join("; "))}K=l(A,u.header.formatters[M],[I,x,s],I);if(x["_"+y+"_data"]&&!d.isEmptyObject(x["_"+y+"_data"])){d.each(x["_"+y+"_data"],function(S,R){if(S==="index"){return}E+=g(' data-%s="%s"',S,R)})}if(A.checkbox||A.radio){C=A.checkbox?"checkbox":C;C=A.radio?"radio":C;H=[g(u.options.cardView?'<div class="card-view %s">':'<td class="bs-checkbox %s">',A["class"]||""),"<input"+g(' data-index="%s"',s)+g(' name="%s"',u.options.selectItemName)+g(' type="%s"',C)+g(' value="%s"',x[u.options.idField])+g(' checked="%s"',K===true||(I||K&&K.checked)||(x&&x.checked)?"checked":undefined)+g(' disabled="%s"',!A.checkboxEnabled||(K&&K.disabled)?"disabled":undefined)+" />",u.header.formatters[M]&&typeof K==="string"?K:"",u.options.cardView?"</div>":"</td>"].join("");x[u.header.stateField]=K===true||(K&&K.checked)
|
|
|
}else{K=typeof K==="undefined"||K===null?u.options.undefinedText:K;var G,N;if(u.options.treeView&&A.field==u.options.treeField){var G=x.level==u.options.treeRootLevel?"":g('<span style="margin-left: %spx;"></span>',(x.level-u.options.treeRootLevel)*15);var D=d.grep(r,function(S,R){for(var R in S){if(R==u.options.treeParentId){return S[R]==x[u.options.treeId]&&!S.hidden}}});N=g('<span class="tree-icon %s" style="cursor: pointer; margin: 0px 5px;"></span>',D.length>0?u.options.expandIcon:u.options.collapseIcon);if(x.isLast){N=g('<span class="tree-icon %s" style="cursor: pointer; margin: 0px 5px;"></span>',u.options.lastIcon)}}H=u.options.cardView?['<div class="card-view">',u.options.showHeader?g('<span class="title" %s>%s</span>',m,getPropertyFromOther(u.columns,"field","title",y)):"",g('<span class="value">%s</span>',K),"</div>"].join(""):[g("<td%s %s %s %s %s %s %s>",z,P,m,E,J,L,F),G,N,K,"</td>"].join("");if(u.options.cardView&&u.options.smartDisplay&&K===""){H='<div class="card-view"></div>'}}t.push(H)});if(this.options.cardView){t.push("</div></td>")}t.push("</tr>");return t.join(" ")};a.prototype.initBody=function(p){var s=this,q=[],n=this.getData();this.trigger("pre-body",n);this.$body=this.$el.find(">tbody");if(!this.$body.length){this.$body=d("<tbody></tbody>").appendTo(this.$el)}if(!this.options.pagination||this.options.sidePagination==="server"){this.pageFrom=1;this.pageTo=n.length}var m=d(document.createDocumentFragment());var r;for(var o=this.pageFrom-1;o<this.pageTo;o++){var u=n[o];if(u.hidden){continue}var t=this.initRow(u,o,n,m);r=r||!!t;if(t&&t!==true){m.append(t)}}if(!r){m.append('<tr class="no-records-found">'+g('<td colspan="%s">%s</td>',this.$header.find("th").length,this.options.formatNoMatches())+"</tr>")}this.$body.html(m);if(!p){this.scrollTo(0)}this.$body.find("> tr[data-index] > td").off("click dblclick").on("click dblclick",function(B){var v=d(this),x=v.parent(),E=s.data[x.data("index")],z=v[0].cellIndex,y=s.getVisibleFields(),C=y[s.options.detailView&&!s.options.cardView?z-1:z],w=s.columns[b(s.columns,C)],D=i(E,C,s.options.escape);if(v.find(".detail-icon").length){return}s.trigger(B.type==="click"?"click-cell":"dbl-click-cell",C,D,E,v);s.trigger(B.type==="click"?"click-row":"dbl-click-row",E,x,C);if(B.type==="click"&&s.options.clickToSelect&&w.clickToSelect){var A=x.find(g('[name="%s"]',s.options.selectItemName));if(A.length){d.each(s.data,function(F,G){if(G.ck!=undefined&&G.ck==true){G.ck=false}});A[0].click()}}});this.$body.find("> tr[data-index] > td > .detail-icon").off("click").on("click",function(){var z=d(this),y=z.parent().parent(),w=y.data("index"),A=n[w];if(y.next().is("tr.detail-view")){z.find("i").attr("class",g("%s %s",s.options.iconsPrefix,s.options.icons.detailOpen));s.trigger("collapse-row",w,A);y.next().remove()}else{z.find("i").attr("class",g("%s %s",s.options.iconsPrefix,s.options.icons.detailClose));y.after(g('<tr class="detail-view"><td colspan="%s"></td></tr>',y.find("td").length));var v=y.next().find("td");var x=l(s.options,s.options.detailFormatter,[w,A,v],"");if(v.length===1){v.append(x)}s.trigger("expand-row",w,A,v)}s.resetView();return false});this.$body.find("> tr[data-index] > td > .tree-icon").off("click").on("click",function(z){z.stopPropagation();var y=d(this),x=y.parent().parent(),v=x.data("index"),A=n[v];var w=d(this);if(w.hasClass(s.options.expandIcon)){w.removeClass(s.options.expandIcon).addClass(s.options.collapseIcon);var B=f(s.options.treeParentId,n[v],n,s.options.treeId);d.each(B,function(C,D){d.each(s.data,function(E,F){if(F[s.options.treeId]==D[s.options.treeId]){F.hidden=true;return}})})}else{w.removeClass(s.options.collapseIcon).addClass(s.options.expandIcon);var B=h(s.options.treeParentId,n[v],n,s.options.treeId);d.each(B,function(C,D){d.each(s.data,function(E,F){if(F[s.options.treeId]==D[s.options.treeId]){F.hidden=false;return}})})}s.options.data=s.data;s.initBody(true)});this.$selectItem=this.$body.find(g('[name="%s"]',this.options.selectItemName));this.$selectItem.off("click").on("click",function(w){w.stopImmediatePropagation();var x=d(this),v=x.prop("checked"),y=s.data[x.data("index")];if(s.options.maintainSelected&&d(this).is(":radio")){d.each(s.options.data,function(A,B){B[s.header.stateField]=false})}y[s.header.stateField]=v;if(s.options.singleSelect){s.$selectItem.not(this).each(function(){s.data[d(this).data("index")][s.header.stateField]=false});s.$selectItem.filter(":checked").not(this).prop("checked",false)}if(!s.options.singleSelect&&s.options.cascadeCheck){var z=f(s.options.treeParentId,y,s.options.data,s.options.treeId);d.each(z,function(A,B){d.each(s.data,function(C,D){if(D[s.options.treeId]==B[s.options.treeId]){D.checked=v?true:false;return}})})}s.options.data=s.data;s.initBody(true);s.updateSelected();s.trigger(v?"check":"uncheck",y,x)});d.each(this.header.events,function(y,x){if(!x){return}if(typeof x==="string"){x=l(null,x)}var z=s.header.fields[y],v=d.inArray(z,s.getVisibleFields());if(s.options.detailView&&!s.options.cardView){v+=1
|
|
|
}for(var w in x){s.$body.find(">tr:not(.no-records-found)").each(function(){var E=d(this),F=E.find(s.options.cardView?".card-view":"td").eq(v),B=w.indexOf(" "),A=w.substring(0,B),C=w.substring(B+1),D=x[w];F.find(C).off(A).on(A,function(I){var G=E.data("index"),J=s.data[G],H=J[z];D.apply(this,[I,H,J,G])})})}});this.updateSelected();this.resetView();this.trigger("post-body",n)};a.prototype.expandAllTree=function(){var n=this;var m=d.grep(this.data,function(q,o){for(var p in q){if(p==parentId){return q[p]==0}}});d.each(m,function(o,p){var q=f(n.options.treeParentId,p,n.options.data,n.options.treeId);d.each(q,function(r,s){s.hidden=false})});n.initBody(true)};a.prototype.collapseAllTree=function(){var n=this;var m=d.grep(this.data,function(q,o){for(var p in q){if(p==parentId){return q[p]==0}}});d.each(m,function(o,p){var q=f(n.options.treeParentId,p,n.options.data,n.options.treeId);d.each(q,function(r,s){s.hidden=true})});n.initBody(true)};d.extend(d.fn.bootstrapTable.defaults,{treeView:false,treeId:"id",treeField:"name",treeParentId:"ParentId",treeRootLevel:1,treeCollapseAll:true,cascadeCheck:true,collapseIcon:"glyphicon glyphicon-plus",expandIcon:"glyphicon glyphicon-minus",lastIcon:"glyphicon glyphicon-hand-right"});d.fn.bootstrapTable.methods.push("expandAllTree","collapseAllTree")})(jQuery); |