1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
|
6 |
|
7 | var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
|
8 |
|
9 | var _extends2 = require('babel-runtime/helpers/extends');
|
10 |
|
11 | var _extends3 = _interopRequireDefault(_extends2);
|
12 |
|
13 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
14 |
|
15 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
16 |
|
17 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
18 |
|
19 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
20 |
|
21 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
22 |
|
23 | var _inherits3 = _interopRequireDefault(_inherits2);
|
24 |
|
25 | var _class, _temp, _initialiseProps;
|
26 |
|
27 | var _react = require('react');
|
28 |
|
29 | var _react2 = _interopRequireDefault(_react);
|
30 |
|
31 | var _reactLifecyclesCompat = require('react-lifecycles-compat');
|
32 |
|
33 | var _classnames2 = require('classnames');
|
34 |
|
35 | var _classnames3 = _interopRequireDefault(_classnames2);
|
36 |
|
37 | var _propTypes = require('prop-types');
|
38 |
|
39 | var PT = _interopRequireWildcard(_propTypes);
|
40 |
|
41 | var _propTypes2 = require('./prop-types');
|
42 |
|
43 | var _propTypes3 = _interopRequireDefault(_propTypes2);
|
44 |
|
45 | var _zhCn = require('../locale/zh-cn');
|
46 |
|
47 | var _zhCn2 = _interopRequireDefault(_zhCn);
|
48 |
|
49 | var _util = require('../util');
|
50 |
|
51 | var _util2 = require('./util');
|
52 |
|
53 | var _constant = require('./constant');
|
54 |
|
55 | var _overlay = require('../overlay');
|
56 |
|
57 | var _overlay2 = _interopRequireDefault(_overlay);
|
58 |
|
59 | var _dateInput = require('./panels/date-input');
|
60 |
|
61 | var _dateInput2 = _interopRequireDefault(_dateInput);
|
62 |
|
63 | var _datePanel = require('./panels/date-panel');
|
64 |
|
65 | var _datePanel2 = _interopRequireDefault(_datePanel);
|
66 |
|
67 | var _rangePanel = require('./panels/range-panel');
|
68 |
|
69 | var _rangePanel2 = _interopRequireDefault(_rangePanel);
|
70 |
|
71 | var _footerPanel = require('./panels/footer-panel');
|
72 |
|
73 | var _footerPanel2 = _interopRequireDefault(_footerPanel);
|
74 |
|
75 | function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
|
76 |
|
77 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
78 |
|
79 | var Popup = _overlay2.default.Popup;
|
80 | var pickProps = _util.obj.pickProps,
|
81 | pickOthers = _util.obj.pickOthers;
|
82 | var renderNode = _util.func.renderNode,
|
83 | checkDate = _util.func.checkDate,
|
84 | checkRangeDate = _util.func.checkRangeDate;
|
85 | var Picker = (_temp = _class = function (_React$Component) {
|
86 | (0, _inherits3.default)(Picker, _React$Component);
|
87 |
|
88 | function Picker(props) {
|
89 | (0, _classCallCheck3.default)(this, Picker);
|
90 |
|
91 | var _this = (0, _possibleConstructorReturn3.default)(this, _React$Component.call(this, props));
|
92 |
|
93 | _initialiseProps.call(_this);
|
94 |
|
95 | var prefix = props.prefix,
|
96 | type = props.type,
|
97 | format = props.format,
|
98 | mode = props.mode,
|
99 | defaultVisible = props.defaultVisible;
|
100 |
|
101 |
|
102 | _this.state = {
|
103 | panelMode: mode,
|
104 | visible: defaultVisible
|
105 | };
|
106 |
|
107 | if (type === _constant.DATE_PICKER_TYPE.RANGE) {
|
108 | var _this$getInitRangeInp = _this.getInitRangeInputState(),
|
109 | inputType = _this$getInitRangeInp.inputType,
|
110 | justBeginInput = _this$getInitRangeInp.justBeginInput;
|
111 |
|
112 | _this.state = (0, _extends3.default)({
|
113 | inputType: inputType,
|
114 | justBeginInput: justBeginInput
|
115 | }, _this.state);
|
116 | }
|
117 |
|
118 | var value = _this.getInitValue();
|
119 |
|
120 | _this.state = (0, _extends3.default)({
|
121 | value: value,
|
122 | curValue: value,
|
123 | preValue: value,
|
124 | inputValue: (0, _util2.fmtValue)(value, format)
|
125 | }, _this.state);
|
126 |
|
127 | _this.prefixCls = prefix + 'date-picker2';
|
128 |
|
129 | _this.popupRef = _react2.default.createRef();
|
130 | return _this;
|
131 | }
|
132 |
|
133 | Picker.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
|
134 | var type = props.type,
|
135 | showTime = props.showTime,
|
136 | showOk = props.showOk,
|
137 | disabled = props.disabled,
|
138 | format = props.format;
|
139 |
|
140 | var isRange = type === _constant.DATE_PICKER_TYPE.RANGE;
|
141 |
|
142 | var newState = {
|
143 | isRange: isRange,
|
144 | showOk: !!(showOk || showTime)
|
145 | };
|
146 |
|
147 | |
148 |
|
149 |
|
150 |
|
151 | if (isRange) {
|
152 | var inputType = state.inputType;
|
153 |
|
154 |
|
155 | var _disabled = Array.isArray(disabled) ? disabled : [disabled, disabled];
|
156 |
|
157 | if (_disabled[inputType]) {
|
158 | var otherType = (0, _util2.switchInputType)(state.inputType);
|
159 |
|
160 | if (!_disabled[otherType]) {
|
161 | inputType = otherType;
|
162 | }
|
163 | }
|
164 |
|
165 | newState.inputType = inputType;
|
166 | }
|
167 |
|
168 | if ('value' in props) {
|
169 | var value = isRange ? checkRangeDate(props.value, state.inputType, disabled) : checkDate(props.value);
|
170 |
|
171 | if ((0, _util2.isValueChanged)(value, state.preValue)) {
|
172 | newState = (0, _extends3.default)({}, newState, {
|
173 | value: value,
|
174 | curValue: value,
|
175 | preValue: value,
|
176 | inputValue: (0, _util2.fmtValue)(value, format)
|
177 | });
|
178 | }
|
179 | }
|
180 |
|
181 | return newState;
|
182 | };
|
183 |
|
184 | Picker.prototype.componentWillUnmount = function componentWillUnmount() {
|
185 | [this.clearTimeoutId, this.timeoutId].forEach(function (id) {
|
186 | return id && clearTimeout(id);
|
187 | });
|
188 | };
|
189 |
|
190 | |
191 |
|
192 |
|
193 |
|
194 |
|
195 | |
196 |
|
197 |
|
198 |
|
199 |
|
200 |
|
201 |
|
202 |
|
203 | |
204 |
|
205 |
|
206 |
|
207 |
|
208 |
|
209 |
|
210 | Picker.prototype.onVisibleChange = function onVisibleChange(visible) {
|
211 | var _this2 = this;
|
212 |
|
213 | if (visible !== this.state.visible) {
|
214 | var callback = function callback() {
|
215 | _this2.setState({
|
216 | visible: visible,
|
217 | justBeginInput: _this2.isEnabled()
|
218 | });
|
219 | };
|
220 |
|
221 | if (this.timeoutId) {
|
222 | clearTimeout(this.timeoutId);
|
223 | this.timeoutId = null;
|
224 | }
|
225 |
|
226 | if (visible) {
|
227 | callback();
|
228 | } else {
|
229 | this.timeoutId = setTimeout(callback, 0);
|
230 | }
|
231 |
|
232 | _util.func.invoke(this.props, 'onVisibleChange', [visible]);
|
233 | }
|
234 | };
|
235 |
|
236 | |
237 |
|
238 |
|
239 |
|
240 |
|
241 |
|
242 |
|
243 | |
244 |
|
245 |
|
246 |
|
247 |
|
248 |
|
249 |
|
250 |
|
251 | |
252 |
|
253 |
|
254 |
|
255 |
|
256 |
|
257 |
|
258 |
|
259 | Picker.prototype.render = function render() {
|
260 | var _this3 = this,
|
261 | _classnames;
|
262 |
|
263 | var prefixCls = this.prefixCls,
|
264 | handleChange = this.handleChange,
|
265 | handleMouseDown = this.handleMouseDown,
|
266 | handleVisibleChange = this.handleVisibleChange,
|
267 | onOk = this.onOk,
|
268 | onClick = this.onClick,
|
269 | handleInput = this.handleInput,
|
270 | onInputTypeChange = this.onInputTypeChange,
|
271 | onPanelChange = this.onPanelChange,
|
272 | onKeyDown = this.onKeyDown;
|
273 | var _props = this.props,
|
274 | rtl = _props.rtl,
|
275 | locale = _props.locale,
|
276 | prefix = _props.prefix,
|
277 | inputReadOnly = _props.inputReadOnly,
|
278 | showTime = _props.showTime,
|
279 | preset = _props.preset,
|
280 | mode = _props.mode,
|
281 | format = _props.format,
|
282 | trigger = _props.trigger,
|
283 | disabledDate = _props.disabledDate,
|
284 | extraFooterRender = _props.extraFooterRender,
|
285 | timePanelProps = _props.timePanelProps,
|
286 | resetTime = _props.resetTime,
|
287 | placeholder = _props.placeholder,
|
288 | disabledTime = _props.disabledTime,
|
289 | dateCellRender = _props.dateCellRender,
|
290 | disabled = _props.disabled,
|
291 | isPreview = _props.isPreview,
|
292 | className = _props.className,
|
293 | defaultPanelValue = _props.defaultPanelValue,
|
294 | renderPreview = _props.renderPreview,
|
295 | label = _props.label,
|
296 | restProps = (0, _objectWithoutProperties3.default)(_props, ['rtl', 'locale', 'prefix', 'inputReadOnly', 'showTime', 'preset', 'mode', 'format', 'trigger', 'disabledDate', 'extraFooterRender', 'timePanelProps', 'resetTime', 'placeholder', 'disabledTime', 'dateCellRender', 'disabled', 'isPreview', 'className', 'defaultPanelValue', 'renderPreview', 'label']);
|
297 | var _state = this.state,
|
298 | isRange = _state.isRange,
|
299 | inputType = _state.inputType,
|
300 | justBeginInput = _state.justBeginInput,
|
301 | panelMode = _state.panelMode,
|
302 | showOk = _state.showOk,
|
303 | align = _state.align;
|
304 | var _state2 = this.state,
|
305 | inputValue = _state2.inputValue,
|
306 | curValue = _state2.curValue;
|
307 |
|
308 | var _getPopupOffsetLeft = this.getPopupOffsetLeft(),
|
309 | arrowLeft = _getPopupOffsetLeft.arrowLeft,
|
310 | panelLeft = _getPopupOffsetLeft.panelLeft;
|
311 |
|
312 |
|
313 |
|
314 |
|
315 | if (isPreview) {
|
316 | var previewCls = (0, _classnames3.default)(className, prefix + 'form-preview');
|
317 |
|
318 | return _react2.default.createElement(
|
319 | 'div',
|
320 | { className: previewCls },
|
321 | renderNode(renderPreview, isRange ? inputValue.join('-') : inputValue, [curValue, this.props])
|
322 | );
|
323 | }
|
324 |
|
325 | var visible = 'visible' in this.props ? this.props.visible : this.state.visible;
|
326 | var allDisabled = isRange && Array.isArray(disabled) ? disabled.every(function (v) {
|
327 | return v;
|
328 | }) : disabled;
|
329 | var sharedProps = {
|
330 | rtl: rtl,
|
331 | prefix: prefix,
|
332 | locale: locale,
|
333 | mode: mode,
|
334 | format: format,
|
335 | showTime: showTime,
|
336 | inputType: inputType
|
337 | };
|
338 |
|
339 |
|
340 | var inputProps = (0, _extends3.default)({}, pickProps(_dateInput2.default.propTypes, restProps), sharedProps, {
|
341 | value: inputValue,
|
342 | label: label,
|
343 | isRange: isRange,
|
344 | disabled: disabled,
|
345 | placeholder: placeholder,
|
346 | onInputTypeChange: onInputTypeChange,
|
347 | focus: visible,
|
348 | onInput: handleInput,
|
349 | readOnly: inputReadOnly,
|
350 | inputProps: this.props.inputProps,
|
351 | ref: function ref(el) {
|
352 | return _this3.dateInput = el;
|
353 | }
|
354 | });
|
355 |
|
356 |
|
357 | if (!this.isEnabled()) {
|
358 | inputProps.hasClear = false;
|
359 | }
|
360 |
|
361 | var triggerNode = renderNode(trigger, _react2.default.createElement(_dateInput2.default, inputProps));
|
362 |
|
363 |
|
364 | var panelProps = (0, _extends3.default)({}, sharedProps, {
|
365 | panelMode: panelMode,
|
366 | value: curValue,
|
367 | disabledDate: disabledDate,
|
368 | onPanelChange: onPanelChange,
|
369 | timePanelProps: timePanelProps,
|
370 | disabledTime: disabledTime,
|
371 | resetTime: resetTime,
|
372 | dateCellRender: dateCellRender,
|
373 | defaultPanelValue: defaultPanelValue,
|
374 | onSelect: handleChange
|
375 | });
|
376 |
|
377 | var DateNode = isRange ? _react2.default.createElement(_rangePanel2.default, (0, _extends3.default)({ justBeginInput: justBeginInput }, panelProps)) : _react2.default.createElement(_datePanel2.default, panelProps);
|
378 |
|
379 |
|
380 | var oKable = !!(isRange ? inputValue && inputValue[inputType] : inputValue);
|
381 | var shouldShowFooter = showOk || preset || extraFooterRender;
|
382 |
|
383 | var footerNode = shouldShowFooter ? _react2.default.createElement(_footerPanel2.default, {
|
384 | oKable: oKable,
|
385 | onOk: onOk,
|
386 | showOk: showOk,
|
387 | onChange: handleChange,
|
388 | preset: preset,
|
389 | locale: locale,
|
390 | prefix: prefix,
|
391 | extraRender: extraFooterRender
|
392 | }) : null;
|
393 |
|
394 | var triggerProps = void 0;
|
395 | if (!allDisabled) {
|
396 | triggerProps = { onKeyDown: onKeyDown, onClick: onClick };
|
397 | }
|
398 |
|
399 |
|
400 | var _props2 = this.props,
|
401 | followTrigger = _props2.followTrigger,
|
402 | popupTriggerType = _props2.popupTriggerType,
|
403 | popupAlign = _props2.popupAlign,
|
404 | popupContainer = _props2.popupContainer,
|
405 | popupStyle = _props2.popupStyle,
|
406 | popupClassName = _props2.popupClassName,
|
407 | popupComponent = _props2.popupComponent,
|
408 | popupProps = _props2.popupProps;
|
409 |
|
410 |
|
411 | var popupCls = (0, _classnames3.default)(popupClassName || popupProps && popupProps.className, (_classnames = {}, _classnames[prefixCls + '-overlay'] = true, _classnames[prefixCls + '-' + (align || []).join('-')] = align, _classnames[prefixCls + '-overlay-range'] = isRange, _classnames));
|
412 | var PopupComp = popupComponent || Popup;
|
413 |
|
414 | return _react2.default.createElement(
|
415 | 'div',
|
416 | (0, _extends3.default)({}, pickOthers(Picker.propTypes, restProps), {
|
417 | dir: rtl ? 'rtl' : undefined,
|
418 | className: (0, _classnames3.default)(className, prefixCls),
|
419 | style: this.props.style
|
420 | }),
|
421 | _react2.default.createElement(
|
422 | PopupComp,
|
423 | (0, _extends3.default)({
|
424 | rtl: rtl,
|
425 | key: 'date-picker-popup',
|
426 | visible: visible,
|
427 | align: popupAlign,
|
428 | container: popupContainer,
|
429 | followTrigger: followTrigger,
|
430 | triggerType: popupTriggerType,
|
431 | style: popupStyle,
|
432 | onVisibleChange: handleVisibleChange,
|
433 | disabled: allDisabled,
|
434 | trigger: _react2.default.createElement(
|
435 | 'div',
|
436 | (0, _extends3.default)({}, triggerProps, { role: 'button', tabIndex: '0', style: { width: '100%' } }),
|
437 | triggerNode
|
438 | ),
|
439 | onPosition: this.getCurrentAlign,
|
440 | canCloseByTrigger: false
|
441 | }, popupProps, {
|
442 | className: popupCls
|
443 | }),
|
444 | _react2.default.createElement(
|
445 | 'div',
|
446 | { onMouseDown: handleMouseDown, style: { marginLeft: panelLeft } },
|
447 | _react2.default.createElement(
|
448 | 'div',
|
449 | { dir: rtl ? 'rtl' : undefined, className: prefixCls + '-wrapper', ref: this.popupRef },
|
450 | isRange ? this.renderArrow(arrowLeft) : null,
|
451 | DateNode,
|
452 | this.state.panelMode !== this.props.mode ? null : footerNode
|
453 | )
|
454 | )
|
455 | )
|
456 | );
|
457 | };
|
458 |
|
459 | return Picker;
|
460 | }(_react2.default.Component), _class.propTypes = {
|
461 | rtl: PT.bool,
|
462 | prefix: PT.string,
|
463 | locale: PT.object,
|
464 | name: PT.string,
|
465 |
|
466 |
|
467 | mode: _propTypes3.default.mode,
|
468 | type: _propTypes3.default.type,
|
469 | value: _propTypes3.default.value,
|
470 | defaultValue: _propTypes3.default.value,
|
471 | defaultPanelValue: _propTypes3.default.date,
|
472 | disabledDate: PT.func,
|
473 | visible: PT.bool,
|
474 | defaultVisible: PT.bool,
|
475 | dateCellRender: PT.func,
|
476 |
|
477 |
|
478 | onOk: PT.func,
|
479 | onChange: PT.func,
|
480 | onVisibleChange: PT.func,
|
481 | onPanelChange: PT.func,
|
482 |
|
483 |
|
484 | showTime: PT.bool,
|
485 | resetTime: PT.bool,
|
486 | timePanelProps: PT.object,
|
487 | disabledTime: PT.object,
|
488 |
|
489 |
|
490 | titleRender: PT.func,
|
491 |
|
492 |
|
493 | preset: PT.oneOfType([PT.array, PT.object]),
|
494 | extraFooterRender: _propTypes3.default.render,
|
495 | showOk: PT.bool,
|
496 |
|
497 |
|
498 | trigger: _propTypes3.default.render,
|
499 | hasBorder: PT.bool,
|
500 | inputProps: PT.object,
|
501 | hasClear: PT.bool,
|
502 | placeholder: _propTypes3.default.placeholder,
|
503 | disabled: _propTypes3.default.disabled,
|
504 | inputReadOnly: _propTypes3.default.readOnly,
|
505 | |
506 |
|
507 |
|
508 | format: _propTypes3.default.format,
|
509 | label: PT.node,
|
510 | separator: PT.node,
|
511 | |
512 |
|
513 |
|
514 |
|
515 |
|
516 |
|
517 |
|
518 | outputFormat: _propTypes3.default.format,
|
519 |
|
520 |
|
521 | followTrigger: PT.bool,
|
522 | popupTriggerType: PT.oneOf(['click', 'hover']),
|
523 | popupAlign: PT.string,
|
524 | popupContainer: PT.any,
|
525 | popupStyle: PT.object,
|
526 | popupClassName: PT.string,
|
527 | popupComponent: PT.elementType,
|
528 | popupProps: PT.object,
|
529 |
|
530 |
|
531 | isPreview: PT.bool,
|
532 | renderPreview: PT.func,
|
533 |
|
534 |
|
535 | dateInputAriaLabel: _propTypes3.default.ariaLabel
|
536 | }, _class.defaultProps = {
|
537 | rtl: false,
|
538 | prefix: 'next-',
|
539 | popupTriggerType: 'click',
|
540 | locale: _zhCn2.default.DatePicker,
|
541 | defaultVisible: false,
|
542 | type: _constant.DATE_PICKER_TYPE.DATE,
|
543 | mode: _constant.DATE_PICKER_MODE.DATE,
|
544 | format: 'YYYY-MM-DD'
|
545 | }, _initialiseProps = function _initialiseProps() {
|
546 | var _this4 = this;
|
547 |
|
548 | this.getInitValue = function () {
|
549 | var props = _this4.props;
|
550 | var type = props.type,
|
551 | value = props.value,
|
552 | defaultValue = props.defaultValue;
|
553 |
|
554 |
|
555 | var val = type === _constant.DATE_PICKER_TYPE.RANGE ? [null, null] : null;
|
556 |
|
557 | val = 'value' in props ? value : 'defaultValue' in props ? defaultValue : val;
|
558 |
|
559 | return _this4.checkValue(val);
|
560 | };
|
561 |
|
562 | this.getInitRangeInputState = function () {
|
563 | return {
|
564 | justBeginInput: _this4.isEnabled(),
|
565 | inputType: _this4.isEnabled(0) ? _constant.DATE_INPUT_TYPE.BEGIN : _constant.DATE_INPUT_TYPE.END
|
566 | };
|
567 | };
|
568 |
|
569 | this.handleVisibleChange = function (visible, targetType) {
|
570 | if (['docClick', 'fromTrigger'].indexOf(targetType) > -1) {
|
571 |
|
572 | if (!visible) {
|
573 | _this4.handleChange(_this4.state.curValue, 'VISIBLE_CHANGE');
|
574 | }
|
575 | _this4.onVisibleChange(visible);
|
576 | }
|
577 | };
|
578 |
|
579 | this.checkValue = function (value, strictly) {
|
580 | return _this4.props.type === _constant.DATE_PICKER_TYPE.RANGE ? checkRangeDate(value, _this4.state.inputType, _this4.props.disabled, strictly) : checkDate(value);
|
581 | };
|
582 |
|
583 | this.handleInputFocus = function (inputType) {
|
584 | var inputEl = _this4.dateInput && _this4.dateInput.input;
|
585 |
|
586 | if (_this4.state.isRange) {
|
587 | inputEl = inputEl && inputEl[inputType];
|
588 | }
|
589 |
|
590 | inputEl && inputEl.focus();
|
591 | };
|
592 |
|
593 | this.handleMouseDown = function (e) {
|
594 | e.preventDefault();
|
595 | };
|
596 |
|
597 | this.handleInput = function (v, eventType) {
|
598 | if (eventType === 'clear') {
|
599 | _this4.handleChange(v, 'INPUT_CLEAR');
|
600 |
|
601 | if (_this4.state.isRange) {
|
602 | _this4.handleClear();
|
603 | }
|
604 | } else {
|
605 | _this4.setState({
|
606 | inputValue: v,
|
607 | visible: true
|
608 | });
|
609 | }
|
610 | };
|
611 |
|
612 | this.onPanelChange = function (value, mode) {
|
613 | _this4.setState({
|
614 | panelMode: mode
|
615 | });
|
616 | _util.func.invoke(_this4.props, 'onPanelChange', [value, mode]);
|
617 | };
|
618 |
|
619 | this.handleClear = function () {
|
620 | |
621 |
|
622 |
|
623 |
|
624 | _this4.clearTimeoutId = setTimeout(function () {
|
625 | _this4.handleInputFocus(0);
|
626 | });
|
627 |
|
628 | _this4.setState({
|
629 | inputType: _constant.DATE_INPUT_TYPE.BEGIN,
|
630 | justBeginInput: _this4.isEnabled()
|
631 | });
|
632 | };
|
633 |
|
634 | this.shouldSwitchInput = function (value) {
|
635 | var _state3 = _this4.state,
|
636 | inputType = _state3.inputType,
|
637 | justBeginInput = _state3.justBeginInput;
|
638 |
|
639 | var idx = justBeginInput ? (0, _util2.switchInputType)(inputType) : value.indexOf(null);
|
640 |
|
641 | if (idx !== -1 && _this4.isEnabled(idx)) {
|
642 | _this4.onInputTypeChange(idx);
|
643 | _this4.handleInputFocus(idx);
|
644 | return true;
|
645 | }
|
646 |
|
647 | return false;
|
648 | };
|
649 |
|
650 | this.isEnabled = function (idx) {
|
651 | var disabled = _this4.props.disabled;
|
652 |
|
653 |
|
654 | return Array.isArray(disabled) ? idx === undefined ? !disabled[0] && !disabled[1] : !disabled[idx] : !disabled;
|
655 | };
|
656 |
|
657 | this.checkValueDisabled = function (val) {
|
658 | var disabledDate = _this4.props.disabledDate;
|
659 | var panelMode = _this4.state.panelMode;
|
660 |
|
661 | var values = (Array.isArray(val) ? val : [val]).map(function (value) {
|
662 | return checkDate(value);
|
663 | });
|
664 |
|
665 | if (!disabledDate) {
|
666 | return false;
|
667 | }
|
668 |
|
669 | return values.some(function (value) {
|
670 | return disabledDate(value, panelMode);
|
671 | });
|
672 | };
|
673 |
|
674 | this.onKeyDown = function (e) {
|
675 | switch (e.keyCode) {
|
676 | case _util.KEYCODE.ENTER:
|
677 | {
|
678 | var inputValue = _this4.state.inputValue;
|
679 |
|
680 | _this4.onClick();
|
681 | if (_this4.checkValueDisabled(inputValue)) {
|
682 |
|
683 | _this4.handleChange(inputValue, 'VISIBLE_CHANGE');
|
684 | return;
|
685 | }
|
686 | _this4.handleChange(inputValue, 'KEYDOWN_ENTER');
|
687 | break;
|
688 | }
|
689 | default:
|
690 | return;
|
691 | }
|
692 | };
|
693 |
|
694 | this.handleChange = function (v, eventType) {
|
695 | var format = _this4.props.format;
|
696 | var _state4 = _this4.state,
|
697 | isRange = _state4.isRange,
|
698 | showOk = _state4.showOk,
|
699 | value = _state4.value,
|
700 | preValue = _state4.preValue;
|
701 |
|
702 | var forceEvents = ['KEYDOWN_ENTER', 'CLICK_PRESET', 'CLICK_OK', 'INPUT_CLEAR', 'VISIBLE_CHANGE'];
|
703 | var isTemporary = showOk && !forceEvents.includes(eventType);
|
704 |
|
705 |
|
706 | v = eventType === 'VISIBLE_CHANGE' ? value : _this4.checkValue(v, !isTemporary);
|
707 |
|
708 | _this4.setState({
|
709 | curValue: v,
|
710 | inputValue: (0, _util2.fmtValue)(v, format)
|
711 | });
|
712 |
|
713 | if (!isTemporary) {
|
714 | _this4.setState({
|
715 | value: v
|
716 | }, function () {
|
717 |
|
718 |
|
719 |
|
720 |
|
721 | var shouldHidePanel = !isRange || ['CLICK_PRESET', 'VISIBLE_CHANGE', 'INPUT_CLEAR'].includes(eventType) || !_this4.shouldSwitchInput(v);
|
722 |
|
723 | if (shouldHidePanel) {
|
724 | _this4.onVisibleChange(false);
|
725 |
|
726 | if ((0, _util2.isValueChanged)(v, preValue)) {
|
727 | _this4.onChange();
|
728 | }
|
729 | }
|
730 | });
|
731 | }
|
732 | };
|
733 |
|
734 | this.onChange = function () {
|
735 | var state = _this4.state,
|
736 | props = _this4.props;
|
737 | var format = props.format;
|
738 |
|
739 |
|
740 | var value = _this4.checkValue('value' in props ? props.value : state.value);
|
741 |
|
742 | _this4.setState({
|
743 | curValue: value,
|
744 | preValue: value,
|
745 | inputValue: (0, _util2.fmtValue)(value, format)
|
746 | });
|
747 |
|
748 | _util.func.invoke(_this4.props, 'onChange', _this4.getOutputArgs(state.value));
|
749 | };
|
750 |
|
751 | this.onOk = function () {
|
752 | var inputValue = _this4.state.inputValue;
|
753 |
|
754 | var checkedValue = _this4.checkValue(inputValue);
|
755 |
|
756 | _util.func.invoke(_this4.props, 'onOk', _this4.getOutputArgs(checkedValue));
|
757 |
|
758 | _this4.setState({ value: checkedValue });
|
759 | _this4.handleChange(checkedValue, 'CLICK_OK');
|
760 | };
|
761 |
|
762 | this.onInputTypeChange = function (idx) {
|
763 | var _state5 = _this4.state,
|
764 | inputType = _state5.inputType,
|
765 | visible = _state5.visible;
|
766 |
|
767 |
|
768 | if (idx !== inputType) {
|
769 | _this4.setState({
|
770 | inputType: idx,
|
771 | justBeginInput: !(idx !== null && visible)
|
772 | });
|
773 | }
|
774 | };
|
775 |
|
776 | this.onClick = function () {
|
777 | var _state6 = _this4.state,
|
778 | visible = _state6.visible,
|
779 | inputType = _state6.inputType;
|
780 |
|
781 |
|
782 | if (!visible) {
|
783 | _this4.handleInputFocus(inputType);
|
784 | }
|
785 | };
|
786 |
|
787 | this.getOutputArgs = function (value) {
|
788 | var _props3 = _this4.props,
|
789 | outputFormat = _props3.outputFormat,
|
790 | format = _props3.format;
|
791 |
|
792 |
|
793 | if (outputFormat) {
|
794 | return [(0, _util2.fmtValue)(value, outputFormat)];
|
795 | }
|
796 | return [value, (0, _util2.fmtValue)(value, format)];
|
797 | };
|
798 |
|
799 | this.getCurrentAlign = function (_ref) {
|
800 | var align = _ref.align;
|
801 |
|
802 | _this4.setState({
|
803 | align: align
|
804 | });
|
805 | };
|
806 |
|
807 | this.getRangeInputOffsetLeft = function () {
|
808 | var left = _this4.dateInput && _this4.dateInput.input && _this4.dateInput.input[_this4.state.inputType] && _this4.dateInput.input[_this4.state.inputType].getInputNode().offsetLeft;
|
809 |
|
810 | return left;
|
811 | };
|
812 |
|
813 | this.getPopupOffsetLeft = function () {
|
814 | var inputOffsetLeft = _this4.getRangeInputOffsetLeft();
|
815 | var popupElement = _this4.popupRef.current;
|
816 | var popupElementWidth = popupElement ? popupElement.offsetWidth : 0;
|
817 |
|
818 |
|
819 | if (popupElementWidth > 1.2 * inputOffsetLeft) {
|
820 | return {
|
821 | arrowLeft: inputOffsetLeft,
|
822 | panelLeft: 0
|
823 | };
|
824 | } else {
|
825 |
|
826 | return {
|
827 | arrowLeft: 0,
|
828 | panelLeft: inputOffsetLeft
|
829 | };
|
830 | }
|
831 | };
|
832 |
|
833 | this.renderArrow = function (left) {
|
834 | return _react2.default.createElement('div', { key: 'arrow', className: _this4.props.prefix + 'range-picker2-arrow', style: { left: left } });
|
835 | };
|
836 | }, _temp);
|
837 | Picker.displayName = 'Picker';
|
838 | exports.default = (0, _reactLifecyclesCompat.polyfill)(Picker);
|
839 | module.exports = exports['default']; |
\ | No newline at end of file |