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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

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; }

import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import isEqual from 'lodash/isEqual';
import PlateNumberItem from './PlateNumberItem';
import Keyboard from './CustomKeyboard';
/** 最大可输入车牌号码长度 */

var plateNumberLength = 8;

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

  function PlateNumberInput(_props) {
    var _this;

    _classCallCheck(this, PlateNumberInput);

    _this = _possibleConstructorReturn(this, _getPrototypeOf(PlateNumberInput).call(this, _props));

    _defineProperty(_assertThisInitialized(_this), "updateValueAndCompleted", function (props) {
      var value = props.value,
          onChange = props.onChange;

      var plateNumber = _this.transformValue(value);

      _this.setState({
        plateNumber: plateNumber
      });

      if (onChange) {
        onChange({
          value: plateNumber,
          completed: _this.validateCompleted(plateNumber)
        });
      }
    });

    _defineProperty(_assertThisInitialized(_this), "onKeyboardClick", function (value) {
      var _this$state = _this.state,
          plateNumber = _this$state.plateNumber,
          focusIndex = _this$state.focusIndex,
          energyActivated = _this$state.energyActivated;
      var newPlateNumber = plateNumber.concat();

      if (value === 'delete') {
        var currentValue = newPlateNumber[focusIndex];
        if (!currentValue && focusIndex === 0) return;

        if (currentValue || focusIndex === 0) {
          newPlateNumber[focusIndex] = '';
        } else if (focusIndex > 0) {
          newPlateNumber[focusIndex - 1] = '';

          _this.plateNumberItemRefArr[focusIndex].onInputBlur();

          _this.plateNumberItemRefArr[focusIndex - 1].onFakeInputClick();
        }
      } else {
        var maxNextIndex = plateNumberLength - (energyActivated ? 1 : 2);
        newPlateNumber[focusIndex] = value;

        if (focusIndex < maxNextIndex) {
          _this.plateNumberItemRefArr[focusIndex].onInputBlur();

          _this.plateNumberItemRefArr[focusIndex + 1].onFakeInputClick();
        }
      }

      var onChange = _this.props.onChange;

      if (onChange) {
        onChange({
          value: newPlateNumber,
          completed: _this.validateCompleted(newPlateNumber)
        });
      }
    });

    _defineProperty(_assertThisInitialized(_this), "changeStateFunc", function (params) {
      if (params.focusIndex === plateNumberLength - 1) {
        _this.setState({
          energyActivated: true
        });
      }

      _this.setState(_objectSpread({}, params));
    });

    _defineProperty(_assertThisInitialized(_this), "savePlateNumberItem", function (index) {
      return function (el) {
        _this.plateNumberItemRefArr[index] = el;
      };
    });

    _this.plateNumberItemRefArr = [];
    _this.customKeyboard = null;
    _this.state = {
      keyboardType: 'province',
      keyboardVisible: false,
      focusIndex: 0,
      energyActivated: false,
      plateNumber: _this.transformValue([])
    };
    return _this;
  }

  _createClass(PlateNumberInput, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      var defaultFocusIndex = this.props.defaultFocusIndex;

      if (typeof defaultFocusIndex === 'number') {
        if (this.plateNumberItemRefArr[defaultFocusIndex]) {
          this.plateNumberItemRefArr[defaultFocusIndex].onFakeInputClick();
        }
      }

      this.updateValueAndCompleted(this.props);
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      var oldValue = this.props.value;
      var value = nextProps.value;

      if (!isEqual(value, oldValue)) {
        this.updateValueAndCompleted(nextProps);
      }
    }
  }, {
    key: "transformValue",
    value: function transformValue(value) {
      var plateNumber = value.map(function (item) {
        return item.toLocaleUpperCase();
      });
      var fillArr = Array(plateNumberLength - plateNumber.length).fill('');
      return plateNumber.concat(fillArr);
    }
  }, {
    key: "validateCompleted",
    value: function validateCompleted() {
      var plateNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
      var specialStr = plateNumber[plateNumber.length - 1];
      var completed = false;

      if (specialStr) {
        completed = plateNumber.every(function (value) {
          return !!value.trim();
        });
      } else {
        completed = plateNumber.slice(0, -1).every(function (value) {
          return !!value.trim();
        });
      }

      return completed;
    }
    /**
     * 输入规则:
     * 1、默认定位第一位，输入完后光标自动跳到下一位。输入完第七位时，固定在第七位位置。
     *    第八位需手动点击才能输入，激活后无需多次激活(光标可自动跳到该位置)。
     * 2、可以点击任一位进行输入和修改，光标在输入完后会自动跳到下一位。
     * 3、点击删除时，如果当前位置有值，则删除当前位置内容;如果当前位置没有值时，则删除前一位置内容。
     */

  }, {
    key: "render",
    value: function render() {
      var prefixCls = 'eh-plate-number';
      var _this$props = this.props,
          itemClassName = _this$props.itemClassName,
          useBodyScroll = _this$props.useBodyScroll;
      var _this$state2 = this.state,
          keyboardVisible = _this$state2.keyboardVisible,
          keyboardType = _this$state2.keyboardType,
          plateNumber = _this$state2.plateNumber,
          focusIndex = _this$state2.focusIndex;
      var HKDisabled = true;

      if (focusIndex === 6 && plateNumber[0] === '粤' && plateNumber[1] === 'Z') {
        HKDisabled = false;
      }

      var separatorIcon = React.createElement("i", {
        key: "separator-icon",
        className: "".concat(prefixCls, "-separator")
      });
      var plateNumberListEl = [];

      for (var index = 0; index < plateNumberLength; index++) {
        var className = "".concat(prefixCls, "-item-content");
        var childrenEl = null;

        if (index === plateNumberLength - 1) {
          className = "".concat(prefixCls, "-item-energy");
          childrenEl = React.createElement(Fragment, null, React.createElement("svg", {
            className: "".concat(prefixCls, "-leaf"),
            viewBox: "0 0 32 35",
            version: "1.1",
            xmlns: "http://www.w3.org/2000/svg",
            xmlnsXlink: "http://www.w3.org/1999/xlink"
          }, React.createElement("g", {
            stroke: "none",
            strokeWidth: "1",
            fillRule: "evenodd"
          }, React.createElement("g", {
            fill: "#CCCCCC"
          }, React.createElement("path", {
            d: "M24.8310099,23 L26.3310495,23 L26.3310495,27.8089505 L31.14,27.8089505 L31.14,29.3089901 L26.3310495,29.3089901 L26.3310495,34.14 L24.8310099,34.14 L24.8310099,29.3089901 L20,29.3089901 L20,27.8089505 L24.8310099,27.8089505 L24.8310099,23 Z M28.9694625,0.822833886 L28.9694392,0.822834977 C29.0889254,1.30773844 28.8499529,1.80980662 28.393932,2.03402083 C28.3752966,2.04367599 24.6153166,4.18604813 24.6153166,13.9474122 C24.6153166,17.9156819 23.4094921,21.0214242 21.0307292,23.1788155 C18.0369959,25.8940603 13.7124707,26.6053236 10.0051085,26.6053236 C9.23216133,26.6048623 8.45951216,26.5755176 7.68885298,26.5173543 C7.67815691,26.5167106 7.66747111,26.5159134 7.65679895,26.5149631 C7.053873,26.4612697 6.60957977,25.9394151 6.66444307,25.3493643 C6.71930809,24.7593135 7.25254971,24.3245079 7.85547569,24.3781996 C11.4970657,24.6463985 16.4760246,24.3857092 19.5410112,21.6060967 C21.4527911,19.8703139 22.4229318,17.2934597 22.4229318,13.9463385 C22.4229318,7.69623328 23.89623,4.15386332 25.2445611,2.22175905 C18.9775623,2.53716085 8.59541345,4.02834627 4.21827054,10.2119382 C1.99407245,13.3530827 1.61368964,17.4286319 3.06506384,22.3398886 C5.0930414,18.4263315 8.54169944,13.4882549 14.1411099,9.83538704 C14.6453638,9.50496609 15.3250103,9.6390655 15.661545,10.1325513 C15.9980796,10.6260371 15.8621503,11.292243 15.3578964,11.6205184 C5.48329005,18.0626539 2.69016205,29.0813341 2.66714176,29.1907592 C2.52560811,29.73519 1.97923259,30.0808614 1.41385848,29.9836622 C0.816977074,29.8810426 0.418110886,29.3243222 0.522966585,28.7401851 C0.531736217,28.7004917 0.870463279,27.2919115 1.74413793,25.1752865 C1.71892524,25.1291563 1.6805581,25.0948268 1.66192263,25.0444054 C-0.782612479,18.5518485 -0.529389335,13.1503243 2.41501483,8.99002431 C8.08348615,0.982680462 22.123668,0.0354022437 27.897375,0 L27.9039522,0 C28.4107856,0.000238026449 28.8513705,0.340475044 28.9694625,0.822833886 Z"
          })))));
        }

        plateNumberListEl.push(React.createElement(PlateNumberItem, {
          key: index,
          index: index,
          ref: this.savePlateNumberItem(index),
          prefixCls: prefixCls,
          className: className,
          itemClassName: itemClassName,
          value: plateNumber[index].trim(),
          changePropsFunc: this.changeStateFunc
        }, childrenEl));
      }

      plateNumberListEl.splice(2, 0, separatorIcon);
      return React.createElement("div", {
        className: prefixCls
      }, React.createElement("div", {
        className: "".concat(prefixCls, "-container")
      }, plateNumberListEl), React.createElement(Keyboard, {
        useBodyScroll: useBodyScroll,
        visible: keyboardVisible,
        type: keyboardType,
        numberDisabled: focusIndex === 1,
        specialDisabled: focusIndex < 6,
        HKDisabled: HKDisabled,
        onClick: this.onKeyboardClick
      }));
    }
  }]);

  return PlateNumberInput;
}(Component);

_defineProperty(PlateNumberInput, "propTypes", {
  // 是否使用 html 的 body 作为滚动容器
  useBodyScroll: PropTypes.bool,
  itemClassName: PropTypes.string,
  value: PropTypes.arrayOf(PropTypes.string),
  defaultFocusIndex: PropTypes.number,
  onChange: PropTypes.func
});

_defineProperty(PlateNumberInput, "defaultProps", {
  value: [],
  useBodyScroll: false
});

PlateNumberInput.buildValueStr = function () {
  var plateNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
  if (!plateNumber.length) return '';

  var hasNonEmptyValue = function hasNonEmptyValue(arr) {
    return arr.some(function (value) {
      return !!value.trim();
    });
  };

  var plateNumberStr = '';
  plateNumber.forEach(function (str, index) {
    if (str === '' && hasNonEmptyValue(plateNumber.slice(index + 1))) {
      plateNumberStr += ' ';
    } else {
      plateNumberStr = "".concat(plateNumberStr).concat(str);
    }
  });
  return plateNumberStr;
};

export default PlateNumberInput;