1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _typeof2 = require('babel-runtime/helpers/typeof');
|
6 |
|
7 | var _typeof3 = _interopRequireDefault(_typeof2);
|
8 |
|
9 | var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
|
10 |
|
11 | var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
|
12 |
|
13 | var _extends2 = require('babel-runtime/helpers/extends');
|
14 |
|
15 | var _extends3 = _interopRequireDefault(_extends2);
|
16 |
|
17 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
18 |
|
19 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
20 |
|
21 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
22 |
|
23 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
24 |
|
25 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
26 |
|
27 | var _inherits3 = _interopRequireDefault(_inherits2);
|
28 |
|
29 | var _class, _temp, _initialiseProps;
|
30 |
|
31 | var _react = require('react');
|
32 |
|
33 | var _react2 = _interopRequireDefault(_react);
|
34 |
|
35 | var _propTypes = require('prop-types');
|
36 |
|
37 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
38 |
|
39 | var _reactLifecyclesCompat = require('react-lifecycles-compat');
|
40 |
|
41 | var _classnames6 = require('classnames');
|
42 |
|
43 | var _classnames7 = _interopRequireDefault(_classnames6);
|
44 |
|
45 | var _moment = require('moment');
|
46 |
|
47 | var _moment2 = _interopRequireDefault(_moment);
|
48 |
|
49 | var _configProvider = require('../config-provider');
|
50 |
|
51 | var _configProvider2 = _interopRequireDefault(_configProvider);
|
52 |
|
53 | var _overlay = require('../overlay');
|
54 |
|
55 | var _overlay2 = _interopRequireDefault(_overlay);
|
56 |
|
57 | var _input = require('../input');
|
58 |
|
59 | var _input2 = _interopRequireDefault(_input);
|
60 |
|
61 | var _icon = require('../icon');
|
62 |
|
63 | var _icon2 = _interopRequireDefault(_icon);
|
64 |
|
65 | var _calendar = require('../calendar');
|
66 |
|
67 | var _calendar2 = _interopRequireDefault(_calendar);
|
68 |
|
69 | var _panel = require('../time-picker/panel');
|
70 |
|
71 | var _panel2 = _interopRequireDefault(_panel);
|
72 |
|
73 | var _zhCn = require('../locale/zh-cn');
|
74 |
|
75 | var _zhCn2 = _interopRequireDefault(_zhCn);
|
76 |
|
77 | var _util = require('../util');
|
78 |
|
79 | var _util2 = require('./util');
|
80 |
|
81 | var _panelFooter = require('./module/panel-footer');
|
82 |
|
83 | var _panelFooter2 = _interopRequireDefault(_panelFooter);
|
84 |
|
85 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
86 |
|
87 | var Popup = _overlay2.default.Popup;
|
88 |
|
89 |
|
90 |
|
91 |
|
92 |
|
93 | var DatePicker = (_temp = _class = function (_Component) {
|
94 | (0, _inherits3.default)(DatePicker, _Component);
|
95 |
|
96 | function DatePicker(props, context) {
|
97 | (0, _classCallCheck3.default)(this, DatePicker);
|
98 |
|
99 | var _this = (0, _possibleConstructorReturn3.default)(this, _Component.call(this, props, context));
|
100 |
|
101 | _initialiseProps.call(_this);
|
102 |
|
103 | var _getDateTimeFormat = (0, _util2.getDateTimeFormat)(props.format, props.showTime),
|
104 | format = _getDateTimeFormat.format,
|
105 | timeFormat = _getDateTimeFormat.timeFormat,
|
106 | dateTimeFormat = _getDateTimeFormat.dateTimeFormat;
|
107 |
|
108 | _this.state = {
|
109 | value: (0, _util2.formatDateValue)(props.defaultValue, dateTimeFormat),
|
110 | dateInputStr: '',
|
111 | timeInputStr: '',
|
112 | inputing: false,
|
113 | visible: props.defaultVisible,
|
114 | inputAsString: typeof props.defaultValue === 'string',
|
115 | panel: _util2.PANEL.DATE,
|
116 | format: format,
|
117 | timeFormat: timeFormat,
|
118 | dateTimeFormat: dateTimeFormat
|
119 | };
|
120 | return _this;
|
121 | }
|
122 |
|
123 | DatePicker.getDerivedStateFromProps = function getDerivedStateFromProps(props) {
|
124 | var formatStates = (0, _util2.getDateTimeFormat)(props.format, props.showTime);
|
125 | var states = {};
|
126 |
|
127 | if ('value' in props) {
|
128 | states.value = (0, _util2.formatDateValue)(props.value, formatStates.dateTimeFormat);
|
129 | states.inputAsString = typeof props.value === 'string';
|
130 | }
|
131 |
|
132 | if ('visible' in props) {
|
133 | states.visible = props.visible;
|
134 | }
|
135 |
|
136 | return (0, _extends3.default)({}, states, formatStates);
|
137 | };
|
138 |
|
139 | DatePicker.prototype.renderPreview = function renderPreview(others) {
|
140 | var _props = this.props,
|
141 | prefix = _props.prefix,
|
142 | className = _props.className,
|
143 | renderPreview = _props.renderPreview;
|
144 | var _state = this.state,
|
145 | value = _state.value,
|
146 | dateTimeFormat = _state.dateTimeFormat;
|
147 |
|
148 | var previewCls = (0, _classnames7.default)(className, prefix + 'form-preview');
|
149 |
|
150 | var label = value ? value.format(dateTimeFormat) : '';
|
151 |
|
152 | if (typeof renderPreview === 'function') {
|
153 | return _react2.default.createElement(
|
154 | 'div',
|
155 | (0, _extends3.default)({}, others, { className: previewCls }),
|
156 | renderPreview(value, this.props)
|
157 | );
|
158 | }
|
159 |
|
160 | return _react2.default.createElement(
|
161 | 'p',
|
162 | (0, _extends3.default)({}, others, { className: previewCls }),
|
163 | label
|
164 | );
|
165 | };
|
166 |
|
167 | DatePicker.prototype.render = function render() {
|
168 | var _classnames, _classnames2, _classnames3, _classnames4, _PANEL$DATE$PANEL$TIM;
|
169 |
|
170 | var _props2 = this.props,
|
171 | prefix = _props2.prefix,
|
172 | rtl = _props2.rtl,
|
173 | locale = _props2.locale,
|
174 | label = _props2.label,
|
175 | state = _props2.state,
|
176 | defaultVisibleMonth = _props2.defaultVisibleMonth,
|
177 | onVisibleMonthChange = _props2.onVisibleMonthChange,
|
178 | showTime = _props2.showTime,
|
179 | disabledDate = _props2.disabledDate,
|
180 | footerRender = _props2.footerRender,
|
181 | placeholder = _props2.placeholder,
|
182 | size = _props2.size,
|
183 | disabled = _props2.disabled,
|
184 | hasClear = _props2.hasClear,
|
185 | popupTriggerType = _props2.popupTriggerType,
|
186 | popupAlign = _props2.popupAlign,
|
187 | popupContainer = _props2.popupContainer,
|
188 | popupStyle = _props2.popupStyle,
|
189 | popupClassName = _props2.popupClassName,
|
190 | popupProps = _props2.popupProps,
|
191 | popupComponent = _props2.popupComponent,
|
192 | popupContent = _props2.popupContent,
|
193 | followTrigger = _props2.followTrigger,
|
194 | className = _props2.className,
|
195 | inputProps = _props2.inputProps,
|
196 | dateCellRender = _props2.dateCellRender,
|
197 | monthCellRender = _props2.monthCellRender,
|
198 | yearCellRender = _props2.yearCellRender,
|
199 | dateInputAriaLabel = _props2.dateInputAriaLabel,
|
200 | timeInputAriaLabel = _props2.timeInputAriaLabel,
|
201 | isPreview = _props2.isPreview,
|
202 | disableChangeMode = _props2.disableChangeMode,
|
203 | yearRange = _props2.yearRange,
|
204 | others = (0, _objectWithoutProperties3.default)(_props2, ['prefix', 'rtl', 'locale', 'label', 'state', 'defaultVisibleMonth', 'onVisibleMonthChange', 'showTime', 'disabledDate', 'footerRender', 'placeholder', 'size', 'disabled', 'hasClear', 'popupTriggerType', 'popupAlign', 'popupContainer', 'popupStyle', 'popupClassName', 'popupProps', 'popupComponent', 'popupContent', 'followTrigger', 'className', 'inputProps', 'dateCellRender', 'monthCellRender', 'yearCellRender', 'dateInputAriaLabel', 'timeInputAriaLabel', 'isPreview', 'disableChangeMode', 'yearRange']);
|
205 | var _state2 = this.state,
|
206 | visible = _state2.visible,
|
207 | value = _state2.value,
|
208 | dateInputStr = _state2.dateInputStr,
|
209 | timeInputStr = _state2.timeInputStr,
|
210 | panel = _state2.panel,
|
211 | inputing = _state2.inputing,
|
212 | format = _state2.format,
|
213 | timeFormat = _state2.timeFormat,
|
214 | dateTimeFormat = _state2.dateTimeFormat;
|
215 |
|
216 |
|
217 | var datePickerCls = (0, _classnames7.default)((_classnames = {}, _classnames[prefix + 'date-picker'] = true, _classnames), className);
|
218 |
|
219 | var triggerInputCls = (0, _classnames7.default)((_classnames2 = {}, _classnames2[prefix + 'date-picker-input'] = true, _classnames2[prefix + 'error'] = false, _classnames2));
|
220 |
|
221 | var panelBodyClassName = (0, _classnames7.default)((_classnames3 = {}, _classnames3[prefix + 'date-picker-body'] = true, _classnames3[prefix + 'date-picker-body-show-time'] = showTime, _classnames3));
|
222 |
|
223 | var panelDateInputCls = (0, _classnames7.default)((_classnames4 = {}, _classnames4[prefix + 'date-picker-panel-input'] = true, _classnames4[prefix + 'focus'] = panel === _util2.PANEL.DATE, _classnames4));
|
224 |
|
225 | if (rtl) {
|
226 | others.dir = 'rtl';
|
227 | }
|
228 |
|
229 | if (isPreview) {
|
230 | return this.renderPreview(_util.obj.pickOthers(others, DatePicker.PropTypes));
|
231 | }
|
232 |
|
233 | var sharedInputProps = (0, _extends3.default)({}, inputProps, {
|
234 | size: size,
|
235 | disabled: disabled,
|
236 | onChange: this.onDateInputChange,
|
237 | onBlur: this.onDateInputBlur,
|
238 | onPressEnter: this.onDateInputBlur,
|
239 | onKeyDown: this.onKeyDown
|
240 | });
|
241 |
|
242 | var dateInputValue = inputing === 'date' ? dateInputStr : value && value.format(format) || '';
|
243 | var triggerInputValue = dateInputValue;
|
244 |
|
245 | var dateInput = _react2.default.createElement(_input2.default, (0, _extends3.default)({}, sharedInputProps, {
|
246 | 'aria-label': dateInputAriaLabel,
|
247 | value: dateInputValue,
|
248 | onFocus: this.onFoucsDateInput,
|
249 | placeholder: format,
|
250 | className: panelDateInputCls
|
251 | }));
|
252 |
|
253 | var datePanel = _react2.default.createElement(_calendar2.default, {
|
254 | shape: 'panel',
|
255 | value: value,
|
256 | format: format,
|
257 | dateCellRender: dateCellRender,
|
258 | monthCellRender: monthCellRender,
|
259 | yearCellRender: yearCellRender,
|
260 | onSelect: this.onSelectCalendarPanel,
|
261 | defaultVisibleMonth: defaultVisibleMonth,
|
262 | onVisibleMonthChange: onVisibleMonthChange,
|
263 | disabledDate: disabledDate,
|
264 | disableChangeMode: disableChangeMode,
|
265 | yearRange: yearRange
|
266 | });
|
267 |
|
268 | var panelFooter = footerRender();
|
269 |
|
270 | var timeInput = null;
|
271 | var timePanel = null;
|
272 |
|
273 | if (showTime) {
|
274 | var _classnames5;
|
275 |
|
276 | var timeInputValue = inputing === 'time' ? timeInputStr : value && value.format(timeFormat) || '';
|
277 | triggerInputValue = value && value.format(dateTimeFormat) || '';
|
278 |
|
279 | var timePanelProps = (typeof showTime === 'undefined' ? 'undefined' : (0, _typeof3.default)(showTime)) === 'object' ? showTime : {};
|
280 |
|
281 | var showSecond = timeFormat.indexOf('s') > -1;
|
282 | var showMinute = timeFormat.indexOf('m') > -1;
|
283 |
|
284 | var panelTimeInputCls = (0, _classnames7.default)((_classnames5 = {}, _classnames5[prefix + 'date-picker-panel-input'] = true, _classnames5[prefix + 'focus'] = panel === _util2.PANEL.TIME, _classnames5));
|
285 |
|
286 | timeInput = _react2.default.createElement(_input2.default, {
|
287 | placeholder: timeFormat,
|
288 | value: timeInputValue,
|
289 | size: size,
|
290 | 'aria-label': timeInputAriaLabel,
|
291 | disabled: disabled || !value,
|
292 | onChange: this.onTimeInputChange,
|
293 | onFocus: this.onFoucsTimeInput,
|
294 | onBlur: this.onTimeInputBlur,
|
295 | onPressEnter: this.onTimeInputBlur,
|
296 | onKeyDown: this.onTimeKeyDown,
|
297 | className: panelTimeInputCls
|
298 | });
|
299 |
|
300 | timePanel = _react2.default.createElement(_panel2.default, (0, _extends3.default)({}, timePanelProps, {
|
301 | locale: locale,
|
302 | className: prefix + 'date-picker-panel-time',
|
303 | showSecond: showSecond,
|
304 | showMinute: showMinute,
|
305 | disabled: disabled,
|
306 | prefix: prefix,
|
307 | value: value,
|
308 | onSelect: this.onSelectTimePanel
|
309 | }));
|
310 |
|
311 | panelFooter = panelFooter || _react2.default.createElement(_panelFooter2.default, {
|
312 | prefix: prefix,
|
313 | locale: locale,
|
314 | value: value,
|
315 | panel: panel,
|
316 | onPanelChange: this.changePanel,
|
317 | onOk: this.onOk
|
318 | });
|
319 | }
|
320 |
|
321 | var panelBody = (_PANEL$DATE$PANEL$TIM = {}, _PANEL$DATE$PANEL$TIM[_util2.PANEL.DATE] = datePanel, _PANEL$DATE$PANEL$TIM[_util2.PANEL.TIME] = timePanel, _PANEL$DATE$PANEL$TIM)[panel];
|
322 |
|
323 | var allowClear = value && hasClear;
|
324 | var trigger = _react2.default.createElement(
|
325 | 'div',
|
326 | { className: prefix + 'date-picker-trigger' },
|
327 | _react2.default.createElement(_input2.default, (0, _extends3.default)({}, sharedInputProps, {
|
328 | label: label,
|
329 | state: state,
|
330 | value: triggerInputValue,
|
331 | role: 'combobox',
|
332 | 'aria-expanded': visible,
|
333 | readOnly: true,
|
334 | placeholder: placeholder || (showTime ? locale.datetimePlaceholder : locale.placeholder),
|
335 | hint: _react2.default.createElement(_icon2.default, { type: 'calendar', className: prefix + 'date-picker-symbol-calendar-icon' }),
|
336 | hasClear: allowClear,
|
337 | className: triggerInputCls
|
338 | }))
|
339 | );
|
340 | var PopupComponent = popupComponent ? popupComponent : Popup;
|
341 |
|
342 | return _react2.default.createElement(
|
343 | 'div',
|
344 | (0, _extends3.default)({}, _util.obj.pickOthers(DatePicker.propTypes, others), { className: datePickerCls }),
|
345 | _react2.default.createElement(
|
346 | PopupComponent,
|
347 | (0, _extends3.default)({
|
348 | autoFocus: true,
|
349 | align: popupAlign
|
350 | }, popupProps, {
|
351 | followTrigger: followTrigger,
|
352 | disabled: disabled,
|
353 | visible: visible,
|
354 | onVisibleChange: this.onVisibleChange,
|
355 | triggerType: popupTriggerType,
|
356 | container: popupContainer,
|
357 | style: popupStyle,
|
358 | className: popupClassName,
|
359 | trigger: trigger
|
360 | }),
|
361 | popupContent ? popupContent : _react2.default.createElement(
|
362 | 'div',
|
363 | { dir: others.dir, className: panelBodyClassName },
|
364 | _react2.default.createElement(
|
365 | 'div',
|
366 | { className: prefix + 'date-picker-panel-header' },
|
367 | dateInput,
|
368 | timeInput
|
369 | ),
|
370 | panelBody,
|
371 | panelFooter
|
372 | )
|
373 | )
|
374 | );
|
375 | };
|
376 |
|
377 | return DatePicker;
|
378 | }(_react.Component), _class.propTypes = (0, _extends3.default)({}, _configProvider2.default.propTypes, {
|
379 | prefix: _propTypes2.default.string,
|
380 | rtl: _propTypes2.default.bool,
|
381 | |
382 |
|
383 |
|
384 | label: _propTypes2.default.node,
|
385 | |
386 |
|
387 |
|
388 | state: _propTypes2.default.oneOf(['success', 'loading', 'error']),
|
389 | |
390 |
|
391 |
|
392 | placeholder: _propTypes2.default.string,
|
393 | |
394 |
|
395 |
|
396 |
|
397 | defaultVisibleMonth: _propTypes2.default.func,
|
398 | onVisibleMonthChange: _propTypes2.default.func,
|
399 | |
400 |
|
401 |
|
402 | value: _util2.checkDateValue,
|
403 | |
404 |
|
405 |
|
406 | defaultValue: _util2.checkDateValue,
|
407 | |
408 |
|
409 |
|
410 | format: _propTypes2.default.string,
|
411 | |
412 |
|
413 |
|
414 | showTime: _propTypes2.default.oneOfType([_propTypes2.default.object, _propTypes2.default.bool]),
|
415 | |
416 |
|
417 |
|
418 | resetTime: _propTypes2.default.bool,
|
419 | |
420 |
|
421 |
|
422 |
|
423 |
|
424 |
|
425 | disabledDate: _propTypes2.default.func,
|
426 | |
427 |
|
428 |
|
429 |
|
430 | footerRender: _propTypes2.default.func,
|
431 | |
432 |
|
433 |
|
434 |
|
435 | onChange: _propTypes2.default.func,
|
436 | |
437 |
|
438 |
|
439 |
|
440 | onOk: _propTypes2.default.func,
|
441 | |
442 |
|
443 |
|
444 | size: _propTypes2.default.oneOf(['small', 'medium', 'large']),
|
445 | |
446 |
|
447 |
|
448 | disabled: _propTypes2.default.bool,
|
449 | |
450 |
|
451 |
|
452 | hasClear: _propTypes2.default.bool,
|
453 | |
454 |
|
455 |
|
456 | visible: _propTypes2.default.bool,
|
457 | |
458 |
|
459 |
|
460 | defaultVisible: _propTypes2.default.bool,
|
461 | |
462 |
|
463 |
|
464 |
|
465 |
|
466 | onVisibleChange: _propTypes2.default.func,
|
467 | |
468 |
|
469 |
|
470 | popupTriggerType: _propTypes2.default.oneOf(['click', 'hover']),
|
471 | |
472 |
|
473 |
|
474 | popupAlign: _propTypes2.default.string,
|
475 | |
476 |
|
477 |
|
478 |
|
479 |
|
480 | popupContainer: _propTypes2.default.any,
|
481 | |
482 |
|
483 |
|
484 | popupStyle: _propTypes2.default.object,
|
485 | |
486 |
|
487 |
|
488 | popupClassName: _propTypes2.default.string,
|
489 | |
490 |
|
491 |
|
492 | popupProps: _propTypes2.default.object,
|
493 | |
494 |
|
495 |
|
496 | followTrigger: _propTypes2.default.bool,
|
497 | |
498 |
|
499 |
|
500 | inputProps: _propTypes2.default.object,
|
501 | |
502 |
|
503 |
|
504 |
|
505 |
|
506 | dateCellRender: _propTypes2.default.func,
|
507 | |
508 |
|
509 |
|
510 |
|
511 |
|
512 | monthCellRender: _propTypes2.default.func,
|
513 | yearCellRender: _propTypes2.default.func,
|
514 | |
515 |
|
516 |
|
517 | dateInputAriaLabel: _propTypes2.default.string,
|
518 | |
519 |
|
520 |
|
521 | timeInputAriaLabel: _propTypes2.default.string,
|
522 | |
523 |
|
524 |
|
525 | isPreview: _propTypes2.default.bool,
|
526 | |
527 |
|
528 |
|
529 |
|
530 | renderPreview: _propTypes2.default.func,
|
531 | locale: _propTypes2.default.object,
|
532 | className: _propTypes2.default.string,
|
533 | name: _propTypes2.default.string,
|
534 | popupComponent: _propTypes2.default.elementType,
|
535 | popupContent: _propTypes2.default.node,
|
536 | disableChangeMode: _propTypes2.default.bool,
|
537 | yearRange: _propTypes2.default.arrayOf(_propTypes2.default.number)
|
538 | }), _class.defaultProps = {
|
539 | prefix: 'next-',
|
540 | rtl: false,
|
541 | format: 'YYYY-MM-DD',
|
542 | size: 'medium',
|
543 | showTime: false,
|
544 | resetTime: false,
|
545 | disabledDate: function disabledDate() {
|
546 | return false;
|
547 | },
|
548 | footerRender: function footerRender() {
|
549 | return null;
|
550 | },
|
551 | hasClear: true,
|
552 | popupTriggerType: 'click',
|
553 | popupAlign: 'tl tl',
|
554 | locale: _zhCn2.default.DatePicker,
|
555 | defaultVisible: false,
|
556 | onChange: _util.func.noop,
|
557 | onVisibleChange: _util.func.noop,
|
558 | onOk: _util.func.noop
|
559 | }, _initialiseProps = function _initialiseProps() {
|
560 | var _this2 = this;
|
561 |
|
562 | this.onValueChange = function (newValue) {
|
563 | var handler = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'onChange';
|
564 |
|
565 | var ret = _this2.state.inputAsString && newValue ? newValue.format(_this2.state.dateTimeFormat) : newValue;
|
566 | _this2.props[handler](ret);
|
567 | };
|
568 |
|
569 | this.onSelectCalendarPanel = function (value) {
|
570 | var _props3 = _this2.props,
|
571 | showTime = _props3.showTime,
|
572 | resetTime = _props3.resetTime;
|
573 |
|
574 |
|
575 | var prevValue = _this2.state.value;
|
576 | var newValue = value;
|
577 | if (showTime) {
|
578 | if (!prevValue) {
|
579 |
|
580 | if (showTime.defaultValue) {
|
581 | var defaultTimeValue = (0, _util2.formatDateValue)(showTime.defaultValue, _this2.state.timeFormat);
|
582 | newValue = (0, _util2.resetValueTime)(value, defaultTimeValue);
|
583 | }
|
584 | } else if (!resetTime) {
|
585 |
|
586 | newValue = (0, _util2.resetValueTime)(value, prevValue);
|
587 | }
|
588 | }
|
589 |
|
590 | _this2.handleChange(newValue, prevValue, { inputing: false });
|
591 |
|
592 | if (!showTime) {
|
593 | _this2.onVisibleChange(false, 'calendarSelect');
|
594 | }
|
595 | };
|
596 |
|
597 | this.onSelectTimePanel = function (value) {
|
598 | _this2.handleChange(value, _this2.state.value, { inputing: false });
|
599 | };
|
600 |
|
601 | this.clearValue = function () {
|
602 | _this2.setState({
|
603 | dateInputStr: '',
|
604 | timeInputStr: ''
|
605 | });
|
606 |
|
607 | _this2.handleChange(null, _this2.state.value, { inputing: false });
|
608 | };
|
609 |
|
610 | this.onDateInputChange = function (inputStr, e, eventType) {
|
611 | if (eventType === 'clear' || !inputStr) {
|
612 | e.stopPropagation();
|
613 | _this2.clearValue();
|
614 | } else {
|
615 | _this2.setState({
|
616 | dateInputStr: inputStr,
|
617 | inputing: 'date'
|
618 | });
|
619 | }
|
620 | };
|
621 |
|
622 | this.onTimeInputChange = function (inputStr) {
|
623 | _this2.setState({
|
624 | timeInputStr: inputStr,
|
625 | inputing: 'time'
|
626 | });
|
627 | };
|
628 |
|
629 | this.onDateInputBlur = function () {
|
630 | var _state3 = _this2.state,
|
631 | dateInputStr = _state3.dateInputStr,
|
632 | value = _state3.value,
|
633 | format = _state3.format;
|
634 | var resetTime = _this2.props.resetTime;
|
635 |
|
636 |
|
637 | if (dateInputStr) {
|
638 | var disabledDate = _this2.props.disabledDate;
|
639 |
|
640 | var parsed = (0, _moment2.default)(dateInputStr, format, true);
|
641 |
|
642 | _this2.setState({
|
643 | dateInputStr: '',
|
644 | inputing: false
|
645 | });
|
646 | if (parsed.isValid() && !disabledDate(parsed, 'date')) {
|
647 | parsed = resetTime ? parsed : (0, _util2.resetValueTime)(parsed, value);
|
648 | _this2.handleChange(parsed, value);
|
649 | }
|
650 | }
|
651 | };
|
652 |
|
653 | this.onTimeInputBlur = function () {
|
654 | var _state4 = _this2.state,
|
655 | value = _state4.value,
|
656 | timeInputStr = _state4.timeInputStr,
|
657 | timeFormat = _state4.timeFormat;
|
658 |
|
659 | if (timeInputStr) {
|
660 | var parsed = (0, _moment2.default)(timeInputStr, timeFormat, true);
|
661 |
|
662 | _this2.setState({
|
663 | timeInputStr: '',
|
664 | inputing: false
|
665 | });
|
666 |
|
667 | if (parsed.isValid()) {
|
668 | var hour = parsed.hour();
|
669 | var minute = parsed.minute();
|
670 | var second = parsed.second();
|
671 | var newValue = value.clone().hour(hour).minute(minute).second(second);
|
672 |
|
673 | _this2.handleChange(newValue, _this2.state.value);
|
674 | }
|
675 | }
|
676 | };
|
677 |
|
678 | this.onKeyDown = function (e) {
|
679 | var format = _this2.props.format;
|
680 | var _state5 = _this2.state,
|
681 | dateInputStr = _state5.dateInputStr,
|
682 | value = _state5.value;
|
683 |
|
684 | var dateStr = (0, _util2.onDateKeydown)(e, { format: format, dateInputStr: dateInputStr, value: value }, 'day');
|
685 | if (!dateStr) return;
|
686 | _this2.onDateInputChange(dateStr);
|
687 | };
|
688 |
|
689 | this.onTimeKeyDown = function (e) {
|
690 | var showTime = _this2.props.showTime;
|
691 | var _state6 = _this2.state,
|
692 | timeInputStr = _state6.timeInputStr,
|
693 | timeFormat = _state6.timeFormat,
|
694 | value = _state6.value;
|
695 |
|
696 | var _ref = (typeof showTime === 'undefined' ? 'undefined' : (0, _typeof3.default)(showTime)) === 'object' ? showTime : {},
|
697 | disabledMinutes = _ref.disabledMinutes,
|
698 | disabledSeconds = _ref.disabledSeconds,
|
699 | _ref$hourStep = _ref.hourStep,
|
700 | hourStep = _ref$hourStep === undefined ? 1 : _ref$hourStep,
|
701 | _ref$minuteStep = _ref.minuteStep,
|
702 | minuteStep = _ref$minuteStep === undefined ? 1 : _ref$minuteStep,
|
703 | _ref$secondStep = _ref.secondStep,
|
704 | secondStep = _ref$secondStep === undefined ? 1 : _ref$secondStep;
|
705 |
|
706 | var unit = 'second';
|
707 |
|
708 | if (disabledSeconds) {
|
709 | unit = disabledMinutes ? 'hour' : 'minute';
|
710 | }
|
711 |
|
712 | var timeStr = (0, _util2.onTimeKeydown)(e, {
|
713 | format: timeFormat,
|
714 | timeInputStr: timeInputStr,
|
715 | value: value,
|
716 | steps: {
|
717 | hour: hourStep,
|
718 | minute: minuteStep,
|
719 | second: secondStep
|
720 | }
|
721 | }, unit);
|
722 |
|
723 | if (!timeStr) return;
|
724 |
|
725 | _this2.onTimeInputChange(timeStr);
|
726 | };
|
727 |
|
728 | this.handleChange = function (newValue, prevValue) {
|
729 | var others = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
730 |
|
731 | if (!('value' in _this2.props)) {
|
732 | _this2.setState((0, _extends3.default)({
|
733 | value: newValue
|
734 | }, others));
|
735 | } else {
|
736 | _this2.setState((0, _extends3.default)({}, others));
|
737 | }
|
738 |
|
739 | var newValueOf = newValue ? newValue.valueOf() : null;
|
740 | var preValueOf = prevValue ? prevValue.valueOf() : null;
|
741 |
|
742 | if (newValueOf !== preValueOf) {
|
743 | _this2.onValueChange(newValue);
|
744 | }
|
745 | };
|
746 |
|
747 | this.onFoucsDateInput = function () {
|
748 | if (_this2.state.panel !== _util2.PANEL.DATE) {
|
749 | _this2.setState({
|
750 | panel: _util2.PANEL.DATE
|
751 | });
|
752 | }
|
753 | };
|
754 |
|
755 | this.onFoucsTimeInput = function () {
|
756 | if (_this2.state.panel !== _util2.PANEL.TIME) {
|
757 | _this2.setState({
|
758 | panel: _util2.PANEL.TIME
|
759 | });
|
760 | }
|
761 | };
|
762 |
|
763 | this.onVisibleChange = function (visible, type) {
|
764 | if (!('visible' in _this2.props)) {
|
765 | _this2.setState({
|
766 | visible: visible
|
767 | });
|
768 | }
|
769 | _this2.props.onVisibleChange(visible, type);
|
770 | };
|
771 |
|
772 | this.changePanel = function (panel) {
|
773 | _this2.setState({
|
774 | panel: panel
|
775 | });
|
776 | };
|
777 |
|
778 | this.onOk = function (value) {
|
779 | _this2.onVisibleChange(false, 'okBtnClick');
|
780 | _this2.onValueChange(value || _this2.state.value, 'onOk');
|
781 | };
|
782 | }, _temp);
|
783 | DatePicker.displayName = 'DatePicker';
|
784 | exports.default = (0, _reactLifecyclesCompat.polyfill)(DatePicker);
|
785 | module.exports = exports['default']; |
\ | No newline at end of file |