vxe-table 3.15.1 → 3.15.2

package/lib/table/module/filter/mixin.js

@@ -91,6 +91,16 @@ var _default = exports.default = {
           filterStore.visible = false;
         } else {
           const el = $xeTable.$refs.refElem;
+          const {
+            scrollTop,
+            scrollLeft,
+            visibleHeight,
+            visibleWidth
+          } = (0, _dom.getDomNode)();
+          const filterOpts = $xeTable.computeFilterOpts;
+          const {
+            transfer
+          } = filterOpts;
           const tableRect = el.getBoundingClientRect();
           const btnElem = evnt.currentTarget;
           const {
@@ -138,23 +148,37 @@ var _default = exports.default = {
               return;
             }
             const btnRect = btnElem.getBoundingClientRect();
-            const filterWidth = filterWrapperElem.offsetWidth;
             const filterHeadElem = filterWrapperElem.querySelector('.vxe-table--filter-header');
             const filterFootElem = filterWrapperElem.querySelector('.vxe-table--filter-footer');
+            const filterWidth = filterWrapperElem.offsetWidth;
             const centerWidth = filterWidth / 2;
-            let left = btnRect.left - tableRect.left - centerWidth;
-            const top = btnRect.top - tableRect.top + btnElem.clientHeight;
-            // 判断面板不能大于表格高度
-            const maxHeight = Math.max(40, el.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
-            if (left < 1) {
-              left = 1;
-            } else if (left > el.clientWidth - filterWidth - 1) {
-              left = el.clientWidth - filterWidth - 1;
+            let left = 0;
+            let top = 0;
+            let maxHeight = 0;
+            if (transfer) {
+              left = btnRect.left - centerWidth + scrollLeft;
+              top = btnRect.top + btnElem.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;
+              } else if (left > visibleWidth - filterWidth - 16) {
+                left = visibleWidth - filterWidth - 16;
+              }
+            } else {
+              left = btnRect.left - tableRect.left - centerWidth;
+              top = btnRect.top - tableRect.top + btnElem.clientHeight;
+              maxHeight = Math.max(40, el.clientHeight - top - (filterHeadElem ? filterHeadElem.clientHeight : 0) - (filterFootElem ? filterFootElem.clientHeight : 0) - 14);
+              if (left < 1) {
+                left = 1;
+              } else if (left > el.clientWidth - filterWidth - 1) {
+                left = el.clientWidth - filterWidth - 1;
+              }
             }
             filterStore.style = {
               top: (0, _dom.toCssUnit)(top),
               left: (0, _dom.toCssUnit)(left)
             };
+            // 判断面板不能大于表格高度
             filterStore.maxHeight = maxHeight;
           });
         }

