vxe-table 3.21.0-beta.12 → 3.21.0-beta.13

package/lib/table/src/methods.js

@@ -771,11 +771,11 @@ if(transform){return handleVirtualTreeExpand($xeTable,rows,expanded);}else{retur
      */triggerScrollXEvent(){const $xeTable=this;const virtualXOpts=$xeTable.computeVirtualXOpts;if(virtualXOpts.immediate){loadScrollXData($xeTable);}else{lazyScrollXData($xeTable);}},/**
      * 纵向 Y 可视渲染事件处理
      */triggerScrollYEvent(){const $xeTable=this;const virtualYOpts=$xeTable.computeVirtualYOpts;if(virtualYOpts.immediate){loadScrollYData($xeTable);}else{lazyScrollYData($xeTable);}},triggerBodyScrollEvent(evnt,fixedType){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollYLoad,scrollXLoad}=reactData;const{elemStore,intoRunScroll,lastScrollTop,lastScrollLeft,inWheelScroll,inVirtualScroll,inHeaderScroll,inBodyScroll,scrollRenderType,inFooterScroll}=internalData;if(inWheelScroll||inVirtualScroll||inHeaderScroll||inFooterScroll){return;}const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const leftScrollElem=(0,_util.getRefElem)(elemStore['left-body-scroll']);const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const rightScrollElem=(0,_util.getRefElem)(elemStore['right-body-scroll']);const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);const rowExpandEl=$xeTable.$refs.refRowExpandElem;if(intoRunScroll){return;}if(!bodyScrollElem){return;}if(!xHandleEl){return;}if(!yHandleEl){return;}if(inBodyScroll){if(scrollRenderType!==fixedType){return;}}let scrollTop=yHandleEl.scrollTop;let scrollLeft=xHandleEl.scrollLeft;if(leftScrollElem&&fixedType==='left'){scrollTop=leftScrollElem.scrollTop;}else if(rightScrollElem&&fixedType==='right'){scrollTop=rightScrollElem.scrollTop;}else{scrollTop=bodyScrollElem.scrollTop;scrollLeft=bodyScrollElem.scrollLeft;}const isRollX=scrollLeft!==lastScrollLeft;const isRollY=scrollTop!==lastScrollTop;internalData.inBodyScroll=true;internalData.scrollRenderType=fixedType;if(isRollY){if(fixedType==='left'){(0,_dom.setScrollTop)(bodyScrollElem,scrollTop);(0,_dom.setScrollTop)(rightScrollElem,scrollTop);}else if(fixedType==='right'){(0,_dom.setScrollTop)(bodyScrollElem,scrollTop);(0,_dom.setScrollTop)(leftScrollElem,scrollTop);}else{(0,_dom.setScrollTop)(leftScrollElem,scrollTop);(0,_dom.setScrollTop)(rightScrollElem,scrollTop);}(0,_dom.setScrollTop)(yHandleEl,scrollTop);(0,_dom.setScrollTop)(rowExpandEl,scrollTop);syncGanttScrollTop($xeTable,scrollTop);if(scrollYLoad){$xeTable.triggerScrollYEvent(evnt);}}if(isRollX){(0,_dom.setScrollLeft)(xHandleEl,scrollLeft);(0,_dom.setScrollLeft)(headerScrollElem,scrollLeft);(0,_dom.setScrollLeft)(footerScrollElem,scrollLeft);if(scrollXLoad){$xeTable.triggerScrollXEvent(evnt);}}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,scrollTop,scrollLeft,{type:'body',fixed:fixedType});},triggerHeaderScrollEvent(evnt,fixedType){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollXLoad}=reactData;const{elemStore,intoRunScroll,inWheelScroll,inVirtualScroll,inBodyScroll,inFooterScroll}=internalData;if(inWheelScroll||inVirtualScroll||inBodyScroll||inFooterScroll){return;}if(intoRunScroll){return;}const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);if(!headerScrollElem){return;}if(!xHandleEl){return;}if(!yHandleEl){return;}const scrollTop=yHandleEl.scrollTop;const scrollLeft=headerScrollElem.scrollLeft;const isRollX=true;const isRollY=false;internalData.inHeaderScroll=true;(0,_dom.setScrollLeft)(xHandleEl,scrollLeft);(0,_dom.setScrollLeft)(footerScrollElem,scrollLeft);(0,_dom.setScrollLeft)(bodyScrollElem,scrollLeft);if(scrollXLoad){$xeTable.triggerScrollXEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,scrollTop,scrollLeft,{type:'header',fixed:fixedType});},triggerFooterScrollEvent(evnt,fixedType){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollXLoad}=reactData;const{elemStore,intoRunScroll,inWheelScroll,inVirtualScroll,inHeaderScroll,inBodyScroll}=internalData;if(inWheelScroll||inVirtualScroll||inHeaderScroll||inBodyScroll){return;}const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);if(intoRunScroll){return;}if(!footerScrollElem){return;}if(!xHandleEl){return;}if(!yHandleEl){return;}const scrollTop=yHandleEl.scrollTop;const scrollLeft=footerScrollElem.scrollLeft;const isRollX=true;const isRollY=false;internalData.inFooterScroll=true;(0,_dom.setScrollLeft)(xHandleEl,scrollLeft);(0,_dom.setScrollLeft)(headerScrollElem,scrollLeft);(0,_dom.setScrollLeft)(bodyScrollElem,scrollLeft);if(scrollXLoad){$xeTable.triggerScrollXEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,scrollTop,scrollLeft,{type:'footer',fixed:fixedType});},triggerBodyWheelEvent(evnt){const $xeTable=this;const $xeParentTable=$xeTable.$xeParentTable;const tableProps=$xeTable;const reactData=$xeTable;const internalData=$xeTable;const{target,deltaY,deltaX,shiftKey}=evnt;if(target&&/^textarea$/i.test(target.tagName)){return;}// 如果滚轮未移动或者触摸板未变化位置
-if(!deltaY&&!deltaX){return;}const{highlightHoverRow}=tableProps;const{scrollXLoad,scrollYLoad,expandColumn}=reactData;const leftFixedWidth=$xeTable.computeLeftFixedWidth;const rightFixedWidth=$xeTable.computeRightFixedWidth;const{elemStore,lastScrollTop,lastScrollLeft}=internalData;const rowOpts=$xeTable.computeRowOpts;const scrollbarXOpts=$xeTable.computeScrollbarXOpts;const scrollbarYOpts=$xeTable.computeScrollbarYOpts;const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const leftScrollElem=(0,_util.getRefElem)(elemStore['left-body-scroll']);const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);const rightScrollElem=(0,_util.getRefElem)(elemStore['right-body-scroll']);const rowExpandEl=$xeTable.$refs.refRowExpandElem;if(!bodyScrollElem){return;}const wheelSpeed=getWheelSpeed(internalData.lastSTime);const deltaTop=shiftKey?0:deltaY*wheelSpeed;const deltaLeft=(shiftKey?deltaX||deltaY:deltaX)*wheelSpeed;const currScrollTop=bodyScrollElem.scrollTop;const currScrollLeft=bodyScrollElem.scrollLeft;const scrollTop=Math.max(0,currScrollTop+deltaTop);const scrollLeft=Math.max(0,currScrollLeft+deltaLeft);const isRollX=scrollLeft!==lastScrollLeft&&bodyScrollElem.scrollWidth>bodyScrollElem.clientWidth;const isRollY=scrollTop!==lastScrollTop&&bodyScrollElem.scrollHeight>bodyScrollElem.clientHeight;if(isRollX){// 如果禁用滚动
+if(!deltaY&&!deltaX){return;}const{highlightHoverRow}=tableProps;const{scrollXLoad,scrollYLoad,expandColumn}=reactData;const{elemStore,lastScrollTop,lastScrollLeft}=internalData;const rowOpts=$xeTable.computeRowOpts;const scrollbarXOpts=$xeTable.computeScrollbarXOpts;const scrollbarYOpts=$xeTable.computeScrollbarYOpts;const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const leftScrollElem=(0,_util.getRefElem)(elemStore['left-body-scroll']);const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);const rightScrollElem=(0,_util.getRefElem)(elemStore['right-body-scroll']);const rowExpandEl=$xeTable.$refs.refRowExpandElem;if(!bodyScrollElem){return;}const wheelSpeed=getWheelSpeed(internalData.lastSTime);const deltaTop=shiftKey?0:deltaY*wheelSpeed;const deltaLeft=(shiftKey?deltaX||deltaY:deltaX)*wheelSpeed;const currScrollTop=bodyScrollElem.scrollTop;const currScrollLeft=bodyScrollElem.scrollLeft;const scrollTop=Math.max(0,currScrollTop+deltaTop);const scrollLeft=Math.max(0,currScrollLeft+deltaLeft);const isRollX=scrollLeft!==lastScrollLeft&&bodyScrollElem.scrollWidth>bodyScrollElem.clientWidth;const isRollY=scrollTop!==lastScrollTop&&bodyScrollElem.scrollHeight>bodyScrollElem.clientHeight;if(isRollX){// 如果禁用滚动
 if(scrollbarXOpts.visible==='hidden'){evnt.preventDefault();return;}}if(isRollY){// 如果禁用滚动
 if(scrollbarYOpts.visible==='hidden'){evnt.preventDefault();return;}const isTopWheel=deltaTop<0;// 如果滚动位置已经是顶部或底部，则不需要触发
 if(isTopWheel?currScrollTop<=0:currScrollTop>=bodyScrollElem.scrollHeight-bodyScrollElem.clientHeight){return;}}// 展开行处理，如果展开行嵌入表格中
