zent/lib/sweetalert/index.js

一套前端设计语言和基于React的实现

'use strict';

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

var _defineProperty2 = require('babel-runtime/helpers/defineProperty');

var _defineProperty3 = _interopRequireDefault(_defineProperty2);

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');

var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

exports.alert = alert;
exports.confirm = confirm;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _button = require('../button');

var _button2 = _interopRequireDefault(_button);

var _dialog = require('../dialog');

var _dialog2 = _interopRequireDefault(_dialog);

var _icon = require('../icon');

var _icon2 = _interopRequireDefault(_icon);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _isPromise = require('../utils/isPromise');

var _isPromise2 = _interopRequireDefault(_isPromise);

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

var openDialog = _dialog2['default'].openDialog;


var titleIconMap = {
  info: 'info-circle-o',
  success: 'check-circle-o',
  error: 'close-circle-o',
  warning: 'error-circle-o'
};

var commonProps = {
  closeBtn: false,
  maskClosable: false
};

var ActionButton = function (_ref) {
  (0, _inherits3['default'])(ActionButton, _ref);

  function ActionButton() {
    var _ref2;

    var _temp, _this, _ret;

    (0, _classCallCheck3['default'])(this, ActionButton);

    for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    return _ret = (_temp = (_this = (0, _possibleConstructorReturn3['default'])(this, (_ref2 = ActionButton.__proto__ || Object.getPrototypeOf(ActionButton)).call.apply(_ref2, [this].concat(args))), _this), _this.state = {
      loading: false
    }, _this.onClick = function () {
      var _this$props = _this.props,
          callback = _this$props.onClick,
          getClose = _this$props.getClose;

      var close = getClose();

      // callback没传，直接关闭
      if (!callback) {
        return close();
      }

      var callbackHasArgs = callback.length > 0;
      var value = callbackHasArgs ? callback(close) : callback();

      // 返回值是个Promise，resolve后自动关闭
      if ((0, _isPromise2['default'])(value)) {
        _this.setState({
          loading: true
        });
        value.then(function () {
          // 马上就关闭了，没必要setState({loading: true})
          close();
        }, function () {
          _this.setState({
            loading: false
          });
        });
        return;
      }

      // callback无参数并且返回值不是false的时候自动关闭
      if (!callbackHasArgs && value !== false) {
        close();
      }
    }, _temp), (0, _possibleConstructorReturn3['default'])(_this, _ret);
  }

  (0, _createClass3['default'])(ActionButton, [{
    key: 'render',
    value: function render() {
      var _props = this.props,
          className = _props.className,
          type = _props.type,
          children = _props.children;
      var loading = this.state.loading;


      return _react2['default'].createElement(
        _button2['default'],
        {
          type: type,
          className: className,
          loading: loading,
          onClick: this.onClick
        },
        children
      );
    }
  }]);
  return ActionButton;
}(_react.PureComponent || _react.Component);

ActionButton.propTypes = {
  getClose: _propTypes2['default'].func.isRequired,
  onClick: _propTypes2['default'].func,
  className: _propTypes2['default'].string.isRequired,
  type: _propTypes2['default'].string.isRequired,
  children: _propTypes2['default'].node
};


function getTitle(title, type, prefix) {
  if (!type) {
    return title;
  }

  var icon = titleIconMap[type];
  return _react2['default'].createElement(
    'div',
    { className: prefix + '-sweetalert-icon-title' },
    _react2['default'].createElement(_icon2['default'], { className: prefix + '-sweetalert-type-icon', type: icon }),
    title
  );
}

function alert() {
  var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var className = config.className,
      prefix = config.prefix,
      title = config.title,
      type = config.type,
      content = config.content,
      confirmText = config.confirmText,
      onConfirm = config.onConfirm,
      confirmType = config.confirmType,
      otherProps = (0, _objectWithoutProperties3['default'])(config, ['className', 'prefix', 'title', 'type', 'content', 'confirmText', 'onConfirm', 'confirmType']);

  prefix = prefix || 'zent';
  title = getTitle(title, type, prefix) || '提示';
  className = className || '';
  confirmText = confirmText || '我知道了';
  confirmType = confirmType || 'primary';

  var close = openDialog((0, _extends3['default'])({}, commonProps, {
    prefix: prefix,
    className: (0, _classnames2['default'])(prefix + '-sweetalert-alert', (0, _defineProperty3['default'])({}, className, !!className)),
    title: title,
    children: content,
    footer: _react2['default'].createElement(
      ActionButton,
      {
        type: confirmType,
        className: prefix + '-sweetalert-alert-btn-confirm',
        getClose: function getClose() {
          return close;
        },
        onClick: onConfirm
      },
      confirmText
    )
  }, otherProps));

  return close;
}
var info = exports.info = alert;

function confirm() {
  var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var className = config.className,
      prefix = config.prefix,
      title = config.title,
      type = config.type,
      content = config.content,
      confirmText = config.confirmText,
      onConfirm = config.onConfirm,
      confirmType = config.confirmType,
      cancelText = config.cancelText,
      onCancel = config.onCancel,
      otherProps = (0, _objectWithoutProperties3['default'])(config, ['className', 'prefix', 'title', 'type', 'content', 'confirmText', 'onConfirm', 'confirmType', 'cancelText', 'onCancel']);

  className = className || '';
  prefix = prefix || 'zent';
  title = getTitle(title, type, prefix) || '请确认';
  confirmText = confirmText || '确定';
  cancelText = cancelText || '取消';
  confirmType = confirmType || 'primary';

  var close = openDialog((0, _extends3['default'])({}, commonProps, {
    prefix: prefix,
    className: (0, _classnames2['default'])(prefix + '-sweetalert-confirm', (0, _defineProperty3['default'])({}, className, !!className)),
    title: title,
    children: content,
    footer: [_react2['default'].createElement(
      ActionButton,
      {
        key: 'ok',
        type: confirmType,
        className: prefix + '-sweetalert-confirm-btn-confirm',
        getClose: function getClose() {
          return close;
        },
        onClick: onConfirm
      },
      confirmText
    ), _react2['default'].createElement(
      ActionButton,
      {
        key: 'cancel',
        type: 'default',
        className: prefix + '-sweetalert-confirm-btn-cancel',
        getClose: function getClose() {
          return close;
        },
        onClick: onCancel
      },
      cancelText
    )]
  }, otherProps));

  return close;
}

exports['default'] = {
  alert: alert,
  info: info,
  confirm: confirm
};