ConfirmDialog.js 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. import _defineProperty from 'babel-runtime/helpers/defineProperty';
  2. import classNames from 'classnames';
  3. import Icon from '../icon';
  4. import Dialog from './Modal';
  5. import ActionButton from './ActionButton';
  6. import { getConfirmLocale } from './locale';
  7. import warning from '../_util/warning';
  8. export default {
  9. functional: true,
  10. render: function render(h, context) {
  11. var props = context.props;
  12. var onCancel = props.onCancel,
  13. onOk = props.onOk,
  14. close = props.close,
  15. zIndex = props.zIndex,
  16. afterClose = props.afterClose,
  17. visible = props.visible,
  18. keyboard = props.keyboard,
  19. centered = props.centered,
  20. getContainer = props.getContainer,
  21. maskStyle = props.maskStyle,
  22. okButtonProps = props.okButtonProps,
  23. cancelButtonProps = props.cancelButtonProps,
  24. _props$iconType = props.iconType,
  25. iconType = _props$iconType === undefined ? 'question-circle' : _props$iconType,
  26. _props$closable = props.closable,
  27. closable = _props$closable === undefined ? false : _props$closable;
  28. warning(!('iconType' in props), 'Modal', 'The property \'iconType\' is deprecated. Use the property \'icon\' instead.');
  29. var icon = props.icon ? props.icon : iconType;
  30. var okType = props.okType || 'primary';
  31. var prefixCls = props.prefixCls || 'ant-modal';
  32. var contentPrefixCls = prefixCls + '-confirm';
  33. // 默认为 true,保持向下兼容
  34. var okCancel = 'okCancel' in props ? props.okCancel : true;
  35. var width = props.width || 416;
  36. var style = props.style || {};
  37. var mask = props.mask === undefined ? true : props.mask;
  38. // 默认为 false,保持旧版默认行为
  39. var maskClosable = props.maskClosable === undefined ? false : props.maskClosable;
  40. var runtimeLocale = getConfirmLocale();
  41. var okText = props.okText || (okCancel ? runtimeLocale.okText : runtimeLocale.justOkText);
  42. var cancelText = props.cancelText || runtimeLocale.cancelText;
  43. var autoFocusButton = props.autoFocusButton === null ? false : props.autoFocusButton || 'ok';
  44. var transitionName = props.transitionName || 'zoom';
  45. var maskTransitionName = props.maskTransitionName || 'fade';
  46. var classString = classNames(contentPrefixCls, contentPrefixCls + '-' + props.type, prefixCls + '-' + props.type, props['class']);
  47. var cancelButton = okCancel && h(
  48. ActionButton,
  49. {
  50. attrs: {
  51. actionFn: onCancel,
  52. closeModal: close,
  53. autoFocus: autoFocusButton === 'cancel',
  54. buttonProps: cancelButtonProps
  55. }
  56. },
  57. [cancelText]
  58. );
  59. var iconNode = typeof icon === 'string' ? h(Icon, {
  60. attrs: { type: icon }
  61. }) : icon(h);
  62. return h(
  63. Dialog,
  64. {
  65. attrs: {
  66. prefixCls: prefixCls,
  67. wrapClassName: classNames(_defineProperty({}, contentPrefixCls + '-centered', !!centered)),
  68. visible: visible,
  69. closable: closable,
  70. title: '',
  71. transitionName: transitionName,
  72. footer: '',
  73. maskTransitionName: maskTransitionName,
  74. mask: mask,
  75. maskClosable: maskClosable,
  76. maskStyle: maskStyle,
  77. width: width,
  78. zIndex: zIndex,
  79. afterClose: afterClose,
  80. keyboard: keyboard,
  81. centered: centered,
  82. getContainer: getContainer
  83. },
  84. 'class': classString, on: {
  85. 'cancel': function cancel(e) {
  86. return close({ triggerCancel: true }, e);
  87. }
  88. },
  89. style: style },
  90. [h(
  91. 'div',
  92. { 'class': contentPrefixCls + '-body-wrapper' },
  93. [h(
  94. 'div',
  95. { 'class': contentPrefixCls + '-body' },
  96. [iconNode, props.title === undefined ? null : h(
  97. 'span',
  98. { 'class': contentPrefixCls + '-title' },
  99. [typeof props.title === 'function' ? props.title(h) : props.title]
  100. ), h(
  101. 'div',
  102. { 'class': contentPrefixCls + '-content' },
  103. [typeof props.content === 'function' ? props.content(h) : props.content]
  104. )]
  105. ), h(
  106. 'div',
  107. { 'class': contentPrefixCls + '-btns' },
  108. [cancelButton, h(
  109. ActionButton,
  110. {
  111. attrs: {
  112. type: okType,
  113. actionFn: onOk,
  114. closeModal: close,
  115. autoFocus: autoFocusButton === 'ok',
  116. buttonProps: okButtonProps
  117. }
  118. },
  119. [okText]
  120. )]
  121. )]
  122. )]
  123. );
  124. }
  125. };