vxe-table 3.18.0 → 3.18.2

package/lib/table/src/header.js

@@ -14,7 +14,7 @@ const {
   renderEmptyElement
 } = _ui.VxeUI;
 const cellType = 'header';
-const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
+function renderRows(h, _vm, isGroup, isOptimizeMode, headerGroups, $rowIndex, cols) {
   const props = _vm;
   const $xeTable = _vm.$parent;
   const $xeGrid = $xeTable.$xeGrid;
@@ -28,6 +28,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
   const {
     resizable: allResizable,
     columnKey,
+    showCustomHeader,
     headerCellClassName,
     headerCellStyle,
     showHeaderOverflow: allColumnHeaderOverflow,
@@ -41,11 +42,14 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
     scrollXLoad,
     scrollYLoad,
     overflowX,
+    mergeHeadFlag,
     tableColumn
   } = tableReactData;
   const {
     fullColumnIdData,
-    scrollXStore
+    scrollXStore,
+    mergeHeaderList,
+    mergeHeaderCellMaps
   } = tableInternalData;
   const virtualXOpts = $xeTable.computeVirtualXOpts;
   const columnOpts = $xeTable.computeColumnOpts;
@@ -59,6 +63,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
     isCrossDrag,
     isPeerDrag
   } = columnDragOpts;
