vxe-table 4.18.0-beta.1 → 4.18.0-beta.2

package/lib/index.umd.js

@@ -3144,7 +3144,7 @@ function getDefaultConfig(val1, def1) {
 ;// ./packages/ui/index.ts
 
 
-const version = "4.18.0-beta.1";
+const version = "4.18.0-beta.2";
 core_.VxeUI.version = version;
 core_.VxeUI.tableVersion = version;
 core_.VxeUI.setConfig({
@@ -3662,7 +3662,7 @@ var esnext_iterator_some = __webpack_require__(7550);
 const {
   log: log_log
 } = core_.VxeUI;
-const log_version = `table v${"4.18.0-beta.1"}`;
+const log_version = `table v${"4.18.0-beta.2"}`;
 const warnLog = log_log.create('warn', log_version);
 const errLog = log_log.create('error', log_version);
 ;// ./packages/table/src/columnInfo.ts
@@ -9243,14 +9243,10 @@ const footer_renderType = 'footer';
           };
         }
         tfOns.onClick = evnt => {
-          $xeTable.dispatchEvent('footer-cell-click', Object.assign({
-            cell: evnt.currentTarget
-          }, cellParams), evnt);
+          $xeTable.triggerFooterCellClickEvent(evnt, cellParams);
         };
         tfOns.onDblclick = evnt => {
-          $xeTable.dispatchEvent('footer-cell-dblclick', Object.assign({
-            cell: evnt.currentTarget
-          }, cellParams), evnt);
+          $xeTable.triggerFooterCellDblclickEvent(evnt, cellParams);
         };
         let isMergeCell = false;
         // 合并行或列
@@ -11879,6 +11875,7 @@ const {
   hooks: hook_hooks
 } = core_.VxeUI;
 const tableFilterMethodKeys = ['openFilter', 'setFilter', 'clearFilter', 'saveFilter', 'saveFilterByEvent', 'saveFilterPanel', 'saveFilterPanelByEvent', 'resetFilter', 'resetFilterByEvent', 'resetFilterPanel', 'resetFilterPanelByEvent', 'getCheckedFilters', 'updateFilterOptionStatus'];
+const hook_sourceType = 'table';
 hook_hooks.add('tableFilterModule', {
   setupTable($xeTable) {
     const $xeGrid = $xeTable.xeGrid;
@@ -11911,16 +11908,7 @@ hook_hooks.add('tableFilterModule', {
           filterStore.isIndeterminate = !filterStore.isAllSelected && filterOptions.some(item => item._checked);
         }
       },
-      /**
-       * 点击筛选事件
-       * 当筛选图标被点击时触发
-       * 更新选项是否全部状态
-       * 打开筛选面板
-       * @param {Event} evnt 事件
-       * @param {ColumnInfo} column 列配置
-       * @param {Object} params 参数
-       */
-      triggerFilterEvent(evnt, column, params) {
+      handleOpenFilterColumn(evnt, btnEl, colEl, column, params) {
         const {
           initStore,
           filterStore
@@ -11942,8 +11930,8 @@ hook_hooks.add('tableFilterModule', {
           const {
             transfer
           } = filterOpts;
+          const currEl = btnEl || colEl;
           const tableRect = tableEl.getBoundingClientRect();
-          const btnElem = evnt.currentTarget;
           const filterRender = column ? column.filterRender : null;
           const compConf = filterRender && isEnableConf(filterRender) ? hook_renderer.get(filterRender.name) : null;
           $xeTable.handleFilterOptions(column);
@@ -11961,17 +11949,21 @@ hook_hooks.add('tableFilterModule', {
             if (!filterWrapperElem) {
               return;
             }
-            const btnRect = btnElem.getBoundingClientRect();
+            const btnRect = currEl.getBoundingClientRect();
             const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
             const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
             const filterWidth = filterWrapperElem.offsetWidth;
-            const centerWidth = filterWidth / 2;
+            const centerWidth = btnEl ? filterWidth / 2 : (filterWidth - column.renderWidth) / 2;
             let left = 0;
             let top = 0;
             let maxHeight = 0;
+            /**
+             * 是否显示筛选按钮图标
+             * 如果不存在图标，则相对单元格居中显示
+             */
             if (transfer) {
               left = btnRect.left - centerWidth + scrollLeft;
-              top = btnRect.top + btnElem.clientHeight + scrollTop;
+              top = btnRect.top + currEl.clientHeight + scrollTop;
               maxHeight = Math.min(Math.max(tableRect.height, Math.floor(visibleHeight / 2)), Math.max(80, visibleHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 28));
               if (left < 16) {
                 left = 16;
@@ -11980,7 +11972,7 @@ hook_hooks.add('tableFilterModule', {
               }
             } else {
               left = btnRect.left - tableRect.left - centerWidth;
-              top = btnRect.top - tableRect.top + btnElem.clientHeight;
+              top = btnRect.top - tableRect.top + currEl.clientHeight;
               maxHeight = Math.max(40, tableEl.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
               if (left < 1) {
                 left = 1;
@@ -12015,6 +12007,27 @@ hook_hooks.add('tableFilterModule', {
           visible: filterStore.visible
         }, evnt);
       },
+      /**
+       * 点击筛选事件
+       * 当筛选图标被点击时触发
+       * 更新选项是否全部状态
+       * 打开筛选面板
+       * @param {Event} evnt 事件
+       * @param {ColumnInfo} column 列配置
+       * @param {Object} params 参数
+       */
+      triggerFilterEvent(evnt, column, params) {
+        const {
+          elemStore
+        } = internalData;
+        const {
+          fixed
+        } = column;
+        const headerWrapperElem = getRefElem(elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
+        const btnElem = evnt.currentTarget;
+        const colEl = headerWrapperElem ? headerWrapperElem.querySelector(`.vxe-header--column.${column.id}`) : null;
+        $xeTable.handleOpenFilterColumn(evnt, btnElem, colEl || btnElem, column, params);
+      },
       handleClearFilter(column) {
         if (column) {
           const {
@@ -12204,13 +12217,41 @@ hook_hooks.add('tableFilterModule', {
             elemStore
           } = internalData;
           const {
-            fixed
+            fixed,
+            filters
           } = column;
           return $xeTable.scrollToColumn(column).then(() => {
             const headerWrapperElem = getRefElem(elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
             if (headerWrapperElem) {
               const filterBtnElem = headerWrapperElem.querySelector(`.vxe-header--column.${column.id} .vxe-cell--filter`);
-              triggerEvent(filterBtnElem, 'click');
+              if (filterBtnElem) {
+                triggerEvent(filterBtnElem, 'click');
+              } else {
+                const colEl = headerWrapperElem.querySelector(`.vxe-header--column.${column.id}`);
+                if (colEl) {
+                  let firstFilterOption = null;
+                  if (filters) {
+                    firstFilterOption = filters[0];
+                  }
+                  const params = {
+                    $table: $xeTable,
+                    $grid: $xeGrid,
+                    $gantt: $xeGantt,
+                    $rowIndex: -1,
+                    column,
+                    columnIndex: $xeTable.getColumnIndex(column),
+                    $columnIndex: $xeTable.getVMColumnIndex(column),
+                    _columnIndex: $xeTable.getVTColumnIndex(column),
+                    firstFilterOption: firstFilterOption,
+                    fixed,
+                    source: hook_sourceType,
+                    type: 'header'
+                    // isHidden
+                    // hasFilter
+                  };
+                  $xeTable.handleOpenFilterColumn(new Event('click'), null, colEl, column, params);
+                }
+              }
             }
           });
         }
@@ -20073,7 +20114,7 @@ if(column.editRender&&isEnableConf(editConfig)){// 如果是行编辑模式
 if(editOpts.mode==='row'&&actived.row===row){return;}// 如果是单元格编辑模式
 if(actived.row===row&&actived.column===column){return;}}if(tooltipStore.column!==column||tooltipStore.row!==row||!tooltipStore.visible){const ctEl=tdEl.querySelector('.vxe-cell--wrapper');let ovEl=null;let tipEl=tdEl.querySelector(column.type==='html'?'.vxe-cell--html':'.vxe-cell--label');if(column.treeNode){ovEl=tdEl.querySelector('.vxe-tree-cell');}if(!tipEl){tipEl=ctEl;}handleTooltip(evnt,tooltipOpts,'body',tdEl,ovEl||ctEl,tipEl,params);}},/**
              * 触发表尾 tooltip 事件
-             */triggerFooterTooltipEvent(evnt,params){const{column}=params;const{tooltipStore}=reactData;const footerTooltipOpts=computeFooterTooltipOpts.value;const tdEl=evnt.currentTarget;handleTargetEnterEvent(tooltipStore.column!==column||!!tooltipStore.row);if(tooltipStore.column!==column||!tooltipStore.visible){const ctEl=tdEl.querySelector('.vxe-cell--wrapper');let ovEl=null;let tipEl=tdEl.querySelector(column.type==='html'?'.vxe-cell--html':'.vxe-cell--label');if(column.type==='html'){ovEl=tdEl.querySelector('.vxe-cell--html');}if(!tipEl){tipEl=ctEl;}handleTooltip(evnt,footerTooltipOpts,'footer',tdEl,ovEl||ctEl,tipEl,params);}},handleTargetLeaveEvent(){const tooltipOpts=computeTooltipOpts.value;let $tooltip=refTooltip.value;if($tooltip&&$tooltip.setActived){$tooltip.setActived(false);}if(tooltipOpts.enterable){internalData.tooltipTimeout=setTimeout(()=>{$tooltip=refTooltip.value;if($tooltip&&$tooltip.isActived&&!$tooltip.isActived()){$xeTable.closeTooltip();}},tooltipOpts.leaveDelay);}else{$xeTable.closeTooltip();}},triggerHeaderCellClickEvent(evnt,params){const{_lastResizeTime}=internalData;const sortOpts=computeSortOpts.value;const columnOpts=computeColumnOpts.value;const currentColumnOpts=computeCurrentColumnOpts.value;const{column}=params;const cell=evnt.currentTarget;const triggerResizable=_lastResizeTime&&_lastResizeTime>Date.now()-300;const triggerSort=getEventTargetNode(evnt,cell,'vxe-cell--sort').flag;const triggerFilter=getEventTargetNode(evnt,cell,'vxe-cell--filter').flag;if(sortOpts.trigger==='cell'&&!(triggerResizable||triggerSort||triggerFilter)){$xeTable.triggerSortEvent(evnt,column,getNextSortOrder(column));}dispatchEvent('header-cell-click',Object.assign({triggerResizable,triggerSort,triggerFilter,cell},params),evnt);if((columnOpts.isCurrent||props.highlightCurrentColumn)&&(!currentColumnOpts.trigger||['header','default'].includes(currentColumnOpts.trigger))){$xeTable.triggerCurrentColumnEvent(evnt,params);}},triggerHeaderCellDblclickEvent(evnt,params){dispatchEvent('header-cell-dblclick',Object.assign({cell:evnt.currentTarget},params),evnt);},/**
+             */triggerFooterTooltipEvent(evnt,params){const{column}=params;const{tooltipStore}=reactData;const footerTooltipOpts=computeFooterTooltipOpts.value;const tdEl=evnt.currentTarget;handleTargetEnterEvent(tooltipStore.column!==column||!!tooltipStore.row);if(tooltipStore.column!==column||!tooltipStore.visible){const ctEl=tdEl.querySelector('.vxe-cell--wrapper');let ovEl=null;let tipEl=tdEl.querySelector(column.type==='html'?'.vxe-cell--html':'.vxe-cell--label');if(column.type==='html'){ovEl=tdEl.querySelector('.vxe-cell--html');}if(!tipEl){tipEl=ctEl;}handleTooltip(evnt,footerTooltipOpts,'footer',tdEl,ovEl||ctEl,tipEl,params);}},handleTargetLeaveEvent(){const tooltipOpts=computeTooltipOpts.value;let $tooltip=refTooltip.value;if($tooltip&&$tooltip.setActived){$tooltip.setActived(false);}if(tooltipOpts.enterable){internalData.tooltipTimeout=setTimeout(()=>{$tooltip=refTooltip.value;if($tooltip&&$tooltip.isActived&&!$tooltip.isActived()){$xeTable.closeTooltip();}},tooltipOpts.leaveDelay);}else{$xeTable.closeTooltip();}},triggerHeaderCellClickEvent(evnt,params){const{_lastResizeTime}=internalData;const sortOpts=computeSortOpts.value;const columnOpts=computeColumnOpts.value;const currentColumnOpts=computeCurrentColumnOpts.value;const{column}=params;const cell=evnt.currentTarget;const triggerResizable=_lastResizeTime&&_lastResizeTime>Date.now()-300;const triggerSort=getEventTargetNode(evnt,cell,'vxe-cell--sort').flag;const triggerFilter=getEventTargetNode(evnt,cell,'vxe-cell--filter').flag;if(sortOpts.trigger==='cell'&&!(triggerResizable||triggerSort||triggerFilter)){$xeTable.triggerSortEvent(evnt,column,getNextSortOrder(column));}if($xeGantt){const ganttReactData=$xeGantt.reactData;ganttReactData.activeBarRowid=null;}dispatchEvent('header-cell-click',Object.assign({triggerResizable,triggerSort,triggerFilter,cell},params),evnt);if((columnOpts.isCurrent||props.highlightCurrentColumn)&&(!currentColumnOpts.trigger||['header','default'].includes(currentColumnOpts.trigger))){$xeTable.triggerCurrentColumnEvent(evnt,params);}},triggerHeaderCellDblclickEvent(evnt,params){dispatchEvent('header-cell-dblclick',Object.assign({cell:evnt.currentTarget},params),evnt);},/**
              * 列点击事件
              * 如果是单击模式，则激活为编辑状态
              * 如果是双击模式，则单击后选中状态
@@ -20088,10 +20129,10 @@ if(!triggerRadio&&(radioColumn&&radioOpts.trigger==='row'||isRadioType&&radioOpt
 if(!triggerCheckbox&&(checkboxColumn&&checkboxOpts.trigger==='row'||isCheckboxType&&checkboxOpts.trigger==='cell')){$xeTable.handleToggleCheckRowEvent(evnt,params);}}// 如果设置了单元格选中功能，则不会使用点击事件去处理（只能支持双击模式）
 if(isEnableConf(editConfig)){// 记录点击输入框聚焦状态
 if(keyboardOpts.arrowCursorLock&&evnt&&editOpts.mode==='cell'&&evnt.target&&/^input|textarea$/i.test(evnt.target.tagName)){focused.column=column;focused.row=row;}if(editOpts.trigger==='manual'){if(actived.args&&actived.row===row&&column!==actived.column){handleChangeCell(evnt,params);}}else if(!actived.args||row!==actived.row||column!==actived.column){if(editOpts.trigger==='click'){handleChangeCell(evnt,params);}else if(editOpts.trigger==='dblclick'){if(editOpts.mode==='row'&&actived.row===row){handleChangeCell(evnt,params);}}}}}// 如果是双击编辑模式
-if(isEnableConf(editConfig)&&editOpts.trigger==='dblclick'){if(actived.row&&actived.column){if(editOpts.mode==='row'){if(!$xeTable.eqRow(actived.row,row)){$xeTable.handleClearEdit(evnt);}}else if(editOpts.mode==='cell'){if(!$xeTable.eqRow(actived.row,row)||actived.column.id!==column.id){$xeTable.handleClearEdit(evnt);}}}}dispatchEvent('cell-click',params,evnt);},/**
+if(isEnableConf(editConfig)&&editOpts.trigger==='dblclick'){if(actived.row&&actived.column){if(editOpts.mode==='row'){if(!$xeTable.eqRow(actived.row,row)){$xeTable.handleClearEdit(evnt);}}else if(editOpts.mode==='cell'){if(!$xeTable.eqRow(actived.row,row)||actived.column.id!==column.id){$xeTable.handleClearEdit(evnt);}}}}if($xeGantt){const ganttReactData=$xeGantt.reactData;ganttReactData.activeBarRowid=null;}dispatchEvent('cell-click',params,evnt);},/**
              * 列双击点击事件
              * 如果是双击模式，则激活为编辑状态
-             */triggerCellDblclickEvent(evnt,params){const{editConfig}=props;const{editStore,isDragResize}=reactData;if(isDragResize){return;}const editOpts=computeEditOpts.value;const{actived}=editStore;const cell=evnt.currentTarget;params=Object.assign({cell},params);if(isEnableConf(editConfig)&&editOpts.trigger==='dblclick'){if(!actived.args||evnt.currentTarget!==actived.args.cell){if(editOpts.mode==='row'){checkValidate('blur').catch(e=>e).then(()=>{$xeTable.handleEdit(params,evnt).then(()=>checkValidate('change')).catch(e=>e);});}else if(editOpts.mode==='cell'){$xeTable.handleEdit(params,evnt).then(()=>checkValidate('change')).catch(e=>e);}}}dispatchEvent('cell-dblclick',params,evnt);},handleToggleCheckRowEvent(evnt,params){const{selectCheckboxMaps}=internalData;const checkboxOpts=computeCheckboxOpts.value;const{checkField,trigger}=checkboxOpts;const{row}=params;if(trigger==='manual'){return;}let checked=false;if(checkField){checked=!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row,checkField);}else{checked=!selectCheckboxMaps[getRowid($xeTable,row)];}if(evnt){$xeTable.triggerCheckRowEvent(evnt,params,checked);}else{$xeTable.handleBatchSelectRows([row],checked);$xeTable.checkSelectionStatus();}},triggerCheckRowEvent(evnt,params,checked){const{treeConfig}=props;const{row}=params;const{isRowGroupStatus}=reactData;const{afterFullData}=internalData;const checkboxOpts=computeCheckboxOpts.value;const{checkMethod,trigger}=checkboxOpts;if(trigger==='manual'){return;}evnt.stopPropagation();if(checkboxOpts.isShiftKey&&evnt.shiftKey&&!(treeConfig||isRowGroupStatus)){const checkboxRecords=$xeTable.getCheckboxRecords();if(checkboxRecords.length){const firstRow=checkboxRecords[0];const _rowIndex=$xeTable.getVTRowIndex(row);const _firstRowIndex=$xeTable.getVTRowIndex(firstRow);if(_rowIndex!==_firstRowIndex){$xeTable.setAllCheckboxRow(false);const rangeRows=_rowIndex<_firstRowIndex?afterFullData.slice(_rowIndex,_firstRowIndex+1):afterFullData.slice(_firstRowIndex,_rowIndex+1);(0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(()=>{handleCheckedCheckboxRow(rangeRows,true,false);});dispatchEvent('checkbox-range-select',Object.assign({rangeRecords:rangeRows},params),evnt);return;}}}if(isRowGroupStatus||!checkMethod||checkMethod({$table:$xeTable,row})){$xeTable.handleBatchSelectRows([row],checked);$xeTable.checkSelectionStatus();dispatchEvent('checkbox-change',Object.assign({records:()=>$xeTable.getCheckboxRecords(),reserves:()=>$xeTable.getCheckboxReserveRecords(),indeterminates:()=>$xeTable.getCheckboxIndeterminateRecords(),checked},params),evnt);}},/**
+             */triggerCellDblclickEvent(evnt,params){const{editConfig}=props;const{editStore,isDragResize}=reactData;if(isDragResize){return;}const editOpts=computeEditOpts.value;const{actived}=editStore;const cell=evnt.currentTarget;params=Object.assign({cell},params);if(isEnableConf(editConfig)&&editOpts.trigger==='dblclick'){if(!actived.args||evnt.currentTarget!==actived.args.cell){if(editOpts.mode==='row'){checkValidate('blur').catch(e=>e).then(()=>{$xeTable.handleEdit(params,evnt).then(()=>checkValidate('change')).catch(e=>e);});}else if(editOpts.mode==='cell'){$xeTable.handleEdit(params,evnt).then(()=>checkValidate('change')).catch(e=>e);}}}dispatchEvent('cell-dblclick',params,evnt);},triggerFooterCellClickEvent(evnt,params){const cell=evnt.currentTarget;params=Object.assign({cell},params);if($xeGantt){const ganttReactData=$xeGantt.reactData;ganttReactData.activeBarRowid=null;}$xeTable.dispatchEvent('footer-cell-click',params,evnt);},triggerFooterCellDblclickEvent(evnt,params){const cell=evnt.currentTarget;params=Object.assign({cell},params);$xeTable.dispatchEvent('footer-cell-dblclick',params,evnt);},handleToggleCheckRowEvent(evnt,params){const{selectCheckboxMaps}=internalData;const checkboxOpts=computeCheckboxOpts.value;const{checkField,trigger}=checkboxOpts;const{row}=params;if(trigger==='manual'){return;}let checked=false;if(checkField){checked=!external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row,checkField);}else{checked=!selectCheckboxMaps[getRowid($xeTable,row)];}if(evnt){$xeTable.triggerCheckRowEvent(evnt,params,checked);}else{$xeTable.handleBatchSelectRows([row],checked);$xeTable.checkSelectionStatus();}},triggerCheckRowEvent(evnt,params,checked){const{treeConfig}=props;const{row}=params;const{isRowGroupStatus}=reactData;const{afterFullData}=internalData;const checkboxOpts=computeCheckboxOpts.value;const{checkMethod,trigger}=checkboxOpts;if(trigger==='manual'){return;}evnt.stopPropagation();if(checkboxOpts.isShiftKey&&evnt.shiftKey&&!(treeConfig||isRowGroupStatus)){const checkboxRecords=$xeTable.getCheckboxRecords();if(checkboxRecords.length){const firstRow=checkboxRecords[0];const _rowIndex=$xeTable.getVTRowIndex(row);const _firstRowIndex=$xeTable.getVTRowIndex(firstRow);if(_rowIndex!==_firstRowIndex){$xeTable.setAllCheckboxRow(false);const rangeRows=_rowIndex<_firstRowIndex?afterFullData.slice(_rowIndex,_firstRowIndex+1):afterFullData.slice(_firstRowIndex,_rowIndex+1);(0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)(()=>{handleCheckedCheckboxRow(rangeRows,true,false);});dispatchEvent('checkbox-range-select',Object.assign({rangeRecords:rangeRows},params),evnt);return;}}}if(isRowGroupStatus||!checkMethod||checkMethod({$table:$xeTable,row})){$xeTable.handleBatchSelectRows([row],checked);$xeTable.checkSelectionStatus();dispatchEvent('checkbox-change',Object.assign({records:()=>$xeTable.getCheckboxRecords(),reserves:()=>$xeTable.getCheckboxReserveRecords(),indeterminates:()=>$xeTable.getCheckboxIndeterminateRecords(),checked},params),evnt);}},/**
              * 多选，选中所有事件
              */triggerCheckAllEvent(evnt,value){const checkboxOpts=computeCheckboxOpts.value;const{trigger}=checkboxOpts;if(trigger==='manual'){return;}if(evnt){evnt.stopPropagation();}handleCheckAllEvent(evnt,value);},/**
              * 单选，行选中事件
@@ -23192,7 +23233,7 @@ const Toolbar = VxeToolbar;
       allChecked: '全选',
       total: '{0} / {1}',
       search: '搜索',
-      loadingText: '加载中',
+      loadingText: '加载中...',
       emptyText: '暂无数据',
       maxSize: '最大可选择的数量不能超过 {0} 个',
       overSizeErr: '已超出最大可选数量 {0} 个，超出部分将被忽略！',
@@ -23625,6 +23666,9 @@ const Toolbar = VxeToolbar;
         ss: '秒'
       }
     },
+    contextMenu: {
+      loadingText: '加载中...'
+    },
     gantt: {
       tFullFormat: {
         year: '{yyyy}年',