vxe-table-ro-test/lib/table/module/custom/hook.js

一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟树、列拖拽，懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...

"use strict";

var _vue = require("vue");
var _ui = require("../../../ui");
var _xeUtils = _interopRequireDefault(require("xe-utils"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
const tableCustomMethodKeys = ['openCustom', 'closeCustom'];
_ui.VxeUI.hooks.add('tableCustomModule', {
  setupTable($xeTable) {
    const {
      reactData,
      internalData
    } = $xeTable;
    const {
      computeCustomOpts
    } = $xeTable.getComputeMaps();
    const {
      refElem
    } = $xeTable.getRefMaps();
    const $xeGrid = $xeTable.xegrid;
    const calcMaxHeight = () => {
      const {
        customStore
      } = reactData;
      const el = refElem.value;
      // 判断面板不能大于表格高度
      let tableHeight = 0;
      if (el) {
        tableHeight = el.clientHeight - 28;
      }
      customStore.maxHeight = Math.max(4, tableHeight);
    };
    const openCustom = () => {
      const {
        initStore,
        customStore
      } = reactData;
      const {
        collectColumn
      } = internalData;
      const sortMaps = {};
      const fixedMaps = {};
      const visibleMaps = {};
      _xeUtils.default.eachTree(collectColumn, column => {
        const colid = column.getKey();
        column.renderFixed = column.fixed;
        column.renderVisible = column.visible;
        column.renderResizeWidth = column.renderWidth;
        sortMaps[colid] = column.renderSortNumber;
        fixedMaps[colid] = column.fixed;
        visibleMaps[colid] = column.visible;
      }, {
        children: 'children'
      });
      customStore.oldSortMaps = sortMaps;
      customStore.oldFixedMaps = fixedMaps;
      customStore.oldVisibleMaps = visibleMaps;
      reactData.customColumnList = collectColumn.slice(0);
      customStore.visible = true;
      initStore.custom = true;
      checkCustomStatus();
      calcMaxHeight();
      return (0, _vue.nextTick)().then(() => calcMaxHeight());
    };
    const closeCustom = () => {
      const {
        customStore
      } = reactData;
      const customOpts = computeCustomOpts.value;
      if (customStore.visible) {
        customStore.visible = false;
        if (!customOpts.immediate) {
          $xeTable.handleCustom();
        }
      }
      return (0, _vue.nextTick)();
    };
    const customMethods = {
      openCustom,
      closeCustom
    };
    const checkCustomStatus = () => {
      const {
        customStore
      } = reactData;
      const {
        collectColumn
      } = internalData;
      const customOpts = computeCustomOpts.value;
      const {
        checkMethod
      } = customOpts;
      customStore.isAll = collectColumn.every(column => (checkMethod ? !checkMethod({
        column
      }) : false) || column.renderVisible);
      customStore.isIndeterminate = !customStore.isAll && collectColumn.some(column => (!checkMethod || checkMethod({
        column
      })) && (column.renderVisible || column.halfVisible));
    };
    const emitCustomEvent = (type, evnt) => {
      const comp = $xeGrid || $xeTable;
      comp.dispatchEvent('custom', {
        type
      }, evnt);
    };
    const customPrivateMethods = {
      checkCustomStatus,
      emitCustomEvent,
      triggerCustomEvent(evnt) {
        const {
          customStore
        } = $xeTable.reactData;
        if (customStore.visible) {
          closeCustom();
          emitCustomEvent('close', evnt);
        } else {
          customStore.btnEl = evnt.target;
          openCustom();
          emitCustomEvent('open', evnt);
        }
      },
      customOpenEvent(evnt) {
        const {
          customStore
        } = reactData;
        if (!customStore.visible) {
          customStore.activeBtn = true;
          customStore.btnEl = evnt.target;
          $xeTable.openCustom();
          $xeTable.emitCustomEvent('open', evnt);
        }
      },
      customCloseEvent(evnt) {
        const {
          customStore
        } = reactData;
        if (customStore.visible) {
          customStore.activeBtn = false;
          $xeTable.closeCustom();
          $xeTable.emitCustomEvent('close', evnt);
        }
      }
    };
    return Object.assign(Object.assign({}, customMethods), customPrivateMethods);
  },
  setupGrid($xeGrid) {
    return $xeGrid.extendTableMethods(tableCustomMethodKeys);
  }
});