dh-c/dist/modal/confirm.js

The front-end development engineers jimberton gulp react component

'use strict';

exports.__esModule = true;
exports.default = confirm;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

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

var _reactDom2 = _interopRequireDefault(_reactDom);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

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

var _icon2 = _interopRequireDefault(_icon);

var _action_button = require('./action_button');

var _action_button2 = _interopRequireDefault(_action_button);

var _modal = require('./modal');

var _modal2 = _interopRequireDefault(_modal);

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

function confirm(config) {
  var _classNames;

  var props = config;
  var prefixCls = props.prefixCls || 'dh-modal';
  var div = document.createElement('div');
  document.body.appendChild(div);

  var width = props.width || 360;
  var style = props.style || {};

  var maskClosable = props.maskClosable === undefined ? true : props.maskClosable;

  function close() {
    var unmountResult = _reactDom2.default.unmountComponentAtNode(div);
    if (unmountResult && div.parentNode) {
      div.parentNode.removeChild(div);
    }

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

    var triggerCancel = args && args.length && args.some(function (param) {
      return param && param.triggerCancel;
    });
    if (props.onCancel && triggerCancel) {
      props.onCancel.apply(props, args);
    }
  }

  var body = _react2.default.createElement(
    'div',
    { className: prefixCls + '-confirm-body' },
    _react2.default.createElement(_icon2.default, { type: props.iconType, style: { color: '#ffbf00' } }),
    '\xA0\xA0',
    _react2.default.createElement(
      'span',
      { className: prefixCls + '-content' },
      props.content
    )
  );

  var footer = null;
  if (props.onCancel) {
    footer = _react2.default.createElement(
      'div',
      { className: prefixCls + '-footer-wapper' },
      _react2.default.createElement(
        _action_button2.default,
        { actionFn: props.onOk, closeModal: close, autoFocus: true },
        props.okText || '确定'
      ),
      _react2.default.createElement(
        _action_button2.default,
        { actionFn: props.onCancel, closeModal: close },
        props.cancelText || '取消'
      )
    );
  } else {
    footer = _react2.default.createElement(
      'div',
      { className: prefixCls + '-footer-wapper' },
      _react2.default.createElement(
        _action_button2.default,
        { actionFn: props.onOk, closeModal: close, autoFocus: true },
        props.okText || '确定'
      )
    );
  }

  var classString = (0, _classnames2.default)(prefixCls, (_classNames = {}, _classNames[prefixCls + '-' + props.type] = true, _classNames), props.className);
  _reactDom2.default.render(_react2.default.createElement(
    _modal2.default,
    {
      className: classString,
      onCancel: close.bind(this, { triggerCancel: true }),
      visible: true,
      title: props.title,
      transitionName: 'zoom',
      footer: footer,
      maskTransitionName: 'fade',
      maskClosable: maskClosable,
      style: style,
      width: width
    },
    body
  ), div);

  return {
    destroy: close
  };
}