vxe-table 4.10.6-beta.9 → 4.10.7

package/lib/table/src/header.js

@@ -8,10 +8,8 @@ var _vue = require("vue");
 var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _ui = require("../../ui");
 var _util = require("./util");
-var _dom = require("../../ui/src/dom");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const {
-  getI18n,
   renderer,
   renderEmptyElement
 } = _ui.VxeUI;
@@ -36,18 +34,13 @@ var _default = exports.default = (0, _vue.defineComponent)({
       reactData: tableReactData,
       internalData: tableInternalData
     } = $xeTable;
-    const {
-      refElem: tableRefElem,
-      refLeftContainer,
-      refRightContainer,
-      refCellResizeBar,
-      refCellResizeTip
-    } = $xeTable.getRefMaps();
     const {
       computeColumnOpts,
       computeColumnDragOpts,
-      computeResizableOpts,
-      computeScrollbarXToTop
+      computeCellOpts,
+      computeMouseOpts,
+      computeHeaderCellOpts,
+      computeDefaultRowHeight
     } = $xeTable.getComputeMaps();
     const headerColumn = (0, _vue.ref)([]);
     const refElem = (0, _vue.ref)();
@@ -63,152 +56,6 @@ var _default = exports.default = (0, _vue.defineComponent)({
       } = tableReactData;
       headerColumn.value = isGroup ? (0, _util.convertHeaderColumnToRows)(props.tableGroupColumn) : [];
     };
-    const resizeMousedownEvent = (evnt, params) => {
-      const {
-        column
-      } = params;
-      const {
-        fixedType
-      } = props;
-      const {
-        scrollbarHeight
-      } = tableReactData;
-      const {
-        elemStore,
-        visibleColumn
-      } = tableInternalData;
-      const resizableOpts = computeResizableOpts.value;
-      const tableEl = tableRefElem.value;
-      const leftContainerElem = refLeftContainer.value;
-      const rightContainerElem = refRightContainer.value;
-      const resizeBarElem = refCellResizeBar.value;
-      const resizeTipElem = refCellResizeTip.value;
-      const scrollbarXToTop = computeScrollbarXToTop.value;
-      const {
-        clientX: dragClientX
-      } = evnt;
-      const wrapperElem = refElem.value;
-      const dragBtnElem = evnt.target;
-      let resizeColumn = column;
-      if (column.children && column.children.length) {
-        _xeUtils.default.eachTree(column.children, childColumn => {
-          resizeColumn = childColumn;
-        });
-      }
-      const cell = dragBtnElem.parentNode;
-      const cellParams = Object.assign(params, {
-        cell
-      });
-      let dragLeft = 0;
-      const bodyScrollElem = (0, _util.getRefElem)(elemStore['main-body-scroll']);
-      if (!bodyScrollElem) {
-        return;
-      }
-      const pos = (0, _dom.getOffsetPos)(dragBtnElem, wrapperElem);
-      const dragBtnWidth = dragBtnElem.clientWidth;
-      const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2);
-      const minInterval = (0, _util.getColReMinWidth)(cellParams) - dragBtnOffsetWidth; // 列之间的最小间距
-      let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval;
-      let dragPosLeft = pos.left + dragBtnOffsetWidth;
-      const domMousemove = document.onmousemove;
-      const domMouseup = document.onmouseup;
-      const isLeftFixed = fixedType === 'left';
-      const isRightFixed = fixedType === 'right';
-      // 计算左右侧固定列偏移量
-      let fixedOffsetWidth = 0;
-      if (isLeftFixed || isRightFixed) {
-        const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling';
-        let tempCellElem = cell[siblingProp];
-        while (tempCellElem) {
-          if ((0, _dom.hasClass)(tempCellElem, 'fixed--hidden')) {
-            break;
-          } else if (!(0, _dom.hasClass)(tempCellElem, 'col--group')) {
-            fixedOffsetWidth += tempCellElem.offsetWidth;
-          }
-          tempCellElem = tempCellElem[siblingProp];
-        }
-        if (isRightFixed && rightContainerElem) {
-          dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth;
-        }
-      }
-      // 处理拖动事件
-      const updateEvent = evnt => {
-        evnt.stopPropagation();
-        evnt.preventDefault();
-        const tableHeight = tableEl.clientHeight;
-        const offsetX = evnt.clientX - dragClientX;
-        let left = dragPosLeft + offsetX;
-        const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft;
-        if (isLeftFixed) {
-          // 左固定列（不允许超过右侧固定列、不允许超过右边距）
-          left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval);
-        } else if (isRightFixed) {
-          // 右侧固定列（不允许超过左侧固定列、不允许超过左边距）
-          dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval;
-          left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval);
-        } else {
-          dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft);
-          // left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
-        }
-        dragLeft = Math.max(left, dragMinLeft);
-        const resizeBarLeft = Math.max(1, dragLeft - scrollLeft);
-        resizeBarElem.style.left = `${resizeBarLeft}px`;
-        resizeBarElem.style.top = `${scrollbarXToTop ? scrollbarHeight : 0}px`;
-        resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - scrollbarHeight : tableHeight}px`;
-        if (resizableOpts.showDragTip && resizeTipElem) {
-          const tableWidth = tableEl.clientWidth;
-          const wrapperRect = wrapperElem.getBoundingClientRect();
-          const resizeBarWidth = resizeBarElem.clientWidth;
-          const resizeTipWidth = resizeTipElem.clientWidth;
-          const resizeTipHeight = resizeTipElem.clientHeight;
-          let resizeTipLeft = -resizeTipWidth;
-          if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
-            resizeTipLeft = 0;
-          } else if (resizeBarLeft > tableWidth) {
-            resizeTipLeft += tableWidth - resizeBarLeft;
-          }
-          resizeTipElem.style.left = `${resizeTipLeft}px`;
-          resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`;
-          resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)]);
-        }
-      };
-      tableReactData._isResize = true;
-      (0, _dom.addClass)(tableEl, 'drag--resize');
-      resizeBarElem.style.display = 'block';
-      document.onmousemove = updateEvent;
-      document.onmouseup = function (evnt) {
-        document.onmousemove = domMousemove;
-        document.onmouseup = domMouseup;
-        const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft);
-        resizeColumn.resizeWidth = resizeWidth;
-        if (resizableOpts.dragMode === 'fixed') {
-          visibleColumn.forEach(item => {
-            if (item.id !== resizeColumn.id) {
-              if (!item.resizeWidth) {
-                item.resizeWidth = item.renderWidth;
-              }
-            }
-          });
-        }
-        resizeBarElem.style.display = 'none';
-        tableReactData._isResize = false;
-        tableInternalData._lastResizeTime = Date.now();
-        $xeTable.analyColumnWidth();
-        $xeTable.recalculate(true).then(() => {
-          $xeTable.saveCustomStore('update:visible');
-          $xeTable.updateCellAreas();
-          $xeTable.dispatchEvent('resizable-change', Object.assign(Object.assign({}, params), {
-            resizeWidth
-          }), evnt);
-          setTimeout(() => $xeTable.recalculate(true), 300);
-        });
-        (0, _dom.removeClass)(tableEl, 'drag--resize');
-      };
-      updateEvent(evnt);
-      if ($xeTable.closeMenu) {
-        $xeTable.closeMenu();
-      }
-    };
     const renderRows = (isGroup, isOptimizeMode, cols, $rowIndex) => {
       const {
         fixedType
@@ -235,6 +82,10 @@ var _default = exports.default = (0, _vue.defineComponent)({
       } = tableInternalData;
       const columnOpts = computeColumnOpts.value;
       const columnDragOpts = computeColumnDragOpts.value;
+      const cellOpts = computeCellOpts.value;
+      const defaultRowHeight = computeDefaultRowHeight.value;
+      const headerCellOpts = computeHeaderCellOpts.value;
+      const currCellHeight = (0, _util.getCellHeight)(headerCellOpts.height || cellOpts.height) || defaultRowHeight;
       const {
         disabledMethod: dragDisabledMethod,
         isCrossDrag,
@@ -256,6 +107,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         const compConf = renderOpts ? renderer.get(renderOpts.name) : null;
         const isColGroup = column.children && column.children.length;
         const fixedHiddenColumn = fixedType ? column.fixed !== fixedType && !isColGroup : !!column.fixed && overflowX;
+        const isPadding = _xeUtils.default.isBoolean(headerCellOpts.padding) ? headerCellOpts.padding : cellOpts.padding;
         const headOverflow = _xeUtils.default.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
         const headAlign = headerAlign || (compConf ? compConf.tableHeaderCellAlign : '') || allHeaderAlign || align || (compConf ? compConf.tableCellAlign : '') || allAlign;
         let showEllipsis = headOverflow === 'ellipsis';
@@ -270,7 +122,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         }
         const columnIndex = $xeTable.getColumnIndex(column);
         const _columnIndex = $xeTable.getVTColumnIndex(column);
-        const params = {
+        const cellParams = {
           $table: $xeTable,
           $grid: $xeTable.xegrid,
           $rowIndex,
@@ -290,8 +142,8 @@ var _default = exports.default = (0, _vue.defineComponent)({
           rowspan: column.rowSpan > 1 ? column.rowSpan : null
         };
         const thOns = {
-          onClick: evnt => $xeTable.triggerHeaderCellClickEvent(evnt, params),
-          onDblclick: evnt => $xeTable.triggerHeaderCellDblclickEvent(evnt, params)
+          onClick: evnt => $xeTable.triggerHeaderCellClickEvent(evnt, cellParams),
+          onDblclick: evnt => $xeTable.triggerHeaderCellDblclickEvent(evnt, cellParams)
         };
         // 横向虚拟滚动不支持动态行高
         if (scrollXLoad && !hasEllipsis) {
@@ -300,11 +152,11 @@ var _default = exports.default = (0, _vue.defineComponent)({
         const isColDragCell = columnOpts.drag && columnDragOpts.trigger === 'cell';
         let isDisabledDrag = false;
         if (isColDragCell) {
-          isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(params));
+          isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(cellParams));
         }
         // 按下事件处理
         if (mouseConfig || isColDragCell) {
-          thOns.onMousedown = evnt => $xeTable.triggerHeaderCellMousedownEvent(evnt, params);
+          thOns.onMousedown = evnt => $xeTable.triggerHeaderCellMousedownEvent(evnt, cellParams);
         }
         // 拖拽列事件
         if (columnOpts.drag) {
@@ -322,6 +174,12 @@ var _default = exports.default = (0, _vue.defineComponent)({
         if (scrollXLoad && !column.fixed && (_columnIndex < scrollXStore.visibleStartIndex - scrollXStore.preloadSize || _columnIndex > scrollXStore.visibleEndIndex + scrollXStore.preloadSize)) {
           isVNPreEmptyStatus = true;
         }
+        const tcStyle = {};
+        if (hasEllipsis) {
+          tcStyle.height = `${currCellHeight}px`;
+        } else {
+          tcStyle.minHeight = `${currCellHeight}px`;
+        }
         return (0, _vue.h)('th', Object.assign(Object.assign(Object.assign({
           class: ['vxe-header--column', colid, {
             [`col--${headAlign}`]: headAlign,
@@ -332,14 +190,15 @@ var _default = exports.default = (0, _vue.defineComponent)({
             'col--ellipsis': hasEllipsis,
             'fixed--width': !isAutoCellWidth,
             'fixed--hidden': fixedHiddenColumn,
+            'is--padding': isPadding,
             'is--sortable': column.sortable,
             'col--filter': !!filters,
             'is--filter-active': hasFilter,
             'is--drag-active': !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
             'is--drag-disabled': isDisabledDrag,
             'col--current': currentColumn === column
-          }, headerClassName ? _xeUtils.default.isFunction(headerClassName) ? headerClassName(params) : headerClassName : '', headerCellClassName ? _xeUtils.default.isFunction(headerCellClassName) ? headerCellClassName(params) : headerCellClassName : ''],
-          style: headerCellStyle ? _xeUtils.default.isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle : null
+          }, headerClassName ? _xeUtils.default.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName : '', headerCellClassName ? _xeUtils.default.isFunction(headerCellClassName) ? headerCellClassName(cellParams) : headerCellClassName : ''],
+          style: headerCellStyle ? _xeUtils.default.isFunction(headerCellStyle) ? headerCellStyle(cellParams) : headerCellStyle : null
         }, thAttrs), thOns), {
           key: columnKey || scrollXLoad || scrollYLoad || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
         }), [(0, _vue.h)('div', {
@@ -347,17 +206,21 @@ var _default = exports.default = (0, _vue.defineComponent)({
             'c--title': showTitle,
             'c--tooltip': showTooltip,
             'c--ellipsis': showEllipsis
-          }]
-        }, isVNPreEmptyStatus || isOptimizeMode && fixedHiddenColumn ? [] : column.renderHeader(params)),
+          }],
+          style: tcStyle
+        }, isVNPreEmptyStatus || isOptimizeMode && fixedHiddenColumn ? [] : [(0, _vue.h)('div', {
+          colid,
+          class: 'vxe-cell--wrapper'
+        }, column.renderHeader(cellParams))]),
         /**
          * 列宽拖动
          */
         !fixedHiddenColumn && showResizable ? (0, _vue.h)('div', {
-          class: ['vxe-resizable', {
+          class: ['vxe-cell--col-resizable', {
             'is--line': !border || border === 'none'
           }],
-          onMousedown: evnt => resizeMousedownEvent(evnt, params),
-          onDblclick: evnt => $xeTable.handleResizeDblclickEvent(evnt, params)
+          onMousedown: evnt => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
+          onDblclick: evnt => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
         }) : renderEmptyElement($xeTable)]);
       });
     };
@@ -370,6 +233,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         headerRowStyle
       } = tableProps;
       const {
+        isColLoading,
         isDragColMove
       } = tableReactData;
       const columnOpts = computeColumnOpts.value;
@@ -381,7 +245,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
           fixed: fixedType,
           type: renderType
         };
-        if (columnOpts.drag && columnDragOpts.animation) {
+        if (!isColLoading && columnOpts.drag && columnDragOpts.animation) {
           return (0, _vue.h)(_vue.TransitionGroup, {
             key: $rowIndex,
             name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
@@ -406,6 +270,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         tableColumn
       } = props;
       const {
+        mouseConfig,
         showHeaderOverflow: allColumnHeaderOverflow,
         spanMethod,
         footerSpanMethod
@@ -420,6 +285,7 @@ var _default = exports.default = (0, _vue.defineComponent)({
         visibleColumn,
         fullColumnIdData
       } = tableInternalData;
+      const mouseOpts = computeMouseOpts.value;
       let renderHeaderList = headerColumn.value;
       let renderColumnList = tableColumn;
       let isOptimizeMode = false;
@@ -506,14 +372,21 @@ var _default = exports.default = (0, _vue.defineComponent)({
       */
       (0, _vue.h)('thead', {
         ref: refHeaderTHead
-      }, renderHeads(isGroup, isOptimizeMode, renderHeaderList))])]),
-      /**
-       * 其他
-       */
-      (0, _vue.h)('div', {
-        ref: refHeaderBorderRepair,
-        class: 'vxe-table--header-border-line'
-      })]);
+      }, renderHeads(isGroup, isOptimizeMode, renderHeaderList))]), mouseConfig && mouseOpts.area ? (0, _vue.h)('div', {
+        class: 'vxe-table--cell-area'
+      }, [(0, _vue.h)('span', {
+        class: 'vxe-table--cell-main-area'
+      }), (0, _vue.h)('span', {
+        class: 'vxe-table--cell-copy-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($xeTable)])]);
     };
     (0, _vue.watch)(() => props.tableColumn, uploadColumn);
     (0, _vue.onMounted)(() => {

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

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util"),_dom=require("../../ui/src/dom");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getI18n,renderer,renderEmptyElement}=_ui.VxeUI,renderType="header";var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(B){let V=(0,_vue.inject)("$xeTable",{}),{xID:f,props:m,reactData:Y,internalData:K}=V,{refElem:r,refLeftContainer:s,refRightContainer:u,refCellResizeBar:c,refCellResizeTip:p}=V.getRefMaps(),{computeColumnOpts:g,computeColumnDragOpts:x,computeResizableOpts:v,computeScrollbarXToTop:h}=V.getComputeMaps(),_=(0,_vue.ref)([]),H=(0,_vue.ref)(),b=(0,_vue.ref)(),C=(0,_vue.ref)(),y=(0,_vue.ref)(),w=(0,_vue.ref)(),D=(0,_vue.ref)(),M=(0,_vue.ref)(),t=()=>{var e=Y.isGroup;_.value=e?(0,_util.convertHeaderColumnToRows)(B.tableGroupColumn):[]},J=(e,a)=>{var l=a.column;let f=B.fixedType,m=Y.scrollbarHeight,{elemStore:t,visibleColumn:i}=K,g=v.value,x=r.value,_=s.value,b=u.value,C=c.value,y=p.value,w=h.value,D=e.clientX,M=H.value;var n=e.target;let T=l,z=(l.children&&l.children.length&&_xeUtils.default.eachTree(l.children,e=>{T=e}),n.parentNode);l=Object.assign(a,{cell:z});let S=0,E=(0,_util.getRefElem)(t["main-body-scroll"]);if(E){var o=(0,_dom.getOffsetPos)(n,M),n=n.clientWidth,d=Math.floor(n/2);let s=(0,_util.getColReMinWidth)(l)-d,u=o.left-z.clientWidth+n+s,c=o.left+d,t=document.onmousemove,r=document.onmouseup,p="left"===f,v="right"===f,h=0;if(p||v){var W=p?"nextElementSibling":"previousElementSibling";let e=z[W];for(;e&&!(0,_dom.hasClass)(e,"fixed--hidden");)(0,_dom.hasClass)(e,"col--group")||(h+=e.offsetWidth),e=e[W];v&&b&&(c=b.offsetLeft+h)}l=l=>{l.stopPropagation(),l.preventDefault();var t=x.clientHeight,r=l.clientX-D;let e=c+r;r=f?0:E.scrollLeft,p?e=Math.min(e,(b?b.offsetLeft:E.clientWidth)-h-s):v?(u=(_?_.clientWidth:0)+h+s,e=Math.min(e,c+z.clientWidth-s)):u=Math.max(E.scrollLeft,u),S=Math.max(e,u),r=Math.max(1,S-r);if(C.style.left=r+"px",C.style.top=`${w?m:0}px`,C.style.height=`${w?t-m:t}px`,g.showDragTip&&y){var a=x.clientWidth,i=M.getBoundingClientRect(),n=C.clientWidth,o=y.clientWidth,d=y.clientHeight;let e=-o;r<o+n?e=0:a<r&&(e+=a-r),y.style.left=e+"px",y.style.top=Math.min(t-d,Math.max(0,l.clientY-i.y-d/2))+"px",y.textContent=getI18n("vxe.table.resizeColTip",[T.renderWidth+(v?c-S:S-c)])}};Y._isResize=!0,(0,_dom.addClass)(x,"drag--resize"),C.style.display="block",document.onmousemove=l,document.onmouseup=function(e){document.onmousemove=t,document.onmouseup=r;let l=T.renderWidth+(v?c-S:S-c);T.resizeWidth=l,"fixed"===g.dragMode&&i.forEach(e=>{e.id===T.id||e.resizeWidth||(e.resizeWidth=e.renderWidth)}),C.style.display="none",Y._isResize=!1,K._lastResizeTime=Date.now(),V.analyColumnWidth(),V.recalculate(!0).then(()=>{V.saveCustomStore("update:visible"),V.updateCellAreas(),V.dispatchEvent("resizable-change",Object.assign(Object.assign({},a),{resizeWidth:l}),e),setTimeout(()=>V.recalculate(!0),300)}),(0,_dom.removeClass)(x,"drag--resize")},l(e),V.closeMenu&&V.closeMenu()}},T=(e,D,M,T)=>{let z=B.fixedType,{resizable:S,border:E,columnKey:W,headerCellClassName:H,headerCellStyle:R,showHeaderOverflow:I,headerAlign:O,align:k,mouseConfig:U}=m,{currentColumn:$,scrollXLoad:A,scrollYLoad:F,overflowX:L}=Y,j=K.scrollXStore,q=g.value,X=x.value,{disabledMethod:G,isCrossDrag:N,isPeerDrag:P}=X;return M.map((e,l)=>{var{type:t,showHeaderOverflow:r,headerAlign:a,align:i,filters:n,headerClassName:o,editRender:d,cellRender:s}=e,u=e.id,d=d||s,s=d?renderer.get(d.name):null,d=e.children&&e.children.length,c=z?e.fixed!==z&&!d:!!e.fixed&&L,r=_xeUtils.default.eqNull(r)?I:r,a=a||(s?s.tableHeaderCellAlign:"")||O||i||(s?s.tableCellAlign:"")||k;let p="ellipsis"===r;i="title"===r,s=!0===r||"tooltip"===r;let v=i||s||p,h=!1,f=null;n&&(f=n[0],h=n.some(e=>e.checked));var r=V.getColumnIndex(e),m=V.getVTColumnIndex(e);let g={$table:V,$grid:V.xegrid,$rowIndex:T,column:e,columnIndex:r,$columnIndex:l,_columnIndex:m,firstFilterOption:f,fixed:z,type:renderType,isHidden:c,hasFilter:h};var r={colid:u,colspan:1<e.colSpan?e.colSpan:null,rowspan:1<e.rowSpan?e.rowSpan:null},x={onClick:e=>V.triggerHeaderCellClickEvent(e,g),onDblclick:e=>V.triggerHeaderCellDblclickEvent(e,g)},_=(A&&!v&&(p=v=!0),q.drag&&"cell"===X.trigger);let b=!1;_&&(b=!(!G||!G(g))),(U||_)&&(x.onMousedown=e=>V.triggerHeaderCellMousedownEvent(e,g)),q.drag&&(x.onDragstart=V.handleHeaderCellDragDragstartEvent,x.onDragend=V.handleHeaderCellDragDragendEvent,x.onDragover=V.handleHeaderCellDragDragoverEvent,_)&&(x.onMouseup=V.handleHeaderCellDragMouseupEvent);var _=l===M.length-1,C=_xeUtils.default.isBoolean(e.resizable)?e.resizable:q.resizable||S,y=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let w=!1;return A&&!e.fixed&&(m<j.visibleStartIndex-j.preloadSize||m>j.visibleEndIndex+j.preloadSize)&&(w=!0),(0,_vue.h)("th",Object.assign(Object.assign(Object.assign({class:["vxe-header--column",u,{["col--"+a]:a,["col--"+t]:t,"col--last":_,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":v,"fixed--width":!y,"fixed--hidden":c,"is--sortable":e.sortable,"col--filter":!!n,"is--filter-active":h,"is--drag-active":!e.fixed&&!b&&(N||P||!e.parentId),"is--drag-disabled":b,"col--current":$===e},o?_xeUtils.default.isFunction(o)?o(g):o:"",H?_xeUtils.default.isFunction(H)?H(g):H:""],style:R?_xeUtils.default.isFunction(R)?R(g):R:null},r),x),{key:W||A||F||q.useKey||q.drag||d?u:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":i,"c--tooltip":s,"c--ellipsis":p}]},w||D&&c?[]:e.renderHeader(g)),!c&&C?(0,_vue.h)("div",{class:["vxe-resizable",{"is--line":!E||"none"===E}],onMousedown:e=>J(e,g),onDblclick:e=>V.handleResizeDblclickEvent(e,g)}):renderEmptyElement(V)])})};return(0,_vue.watch)(()=>B.tableColumn,t),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=B.fixedType,l=V.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=H,l[e+"scroll"]=b,l[e+"table"]=C,l[e+"colgroup"]=y,l[e+"list"]=w,l[e+"xSpace"]=D,l[e+"repair"]=M,t()})}),(0,_vue.onUnmounted)(()=>{var e=B.fixedType,l=V.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:t}=B;var{showHeaderOverflow:r,spanMethod:a,footerSpanMethod:i}=m,{isGroup:n,scrollXLoad:o,scrollYLoad:d,dragCol:s}=Y,{visibleColumn:u,fullColumnIdData:c}=K;let p=_.value,v=t,h=!1;return n?v=u:(!(o||d||r)||a||i||(h=!0),l&&(v=u,h)&&(v=e||[]),p=[v]),l||n||o&&s&&2<v.length&&(d=c[s.id])&&(r=d._index,a=v[0],i=v[v.length-1],u=c[a.id],o=c[i.id],u)&&o&&(d=u._index,a=o._index,r<d?(v=[s].concat(v),p=[[s].concat(p[0])].concat(p.slice(1))):a<r&&(v=v.concat([s]),p=[p[0].concat([s])].concat(p.slice(1)))),(0,_vue.h)("div",{ref:H,class:["vxe-table--header-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:f},[(0,_vue.h)("div",{ref:b,class:"vxe-table--header-inner-wrapper",onScroll(e){V.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(V):(0,_vue.h)("div",{ref:D,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:C,class:"vxe-table--header",xid:f,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:y},v.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l}))),(0,_vue.h)("thead",{ref:w},((r,a,e)=>{let i=B.fixedType,{headerRowClassName:n,headerRowStyle:o}=m,d=Y.isDragColMove,s=g.value,u=x.value;return e.map((e,l)=>{var t={$table:V,$rowIndex:l,fixed:i,type:renderType};return s.drag&&u.animation?(0,_vue.h)(_vue.TransitionGroup,{key:l,name:"vxe-header--col-list"+(d?"":"-disabled"),tag:"tr",class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},{default:()=>T(r,a,e,l)}):(0,_vue.h)("tr",{key:l,class:["vxe-header--row",n?_xeUtils.default.isFunction(n)?n(t):n:""],style:o?_xeUtils.default.isFunction(o)?o(t):o:null},T(r,a,e,l))})})(n,h,p))])]),(0,_vue.h)("div",{ref:M,class:"vxe-table--header-border-line"})])}}});
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{renderer,renderEmptyElement}=_ui.VxeUI,renderType="header";var _default=exports.default=(0,_vue.defineComponent)({name:"VxeTableHeader",props:{tableData:Array,tableColumn:Array,tableGroupColumn:Array,fixedColumn:Array,fixedType:{type:String,default:null}},setup(f){let J=(0,_vue.inject)("$xeTable",{}),{xID:_,props:m,reactData:b,internalData:C}=J,{computeColumnOpts:y,computeColumnDragOpts:w,computeCellOpts:a,computeMouseOpts:D,computeHeaderCellOpts:r,computeDefaultRowHeight:t}=J.getComputeMaps(),H=(0,_vue.ref)([]),E=(0,_vue.ref)(),S=(0,_vue.ref)(),M=(0,_vue.ref)(),T=(0,_vue.ref)(),I=(0,_vue.ref)(),O=(0,_vue.ref)(),n=(0,_vue.ref)(),i=()=>{var e=b.isGroup;H.value=e?(0,_util.convertHeaderColumnToRows)(f.tableGroupColumn):[]},U=(e,H,E,S)=>{let M=f.fixedType,{resizable:T,border:I,columnKey:O,headerCellClassName:U,headerCellStyle:k,showHeaderOverflow:z,headerAlign:R,align:$,mouseConfig:F}=m,{currentColumn:A,scrollXLoad:q,scrollYLoad:j,overflowX:G}=b,L=C.scrollXStore,N=y.value,X=w.value,V=a.value;var l=t.value;let B=r.value,K=(0,_util.getCellHeight)(B.height||V.height)||l,{disabledMethod:P,isCrossDrag:W,isPeerDrag:Y}=X;return E.map((e,l)=>{var{type:a,showHeaderOverflow:r,headerAlign:t,align:n,filters:i,headerClassName:o,editRender:d,cellRender:u}=e,s=e.id,d=d||u,u=d?renderer.get(d.name):null,d=e.children&&e.children.length,c=M?e.fixed!==M&&!d:!!e.fixed&&G,v=(_xeUtils.default.isBoolean(B.padding)?B:V).padding,r=_xeUtils.default.eqNull(r)?z:r,t=t||(u?u.tableHeaderCellAlign:"")||R||n||(u?u.tableCellAlign:"")||$;let p="ellipsis"===r;n="title"===r,u=!0===r||"tooltip"===r;let x=n||u||p,h=!1,g=null;i&&(g=i[0],h=i.some(e=>e.checked));var r=J.getColumnIndex(e),f=J.getVTColumnIndex(e);let _={$table:J,$grid:J.xegrid,$rowIndex:S,column:e,columnIndex:r,$columnIndex:l,_columnIndex:f,firstFilterOption:g,fixed:M,type:renderType,isHidden:c,hasFilter:h};var r={colid:s,colspan:1<e.colSpan?e.colSpan:null,rowspan:1<e.rowSpan?e.rowSpan:null},m={onClick:e=>J.triggerHeaderCellClickEvent(e,_),onDblclick:e=>J.triggerHeaderCellDblclickEvent(e,_)},b=(q&&!x&&(p=x=!0),N.drag&&"cell"===X.trigger);let C=!1;b&&(C=!(!P||!P(_))),(F||b)&&(m.onMousedown=e=>J.triggerHeaderCellMousedownEvent(e,_)),N.drag&&(m.onDragstart=J.handleHeaderCellDragDragstartEvent,m.onDragend=J.handleHeaderCellDragDragendEvent,m.onDragover=J.handleHeaderCellDragDragoverEvent,b)&&(m.onMouseup=J.handleHeaderCellDragMouseupEvent);var b=l===E.length-1,y=_xeUtils.default.isBoolean(e.resizable)?e.resizable:N.resizable||T,w=!e.resizeWidth&&("auto"===e.minWidth||"auto"===e.width);let D=!1;q&&!e.fixed&&(f<L.visibleStartIndex-L.preloadSize||f>L.visibleEndIndex+L.preloadSize)&&(D=!0);f={};return x?f.height=K+"px":f.minHeight=K+"px",(0,_vue.h)("th",Object.assign(Object.assign(Object.assign({class:["vxe-header--column",s,{["col--"+t]:t,["col--"+a]:a,"col--last":b,"col--fixed":e.fixed,"col--group":d,"col--ellipsis":x,"fixed--width":!w,"fixed--hidden":c,"is--padding":v,"is--sortable":e.sortable,"col--filter":!!i,"is--filter-active":h,"is--drag-active":!e.fixed&&!C&&(W||Y||!e.parentId),"is--drag-disabled":C,"col--current":A===e},o?_xeUtils.default.isFunction(o)?o(_):o:"",U?_xeUtils.default.isFunction(U)?U(_):U:""],style:k?_xeUtils.default.isFunction(k)?k(_):k:null},r),m),{key:O||q||j||N.useKey||N.drag||d?s:l}),[(0,_vue.h)("div",{class:["vxe-cell",{"c--title":n,"c--tooltip":u,"c--ellipsis":p}],style:f},D||H&&c?[]:[(0,_vue.h)("div",{colid:s,class:"vxe-cell--wrapper"},e.renderHeader(_))]),!c&&y?(0,_vue.h)("div",{class:["vxe-cell--col-resizable",{"is--line":!I||"none"===I}],onMousedown:e=>J.handleColResizeMousedownEvent(e,M,_),onDblclick:e=>J.handleColResizeDblclickEvent(e,_)}):renderEmptyElement(J)])})};return(0,_vue.watch)(()=>f.tableColumn,i),(0,_vue.onMounted)(()=>{(0,_vue.nextTick)(()=>{var e=f.fixedType,l=J.internalData,l=l.elemStore,e=`${e||"main"}-header-`;l[e+"wrapper"]=E,l[e+"scroll"]=S,l[e+"table"]=M,l[e+"colgroup"]=T,l[e+"list"]=I,l[e+"xSpace"]=O,l[e+"repair"]=n,i()})}),(0,_vue.onUnmounted)(()=>{var e=f.fixedType,l=J.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}=f;var{mouseConfig:r,showHeaderOverflow:t,spanMethod:n,footerSpanMethod:i}=m,{isGroup:o,scrollXLoad:d,scrollYLoad:u,dragCol:s}=b,{visibleColumn:c,fullColumnIdData:v}=C,p=D.value;let x=H.value,h=a,g=!1;return o?h=c:(!(d||u||t)||n||i||(g=!0),l&&(h=c,g)&&(h=e||[]),x=[h]),l||o||d&&s&&2<h.length&&(u=v[s.id])&&(t=u._index,n=h[0],i=h[h.length-1],c=v[n.id],d=v[i.id],c)&&d&&(u=c._index,n=d._index,t<u?(h=[s].concat(h),x=[[s].concat(x[0])].concat(x.slice(1))):n<t&&(h=h.concat([s]),x=[x[0].concat([s])].concat(x.slice(1)))),(0,_vue.h)("div",{ref:E,class:["vxe-table--header-wrapper",l?`fixed-${l}--wrapper`:"body--wrapper"],xid:_},[(0,_vue.h)("div",{ref:S,class:"vxe-table--header-inner-wrapper",onScroll(e){J.triggerHeaderScrollEvent(e,l)}},[l?renderEmptyElement(J):(0,_vue.h)("div",{ref:O,class:"vxe-body--x-space"}),(0,_vue.h)("table",{ref:M,class:"vxe-table--header",xid:_,cellspacing:0,cellpadding:0,border:0},[(0,_vue.h)("colgroup",{ref:T},h.map((e,l)=>(0,_vue.h)("col",{name:e.id,key:l}))),(0,_vue.h)("thead",{ref:I},((r,t,e)=>{let n=f.fixedType,{headerRowClassName:i,headerRowStyle:o}=m,{isColLoading:d,isDragColMove:u}=b,s=y.value,c=w.value;return e.map((e,l)=>{var a={$table:J,$rowIndex:l,fixed:n,type:renderType};return!d&&s.drag&&c.animation?(0,_vue.h)(_vue.TransitionGroup,{key:l,name:"vxe-header--col-list"+(u?"":"-disabled"),tag:"tr",class:["vxe-header--row",i?_xeUtils.default.isFunction(i)?i(a):i:""],style:o?_xeUtils.default.isFunction(o)?o(a):o:null},{default:()=>U(r,t,e,l)}):(0,_vue.h)("tr",{key:l,class:["vxe-header--row",i?_xeUtils.default.isFunction(i)?i(a):i:""],style:o?_xeUtils.default.isFunction(o)?o(a):o:null},U(r,t,e,l))})})(o,g,x))]),r&&p.area?(0,_vue.h)("div",{class:"vxe-table--cell-area"},[(0,_vue.h)("span",{class:"vxe-table--cell-main-area"}),(0,_vue.h)("span",{class:"vxe-table--cell-copy-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(J)])])}}});

package/lib/table/src/props.js

@@ -37,10 +37,10 @@ var _default = exports.default = {
     type: [Boolean, String],
     default: () => getConfig().table.border
   },
-  // 单元格是否有边距
+  // 已废弃，被 cell-config.padding 替换
   padding: {
     type: Boolean,
-    default: () => getConfig().table.padding
+    default: null
   },
   // 是否圆角边框
   round: {
@@ -89,12 +89,18 @@ var _default = exports.default = {
     type: Boolean,
     default: () => getConfig().table.highlightHoverRow
   },
-  // （即将废弃）是否要高亮当前选中列
+  /**
+   * （即将废弃）是否要高亮当前选中列
+   * @deprecated
+   */
   highlightCurrentColumn: {
     type: Boolean,
     default: () => getConfig().table.highlightCurrentColumn
   },
-  // （即将废弃）鼠标移到列是否要高亮显示
+  /**
+   * （即将废弃）鼠标移到列是否要高亮显示
+   * @deprecated
+   */
   highlightHoverColumn: {
     type: Boolean,
     default: () => getConfig().table.highlightHoverColumn
@@ -186,6 +192,10 @@ var _default = exports.default = {
   columnConfig: Object,
   // 单元格配置信息
   cellConfig: Object,
+  // 表头单元格配置信息
+  headerCellConfig: Object,
+  // 表尾单元格配置信息
+  footerCellConfig: Object,
   // 行配置信息
   rowConfig: Object,
   // 已废弃，被 rowDragConfig 替换

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

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _ui=require("../../ui");let getConfig=_ui.VxeUI.getConfig;var _default=exports.default={id:[String,Function],data:Array,height:[Number,String],minHeight:{type:[Number,String],default:()=>getConfig().table.minHeight},maxHeight:[Number,String],resizable:{type:Boolean,default:()=>getConfig().table.resizable},stripe:{type:Boolean,default:()=>getConfig().table.stripe},border:{type:[Boolean,String],default:()=>getConfig().table.border},padding:{type:Boolean,default:()=>getConfig().table.padding},round:{type:Boolean,default:()=>getConfig().table.round},size:{type:String,default:()=>getConfig().table.size||getConfig().size},fit:{type:Boolean,default:()=>getConfig().table.fit},loading:Boolean,align:{type:String,default:()=>getConfig().table.align},headerAlign:{type:String,default:()=>getConfig().table.headerAlign},footerAlign:{type:String,default:()=>getConfig().table.footerAlign},showHeader:{type:Boolean,default:()=>getConfig().table.showHeader},highlightCurrentRow:{type:Boolean,default:()=>getConfig().table.highlightCurrentRow},highlightHoverRow:{type:Boolean,default:()=>getConfig().table.highlightHoverRow},highlightCurrentColumn:{type:Boolean,default:()=>getConfig().table.highlightCurrentColumn},highlightHoverColumn:{type:Boolean,default:()=>getConfig().table.highlightHoverColumn},highlightCell:Boolean,showFooter:Boolean,footerData:Array,footerMethod:Function,rowClassName:[String,Function],cellClassName:[String,Function],headerRowClassName:[String,Function],headerCellClassName:[String,Function],footerRowClassName:[String,Function],footerCellClassName:[String,Function],cellStyle:[Object,Function],headerCellStyle:[Object,Function],footerCellStyle:[Object,Function],rowStyle:[Object,Function],headerRowStyle:[Object,Function],footerRowStyle:[Object,Function],mergeCells:Array,mergeFooterItems:Array,spanMethod:Function,footerSpanMethod:Function,showOverflow:{type:[Boolean,String],default:()=>getConfig().table.showOverflow},showHeaderOverflow:{type:[Boolean,String],default:()=>getConfig().table.showHeaderOverflow},showFooterOverflow:{type:[Boolean,String],default:()=>getConfig().table.showFooterOverflow},columnKey:Boolean,rowKey:Boolean,rowId:{type:String,default:()=>getConfig().table.rowId},zIndex:Number,emptyText:{type:String,default:()=>getConfig().table.emptyText},keepSource:{type:Boolean,default:()=>getConfig().table.keepSource},autoResize:{type:Boolean,default:()=>getConfig().table.autoResize},syncResize:[Boolean,String,Number],resizeConfig:Object,columnConfig:Object,cellConfig:Object,rowConfig:Object,dragConfig:Object,rowDragConfig:Object,columnDragConfig:Object,resizableConfig:Object,seqConfig:Object,sortConfig:Object,filterConfig:Object,radioConfig:Object,checkboxConfig:Object,tooltipConfig:Object,exportConfig:Object,importConfig:Object,printConfig:Object,expandConfig:Object,treeConfig:Object,menuConfig:Object,mouseConfig:Object,areaConfig:Object,keyboardConfig:Object,clipConfig:Object,fnrConfig:Object,editConfig:Object,validConfig:Object,editRules:Object,loadingConfig:Object,emptyRender:Object,customConfig:Object,scrollX:Object,scrollY:Object,virtualXConfig:Object,virtualYConfig:Object,scrollbarConfig:Object,animat:{type:Boolean,default:()=>getConfig().table.animat},delayHover:{type:Number,default:()=>getConfig().table.delayHover},params:Object};
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _ui=require("../../ui");let getConfig=_ui.VxeUI.getConfig;var _default=exports.default={id:[String,Function],data:Array,height:[Number,String],minHeight:{type:[Number,String],default:()=>getConfig().table.minHeight},maxHeight:[Number,String],resizable:{type:Boolean,default:()=>getConfig().table.resizable},stripe:{type:Boolean,default:()=>getConfig().table.stripe},border:{type:[Boolean,String],default:()=>getConfig().table.border},padding:{type:Boolean,default:null},round:{type:Boolean,default:()=>getConfig().table.round},size:{type:String,default:()=>getConfig().table.size||getConfig().size},fit:{type:Boolean,default:()=>getConfig().table.fit},loading:Boolean,align:{type:String,default:()=>getConfig().table.align},headerAlign:{type:String,default:()=>getConfig().table.headerAlign},footerAlign:{type:String,default:()=>getConfig().table.footerAlign},showHeader:{type:Boolean,default:()=>getConfig().table.showHeader},highlightCurrentRow:{type:Boolean,default:()=>getConfig().table.highlightCurrentRow},highlightHoverRow:{type:Boolean,default:()=>getConfig().table.highlightHoverRow},highlightCurrentColumn:{type:Boolean,default:()=>getConfig().table.highlightCurrentColumn},highlightHoverColumn:{type:Boolean,default:()=>getConfig().table.highlightHoverColumn},highlightCell:Boolean,showFooter:Boolean,footerData:Array,footerMethod:Function,rowClassName:[String,Function],cellClassName:[String,Function],headerRowClassName:[String,Function],headerCellClassName:[String,Function],footerRowClassName:[String,Function],footerCellClassName:[String,Function],cellStyle:[Object,Function],headerCellStyle:[Object,Function],footerCellStyle:[Object,Function],rowStyle:[Object,Function],headerRowStyle:[Object,Function],footerRowStyle:[Object,Function],mergeCells:Array,mergeFooterItems:Array,spanMethod:Function,footerSpanMethod:Function,showOverflow:{type:[Boolean,String],default:()=>getConfig().table.showOverflow},showHeaderOverflow:{type:[Boolean,String],default:()=>getConfig().table.showHeaderOverflow},showFooterOverflow:{type:[Boolean,String],default:()=>getConfig().table.showFooterOverflow},columnKey:Boolean,rowKey:Boolean,rowId:{type:String,default:()=>getConfig().table.rowId},zIndex:Number,emptyText:{type:String,default:()=>getConfig().table.emptyText},keepSource:{type:Boolean,default:()=>getConfig().table.keepSource},autoResize:{type:Boolean,default:()=>getConfig().table.autoResize},syncResize:[Boolean,String,Number],resizeConfig:Object,columnConfig:Object,cellConfig:Object,headerCellConfig:Object,footerCellConfig:Object,rowConfig:Object,dragConfig:Object,rowDragConfig:Object,columnDragConfig:Object,resizableConfig:Object,seqConfig:Object,sortConfig:Object,filterConfig:Object,radioConfig:Object,checkboxConfig:Object,tooltipConfig:Object,exportConfig:Object,importConfig:Object,printConfig:Object,expandConfig:Object,treeConfig:Object,menuConfig:Object,mouseConfig:Object,areaConfig:Object,keyboardConfig:Object,clipConfig:Object,fnrConfig:Object,editConfig:Object,validConfig:Object,editRules:Object,loadingConfig:Object,emptyRender:Object,customConfig:Object,scrollX:Object,scrollY:Object,virtualXConfig:Object,virtualYConfig:Object,scrollbarConfig:Object,animat:{type:Boolean,default:()=>getConfig().table.animat},delayHover:{type:Number,default:()=>getConfig().table.delayHover},params:Object};