choerodon-ui/pro/lib/intl-field/IntlField.js

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

"use strict";

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

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

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

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

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

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

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

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

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));

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

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _tslib = require("tslib");

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

var _mobxReact = require("mobx-react");

var _mobx = require("mobx");

var _enum = require("../../../lib/progress/enum");

var _configure = require("../../../lib/configure");

var _KeyCode = _interopRequireDefault(require("../../../lib/_util/KeyCode"));

var _TextField2 = require("../text-field/TextField");

var _icon = _interopRequireDefault(require("../icon"));

var _ModalContainer = require("../modal-container/ModalContainer");

var _IntlList = _interopRequireDefault(require("./IntlList"));

var _localeContext = _interopRequireWildcard(require("../locale-context"));

var _progress = _interopRequireDefault(require("../progress"));

var _enum2 = require("../core/enum");

var _message = _interopRequireDefault(require("../message"));

var _exception = _interopRequireDefault(require("../_util/exception"));

var _autobind = _interopRequireDefault(require("../_util/autobind"));

var _EventManager = require("../_util/EventManager");

var _isSame = _interopRequireDefault(require("../_util/isSame"));

function _createSuper(Derived) {
  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  return function () {
    var Super = (0, _getPrototypeOf2["default"])(Derived),
        result;

    if (isNativeReflectConstruct()) {
      var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor;
      result = Reflect.construct(Super, arguments, NewTarget);
    } else {
      result = Super.apply(this, arguments);
    }

    return (0, _possibleConstructorReturn2["default"])(this, result);
  };
}

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

  var _super = _createSuper(IntlField);

  function IntlField() {
    var _this;

    (0, _classCallCheck2["default"])(this, IntlField);
    _this = _super.apply(this, arguments);
    _this.openModal =
    /*#__PURE__*/
    (0, _asyncToGenerator2["default"])(
    /*#__PURE__*/
    _regenerator["default"].mark(function _callee() {
      var _this$props, modalProps, maxLengths, _assertThisInitialize, record, lang, name, element, supports, maxLengthList;

      return _regenerator["default"].wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              if (_this.modal) {
                _context.next = 23;
                break;
              }

              _this$props = _this.props, modalProps = _this$props.modalProps, maxLengths = _this$props.maxLengths;
              _assertThisInitialize = (0, _assertThisInitialized2["default"])(_this), record = _assertThisInitialize.record, lang = _assertThisInitialize.lang, name = _assertThisInitialize.name, element = _assertThisInitialize.element;
              supports = _localeContext["default"].supports;
              maxLengthList = {};
              Object.keys(supports).map(function (key) {
                maxLengthList[key] = maxLengths && key !== lang ? maxLengths[key] || element.maxLength : element.maxLength;
                return null;
              });

              if (!record) {
                _context.next = 21;
                break;
              }

              _this.setLoading(true);

              _context.prev = 8;

              if (element && !(0, _isSame["default"])(_this.getValue(), element.value)) {
                _this.syncValueOnBlur(element.value);
              }

              _context.next = 12;
              return record.tls(name);

            case 12:
              _context.next = 18;
              break;

            case 14:
              _context.prev = 14;
              _context.t0 = _context["catch"](8);

              _message["default"].error((0, _exception["default"])(_context.t0));

              return _context.abrupt("return");

            case 18:
              _context.prev = 18;

              _this.setLoading(false);

              return _context.finish(18);

            case 21:
              _this.storeLocales();

              _this.modal = (0, _ModalContainer.open)((0, _objectSpread2["default"])({
                title: (0, _localeContext.$l)('IntlField', 'modal_title'),
                children: _react["default"].createElement(_IntlList["default"], {
                  readOnly: _this.readOnly,
                  disabled: _this.disabled,
                  record: record,
                  name: name,
                  lang: lang,
                  maxLengths: maxLengthList
                }),
                onClose: _this.handleIntlListClose,
                onOk: _this.handleIntlListOk,
                onCancel: _this.handleIntlListCancel,
                destroyOnClose: true
              }, modalProps));

            case 23:
            case "end":
              return _context.stop();
          }
        }
      }, _callee, null, [[8, 14, 18, 21]]);
    }));
    _this.handleIntlListClose =
    /*#__PURE__*/
    (0, _asyncToGenerator2["default"])(
    /*#__PURE__*/
    _regenerator["default"].mark(function _callee2() {
      return _regenerator["default"].wrap(function _callee2$(_context2) {
        while (1) {
          switch (_context2.prev = _context2.next) {
            case 0:
              delete _this.modal;

              _this.focus();

            case 2:
            case "end":
              return _context2.stop();
          }
        }
      }, _callee2);
    }));
    return _this;
  }

  (0, _createClass2["default"])(IntlField, [{
    key: "setLoading",
    value: function setLoading(loading) {
      this.loading = loading;
    }
  }, {
    key: "handleIntlListOk",
    value: function () {
      var _handleIntlListOk = (0, _asyncToGenerator2["default"])(
      /*#__PURE__*/
      _regenerator["default"].mark(function _callee3() {
        var supports, languages, record, name, field, tlsKey;
        return _regenerator["default"].wrap(function _callee3$(_context3) {
          while (1) {
            switch (_context3.prev = _context3.next) {
              case 0:
                supports = _localeContext["default"].supports;
                languages = Object.keys(supports);
                record = this.record, name = this.name, field = this.field;

                if (!(record && field)) {
                  _context3.next = 8;
                  break;
                }

                tlsKey = (0, _configure.getConfig)('tlsKey');
                _context3.next = 7;
                return Promise.all(languages.map(function (language) {
                  var intlField = record.getField("".concat(tlsKey, ".").concat(name, ".").concat(language));
                  return intlField ? intlField.checkValidity(false) : true;
                }));

              case 7:
                return _context3.abrupt("return", _context3.sent.every(Boolean));

              case 8:
              case "end":
                return _context3.stop();
            }
          }
        }, _callee3, this);
      }));

      function handleIntlListOk() {
        return _handleIntlListOk.apply(this, arguments);
      }

      return handleIntlListOk;
    }()
  }, {
    key: "handleIntlListCancel",
    value: function () {
      var _handleIntlListCancel = (0, _asyncToGenerator2["default"])(
      /*#__PURE__*/
      _regenerator["default"].mark(function _callee4() {
        var name, record, tlsKey;
        return _regenerator["default"].wrap(function _callee4$(_context4) {
          while (1) {
            switch (_context4.prev = _context4.next) {
              case 0:
                name = this.name, record = this.record;

                if (record) {
                  tlsKey = (0, _configure.getConfig)('tlsKey');
                  record.set("".concat(tlsKey, ".").concat(name), this.locales);
                }

              case 2:
              case "end":
                return _context4.stop();
            }
          }
        }, _callee4, this);
      }));

      function handleIntlListCancel() {
        return _handleIntlListCancel.apply(this, arguments);
      }

      return handleIntlListCancel;
    }()
  }, {
    key: "handleKeyDown",
    value: function handleKeyDown(e) {
      if (e.keyCode === _KeyCode["default"].DOWN) {
        (0, _EventManager.stopEvent)(e);
        this.openModal();
      }

      (0, _get2["default"])((0, _getPrototypeOf2["default"])(IntlField.prototype), "handleKeyDown", this).call(this, e);
    }
  }, {
    key: "handleBlur",
    value: function handleBlur(e) {
      if (this.modal) {
        e.preventDefault();
      }

      (0, _get2["default"])((0, _getPrototypeOf2["default"])(IntlField.prototype), "handleBlur", this).call(this, e);
    }
  }, {
    key: "storeLocales",
    value: function storeLocales() {
      var name = this.name,
          record = this.record;

      if (record) {
        var tlsKey = (0, _configure.getConfig)('tlsKey');
        this.locales = (0, _objectSpread2["default"])({}, record.get("".concat(tlsKey, ".").concat(name)));
      }
    }
  }, {
    key: "getSuffix",
    value: function getSuffix() {
      var suffix = this.props.suffix;
      return this.wrapperSuffix(this.loading ? _react["default"].createElement(_progress["default"], {
        size: _enum2.Size.small,
        type: _enum.ProgressType.loading
      }) : suffix || _react["default"].createElement(_icon["default"], {
        className: "".concat(this.prefixCls, "-intl"),
        type: "language"
      }), {
        onClick: this.openModal
      });
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      if (this.modal) {
        this.modal.close();
      }
    }
  }]);
  return IntlField;
}(_TextField2.TextField);

IntlField.displayName = 'IntlField';
(0, _tslib.__decorate)([_mobx.observable], IntlField.prototype, "loading", void 0);
(0, _tslib.__decorate)([_mobx.action], IntlField.prototype, "setLoading", null);
(0, _tslib.__decorate)([_autobind["default"]], IntlField.prototype, "handleIntlListOk", null);
(0, _tslib.__decorate)([_autobind["default"]], IntlField.prototype, "handleIntlListCancel", null);
(0, _tslib.__decorate)([_autobind["default"]], IntlField.prototype, "handleKeyDown", null);
(0, _tslib.__decorate)([_autobind["default"]], IntlField.prototype, "handleBlur", null);
IntlField = (0, _tslib.__decorate)([_mobxReact.observer], IntlField);
var _default = IntlField;
exports["default"] = _default;
//# sourceMappingURL=IntlField.js.map