vxe-table 3.11.31 → 3.11.32

package/lib/index.umd.js

@@ -2220,7 +2220,7 @@ function getClass(property, params) {
 ;// CONCATENATED MODULE: ./packages/ui/index.ts
 
 
-const version = "3.11.31";
+const version = "3.11.32";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -2790,7 +2790,7 @@ function isNodeElement(elem) {
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"3.11.31"}`;
+const log_version = `table v${"3.11.32"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// CONCATENATED MODULE: ./packages/table/src/columnInfo.ts
@@ -3564,23 +3564,26 @@ function renderCellDragIcon(h, params) {
   const rowDragOpts = $table.computeRowDragOpts;
   const {
     icon,
+    trigger,
     disabledMethod
   } = rowDragOpts;
   const rDisabledMethod = disabledMethod || (dragConfig ? dragConfig.rowDisabledMethod : null);
   const isDisabled = rDisabledMethod && rDisabledMethod(params);
+  const ons = {};
+  if (trigger !== 'cell') {
+    ons.mousedown = evnt => {
+      if (!isDisabled) {
+        $table.handleCellDragMousedownEvent(evnt, params);
+      }
+    };
+    ons.mouseup = $table.handleCellDragMouseupEvent;
+  }
   return h('span', {
     key: 'dg',
     class: ['vxe-cell--drag-handle', {
       'is--disabled': isDisabled
     }],
-    on: {
-      mousedown(evnt) {
-        if (!isDisabled) {
-          $table.handleCellDragMousedownEvent(evnt, params);
-        }
-      },
-      mouseup: $table.handleCellDragMouseupEvent
-    }
+    on: ons
   }, [h('i', {
     class: icon || (dragConfig ? dragConfig.rowIcon : '') || cell_getIcon().TABLE_DRAG_ROW
   })]);
@@ -3629,26 +3632,29 @@ function renderHeaderCellDragIcon(h, params) {
   const {
     showIcon,
     icon,
+    trigger,
     isCrossDrag,
     visibleMethod,
     disabledMethod
   } = columnDragOpts;
-  const isDisabled = disabledMethod && disabledMethod(params);
   if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) {
     if (!column.fixed && (isCrossDrag || !column.parentId)) {
+      const isDisabled = disabledMethod && disabledMethod(params);
+      const ons = {};
+      if (trigger !== 'cell') {
+        ons.mousedown = evnt => {
+          if (!isDisabled) {
+            $table.handleHeaderCellDragMousedownEvent(evnt, params);
+          }
+        };
+        ons.mouseup = $table.handleHeaderCellDragMouseupEvent;
+      }
       return h('span', {
         key: 'dg',
         class: ['vxe-cell--drag-handle', {
           'is--disabled': isDisabled
         }],
-        on: {
-          mousedown(evnt) {
-            if (!isDisabled) {
-              $table.handleHeaderCellDragMousedownEvent(evnt, params);
-            }
-          },
-          mouseup: $table.handleHeaderCellDragMouseupEvent
-        }
+        on: ons
       }, [h('i', {
         class: icon || cell_getIcon().TABLE_DRAG_COLUMN
       })]);
@@ -10965,6 +10971,94 @@ const Methods = {
       $xeTable.handleColumnSortEvent(evnt, column);
     }
   },
+  /**
+   * 表头单元格按下事件
+   */
+  triggerHeaderCellMousedownEvent(evnt, params) {
+    const $xeTable = this;
+    const props = $xeTable;
+    const {
+      mouseConfig
+    } = props;
+    const mouseOpts = $xeTable.computeMouseOpts;
+    const columnOpts = $xeTable.computeColumnOpts;
+    const columnDragOpts = $xeTable.computeColumnDragOpts;
+    const {
+      trigger,
+      disabledMethod
+    } = columnDragOpts;
+    const cell = evnt.currentTarget;
+    const triggerInput = cell && cell.tagName && cell.tagName.toLowerCase() === 'input';
+    const triggerCheckbox = getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
+    const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag;
+    const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag;
+    let triggerDrag = false;
+    if (!(triggerInput || triggerCheckbox || triggerSort || triggerFilter)) {
+      if (columnOpts.drag && trigger === 'cell' && !(disabledMethod && disabledMethod(params))) {
+        triggerDrag = true;
+        $xeTable.handleHeaderCellDragMousedownEvent(evnt, params);
+      }
+    }
+    if (!triggerDrag && mouseConfig && mouseOpts.area && $xeTable.handleHeaderCellAreaEvent) {
+      $xeTable.handleHeaderCellAreaEvent(evnt, Object.assign({
+        cell,
+        triggerSort,
+        triggerFilter
+      }, params));
+    }
+    $xeTable.focus();
+    if ($xeTable.closeMenu) {
+      $xeTable.closeMenu();
+    }
+  },
+  /**
+   * 单元格按下事件
+   */
+  triggerCellMousedownEvent(evnt, params) {
+    const $xeTable = this;
+    const {
+      column
+    } = params;
+    const {
+      type,
+      treeNode
+    } = column;
+    const isRadioType = type === 'radio';
+    const isCheckboxType = type === 'checkbox';
+    const isExpandType = type === 'expand';
+    const rowOpts = $xeTable.computeRowOpts;
+    const rowDragOpts = $xeTable.computeRowDragOpts;
+    const {
+      trigger,
+      disabledMethod
+    } = rowDragOpts;
+    const cell = evnt.currentTarget;
+    params.cell = cell;
+    const triggerInput = cell && cell.tagName && cell.tagName.toLowerCase() === 'input';
+    const triggerRadio = isRadioType && getEventTargetNode(evnt, cell, 'vxe-cell--radio').flag;
+    const triggerCheckbox = isCheckboxType && getEventTargetNode(evnt, cell, 'vxe-cell--checkbox').flag;
+    const triggerTreeNode = treeNode && getEventTargetNode(evnt, cell, 'vxe-tree--btn-wrapper').flag;
+    const triggerExpandNode = isExpandType && getEventTargetNode(evnt, cell, 'vxe-table--expanded').flag;
+    let isColDragCell = false;
+    if (rowOpts.drag) {
+      isColDragCell = trigger === 'row' || column.dragSort && trigger === 'cell';
+    }
+    let triggerDrag = false;
+    if (!(triggerInput || triggerRadio || triggerCheckbox || triggerTreeNode || triggerExpandNode)) {
+      if (isColDragCell && !(disabledMethod && disabledMethod(params))) {
+        triggerDrag = true;
+        $xeTable.handleCellDragMousedownEvent(evnt, params);
+      }
+    }
+    if (!triggerDrag && $xeTable.handleCellMousedownEvent) {
+      $xeTable.handleCellMousedownEvent(evnt, params);
+    }
+    $xeTable.focus();
+    $xeTable.closeFilter();
+    if ($xeTable.closeMenu) {
+      $xeTable.closeMenu();
+    }
+  },
   /**
    * 行拖拽
    */
@@ -11225,18 +11319,20 @@ const Methods = {
     const $xeTable = this;
     const props = $xeTable;
     const reactData = $xeTable;
+    evnt.stopPropagation();
     const {
       dragConfig
     } = props;
     const rowDragOpts = $xeTable.computeRowDragOpts;
     const {
+      trigger,
       dragStartMethod
     } = rowDragOpts;
     const {
       row
     } = params;
     const dragEl = evnt.currentTarget;
-    const tdEl = dragEl.parentElement?.parentElement;
+    const tdEl = trigger === 'cell' || trigger === 'row' ? dragEl : dragEl.parentElement?.parentElement;
     const trEl = tdEl.parentElement;
     const dStartMethod = dragStartMethod || (dragConfig ? dragConfig.dragStartMethod : null);
     reactData.isDragRowMove = false;
@@ -11496,15 +11592,17 @@ const Methods = {
   handleHeaderCellDragMousedownEvent(evnt, params) {
     const $xeTable = this;
     const reactData = $xeTable;
+    evnt.stopPropagation();
     const columnDragOpts = $xeTable.computeColumnDragOpts;
     const {
+      trigger,
       dragStartMethod
     } = columnDragOpts;
     const {
       column
     } = params;
     const dragEl = evnt.currentTarget;
-    const thEl = dragEl.parentElement?.parentElement;
+    const thEl = trigger === 'cell' ? dragEl : dragEl.parentElement?.parentElement;
     reactData.isDragColMove = false;
     clearColDropOrigin($xeTable);
     if (dragStartMethod && !dragStartMethod(params)) {
@@ -13698,6 +13796,10 @@ function renderColumn(h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, ro
     areaOpts,
     validErrorMaps
   } = $xetable;
+  const rowDragOpts = $xetable.computeRowDragOpts;
+  const {
+    disabledMethod: dragDisabledMethod
+  } = rowDragOpts;
   const {
     selectCellToRow
   } = areaOpts;
@@ -13773,6 +13875,14 @@ function renderColumn(h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, ro
     data: tableData,
     items
   };
+  let isColDragCell = false;
+  let isDisabledDrag = false;
+  if (rowOpts.drag) {
+    isColDragCell = rowDragOpts.trigger === 'row' || column.dragSort && rowDragOpts.trigger === 'cell';
+  }
+  if (isColDragCell) {
+    isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(params));
+  }
   // hover 进入事件
   if (showTitle || showTooltip || showAllTip || bindMouseenter || tooltipConfig) {
     tdOns.mouseenter = evnt => {
@@ -13809,7 +13919,7 @@ function renderColumn(h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, ro
     };
   }
   // 按下事件处理
-  if (checkboxOpts.range || mouseConfig) {
+  if (isColDragCell || checkboxOpts.range || mouseConfig) {
     tdOns.mousedown = evnt => {
       $xetable.triggerCellMousedownEvent(evnt, params);
     };
@@ -13942,6 +14052,8 @@ function renderColumn(h, _vm, $xetable, seq, rowid, fixedType, rowLevel, row, ro
       'col--edit': isEdit,
       'col--ellipsis': hasEllipsis,
       'fixed--hidden': fixedHiddenColumn,
+      'is--drag-cell': isColDragCell,
+      'is--drag-disabled': isDisabledDrag,
       'col--dirty': isDirty,
       'col--active': editConfig && isEdit && actived.row === row && (actived.column === column || editOpts.mode === 'row'),
       'col--valid-error': !!errorValidItem,
@@ -14581,12 +14693,12 @@ const {
 } = core_.VxeUI;
 const cellType = 'header';
 const header_renderRows = (h, _vm, cols, $rowIndex) => {
+  const $xeTable = _vm.$parent;
+  const $xeGrid = $xeTable.xegrid;
   const {
-    $parent: $xetable,
     fixedType
   } = _vm;
   const {
-    $listeners: tableListeners,
     resizable: allResizable,
     border,
     columnKey,
@@ -14595,15 +14707,17 @@ const header_renderRows = (h, _vm, cols, $rowIndex) => {
     showHeaderOverflow: allColumnHeaderOverflow,
     headerAlign: allHeaderAlign,
     align: allAlign,
-    highlightCurrentColumn,
     currentColumn,
     scrollXLoad,
     overflowX,
     scrollbarWidth,
-    sortOpts,
     mouseConfig,
     columnOpts
-  } = $xetable;
+  } = $xeTable;
+  const columnDragOpts = $xeTable.computeColumnDragOpts;
+  const {
+    disabledMethod: dragDisabledMethod
+  } = columnDragOpts;
   return cols.map((column, $columnIndex) => {
     const {
       type,
@@ -14626,13 +14740,12 @@ const header_renderRows = (h, _vm, cols, $rowIndex) => {
     const showTitle = headOverflow === 'title';
     const showTooltip = headOverflow === true || headOverflow === 'tooltip';
     let hasEllipsis = showTitle || showTooltip || showEllipsis;
-    const thOns = {};
     const hasFilter = column.filters && column.filters.some(item => item.checked);
-    const columnIndex = $xetable.getColumnIndex(column);
-    const _columnIndex = $xetable.getVTColumnIndex(column);
+    const columnIndex = $xeTable.getColumnIndex(column);
+    const _columnIndex = $xeTable.getVTColumnIndex(column);
     const params = {
-      $table: $xetable,
-      $grid: $xetable.xegrid,
+      $table: $xeTable,
+      $grid: $xeGrid,
       $rowIndex,
       column,
       columnIndex,
@@ -14643,25 +14756,36 @@ const header_renderRows = (h, _vm, cols, $rowIndex) => {
       isHidden: fixedHiddenColumn,
       hasFilter
     };
+    const thAttrs = {
+      colid,
+      colspan: column.colSpan > 1 ? column.colSpan : null,
+      rowspan: column.rowSpan > 1 ? column.rowSpan : null
+    };
+    const thOns = {
+      click: evnt => $xeTable.triggerHeaderCellClickEvent(evnt, params),
+      dblclick: evnt => $xeTable.triggerHeaderCellDblclickEvent(evnt, params)
+    };
     // 虚拟滚动不支持动态高度
     if (scrollXLoad && !hasEllipsis) {
       showEllipsis = hasEllipsis = true;
     }
-    if (columnOpts.isCurrent || highlightCurrentColumn || tableListeners['header-cell-click'] || sortOpts.trigger === 'cell') {
-      thOns.click = evnt => $xetable.triggerHeaderCellClickEvent(evnt, params);
-    }
-    if (tableListeners['header-cell-dblclick']) {
-      thOns.dblclick = evnt => $xetable.triggerHeaderCellDblclickEvent(evnt, params);
+    const isColDragCell = columnOpts.drag && columnDragOpts.trigger === 'cell';
+    let isDisabledDrag = false;
+    if (isColDragCell) {
+      isDisabledDrag = !!(dragDisabledMethod && dragDisabledMethod(params));
     }
     // 按下事件处理
-    if (mouseConfig) {
-      thOns.mousedown = evnt => $xetable.triggerHeaderCellMousedownEvent(evnt, params);
+    if (mouseConfig || isColDragCell) {
+      thOns.mousedown = evnt => $xeTable.triggerHeaderCellMousedownEvent(evnt, params);
     }
-    // 拖拽行事件
+    // 拖拽列事件
     if (columnOpts.drag) {
-      thOns.dragstart = $xetable.handleHeaderCellDragDragstartEvent;
-      thOns.dragend = $xetable.handleHeaderCellDragDragendEvent;
-      thOns.dragover = $xetable.handleHeaderCellDragDragoverEvent;
+      thOns.dragstart = $xeTable.handleHeaderCellDragDragstartEvent;
+      thOns.dragend = $xeTable.handleHeaderCellDragDragendEvent;
+      thOns.dragover = $xeTable.handleHeaderCellDragDragoverEvent;
+      if (isColDragCell) {
+        thOns.mouseup = $xeTable.handleHeaderCellDragMouseupEvent;
+      }
     }
     return h('th', {
       class: ['vxe-header--column', colid, {
@@ -14675,13 +14799,10 @@ const header_renderRows = (h, _vm, cols, $rowIndex) => {
         'is--sortable': column.sortable,
         'col--filter': !!column.filters,
         'is--filter-active': hasFilter,
+        'is--drag-disabled': isDisabledDrag,
         'col--current': currentColumn === column
       }, getClass(headerClassName, params), getClass(headerCellClassName, params)],
-      attrs: {
-        colid,
-        colspan: column.colSpan > 1 ? column.colSpan : null,
-        rowspan: column.rowSpan > 1 ? column.rowSpan : null
-      },
+      attrs: thAttrs,
       style: headerCellStyle ? external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(headerCellStyle) ? headerCellStyle(params) : headerCellStyle : null,
       on: thOns,
       key: columnKey || columnOpts.useKey || columnOpts.drag || isColGroup ? colid : $columnIndex
@@ -21762,38 +21883,6 @@ function getCheckboxRangeRows($xeTable, evnt, params, targetTrElem, trRect, offs
         this.handleSelected(params, evnt);
       });
     },
-    /**
-     * 表头单元格按下事件
-     */
-    triggerHeaderCellMousedownEvent(evnt, params) {
-      const {
-        mouseConfig,
-        mouseOpts
-      } = this;
-      if (mouseConfig && mouseOpts.area && this.handleHeaderCellAreaEvent) {
-        const cell = evnt.currentTarget;
-        const triggerSort = getEventTargetNode(evnt, cell, 'vxe-cell--sort').flag;
-        const triggerFilter = getEventTargetNode(evnt, cell, 'vxe-cell--filter').flag;
-        this.handleHeaderCellAreaEvent(evnt, Object.assign({
-          cell,
-          triggerSort,
-          triggerFilter
-        }, params));
-      }
-      this.focus();
-      this.closeMenu();
-    },
-    /**
-     * 单元格按下事件
-     */
-    triggerCellMousedownEvent(evnt, params) {
-      const cell = evnt.currentTarget;
-      params.cell = cell;
-      this.handleCellMousedownEvent(evnt, params);
-      this.focus();
-      this.closeFilter();
-      this.closeMenu();
-    },
     handleCellMousedownEvent(evnt, params) {
       const {
         editConfig,
@@ -24034,7 +24123,7 @@ function handleUupdateResize(_vm) {
       if (this.editRules && !this._validate) {
         errLog('vxe.error.reqModule', ['Validator']);
       }
-      if ((this.checkboxOpts.range || this.keyboardConfig || this.mouseConfig) && !this.triggerCellMousedownEvent) {
+      if ((this.checkboxOpts.range || this.keyboardConfig || this.mouseConfig) && !this.handleCellMousedownEvent) {
         errLog('vxe.error.reqModule', ['Keyboard']);
       }
       if ((this.printConfig || this.importConfig || this.exportConfig) && !this._exportData) {
@@ -24212,6 +24301,7 @@ function handleUupdateResize(_vm) {
     const virtualScrollBars = $xeTable.computeVirtualScrollBars;
     const isArea = mouseConfig && mouseOpts.area;
     const tableStyle = $xeTable.computeTableStyle;
+    const columnDragOpts = $xeTable.computeColumnDragOpts;
     return h('div', {
       ref: 'refElem',
       class: ['vxe-table', 'vxe-table--render-default', `tid_${tId}`, vSize ? `size--${vSize}` : '', `border--${tableBorder}`, {
@@ -24227,6 +24317,7 @@ function handleUupdateResize(_vm) {
         'column--highlight': columnOpts.isHover || highlightHoverColumn,
         'checkbox--range': checkboxOpts.range,
         'column--calc': isCalcColumn,
+        'col--drag-cell': columnOpts.drag && columnDragOpts.trigger === 'cell',
         'is--header': showHeader,
         'is--footer': showFooter,
         'is--group': isGroup,