1 | import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties';
|
2 | import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
3 | import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
4 | import _inherits from 'babel-runtime/helpers/inherits';
|
5 | import _extends from 'babel-runtime/helpers/extends';
|
6 |
|
7 | var _class, _temp2;
|
8 |
|
9 | import React, { Component } from 'react';
|
10 | import ReactDOM from 'react-dom';
|
11 | import PropTypes from 'prop-types';
|
12 | import cx from 'classnames';
|
13 | import ConfigProvider from '../config-provider';
|
14 | import Message from '../message';
|
15 | import zhCN from '../locale/zh-cn';
|
16 | import dialog from './dialog';
|
17 | import dialog2 from './dialog-v2';
|
18 |
|
19 | var Dialog = ConfigProvider.config(dialog);
|
20 | var Dialog2 = ConfigProvider.config(dialog2);
|
21 |
|
22 | var noop = function noop() {};
|
23 | var MESSAGE_TYPE = {
|
24 | alert: 'warning',
|
25 | confirm: 'help',
|
26 |
|
27 | success: 'success',
|
28 | error: 'error',
|
29 | warning: 'warning',
|
30 | notice: 'notice',
|
31 | help: 'help'
|
32 | };
|
33 |
|
34 | export var ModalInner = function ModalInner(_ref) {
|
35 | var type = _ref.type,
|
36 | _ref$messageProps = _ref.messageProps,
|
37 | messageProps = _ref$messageProps === undefined ? {} : _ref$messageProps,
|
38 | title = _ref.title,
|
39 | rtl = _ref.rtl,
|
40 | _ref$prefix = _ref.prefix,
|
41 | prefix = _ref$prefix === undefined ? 'next-' : _ref$prefix,
|
42 | content = _ref.content;
|
43 |
|
44 | return React.createElement(
|
45 | Message,
|
46 | _extends({
|
47 | size: 'large',
|
48 | shape: 'addon',
|
49 | type: MESSAGE_TYPE[type]
|
50 | }, messageProps, {
|
51 | title: title,
|
52 | rtl: rtl,
|
53 | className: cx(prefix + 'dialog-message', messageProps.className)
|
54 | }),
|
55 | content
|
56 | );
|
57 | };
|
58 |
|
59 | var Modal = (_temp2 = _class = function (_Component) {
|
60 | _inherits(Modal, _Component);
|
61 |
|
62 | function Modal() {
|
63 | var _temp, _this, _ret;
|
64 |
|
65 | _classCallCheck(this, Modal);
|
66 |
|
67 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
68 | args[_key] = arguments[_key];
|
69 | }
|
70 |
|
71 | return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
|
72 | visible: true,
|
73 | loading: false
|
74 | }, _this.close = function () {
|
75 | _this.setState({
|
76 | visible: false
|
77 | });
|
78 | }, _this.loading = function (loading) {
|
79 | _this.setState({
|
80 | loading: loading
|
81 | });
|
82 | }, _temp), _possibleConstructorReturn(_this, _ret);
|
83 | }
|
84 |
|
85 | Modal.prototype.wrapper = function wrapper(fn, callback) {
|
86 | var _this2 = this;
|
87 |
|
88 | return function () {
|
89 | var res = fn.apply(undefined, arguments);
|
90 | if (res && res.then) {
|
91 | _this2.loading(true);
|
92 |
|
93 | res.then(function (result) {
|
94 | _this2.loading(false);
|
95 |
|
96 | if (result !== false) {
|
97 | return callback();
|
98 | }
|
99 | }).catch(function (e) {
|
100 | _this2.loading(false);
|
101 | throw e;
|
102 | });
|
103 | } else if (res !== false) {
|
104 | return callback();
|
105 | }
|
106 | };
|
107 | };
|
108 |
|
109 | Modal.prototype.render = function render() {
|
110 | var _props = this.props,
|
111 | prefix = _props.prefix,
|
112 | type = _props.type,
|
113 | title = _props.title,
|
114 | content = _props.content,
|
115 | messageProps = _props.messageProps,
|
116 | footerActions = _props.footerActions,
|
117 | onOk = _props.onOk,
|
118 | onCancel = _props.onCancel,
|
119 | onClose = _props.onClose,
|
120 | okProps = _props.okProps,
|
121 | needWrapper = _props.needWrapper,
|
122 | rtl = _props.rtl,
|
123 | className = _props.className,
|
124 | v2 = _props.v2,
|
125 | _props$width = _props.width,
|
126 | width = _props$width === undefined ? 420 : _props$width,
|
127 | others = _objectWithoutProperties(_props, ['prefix', 'type', 'title', 'content', 'messageProps', 'footerActions', 'onOk', 'onCancel', 'onClose', 'okProps', 'needWrapper', 'rtl', 'className', 'v2', 'width']);
|
128 |
|
129 | var newTitle = needWrapper && type ? null : title;
|
130 |
|
131 | var newContent = needWrapper && type ? React.createElement(ModalInner, {
|
132 | type: type,
|
133 | messageProps: messageProps,
|
134 | title: title,
|
135 | rtl: rtl,
|
136 | prefix: prefix,
|
137 | content: content
|
138 | }) : content;
|
139 |
|
140 | var newFooterActions = footerActions || (type === 'confirm' ? ['ok', 'cancel'] : ['alert', 'success', 'error', 'notice', 'warning', 'help'].indexOf(type) > -1 ? ['ok'] : undefined);
|
141 | var newOnOk = this.wrapper(onOk, this.close);
|
142 | var newOnCancel = this.wrapper(onCancel, this.close);
|
143 | var newOnClose = this.wrapper(onClose, this.close);
|
144 |
|
145 | var _state = this.state,
|
146 | visible = _state.visible,
|
147 | loading = _state.loading;
|
148 |
|
149 |
|
150 |
|
151 | var newOkProps = _extends({}, okProps);
|
152 | if (!('loading' in okProps)) {
|
153 | newOkProps.loading = loading;
|
154 | }
|
155 |
|
156 | var classNames = cx(prefix + 'dialog-quick', className);
|
157 |
|
158 | var Tag = v2 ? Dialog2 : Dialog;
|
159 |
|
160 | return React.createElement(
|
161 | Tag,
|
162 | _extends({
|
163 | prefix: prefix,
|
164 | role: 'alertdialog'
|
165 | }, others, {
|
166 | visible: visible,
|
167 | title: newTitle,
|
168 | rtl: rtl,
|
169 | footerActions: newFooterActions,
|
170 | onOk: this.state.loading ? noop : newOnOk,
|
171 | onCancel: newOnCancel,
|
172 | onClose: newOnClose,
|
173 | okProps: newOkProps,
|
174 | className: classNames,
|
175 | width: v2 ? width : undefined
|
176 | }),
|
177 | newContent
|
178 | );
|
179 | };
|
180 |
|
181 | return Modal;
|
182 | }(Component), _class.propTypes = {
|
183 | prefix: PropTypes.string,
|
184 | pure: PropTypes.bool,
|
185 | rtl: PropTypes.bool,
|
186 | type: PropTypes.oneOf(['alert', 'confirm', 'success', 'error', 'notice', 'warning', 'help']),
|
187 | title: PropTypes.node,
|
188 | content: PropTypes.node,
|
189 | messageProps: PropTypes.object,
|
190 | footerActions: PropTypes.array,
|
191 | |
192 |
|
193 |
|
194 |
|
195 |
|
196 | onOk: PropTypes.func,
|
197 | |
198 |
|
199 |
|
200 |
|
201 |
|
202 | onCancel: PropTypes.func,
|
203 | |
204 |
|
205 |
|
206 |
|
207 |
|
208 | onClose: PropTypes.func,
|
209 | okProps: PropTypes.object,
|
210 | locale: PropTypes.object,
|
211 | needWrapper: PropTypes.bool,
|
212 | className: PropTypes.string
|
213 | }, _class.defaultProps = {
|
214 | prefix: 'next-',
|
215 | pure: false,
|
216 | messageProps: {},
|
217 | onOk: noop,
|
218 | onCancel: noop,
|
219 | onClose: noop,
|
220 | okProps: {},
|
221 | locale: zhCN.Dialog,
|
222 | needWrapper: true
|
223 | }, _temp2);
|
224 | Modal.displayName = 'Modal';
|
225 |
|
226 |
|
227 | var ConfigModal = ConfigProvider.config(Modal, { componentName: 'Dialog' });
|
228 |
|
229 |
|
230 |
|
231 |
|
232 |
|
233 |
|
234 |
|
235 | var _show = function _show() {
|
236 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
237 |
|
238 | var container = document.createElement('div');
|
239 | var unmount = function unmount() {
|
240 | if (config.afterClose) {
|
241 | config.afterClose();
|
242 | }
|
243 | ReactDOM.unmountComponentAtNode(container);
|
244 | container.parentNode.removeChild(container);
|
245 | };
|
246 |
|
247 | document.body.appendChild(container);
|
248 | var newContext = config.contextConfig;
|
249 | if (!newContext) newContext = ConfigProvider.getContext();
|
250 |
|
251 | var instance = void 0,
|
252 | myRef = void 0;
|
253 |
|
254 | ReactDOM.render(React.createElement(
|
255 | ConfigProvider,
|
256 | newContext,
|
257 | React.createElement(ConfigModal, _extends({}, config, {
|
258 | afterClose: unmount,
|
259 | ref: function ref(_ref2) {
|
260 | myRef = _ref2;
|
261 | }
|
262 | }))
|
263 | ), container, function () {
|
264 | instance = myRef;
|
265 | });
|
266 | return {
|
267 | hide: function hide() {
|
268 | var inc = instance && instance.getInstance();
|
269 | inc && inc.close();
|
270 | }
|
271 | };
|
272 | };
|
273 |
|
274 | export { _show as show };
|
275 | var methodFactory = function methodFactory(type) {
|
276 | return function () {
|
277 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
278 |
|
279 | config.type = type;
|
280 | return _show(config);
|
281 | };
|
282 | };
|
283 |
|
284 |
|
285 |
|
286 |
|
287 |
|
288 |
|
289 |
|
290 | var _alert = methodFactory('alert');
|
291 |
|
292 | export { _alert as alert };
|
293 | var _success = methodFactory('success');
|
294 | export { _success as success };
|
295 | var _error = methodFactory('error');
|
296 | export { _error as error };
|
297 | var _notice = methodFactory('notice');
|
298 | export { _notice as notice };
|
299 | var _warning = methodFactory('warning');
|
300 | export { _warning as warning };
|
301 | var _help = methodFactory('help');
|
302 |
|
303 |
|
304 |
|
305 |
|
306 |
|
307 |
|
308 |
|
309 | export { _help as help };
|
310 | var _confirm = methodFactory('confirm');
|
311 |
|
312 | export { _confirm as confirm };
|
313 | export var withContext = function withContext(WrappedComponent) {
|
314 | var HOC = function HOC(props) {
|
315 | return React.createElement(
|
316 | ConfigProvider.Consumer,
|
317 | null,
|
318 | function (contextConfig) {
|
319 | return React.createElement(WrappedComponent, _extends({}, props, {
|
320 | contextDialog: {
|
321 | show: function show() {
|
322 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
323 | return _show(_extends({}, config, { contextConfig: contextConfig }));
|
324 | },
|
325 | alert: function alert() {
|
326 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
327 | return _alert(_extends({}, config, { contextConfig: contextConfig }));
|
328 | },
|
329 | confirm: function confirm() {
|
330 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
331 | return _confirm(_extends({}, config, { contextConfig: contextConfig }));
|
332 | },
|
333 | success: function success() {
|
334 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
335 | return _success(_extends({}, config, { contextConfig: contextConfig }));
|
336 | },
|
337 | error: function error() {
|
338 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
339 | return _error(_extends({}, config, { contextConfig: contextConfig }));
|
340 | },
|
341 | warning: function warning() {
|
342 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
343 | return _warning(_extends({}, config, { contextConfig: contextConfig }));
|
344 | },
|
345 | notice: function notice() {
|
346 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
347 | return _notice(_extends({}, config, { contextConfig: contextConfig }));
|
348 | },
|
349 | help: function help() {
|
350 | var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
351 | return _help(_extends({}, config, { contextConfig: contextConfig }));
|
352 | }
|
353 | }
|
354 | }));
|
355 | }
|
356 | );
|
357 | };
|
358 | return HOC;
|
359 | }; |
\ | No newline at end of file |