"use strict";

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

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

var _reactDom = require("react-dom");

var _classnames = _interopRequireDefault(require("classnames"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _rmcFeedback = _interopRequireDefault(require("rmc-feedback"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; return newObj; } }

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var prefixCls = 'parking-keyboard';

var KeyboardItem = function KeyboardItem(props) {
  var children = props.children,
      disabled = props.disabled,
      _onClick = props.onClick;
  var activeClassName = (0, _classnames["default"])(_defineProperty({}, "".concat(prefixCls, "-item-active"), !disabled));
  var contentClassName = (0, _classnames["default"])('keyboard-item-content', {
    'keyboard-item-disabled': disabled
  });
  return _react["default"].createElement(_rmcFeedback["default"], {
    activeClassName: activeClassName
  }, _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-flexbox-item"),
    onClick: function onClick(e) {
      if (!disabled && _onClick) {
        _onClick(e, children);
      }
    }
  }, _react["default"].createElement("div", {
    className: "keyboard-item"
  }, _react["default"].createElement("span", {
    className: contentClassName
  }, children))));
};

var Keyboard =
/*#__PURE__*/
function (_Component) {
  _inherits(Keyboard, _Component);

  function Keyboard(props) {
    var _this;

    _classCallCheck(this, Keyboard);

    _this = _possibleConstructorReturn(this, _getPrototypeOf(Keyboard).call(this, props));

    _defineProperty(_assertThisInitialized(_this), "onKeyboardClick", function (e, value) {
      e.nativeEvent.stopImmediatePropagation();
      var onClick = _this.props.onClick;

      if (onClick) {
        onClick(value);
      }
    });

    _defineProperty(_assertThisInitialized(_this), "renderKeyboardItem", function (item, index, disabled) {
      return _react["default"].createElement(KeyboardItem, {
        key: "item-".concat(item, "-").concat(index),
        disabled: disabled,
        onClick: _this.onKeyboardClick
      }, item);
    });

    _defineProperty(_assertThisInitialized(_this), "renderDeleteIcon", function () {
      return _react["default"].createElement(_rmcFeedback["default"], {
        key: "keyboard-delete",
        activeClassName: "".concat(prefixCls, "-item-active")
      }, _react["default"].createElement("div", {
        className: "".concat(prefixCls, "-delete"),
        onClick: function onClick(e) {
          return _this.onKeyboardClick(e, 'delete');
        }
      }, _react["default"].createElement("div", {
        className: "keyboard-delete-container"
      }, _react["default"].createElement("div", {
        className: "keyboard-item-content keyboard-delete"
      }, _react["default"].createElement("svg", {
        viewBox: "0 0 44 32",
        version: "1.1",
        xmlns: "http://www.w3.org/2000/svg",
        xmlnsXlink: "http://www.w3.org/1999/xlink"
      }, _react["default"].createElement("g", {
        stroke: "none",
        strokeWidth: "1",
        fill: "none",
        fillRule: "evenodd"
      }, _react["default"].createElement("g", {
        transform: "translate(19.000000, 8.000000)"
      }), _react["default"].createElement("path", {
        d: "M43.998,9.73268351 L43.998,14.0006835 L43.998,18.0006835 L43.998,22.2686835 C43.998,22.6406835 43.998,23.0116835 43.996,23.3836835 C43.993,23.6966835 43.99,24.0096835 43.982,24.3226835 C43.963,25.0036835 43.923,25.6916835 43.802,26.3656835 C43.679,27.0496835 43.478,27.6866835 43.161,28.3086835 C42.851,28.9196835 42.444,29.4786835 41.96,29.9626835 C41.475,30.4486835 40.916,30.8536835 40.305,31.1646835 C39.684,31.4816835 39.047,31.6816835 38.363,31.8046835 C37.689,31.9256835 37.001,31.9666835 36.319,31.9846835 C36.006,31.9926835 35.694,31.9966835 35.381,31.9986835 C35.009,32.0006835 34.637,32.0006835 34.266,32.0006835 L33.96,32.0006835 L17.998,32.0006835 C16.622,32.0246835 15.458,31.4616835 14.998,31.0006835 L0.228,16.5476835 C0.075,16.3966835 -3.90798505e-14,16.1986835 -3.90798505e-14,16.0006835 C-3.90798505e-14,15.8036835 0.075,15.6046835 0.228,15.4536835 L14.998,1.00068351 C15.458,0.539683509 16.622,-0.0223164913 17.998,0.00068350871 L33.96,0.00068350871 L29.998,0.00268350871 L34.266,0.00068350871 C34.637,0.00068350871 35.009,0.00068350871 35.381,0.00268350871 C35.694,0.00468350871 36.006,0.00868350871 36.319,0.0166835087 C37.001,0.0356835087 37.689,0.0756835087 38.363,0.196683509 C39.047,0.319683509 39.684,0.520683509 40.305,0.836683509 C40.916,1.14768351 41.475,1.55368351 41.96,2.03868351 C42.444,2.52368351 42.851,3.08268351 43.161,3.69368351 C43.478,4.31468351 43.679,4.95168351 43.802,5.63668351 C43.923,6.30968351 43.963,6.99768351 43.982,7.67968351 C43.99,7.99168351 43.993,8.30468351 43.996,8.61768351 C43.998,8.98968351 43.998,9.36168351 43.998,9.73268351 Z M40.8123845,6.9997817 C40.77384,4.79322802 38.943028,3.0041062 36.7467518,3.00367095 L29.225374,3.00218037 L17.7014053,3.00009091 C17.4244868,3.0000407 17.039492,3.15506069 16.8400469,3.34773703 L3.74259352,16.000689 L16.8400469,28.6547673 C17.0388435,28.8468342 17.4204132,29.0025083 17.6970968,29.0024744 L37.0029994,29.0001101 C39.2104819,28.9998398 40.9996853,27.2099344 40.9992977,25.005597 L40.998,17.6257057 L40.8123845,6.9997817 Z M34.5993301,21.1273534 C35.2819971,21.81177 35.2819971,22.918597 34.5986506,23.6036922 C33.9149135,24.2856806 32.8080865,24.2856806 32.1235762,23.6029198 L26.9979531,18.4754843 L21.8706506,23.6036922 C21.1869135,24.2856806 20.0800865,24.2856806 19.3949913,23.6023341 C18.7130029,22.918597 18.7130029,21.81177 19.3957168,21.1273066 L24.5231992,16.0007303 L19.3949913,10.8743341 C18.7130029,10.190597 18.7130029,9.08377 19.3963494,8.39867482 C20.0800865,7.71668641 21.1869135,7.71668641 21.8713301,8.39935342 L26.9979532,13.5259765 L32.1243494,8.39867482 C32.8080865,7.71668641 33.9149135,7.71668641 34.6000087,8.4000329 C35.2819971,9.08377 35.2819971,10.190597 34.5992832,10.8750605 L29.4727071,16.0007304 L34.5993301,21.1273534 Z",
        fill: "#333333"
      })))))));
    });

    _defineProperty(_assertThisInitialized(_this), "saveRef", function (el) {
      _this.keyboardContainer = el;
    });

    _this.clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    _this.containerDom = document.createElement('div');
    var containerKey = "parking-keyboard-".concat(new Date().getTime());

    _this.containerDom.setAttribute('id', containerKey);

    _this.keyboardContainer = null;
    _this.state = {};
    return _this;
  }

  _createClass(Keyboard, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      document.body.appendChild(this.containerDom);
    } // 检测键盘弹起后是否会遮挡车牌输入框并做对应处理

  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      if (nextProps.visible !== this.props.visible) {
        if (nextProps.visible) {
          var plateNumberContainer = document.querySelector('.eh-plate-number');

          var _plateNumberContainer = plateNumberContainer.getBoundingClientRect(),
              height = _plateNumberContainer.height,
              top = _plateNumberContainer.top;

          var _this$keyboardContain = this.keyboardContainer.getBoundingClientRect(),
              keyboardHeight = _this$keyboardContain.height,
              keyboardTop = _this$keyboardContain.top; // 由于 componentWillReceiveProps 处于未重新渲染的状态，所以此时计算以键盘弹起之前的坐标计算


          if (keyboardTop - this.clientHeight - top - height < 50) {
            var bodyScrollHeight = document.body.scrollHeight;
            var scrollHeight = bodyScrollHeight - this.clientHeight;
            var paddingBottom = 0;

            if (scrollHeight < 0) {
              paddingBottom = Math.abs(scrollHeight) + keyboardHeight + 30;
            } else if (scrollHeight - keyboardHeight < 30) {
              var bodyScroll = nextProps.useBodyScroll ? 30 : 0;
              paddingBottom = keyboardHeight - scrollHeight + bodyScroll;
            }

            document.body.style.paddingBottom = "".concat(paddingBottom, "px");
            plateNumberContainer.scrollIntoView();
          }
        } else {
          document.body.style.removeProperty('padding-bottom');
        }
      }
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      document.body.style.removeProperty('padding-bottom');
      document.body.removeChild(this.containerDom);
    }
  }, {
    key: "renderProvince",
    // 省份简称
    value: function renderProvince() {
      var _this2 = this;

      var provinceNameArr = '京沪粤川鄂闽津渝苏浙豫陕冀辽吉皖湘鲁晋黑赣贵甘桂琼云青蒙藏宁新台'.split('');
      var eleItemList = [];
      provinceNameArr.forEach(function (item, index) {
        eleItemList.push(_this2.renderKeyboardItem(item, index));
      });
      var blankEl = [];

      for (var i = 0; i < 8; i++) {
        blankEl.push(_react["default"].createElement("div", {
          className: "".concat(prefixCls, "-flexbox-item"),
          key: "blank-".concat(i)
        }));
      }

      var flexEl = [];
      var firstRow = eleItemList.slice(0, 6);
      var lastRow = eleItemList.slice(26);
      firstRow.unshift(blankEl[0], blankEl[1]);
      firstRow.push(blankEl[2], blankEl[3]);
      lastRow.unshift(blankEl[4], blankEl[5]);
      lastRow.push(this.renderDeleteIcon());
      flexEl.push(firstRow);
      flexEl.push(eleItemList.slice(6, 16));
      flexEl.push(eleItemList.slice(16, 26));
      flexEl.push(lastRow);
      return flexEl.map(function (item, index) {
        return _react["default"].createElement("div", {
          className: "".concat(prefixCls, "-flexbox"),
          key: "flex-".concat(index)
        }, item);
      });
    } // 字母和数字

  }, {
    key: "renderAlphabetAndNum",
    value: function renderAlphabetAndNum() {
      var _this3 = this;

      var _this$props = this.props,
          numberDisabled = _this$props.numberDisabled,
          HKDisabled = _this$props.HKDisabled,
          specialDisabled = _this$props.specialDisabled;
      var numberList = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'];
      var numberRow = numberList.map(function (num, index) {
        return _this3.renderKeyboardItem(num, index, numberDisabled);
      });
      /* eslint-disable */

      var uppercaseAlphabetArr = Array(26).fill(0).map(function (_, i) {
        // 车牌没有大写字母 I 和 O
        if (i !== 8 && i !== 14) {
          return String.fromCharCode(i + 65);
        }
      });
      /* eslint-enable */

      var eleItemList = [];
      uppercaseAlphabetArr.forEach(function (item, index) {
        if (item) {
          eleItemList.push(_this3.renderKeyboardItem(item, index));
        }
      });
      var flexEl = [];
      var lastRow = eleItemList.slice(20);
      lastRow.unshift(_react["default"].createElement("div", {
        className: "".concat(prefixCls, "-flexbox-item"),
        key: "blank-4"
      }));
      ['学'].forEach(function (item, index) {
        lastRow.push(_this3.renderKeyboardItem(item, index, specialDisabled));
      });
      ['港', '澳'].forEach(function (item, index) {
        lastRow.push(_this3.renderKeyboardItem(item, index, HKDisabled));
      });
      lastRow.push(this.renderDeleteIcon());
      flexEl.push(numberRow);
      flexEl.push(eleItemList.slice(0, 10));
      flexEl.push(eleItemList.slice(10, 20));
      flexEl.push(lastRow);
      return flexEl.map(function (item, index) {
        return _react["default"].createElement("div", {
          className: "".concat(prefixCls, "-flexbox"),
          key: "flex-".concat(index)
        }, item);
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _classNames2;

      var _this$props2 = this.props,
          visible = _this$props2.visible,
          type = _this$props2.type;
      var className = (0, _classnames["default"])((_classNames2 = {}, _defineProperty(_classNames2, prefixCls, true), _defineProperty(_classNames2, "".concat(prefixCls, "-hide"), !visible), _classNames2));
      var transformStyle = "translateY(".concat(visible ? 0 : this.clientHeight, "px)");
      var divStyle = {
        WebkitTransform: transformStyle,
        transform: transformStyle
      };

      var content = _react["default"].createElement("div", {
        className: className,
        style: divStyle
      }, _react["default"].createElement("div", {
        className: "".concat(prefixCls, "-container"),
        ref: this.saveRef
      }, _react["default"].createElement("div", {
        className: "".concat(prefixCls, "-content")
      }, type === 'province' ? this.renderProvince() : this.renderAlphabetAndNum())));

      return (0, _reactDom.createPortal)(content, this.containerDom);
    }
  }]);

  return Keyboard;
}(_react.Component);

_defineProperty(Keyboard, "propTypes", {
  visible: _propTypes["default"].bool,
  type: _propTypes["default"].oneOf(['province', 'ABC']),
  numberDisabled: _propTypes["default"].bool,
  HKDisabled: _propTypes["default"].bool,
  specialDisabled: _propTypes["default"].bool,
  onClick: _propTypes["default"].func,
  useBodyScroll: _propTypes["default"].bool
});

_defineProperty(Keyboard, "defaultProps", {
  visible: false,
  type: 'ABC',
  numberDisabled: false,
  HKDisabled: true,
  useBodyScroll: false
});

var _default = Keyboard;
exports["default"] = _default;
module.exports = exports.default;