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, _temp, _initialiseProps;
|
8 |
|
9 | import React, { Component } from 'react';
|
10 | import PropTypes from 'prop-types';
|
11 | import { polyfill } from 'react-lifecycles-compat';
|
12 | import classnames from 'classnames';
|
13 | import ConfigProvider from '../config-provider';
|
14 | import Input from '../input';
|
15 | import Button from '../button';
|
16 | import Overlay from '../overlay';
|
17 | import nextLocale from '../locale/zh-cn';
|
18 | import { func, obj, datejs, KEYCODE } from '../util';
|
19 | import TimePickerPanel from './panel';
|
20 | import { checkDateValue, onTimeKeydown } from './utils';
|
21 | import SharedPT from './prop-types';
|
22 | import { switchInputType, fmtValue, isValueChanged } from '../date-picker2/util';
|
23 | import FooterPanel from '../date-picker2/panels/footer-panel';
|
24 | import DateInput from './module/date-input';
|
25 | import { TIME_PICKER_TYPE, TIME_INPUT_TYPE } from './constant';
|
26 |
|
27 | var Popup = Overlay.Popup;
|
28 | var noop = func.noop,
|
29 | checkDate = func.checkDate,
|
30 | checkRangeDate = func.checkRangeDate;
|
31 |
|
32 | var timePickerLocale = nextLocale.TimePicker;
|
33 |
|
34 | var presetPropType = PropTypes.shape(_extends({
|
35 | label: PropTypes.string,
|
36 | value: PropTypes.oneOfType([PropTypes.func, checkDateValue])
|
37 | }, Button.propTypes));
|
38 |
|
39 | var TimePicker2 = (_temp = _class = function (_Component) {
|
40 | _inherits(TimePicker2, _Component);
|
41 |
|
42 | function TimePicker2(props, context) {
|
43 | _classCallCheck(this, TimePicker2);
|
44 |
|
45 | var _this = _possibleConstructorReturn(this, _Component.call(this, props, context));
|
46 |
|
47 | _initialiseProps.call(_this);
|
48 |
|
49 | var isRange = props.type === TIME_PICKER_TYPE.RANGE;
|
50 |
|
51 | _this.state = {};
|
52 | if (isRange) {
|
53 | var _this$getInitRangeInp = _this.getInitRangeInputState(),
|
54 | inputType = _this$getInitRangeInp.inputType,
|
55 | justBeginInput = _this$getInitRangeInp.justBeginInput;
|
56 |
|
57 | _this.state = {
|
58 | inputType: inputType,
|
59 | justBeginInput: justBeginInput
|
60 | };
|
61 | }
|
62 |
|
63 | var _this$props = _this.props,
|
64 | format = _this$props.format,
|
65 | visible = _this$props.visible,
|
66 | defaultVisible = _this$props.defaultVisible,
|
67 | prefix = _this$props.prefix;
|
68 |
|
69 |
|
70 | var value = _this.getInitValue();
|
71 |
|
72 |
|
73 | _this.state = _extends({}, _this.state, {
|
74 | isRange: isRange,
|
75 | inputStr: '',
|
76 | value: value,
|
77 | curValue: value,
|
78 | preValue: value,
|
79 | inputValue: fmtValue(value, format),
|
80 | inputing: false,
|
81 | visible: 'visible' in _this.props ? visible : defaultVisible
|
82 | });
|
83 | _this.prefixCls = prefix + 'time-picker2';
|
84 | return _this;
|
85 | }
|
86 |
|
87 | TimePicker2.getDerivedStateFromProps = function getDerivedStateFromProps(props, prevState) {
|
88 | var disabled = props.disabled,
|
89 | type = props.type,
|
90 | format = props.format,
|
91 | propsValue = props.value;
|
92 |
|
93 | var isRange = type === TIME_PICKER_TYPE.RANGE;
|
94 | var state = {
|
95 | isRange: isRange
|
96 | };
|
97 |
|
98 | if ('value' in props) {
|
99 |
|
100 | var formatter = function formatter(v) {
|
101 | return typeof v === 'string' ? datejs(v, format) : v;
|
102 | };
|
103 | var formattedValue = Array.isArray(propsValue) ? propsValue.map(function (v) {
|
104 | return formatter(v);
|
105 | }) : formatter(propsValue);
|
106 | var value = isRange ? checkRangeDate(formattedValue, state.inputType, disabled) : checkDate(formattedValue);
|
107 | if (isValueChanged(value, state.preValue)) {
|
108 | state = _extends({}, state, {
|
109 | value: value,
|
110 | preValue: value
|
111 | });
|
112 | if (isRange && !prevState.selecting) {
|
113 | state.inputValue = fmtValue(value, format);
|
114 | state.curValue = formattedValue;
|
115 | }
|
116 | }
|
117 | }
|
118 |
|
119 | if ('visible' in props) {
|
120 | state.visible = props.visible;
|
121 | }
|
122 |
|
123 | return state;
|
124 | };
|
125 |
|
126 | |
127 |
|
128 |
|
129 |
|
130 |
|
131 | |
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 |
|
138 | |
139 |
|
140 |
|
141 |
|
142 |
|
143 |
|
144 |
|
145 | |
146 |
|
147 |
|
148 |
|
149 |
|
150 |
|
151 |
|
152 |
|
153 | |
154 |
|
155 |
|
156 |
|
157 |
|
158 |
|
159 |
|
160 | TimePicker2.prototype.renderPreview = function renderPreview(others) {
|
161 | var _props = this.props,
|
162 | prefix = _props.prefix,
|
163 | format = _props.format,
|
164 | className = _props.className,
|
165 | renderPreview = _props.renderPreview;
|
166 | var value = this.state.value;
|
167 |
|
168 | var previewCls = classnames(className, prefix + 'form-preview');
|
169 |
|
170 | var label = value ? value.format(format) : '';
|
171 |
|
172 | if (typeof renderPreview === 'function') {
|
173 | return React.createElement(
|
174 | 'div',
|
175 | _extends({}, others, { className: previewCls }),
|
176 | renderPreview(value, this.props)
|
177 | );
|
178 | }
|
179 |
|
180 | return React.createElement(
|
181 | 'p',
|
182 | _extends({}, others, { className: previewCls }),
|
183 | label
|
184 | );
|
185 | };
|
186 |
|
187 | TimePicker2.prototype.render = function render() {
|
188 | var _classnames,
|
189 | _this2 = this,
|
190 | _classnames2;
|
191 |
|
192 | var _props2 = this.props,
|
193 | prefix = _props2.prefix,
|
194 | label = _props2.label,
|
195 | state = _props2.state,
|
196 | placeholder = _props2.placeholder,
|
197 | size = _props2.size,
|
198 | format = _props2.format,
|
199 | hasClear = _props2.hasClear,
|
200 | hourStep = _props2.hourStep,
|
201 | minuteStep = _props2.minuteStep,
|
202 | secondStep = _props2.secondStep,
|
203 | disabledHours = _props2.disabledHours,
|
204 | disabledMinutes = _props2.disabledMinutes,
|
205 | disabledSeconds = _props2.disabledSeconds,
|
206 | renderTimeMenuItems = _props2.renderTimeMenuItems,
|
207 | inputProps = _props2.inputProps,
|
208 | popupAlign = _props2.popupAlign,
|
209 | popupTriggerType = _props2.popupTriggerType,
|
210 | popupContainer = _props2.popupContainer,
|
211 | popupStyle = _props2.popupStyle,
|
212 | popupClassName = _props2.popupClassName,
|
213 | popupProps = _props2.popupProps,
|
214 | popupComponent = _props2.popupComponent,
|
215 | followTrigger = _props2.followTrigger,
|
216 | disabled = _props2.disabled,
|
217 | hasBorder = _props2.hasBorder,
|
218 | className = _props2.className,
|
219 | locale = _props2.locale,
|
220 | rtl = _props2.rtl,
|
221 | isPreview = _props2.isPreview,
|
222 | preset = _props2.preset,
|
223 | others = _objectWithoutProperties(_props2, ['prefix', 'label', 'state', 'placeholder', 'size', 'format', 'hasClear', 'hourStep', 'minuteStep', 'secondStep', 'disabledHours', 'disabledMinutes', 'disabledSeconds', 'renderTimeMenuItems', 'inputProps', 'popupAlign', 'popupTriggerType', 'popupContainer', 'popupStyle', 'popupClassName', 'popupProps', 'popupComponent', 'followTrigger', 'disabled', 'hasBorder', 'className', 'locale', 'rtl', 'isPreview', 'preset']);
|
224 |
|
225 | var _state = this.state,
|
226 | value = _state.value,
|
227 | inputStr = _state.inputStr,
|
228 | inputValue = _state.inputValue,
|
229 | curValue = _state.curValue,
|
230 | inputing = _state.inputing,
|
231 | visible = _state.visible,
|
232 | isRange = _state.isRange,
|
233 | inputType = _state.inputType;
|
234 |
|
235 | var triggerCls = classnames((_classnames = {}, _classnames[this.prefixCls + '-trigger'] = true, _classnames));
|
236 |
|
237 | if (rtl) {
|
238 | others.dir = 'rtl';
|
239 | }
|
240 |
|
241 | if (isPreview) {
|
242 | return this.renderPreview(obj.pickOthers(others, TimePicker2.PropTypes));
|
243 | }
|
244 |
|
245 | var sharedInputProps = _extends({
|
246 | prefix: prefix,
|
247 | locale: locale,
|
248 | label: label,
|
249 | state: state,
|
250 | placeholder: placeholder
|
251 | }, inputProps, {
|
252 | size: size,
|
253 | disabled: disabled,
|
254 |
|
255 | value: inputing ? inputStr : isRange ? inputValue : fmtValue(value, format) || '',
|
256 | hasClear: value && hasClear,
|
257 | inputType: inputType,
|
258 | isRange: isRange,
|
259 | onInputTypeChange: this.onInputTypeChange,
|
260 | onInput: this.handleInput,
|
261 | onKeyDown: this.onKeyDown,
|
262 | ref: function ref(el) {
|
263 | return _this2.dateInput = el;
|
264 | }
|
265 | });
|
266 |
|
267 | var triggerInput = React.createElement(
|
268 | 'div',
|
269 | { className: triggerCls },
|
270 | React.createElement(DateInput, _extends({}, sharedInputProps, {
|
271 | label: label,
|
272 | state: state,
|
273 | onClick: this.onClick,
|
274 | hasBorder: hasBorder,
|
275 | placeholder: placeholder || locale.placeholder,
|
276 | className: classnames(this.prefixCls + '-input')
|
277 | }))
|
278 | );
|
279 |
|
280 | var panelProps = {
|
281 | prefix: prefix,
|
282 | locale: locale,
|
283 | value: inputing ? this.checkValue(inputStr) : curValue,
|
284 |
|
285 | isRange: isRange,
|
286 | disabled: disabled,
|
287 | showHour: format.indexOf('H') > -1,
|
288 | showSecond: format.indexOf('s') > -1,
|
289 | showMinute: format.indexOf('m') > -1,
|
290 | hourStep: hourStep,
|
291 | minuteStep: minuteStep,
|
292 | secondStep: secondStep,
|
293 | disabledHours: disabledHours,
|
294 | disabledMinutes: disabledMinutes,
|
295 | disabledSeconds: disabledSeconds,
|
296 | renderTimeMenuItems: renderTimeMenuItems,
|
297 | onSelect: this.handleChange
|
298 | };
|
299 |
|
300 | var classNames = classnames((_classnames2 = {}, _classnames2['' + this.prefixCls] = true, _classnames2[this.prefixCls + '-' + size] = size, _classnames2[prefix + 'disabled'] = disabled, _classnames2), className);
|
301 |
|
302 | var PopupComponent = popupComponent ? popupComponent : Popup;
|
303 | var oKable = !!(isRange ? inputValue && inputValue[inputType] : inputValue);
|
304 |
|
305 | return React.createElement(
|
306 | 'div',
|
307 | _extends({}, obj.pickOthers(TimePicker2.propTypes, others), { className: classNames }),
|
308 | React.createElement(
|
309 | PopupComponent,
|
310 | _extends({
|
311 | align: popupAlign
|
312 | }, popupProps, {
|
313 | followTrigger: followTrigger,
|
314 | visible: visible,
|
315 | onVisibleChange: this.handleVisibleChange,
|
316 | trigger: triggerInput,
|
317 | container: popupContainer,
|
318 | disabled: disabled,
|
319 | triggerType: popupTriggerType,
|
320 | style: popupStyle,
|
321 | className: popupClassName
|
322 | }),
|
323 | React.createElement(
|
324 | 'div',
|
325 | { dir: others.dir, className: this.prefixCls + '-wrapper' },
|
326 | React.createElement(
|
327 | 'div',
|
328 | { className: this.prefixCls + '-body' },
|
329 | React.createElement(TimePickerPanel, panelProps),
|
330 | preset || isRange ? React.createElement(FooterPanel, {
|
331 | prefix: prefix,
|
332 | className: this.prefixCls + '-footer',
|
333 | showTime: true,
|
334 | oKable: oKable,
|
335 | showOk: isRange,
|
336 | onOk: this.onOk,
|
337 | onChange: this.handleChange,
|
338 | preset: preset
|
339 | }) : null
|
340 | )
|
341 | )
|
342 | )
|
343 | );
|
344 | };
|
345 |
|
346 | return TimePicker2;
|
347 | }(Component), _class.propTypes = _extends({}, ConfigProvider.propTypes, {
|
348 | prefix: PropTypes.string,
|
349 | rtl: PropTypes.bool,
|
350 | |
351 |
|
352 |
|
353 | label: PropTypes.node,
|
354 | |
355 |
|
356 |
|
357 | state: PropTypes.oneOf(['error', 'success']),
|
358 | |
359 |
|
360 |
|
361 | placeholder: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.string]),
|
362 | |
363 |
|
364 |
|
365 | value: SharedPT.value,
|
366 | |
367 |
|
368 |
|
369 | defaultValue: SharedPT.value,
|
370 | |
371 |
|
372 |
|
373 | size: PropTypes.oneOf(['small', 'medium', 'large']),
|
374 | |
375 |
|
376 |
|
377 | hasClear: PropTypes.bool,
|
378 | |
379 |
|
380 |
|
381 |
|
382 | format: PropTypes.string,
|
383 | |
384 |
|
385 |
|
386 | hourStep: PropTypes.number,
|
387 | |
388 |
|
389 |
|
390 | minuteStep: PropTypes.number,
|
391 | |
392 |
|
393 |
|
394 | secondStep: PropTypes.number,
|
395 | |
396 |
|
397 |
|
398 |
|
399 |
|
400 | disabledHours: PropTypes.func,
|
401 | |
402 |
|
403 |
|
404 |
|
405 |
|
406 | disabledMinutes: PropTypes.func,
|
407 | |
408 |
|
409 |
|
410 |
|
411 |
|
412 | disabledSeconds: PropTypes.func,
|
413 | |
414 |
|
415 |
|
416 |
|
417 |
|
418 |
|
419 |
|
420 |
|
421 |
|
422 |
|
423 |
|
424 | renderTimeMenuItems: PropTypes.func,
|
425 | |
426 |
|
427 |
|
428 | visible: PropTypes.bool,
|
429 | |
430 |
|
431 |
|
432 | defaultVisible: PropTypes.bool,
|
433 | |
434 |
|
435 |
|
436 |
|
437 |
|
438 | popupContainer: PropTypes.any,
|
439 | |
440 |
|
441 |
|
442 | popupAlign: PropTypes.string,
|
443 | |
444 |
|
445 |
|
446 | popupTriggerType: PropTypes.oneOf(['click', 'hover']),
|
447 | |
448 |
|
449 |
|
450 |
|
451 |
|
452 | onVisibleChange: PropTypes.func,
|
453 | |
454 |
|
455 |
|
456 | popupStyle: PropTypes.object,
|
457 | |
458 |
|
459 |
|
460 | popupClassName: PropTypes.string,
|
461 | |
462 |
|
463 |
|
464 | popupProps: PropTypes.object,
|
465 | |
466 |
|
467 |
|
468 | followTrigger: PropTypes.bool,
|
469 | |
470 |
|
471 |
|
472 | disabled: PropTypes.bool,
|
473 | |
474 |
|
475 |
|
476 | hasBorder: PropTypes.bool,
|
477 | |
478 |
|
479 |
|
480 | isPreview: PropTypes.bool,
|
481 | |
482 |
|
483 |
|
484 |
|
485 | renderPreview: PropTypes.func,
|
486 | |
487 |
|
488 |
|
489 |
|
490 |
|
491 | onChange: PropTypes.func,
|
492 | className: PropTypes.string,
|
493 | name: PropTypes.string,
|
494 | |
495 |
|
496 |
|
497 | preset: PropTypes.oneOfType([PropTypes.arrayOf(presetPropType), presetPropType]),
|
498 | inputProps: PropTypes.shape(Input.propTypes),
|
499 | popupComponent: PropTypes.elementType,
|
500 | type: PropTypes.oneOf(['time', 'range'])
|
501 | }), _class.defaultProps = {
|
502 | prefix: 'next-',
|
503 | rtl: false,
|
504 | locale: timePickerLocale,
|
505 | size: 'medium',
|
506 | format: 'HH:mm:ss',
|
507 | hasClear: true,
|
508 | disabled: false,
|
509 | hasBorder: true,
|
510 | type: 'time',
|
511 | popupAlign: 'tl bl',
|
512 | popupTriggerType: 'click',
|
513 | onChange: noop,
|
514 | onVisibleChange: noop
|
515 | }, _initialiseProps = function _initialiseProps() {
|
516 | var _this3 = this;
|
517 |
|
518 | this.getInitValue = function () {
|
519 | var props = _this3.props;
|
520 | var type = props.type,
|
521 | value = props.value,
|
522 | defaultValue = props.defaultValue;
|
523 |
|
524 |
|
525 | var val = type === TIME_PICKER_TYPE.RANGE ? [null, null] : null;
|
526 |
|
527 | val = 'value' in props ? value : 'defaultValue' in props ? defaultValue : val;
|
528 |
|
529 | return _this3.checkValue(val);
|
530 | };
|
531 |
|
532 | this.getInitRangeInputState = function () {
|
533 | return {
|
534 | justBeginInput: _this3.isEnabled(),
|
535 | inputType: _this3.isEnabled(0) ? TIME_INPUT_TYPE.BEGIN : TIME_INPUT_TYPE.END
|
536 | };
|
537 | };
|
538 |
|
539 | this.onKeyDown = function (e) {
|
540 | if (e.keyCode === KEYCODE.ENTER) {
|
541 | var inputValue = _this3.state.inputValue;
|
542 |
|
543 | _this3.handleChange(inputValue, 'KEYDOWN_ENTER');
|
544 | _this3.onClick();
|
545 | return;
|
546 | }
|
547 |
|
548 | var _state2 = _this3.state,
|
549 | value = _state2.value,
|
550 | inputStr = _state2.inputStr,
|
551 | inputType = _state2.inputType,
|
552 | isRange = _state2.isRange;
|
553 | var _props3 = _this3.props,
|
554 | format = _props3.format,
|
555 | _props3$hourStep = _props3.hourStep,
|
556 | hourStep = _props3$hourStep === undefined ? 1 : _props3$hourStep,
|
557 | _props3$minuteStep = _props3.minuteStep,
|
558 | minuteStep = _props3$minuteStep === undefined ? 1 : _props3$minuteStep,
|
559 | _props3$secondStep = _props3.secondStep,
|
560 | secondStep = _props3$secondStep === undefined ? 1 : _props3$secondStep,
|
561 | disabledMinutes = _props3.disabledMinutes,
|
562 | disabledSeconds = _props3.disabledSeconds;
|
563 |
|
564 |
|
565 | var unit = 'second';
|
566 |
|
567 | if (disabledSeconds) {
|
568 | unit = disabledMinutes ? 'hour' : 'minute';
|
569 | }
|
570 |
|
571 | var timeStr = onTimeKeydown(e, {
|
572 | format: format,
|
573 | timeInputStr: isRange ? inputStr[inputType] : inputStr,
|
574 | steps: {
|
575 | hour: hourStep,
|
576 | minute: minuteStep,
|
577 | second: secondStep
|
578 | },
|
579 | value: value
|
580 | }, unit);
|
581 |
|
582 | if (!timeStr) return;
|
583 | var newInputStr = timeStr;
|
584 | if (isRange) {
|
585 | newInputStr = inputStr;
|
586 | newInputStr[inputType] = timeStr;
|
587 | }
|
588 |
|
589 | _this3.handleChange(newInputStr, 'KEYDOWN_CODE');
|
590 | };
|
591 |
|
592 | this.onVisibleChange = function (visible, type) {
|
593 | if (!('visible' in _this3.props)) {
|
594 | _this3.setState({
|
595 | visible: visible
|
596 | });
|
597 | }
|
598 | _this3.props.onVisibleChange(visible, type);
|
599 | };
|
600 |
|
601 | this.onClick = function () {
|
602 | var _state3 = _this3.state,
|
603 | visible = _state3.visible,
|
604 | inputType = _state3.inputType;
|
605 |
|
606 |
|
607 | if (!visible) {
|
608 | _this3.onVisibleChange(true);
|
609 | _this3.handleInputFocus(inputType);
|
610 | }
|
611 | };
|
612 |
|
613 | this.handleVisibleChange = function (visible, targetType) {
|
614 | if (targetType === 'docClick') {
|
615 |
|
616 | if (!visible) {
|
617 | _this3.handleChange(_this3.state.curValue, 'VISIBLE_CHANGE');
|
618 | }
|
619 | _this3.onVisibleChange(visible);
|
620 | }
|
621 | };
|
622 |
|
623 | this.handleInputFocus = function (inputType) {
|
624 | var inputEl = _this3.dateInput && _this3.dateInput.input;
|
625 |
|
626 | if (_this3.state.isRange) {
|
627 | inputEl = inputEl && inputEl[inputType];
|
628 | }
|
629 |
|
630 | inputEl && inputEl.focus();
|
631 | };
|
632 |
|
633 | this.onOk = function () {
|
634 | var curValue = _this3.state.curValue;
|
635 |
|
636 | var checkedValue = _this3.checkValue(curValue);
|
637 |
|
638 | func.invoke(_this3.props, 'onOk', _this3.getOutputArgs(checkedValue));
|
639 |
|
640 | _this3.setState({ value: checkedValue });
|
641 | _this3.handleChange(checkedValue, 'CLICK_OK');
|
642 | };
|
643 |
|
644 | this.onInputTypeChange = function (idx) {
|
645 | var _state4 = _this3.state,
|
646 | inputType = _state4.inputType,
|
647 | visible = _state4.visible;
|
648 |
|
649 |
|
650 | if (idx !== inputType) {
|
651 | _this3.setState({
|
652 | inputType: idx,
|
653 | justBeginInput: !(idx !== null && visible)
|
654 | });
|
655 | }
|
656 | };
|
657 |
|
658 | this.checkValue = function (value, strictly) {
|
659 | var inputType = _this3.state.inputType;
|
660 |
|
661 | var formatter = function formatter(v) {
|
662 | return typeof v === 'string' ? datejs(v, 'HH:mm:ss') : v;
|
663 | };
|
664 | var formattedValue = Array.isArray(value) ? value.map(function (v) {
|
665 | return formatter(v);
|
666 | }) : formatter(value);
|
667 |
|
668 | return _this3.props.type === TIME_PICKER_TYPE.RANGE ? checkRangeDate(formattedValue, inputType, _this3.props.disabled, strictly) : checkDate(formattedValue);
|
669 | };
|
670 |
|
671 | this.getOutputArgs = function (value) {
|
672 | var format = _this3.props.format;
|
673 |
|
674 | return [value, fmtValue(value, format)];
|
675 | };
|
676 |
|
677 | this.onChange = function (v) {
|
678 | var state = _this3.state,
|
679 | props = _this3.props;
|
680 | var format = props.format;
|
681 |
|
682 |
|
683 | var nextValue = v === undefined ? state.value : v;
|
684 | var value = _this3.checkValue(nextValue);
|
685 |
|
686 | _this3.setState({
|
687 | curValue: value,
|
688 | preValue: value,
|
689 | inputStr: fmtValue(value, format),
|
690 | inputValue: fmtValue(value, format)
|
691 | });
|
692 |
|
693 | func.invoke(_this3.props, 'onChange', _this3.getOutputArgs(nextValue));
|
694 | };
|
695 |
|
696 | this.shouldSwitchInput = function (value) {
|
697 | var _state5 = _this3.state,
|
698 | inputType = _state5.inputType,
|
699 | justBeginInput = _state5.justBeginInput;
|
700 |
|
701 | var idx = justBeginInput ? switchInputType(inputType) : value.indexOf(null);
|
702 |
|
703 | if (idx !== -1 && _this3.isEnabled(idx)) {
|
704 | _this3.onInputTypeChange(idx);
|
705 | _this3.handleInputFocus(idx);
|
706 | return true;
|
707 | }
|
708 |
|
709 | return false;
|
710 | };
|
711 |
|
712 | this.handleChange = function (v, eventType) {
|
713 | var format = _this3.props.format;
|
714 | var _state6 = _this3.state,
|
715 | isRange = _state6.isRange,
|
716 | value = _state6.value,
|
717 | preValue = _state6.preValue;
|
718 |
|
719 | var forceEvents = ['KEYDOWN_ENTER', 'CLICK_PRESET', 'CLICK_OK', 'INPUT_CLEAR', 'VISIBLE_CHANGE'];
|
720 | var isTemporary = isRange && !forceEvents.includes(eventType);
|
721 |
|
722 |
|
723 | v = eventType === 'VISIBLE_CHANGE' ? value : _this3.checkValue(v, !isTemporary);
|
724 |
|
725 | var stringV = fmtValue(v, format);
|
726 |
|
727 | _this3.setState({
|
728 | curValue: v,
|
729 | inputStr: stringV,
|
730 | inputValue: stringV,
|
731 | inputing: false,
|
732 | selecting: eventType === 'start' || eventType === 'end'
|
733 | });
|
734 |
|
735 | if (!isTemporary) {
|
736 | _this3.setState({
|
737 | value: v
|
738 | }, function () {
|
739 |
|
740 |
|
741 |
|
742 |
|
743 | var shouldHidePanel = ['CLICK_PRESET', 'VISIBLE_CHANGE', 'KEYDOWN_ENTER', 'INPUT_CLEAR', 'CLICK_OK'].includes(eventType) || isRange && !_this3.shouldSwitchInput(v);
|
744 | if (shouldHidePanel) {
|
745 | _this3.onVisibleChange(false);
|
746 | }
|
747 |
|
748 | if (isValueChanged(v, preValue)) {
|
749 | _this3.onChange(v);
|
750 | }
|
751 | });
|
752 | }
|
753 | };
|
754 |
|
755 | this.isEnabled = function (idx) {
|
756 | var disabled = _this3.props.disabled;
|
757 |
|
758 |
|
759 | return Array.isArray(disabled) ? idx === undefined ? !disabled[0] && !disabled[1] : !disabled[idx] : !disabled;
|
760 | };
|
761 |
|
762 | this.handleClear = function () {
|
763 | |
764 |
|
765 |
|
766 |
|
767 | _this3.clearTimeoutId = setTimeout(function () {
|
768 | _this3.handleInputFocus(0);
|
769 | });
|
770 |
|
771 | _this3.setState({
|
772 | inputType: TIME_INPUT_TYPE.BEGIN,
|
773 | justBeginInput: _this3.isEnabled()
|
774 | });
|
775 | };
|
776 |
|
777 | this.handleInput = function (v, eventType) {
|
778 | var isRange = _this3.state.isRange;
|
779 |
|
780 | if (eventType === 'clear') {
|
781 | _this3.handleChange(v, 'INPUT_CLEAR');
|
782 |
|
783 | if (isRange) {
|
784 | _this3.handleClear();
|
785 | }
|
786 | } else {
|
787 | _this3.setState({
|
788 | inputStr: v,
|
789 | inputValue: v,
|
790 | curValue: _this3.checkValue(v),
|
791 | inputing: true,
|
792 | visible: true
|
793 | });
|
794 | }
|
795 | };
|
796 | }, _temp);
|
797 | TimePicker2.displayName = 'TimePicker2';
|
798 |
|
799 |
|
800 | export default polyfill(TimePicker2); |
\ | No newline at end of file |