+  const isLastRow = $rowIndex === headerGroups.length - 1;
   return cols.map((column, $columnIndex) => {
     const {
       type,
@@ -91,7 +96,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       hasFilter = filters.some(item => item.checked);
     }
     const columnIndex = colRest.index;
-    const _columnIndex = colRest._index;
+    const _columnIndex = showCustomHeader ? $columnIndex : colRest._index;
     const cellParams = {
       $table: $xeTable,
       $grid: $xeGrid,
@@ -108,10 +113,34 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       hasFilter
     };
     const thAttrs = {
-      colid,
-      colspan: column.colSpan > 1 ? column.colSpan : null,
-      rowspan: column.rowSpan > 1 ? column.rowSpan : null
+      colid
     };
+    let isMergeCell = false;
+    // 合并行或列
+    if (!showCustomHeader) {
+      thAttrs.colspan = column.colSpan > 1 ? column.colSpan : null;
+      thAttrs.rowspan = column.rowSpan > 1 ? column.rowSpan : null;
+    }
+    if (mergeHeadFlag && mergeHeaderList.length && (showCustomHeader || isLastRow)) {
+      const spanRest = mergeHeaderCellMaps[`${$rowIndex}:${showCustomHeader ? $columnIndex : _columnIndex}`];
+      if (spanRest) {
+        const {
+          rowspan,
+          colspan
+        } = spanRest;
+        if (!rowspan || !colspan) {
+          return null;
+        }
+        if (rowspan > 1) {
+          isMergeCell = true;
+          thAttrs.rowspan = rowspan;
+        }
+        if (colspan > 1) {
+          isMergeCell = true;
+          thAttrs.colspan = colspan;
+        }
+      }
+    }
     const thOns = {
       click: evnt => $xeTable.triggerHeaderCellClickEvent(evnt, cellParams),
       dblclick: evnt => $xeTable.triggerHeaderCellDblclickEvent(evnt, cellParams)
@@ -138,7 +167,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
     const showResizable = _xeUtils.default.isBoolean(column.resizable) ? column.resizable : columnOpts.resizable || allResizable;
     const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto');
     let isVNPreEmptyStatus = false;
-    if (isOptimizeMode && overflowX && !isGroup) {
+    if (isOptimizeMode && overflowX && !isGroup && !isMergeCell) {
       if (!dragCol || dragCol.id !== colid) {
         if (scrollXLoad && tableColumn.length > 10 && !column.fixed && !virtualXOpts.immediate && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
           isVNPreEmptyStatus = true;
@@ -152,7 +181,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       tcStyle.minHeight = `${currCellHeight}px`;
     }
     return h('th', {
-      class: ['vxe-table--column vxe-header--column', colid, {
+      class: ['vxe-table--column vxe-header--column', colid, fixedHiddenColumn ? 'fixed--hidden' : 'fixed--visible', {
         [`col--${headAlign}`]: headAlign,
         [`col--${type}`]: type,
         'col--last': isLastColumn,
@@ -160,7 +189,6 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
         'col--group': isColGroup,
         'col--ellipsis': hasEllipsis,
         'fixed--width': !isAutoCellWidth,
-        'fixed--hidden': fixedHiddenColumn,
         'is--padding': isPadding,
         'is--sortable': column.sortable,
         'col--filter': !!filters,
@@ -172,7 +200,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       attrs: thAttrs,
       style: headerCellStyle ? _xeUtils.default.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle : undefined,
       on: thOns,
-      key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
+      key: showCustomHeader ? `${colid}${$columnIndex}` : columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
     }, [h('div', {
       class: ['vxe-cell', {
         'c--title': showTitle,
@@ -187,9 +215,9 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       class: 'vxe-cell--wrapper vxe-header-cell--wrapper'
     }, column.renderHeader(h, cellParams))]),
     /**
-    * 列宽拖动
-    */
-    !fixedHiddenColumn && showResizable ? h('div', {
+     * 列宽拖动
+     */
+    !fixedHiddenColumn && showResizable && (!showCustomHeader || isLastRow) ? h('div', {
       class: 'vxe-cell--col-resizable',
       on: {
         mousedown: evnt => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
@@ -197,7 +225,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
       }
     }) : renderEmptyElement($xeTable)]);
   });
-};
+}
 function renderHeads(h, _vm, isGroup, isOptimizeMode, headerGroups) {
   const props = _vm;
   const $xeTable = _vm.$parent;
@@ -220,7 +248,7 @@ function renderHeads(h, _vm, isGroup, isOptimizeMode, headerGroups) {
       key: $rowIndex,
       class: ['vxe-header--row', headerRowClassName ? _xeUtils.default.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName : ''],
       style: headerRowStyle ? _xeUtils.default.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle : undefined
-    }, renderRows(h, _vm, isGroup, isOptimizeMode, cols, $rowIndex));
+    }, renderRows(h, _vm, isGroup, isOptimizeMode, headerGroups, $rowIndex, cols));
   });
 }
 var _default = exports.default = {
@@ -242,11 +270,13 @@ var _default = exports.default = {
   },
   watch: {
     tableColumn() {
-      this.uploadColumn();
+      const _vm = this;
+      _vm.uploadColumn();
     }
   },
   created() {
-    this.uploadColumn();
+    const _vm = this;
+    _vm.uploadColumn();
   },
   mounted() {
     const _vm = this;
@@ -269,8 +299,9 @@ var _default = exports.default = {
     elemStore[`${prefix}repair`] = _vm.$refs.refHeaderBorderRepair;
   },
   destroyed() {
-    const props = this;
-    const $xeTable = this.$parent;
+    const _vm = this;
+    const props = _vm;
+    const $xeTable = _vm.$parent;
     const internalData = $xeTable;
     const {
       fixedType
@@ -288,8 +319,9 @@ var _default = exports.default = {
     elemStore[`${prefix}repair`] = null;
   },
   render(h) {
-    const props = this;
-    const $xeTable = this.$parent;
+    const _vm = this;
+    const props = _vm;
+    const $xeTable = _vm.$parent;
     const tableProps = $xeTable;
     const tableReactData = $xeTable;
     const tableInternalData = $xeTable;
@@ -303,7 +335,7 @@ var _default = exports.default = {
     } = props;
     const {
       headerColumn
-    } = this;
+    } = _vm;
     const {
       mouseConfig,
       showHeaderOverflow: allColumnHeaderOverflow,
@@ -422,7 +454,7 @@ var _default = exports.default = {
      */
     h('thead', {
       ref: 'refHeaderTHead'
-    }, renderHeads(h, this, isGroup, isOptimizeMode, renderHeaderList))]), mouseConfig && mouseOpts.area ? h('div', {
+    }, renderHeads(h, _vm, isGroup, isOptimizeMode, renderHeaderList))]), mouseConfig && mouseOpts.area ? h('div', {
       class: 'vxe-table--cell-area'
     }, [h('span', {
       class: 'vxe-table--cell-main-area'
@@ -440,12 +472,37 @@ var _default = exports.default = {
   },
   methods: {
     uploadColumn() {
-      const $xeTable = this.$parent;
+      const _vm = this;
+      const $xeTable = _vm.$parent;
+      const tableProps = $xeTable;
       const tableReactData = $xeTable;
+      const tableInternalData = $xeTable;
+      const props = _vm;
+      const {
+        showCustomHeader
+      } = tableProps;
+      const {
+        collectColumn,
+        visibleColumn
+      } = tableInternalData;
+      const {
+        tableGroupColumn
+      } = props;
       const {
         isGroup
       } = tableReactData;
-      this.headerColumn = isGroup ? (0, _util.convertHeaderColumnToRows)(this.tableGroupColumn) : [];
+      let spanColumns = isGroup ? (0, _util.convertHeaderColumnToRows)(tableGroupColumn) : [];
+      let visibleColgroups = [];
+      if (showCustomHeader && spanColumns.length > 1) {
+        visibleColgroups = (0, _util.convertHeaderToGridRows)(spanColumns);
+        spanColumns = visibleColgroups;
+      }
+      _vm.headerColumn = spanColumns;
+      $xeTable.dispatchEvent('columns-change', {
+        visibleColgroups,
+        collectColumn,
+        visibleColumn
+      }, null);
     }
   }
 };

package/lib/table/src/header.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{renderer,renderEmptyElement}=_ui.VxeUI,cellType="header",renderRows=($,e,E,S,D,T)=>{let R=e.$parent,I=R.$xeGrid,O=R.$xeGantt;var l=R,r=R,a=R;let k=e.fixedType,{resizable:z,columnKey:U,headerCellClassName:M,headerCellStyle:A,showHeaderOverflow:X,headerAlign:q,align:G,mouseConfig:F}=l,{currentColumn:L,dragCol:N,scrollXLoad:B,scrollYLoad:V,overflowX:W,tableColumn:K}=r,{fullColumnIdData:P,scrollXStore:j}=a,Y=R.computeVirtualXOpts,J=R.computeColumnOpts,Q=R.computeColumnDragOpts,Z=R.computeCellOpts;e=R.computeDefaultRowHeight;let ee=R.computeHeaderCellOpts,le=(0,_util.getCalcHeight)(ee.height)||e,{disabledMethod:re,isCrossDrag:ae,isPeerDrag:te}=Q;return D.map((e,l)=>{var{type:r,showHeaderOverflow:a,headerAlign:t,align:d,filters:i,headerClassName:n,editRender:s,cellRender:o}=e,u=e.id,c=P[u]||{},s=s||o,o=s?renderer.get(s.name):null,s=e.children&&e.children.length,p=W&&!s&&(k?e.fixed!==k:!!e.fixed),f=(_xeUtils.default.isBoolean(ee.padding)?ee:Z).padding,a=_xeUtils.default.isUndefined(a)||_xeUtils.default.isNull(a)?X:a,t=t||(o?o.tableHeaderCellAlign:"")||q||d||(o?o.tableCellAlign:"")||G,d="ellipsis"===a,o="title"===a,a=!0===a||"tooltip"===a,x=o||a||d;let m=!1,h=null;i&&(h=i[0],m=i.some(e=>e.checked));var g=c.index,c=c._index;let v={$table:R,$grid:I,$gantt:O,$rowIndex:T,column:e,columnIndex:g,$columnIndex:l,_columnIndex:c,firstFilterOption:h,fixed:k,type:cellType,isHidden:p,hasFilter:m};var g={colid:u,colspan:1<e.colSpan?e.colSpan:null,rowspan:1<e.rowSpan?e.rowSpan:null},C={click:e=>R.triggerHeaderCellClickEvent(e,v),dblclick:e=>R.triggerHeaderCellDblclickEvent(e,v)},b=J.drag&&"cell"===Q.trigger;let w=!1;b&&(w=!(!re||!re(v))),(F||b)&&(C.mousedown=e=>R.triggerHeaderCellMousedownEvent(e,v)),J.drag&&(C.dragstart=R.handleHeaderCellDragDragstartEvent,C.dragend=R.handleHeaderCellDragDragendEvent,C.dragover=R.handleHeaderCellDragDragoverEvent,b)&&(C.mouseup=R.handleHeaderCellDragMouseupEvent);var b=l===D.length-1,y=_xeUtils.default.isBoolean(e.resizable)?e.resizable:J.resizable||z,H=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let _=!1;!S||!W||E||N&&N.id===u||B&&10<K.length&&!e.fixed&&!Y.immediate&&(c<j.visibleStartIndex-j.preloadSize||c>j.visibleEndIndex+j.preloadSize)&&(_=!0);c={};return x?c.height=le+"px":c.minHeight=le+"px",$("th",{class:["vxe-table--column vxe-header--column",u,{["col--"+t]:t,["col--"+r]:r,"col--last":b,"col--fixed":e.fixed,"col--group":s,"col--ellipsis":x,"fixed--width":!H,"fixed--hidden":p,"is--padding":f,"is--sortable":e.sortable,"col--filter":!!i,"is--filter-active":m,"is--drag-active":J.drag&&!e.fixed&&!w&&(ae||te||!e.parentId),"is--drag-disabled":J.drag&&w,"col--current":L===e},(0,_utils.getClass)(n,v),(0,_utils.getClass)(M,v)],attrs:g,style:A?_xeUtils.default.isFunction(A)?A(v):A:void 0,on:C,key:U||B||V||J.useKey||J.drag||s?u:l},[$("div",{class:["vxe-cell",{"c--title":o,"c--tooltip":a,"c--ellipsis":d}],style:c},_||S&&p?[]:[$("div",{attrs:{colid:u},class:"vxe-cell--wrapper vxe-header-cell--wrapper"},e.renderHeader($,v))]),!p&&y?$("div",{class:"vxe-cell--col-resizable",on:{mousedown:e=>R.handleColResizeMousedownEvent(e,k,v),dblclick:e=>R.handleColResizeDblclickEvent(e,v)}}):renderEmptyElement(R)])})};function renderHeads(a,t,d,i,e){let n=t.$parent;var l=n;let s=t.fixedType,{headerRowClassName:o,headerRowStyle:u}=l;return e.map((e,l)=>{var r={$table:n,$rowIndex:l,fixed:s,type:cellType};return a("tr",{key:l,class:["vxe-header--row",o?_xeUtils.default.isFunction(o)?o(r):o:""],style:u?_xeUtils.default.isFunction(u)?u(r):u:void 0},renderRows(a,t,d,i,e,l))})}var _default=exports.default={name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},data(){return{headerColumn:[]}},watch:{tableColumn(){this.uploadColumn()}},created(){this.uploadColumn()},mounted(){var e=this,l=e.fixedType,r=e.$parent.elemStore,l=`${l||"main"}-header-`;r[l+"wrapper"]=e.$refs.refElem,r[l+"scroll"]=e.$refs.refHeaderScroll,r[l+"table"]=e.$refs.refHeaderTable,r[l+"colgroup"]=e.$refs.refHeaderColgroup,r[l+"list"]=e.$refs.refHeaderTHead,r[l+"xSpace"]=e.$refs.refHeaderXSpace,r[l+"repair"]=e.$refs.refHeaderBorderRepair},destroyed(){var e=this.fixedType,l=this.$parent.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},render(r){let l=this.$parent;var e=l,a=l,t=l,d=l.xID;let{fixedType:i,fixedColumn:n,tableColumn:s}=this;var o=this.headerColumn,{mouseConfig:e,showHeaderOverflow:u,spanMethod:c,footerSpanMethod:p}=e,{isGroup:a,isColLoading:f,overflowX:x,scrollXLoad:m,dragCol:h}=a,{visibleColumn:t,fullColumnIdData:g}=t,v=l.computeMouseOpts;let C=o,b=s,w=!1;return a?b=t:(m&&u&&(c||p||(w=!0)),w&&(f||!i&&x)||(b=t),i&&w&&(b=n||[]),C=[b]),i||a||m&&h&&2<b.length&&(o=g[h.id])&&(u=o._index,c=b[0],p=b[b.length-1],f=g[c.id],x=g[p.id],f)&&x&&(t=f._index,m=x._index,u<t?(b=[h].concat(b),C=[[h].concat(C[0])].concat(C.slice(1))):m<u&&(b=b.concat([h]),C=[C[0].concat([h])].concat(C.slice(1)))),r("div",{ref:"refElem",class:["vxe-table--header-wrapper",i?`fixed-${i}--wrapper`:"body--wrapper"],attrs:{xid:d}},[r("div",{ref:"refHeaderScroll",class:"vxe-table--header-inner-wrapper",on:{scroll(e){l.triggerHeaderScrollEvent(e,i)}}},[i?renderEmptyElement(l):r("div",{ref:"refHeaderXSpace",class:"vxe-body--x-space"}),r("table",{ref:"refHeaderTable",class:"vxe-table--header",attrs:{xid:d,cellspacing:0,cellpadding:0,border:0,xvm:w?"1":null}},[r("colgroup",{ref:"refHeaderColgroup"},b.map((e,l)=>r("col",{attrs:{name:e.id},key:l,style:{width:e.renderWidth+"px"}}))),r("thead",{ref:"refHeaderTHead"},renderHeads(r,this,a,w,C))]),e&&v.area?r("div",{class:"vxe-table--cell-area"},[r("span",{class:"vxe-table--cell-main-area"}),r("span",{class:"vxe-table--cell-clip-area"}),r("span",{class:"vxe-table--cell-extend-area"}),r("span",{class:"vxe-table--cell-multi-area"}),r("span",{class:"vxe-table--cell-active-area"}),r("span",{class:"vxe-table--cell-col-status-area"})]):renderEmptyElement(l)])])},methods:{uploadColumn(){var e=this.$parent.isGroup;this.headerColumn=e?(0,_util.convertHeaderColumnToRows)(this.tableGroupColumn):[]}}};
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_utils=require("../../ui/src/utils"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{renderer,renderEmptyElement}=_ui.VxeUI,cellType="header";function renderRows(E,e,S,D,l,T,R){let I=e.$parent,O=I.$xeGrid,k=I.$xeGantt;var r=I,a=I,t=I;let z=e.fixedType,{resizable:M,columnKey:U,showCustomHeader:A,headerCellClassName:X,headerCellStyle:G,showHeaderOverflow:q,headerAlign:F,align:L,mouseConfig:N}=r,{currentColumn:B,dragCol:V,scrollXLoad:W,scrollYLoad:K,overflowX:P,mergeHeadFlag:j,tableColumn:ae}=a,{fullColumnIdData:te,scrollXStore:Y,mergeHeaderList:ie,mergeHeaderCellMaps:de}=t,ne=I.computeVirtualXOpts,J=I.computeColumnOpts,Q=I.computeColumnDragOpts,oe=I.computeCellOpts;e=I.computeDefaultRowHeight;let Z=I.computeHeaderCellOpts,ee=(0,_util.getCalcHeight)(Z.height)||e,{disabledMethod:le,isCrossDrag:se,isPeerDrag:ue}=Q,re=T===l.length-1;return R.map((e,l)=>{var{type:r,showHeaderOverflow:a,headerAlign:t,align:i,filters:d,headerClassName:n,editRender:o,cellRender:s}=e,u=e.id,c=te[u]||{},o=o||s,s=o?renderer.get(o.name):null,o=e.children&&e.children.length,p=P&&!o&&(z?e.fixed!==z:!!e.fixed),f=(_xeUtils.default.isBoolean(Z.padding)?Z:oe).padding,a=_xeUtils.default.isUndefined(a)||_xeUtils.default.isNull(a)?q:a,t=t||(s?s.tableHeaderCellAlign:"")||F||i||(s?s.tableCellAlign:"")||L,i="ellipsis"===a,s="title"===a,a=!0===a||"tooltip"===a,m=s||a||i;let g=!1,h=null;d&&(h=d[0],g=d.some(e=>e.checked));var x=c.index,c=A?l:c._index;let v={$table:I,$grid:O,$gantt:k,$rowIndex:T,column:e,columnIndex:x,$columnIndex:l,_columnIndex:c,firstFilterOption:h,fixed:z,type:cellType,isHidden:p,hasFilter:g};x={colid:u};let C=!1;if(A||(x.colspan=1<e.colSpan?e.colSpan:null,x.rowspan=1<e.rowSpan?e.rowSpan:null),j&&ie.length&&(A||re)){var b=de[T+":"+(A?l:c)];if(b){var{rowspan:b,colspan:w}=b;if(!b||!w)return null;1<b&&(C=!0,x.rowspan=b),1<w&&(C=!0,x.colspan=w)}}b={click:e=>I.triggerHeaderCellClickEvent(e,v),dblclick:e=>I.triggerHeaderCellDblclickEvent(e,v)},w=J.drag&&"cell"===Q.trigger;let H=!1;w&&(H=!(!le||!le(v))),(N||w)&&(b.mousedown=e=>I.triggerHeaderCellMousedownEvent(e,v)),J.drag&&(b.dragstart=I.handleHeaderCellDragDragstartEvent,b.dragend=I.handleHeaderCellDragDragendEvent,b.dragover=I.handleHeaderCellDragDragoverEvent,w)&&(b.mouseup=I.handleHeaderCellDragMouseupEvent);var w=l===R.length-1,y=_xeUtils.default.isBoolean(e.resizable)?e.resizable:J.resizable||M,_=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let $=!1;!D||!P||S||C||V&&V.id===u||W&&10<ae.length&&!e.fixed&&!ne.immediate&&(c<Y.visibleStartIndex-Y.preloadSize||c>Y.visibleEndIndex+Y.preloadSize)&&($=!0);c={};return m?c.height=ee+"px":c.minHeight=ee+"px",E("th",{class:["vxe-table--column vxe-header--column",u,p?"fixed--hidden":"fixed--visible",{["col--"+t]:t,["col--"+r]:r,"col--last":w,"col--fixed":e.fixed,"col--group":o,"col--ellipsis":m,"fixed--width":!_,"is--padding":f,"is--sortable":e.sortable,"col--filter":!!d,"is--filter-active":g,"is--drag-active":J.drag&&!e.fixed&&!H&&(se||ue||!e.parentId),"is--drag-disabled":J.drag&&H,"col--current":B===e},(0,_utils.getClass)(n,v),(0,_utils.getClass)(X,v)],attrs:x,style:G?_xeUtils.default.isFunction(G)?G(v):G:void 0,on:b,key:A?""+u+l:U||W||K||J.useKey||J.drag||o?u:l},[E("div",{class:["vxe-cell",{"c--title":s,"c--tooltip":a,"c--ellipsis":i}],style:c},$||D&&p?[]:[E("div",{attrs:{colid:u},class:"vxe-cell--wrapper vxe-header-cell--wrapper"},e.renderHeader(E,v))]),p||!y||A&&!re?renderEmptyElement(I):E("div",{class:"vxe-cell--col-resizable",on:{mousedown:e=>I.handleColResizeMousedownEvent(e,z,v),dblclick:e=>I.handleColResizeDblclickEvent(e,v)}})])})}function renderHeads(a,t,i,d,n){let o=t.$parent;var e=o;let s=t.fixedType,{headerRowClassName:u,headerRowStyle:c}=e;return n.map((e,l)=>{var r={$table:o,$rowIndex:l,fixed:s,type:cellType};return a("tr",{key:l,class:["vxe-header--row",u?_xeUtils.default.isFunction(u)?u(r):u:""],style:c?_xeUtils.default.isFunction(c)?c(r):c:void 0},renderRows(a,t,i,d,n,l,e))})}var _default=exports.default={name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},data(){return{headerColumn:[]}},watch:{tableColumn(){this.uploadColumn()}},created(){this.uploadColumn()},mounted(){var e=this,l=e.fixedType,r=e.$parent.elemStore,l=`${l||"main"}-header-`;r[l+"wrapper"]=e.$refs.refElem,r[l+"scroll"]=e.$refs.refHeaderScroll,r[l+"table"]=e.$refs.refHeaderTable,r[l+"colgroup"]=e.$refs.refHeaderColgroup,r[l+"list"]=e.$refs.refHeaderTHead,r[l+"xSpace"]=e.$refs.refHeaderXSpace,r[l+"repair"]=e.$refs.refHeaderBorderRepair},destroyed(){var e=this.fixedType,l=this.$parent.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},render(r){let l=this.$parent;var e=l,a=l,t=l,i=l.xID;let{fixedType:d,fixedColumn:n,tableColumn:o}=this;var s=this.headerColumn,{mouseConfig:e,showHeaderOverflow:u,spanMethod:c,footerSpanMethod:p}=e,{isGroup:a,isColLoading:f,overflowX:m,scrollXLoad:g,dragCol:h}=a,{visibleColumn:t,fullColumnIdData:x}=t,v=l.computeMouseOpts;let C=s,b=o,w=!1;return a?b=t:(g&&u&&(c||p||(w=!0)),w&&(f||!d&&m)||(b=t),d&&w&&(b=n||[]),C=[b]),d||a||g&&h&&2<b.length&&(s=x[h.id])&&(u=s._index,c=b[0],p=b[b.length-1],f=x[c.id],m=x[p.id],f)&&m&&(t=f._index,g=m._index,u<t?(b=[h].concat(b),C=[[h].concat(C[0])].concat(C.slice(1))):g<u&&(b=b.concat([h]),C=[C[0].concat([h])].concat(C.slice(1)))),r("div",{ref:"refElem",class:["vxe-table--header-wrapper",d?`fixed-${d}--wrapper`:"body--wrapper"],attrs:{xid:i}},[r("div",{ref:"refHeaderScroll",class:"vxe-table--header-inner-wrapper",on:{scroll(e){l.triggerHeaderScrollEvent(e,d)}}},[d?renderEmptyElement(l):r("div",{ref:"refHeaderXSpace",class:"vxe-body--x-space"}),r("table",{ref:"refHeaderTable",class:"vxe-table--header",attrs:{xid:i,cellspacing:0,cellpadding:0,border:0,xvm:w?"1":null}},[r("colgroup",{ref:"refHeaderColgroup"},b.map((e,l)=>r("col",{attrs:{name:e.id},key:l,style:{width:e.renderWidth+"px"}}))),r("thead",{ref:"refHeaderTHead"},renderHeads(r,this,a,w,C))]),e&&v.area?r("div",{class:"vxe-table--cell-area"},[r("span",{class:"vxe-table--cell-main-area"}),r("span",{class:"vxe-table--cell-clip-area"}),r("span",{class:"vxe-table--cell-extend-area"}),r("span",{class:"vxe-table--cell-multi-area"}),r("span",{class:"vxe-table--cell-active-area"}),r("span",{class:"vxe-table--cell-col-status-area"})]):renderEmptyElement(l)])])},methods:{uploadColumn(){var e=this.$parent,l=e.showCustomHeader,{collectColumn:r,visibleColumn:a}=e,t=this.tableGroupColumn,i=e.isGroup;let d=i?(0,_util.convertHeaderColumnToRows)(t):[],n=[];l&&1<d.length&&(n=(0,_util.convertHeaderToGridRows)(d),d=n),this.headerColumn=d,e.dispatchEvent("columns-change",{visibleColgroups:n,collectColumn:r,visibleColumn:a},null)}}};