-if($xeParentTable){if(isRollY){if((0,_dom.checkTargetElement)(evnt.target,[leftScrollElem,bodyScrollElem,rightScrollElem],evnt.currentTarget)){evnt.stopPropagation();return;}}if(isRollX){if((0,_dom.checkTargetElement)(evnt.target,[headerScrollElem,bodyScrollElem,footerScrollElem],evnt.currentTarget)){evnt.stopPropagation();return;}}}if(!(leftFixedWidth||rightFixedWidth||expandColumn)){return;}if(rowOpts.isHover||highlightHoverRow){$xeTable.clearHoverRow();}// 用于鼠标纵向滚轮处理
+if($xeParentTable){if(isRollY){if((0,_dom.checkTargetElement)(evnt.target,[leftScrollElem,bodyScrollElem,rightScrollElem],evnt.currentTarget)){evnt.stopPropagation();return;}}if(isRollX){if((0,_dom.checkTargetElement)(evnt.target,[headerScrollElem,bodyScrollElem,footerScrollElem],evnt.currentTarget)){evnt.stopPropagation();return;}}}if(!expandColumn){return;}if(rowOpts.isHover||highlightHoverRow){$xeTable.clearHoverRow();}// 用于鼠标纵向滚轮处理
 if(isRollX){evnt.preventDefault();internalData.inWheelScroll=true;(0,_dom.wheelScrollLeftTo)(scrollLeft,offsetLeft=>{const currLeftNum=offsetLeft;(0,_dom.setScrollLeft)(xHandleEl,currLeftNum);(0,_dom.setScrollLeft)(bodyScrollElem,currLeftNum);(0,_dom.setScrollLeft)(headerScrollElem,currLeftNum);(0,_dom.setScrollLeft)(footerScrollElem,currLeftNum);if(scrollXLoad){$xeTable.triggerScrollXEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,bodyScrollElem.scrollTop,currLeftNum,{type:'table',fixed:''});});}if(isRollY){evnt.preventDefault();(0,_dom.wheelScrollTopTo)(scrollTop,offsetTop=>{const currTopNum=offsetTop;internalData.inWheelScroll=true;(0,_dom.setScrollTop)(yHandleEl,currTopNum);(0,_dom.setScrollTop)(bodyScrollElem,currTopNum);(0,_dom.setScrollTop)(leftScrollElem,currTopNum);(0,_dom.setScrollTop)(rightScrollElem,currTopNum);(0,_dom.setScrollTop)(rowExpandEl,currTopNum);syncGanttScrollTop($xeTable,currTopNum);if(scrollYLoad){$xeTable.triggerScrollYEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,currTopNum,bodyScrollElem.scrollLeft,{type:'table',fixed:''});});}},triggerVirtualScrollXEvent(evnt){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollXLoad}=reactData;const{elemStore,inWheelScroll,lastScrollTop,inHeaderScroll,inBodyScroll,inFooterScroll}=internalData;if(inHeaderScroll||inBodyScroll||inFooterScroll){return;}if(inWheelScroll){return;}const headerScrollElem=(0,_util.getRefElem)(elemStore['main-header-scroll']);const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const footerScrollElem=(0,_util.getRefElem)(elemStore['main-footer-scroll']);const yHandleEl=$xeTable.$refs.refScrollYHandleElem;const wrapperEl=evnt.currentTarget;const{scrollLeft}=wrapperEl;const yBodyEl=yHandleEl||bodyScrollElem;let scrollTop=0;if(yBodyEl){scrollTop=yBodyEl.scrollTop;}const isRollX=true;const isRollY=scrollTop!==lastScrollTop;internalData.inVirtualScroll=true;(0,_dom.setScrollLeft)(bodyScrollElem,scrollLeft);(0,_dom.setScrollLeft)(headerScrollElem,scrollLeft);(0,_dom.setScrollLeft)(footerScrollElem,scrollLeft);if(scrollXLoad){$xeTable.triggerScrollXEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,scrollTop,scrollLeft,{type:'table',fixed:''});},triggerVirtualScrollYEvent(evnt){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollYLoad}=reactData;const{elemStore,inWheelScroll,lastScrollLeft,inHeaderScroll,inBodyScroll,inFooterScroll}=internalData;if(inHeaderScroll||inBodyScroll||inFooterScroll){return;}if(inWheelScroll){return;}const leftScrollElem=(0,_util.getRefElem)(elemStore['left-body-scroll']);const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const rightScrollElem=(0,_util.getRefElem)(elemStore['right-body-scroll']);const rowExpandEl=$xeTable.$refs.refRowExpandElem;const xHandleEl=$xeTable.$refs.refScrollXHandleElem;const wrapperEl=evnt.currentTarget;const{scrollTop}=wrapperEl;const xBodyEl=xHandleEl||bodyScrollElem;let scrollLeft=0;if(xBodyEl){scrollLeft=xBodyEl.scrollLeft;}const isRollX=scrollLeft!==lastScrollLeft;const isRollY=true;internalData.inVirtualScroll=true;(0,_dom.setScrollTop)(bodyScrollElem,scrollTop);(0,_dom.setScrollTop)(leftScrollElem,scrollTop);(0,_dom.setScrollTop)(rightScrollElem,scrollTop);(0,_dom.setScrollTop)(rowExpandEl,scrollTop);syncGanttScrollTop($xeTable,scrollTop);if(scrollYLoad){$xeTable.triggerScrollYEvent(evnt);}$xeTable.handleScrollEvent(evnt,isRollY,isRollX,scrollTop,scrollLeft,{type:'table',fixed:''});},updateScrollXData(){const $xeTable=this;const reactData=$xeTable;const{isAllOverflow}=reactData;handleTableColumn($xeTable);$xeTable.updateScrollXSpace();return $xeTable.$nextTick().then(()=>{handleTableColumn($xeTable);$xeTable.updateScrollXSpace();if(!isAllOverflow){$xeTable.updateScrollYSpace();}});},// 更新横向 X 可视渲染上下剩余空间大小
 updateScrollXSpace(){const $xeTable=this;const reactData=$xeTable;const internalData=$xeTable;const{scrollXLoad,overflowX,scrollXWidth}=reactData;const{visibleColumn,scrollXStore,elemStore,fullColumnIdData}=internalData;const $xeGanttView=internalData.xeGanttView;const mouseOpts=$xeTable.computeMouseOpts;const tableBody=$xeTable.$refs.refTableBody;const tableBodyElem=tableBody?tableBody.$el:null;if(tableBodyElem){const bodyScrollElem=(0,_util.getRefElem)(elemStore['main-body-scroll']);const bodyTableElem=(0,_util.getRefElem)(elemStore['main-body-table']);const headerTableElem=(0,_util.getRefElem)(elemStore['main-header-table']);const footerTableElem=(0,_util.getRefElem)(elemStore['main-footer-table']);let xSpaceLeft=0;const firstColumn=visibleColumn[scrollXStore.startIndex];if(firstColumn){const colRest=fullColumnIdData[firstColumn.id]||{};xSpaceLeft=colRest.oLeft;}let clientWidth=0;if(bodyScrollElem){clientWidth=bodyScrollElem.clientWidth;}// 虚拟渲染
 let isScrollXBig=false;let ySpaceWidth=scrollXWidth;if(scrollXWidth>maxXWidth){// 触右