choerodon-ui/pro/es/performance-table/TableStore.js

An enterprise-class UI design language and React-based implementation

import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _extends from "@babel/runtime/helpers/extends";
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import { __decorate } from "tslib";
import React from 'react';
import { action, computed, get as _get, observable, runInAction, set } from 'mobx';
import isString from 'lodash/isString';
import isNumber from 'lodash/isNumber';
import isObject from 'lodash/isObject';
import isUndefined from 'lodash/isUndefined';
import sortBy from 'lodash/sortBy';
import debounce from 'lodash/debounce';
import isNil from 'lodash/isNil';
import isPlainObject from 'lodash/isPlainObject';
import { math } from 'choerodon-ui/dataset';
import { Size } from '../../../es/_util/enum';
import { isCalcSize, toPx } from '../../../es/_util/UnitConvertor';
import CustomizationColumnHeader from './customization-settings/CustomizationColumnHeader';
import CustomizationSettings from './customization-settings';
import { getColumnKey } from './utils';
import Column from './Column';
import autobind from '../_util/autobind';
import { $l } from '../locale-context';
import { ColumnLock, TableAutoHeightType, TableHeightType } from '../table/enum';
export function getRowSelection(props) {
  return props.rowSelection || {};
}
export function mergeDefaultProps(originalColumns, customizedColumns) {
  var parent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
  var defaultKey = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [0];
  var columnSort = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {
    left: 0,
    center: 0,
    right: 0
  };
  var columns = [];
  var leftColumns = [];
  var rightColumns = [];
  originalColumns.forEach(function (column) {
    if (isPlainObject(column)) {
      var newColumn = _objectSpread(_objectSpread({}, Column.defaultProps), column);

      if (isNil(getColumnKey(newColumn))) {
        newColumn.key = "anonymous-".concat(defaultKey[0]++);
      }

      var children = newColumn.children;

      if (customizedColumns) {
        var customized = customizedColumns[getColumnKey(newColumn).toString()];

        if (customized) {
          var width = customized.width;

          if (width && math.isBigNumber(width)) {
            customized.width = width.toNumber();
          }

          _extends(newColumn, customized);
        }
      }

      if (parent) {
        newColumn.fixed = parent.fixed;
      }

      if (children) {
        // @ts-ignore
        var childrenColumns = mergeDefaultProps(children, customizedColumns, newColumn, defaultKey);
        newColumn.children = childrenColumns;
        newColumn.width = childrenColumns.reduce(function (prev, current) {
          return prev + current.width;
        }, 0);
      }

      if (parent || !newColumn.fixed) {
        if (newColumn.sort === undefined) {
          newColumn.sort = columnSort.center;
        }

        columnSort.center++;
        columns.push(newColumn);
      } else if (newColumn.fixed === true || newColumn.fixed === ColumnLock.left) {
        if (newColumn.sort === undefined) {
          newColumn.sort = columnSort.left;
        }

        columnSort.left++;
        leftColumns.push(newColumn);
      } else {
        if (newColumn.sort === undefined) {
          newColumn.sort = columnSort.right;
        }

        columnSort.right++;
        rightColumns.push(newColumn);
      }
    }
  }, []);

  if (parent) {
    return sortBy(columns, function (_ref) {
      var sort = _ref.sort;
      return sort;
    });
  }

  return [].concat(_toConsumableArray(sortBy(leftColumns, function (_ref2) {
    var sort = _ref2.sort;
    return sort;
  })), _toConsumableArray(sortBy(columns, function (_ref3) {
    var sort = _ref3.sort;
    return sort;
  })), _toConsumableArray(sortBy(rightColumns, function (_ref4) {
    var sort = _ref4.sort;
    return sort;
  })));
}

