dareway-rui
Version:
502 lines (429 loc) • 21.7 kB
JavaScript
'use strict';
var _interopRequireDefault = require('@babel/runtime/helpers/interopRequireDefault');
Object.defineProperty(exports, '__esModule', {
value: true
});
exports.default = void 0;
var _objectSpread2 = _interopRequireDefault(require('@babel/runtime/helpers/objectSpread'));
var _classCallCheck2 = _interopRequireDefault(require('@babel/runtime/helpers/classCallCheck'));
var _createClass2 = _interopRequireDefault(require('@babel/runtime/helpers/createClass'));
var _possibleConstructorReturn2 = _interopRequireDefault(require('@babel/runtime/helpers/possibleConstructorReturn'));
var _getPrototypeOf2 = _interopRequireDefault(require('@babel/runtime/helpers/getPrototypeOf'));
var _assertThisInitialized2 = _interopRequireDefault(require('@babel/runtime/helpers/assertThisInitialized'));
var _inherits2 = _interopRequireDefault(require('@babel/runtime/helpers/inherits'));
var _defineProperty2 = _interopRequireDefault(require('@babel/runtime/helpers/defineProperty'));
var _react = _interopRequireDefault(require('react'));
var _reactDom = _interopRequireDefault(require('react-dom'));
var _propTypes = _interopRequireDefault(require('prop-types'));
var _KeyCode = _interopRequireDefault(require('rc-util/lib/KeyCode'));
var _reactLifecyclesCompat = require('react-lifecycles-compat');
var _DateTable = _interopRequireDefault(require('./date/DateTable'));
var _CalendarHeader = _interopRequireDefault(require('./calendar/CalendarHeader'));
var _CalendarFooter = _interopRequireDefault(require('./calendar/CalendarFooter'));
var _CalendarMixin = require('./mixin/CalendarMixin');
var _CommonMixin = require('./mixin/CommonMixin');
var _DateInput = _interopRequireDefault(require('./date/DateInput'));
var _util = require('./util');
var _toTime = require('./util/toTime');
var _moment = _interopRequireDefault(require('moment'));
function noop() {}
var Calendar =
/*#__PURE__*/
(function(_React$Component) {
(0, _inherits2.default)(Calendar, _React$Component);
function Calendar(_props) {
var _this;
(0, _classCallCheck2.default)(this, Calendar);
_this = (0, _possibleConstructorReturn2.default)(
this,
(0, _getPrototypeOf2.default)(Calendar).call(this, _props)
);
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onPanelChange', function(
value,
mode
) {
var _assertThisInitialize = (0, _assertThisInitialized2.default)(_this),
props = _assertThisInitialize.props,
state = _assertThisInitialize.state;
if (!('mode' in props)) {
_this.setState({
mode: mode
});
}
props.onPanelChange(value || state.value, mode);
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onKeyDown', function(event) {
if (event.target.nodeName.toLowerCase() === 'input') {
return undefined;
}
var keyCode = event.keyCode; // mac
var ctrlKey = event.ctrlKey || event.metaKey;
var disabledDate = _this.props.disabledDate;
var value = _this.state.value;
switch (keyCode) {
case _KeyCode.default.DOWN:
_this.goTime(1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode.default.UP:
_this.goTime(-1, 'weeks');
event.preventDefault();
return 1;
case _KeyCode.default.LEFT:
if (ctrlKey) {
_this.goTime(-1, 'years');
} else {
_this.goTime(-1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode.default.RIGHT:
if (ctrlKey) {
_this.goTime(1, 'years');
} else {
_this.goTime(1, 'days');
}
event.preventDefault();
return 1;
case _KeyCode.default.HOME:
_this.setValue((0, _toTime.goStartMonth)(_this.state.value));
event.preventDefault();
return 1;
case _KeyCode.default.END:
_this.setValue((0, _toTime.goEndMonth)(_this.state.value));
event.preventDefault();
return 1;
case _KeyCode.default.PAGE_DOWN:
_this.goTime(1, 'month');
event.preventDefault();
return 1;
case _KeyCode.default.PAGE_UP:
_this.goTime(-1, 'month');
event.preventDefault();
return 1;
case _KeyCode.default.ENTER:
if (!disabledDate || !disabledDate(value)) {
_this.onSelect(value, {
source: 'keyboard'
});
}
event.preventDefault();
return 1;
default:
_this.props.onKeyDown(event);
return 1;
}
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onClear', function() {
_this.onSelect(null);
_this.props.onClear();
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onOk', function() {
var selectedValue = _this.state.selectedValue;
if (_this.isAllowedDate(selectedValue)) {
_this.props.onOk(selectedValue);
}
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onDateInputChange', function(
value
) {
_this.onSelect(value, {
source: 'dateInput'
});
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onDateInputSelect', function(
value
) {
_this.onSelect(value, {
source: 'dateInputSelect'
});
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onDateTableSelect', function(
value
) {
var timePicker = _this.props.timePicker;
var selectedValue = _this.state.selectedValue;
if (!selectedValue && timePicker) {
var timePickerDefaultValue = timePicker.props.defaultValue;
if (timePickerDefaultValue) {
(0, _util.syncTime)(timePickerDefaultValue, value);
}
}
_this.onSelect(value);
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'onToday', function() {
var value = _this.state.value;
var now = (0, _util.getTodayTime)(value);
_this.onSelect(now, {
source: 'todayButton'
});
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'getRootDOMNode', function() {
return _reactDom.default.findDOMNode((0, _assertThisInitialized2.default)(_this));
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'openTimePicker', function() {
_this.onPanelChange(null, 'time');
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'closeTimePicker', function() {
_this.onPanelChange(null, 'date');
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'goTime', function(
direction,
unit
) {
_this.setValue((0, _toTime.goTime)(_this.state.value, direction, unit));
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), 'preventDefaultEvent', function(
e
) {
e.preventDefault();
});
_this.state = {
mode: _this.props.mode || 'date',
value: _props.value || _props.defaultValue || (0, _moment.default)(),
selectedValue: _props.selectedValue || _props.defaultSelectedValue
};
return _this;
}
(0, _createClass2.default)(
Calendar,
[
{
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.showDateInput) {
this.saveFocusElement(_DateInput.default.getInstance());
}
}
},
{
key: 'render',
value: function render() {
var props = this.props,
state = this.state;
var locale = props.locale,
prefixCls = props.prefixCls,
disabledDate = props.disabledDate,
dateInputPlaceholder = props.dateInputPlaceholder,
timePicker = props.timePicker,
disabledTime = props.disabledTime,
clearIcon = props.clearIcon,
renderFooter = props.renderFooter;
var value = state.value,
selectedValue = state.selectedValue,
mode = state.mode;
var showTimePicker = mode === 'time';
var disabledTimeConfig =
showTimePicker && disabledTime && timePicker
? (0, _util.getTimeConfig)(selectedValue, disabledTime)
: null;
var timePickerEle = null;
if (timePicker && showTimePicker) {
var timePickerProps = (0, _objectSpread2.default)(
{
showHour: true,
showSecond: true,
showMinute: true
},
timePicker.props,
disabledTimeConfig,
{
onChange: this.onDateInputChange,
onMouseDown: this.preventDefaultEvent,
value: selectedValue,
disabledTime: disabledTime
}
);
if (timePicker.props.defaultValue !== undefined) {
timePickerProps.defaultOpenValue = timePicker.props.defaultValue;
}
timePickerEle = _react.default.cloneElement(timePicker, timePickerProps);
}
var dateInputElement = props.showDateInput
? _react.default.createElement(_DateInput.default, {
format: this.getFormat(),
key: 'date-input',
value: value,
locale: locale,
placeholder: dateInputPlaceholder,
showClear: true,
disabledTime: disabledTime,
disabledDate: disabledDate,
onClear: this.onClear,
prefixCls: prefixCls,
selectedValue: selectedValue,
onChange: this.onDateInputChange,
onSelect: this.onDateInputSelect,
clearIcon: clearIcon
})
: null;
var children = [];
if (props.renderSidebar) {
children.push(props.renderSidebar());
}
children.push(
_react.default.createElement(
'div',
{
className: ''.concat(prefixCls, '-panel'),
key: 'panel'
},
dateInputElement,
_react.default.createElement(
'div',
{
tabIndex: this.props.focusablePanel ? 0 : undefined,
className: ''.concat(prefixCls, '-date-panel')
},
_react.default.createElement(_CalendarHeader.default, {
locale: locale,
mode: mode,
value: value,
onValueChange: this.setValue,
onPanelChange: this.onPanelChange,
renderFooter: renderFooter,
showTimePicker: showTimePicker,
prefixCls: prefixCls
}),
timePicker && showTimePicker
? _react.default.createElement(
'div',
{
className: ''.concat(prefixCls, '-time-picker')
},
_react.default.createElement(
'div',
{
className: ''.concat(prefixCls, '-time-picker-panel')
},
timePickerEle
)
)
: null,
_react.default.createElement(
'div',
{
className: ''.concat(prefixCls, '-body')
},
_react.default.createElement(_DateTable.default, {
locale: locale,
value: value,
selectedValue: selectedValue,
prefixCls: prefixCls,
dateRender: props.dateRender,
onSelect: this.onDateTableSelect,
disabledDate: disabledDate,
showWeekNumber: props.showWeekNumber
})
),
_react.default.createElement(_CalendarFooter.default, {
showOk: props.showOk,
mode: mode,
renderFooter: props.renderFooter,
locale: locale,
prefixCls: prefixCls,
showToday: props.showToday,
disabledTime: disabledTime,
showTimePicker: showTimePicker,
showDateInput: props.showDateInput,
timePicker: timePicker,
selectedValue: selectedValue,
value: value,
disabledDate: disabledDate,
okDisabled:
props.showOk !== false &&
(!selectedValue || !this.isAllowedDate(selectedValue)),
onOk: this.onOk,
onSelect: this.onSelect,
onToday: this.onToday,
onOpenTimePicker: this.openTimePicker,
onCloseTimePicker: this.closeTimePicker
})
)
)
);
return this.renderRoot({
children: children,
className: props.showWeekNumber ? ''.concat(prefixCls, '-week-number') : ''
});
}
}
],
[
{
key: 'getDerivedStateFromProps',
value: function getDerivedStateFromProps(nextProps, state) {
var value = nextProps.value,
selectedValue = nextProps.selectedValue;
var newState = {};
if ('mode' in nextProps && state.mode !== nextProps.mode) {
newState = {
mode: nextProps.mode
};
}
if ('value' in nextProps) {
newState.value =
value ||
nextProps.defaultValue ||
(0, _CalendarMixin.getNowByCurrentStateValue)(state.value);
}
if ('selectedValue' in nextProps) {
newState.selectedValue = selectedValue;
}
return newState;
}
}
]
);
return Calendar;
})(_react.default.Component);
(0, _defineProperty2.default)(
Calendar,
'propTypes',
(0, _objectSpread2.default)({}, _CalendarMixin.calendarMixinPropTypes, _CommonMixin.propType, {
prefixCls: _propTypes.default.string,
className: _propTypes.default.string,
style: _propTypes.default.object,
defaultValue: _propTypes.default.object,
value: _propTypes.default.object,
selectedValue: _propTypes.default.object,
defaultSelectedValue: _propTypes.default.object,
mode: _propTypes.default.oneOf(['time', 'date', 'month', 'year', 'decade']),
locale: _propTypes.default.object,
showDateInput: _propTypes.default.bool,
showWeekNumber: _propTypes.default.bool,
showToday: _propTypes.default.bool,
showOk: _propTypes.default.bool,
onSelect: _propTypes.default.func,
onOk: _propTypes.default.func,
onKeyDown: _propTypes.default.func,
timePicker: _propTypes.default.element,
dateInputPlaceholder: _propTypes.default.any,
onClear: _propTypes.default.func,
onChange: _propTypes.default.func,
onPanelChange: _propTypes.default.func,
disabledDate: _propTypes.default.func,
disabledTime: _propTypes.default.any,
dateRender: _propTypes.default.func,
renderFooter: _propTypes.default.func,
renderSidebar: _propTypes.default.func,
clearIcon: _propTypes.default.node,
focusablePanel: _propTypes.default.bool
})
);
(0, _defineProperty2.default)(
Calendar,
'defaultProps',
(0, _objectSpread2.default)({}, _CalendarMixin.calendarMixinDefaultProps, _CommonMixin.defaultProp, {
showToday: true,
showDateInput: false,
timePicker: null,
onOk: noop,
onPanelChange: noop,
focusablePanel: true
})
);
(0, _reactLifecyclesCompat.polyfill)(Calendar);
var _default = (0, _CalendarMixin.calendarMixinWrapper)((0, _CommonMixin.commonMixinWrapper)(Calendar));
exports.default = _default;
//@ sourceMappingURL=Calendar.js.map