vxe-table 4.16.16 → 4.16.17

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

@@ -1,442 +0,0 @@
-"use strict";
-
-var _vue = require("vue");
-var _xeUtils = _interopRequireDefault(require("xe-utils"));
-var _ui = require("../../../ui");
-var _util = require("../../src/util");
-var _dom = require("../../../ui/src/dom");
-var _utils = require("../../../ui/src/utils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const {
-  renderer,
-  hooks
-} = _ui.VxeUI;
-const tableFilterMethodKeys = ['openFilter', 'setFilter', 'clearFilter', 'saveFilterPanel', 'saveFilterPanelByEvent', 'resetFilterPanel', 'resetFilterPanelByEvent', 'getCheckedFilters', 'updateFilterOptionStatus'];
-hooks.add('tableFilterModule', {
-  setupTable($xeTable) {
-    const {
-      props,
-      reactData,
-      internalData
-    } = $xeTable;
-    const {
-      refElem,
-      refTableFilter
-    } = $xeTable.getRefMaps();
-    const {
-      computeFilterOpts,
-      computeMouseOpts
-    } = $xeTable.getComputeMaps();
-    // 确认筛选
-    const handleFilterConfirmFilter = evnt => {
-      const {
-        filterStore
-      } = reactData;
-      filterStore.options.forEach(option => {
-        option.checked = option._checked;
-      });
-      $xeTable.confirmFilterEvent(evnt);
-    };
-    // （单选）筛选发生改变
-    const changeRadioOption = (evnt, checked, item) => {
-      const {
-        filterStore
-      } = reactData;
-      filterStore.options.forEach(option => {
-        option._checked = false;
-      });
-      item._checked = checked;
-      $xeTable.checkFilterOptions();
-      handleFilterConfirmFilter(evnt);
-    };
-    // （多选）筛选发生改变
-    const changeMultipleOption = (evnt, checked, item) => {
-      item._checked = checked;
-      $xeTable.checkFilterOptions();
-    };
-    /**
-     * 重置筛选
-     * 当筛选面板中的重置按钮被按下时触发
-     * @param {Event} evnt 事件
-     */
-    const handleFilterResetFilter = evnt => {
-      const {
-        filterStore
-      } = reactData;
-      $xeTable.handleClearFilter(filterStore.column);
-      $xeTable.confirmFilterEvent(evnt);
-      if (evnt) {
-        $xeTable.dispatchEvent('clear-filter', {
-          filterList: []
-        }, evnt);
-      }
-    };
-    const filterPrivateMethods = {
-      checkFilterOptions() {
-        const {
-          filterStore
-        } = reactData;
-        filterStore.isAllSelected = filterStore.options.every(item => item._checked);
-        filterStore.isIndeterminate = !filterStore.isAllSelected && filterStore.options.some(item => item._checked);
-      },
-      /**
-       * 点击筛选事件
-       * 当筛选图标被点击时触发
-       * 更新选项是否全部状态
-       * 打开筛选面板
-       * @param {Event} evnt 事件
-       * @param {ColumnInfo} column 列配置
-       * @param {Object} params 参数
-       */
-      triggerFilterEvent(evnt, column, params) {
-        const {
-          initStore,
-          filterStore
-        } = reactData;
-        const {
-          elemStore
-        } = internalData;
-        if (filterStore.column === column && filterStore.visible) {
-          filterStore.visible = false;
-        } else {
-          const el = refElem.value;
-          const {
-            scrollTop,
-            scrollLeft,
-            visibleHeight,
-            visibleWidth
-          } = (0, _dom.getDomNode)();
-          const filterOpts = computeFilterOpts.value;
-          const {
-            transfer
-          } = filterOpts;
-          const tableRect = el.getBoundingClientRect();
-          const btnElem = evnt.currentTarget;
-          $xeTable.handleFilterOptions(column);
-          internalData._currFilterParams = params;
-          filterStore.style = null;
-          filterStore.visible = true;
-          initStore.filter = true;
-          (0, _vue.nextTick)(() => {
-            const headerScrollElem = (0, _util.getRefElem)(elemStore['main-header-scroll']);
-            if (!headerScrollElem) {
-              return;
-            }
-            const tableFilter = refTableFilter.value;
-            const filterWrapperElem = tableFilter ? tableFilter.getRefMaps().refElem.value : null;
-            if (!filterWrapperElem) {
-              return;
-            }
-            const btnRect = btnElem.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;
-            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;
-          });
-        }
-        $xeTable.dispatchEvent('filter-visible', {
-          column,
-          field: column.field,
-          property: column.field,
-          filterList: $xeTable.getCheckedFilters(),
-          visible: filterStore.visible
-        }, evnt);
-      },
-      handleClearFilter(column) {
-        if (column) {
-          const {
-            filters,
-            filterRender
-          } = column;
-          if (filters) {
-            const compConf = (0, _utils.isEnableConf)(filterRender) ? renderer.get(filterRender.name) : null;
-            const frMethod = column.filterResetMethod || (compConf ? compConf.tableFilterResetMethod || compConf.filterResetMethod : null);
-            filters.forEach(item => {
-              item._checked = false;
-              item.checked = false;
-              if (!frMethod) {
-                item.data = _xeUtils.default.clone(item.resetValue, true);
-              }
-            });
-            if (frMethod) {
-              frMethod({
-                options: filters,
-                column,
-                $table: $xeTable
-              });
-            }
-          }
-        }
-      },
-      handleColumnConfirmFilter(column, evnt) {
-        const {
-          mouseConfig
-        } = props;
-        const {
-          scrollXLoad: oldScrollXLoad,
-          scrollYLoad: oldScrollYLoad
-        } = reactData;
-        const filterOpts = computeFilterOpts.value;
-        const mouseOpts = computeMouseOpts.value;
-        const {
-          field
-        } = column;
-        const values = [];
-        const datas = [];
-        column.filters.forEach(item => {
-          if (item.checked) {
-            values.push(item.value);
-            datas.push(item.data);
-          }
-        });
-        const filterList = $xeTable.getCheckedFilters();
-        const params = {
-          $table: $xeTable,
-          $event: evnt,
-          column,
-          field,
-          property: field,
-          values,
-          datas,
-          filters: filterList,
-          filterList
-        };
-        // 如果是服务端筛选，则跳过本地筛选处理
-        if (!filterOpts.remote) {
-          $xeTable.handleTableData(true);
-          $xeTable.checkSelectionStatus();
-        }
-        if (mouseConfig && mouseOpts.area && $xeTable.handleFilterEvent) {
-          $xeTable.handleFilterEvent(evnt, params);
-        }
-        if (evnt) {
-          $xeTable.dispatchEvent('filter-change', params, evnt);
-        }
-        $xeTable.closeFilter();
-        return $xeTable.updateFooter().then(() => {
-          const {
-            scrollXLoad,
-            scrollYLoad
-          } = reactData;
-          if (oldScrollXLoad || scrollXLoad || oldScrollYLoad || scrollYLoad) {
-            if (oldScrollXLoad || scrollXLoad) {
-              $xeTable.updateScrollXSpace();
-            }
-            if (oldScrollYLoad || scrollYLoad) {
-              $xeTable.updateScrollYSpace();
-            }
-            return $xeTable.refreshScroll();
-          }
-        }).then(() => {
-          $xeTable.updateCellAreas();
-          return $xeTable.recalculate(true);
-        }).then(() => {
-          // 存在滚动行为未结束情况
-          setTimeout(() => $xeTable.recalculate(), 50);
-        });
-      },
-      /**
-       * 确认筛选
-       * 当筛选面板中的确定按钮被按下时触发
-       * @param {Event} evnt 事件
-       */
-      confirmFilterEvent(evnt) {
-        const {
-          filterStore
-        } = reactData;
-        const {
-          column
-        } = filterStore;
-        $xeTable.handleColumnConfirmFilter(column, evnt);
-      },
-      handleFilterChangeRadioOption: changeRadioOption,
-      handleFilterChangeMultipleOption: changeMultipleOption,
-      // 筛选发生改变
-      handleFilterChangeOption(evnt, checked, item) {
-        const {
-          filterStore
-        } = reactData;
-        if (filterStore.multiple) {
-          changeMultipleOption(evnt, checked, item);
-        } else {
-          changeRadioOption(evnt, checked, item);
-        }
-      },
-      handleFilterConfirmFilter,
-      handleFilterResetFilter
-    };
-    const filterMethods = {
-      /**
-       * 手动弹出筛选面板
-       * @param column
-       */
-      openFilter(fieldOrColumn) {
-        const column = (0, _util.handleFieldOrColumn)($xeTable, fieldOrColumn);
-        if (column && column.filters) {
-          const {
-            elemStore
-          } = internalData;
-          const {
-            fixed
-          } = column;
-          return $xeTable.scrollToColumn(column).then(() => {
-            const headerWrapperElem = (0, _util.getRefElem)(elemStore[`${fixed || 'main'}-header-wrapper`] || elemStore['main-header-wrapper']);
-            if (headerWrapperElem) {
-              const filterBtnElem = headerWrapperElem.querySelector(`.vxe-header--column.${column.id} .vxe-cell--filter`);
-              (0, _dom.triggerEvent)(filterBtnElem, 'click');
-            }
-          });
-        }
-        return (0, _vue.nextTick)();
-      },
-      /**
-       * 修改筛选条件列表
-       * @param {ColumnInfo} fieldOrColumn 列或字段名
-       * @param {Array} options 选项
-       */
-      setFilter(fieldOrColumn, options, isUpdate) {
-        const {
-          filterStore
-        } = reactData;
-        const column = (0, _util.handleFieldOrColumn)($xeTable, fieldOrColumn);
-        if (column && column.filters) {
-          column.filters = (0, _util.toFilters)(options || []);
-          if (isUpdate) {
-            return $xeTable.handleColumnConfirmFilter(column, null);
-          } else {
-            if (filterStore.visible) {
-              $xeTable.handleFilterOptions(column);
-            }
-          }
-        }
-        return (0, _vue.nextTick)();
-      },
-      /**
-       * 清空指定列的筛选条件
-       * 如果为空则清空所有列的筛选条件
-       * @param {String} fieldOrColumn 列或字段名
-       */
-      clearFilter(fieldOrColumn) {
-        const {
-          filterStore
-        } = reactData;
-        const {
-          tableFullColumn
-        } = internalData;
-        const filterOpts = computeFilterOpts.value;
-        let column;
-        if (fieldOrColumn) {
-          column = (0, _util.handleFieldOrColumn)($xeTable, fieldOrColumn);
-          if (column) {
-            $xeTable.handleClearFilter(column);
-          }
-        } else {
-          tableFullColumn.forEach($xeTable.handleClearFilter);
-        }
-        if (!fieldOrColumn || column !== filterStore.column) {
-          Object.assign(filterStore, {
-            isAllSelected: false,
-            isIndeterminate: false,
-            style: null,
-            options: [],
-            column: null,
-            multiple: false,
-            visible: false
-          });
-        }
-        if (!filterOpts.remote) {
-          return $xeTable.updateData();
-        }
-        return (0, _vue.nextTick)();
-      },
-      saveFilterPanel() {
-        handleFilterConfirmFilter(null);
-        return (0, _vue.nextTick)();
-      },
-      saveFilterPanelByEvent(evnt) {
-        handleFilterConfirmFilter(evnt);
-        return (0, _vue.nextTick)();
-      },
-      resetFilterPanel() {
-        handleFilterResetFilter(null);
-        return (0, _vue.nextTick)();
-      },
-      resetFilterPanelByEvent(evnt) {
-        handleFilterResetFilter(evnt);
-        return (0, _vue.nextTick)();
-      },
-      getCheckedFilters() {
-        const {
-          tableFullColumn
-        } = internalData;
-        const filterList = [];
-        tableFullColumn.forEach(column => {
-          const {
-            field,
-            filters
-          } = column;
-          const valueList = [];
-          const dataList = [];
-          if (filters && filters.length) {
-            filters.forEach(item => {
-              if (item.checked) {
-                valueList.push(item.value);
-                dataList.push(item.data);
-              }
-            });
-            if (valueList.length) {
-              filterList.push({
-                column,
-                field,
-                property: field,
-                values: valueList,
-                datas: dataList
-              });
-            }
-          }
-        });
-        return filterList;
-      },
-      updateFilterOptionStatus(item, checked) {
-        item._checked = checked;
-        item.checked = checked;
-        return (0, _vue.nextTick)();
-      }
-    };
-    return Object.assign(Object.assign({}, filterMethods), filterPrivateMethods);
-  },
-  setupGrid($xeGrid) {
-    return $xeGrid.extendTableMethods(tableFilterMethodKeys);
-  },
-  setupGantt($xeGantt) {
-    return $xeGantt.extendTableMethods(tableFilterMethodKeys);
-  }
-});

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