var TableStore = /*#__PURE__*/function () {
  function TableStore(node) {
    var _this = this;

    _classCallCheck(this, TableStore);

    this.highlightRowIndexs = [];
    this.checkboxPropsCache = {};
    this.saveCustomizedDebounce = debounce(this.saveCustomized, 1000);

    this.setCheckboxPropsCache = function (cache) {
      return _this.checkboxPropsCache = cache;
    };

    runInAction(function () {
      _this.node = node;
      _this.rowZIndex = [];
      _this.customizedActiveKey = ['columns'];
      _this.tempCustomized = {
        columns: {}
      };
      _this.customized = {
        columns: {}
      };
      _this.selectedRowKeys = getRowSelection(_this.node.props).selectedRowKeys || [];
      _this.selectionDirty = false;

      if (_this.customizable) {
        _this.loadCustomized().then(_this.handleLoadCustomized);
      }
    });
  }

  _createClass(TableStore, [{
    key: "queryBar",
    get: function get() {
      return this.node.props.queryBar;
    }
    /**
     * 表头支持编辑
     */

  }, {
    key: "columnTitleEditable",
    get: function get() {
      if ('columnTitleEditable' in this.node.props) {
        return this.node.props.columnTitleEditable;
      }

      return this.getConfig('performanceTableColumnTitleEditable') === true;
    }
  }, {
    key: "dataSet",
    get: function get() {
      var queryBar = this.queryBar;

      if (queryBar) {
        return queryBar.dataSet;
      }
    }
  }, {
    key: "tableColumnResizeTrigger",
    get: function get() {
      return this.getConfig('tableColumnResizeTrigger');
    } // @computed
    // get selectedRowKeys(): string[] {
    //   const { queryBar } = this.node.props;
    //   return queryBar && queryBar.dataSet;
    // }

  }, {
    key: "loadCustomized",
    value: function () {
      var _loadCustomized = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
        var _this2 = this;

        var customizedCode, tableCustomizedLoad, customized;
        return _regeneratorRuntime.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                customizedCode = this.node.props.customizedCode;

                if (!(this.customizable && customizedCode)) {
                  _context.next = 12;
                  break;
                }

                tableCustomizedLoad = this.getConfig('tableCustomizedLoad') || this.getConfig('customizedLoad');
                runInAction(function () {
                  _this2.loading = true;
                });
                _context.prev = 4;
                _context.next = 7;
                return tableCustomizedLoad(customizedCode, 'PerformanceTable');

              case 7:
                customized = _context.sent;
                runInAction(function () {
                  _this2.customized = _objectSpread({
                    columns: {}
                  }, customized);
                });

              case 9:
                _context.prev = 9;
                runInAction(function () {
                  _this2.loading = false;
                });
                return _context.finish(9);

              case 12:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this, [[4,, 9, 12]]);
      }));

      function loadCustomized() {
        return _loadCustomized.apply(this, arguments);
      }

      return loadCustomized;
    }()
  }, {
    key: "updateProps",
    value: function updateProps(props, node) {
      this.node = node;
      this.originalColumns = props.columns;
      this.originalChildren = props.children;

      if (this.customizable && props.columns) {
        this.loadCustomized().then(this.handleLoadCustomized);
      }
    }
  }, {
    key: "prefixCls",
    get: function get() {
      var classPrefix = this.node.props.classPrefix;
      return classPrefix;
    }
  }, {
    key: "proPrefixCls",
    get: function get() {
      return this.node.context.getProPrefixCls('table');
    }
  }, {
    key: "columnHideable",
    get: function get() {
      if ('columnHideable' in this.node.props) {
        return this.node.props.columnHideable;
      }

      return this.getConfig('performanceTableColumnHideable') !== false;
    }
  }, {
    key: "customizable",
    get: function get() {
      var customizedCode = this.node.props.customizedCode;

      if (customizedCode && (this.columnTitleEditable || this.columnDraggable || this.columnHideable)) {
        if ('customizable' in this.node.props) {
          return this.node.props.customizable;
        }

        return this.getConfig('performanceTableCustomizable') || this.node.context.getCustomizable('PerformanceTable');
      }

      return false;
    }
  }, {
    key: "autoHeight",
    get: function get() {
      var autoHeight = this.node.props.autoHeight;

      if (isUndefined(autoHeight)) {
        var config = this.getConfig('performanceTableAutoHeight');

        if (isObject(config)) {
          return _objectSpread({
            type: TableAutoHeightType.minHeight,
            diff: 0
          }, config);
        }

        return !!config;
      } else if (isObject(autoHeight)) {
        return {
          type: autoHeight.type || TableAutoHeightType.minHeight,
          diff: autoHeight.diff || 0
        };
      }

      return !!autoHeight;
    }
  }, {
    key: "heightType",
    get: function get() {
      var tempHeightType = _get(this.tempCustomized, 'heightType');

      if (tempHeightType !== undefined) {
        return tempHeightType;
      }

      var heightType = this.customized.heightType;

      if (heightType !== undefined) {
        return heightType;
      }

      return this.originalHeightType;
    }
  }, {
    key: "originalHeightType",
    get: function get() {
      var _this$node$props = this.node.props,
          height = _this$node$props.height,
          autoHeight = _this$node$props.autoHeight;

      if (autoHeight) {
        return TableHeightType.flex;
      }

      if (height) {
        if (isString(height) && isCalcSize(height)) {
          return TableHeightType.flex;
        }

        if (isNumber(toPx(height))) {
          return TableHeightType.fixed;
        }
      }

      return TableHeightType.auto;
    }
  }, {
    key: "openCustomizationModal",
    value: function openCustomizationModal(modal) {
      var customizedCode = this.node.props.customizedCode;
      var modalProps = {
        drawer: true,
        size: Size.small,
        title: $l('Table', 'customization_settings'),
        children: /*#__PURE__*/React.createElement(CustomizationSettings, null),
        bodyStyle: {
          overflow: 'hidden auto',
          padding: 0
        }
      };

      if (customizedCode) {
        modalProps.okText = $l('Table', 'save_button');
      }

      modal.open(modalProps);
    }
  }, {
    key: "customizedColumnHeader",
    value: function customizedColumnHeader() {
      return /*#__PURE__*/React.createElement(CustomizationColumnHeader, {
        onHeaderClick: this.openCustomizationModal
      });
    }
  }, {
    key: "initColumns",
    value: function initColumns() {
      var customized = this.customized,
          customizable = this.customizable;
      var _this$node$props$colu = this.node.props.columns,
          columns = _this$node$props$colu === void 0 ? [] : _this$node$props$colu;
      var customizedColumns = customizable ? customized.columns : undefined;
      this.originalColumns = mergeDefaultProps(columns, customizedColumns);
      this.node._cacheCells = null;
      this.node.forceUpdate();
    }
  }, {
    key: "handleLoadCustomized",
    value: function handleLoadCustomized() {
      this.initColumns();
    }
  }, {
    key: "changeCustomizedColumnValue",
    value: function changeCustomizedColumnValue(columnKey, value) {
      var columns = this.customized.columns;

      var oldCustomized = _get(columns, columnKey);

      set(columns, columnKey, _objectSpread(_objectSpread({}, oldCustomized), value));
      this.saveCustomizedDebounce();
    }
  }, {
    key: "saveCustomized",
    value: function saveCustomized(customized) {
      if (this.customizable) {
        var customizedCode = this.node.props.customizedCode;

        if (customized) {
          this.customized = customized;
        }

        this.node.forceUpdate();

        if (customizedCode) {
          var tableCustomizedSave = this.getConfig('tableCustomizedSave') || this.getConfig('customizedSave');
          tableCustomizedSave(customizedCode, this.customized, 'PerformanceTable');
        }
      }
    }
  }, {
    key: "columnDraggable",
    get: function get() {
      if ('columnDraggable' in this.node.props) {
        return this.node.props.columnDraggable;
      }

      return this.getConfig('performanceTableColumnDraggable') === true;
    }
  }, {
    key: "getConfig",
    value: function getConfig(key) {
      return this.node.context.getConfig(key);
    }
  }]);

  return TableStore;
}();

