vxe-table/lib/table/src/header.min.js

A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.

Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_util=require("./util"),_vn=require("../../ui/src/vn");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{renderer,renderEmptyElement}=_ui.VxeUI,sourceType="table",renderType="header";var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(h){let ve=(0,_vue.inject)("$xeTable",{}),{xID:x,props:f,reactData:m,internalData:_}=ve,{computeColumnOpts:r,computeColumnDragOpts:a,computeCellOpts:t,computeMouseOpts:b,computeHeaderCellOpts:i,computeDefaultRowHeight:n,computeVirtualXOpts:o,computeFloatingFilterOpts:A,computeIsHeaderRenderOptimize:C,computeHeaderTooltipOpts:d}=ve.getComputeMaps(),w=(0,_vue.ref)([]),y=(0,_vue.ref)(),H=(0,_vue.ref)(),D=(0,_vue.ref)(),T=(0,_vue.ref)(),E=(0,_vue.ref)(),I=(0,_vue.ref)(),s=(0,_vue.ref)(),u=()=>{var e=f.showCustomHeader;let{collectColumn:l,visibleColumn:r}=_;var a=h.tableGroupColumn,t=m.isGroup;let i=t?(0,_util.convertHeaderColumnToRows)(a):[],n=[];e&&1<i.length&&(n=(0,_util.convertHeaderToGridRows)(i),i=n),w.value=i,(0,_vue.nextTick)(()=>{ve.dispatchEvent("columns-change",{visibleColgroups:n,collectColumn:l,visibleColumn:r},null)})},O=(O,S,e,k,F)=>{let R=ve.xeGrid,$=ve.xeGantt,M=h.fixedType,{resizable:z,columnKey:A,showCustomHeader:U,headerCellClassName:q,headerCellStyle:G,showHeaderOverflow:N,headerAlign:X,align:j,mouseConfig:W}=f,{currentColumn:L,dragCol:V,scrollXLoad:B,scrollYLoad:K,overflowX:P,mergeHeadFlag:Y,tableColumn:J}=m,{fullColumnIdData:Q,scrollXStore:Z,mergeHeaderList:ee,mergeHeaderCellMaps:le}=_,re=o.value,ae=r.value,te=a.value,ie=d.value,ue=t.value;var l=n.value;let ne=i.value,oe=(0,_util.getCalcHeight)(ne.height)||l,{disabledMethod:de,isCrossDrag:ce,isPeerDrag:pe}=te,se=k===e.length-1;return F.map((e,l)=>{var{type:r,showHeaderOverflow:a,headerAlign:t,align:i,filters:n,headerClassName:o,editRender:d,cellRender:s}=e,u=e.id,c=Q[u]||{},d=d||s,s=d?renderer.get(d.name):null,d=e.children&&e.children.length,p=P&&!d&&(M?e.fixed!==M:!!e.fixed),v=(0,_utils.getDefaultConfig)(ne.padding,ue.padding),g=!0===v,h=!!v&&(g||!1!==v.top),x=!!v&&(g||!1!==v.bottom),f=!!v&&(g||!1!==v.left),g=!!v&&(g||!1!==v.right),v=(0,_utils.getDefaultConfig)(a,N),a=t||(s?s.tableHeaderCellAlign:"")||X||i||(s?s.tableCellAlign:"")||j,t="ellipsis"===(!0===v?ie.mode:v),i="title"===(!0===v?ie.mode:v),s="tooltip"===(!0===v?ie.mode:v),v=i||s||t;let m=!1,_=null;n&&(_=n[0],m=n.some(e=>e.checked));var b=c.index,c=c._index;let C={$table:ve,$grid:R,$gantt:$,rowIndex:k,_rowIndex:k,$rowIndex:k,column:e,columnIndex:b,$columnIndex:l,_columnIndex:c,firstFilterOption:_,fixed:M,source:sourceType,type:renderType,isHidden:p,hasFilter:m};b={colid:u};let w=!1;if(U||(b.colspan=1<e.colSpan?e.colSpan:null,b.rowspan=1<e.rowSpan?e.rowSpan:null),Y&&ee.length&&(U||se)){var y=le[k+":"+(U?l:c)];if(y){var{rowspan:y,colspan:H}=y;if(!y||!H)return null;1<y&&(w=!0,b.rowspan=y),1<H&&(w=!0,b.colspan=H)}}y={onClick:e=>ve.triggerHeaderCellClickEvent(e,C),onDblclick:e=>ve.triggerHeaderCellDblclickEvent(e,C)},H=ae.drag&&"cell"===te.trigger;let D=!1;H&&(D=!(!de||!de(C))),(W||H)&&(y.onMousedown=e=>ve.triggerHeaderCellMousedownEvent(e,C)),ae.drag&&(y.onDragstart=ve.handleHeaderCellDragDragstartEvent,y.onDragend=ve.handleHeaderCellDragDragendEvent,y.onDragover=ve.handleHeaderCellDragDragoverEvent,H)&&(y.onMouseup=ve.handleHeaderCellDragMouseupEvent);var H=l===F.length-1,T=_xeUtils.default.isBoolean(e.resizable)?e.resizable:ae.resizable||z,E=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let I=!1;!S||!P||O||w||V&&V.id===u||B&&10<J.length&&!e.fixed&&!re.immediate&&(c<Z.visibleStartIndex-Z.preloadSize||c>Z.visibleEndIndex+Z.preloadSize)&&(I=!0);c={};if(v?c.height=oe+"px":c.minHeight=oe+"px",!U&&d&&!se){let l=0;_xeUtils.default.eachTree(e.children,e=>{!e.visible||e.children&&e.children.length||(l+=e.renderWidth)}),c.width=l+"px"}return(0,_vue.h)("th",Object.assign(Object.assign(Object.assign({class:["vxe-table--column vxe-header--column",u,p?"fixed--hidden":"fixed--visible",{["col--"+a]:a,["col--"+r]:r,"col--last":H,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":v,"fixed--width":!E,"is--pg-top":h,"is--pg-bottom":x,"is--pg-left":f,"is--pg-right":g,"is--sortable":e.sortable,"col--filter":!!n,"is--filter-active":m,"is--drag-active":ae.drag&&!e.fixed&&!D&&(ce||pe||!e.parentId),"is--drag-disabled":ae.drag&&D,"col--current":L===e},o?_xeUtils.default.isFunction(o)?o(C):o:"",q?_xeUtils.default.isFunction(q)?q(C):q:""],style:G?_xeUtils.default.isFunction(G)?G(C):G:null},b),y),{key:U?""+u+l:A||B||K||ae.useKey||ae.drag||d?u:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":i,"c--tooltip":s,"c--ellipsis":t}],style:c},I||S&&p?[]:[(0,_vue.h)("div",{colid:u,class:"vxe-cell--wrapper vxe-header-cell--wrapper"},e.renderHeader(C))]),p||!T||U&&!se?renderEmptyElement(ve):(0,_vue.h)("div",{class:"vxe-cell--col-resizable",onMousedown:e=>ve.handleColResizeMousedownEvent(e,M,C),onDblclick:e=>ve.handleColResizeDblclickEvent(e,C)})])})},S=(C,w)=>{let y=ve.xeGrid,H=ve.xeGantt,D=h.fixedType,{showHeaderOverflow:T,headerAlign:E,align:I}=f,{currentColumn:O,overflowX:S}=m,k=_.fullColumnIdData,F=d.value,R=t.value;var e=n.value;let $=i.value,M=A.value.cellClassName,z=(0,_util.getCalcHeight)($.height)||e;return w.map((e,l)=>{var{type:r,showHeaderOverflow:a,headerAlign:t,align:i,filters:n,editRender:o,cellRender:d,floatingFilters:s,filterRender:u,slots:c}=e,p=e.id,v=k[p]||{},o=o||d,d=c?c.floatingFilter||c["floating-filter"]:null,c=o?renderer.get(o.name):null,o=(0,_utils.isEnableConf)(u)?renderer.get(u.name):null,o=o?o.renderTableFloatingFilter:null,g=S&&(D?e.fixed!==D:!!e.fixed),h=(_xeUtils.default.isBoolean($.padding)?$:R).padding,a=_xeUtils.default.eqNull(a)?T:a,t=t||(c?c.tableHeaderCellAlign:"")||E||i||(c?c.tableCellAlign:"")||I,i="ellipsis"===a,c="title"===a,a=!0===a?"tooltip"===F.mode:"tooltip"===a,x=c||a||i;let f=!1,m=null;n&&(m=n[0],f=n.some(e=>e.checked));var n=v.index,v=v._index,n={$table:ve,$grid:y,$gantt:H,column:e,columnIndex:n,$columnIndex:l,_columnIndex:v,option:m,fixed:D,source:sourceType,type:renderType,isHidden:g,hasFilter:f},v={colid:p},l=l===w.length-1,_=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width),b={};return x?b.height=z+"px":b.minHeight=z+"px",(0,_vue.h)("th",Object.assign({class:["vxe-table--column vxe-header--column is--floating-filters",p,g?"fixed--hidden":"fixed--visible",{["col--"+t]:t,["col--"+r]:r,"col--last":l,"col--fixed":e.fixed,"col--ellipsis":x,"fixed--width":!_,"is--padding":h,"is--sortable":e.sortable,"col--current":O===e}],key:p},v),[(0,_vue.h)("div",{class:["vxe-cell",""+(M||""),{"c--title":c,"c--tooltip":a,"c--ellipsis":i}],style:b},C&&g&&!s?[]:[(0,_vue.h)("div",{colid:p,class:"vxe-cell--wrapper vxe-header-cell--wrapper"},d?ve.callSlot(d,n):o&&m?(0,_vn.getSlotVNs)(o(u,n)):[])])])})};return(0,_vue.watch)(()=>h.tableColumn,u),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=h.fixedType,l=ve.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=y,l[e+"scroll"]=H,l[e+"table"]=D,l[e+"colgroup"]=T,l[e+"list"]=E,l[e+"xSpace"]=I,l[e+"repair"]=s,u()})}),(0,_vue.onUnmounted)(()=>{var e=h.fixedType,l=ve.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=null,l[e+"scroll"]=null,l[e+"table"]=null,l[e+"colgroup"]=null,l[e+"list"]=null,l[e+"xSpace"]=null,l[e+"repair"]=null}),()=>{let{fixedType:l,fixedColumn:e,tableColumn:r}=h;var a=f.mouseConfig,{isGroup:t,isColLoading:i,overflowX:n,scrollXLoad:o,dragCol:d}=m,{visibleColumn:s,fullColumnIdData:u}=_,c=b.value,p=C.value;let v=w.value||[],g=r;return t?g=s:(p&&(i||!l&&n)||(g=s),l&&p&&(g=e||[]),v=[g]),l||t||o&&d&&2<g.length&&(i=u[d.id])&&(n=i._index,s=g[0],o=g[g.length-1],i=u[s.id],s=u[o.id],i)&&s&&(u=i._index,o=s._index,n<u?(g=[d].concat(g),v=[[d].concat(v[0])].concat(v.slice(1))):o<n&&(g=g.concat([d]),v=[v[0].concat([d])].concat(v.slice(1)))),(0,_vue.h)("div",{ref:y,class:["vxe-table--header-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:x},[(0,_vue.h)("div",{ref:H,class:"vxe-table--header-inner-wrapper",onScroll(e){ve.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(ve):(0,_vue.h)("div",{ref:I,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:D,class:"vxe-table--header",xid:x,cellspacing:0,cellpadding:0,border:0,xvm:p?"1":null},[(0,_vue.h)("colgroup",{ref:T},g.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l,style:{width:e.renderWidth+"px"}}))),(0,_vue.h)("thead",{ref:E},((a,t,i,e)=>{let n=h.fixedType,{headerRowClassName:o,headerRowStyle:d}=f;var l=A.value,r=i.map((e,l)=>{var r={$table:ve,rowIndex:l,_rowIndex:l,$rowIndex:l,fixed:n,type:renderType};return(0,_vue.h)("tr",{key:l,class:["vxe-header--row",o?_xeUtils.default.isFunction(o)?o(r):o:""],style:d?_xeUtils.default.isFunction(d)?d(r):d:null},O(a,t,i,l,e))});return l.enabled&&r.push((0,_vue.h)("tr",{key:"ff",class:["vxe-header--row is--floating-filters",""+(l.rowClassName||"")]},S(t,e))),r})(t,p,v,g))]),a&&c.area?(0,_vue.h)("div",{class:"vxe-table--cell-area",xid:x},[(0,_vue.h)("span",{class:"vxe-table--cell-main-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-clip-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-extend-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-multi-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-active-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-col-status-area"})]):renderEmptyElement(ve)])])}}});