qm-bus/lib/SafeBox/index.js

千米公有云业务组件库

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = undefined;

var _row = require('antd/lib/row');

var _row2 = _interopRequireDefault(_row);

var _col = require('antd/lib/col');

var _col2 = _interopRequireDefault(_col);

var _button = require('antd/lib/button');

var _button2 = _interopRequireDefault(_button);

var _input = require('antd/lib/input');

var _input2 = _interopRequireDefault(_input);

var _form = require('antd/lib/form');

var _form2 = _interopRequireDefault(_form);

var _createClass = 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); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _webapi = require('./webapi');

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

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

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

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

var FormItem = _form2.default.Item;

/**
 * @class
 * @author yyp[of1643]
 * @date 17.05.11
 * @description 安全组件
 */
var SafeBox = function (_Component) {
  _inherits(SafeBox, _Component);

  function SafeBox(props) {
    _classCallCheck(this, SafeBox);

    var _this2 = _possibleConstructorReturn(this, (SafeBox.__proto__ || Object.getPrototypeOf(SafeBox)).call(this, props));

    _this2.mCodeChange = function (e) {
      _this2.setState({
        mobileCode: e.target.value
      });
    };

    _this2.sendCode = function () {
      (0, _webapi.sendSafeSmsCode)().then(function (res) {
        _this2.setState({ submitDisabled: false, err: '', errNum: 0 });
        _this2.countDown(60);
      });
    };

    _this2.checkCode = function () {
      var _this2$state = _this2.state,
          mobileCode = _this2$state.mobileCode,
          errNum = _this2$state.errNum;

      if (mobileCode == null || mobileCode == '') {
        _this2.setState({ err: '验证码不能为空' });
        return;
      }
      var close = _this2.props.close;


      (0, _webapi.checkSmsCode)(mobileCode).then(function (res) {
        var data = res.data;
        if (data != null) {
          switch (data) {
            case -1:
              //过期
              _this2.setState({ err: '验证码错误或已过期，请重新发送', submitDisabled: true });
              break;
            case 0:
              //验证错误
              var num = errNum + 1;
              _this2.setState({ err: '第' + num + '次验证失败', errNum: num });
              break;
            case 1:
              //验证成功
              close();
              break;
            case 2:
              //超过最大错误次数
              _this2.setState({ err: '超过最大错误次数，请重新发送验证', submitDisabled: true });
              break;
          }
        }
      });
    };

    _this2.countDown = function (t) {
      var _this = _this2;
      var resetTimes = t;
      if (resetTimes == 0) {
        _this2.setState({ sendCodeDisabled: false, sendButtonMsg: '重新发送' });
      } else {
        _this2.setState({ sendCodeDisabled: true, sendButtonMsg: --resetTimes + 's后重发' });
        setTimeout(function () {
          _this.countDown(resetTimes);
        }, 1000);
      }
    };

    _this2.state = {
      mobileCode: '',
      err: '',
      submitDisabled: false,
      errNum: 0,
      time: props.time ? props.time : null, //倒计时时间
      sendCodeDisabled: false,
      sendButtonMsg: '发送验证码'
    };
    return _this2;
  }

  _createClass(SafeBox, [{
    key: 'componentWillMount',
    value: function componentWillMount() {
      var time = this.state.time;

      if (time != null && time != 0) {
        this.countDown(time);
      }
    }
  }, {
    key: 'render',
    value: function render() {
      var _state = this.state,
          mobileCode = _state.mobileCode,
          err = _state.err,
          submitDisabled = _state.submitDisabled,
          sendCodeDisabled = _state.sendCodeDisabled,
          sendButtonMsg = _state.sendButtonMsg;

      return _react2.default.createElement(
        'div',
        { className: 'modal-body-main' },
        _react2.default.createElement(
          _form2.default,
          null,
          _react2.default.createElement(
            FormItem,
            {
              label: '\u77ED\u4FE1\u9A8C\u8BC1\u7801',
              help: err,
              validateStatus: err != '' ? 'error' : '',
              labelCol: { span: 6 },
              wrapperCol: { span: 14 } },
            _react2.default.createElement(_input2.default, {
              value: mobileCode,
              onChange: this.mCodeChange,
              id: 'mobileCode',
              type: 'text',
              style: { width: '150px' }
            }),
            _react2.default.createElement(
              _button2.default,
              {
                id: 'sendCodeBtn',
                className: 'pushl',
                type: 'ghost',
                disabled: sendCodeDisabled,
                onClick: this.sendCode },
              sendButtonMsg
            )
          ),
          _react2.default.createElement(
            _row2.default,
            null,
            _react2.default.createElement(
              _col2.default,
              { span: '14', offset: '6' },
              _react2.default.createElement(
                'p',
                { className: 'inline-tips lh-default' },
                '\u5982\u679C1\u5206\u949F\u5185\u6CA1\u6709\u6536\u5230\u9A8C\u8BC1\u77ED\u4FE1\uFF0C\u8BF7\u70B9\u51FB\u91CD\u65B0\u53D1\u9001\u6309\u94AE\uFF0C\u9A8C\u8BC1\u78015\u5206\u949F\u5185\u6709\u6548'
              )
            )
          ),
          _react2.default.createElement(
            'div',
            { className: 'modal-footer-main' },
            _react2.default.createElement(
              _button2.default,
              { size: 'large', type: 'primary', disabled: submitDisabled, onClick: this.checkCode },
              '\u63D0\u4EA4'
            )
          )
        )
      );
    }

    // 手机验证码输入框


    // 发送手机验证码


    // 校验验证码


    // 重发发送短信验证码

  }]);

  return SafeBox;
}(_react.Component);

exports.default = SafeBox;