1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _extends2 = require('babel-runtime/helpers/extends');
|
6 |
|
7 | var _extends3 = _interopRequireDefault(_extends2);
|
8 |
|
9 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
10 |
|
11 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
12 |
|
13 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
14 |
|
15 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
16 |
|
17 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
18 |
|
19 | var _inherits3 = _interopRequireDefault(_inherits2);
|
20 |
|
21 | var _react = require('react');
|
22 |
|
23 | var _react2 = _interopRequireDefault(_react);
|
24 |
|
25 | var _propTypes = require('prop-types');
|
26 |
|
27 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
28 |
|
29 | var _moment = require('moment');
|
30 |
|
31 | var _moment2 = _interopRequireDefault(_moment);
|
32 |
|
33 | var _classnames2 = require('classnames');
|
34 |
|
35 | var _classnames3 = _interopRequireDefault(_classnames2);
|
36 |
|
37 | var _reactLifecyclesCompat = require('react-lifecycles-compat');
|
38 |
|
39 | var _KeyCode = require('rc-util/lib/KeyCode');
|
40 |
|
41 | var _KeyCode2 = _interopRequireDefault(_KeyCode);
|
42 |
|
43 | var _CalendarPart = require('./range-calendar/CalendarPart');
|
44 |
|
45 | var _CalendarPart2 = _interopRequireDefault(_CalendarPart);
|
46 |
|
47 | var _TodayButton = require('./calendar/TodayButton');
|
48 |
|
49 | var _TodayButton2 = _interopRequireDefault(_TodayButton);
|
50 |
|
51 | var _OkButton = require('./calendar/OkButton');
|
52 |
|
53 | var _OkButton2 = _interopRequireDefault(_OkButton);
|
54 |
|
55 | var _TimePickerButton = require('./calendar/TimePickerButton');
|
56 |
|
57 | var _TimePickerButton2 = _interopRequireDefault(_TimePickerButton);
|
58 |
|
59 | var _CommonMixin = require('./mixin/CommonMixin');
|
60 |
|
61 | var _util = require('./util');
|
62 |
|
63 | var _toTime = require('./util/toTime');
|
64 |
|
65 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
|
66 |
|
67 | function noop() {}
|
68 |
|
69 | function isEmptyArray(arr) {
|
70 | return Array.isArray(arr) && (arr.length === 0 || arr.every(function (i) {
|
71 | return !i;
|
72 | }));
|
73 | }
|
74 |
|
75 | function isArraysEqual(a, b) {
|
76 | if (a === b) return true;
|
77 | if (a === null || typeof a === 'undefined' || b === null || typeof b === 'undefined') {
|
78 | return false;
|
79 | }
|
80 | if (a.length !== b.length) return false;
|
81 |
|
82 | for (var i = 0; i < a.length; ++i) {
|
83 | if (a[i] !== b[i]) return false;
|
84 | }
|
85 | return true;
|
86 | }
|
87 |
|
88 | function getValueFromSelectedValue(selectedValue) {
|
89 | var start = selectedValue[0],
|
90 | end = selectedValue[1];
|
91 |
|
92 | if (end && (start === undefined || start === null)) {
|
93 | start = end.clone().subtract(1, 'month');
|
94 | }
|
95 |
|
96 | if (start && (end === undefined || end === null)) {
|
97 | end = start.clone().add(1, 'month');
|
98 | }
|
99 | return [start, end];
|
100 | }
|
101 |
|
102 | function normalizeAnchor(props, init) {
|
103 | var selectedValue = props.selectedValue || init && props.defaultSelectedValue;
|
104 | var value = props.value || init && props.defaultValue;
|
105 | var normalizedValue = value ? getValueFromSelectedValue(value) : getValueFromSelectedValue(selectedValue);
|
106 | return !isEmptyArray(normalizedValue) ? normalizedValue : init && [(0, _moment2['default'])(), (0, _moment2['default'])().add(1, 'months')];
|
107 | }
|
108 |
|
109 | function generateOptions(length, extraOptionGen) {
|
110 | var arr = extraOptionGen ? extraOptionGen().concat() : [];
|
111 | for (var value = 0; value < length; value++) {
|
112 | if (arr.indexOf(value) === -1) {
|
113 | arr.push(value);
|
114 | }
|
115 | }
|
116 | return arr;
|
117 | }
|
118 |
|
119 | function onInputSelect(direction, value, cause) {
|
120 | if (!value) {
|
121 | return;
|
122 | }
|
123 | var originalValue = this.state.selectedValue;
|
124 | var selectedValue = originalValue.concat();
|
125 | var index = direction === 'left' ? 0 : 1;
|
126 | selectedValue[index] = value;
|
127 | if (selectedValue[0] && this.compare(selectedValue[0], selectedValue[1]) > 0) {
|
128 | selectedValue[1 - index] = this.state.showTimePicker ? selectedValue[index] : undefined;
|
129 | }
|
130 | this.props.onInputSelect(selectedValue);
|
131 | this.fireSelectValueChange(selectedValue, null, cause || { source: 'dateInput' });
|
132 | }
|
133 |
|
134 | var RangeCalendar = function (_React$Component) {
|
135 | (0, _inherits3['default'])(RangeCalendar, _React$Component);
|
136 |
|
137 | function RangeCalendar(props) {
|
138 | (0, _classCallCheck3['default'])(this, RangeCalendar);
|
139 |
|
140 | var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
|
141 |
|
142 | _initialiseProps.call(_this);
|
143 |
|
144 | var selectedValue = props.selectedValue || props.defaultSelectedValue;
|
145 | var value = normalizeAnchor(props, 1);
|
146 | _this.state = {
|
147 | selectedValue: selectedValue,
|
148 | prevSelectedValue: selectedValue,
|
149 | firstSelectedValue: null,
|
150 | hoverValue: props.hoverValue || [],
|
151 | value: value,
|
152 | showTimePicker: false,
|
153 | mode: props.mode || ['date', 'date'],
|
154 | panelTriggerSource: ''
|
155 | };
|
156 | return _this;
|
157 | }
|
158 |
|
159 | RangeCalendar.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, state) {
|
160 | var newState = {};
|
161 | if ('value' in nextProps) {
|
162 | newState.value = normalizeAnchor(nextProps, 0);
|
163 | }
|
164 | if ('hoverValue' in nextProps && !isArraysEqual(state.hoverValue, nextProps.hoverValue)) {
|
165 | newState.hoverValue = nextProps.hoverValue;
|
166 | }
|
167 | if ('selectedValue' in nextProps) {
|
168 | newState.selectedValue = nextProps.selectedValue;
|
169 | newState.prevSelectedValue = nextProps.selectedValue;
|
170 | }
|
171 | if ('mode' in nextProps && !isArraysEqual(state.mode, nextProps.mode)) {
|
172 | newState.mode = nextProps.mode;
|
173 | }
|
174 | return newState;
|
175 | };
|
176 |
|
177 |
|
178 |
|
179 |
|
180 | RangeCalendar.prototype.render = function render() {
|
181 | var _className, _classnames;
|
182 |
|
183 | var props = this.props,
|
184 | state = this.state;
|
185 | var prefixCls = props.prefixCls,
|
186 | dateInputPlaceholder = props.dateInputPlaceholder,
|
187 | seperator = props.seperator,
|
188 | timePicker = props.timePicker,
|
189 | showOk = props.showOk,
|
190 | locale = props.locale,
|
191 | showClear = props.showClear,
|
192 | showToday = props.showToday,
|
193 | type = props.type,
|
194 | clearIcon = props.clearIcon;
|
195 | var hoverValue = state.hoverValue,
|
196 | selectedValue = state.selectedValue,
|
197 | mode = state.mode,
|
198 | showTimePicker = state.showTimePicker;
|
199 |
|
200 | var className = (_className = {}, _className[props.className] = !!props.className, _className[prefixCls] = 1, _className[prefixCls + '-hidden'] = !props.visible, _className[prefixCls + '-range'] = 1, _className[prefixCls + '-show-time-picker'] = showTimePicker, _className[prefixCls + '-week-number'] = props.showWeekNumber, _className);
|
201 | var classes = (0, _classnames3['default'])(className);
|
202 | var newProps = {
|
203 | selectedValue: state.selectedValue,
|
204 | onSelect: this.onSelect,
|
205 | onDayHover: type === 'start' && selectedValue[1] || type === 'end' && selectedValue[0] || !!hoverValue.length ? this.onDayHover : undefined
|
206 | };
|
207 |
|
208 | var placeholder1 = void 0;
|
209 | var placeholder2 = void 0;
|
210 |
|
211 | if (dateInputPlaceholder) {
|
212 | if (Array.isArray(dateInputPlaceholder)) {
|
213 | placeholder1 = dateInputPlaceholder[0];
|
214 | placeholder2 = dateInputPlaceholder[1];
|
215 | } else {
|
216 | placeholder1 = placeholder2 = dateInputPlaceholder;
|
217 | }
|
218 | }
|
219 | var showOkButton = showOk === true || showOk !== false && !!timePicker;
|
220 | var cls = (0, _classnames3['default'])((_classnames = {}, _classnames[prefixCls + '-footer'] = true, _classnames[prefixCls + '-range-bottom'] = true, _classnames[prefixCls + '-footer-show-ok'] = showOkButton, _classnames));
|
221 |
|
222 | var startValue = this.getStartValue();
|
223 | var endValue = this.getEndValue();
|
224 | var todayTime = (0, _util.getTodayTime)(startValue);
|
225 | var thisMonth = todayTime.month();
|
226 | var thisYear = todayTime.year();
|
227 | var isTodayInView = startValue.year() === thisYear && startValue.month() === thisMonth || endValue.year() === thisYear && endValue.month() === thisMonth;
|
228 | var nextMonthOfStart = startValue.clone().add(1, 'months');
|
229 | var isClosestMonths = nextMonthOfStart.year() === endValue.year() && nextMonthOfStart.month() === endValue.month();
|
230 |
|
231 | var extraFooter = props.renderFooter();
|
232 |
|
233 | return _react2['default'].createElement(
|
234 | 'div',
|
235 | {
|
236 | ref: this.saveRoot,
|
237 | className: classes,
|
238 | style: props.style,
|
239 | tabIndex: '0',
|
240 | onKeyDown: this.onKeyDown
|
241 | },
|
242 | props.renderSidebar(),
|
243 | _react2['default'].createElement(
|
244 | 'div',
|
245 | { className: prefixCls + '-panel' },
|
246 | showClear && selectedValue[0] && selectedValue[1] ? _react2['default'].createElement(
|
247 | 'a',
|
248 | {
|
249 | role: 'button',
|
250 | title: locale.clear,
|
251 | onClick: this.clear
|
252 | },
|
253 | clearIcon || _react2['default'].createElement('span', { className: prefixCls + '-clear-btn' })
|
254 | ) : null,
|
255 | _react2['default'].createElement(
|
256 | 'div',
|
257 | {
|
258 | className: prefixCls + '-date-panel',
|
259 | onMouseLeave: type !== 'both' ? this.onDatePanelLeave : undefined,
|
260 | onMouseEnter: type !== 'both' ? this.onDatePanelEnter : undefined
|
261 | },
|
262 | _react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
|
263 | hoverValue: hoverValue,
|
264 | direction: 'left',
|
265 | disabledTime: this.disabledStartTime,
|
266 | disabledMonth: this.disabledStartMonth,
|
267 | format: this.getFormat(),
|
268 | value: startValue,
|
269 | mode: mode[0],
|
270 | placeholder: placeholder1,
|
271 | onInputChange: this.onStartInputChange,
|
272 | onInputSelect: this.onStartInputSelect,
|
273 | onValueChange: this.onStartValueChange,
|
274 | onPanelChange: this.onStartPanelChange,
|
275 | showDateInput: this.props.showDateInput,
|
276 | timePicker: timePicker,
|
277 | showTimePicker: showTimePicker || mode[0] === 'time',
|
278 | enablePrev: true,
|
279 | enableNext: !isClosestMonths || this.isMonthYearPanelShow(mode[1]),
|
280 | clearIcon: clearIcon
|
281 | })),
|
282 | _react2['default'].createElement(
|
283 | 'span',
|
284 | { className: prefixCls + '-range-middle' },
|
285 | seperator
|
286 | ),
|
287 | _react2['default'].createElement(_CalendarPart2['default'], (0, _extends3['default'])({}, props, newProps, {
|
288 | hoverValue: hoverValue,
|
289 | direction: 'right',
|
290 | format: this.getFormat(),
|
291 | timePickerDisabledTime: this.getEndDisableTime(),
|
292 | placeholder: placeholder2,
|
293 | value: endValue,
|
294 | mode: mode[1],
|
295 | onInputChange: this.onEndInputChange,
|
296 | onInputSelect: this.onEndInputSelect,
|
297 | onValueChange: this.onEndValueChange,
|
298 | onPanelChange: this.onEndPanelChange,
|
299 | showDateInput: this.props.showDateInput,
|
300 | timePicker: timePicker,
|
301 | showTimePicker: showTimePicker || mode[1] === 'time',
|
302 | disabledTime: this.disabledEndTime,
|
303 | disabledMonth: this.disabledEndMonth,
|
304 | enablePrev: !isClosestMonths || this.isMonthYearPanelShow(mode[0]),
|
305 | enableNext: true,
|
306 | clearIcon: clearIcon
|
307 | }))
|
308 | ),
|
309 | _react2['default'].createElement(
|
310 | 'div',
|
311 | { className: cls },
|
312 | showToday || props.timePicker || showOkButton || extraFooter ? _react2['default'].createElement(
|
313 | 'div',
|
314 | { className: prefixCls + '-footer-btn' },
|
315 | extraFooter,
|
316 | showToday ? _react2['default'].createElement(_TodayButton2['default'], (0, _extends3['default'])({}, props, {
|
317 | disabled: isTodayInView,
|
318 | value: state.value[0],
|
319 | onToday: this.onToday,
|
320 | text: locale.backToToday
|
321 | })) : null,
|
322 | props.timePicker ? _react2['default'].createElement(_TimePickerButton2['default'], (0, _extends3['default'])({}, props, {
|
323 | showTimePicker: showTimePicker || mode[0] === 'time' && mode[1] === 'time',
|
324 | onOpenTimePicker: this.onOpenTimePicker,
|
325 | onCloseTimePicker: this.onCloseTimePicker,
|
326 | timePickerDisabled: !this.hasSelectedValue() || hoverValue.length
|
327 | })) : null,
|
328 | showOkButton ? _react2['default'].createElement(_OkButton2['default'], (0, _extends3['default'])({}, props, {
|
329 | onOk: this.onOk,
|
330 | okDisabled: !this.isAllowedDateAndTime(selectedValue) || !this.hasSelectedValue() || hoverValue.length
|
331 | })) : null
|
332 | ) : null
|
333 | )
|
334 | )
|
335 | );
|
336 | };
|
337 |
|
338 | return RangeCalendar;
|
339 | }(_react2['default'].Component);
|
340 |
|
341 | RangeCalendar.propTypes = (0, _extends3['default'])({}, _CommonMixin.propType, {
|
342 | prefixCls: _propTypes2['default'].string,
|
343 | dateInputPlaceholder: _propTypes2['default'].any,
|
344 | seperator: _propTypes2['default'].string,
|
345 | defaultValue: _propTypes2['default'].any,
|
346 | value: _propTypes2['default'].any,
|
347 | hoverValue: _propTypes2['default'].any,
|
348 | mode: _propTypes2['default'].arrayOf(_propTypes2['default'].oneOf(['time', 'date', 'month', 'year', 'decade'])),
|
349 | showDateInput: _propTypes2['default'].bool,
|
350 | timePicker: _propTypes2['default'].any,
|
351 | showOk: _propTypes2['default'].bool,
|
352 | showToday: _propTypes2['default'].bool,
|
353 | defaultSelectedValue: _propTypes2['default'].array,
|
354 | selectedValue: _propTypes2['default'].array,
|
355 | onOk: _propTypes2['default'].func,
|
356 | showClear: _propTypes2['default'].bool,
|
357 | locale: _propTypes2['default'].object,
|
358 | onChange: _propTypes2['default'].func,
|
359 | onSelect: _propTypes2['default'].func,
|
360 | onValueChange: _propTypes2['default'].func,
|
361 | onHoverChange: _propTypes2['default'].func,
|
362 | onPanelChange: _propTypes2['default'].func,
|
363 | format: _propTypes2['default'].oneOfType([_propTypes2['default'].string, _propTypes2['default'].arrayOf(_propTypes2['default'].string)]),
|
364 | onClear: _propTypes2['default'].func,
|
365 | type: _propTypes2['default'].any,
|
366 | disabledDate: _propTypes2['default'].func,
|
367 | disabledTime: _propTypes2['default'].func,
|
368 | clearIcon: _propTypes2['default'].node,
|
369 | onKeyDown: _propTypes2['default'].func
|
370 | });
|
371 | RangeCalendar.defaultProps = (0, _extends3['default'])({}, _CommonMixin.defaultProp, {
|
372 | type: 'both',
|
373 | seperator: '~',
|
374 | defaultSelectedValue: [],
|
375 | onValueChange: noop,
|
376 | onHoverChange: noop,
|
377 | onPanelChange: noop,
|
378 | disabledTime: noop,
|
379 | onInputSelect: noop,
|
380 | showToday: true,
|
381 | showDateInput: true
|
382 | });
|
383 |
|
384 | var _initialiseProps = function _initialiseProps() {
|
385 | var _this2 = this;
|
386 |
|
387 | this.onDatePanelEnter = function () {
|
388 | if (_this2.hasSelectedValue()) {
|
389 | _this2.fireHoverValueChange(_this2.state.selectedValue.concat());
|
390 | }
|
391 | };
|
392 |
|
393 | this.onDatePanelLeave = function () {
|
394 | if (_this2.hasSelectedValue()) {
|
395 | _this2.fireHoverValueChange([]);
|
396 | }
|
397 | };
|
398 |
|
399 | this.onSelect = function (value) {
|
400 | var type = _this2.props.type;
|
401 | var _state = _this2.state,
|
402 | selectedValue = _state.selectedValue,
|
403 | prevSelectedValue = _state.prevSelectedValue,
|
404 | firstSelectedValue = _state.firstSelectedValue;
|
405 |
|
406 | var nextSelectedValue = void 0;
|
407 | if (type === 'both') {
|
408 | if (!firstSelectedValue) {
|
409 | (0, _util.syncTime)(prevSelectedValue[0], value);
|
410 | nextSelectedValue = [value];
|
411 | } else if (_this2.compare(firstSelectedValue, value) < 0) {
|
412 | (0, _util.syncTime)(prevSelectedValue[1], value);
|
413 | nextSelectedValue = [firstSelectedValue, value];
|
414 | } else {
|
415 | (0, _util.syncTime)(prevSelectedValue[0], value);
|
416 | (0, _util.syncTime)(prevSelectedValue[1], firstSelectedValue);
|
417 | nextSelectedValue = [value, firstSelectedValue];
|
418 | }
|
419 | } else if (type === 'start') {
|
420 | (0, _util.syncTime)(prevSelectedValue[0], value);
|
421 | var endValue = selectedValue[1];
|
422 | nextSelectedValue = endValue && _this2.compare(endValue, value) > 0 ? [value, endValue] : [value];
|
423 | } else {
|
424 |
|
425 | var startValue = selectedValue[0];
|
426 | if (startValue && _this2.compare(startValue, value) <= 0) {
|
427 | (0, _util.syncTime)(prevSelectedValue[1], value);
|
428 | nextSelectedValue = [startValue, value];
|
429 | } else {
|
430 | (0, _util.syncTime)(prevSelectedValue[0], value);
|
431 | nextSelectedValue = [value];
|
432 | }
|
433 | }
|
434 |
|
435 | _this2.fireSelectValueChange(nextSelectedValue);
|
436 | };
|
437 |
|
438 | this.onKeyDown = function (event) {
|
439 | if (event.target.nodeName.toLowerCase() === 'input') {
|
440 | return;
|
441 | }
|
442 |
|
443 | var keyCode = event.keyCode;
|
444 |
|
445 | var ctrlKey = event.ctrlKey || event.metaKey;
|
446 |
|
447 | var _state2 = _this2.state,
|
448 | selectedValue = _state2.selectedValue,
|
449 | hoverValue = _state2.hoverValue,
|
450 | firstSelectedValue = _state2.firstSelectedValue,
|
451 | value = _state2.value;
|
452 | var _props = _this2.props,
|
453 | onKeyDown = _props.onKeyDown,
|
454 | disabledDate = _props.disabledDate;
|
455 |
|
456 |
|
457 |
|
458 | var updateHoverPoint = function updateHoverPoint(func) {
|
459 |
|
460 | var currentHoverTime = void 0;
|
461 | var nextHoverTime = void 0;
|
462 | var nextHoverValue = void 0;
|
463 |
|
464 | if (!firstSelectedValue) {
|
465 | currentHoverTime = hoverValue[0] || selectedValue[0] || value[0] || (0, _moment2['default'])();
|
466 | nextHoverTime = func(currentHoverTime);
|
467 | nextHoverValue = [nextHoverTime];
|
468 | _this2.fireHoverValueChange(nextHoverValue);
|
469 | } else {
|
470 | if (hoverValue.length === 1) {
|
471 | currentHoverTime = hoverValue[0].clone();
|
472 | nextHoverTime = func(currentHoverTime);
|
473 | nextHoverValue = _this2.onDayHover(nextHoverTime);
|
474 | } else {
|
475 | currentHoverTime = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
|
476 | nextHoverTime = func(currentHoverTime);
|
477 | nextHoverValue = _this2.onDayHover(nextHoverTime);
|
478 | }
|
479 | }
|
480 |
|
481 |
|
482 | if (nextHoverValue.length >= 2) {
|
483 | var miss = nextHoverValue.some(function (ht) {
|
484 | return !(0, _toTime.includesTime)(value, ht, 'month');
|
485 | });
|
486 | if (miss) {
|
487 | var newValue = nextHoverValue.slice().sort(function (t1, t2) {
|
488 | return t1.valueOf() - t2.valueOf();
|
489 | });
|
490 | if (newValue[0].isSame(newValue[1], 'month')) {
|
491 | newValue[1] = newValue[0].clone().add(1, 'month');
|
492 | }
|
493 | _this2.fireValueChange(newValue);
|
494 | }
|
495 | } else if (nextHoverValue.length === 1) {
|
496 |
|
497 | var oriValueIndex = value.findIndex(function (time) {
|
498 | return time.isSame(currentHoverTime, 'month');
|
499 | });
|
500 | if (oriValueIndex === -1) oriValueIndex = 0;
|
501 |
|
502 | if (value.every(function (time) {
|
503 | return !time.isSame(nextHoverTime, 'month');
|
504 | })) {
|
505 | var _newValue = value.slice();
|
506 | _newValue[oriValueIndex] = nextHoverTime.clone();
|
507 | _this2.fireValueChange(_newValue);
|
508 | }
|
509 | }
|
510 |
|
511 | event.preventDefault();
|
512 |
|
513 | return nextHoverTime;
|
514 | };
|
515 |
|
516 | switch (keyCode) {
|
517 | case _KeyCode2['default'].DOWN:
|
518 | updateHoverPoint(function (time) {
|
519 | return (0, _toTime.goTime)(time, 1, 'weeks');
|
520 | });
|
521 | return;
|
522 | case _KeyCode2['default'].UP:
|
523 | updateHoverPoint(function (time) {
|
524 | return (0, _toTime.goTime)(time, -1, 'weeks');
|
525 | });
|
526 | return;
|
527 | case _KeyCode2['default'].LEFT:
|
528 | if (ctrlKey) {
|
529 | updateHoverPoint(function (time) {
|
530 | return (0, _toTime.goTime)(time, -1, 'years');
|
531 | });
|
532 | } else {
|
533 | updateHoverPoint(function (time) {
|
534 | return (0, _toTime.goTime)(time, -1, 'days');
|
535 | });
|
536 | }
|
537 | return;
|
538 | case _KeyCode2['default'].RIGHT:
|
539 | if (ctrlKey) {
|
540 | updateHoverPoint(function (time) {
|
541 | return (0, _toTime.goTime)(time, 1, 'years');
|
542 | });
|
543 | } else {
|
544 | updateHoverPoint(function (time) {
|
545 | return (0, _toTime.goTime)(time, 1, 'days');
|
546 | });
|
547 | }
|
548 | return;
|
549 | case _KeyCode2['default'].HOME:
|
550 | updateHoverPoint(function (time) {
|
551 | return (0, _toTime.goStartMonth)(time);
|
552 | });
|
553 | return;
|
554 | case _KeyCode2['default'].END:
|
555 | updateHoverPoint(function (time) {
|
556 | return (0, _toTime.goEndMonth)(time);
|
557 | });
|
558 | return;
|
559 | case _KeyCode2['default'].PAGE_DOWN:
|
560 | updateHoverPoint(function (time) {
|
561 | return (0, _toTime.goTime)(time, 1, 'month');
|
562 | });
|
563 | return;
|
564 | case _KeyCode2['default'].PAGE_UP:
|
565 | updateHoverPoint(function (time) {
|
566 | return (0, _toTime.goTime)(time, -1, 'month');
|
567 | });
|
568 | return;
|
569 | case _KeyCode2['default'].ENTER:
|
570 | {
|
571 | var lastValue = void 0;
|
572 | if (hoverValue.length === 0) {
|
573 | lastValue = updateHoverPoint(function (time) {
|
574 | return time;
|
575 | });
|
576 | } else if (hoverValue.length === 1) {
|
577 | lastValue = hoverValue[0];
|
578 | } else {
|
579 | lastValue = hoverValue[0].isSame(firstSelectedValue, 'day') ? hoverValue[1] : hoverValue[0];
|
580 | }
|
581 | if (lastValue && (!disabledDate || !disabledDate(lastValue))) {
|
582 | _this2.onSelect(lastValue);
|
583 | }
|
584 | event.preventDefault();
|
585 | return;
|
586 | }
|
587 | default:
|
588 | if (onKeyDown) {
|
589 | onKeyDown(event);
|
590 | }
|
591 | }
|
592 | };
|
593 |
|
594 | this.onDayHover = function (value) {
|
595 | var hoverValue = [];
|
596 | var _state3 = _this2.state,
|
597 | selectedValue = _state3.selectedValue,
|
598 | firstSelectedValue = _state3.firstSelectedValue;
|
599 | var type = _this2.props.type;
|
600 |
|
601 | if (type === 'start' && selectedValue[1]) {
|
602 | hoverValue = _this2.compare(value, selectedValue[1]) < 0 ? [value, selectedValue[1]] : [value];
|
603 | } else if (type === 'end' && selectedValue[0]) {
|
604 | hoverValue = _this2.compare(value, selectedValue[0]) > 0 ? [selectedValue[0], value] : [];
|
605 | } else {
|
606 | if (!firstSelectedValue) {
|
607 | if (_this2.state.hoverValue.length) {
|
608 | _this2.setState({ hoverValue: [] });
|
609 | }
|
610 | return hoverValue;
|
611 | }
|
612 | hoverValue = _this2.compare(value, firstSelectedValue) < 0 ? [value, firstSelectedValue] : [firstSelectedValue, value];
|
613 | }
|
614 | _this2.fireHoverValueChange(hoverValue);
|
615 |
|
616 | return hoverValue;
|
617 | };
|
618 |
|
619 | this.onToday = function () {
|
620 | var startValue = (0, _util.getTodayTime)(_this2.state.value[0]);
|
621 | var endValue = startValue.clone().add(1, 'months');
|
622 | _this2.setState({ value: [startValue, endValue] });
|
623 | };
|
624 |
|
625 | this.onOpenTimePicker = function () {
|
626 | _this2.setState({
|
627 | showTimePicker: true
|
628 | });
|
629 | };
|
630 |
|
631 | this.onCloseTimePicker = function () {
|
632 | _this2.setState({
|
633 | showTimePicker: false
|
634 | });
|
635 | };
|
636 |
|
637 | this.onOk = function () {
|
638 | var selectedValue = _this2.state.selectedValue;
|
639 |
|
640 | if (_this2.isAllowedDateAndTime(selectedValue)) {
|
641 | _this2.props.onOk(_this2.state.selectedValue);
|
642 | }
|
643 | };
|
644 |
|
645 | this.onStartInputChange = function () {
|
646 | for (var _len = arguments.length, oargs = Array(_len), _key = 0; _key < _len; _key++) {
|
647 | oargs[_key] = arguments[_key];
|
648 | }
|
649 |
|
650 | var args = ['left'].concat(oargs);
|
651 | return onInputSelect.apply(_this2, args);
|
652 | };
|
653 |
|
654 | this.onEndInputChange = function () {
|
655 | for (var _len2 = arguments.length, oargs = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
656 | oargs[_key2] = arguments[_key2];
|
657 | }
|
658 |
|
659 | var args = ['right'].concat(oargs);
|
660 | return onInputSelect.apply(_this2, args);
|
661 | };
|
662 |
|
663 | this.onStartInputSelect = function (value) {
|
664 | var args = ['left', value, { source: 'dateInputSelect' }];
|
665 | return onInputSelect.apply(_this2, args);
|
666 | };
|
667 |
|
668 | this.onEndInputSelect = function (value) {
|
669 | var args = ['right', value, { source: 'dateInputSelect' }];
|
670 | return onInputSelect.apply(_this2, args);
|
671 | };
|
672 |
|
673 | this.onStartValueChange = function (leftValue) {
|
674 | var value = [].concat(_this2.state.value);
|
675 | value[0] = leftValue;
|
676 | return _this2.fireValueChange(value);
|
677 | };
|
678 |
|
679 | this.onEndValueChange = function (rightValue) {
|
680 | var value = [].concat(_this2.state.value);
|
681 | value[1] = rightValue;
|
682 | return _this2.fireValueChange(value);
|
683 | };
|
684 |
|
685 | this.onStartPanelChange = function (value, mode) {
|
686 | var props = _this2.props,
|
687 | state = _this2.state;
|
688 |
|
689 | var newMode = [mode, state.mode[1]];
|
690 | var newState = {
|
691 | panelTriggerSource: 'start'
|
692 | };
|
693 | if (!('mode' in props)) {
|
694 | newState.mode = newMode;
|
695 | }
|
696 | _this2.setState(newState);
|
697 | var newValue = [value || state.value[0], state.value[1]];
|
698 | props.onPanelChange(newValue, newMode);
|
699 | };
|
700 |
|
701 | this.onEndPanelChange = function (value, mode) {
|
702 | var props = _this2.props,
|
703 | state = _this2.state;
|
704 |
|
705 | var newMode = [state.mode[0], mode];
|
706 | var newState = {
|
707 | panelTriggerSource: 'end'
|
708 | };
|
709 | if (!('mode' in props)) {
|
710 | newState.mode = newMode;
|
711 | }
|
712 | _this2.setState(newState);
|
713 | var newValue = [state.value[0], value || state.value[1]];
|
714 | props.onPanelChange(newValue, newMode);
|
715 | };
|
716 |
|
717 | this.getStartValue = function () {
|
718 | var _state4 = _this2.state,
|
719 | selectedValue = _state4.selectedValue,
|
720 | showTimePicker = _state4.showTimePicker,
|
721 | value = _state4.value,
|
722 | mode = _state4.mode,
|
723 | panelTriggerSource = _state4.panelTriggerSource;
|
724 |
|
725 | var startValue = value[0];
|
726 |
|
727 | if (selectedValue[0] && _this2.props.timePicker) {
|
728 | startValue = startValue.clone();
|
729 | (0, _util.syncTime)(selectedValue[0], startValue);
|
730 | }
|
731 | if (showTimePicker && selectedValue[0]) {
|
732 | startValue = selectedValue[0];
|
733 | }
|
734 |
|
735 |
|
736 | if (panelTriggerSource === 'end' && mode[0] === 'date' && mode[1] === 'date' && startValue.isSame(value[1], 'month')) {
|
737 | startValue = startValue.clone().subtract(1, 'month');
|
738 | }
|
739 |
|
740 | return startValue;
|
741 | };
|
742 |
|
743 | this.getEndValue = function () {
|
744 | var _state5 = _this2.state,
|
745 | value = _state5.value,
|
746 | selectedValue = _state5.selectedValue,
|
747 | showTimePicker = _state5.showTimePicker,
|
748 | mode = _state5.mode,
|
749 | panelTriggerSource = _state5.panelTriggerSource;
|
750 |
|
751 | var endValue = value[1] ? value[1].clone() : value[0].clone().add(1, 'month');
|
752 |
|
753 | if (selectedValue[1] && _this2.props.timePicker) {
|
754 | (0, _util.syncTime)(selectedValue[1], endValue);
|
755 | }
|
756 | if (showTimePicker) {
|
757 | endValue = selectedValue[1] ? selectedValue[1] : _this2.getStartValue();
|
758 | }
|
759 |
|
760 |
|
761 | if (!showTimePicker && panelTriggerSource !== 'end' && mode[0] === 'date' && mode[1] === 'date' && endValue.isSame(value[0], 'month')) {
|
762 | endValue = endValue.clone().add(1, 'month');
|
763 | }
|
764 |
|
765 | return endValue;
|
766 | };
|
767 |
|
768 | this.getEndDisableTime = function () {
|
769 | var _state6 = _this2.state,
|
770 | selectedValue = _state6.selectedValue,
|
771 | value = _state6.value;
|
772 | var disabledTime = _this2.props.disabledTime;
|
773 |
|
774 | var userSettingDisabledTime = disabledTime(selectedValue, 'end') || {};
|
775 | var startValue = selectedValue && selectedValue[0] || value[0].clone();
|
776 |
|
777 |
|
778 | if (!selectedValue[1] || startValue.isSame(selectedValue[1], 'day')) {
|
779 | var hours = startValue.hour();
|
780 | var minutes = startValue.minute();
|
781 | var second = startValue.second();
|
782 | var _disabledHours = userSettingDisabledTime.disabledHours,
|
783 | _disabledMinutes = userSettingDisabledTime.disabledMinutes,
|
784 | _disabledSeconds = userSettingDisabledTime.disabledSeconds;
|
785 |
|
786 | var oldDisabledMinutes = _disabledMinutes ? _disabledMinutes() : [];
|
787 | var olddisabledSeconds = _disabledSeconds ? _disabledSeconds() : [];
|
788 | _disabledHours = generateOptions(hours, _disabledHours);
|
789 | _disabledMinutes = generateOptions(minutes, _disabledMinutes);
|
790 | _disabledSeconds = generateOptions(second, _disabledSeconds);
|
791 | return {
|
792 | disabledHours: function disabledHours() {
|
793 | return _disabledHours;
|
794 | },
|
795 | disabledMinutes: function disabledMinutes(hour) {
|
796 | if (hour === hours) {
|
797 | return _disabledMinutes;
|
798 | }
|
799 | return oldDisabledMinutes;
|
800 | },
|
801 | disabledSeconds: function disabledSeconds(hour, minute) {
|
802 | if (hour === hours && minute === minutes) {
|
803 | return _disabledSeconds;
|
804 | }
|
805 | return olddisabledSeconds;
|
806 | }
|
807 | };
|
808 | }
|
809 | return userSettingDisabledTime;
|
810 | };
|
811 |
|
812 | this.isAllowedDateAndTime = function (selectedValue) {
|
813 | return (0, _util.isAllowedDate)(selectedValue[0], _this2.props.disabledDate, _this2.disabledStartTime) && (0, _util.isAllowedDate)(selectedValue[1], _this2.props.disabledDate, _this2.disabledEndTime);
|
814 | };
|
815 |
|
816 | this.isMonthYearPanelShow = function (mode) {
|
817 | return ['month', 'year', 'decade'].indexOf(mode) > -1;
|
818 | };
|
819 |
|
820 | this.hasSelectedValue = function () {
|
821 | var selectedValue = _this2.state.selectedValue;
|
822 |
|
823 | return !!selectedValue[1] && !!selectedValue[0];
|
824 | };
|
825 |
|
826 | this.compare = function (v1, v2) {
|
827 | if (_this2.props.timePicker) {
|
828 | return v1.diff(v2);
|
829 | }
|
830 | return v1.diff(v2, 'days');
|
831 | };
|
832 |
|
833 | this.fireSelectValueChange = function (selectedValue, direct, cause) {
|
834 | var timePicker = _this2.props.timePicker;
|
835 | var prevSelectedValue = _this2.state.prevSelectedValue;
|
836 |
|
837 | if (timePicker && timePicker.props.defaultValue) {
|
838 | var timePickerDefaultValue = timePicker.props.defaultValue;
|
839 | if (!prevSelectedValue[0] && selectedValue[0]) {
|
840 | (0, _util.syncTime)(timePickerDefaultValue[0], selectedValue[0]);
|
841 | }
|
842 | if (!prevSelectedValue[1] && selectedValue[1]) {
|
843 | (0, _util.syncTime)(timePickerDefaultValue[1], selectedValue[1]);
|
844 | }
|
845 | }
|
846 |
|
847 | if (!('selectedValue' in _this2.props)) {
|
848 | _this2.setState({
|
849 | selectedValue: selectedValue
|
850 | });
|
851 | }
|
852 |
|
853 |
|
854 | if (!_this2.state.selectedValue[0] || !_this2.state.selectedValue[1]) {
|
855 | var startValue = selectedValue[0] || (0, _moment2['default'])();
|
856 | var endValue = selectedValue[1] || startValue.clone().add(1, 'months');
|
857 | _this2.setState({
|
858 | selectedValue: selectedValue,
|
859 | value: getValueFromSelectedValue([startValue, endValue])
|
860 | });
|
861 | }
|
862 |
|
863 | if (selectedValue[0] && !selectedValue[1]) {
|
864 | _this2.setState({ firstSelectedValue: selectedValue[0] });
|
865 | _this2.fireHoverValueChange(selectedValue.concat());
|
866 | }
|
867 | _this2.props.onChange(selectedValue);
|
868 | if (direct || selectedValue[0] && selectedValue[1]) {
|
869 | _this2.setState({
|
870 | prevSelectedValue: selectedValue,
|
871 | firstSelectedValue: null
|
872 | });
|
873 | _this2.fireHoverValueChange([]);
|
874 | _this2.props.onSelect(selectedValue, cause);
|
875 | }
|
876 | };
|
877 |
|
878 | this.fireValueChange = function (value) {
|
879 | var props = _this2.props;
|
880 | if (!('value' in props)) {
|
881 | _this2.setState({
|
882 | value: value
|
883 | });
|
884 | }
|
885 | props.onValueChange(value);
|
886 | };
|
887 |
|
888 | this.fireHoverValueChange = function (hoverValue) {
|
889 | var props = _this2.props;
|
890 | if (!('hoverValue' in props)) {
|
891 | _this2.setState({ hoverValue: hoverValue });
|
892 | }
|
893 | props.onHoverChange(hoverValue);
|
894 | };
|
895 |
|
896 | this.clear = function () {
|
897 | _this2.fireSelectValueChange([], true);
|
898 | _this2.props.onClear();
|
899 | };
|
900 |
|
901 | this.disabledStartTime = function (time) {
|
902 | return _this2.props.disabledTime(time, 'start');
|
903 | };
|
904 |
|
905 | this.disabledEndTime = function (time) {
|
906 | return _this2.props.disabledTime(time, 'end');
|
907 | };
|
908 |
|
909 | this.disabledStartMonth = function (month) {
|
910 | var value = _this2.state.value;
|
911 |
|
912 | return month.isAfter(value[1], 'month');
|
913 | };
|
914 |
|
915 | this.disabledEndMonth = function (month) {
|
916 | var value = _this2.state.value;
|
917 |
|
918 | return month.isBefore(value[0], 'month');
|
919 | };
|
920 | };
|
921 |
|
922 | (0, _reactLifecyclesCompat.polyfill)(RangeCalendar);
|
923 |
|
924 | exports['default'] = (0, _CommonMixin.commonMixinWrapper)(RangeCalendar);
|
925 | module.exports = exports['default']; |
\ | No newline at end of file |