choerodon-ui/lib/table/ColumnFilterMenuItem.js

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

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _react = _interopRequireWildcard(require("react"));

var _checkbox = _interopRequireDefault(require("../checkbox"));

var _inputNumber = _interopRequireDefault(require("../input-number"));

var _util = require("./util");

var sortInputStyle = {
  width: '60px'
};
var sortInputWrapStyle = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, sortInputStyle), {}, {
  display: 'inline-block'
});
var sortInputWrapStyleCenter = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, sortInputWrapStyle), {}, {
  textAlign: 'center'
});

var ColumnFilterMenuItem = /*#__PURE__*/function (_Component) {
  (0, _inherits2["default"])(ColumnFilterMenuItem, _Component);

  var _super = (0, _createSuper2["default"])(ColumnFilterMenuItem);

  function ColumnFilterMenuItem(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, ColumnFilterMenuItem);
    _this = _super.call(this, props); // 修改是否 lock (fixedLeft)

    _this.handleFixedLeftChange = function (e) {
      var customColumn = _this.state.customColumn;
      var fixedLeft = e.target.checked ? 1 : 0;

      _this.setState({
        customColumn: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, customColumn), {}, {
          fixedLeft: fixedLeft,
          fixedRight: fixedLeft === 1 ? 0 : customColumn.fixedRight
        })
      });
    }; // 修改是否隐藏


    _this.handleHiddenChange = function (e) {
      var customColumn = _this.state.customColumn;
      var hidden = e.target.checked ? 0 : 1;

      _this.setState({
        customColumn: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, customColumn), {}, {
          hidden: hidden
        })
      });
    }; // 修改排序


    _this.handleOrderSeqChange = function (value) {
      var customColumn = _this.state.customColumn;

      _this.setState({
        customColumn: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, customColumn), {}, {
          orderSeq: value
        })
      });
    }; // 获取校验的数据


    _this.getValidateCustomColumn = function () {
      var customColumn = _this.state.customColumn;
      return Promise.resolve(customColumn);
    };

    var customColumn = props.customColumn || {
      hidden: 0,
      fixedLeft: 0,
      fixedRight: 0,
      orderSeq: props.index,
      fieldKey: (0, _util.getColumnKey)(props.column, props.index)
    };
    _this.state = {
      customColumn: customColumn,
      prevCustomColumn: customColumn
    };
    return _this;
  }

  (0, _createClass2["default"])(ColumnFilterMenuItem, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          column = _this$props.column,
          checkboxPrefixCls = _this$props.checkboxPrefixCls,
          inputNumberProps = _this$props.inputNumberProps;
      var customColumn = this.state.customColumn;
      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
        style: sortInputWrapStyleCenter
      }, /*#__PURE__*/_react["default"].createElement(_checkbox["default"], {
        prefixCls: checkboxPrefixCls,
        style: sortInputStyle,
        checked: customColumn.hidden !== 1,
        onChange: this.handleHiddenChange
      })), /*#__PURE__*/_react["default"].createElement("div", {
        className: "dropdown-menu-text"
      }, column.title), /*#__PURE__*/_react["default"].createElement("div", {
        style: sortInputWrapStyleCenter
      }, /*#__PURE__*/_react["default"].createElement(_checkbox["default"], {
        prefixCls: checkboxPrefixCls,
        name: "fixedLeft",
        checked: customColumn.fixedLeft === 1,
        onChange: this.handleFixedLeftChange
      })), /*#__PURE__*/_react["default"].createElement("div", {
        style: sortInputWrapStyle
      }, /*#__PURE__*/_react["default"].createElement(_inputNumber["default"], (0, _extends2["default"])({}, inputNumberProps, {
        name: "orderSeq",
        style: sortInputStyle,
        min: 0,
        step: 1,
        precision: 0,
        value: customColumn.orderSeq,
        onChange: this.handleOrderSeqChange
      }))));
    }
  }], [{
    key: "getDerivedStateFromProps",
    value: function getDerivedStateFromProps(nextProps, prevState) {
      var customColumn = nextProps.customColumn;
      var prevCustomColumn = prevState.prevCustomColumn;

      if (customColumn && prevCustomColumn !== customColumn) {
        return {
          customColumn: customColumn,
          prevCustomColumn: customColumn
        };
      }

      return null;
    }
  }]);
  return ColumnFilterMenuItem;
}(_react.Component);

var _default = ColumnFilterMenuItem;
exports["default"] = _default;
//# sourceMappingURL=ColumnFilterMenuItem.js.map