@@ -1 +0,0 @@
-var _vue=require("vue"),_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,hooks}=_ui.VxeUI,tableFilterMethodKeys=["openFilter","setFilter","clearFilter","saveFilterPanel","saveFilterPanelByEvent","resetFilterPanel","resetFilterPanelByEvent","getCheckedFilters","updateFilterOptionStatus"];hooks.add("tableFilterModule",{setupTable(_){let{props:d,reactData:h,internalData:n}=_,{refElem:i,refTableFilter:g}=_.getRefMaps(),{computeFilterOpts:k,computeMouseOpts:f}=_.getComputeMaps(),a=e=>{var t=h.filterStore;t.options.forEach(e=>{e.checked=e._checked}),_.confirmFilterEvent(e)},o=(e,t,l)=>{var r=h.filterStore;r.options.forEach(e=>{e._checked=!1}),l._checked=t,_.checkFilterOptions(),a(e)},u=(e,t,l)=>{l._checked=t,_.checkFilterOptions()},t=e=>{var t=h.filterStore;_.handleClearFilter(t.column),_.confirmFilterEvent(e),e&&_.dispatchEvent("clear-filter",{filterList:[]},e)};var e={checkFilterOptions(){var e=h.filterStore;e.isAllSelected=e.options.every(e=>e._checked),e.isIndeterminate=!e.isAllSelected&&e.options.some(e=>e._checked)},triggerFilterEvent(e,t,l){let{initStore:r,filterStore:m}=h,F=n.elemStore;if(m.column===t&&m.visible)m.visible=!1;else{let u=i.value,{scrollTop:s,scrollLeft:c,visibleHeight:d,visibleWidth:h}=(0,_dom.getDomNode)();let f=k.value.transfer,v=u.getBoundingClientRect(),p=e.currentTarget;_.handleFilterOptions(t),n._currFilterParams=l,m.style=null,m.visible=!0,r.filter=!0,(0,_vue.nextTick)(()=>{if((0,_util.getRefElem)(F["main-header-scroll"])){var r=g.value,r=r?r.getRefMaps().refElem.value:null;if(r){var i=p.getBoundingClientRect(),a=r.querySelector(".vxe-table--filter-header"),n=r.querySelector(".vxe-table--filter-footer"),r=r.offsetWidth,o=r/2;let e=0,t=0,l=0;f?(e=i.left-o+c,t=i.top+p.clientHeight+s,l=Math.min(Math.max(v.height,Math.floor(d/2)),Math.max(80,d-t-(a?a.clientHeight:0)-(n?n.clientHeight:0)-28)),e<16?e=16:e>h-r-16&&(e=h-r-16)):(e=i.left-v.left-o,t=i.top-v.top+p.clientHeight,l=Math.max(40,u.clientHeight-t-(a?a.clientHeight:0)-(n?n.clientHeight:0)-14),e<1?e=1:e>u.clientWidth-r-1&&(e=u.clientWidth-r-1)),m.style={top:(0,_dom.toCssUnit)(t),left:(0,_dom.toCssUnit)(e)},m.maxHeight=l}}})}_.dispatchEvent("filter-visible",{column:t,field:t.field,property:t.field,filterList:_.getCheckedFilters(),visible:m.visible},e)},handleClearFilter(e){if(e){var{filters:l,filterRender:r}=e;if(l){r=(0,_utils.isEnableConf)(r)?renderer.get(r.name):null;let t=e.filterResetMethod||(r?r.tableFilterResetMethod||r.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:_})}}},handleColumnConfirmFilter(e,t){var l=d.mouseConfig;let{scrollXLoad:r,scrollYLoad:i}=h;var a=k.value,n=f.value,o=e.field;let u=[],s=[];e.filters.forEach(e=>{e.checked&&(u.push(e.value),s.push(e.data))});var c=_.getCheckedFilters(),e={$table:_,$event:t,column:e,field:o,property:o,values:u,datas:s,filters:c,filterList:c};return a.remote||(_.handleTableData(!0),_.checkSelectionStatus()),l&&n.area&&_.handleFilterEvent&&_.handleFilterEvent(t,e),t&&_.dispatchEvent("filter-change",e,t),_.closeFilter(),_.updateFooter().then(()=>{var{scrollXLoad:e,scrollYLoad:t}=h;if(r||e||i||t)return(r||e)&&_.updateScrollXSpace(),(i||t)&&_.updateScrollYSpace(),_.refreshScroll()}).then(()=>(_.updateCellAreas(),_.recalculate(!0))).then(()=>{setTimeout(()=>_.recalculate(),50)})},confirmFilterEvent(e){var t=h.filterStore,t=t.column;_.handleColumnConfirmFilter(t,e)},handleFilterChangeRadioOption:o,handleFilterChangeMultipleOption:u,handleFilterChangeOption(e,t,l){var r=h.filterStore;r.multiple?u(0,t,l):o(e,t,l)},handleFilterConfirmFilter:a,handleFilterResetFilter:t};return Object.assign(Object.assign({},{openFilter(e){let r=(0,_util.handleFieldOrColumn)(_,e);if(r&&r.filters){let t=n.elemStore,l=r.fixed;return _.scrollToColumn(r).then(()=>{var e=(0,_util.getRefElem)(t[`${l||"main"}-header-wrapper`]||t["main-header-wrapper"]);e&&(e=e.querySelector(`.vxe-header--column.${r.id} .vxe-cell--filter`),(0,_dom.triggerEvent)(e,"click"))})}return(0,_vue.nextTick)()},setFilter(e,t,l){var r=h.filterStore,e=(0,_util.handleFieldOrColumn)(_,e);if(e&&e.filters){if(e.filters=(0,_util.toFilters)(t||[]),l)return _.handleColumnConfirmFilter(e,null);r.visible&&_.handleFilterOptions(e)}return(0,_vue.nextTick)()},clearFilter(e){var t=h.filterStore,l=n.tableFullColumn,r=k.value;let i;return e?(i=(0,_util.handleFieldOrColumn)(_,e))&&_.handleClearFilter(i):l.forEach(_.handleClearFilter),e&&i===t.column||Object.assign(t,{isAllSelected:!1,isIndeterminate:!1,style:null,options:[],column:null,multiple:!1,visible:!1}),r.remote?(0,_vue.nextTick)():_.updateData()},saveFilterPanel(){return a(null),(0,_vue.nextTick)()},saveFilterPanelByEvent(e){return a(e),(0,_vue.nextTick)()},resetFilterPanel(){return t(null),(0,_vue.nextTick)()},resetFilterPanelByEvent(e){return t(e),(0,_vue.nextTick)()},getCheckedFilters(){var e=n.tableFullColumn;let a=[];return e.forEach(e=>{var{field:t,filters:l}=e;let r=[],i=[];l&&l.length&&(l.forEach(e=>{e.checked&&(r.push(e.value),i.push(e.data))}),r.length)&&a.push({column:e,field:t,property:t,values:r,datas:i})}),a},updateFilterOptionStatus(e,t){return e._checked=t,e.checked=t,(0,_vue.nextTick)()}}),e)},setupGrid(e){return e.extendTableMethods(tableFilterMethodKeys)},setupGantt(e){return e.extendTableMethods(tableFilterMethodKeys)}});