export { TableStore as default };

__decorate([observable], TableStore.prototype, "props", void 0);

__decorate([observable], TableStore.prototype, "originalColumns", void 0);

__decorate([observable], TableStore.prototype, "customizedActiveKey", void 0);

__decorate([observable], TableStore.prototype, "tempCustomized", void 0);

__decorate([observable], TableStore.prototype, "customized", void 0);

__decorate([observable], TableStore.prototype, "totalHeight", void 0);

__decorate([observable], TableStore.prototype, "height", void 0);

__decorate([observable], TableStore.prototype, "loading", void 0);

__decorate([observable], TableStore.prototype, "rowZIndex", void 0);

__decorate([observable], TableStore.prototype, "selectedRowKeys", void 0);

__decorate([computed], TableStore.prototype, "columnTitleEditable", null);

__decorate([action], TableStore.prototype, "updateProps", null);

__decorate([computed], TableStore.prototype, "prefixCls", null);

__decorate([computed], TableStore.prototype, "proPrefixCls", null);

__decorate([computed], TableStore.prototype, "columnHideable", null);

__decorate([computed], TableStore.prototype, "customizable", null);

__decorate([computed], TableStore.prototype, "autoHeight", null);

__decorate([computed], TableStore.prototype, "heightType", null);

__decorate([computed], TableStore.prototype, "originalHeightType", null);

__decorate([autobind, action], TableStore.prototype, "openCustomizationModal", null);

__decorate([autobind], TableStore.prototype, "customizedColumnHeader", null);

__decorate([action], TableStore.prototype, "initColumns", null);

__decorate([autobind, action], TableStore.prototype, "handleLoadCustomized", null);

__decorate([action], TableStore.prototype, "changeCustomizedColumnValue", null);

__decorate([action], TableStore.prototype, "saveCustomized", null);

__decorate([computed], TableStore.prototype, "columnDraggable", null);

__decorate([autobind], TableStore.prototype, "getConfig", null);
//# sourceMappingURL=TableStore.js.map