package/lib/table/module/filter/mixin.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../../ui"),_util=require("../../src/util"),_dom=require("../../../ui/src/dom"),_utils=require("../../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let renderer=_ui.VxeUI.renderer;var _default=exports.default={methods:{_openFilter(e){let i=(0,_util.handleFieldOrColumn)(this,e);if(i&&i.filters){let t=this.elemStore,l=i.fixed;return this.scrollToColumn(i).then(()=>{var e=t[`${l||"main"}-header-wrapper`]||t["main-header-wrapper"];e&&(e=e.querySelector(`.vxe-header--column.${i.id} .vxe-cell--filter`),(0,_dom.triggerEvent)(e,"click"))})}return this.$nextTick()},_setFilter(e,t,l){e=(0,_util.handleFieldOrColumn)(this,e);return e&&e.filters&&(e.filters=(0,_util.toFilters)(t||[]),l)?this.handleColumnConfirmFilter(e,new Event("click")):this.$nextTick()},checkFilterOptions(){var e=this.filterStore;e.isAllSelected=e.options.every(e=>e._checked),e.isIndeterminate=!e.isAllSelected&&e.options.some(e=>e._checked)},triggerFilterEvent(t,r,l){let u=this;var n=u,d=u;let e=this.filterStore;if(e.column===r&&e.visible)e.visible=!1;else{let{initStore:e,filterStore:c}=n,h=d.elemStore;if(c.column===r&&c.visible)c.visible=!1;else{let s=u.$refs.refElem,o=s.getBoundingClientRect(),a=t.currentTarget;var{filters:n,filterMultiple:f,filterRender:m}=r,m=(0,_utils.isEnableConf)(m)?renderer.get(m.name):null;let i=r.filterRecoverMethod||(m?m.tableFilterRecoverMethod||m.filterRecoverMethod:null);d._currFilterParams=l,Object.assign(c,{multiple:f,options:n,column:r,style:null}),c.options.forEach(e=>{var{_checked:t,checked:l}=e;(e._checked=l)||t===l||i&&i({option:e,column:r,$table:u})}),this.checkFilterOptions(),c.visible=!0,e.filter=!0,u.$nextTick(()=>{if((0,_util.getRefElem)(h["main-header-scroll"])){var t=u.$refs.refTableFilter,t=t?t.$el:null;if(t){var l=a.getBoundingClientRect(),i=t.offsetWidth,r=t.querySelector(".vxe-table--filter-header"),t=t.querySelector(".vxe-table--filter-footer"),n=i/2;let e=l.left-o.left-n;n=l.top-o.top+a.clientHeight,l=Math.max(40,s.clientHeight-n-(r?r.clientHeight:0)-(t?t.clientHeight:0)-14);e<1?e=1:e>s.clientWidth-i-1&&(e=s.clientWidth-i-1),c.style={top:(0,_dom.toCssUnit)(n),left:(0,_dom.toCssUnit)(e)},c.maxHeight=l}}})}u.dispatchEvent("filter-visible",{column:r,field:r.field,property:r.field,filterList:u.getCheckedFilters(),visible:c.visible},t)}},handleFilterConfirmFilter(e){var t=this.filterStore;t.options.forEach(e=>{e.checked=e._checked}),this.confirmFilterEvent(e)},_saveFilterPanel(){return this.handleFilterConfirmFilter(null),this.$nextTick()},_resetFilterPanel(){return this.handleFilterResetFilter(null),this.$nextTick()},_getCheckedFilters(){var e=this.tableFullColumn;let n=[];return e.forEach(e=>{var{field:t,filters:l}=e;let i=[],r=[];l&&l.length&&(l.forEach(e=>{e.checked&&(i.push(e.value),r.push(e.data))}),i.length)&&n.push({column:e,field:t,property:t,values:i,datas:r})}),n},handleColumnConfirmFilter(e,t){let l=this;var i=l.mouseConfig;let{scrollXLoad:r,scrollYLoad:n}=l;var s=l.computeFilterOpts,o=l.computeMouseOpts,a=e.field;let c=[],h=[];e.filters.forEach(e=>{e.checked&&(c.push(e.value),h.push(e.data))});var u=this.getCheckedFilters(),e={$table:this,$event:t,column:e,field:a,property:a,values:c,datas:h,filters:u,filterList:u};return s.remote||(this.handleTableData(!0),this.checkSelectionStatus()),i&&o.area&&this.handleFilterEvent&&l.handleFilterEvent(t,e),t&&l.emitEvent("filter-change",e,t),l.closeFilter(),l.updateFooter().then(()=>{var{scrollXLoad:e,scrollYLoad:t}=this;if(r||e||n||t)return(r||e)&&l.updateScrollXSpace(),(n||t)&&l.updateScrollYSpace(),l.refreshScroll()}).then(()=>(l.updateCellAreas(),l.recalculate(!0))).then(()=>{setTimeout(()=>l.recalculate(),50)})},confirmFilterEvent(e){var t=this.filterStore,t=t.column;this.handleColumnConfirmFilter(t,e)},handleClearFilter(e){if(e){var{filters:l,filterRender:i}=e;if(l){i=(0,_utils.isEnableConf)(i)?renderer.get(i.name):null;let t=e.filterResetMethod||(i?i.tableFilterResetMethod||i.filterResetMethod:null);l.forEach(e=>{e._checked=!1,e.checked=!1,t||(e.data=_xeUtils.default.clone(e.resetValue,!0))}),t&&t({options:l,column:e,$table:this})}}},handleFilterResetFilter(e){this.handleClearFilter(this.filterStore.column),this.confirmFilterEvent(e)},_clearFilter(e){var t=this.filterStore;let l;return e?(l=(0,_util.handleFieldOrColumn)(this,e))&&this.handleClearFilter(l):this.visibleColumn.forEach(this.handleClearFilter),e&&l===t.column||Object.assign(t,{isAllSelected:!1,isIndeterminate:!1,style:null,options:[],column:null,multiple:!1,visible:!1}),this.updateData()},_updateFilterOptionStatus(e,t){return e._checked=t,e.checked=t,this.$nextTick()}}};
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../../ui"),_util=require("../../src/util"),_dom=require("../../../ui/src/dom"),_utils=require("../../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let renderer=_ui.VxeUI.renderer;var _default=exports.default={methods:{_openFilter(e){let i=(0,_util.handleFieldOrColumn)(this,e);if(i&&i.filters){let t=this.elemStore,l=i.fixed;return this.scrollToColumn(i).then(()=>{var e=t[`${l||"main"}-header-wrapper`]||t["main-header-wrapper"];e&&(e=e.querySelector(`.vxe-header--column.${i.id} .vxe-cell--filter`),(0,_dom.triggerEvent)(e,"click"))})}return this.$nextTick()},_setFilter(e,t,l){e=(0,_util.handleFieldOrColumn)(this,e);return e&&e.filters&&(e.filters=(0,_util.toFilters)(t||[]),l)?this.handleColumnConfirmFilter(e,new Event("click")):this.$nextTick()},checkFilterOptions(){var e=this.filterStore;e.isAllSelected=e.options.every(e=>e._checked),e.isIndeterminate=!e.isAllSelected&&e.options.some(e=>e._checked)},triggerFilterEvent(l,r,n){let F=this;var s=F,o=F;let e=this.filterStore;if(e.column===r&&e.visible)e.visible=!1;else{let{initStore:e,filterStore:p}=s,t=o.elemStore;if(p.column===r&&p.visible)p.visible=!1;else{let a=F.$refs.refElem,{scrollTop:h,scrollLeft:c,visibleHeight:u,visibleWidth:d}=(0,_dom.getDomNode)();let f=F.computeFilterOpts.transfer,m=a.getBoundingClientRect(),v=l.currentTarget;var{filters:s,filterMultiple:_,filterRender:g}=r,g=(0,_utils.isEnableConf)(g)?renderer.get(g.name):null;let i=r.filterRecoverMethod||(g?g.tableFilterRecoverMethod||g.filterRecoverMethod:null);o._currFilterParams=n,Object.assign(p,{multiple:_,options:s,column:r,style:null}),p.options.forEach(e=>{var{_checked:t,checked:l}=e;(e._checked=l)||t===l||i&&i({option:e,column:r,$table:F})}),this.checkFilterOptions(),p.visible=!0,e.filter=!0,F.$nextTick(()=>{if((0,_util.getRefElem)(t["main-header-scroll"])){var i=F.$refs.refTableFilter,i=i?i.$el:null;if(i){var r=v.getBoundingClientRect(),n=i.querySelector(".vxe-table--filter-header"),s=i.querySelector(".vxe-table--filter-footer"),i=i.offsetWidth,o=i/2;let e=0,t=0,l=0;f?(e=r.left-o+c,t=r.top+v.clientHeight+h,l=Math.min(Math.max(m.height,Math.floor(u/2)),Math.max(80,u-t-(n?n.clientHeight:0)-(s?s.clientHeight:0)-28)),e<16?e=16:e>d-i-16&&(e=d-i-16)):(e=r.left-m.left-o,t=r.top-m.top+v.clientHeight,l=Math.max(40,a.clientHeight-t-(n?n.clientHeight:0)-(s?s.clientHeight:0)-14),e<1?e=1:e>a.clientWidth-i-1&&(e=a.clientWidth-i-1)),p.style={top:(0,_dom.toCssUnit)(t),left:(0,_dom.toCssUnit)(e)},p.maxHeight=l}}})}F.dispatchEvent("filter-visible",{column:r,field:r.field,property:r.field,filterList:F.getCheckedFilters(),visible:p.visible},l)}},handleFilterConfirmFilter(e){var t=this.filterStore;t.options.forEach(e=>{e.checked=e._checked}),this.confirmFilterEvent(e)},_saveFilterPanel(){return this.handleFilterConfirmFilter(null),this.$nextTick()},_resetFilterPanel(){return this.handleFilterResetFilter(null),this.$nextTick()},_getCheckedFilters(){var e=this.tableFullColumn;let n=[];return e.forEach(e=>{var{field:t,filters:l}=e;let i=[],r=[];l&&l.length&&(l.forEach(e=>{e.checked&&(i.push(e.value),r.push(e.data))}),i.length)&&n.push({column:e,field:t,property:t,values:i,datas:r})}),n},handleColumnConfirmFilter(e,t){let l=this;var i=l.mouseConfig;let{scrollXLoad:r,scrollYLoad:n}=l;var s=l.computeFilterOpts,o=l.computeMouseOpts,a=e.field;let h=[],c=[];e.filters.forEach(e=>{e.checked&&(h.push(e.value),c.push(e.data))});var u=this.getCheckedFilters(),e={$table:this,$event:t,column:e,field:a,property:a,values:h,datas:c,filters:u,filterList:u};return s.remote||(this.handleTableData(!0),this.checkSelectionStatus()),i&&o.area&&this.handleFilterEvent&&l.handleFilterEvent(t,e),t&&l.emitEvent("filter-change",e,t),l.closeFilter(),l.updateFooter().then(()=>{var{scrollXLoad:e,scrollYLoad:t}=this;if(r||e||n||t)return(r||e)&&l.updateScrollXSpace(),(n||t)&&l.updateScrollYSpace(),l.refreshScroll()}).then(()=>(l.updateCellAreas(),l.recalculate(!0))).then(()=>{setTimeout(()=>l.recalculate(),50)})},confirmFilterEvent(e){var t=this.filterStore,t=t.column;this.handleColumnConfirmFilter(t,e)},handleClearFilter(e){if(e){var{filters:l,filterRender:i}=e;if(l){i=(0,_utils.isEnableConf)(i)?renderer.get(i.name):null;let t=e.filterResetMethod||(i?i.tableFilterResetMethod||i.filterResetMethod:null);l.forEach(e=>{e._checked=!1,e.checked=!1,t||(e.data=_xeUtils.default.clone(e.resetValue,!0))}),t&&t({options:l,column:e,$table:this})}}},handleFilterResetFilter(e){this.handleClearFilter(this.filterStore.column),this.confirmFilterEvent(e)},_clearFilter(e){var t=this.filterStore;let l;return e?(l=(0,_util.handleFieldOrColumn)(this,e))&&this.handleClearFilter(l):this.visibleColumn.forEach(this.handleClearFilter),e&&l===t.column||Object.assign(t,{isAllSelected:!1,isIndeterminate:!1,style:null,options:[],column:null,multiple:!1,visible:!1}),this.updateData()},_updateFilterOptionStatus(e,t){return e._checked=t,e.checked=t,this.$nextTick()}}};

