vxe-table
Version:
A PC-end table component based on Vxe UI, supporting copy-paste, data pivot table, and high-performance virtual list table solution.
1 lines • 9.46 kB
JavaScript
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 ue=(0,_vue.inject)("$xeTable",{}),{xID:g,props:f,reactData:m,internalData:_}=ue,{computeColumnOpts:a,computeColumnDragOpts:r,computeCellOpts:t,computeMouseOpts:b,computeHeaderCellOpts:i,computeDefaultRowHeight:n,computeVirtualXOpts:o,computeFloatingFilterOpts:z,computeIsHeaderRenderOptimize:C,computeHeaderTooltipOpts:d}=ue.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:a}=_;var r=h.tableGroupColumn,t=m.isGroup;let i=t?(0,_util.convertHeaderColumnToRows)(r):[],n=[];e&&1<i.length&&(n=(0,_util.convertHeaderToGridRows)(i),i=n),w.value=i,(0,_vue.nextTick)(()=>{ue.dispatchEvent("columns-change",{visibleColgroups:n,collectColumn:l,visibleColumn:a},null)})},O=(T,E,e,I,O)=>{let S=ue.xeGrid,k=ue.xeGantt,F=h.fixedType,{resizable:R,columnKey:$,showCustomHeader:U,headerCellClassName:M,headerCellStyle:z,showHeaderOverflow:A,headerAlign:q,align:G,mouseConfig:N}=f,{currentColumn:X,dragCol:j,scrollXLoad:W,scrollYLoad:L,overflowX:V,mergeHeadFlag:B,tableColumn:K}=m,{fullColumnIdData:P,scrollXStore:Y,mergeHeaderList:J,mergeHeaderCellMaps:Q}=_,Z=o.value,ee=a.value,le=r.value,ae=d.value,oe=t.value;var l=n.value;let re=i.value,te=(0,_util.getCalcHeight)(re.height)||l,{disabledMethod:ie,isCrossDrag:de,isPeerDrag:se}=le,ne=I===e.length-1;return O.map((e,l)=>{var{type:a,showHeaderOverflow:r,headerAlign:t,align:i,filters:n,headerClassName:o,editRender:d,cellRender:s}=e,u=e.id,c=P[u]||{},d=d||s,s=d?renderer.get(d.name):null,d=e.children&&e.children.length,p=V&&!d&&(F?e.fixed!==F:!!e.fixed),v=(_xeUtils.default.isBoolean(re.padding)?re:oe).padding,r=_xeUtils.default.eqNull(r)?A:r,t=t||(s?s.tableHeaderCellAlign:"")||q||i||(s?s.tableCellAlign:"")||G,i="ellipsis"===r,s="title"===r,r=!0===r?"tooltip"===ae.mode:"tooltip"===r,x=s||r||i;let h=!1,g=null;n&&(g=n[0],h=n.some(e=>e.checked));var f=c.index,c=c._index;let m={$table:ue,$grid:S,$gantt:k,rowIndex:I,_rowIndex:I,$rowIndex:I,column:e,columnIndex:f,$columnIndex:l,_columnIndex:c,firstFilterOption:g,fixed:F,source:sourceType,type:renderType,isHidden:p,hasFilter:h};f={colid:u};let _=!1;if(U||(f.colspan=1<e.colSpan?e.colSpan:null,f.rowspan=1<e.rowSpan?e.rowSpan:null),B&&J.length&&(U||ne)){var b=Q[I+":"+(U?l:c)];if(b){var{rowspan:b,colspan:C}=b;if(!b||!C)return null;1<b&&(_=!0,f.rowspan=b),1<C&&(_=!0,f.colspan=C)}}b={onClick:e=>ue.triggerHeaderCellClickEvent(e,m),onDblclick:e=>ue.triggerHeaderCellDblclickEvent(e,m)},C=ee.drag&&"cell"===le.trigger;let w=!1;C&&(w=!(!ie||!ie(m))),(N||C)&&(b.onMousedown=e=>ue.triggerHeaderCellMousedownEvent(e,m)),ee.drag&&(b.onDragstart=ue.handleHeaderCellDragDragstartEvent,b.onDragend=ue.handleHeaderCellDragDragendEvent,b.onDragover=ue.handleHeaderCellDragDragoverEvent,C)&&(b.onMouseup=ue.handleHeaderCellDragMouseupEvent);var C=l===O.length-1,y=_xeUtils.default.isBoolean(e.resizable)?e.resizable:ee.resizable||R,H=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let D=!1;!E||!V||T||_||j&&j.id===u||W&&10<K.length&&!e.fixed&&!Z.immediate&&(c<Y.visibleStartIndex-Y.preloadSize||c>Y.visibleEndIndex+Y.preloadSize)&&(D=!0);c={};if(x?c.height=te+"px":c.minHeight=te+"px",!U&&d&&!ne){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--"+t]:t,["col--"+a]:a,"col--last":C,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":x,"fixed--width":!H,"is--padding":v,"is--sortable":e.sortable,"col--filter":!!n,"is--filter-active":h,"is--drag-active":ee.drag&&!e.fixed&&!w&&(de||se||!e.parentId),"is--drag-disabled":ee.drag&&w,"col--current":X===e},o?_xeUtils.default.isFunction(o)?o(m):o:"",M?_xeUtils.default.isFunction(M)?M(m):M:""],style:z?_xeUtils.default.isFunction(z)?z(m):z:null},f),b),{key:U?""+u+l:$||W||L||ee.useKey||ee.drag||d?u:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":s,"c--tooltip":r,"c--ellipsis":i}],style:c},D||E&&p?[]:[(0,_vue.h)("div",{colid:u,class:"vxe-cell--wrapper vxe-header-cell--wrapper"},e.renderHeader(m))]),p||!y||U&&!ne?renderEmptyElement(ue):(0,_vue.h)("div",{class:"vxe-cell--col-resizable",onMousedown:e=>ue.handleColResizeMousedownEvent(e,F,m),onDblclick:e=>ue.handleColResizeDblclickEvent(e,m)})])})},S=(C,w)=>{let y=ue.xeGrid,H=ue.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,U=z.value.cellClassName,M=(0,_util.getCalcHeight)($.height)||e;return w.map((e,l)=>{var{type:a,showHeaderOverflow:r,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,x=S&&(D?e.fixed!==D:!!e.fixed),h=(_xeUtils.default.isBoolean($.padding)?$:R).padding,r=_xeUtils.default.eqNull(r)?T:r,t=t||(c?c.tableHeaderCellAlign:"")||E||i||(c?c.tableCellAlign:"")||I,i="ellipsis"===r,c="title"===r,r=!0===r?"tooltip"===F.mode:"tooltip"===r,g=c||r||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:ue,$grid:y,$gantt:H,column:e,columnIndex:n,$columnIndex:l,_columnIndex:v,option:m,fixed:D,source:sourceType,type:renderType,isHidden:x,hasFilter:f},v={colid:p},l=l===w.length-1,_=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width),b={};return g?b.height=M+"px":b.minHeight=M+"px",(0,_vue.h)("th",Object.assign({class:["vxe-table--column vxe-header--column is--floating-filters",p,x?"fixed--hidden":"fixed--visible",{["col--"+t]:t,["col--"+a]:a,"col--last":l,"col--fixed":e.fixed,"col--ellipsis":g,"fixed--width":!_,"is--padding":h,"is--sortable":e.sortable,"col--current":O===e}],key:p},v),[(0,_vue.h)("div",{class:["vxe-cell",""+(U||""),{"c--title":c,"c--tooltip":r,"c--ellipsis":i}],style:b},C&&x&&!s?[]:[(0,_vue.h)("div",{colid:p,class:"vxe-cell--wrapper vxe-header-cell--wrapper"},d?ue.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=ue.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=ue.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:a}=h;var r=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||[],x=a;return t?x=s:(p&&(i||!l&&n)||(x=s),l&&p&&(x=e||[]),v=[x]),l||t||o&&d&&2<x.length&&(i=u[d.id])&&(n=i._index,s=x[0],o=x[x.length-1],i=u[s.id],s=u[o.id],i)&&s&&(u=i._index,o=s._index,n<u?(x=[d].concat(x),v=[[d].concat(v[0])].concat(v.slice(1))):o<n&&(x=x.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:g},[(0,_vue.h)("div",{ref:H,class:"vxe-table--header-inner-wrapper",onScroll(e){ue.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(ue):(0,_vue.h)("div",{ref:I,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:D,class:"vxe-table--header",xid:g,cellspacing:0,cellpadding:0,border:0,xvm:p?"1":null},[(0,_vue.h)("colgroup",{ref:T},x.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l,style:{width:e.renderWidth+"px"}}))),(0,_vue.h)("thead",{ref:E},((r,t,i,e)=>{let n=h.fixedType,{headerRowClassName:o,headerRowStyle:d}=f;var l=z.value,a=i.map((e,l)=>{var a={$table:ue,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(a):o:""],style:d?_xeUtils.default.isFunction(d)?d(a):d:null},O(r,t,i,l,e))});return l.enabled&&a.push((0,_vue.h)("tr",{key:"ff",class:["vxe-header--row is--floating-filters",""+(l.rowClassName||"")]},S(t,e))),a})(t,p,v,x))]),r&&c.area?(0,_vue.h)("div",{class:"vxe-table--cell-area",xid:g},[(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(ue)])])}}});