package/lib/table/module/filter/panel.js

@@ -10,28 +10,169 @@ var _vn = require("../../../ui/src/vn");
 const {
   getI18n,
   getIcon,
-  renderer
+  renderer,
+  globalMixins
 } = _ui.VxeUI;
+function renderOptions($xeFilterPanel, h, filterRender, compConf) {
+  const props = $xeFilterPanel;
+  const $xeTable = $xeFilterPanel.$xeTable;
+  const tableInternalData = $xeTable;
+  const {
+    filterStore
+  } = props;
+  const {
+    column,
+    multiple,
+    maxHeight
+  } = filterStore;
+  const slots = column ? column.slots : null;
+  const filterSlot = slots ? slots.filter : null;
+  const params = Object.assign({}, tableInternalData._currFilterParams, {
+    $panel: $xeFilterPanel,
+    $table: $xeTable
+  });
+  const rtFilter = compConf ? compConf.renderTableFilter || compConf.renderFilter : null;
+  if (filterSlot) {
+    return [h('div', {
+      class: 'vxe-table--filter-template',
+      style: maxHeight ? {
+        maxHeight: `${maxHeight}px`
+      } : {}
+    }, $xeTable.callSlot(filterSlot, params, h))];
+  } else if (rtFilter) {
+    return [h('div', {
+      class: 'vxe-table--filter-template',
+      style: maxHeight ? {
+        maxHeight: `${maxHeight}px`
+      } : {}
+    }, (0, _vn.getSlotVNs)(rtFilter.call($xeTable, h, filterRender, params)))];
+  }
+  const isAllChecked = multiple ? filterStore.isAllSelected : !filterStore.options.some(item => item._checked);
+  const isAllIndeterminate = multiple && filterStore.isIndeterminate;
+  return [h('ul', {
+    class: 'vxe-table--filter-header'
+  }, [h('li', {
+    class: ['vxe-table--filter-option', {
+      'is--checked': isAllChecked,
+      'is--indeterminate': isAllIndeterminate
+    }],
+    attrs: {
+      title: getI18n(multiple ? 'vxe.table.allTitle' : 'vxe.table.allFilter')
+    },
+    on: {
+      click: evnt => {
+        $xeFilterPanel.changeAllOption(evnt, !filterStore.isAllSelected);
+      }
+    }
+  }, (multiple ? [h('span', {
+    class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED]
+  })] : []).concat([h('span', {
+    class: 'vxe-checkbox--label'
+  }, getI18n('vxe.table.allFilter'))]))]), h('ul', {
+    class: 'vxe-table--filter-body',
+    style: maxHeight ? {
+      maxHeight: `${maxHeight}px`
+    } : {}
+  }, filterStore.options.map(item => {
+    const isChecked = item._checked;
+    const isIndeterminate = false;
+    return h('li', {
+      class: ['vxe-table--filter-option', {
+        'is--checked': isChecked
+      }],
+      attrs: {
+        title: item.label
+      },
+      on: {
+        click: evnt => {
+          $xeFilterPanel.changeOption(evnt, !item._checked, item);
+        }
+      }
+    }, (multiple ? [h('span', {
+      class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED]
+    })] : []).concat([h('span', {
+      class: 'vxe-checkbox--label'
+    }, (0, _utils.formatText)(item.label, 1))]));
+  }))];
+}
+function renderFooter($xeFilterPanel, h) {
+  const props = $xeFilterPanel;
+  const $xeTable = $xeFilterPanel.$xeTable;
+  const {
+    filterStore
+  } = props;
+  const {
+    column,
+    multiple
+  } = filterStore;
+  const filterOpts = $xeTable.computeFilterOpts;
+  const hasCheckOption = $xeFilterPanel.computeHasCheckOption;
+  const filterRender = column.filterRender;
+  const compConf = (0, _utils.isEnableConf)(filterRender) ? renderer.get(filterRender.name) : null;
+  const isDisabled = !hasCheckOption && !filterStore.isAllSelected && !filterStore.isIndeterminate;
+  return multiple && (compConf ? !(compConf.showTableFilterFooter === false || compConf.showFilterFooter === false || compConf.isFooter === false) : true) ? [h('div', {
+    class: 'vxe-table--filter-footer'
+  }, [h('button', {
+    class: {
+      'is--disabled': isDisabled
+    },
+    attrs: {
+      disabled: isDisabled
+    },
+    on: {
+      click: $xeFilterPanel.confirmFilter
+    }
+  }, filterOpts.confirmButtonText || getI18n('vxe.table.confirmFilter')), h('button', {
+    on: {
+      click: $xeFilterPanel.resetFilter
+    }
+  }, filterOpts.resetButtonText || getI18n('vxe.table.resetFilter'))])] : [];
+}
 var _default = exports.default = {
   name: 'VxeTableFilterPanel',
+  mixins: [globalMixins.sizeMixin],
   props: {
     filterStore: Object
   },
+  inject: {
+    $xeTable: {
+      default: null
+    }
+  },
   computed: {
-    hasCheckOption() {
+    computeHasCheckOption() {
       const {
         filterStore
       } = this;
       return filterStore && filterStore.options.some(option => option.checked);
     }
   },
+  mounted() {
+    const $xeFilterPanel = this;
+    const $xeTable = $xeFilterPanel.$xeTable;
+    const filterOpts = $xeTable.computeFilterOpts;
+    const {
+      transfer
+    } = filterOpts;
+    const el = this.$refs.refElem;
+    if (transfer && el) {
+      document.body.appendChild(el);
+    }
+  },
+  beforeDestroy() {
+    const el = this.$refs.refElem;
+    if (el && el.parentNode) {
+      el.parentNode.removeChild(el);
+    }
+  },
   render(h) {
-    const $panel = this;
-    const $xeTable = this.$parent;
+    const $xeFilterPanel = this;
+    const props = $xeFilterPanel;
+    const $xeTable = $xeFilterPanel.$xeTable;
     const tableInternalData = $xeTable;
     const {
       filterStore
-    } = this;
+    } = props;
     const {
       visible,
       multiple,
@@ -41,137 +182,27 @@ var _default = exports.default = {
     const compConf = (0, _utils.isEnableConf)(filterRender) ? renderer.get(filterRender.name) : null;
     const filterClassName = compConf ? compConf.tableFilterClassName || compConf.filterClassName : '';
     const params = Object.assign({}, tableInternalData._currFilterParams, {
-      $panel,
+      $panel: $xeFilterPanel,
       $table: $xeTable
     });
+    const tableProps = $xeTable;
+    const vSize = $xeFilterPanel.computeSize;
     const filterOpts = $xeTable.computeFilterOpts;
     const {
       destroyOnClose
     } = filterOpts;
     return h('div', {
+      ref: 'refElem',
       class: ['vxe-table--filter-wrapper', 'filter--prevent-default', compConf && compConf.className ? compConf.className : '', (0, _utils.getClass)(filterClassName, params), {
-        'is--animat': $xeTable.animat,
+        [`size--${vSize}`]: vSize,
+        'is--animat': tableProps.animat,
         'is--multiple': multiple,
         'is--active': visible
       }],
       style: filterStore.style
-    }, filterStore.visible && (destroyOnClose ? visible : true) && column ? this.renderOptions(h, filterRender, compConf).concat(this.renderFooter(h)) : []);
+    }, filterStore.visible && (destroyOnClose ? visible : true) && column ? renderOptions($xeFilterPanel, h, filterRender, compConf).concat(renderFooter($xeFilterPanel, h)) : []);
   },
   methods: {
-    renderOptions(h, filterRender, compConf) {
-      const $panel = this;
-      const $xeTable = this.$parent;
-      const tableInternalData = $xeTable;
-      const {
-        filterStore
-      } = this;
-      const {
-        column,
-        multiple,
-        maxHeight
-      } = filterStore;
-      const slots = column ? column.slots : null;
-      const filterSlot = slots ? slots.filter : null;
-      const params = Object.assign({}, tableInternalData._currFilterParams, {
-        $panel,
-        $table: $xeTable
-      });
-      const rtFilter = compConf ? compConf.renderTableFilter || compConf.renderFilter : null;
-      if (filterSlot) {
-        return [h('div', {
-          class: 'vxe-table--filter-template',
-          style: maxHeight ? {
-            maxHeight: `${maxHeight}px`
-          } : {}
-        }, $xeTable.callSlot(filterSlot, params, h))];
-      } else if (rtFilter) {
-        return [h('div', {
-          class: 'vxe-table--filter-template',
-          style: maxHeight ? {
-            maxHeight: `${maxHeight}px`
-          } : {}
-        }, (0, _vn.getSlotVNs)(rtFilter.call($xeTable, h, filterRender, params)))];
-      }
-      const isAllChecked = multiple ? filterStore.isAllSelected : !filterStore.options.some(item => item._checked);
-      const isAllIndeterminate = multiple && filterStore.isIndeterminate;
-      return [h('ul', {
-        class: 'vxe-table--filter-header'
-      }, [h('li', {
-        class: ['vxe-table--filter-option', {
-          'is--checked': isAllChecked,
-          'is--indeterminate': isAllIndeterminate
-        }],
-        attrs: {
-          title: getI18n(multiple ? 'vxe.table.allTitle' : 'vxe.table.allFilter')
-        },
-        on: {
-          click: evnt => {
-            this.changeAllOption(evnt, !filterStore.isAllSelected);
-          }
-        }
-      }, (multiple ? [h('span', {
-        class: ['vxe-checkbox--icon', isAllIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isAllChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED]
-      })] : []).concat([h('span', {
-        class: 'vxe-checkbox--label'
-      }, getI18n('vxe.table.allFilter'))]))]), h('ul', {
-        class: 'vxe-table--filter-body',
-        style: maxHeight ? {
-          maxHeight: `${maxHeight}px`
-        } : {}
-      }, filterStore.options.map(item => {
-        const isChecked = item._checked;
-        const isIndeterminate = false;
-        return h('li', {
-          class: ['vxe-table--filter-option', {
-            'is--checked': isChecked
-          }],
-          attrs: {
-            title: item.label
-          },
-          on: {
-            click: evnt => {
-              this.changeOption(evnt, !item._checked, item);
-            }
-          }
-        }, (multiple ? [h('span', {
-          class: ['vxe-checkbox--icon', isIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : isChecked ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED]
-        })] : []).concat([h('span', {
-          class: 'vxe-checkbox--label'
-        }, (0, _utils.formatText)(item.label, 1))]));
-      }))];
-    },
-    renderFooter(h) {
-      const $xeTable = this.$parent;
-      const {
-        hasCheckOption,
-        filterStore
-      } = this;
-      const {
-        column,
-        multiple
-      } = filterStore;
-      const filterOpts = $xeTable.computeFilterOpts;
-      const filterRender = column.filterRender;
-      const compConf = (0, _utils.isEnableConf)(filterRender) ? renderer.get(filterRender.name) : null;
-      const isDisabled = !hasCheckOption && !filterStore.isAllSelected && !filterStore.isIndeterminate;
-      return multiple && (compConf ? !(compConf.showTableFilterFooter === false || compConf.showFilterFooter === false || compConf.isFooter === false) : true) ? [h('div', {
-        class: 'vxe-table--filter-footer'
-      }, [h('button', {
-        class: {
-          'is--disabled': isDisabled
-        },
-        attrs: {
-          disabled: isDisabled
-        },
-        on: {
-          click: this.confirmFilter
-        }
-      }, filterOpts.confirmButtonText || getI18n('vxe.table.confirmFilter')), h('button', {
-        on: {
-          click: this.resetFilter
-        }
-      }, filterOpts.resetButtonText || getI18n('vxe.table.resetFilter'))])] : [];
-    },
     // 全部筛选事件
     filterCheckAllEvent(evnt, value) {
       const filterStore = this.filterStore;

package/lib/table/module/filter/panel.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _ui=require("../../../ui"),_utils=require("../../../ui/src/utils"),_vn=require("../../../ui/src/vn");let{getI18n,getIcon,renderer}=_ui.VxeUI;var _default=exports.default={name:"VxeTableFilterPanel",props:{filterStore:Object},computed:{hasCheckOption(){var e=this.filterStore;return e&&e.options.some(e=>e.checked)}},render(e){var t=this.$parent,l=t,i=this.filterStore,{visible:r,multiple:s,column:a}=i,n=a?a.filterRender:null,c=(0,_utils.isEnableConf)(n)?renderer.get(n.name):null,o=c?c.tableFilterClassName||c.filterClassName:"",l=Object.assign({},l._currFilterParams,{$panel:this,$table:t}),h=t.computeFilterOpts.destroyOnClose;return e("div",{class:["vxe-table--filter-wrapper","filter--prevent-default",c&&c.className?c.className:"",(0,_utils.getClass)(o,l),{"is--animat":t.animat,"is--multiple":s,"is--active":r}],style:i.style},i.visible&&(!h||r)&&a?this.renderOptions(e,n,c).concat(this.renderFooter(e)):[])},methods:{renderOptions(l,e,t){var i=this.$parent;let r=this.filterStore,{column:s,multiple:a,maxHeight:n}=r;var c=s?s.slots:null,c=c?c.filter:null,o=Object.assign({},i._currFilterParams,{$panel:this,$table:i}),t=t?t.renderTableFilter||t.renderFilter:null;return c?[l("div",{class:"vxe-table--filter-template",style:n?{maxHeight:n+"px"}:{}},i.callSlot(c,o,l))]:t?[l("div",{class:"vxe-table--filter-template",style:n?{maxHeight:n+"px"}:{}},(0,_vn.getSlotVNs)(t.call(i,l,e,o)))]:(c=a?r.isAllSelected:!r.options.some(e=>e._checked),t=a&&r.isIndeterminate,[l("ul",{class:"vxe-table--filter-header"},[l("li",{class:["vxe-table--filter-option",{"is--checked":c,"is--indeterminate":t}],attrs:{title:getI18n(a?"vxe.table.allTitle":"vxe.table.allFilter")},on:{click:e=>{this.changeAllOption(e,!r.isAllSelected)}}},(a?[l("span",{class:["vxe-checkbox--icon",t?getIcon().TABLE_CHECKBOX_INDETERMINATE:c?getIcon().TABLE_CHECKBOX_CHECKED:getIcon().TABLE_CHECKBOX_UNCHECKED]})]:[]).concat([l("span",{class:"vxe-checkbox--label"},getI18n("vxe.table.allFilter"))]))]),l("ul",{class:"vxe-table--filter-body",style:n?{maxHeight:n+"px"}:{}},r.options.map(t=>{var e=t._checked;return l("li",{class:["vxe-table--filter-option",{"is--checked":e}],attrs:{title:t.label},on:{click:e=>{this.changeOption(e,!t._checked,t)}}},(a?[l("span",{class:["vxe-checkbox--icon",e?getIcon().TABLE_CHECKBOX_CHECKED:getIcon().TABLE_CHECKBOX_UNCHECKED]})]:[]).concat([l("span",{class:"vxe-checkbox--label"},(0,_utils.formatText)(t.label,1))]))}))])},renderFooter(e){var{hasCheckOption:t,filterStore:l}=this,{column:i,multiple:r}=l,s=this.$parent.computeFilterOpts,i=i.filterRender,i=(0,_utils.isEnableConf)(i)?renderer.get(i.name):null,t=!t&&!l.isAllSelected&&!l.isIndeterminate;return r&&(!i||!1!==i.showTableFilterFooter&&!1!==i.showFilterFooter&&!1!==i.isFooter)?[e("div",{class:"vxe-table--filter-footer"},[e("button",{class:{"is--disabled":t},attrs:{disabled:t},on:{click:this.confirmFilter}},s.confirmButtonText||getI18n("vxe.table.confirmFilter")),e("button",{on:{click:this.resetFilter}},s.resetButtonText||getI18n("vxe.table.resetFilter"))])]:[]},filterCheckAllEvent(e,t){var l=this.filterStore;l.options.forEach(e=>{e._checked=t,e.checked=t}),l.isAllSelected=t,l.isIndeterminate=!1},changeRadioOption(e,t,l){var i=this.$parent,r=this.filterStore;r.options.forEach(e=>{e._checked=!1}),l._checked=t,i.checkFilterOptions(),this.confirmFilter(e)},changeMultipleOption(e,t,l){var i=this.$parent;l._checked=t,i.checkFilterOptions()},changeAllOption(e,t){this.filterStore.multiple?this.filterCheckAllEvent(e,t):this.resetFilter(e)},changeOption(e,t,l){this.filterStore.multiple?this.changeMultipleOption(e,t,l):this.changeRadioOption(e,t,l)},confirmFilter(e){this.$parent.handleFilterConfirmFilter(e)},resetFilter(e){this.$parent.handleFilterResetFilter(e)}}};
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _ui=require("../../../ui"),_utils=require("../../../ui/src/utils"),_vn=require("../../../ui/src/vn");let{getI18n,getIcon,renderer,globalMixins}=_ui.VxeUI;function renderOptions(l,i,e,t){var r=l.$xeTable;let a=l.filterStore,{column:s,multiple:n,maxHeight:o}=a;var c=s?s.slots:null,c=c?c.filter:null,p=Object.assign({},r._currFilterParams,{$panel:l,$table:r}),t=t?t.renderTableFilter||t.renderFilter:null;return c?[i("div",{class:"vxe-table--filter-template",style:o?{maxHeight:o+"px"}:{}},r.callSlot(c,p,i))]:t?[i("div",{class:"vxe-table--filter-template",style:o?{maxHeight:o+"px"}:{}},(0,_vn.getSlotVNs)(t.call(r,i,e,p)))]:(c=n?a.isAllSelected:!a.options.some(e=>e._checked),t=n&&a.isIndeterminate,[i("ul",{class:"vxe-table--filter-header"},[i("li",{class:["vxe-table--filter-option",{"is--checked":c,"is--indeterminate":t}],attrs:{title:getI18n(n?"vxe.table.allTitle":"vxe.table.allFilter")},on:{click:e=>{l.changeAllOption(e,!a.isAllSelected)}}},(n?[i("span",{class:["vxe-checkbox--icon",t?getIcon().TABLE_CHECKBOX_INDETERMINATE:c?getIcon().TABLE_CHECKBOX_CHECKED:getIcon().TABLE_CHECKBOX_UNCHECKED]})]:[]).concat([i("span",{class:"vxe-checkbox--label"},getI18n("vxe.table.allFilter"))]))]),i("ul",{class:"vxe-table--filter-body",style:o?{maxHeight:o+"px"}:{}},a.options.map(t=>{var e=t._checked;return i("li",{class:["vxe-table--filter-option",{"is--checked":e}],attrs:{title:t.label},on:{click:e=>{l.changeOption(e,!t._checked,t)}}},(n?[i("span",{class:["vxe-checkbox--icon",e?getIcon().TABLE_CHECKBOX_CHECKED:getIcon().TABLE_CHECKBOX_UNCHECKED]})]:[]).concat([i("span",{class:"vxe-checkbox--label"},(0,_utils.formatText)(t.label,1))]))}))])}function renderFooter(e,t){var l=e.filterStore,{column:i,multiple:r}=l,a=e.$xeTable.computeFilterOpts,s=e.computeHasCheckOption,i=i.filterRender,i=(0,_utils.isEnableConf)(i)?renderer.get(i.name):null,s=!s&&!l.isAllSelected&&!l.isIndeterminate;return r&&(!i||!1!==i.showTableFilterFooter&&!1!==i.showFilterFooter&&!1!==i.isFooter)?[t("div",{class:"vxe-table--filter-footer"},[t("button",{class:{"is--disabled":s},attrs:{disabled:s},on:{click:e.confirmFilter}},a.confirmButtonText||getI18n("vxe.table.confirmFilter")),t("button",{on:{click:e.resetFilter}},a.resetButtonText||getI18n("vxe.table.resetFilter"))])]:[]}var _default=exports.default={name:"VxeTableFilterPanel",mixins:[globalMixins.sizeMixin],props:{filterStore:Object},inject:{$xeTable:{default:null}},computed:{computeHasCheckOption(){var e=this.filterStore;return e&&e.options.some(e=>e.checked)}},mounted(){var e=this.$xeTable.computeFilterOpts.transfer,t=this.$refs.refElem;e&&t&&document.body.appendChild(t)},beforeDestroy(){var e=this.$refs.refElem;e&&e.parentNode&&e.parentNode.removeChild(e)},render(e){var t=this,l=t.$xeTable,i=l,r=t.filterStore,{visible:a,multiple:s,column:n}=r,o=n?n.filterRender:null,c=(0,_utils.isEnableConf)(o)?renderer.get(o.name):null,p=c?c.tableFilterClassName||c.filterClassName:"",i=Object.assign({},i._currFilterParams,{$panel:t,$table:l}),d=l,u=t.computeSize,l=l.computeFilterOpts.destroyOnClose;return e("div",{ref:"refElem",class:["vxe-table--filter-wrapper","filter--prevent-default",c&&c.className?c.className:"",(0,_utils.getClass)(p,i),{["size--"+u]:u,"is--animat":d.animat,"is--multiple":s,"is--active":a}],style:r.style},r.visible&&(!l||a)&&n?renderOptions(t,e,o,c).concat(renderFooter(t,e)):[])},methods:{filterCheckAllEvent(e,t){var l=this.filterStore;l.options.forEach(e=>{e._checked=t,e.checked=t}),l.isAllSelected=t,l.isIndeterminate=!1},changeRadioOption(e,t,l){var i=this.$parent,r=this.filterStore;r.options.forEach(e=>{e._checked=!1}),l._checked=t,i.checkFilterOptions(),this.confirmFilter(e)},changeMultipleOption(e,t,l){var i=this.$parent;l._checked=t,i.checkFilterOptions()},changeAllOption(e,t){this.filterStore.multiple?this.filterCheckAllEvent(e,t):this.resetFilter(e)},changeOption(e,t,l){this.filterStore.multiple?this.changeMultipleOption(e,t,l):this.changeRadioOption(e,t,l)},confirmFilter(e){this.$parent.handleFilterConfirmFilter(e)},resetFilter(e){this.$parent.handleFilterResetFilter(e)}}};

package/lib/table/src/methods.js

@@ -3347,7 +3347,11 @@ const Methods = {
       handleReserveStatus($xeTable);
       $xeTable.checkSelectionStatus();
       return new Promise(resolve => {
-        this.$nextTick().then(() => $xeTable.recalculate()).then(() => {
+        this.$nextTick().then(() => handleRecalculateLayout($xeTable, false)).then(() => {
+          calcCellHeight($xeTable);
+          updateRowOffsetTop($xeTable);
+          return handleRecalculateLayout($xeTable, false);
+        }).then(() => {
           let targetScrollLeft = lastScrollLeft;
           let targetScrollTop = lastScrollTop;
           const virtualXOpts = $xeTable.computeVirtualXOpts;
@@ -3360,8 +3364,7 @@ const Methods = {
             targetScrollTop = 0;
           }
           reactData.isRowLoading = false;
-          calcCellHeight($xeTable);
-          updateRowOffsetTop($xeTable);
+          handleRecalculateLayout($xeTable, false);
           // 是否变更虚拟滚动
           if (oldScrollYLoad === sYLoad) {
             (0, _util.restoreScrollLocation)($xeTable, targetScrollLeft, targetScrollTop).then(() => {
@@ -7506,6 +7509,12 @@ const Methods = {
     const {
       column: newValue
     } = params;
+    const {
+      trigger
+    } = currentColumnOpts;
+    if (trigger === 'manual') {
+      return;
+    }
     const isChange = oldValue !== newValue;
     if (!beforeRowMethod || beforeRowMethod({
       column: newValue,
@@ -7534,6 +7543,12 @@ const Methods = {
     const {
       row: newValue
     } = params;
+    const {
+      trigger
+    } = currentRowOpts;
+    if (trigger === 'manual') {
+      return;
+    }
     const isChange = oldValue !== newValue;
     if (!beforeRowMethod || beforeRowMethod({
       row: newValue,
@@ -9551,7 +9566,8 @@ const Methods = {
     const $xeTable = this;
     const internalData = $xeTable;
     const {
-      treeExpandLazyLoadedMaps
+      treeExpandLazyLoadedMaps,
+      treeEATime
     } = internalData;
     const treeOpts = $xeTable.computeTreeOpts;
     const {
@@ -9560,7 +9576,8 @@ const Methods = {
     } = params;
     const {
       lazy,
-      trigger
+      trigger,
+      accordion
     } = treeOpts;
     if (trigger === 'manual') {
       return;
@@ -9571,7 +9588,17 @@ const Methods = {
       const expanded = !$xeTable.isTreeExpandByRow(row);
       const columnIndex = $xeTable.getColumnIndex(column);
       const $columnIndex = $xeTable.getVMColumnIndex(column);
-      $xeTable.setTreeExpand(row, expanded);
+      if (treeEATime) {
+        clearTimeout(treeEATime);
+      }
+      $xeTable.setTreeExpand(row, expanded).then(() => {
+        if (accordion) {
+          internalData.treeEATime = setTimeout(() => {
+            internalData.treeEATime = undefined;
+            $xeTable.scrollToRow(row);
+          }, 20);
+        }
+      });
       $xeTable.dispatchEvent('toggle-tree-expand', {
         expanded,
         column,
@@ -10453,7 +10480,8 @@ const Methods = {
       if (isScrollXBig && mouseOpts.area) {
         (0, _log.errLog)('vxe.error.notProp', ['mouse-config.area']);
       }
-      $xeTable.$nextTick(() => {
+      calcScrollbar($xeTable);
+      return $xeTable.$nextTick(() => {
         updateStyle($xeTable);
       });
     }
@@ -10572,6 +10600,7 @@ const Methods = {
     if (isScrollYBig && mouseOpts.area) {
       (0, _log.errLog)('vxe.error.notProp', ['mouse-config.area']);
     }
+    calcScrollbar($xeTable);
     return $xeTable.$nextTick().then(() => {
       updateStyle($xeTable);
     });