dtd/es/calendarbase/Calendar.js

根据数梦工场视觉规范打造的组件库，感谢react-components和ant design

import _extends from"babel-runtime/helpers/extends";import*as React from"react";import*as ReactDOM from"react-dom";import createReactClass from"create-react-class";import*as PropTypes from"prop-types";import KeyCode from"rc-util/es/KeyCode";import DateTable from"./date/DateTable";import CalendarHeader from"./calendar/CalendarHeader";import CalendarFooter from"./calendar/CalendarFooter";import CalendarMixin from"./mixin/CalendarMixin";import CommonMixin from"./mixin/CommonMixin";import DateInput from"./date/DateInput";import{getTimeConfig,getTodayTime,syncTime}from"./util";function noop(){}function goStartMonth(){var e=this.state.value.clone();e.startOf("month"),this.setValue(e)}function goEndMonth(){var e=this.state.value.clone();e.endOf("month"),this.setValue(e)}function goTime(e,t){var a=this.state.value.clone();a.add(e,t),this.setValue(a)}function goMonth(e){return goTime.call(this,e,"months")}function goYear(e){return goTime.call(this,e,"years")}function goWeek(e){return goTime.call(this,e,"weeks")}function goDay(e){return goTime.call(this,e,"days")}var Calendar=createReactClass({displayName:"Calendar",propTypes:{prefixCls:PropTypes.string,className:PropTypes.string,style:PropTypes.object,defaultValue:PropTypes.object,value:PropTypes.object,selectedValue:PropTypes.object,mode:PropTypes.oneOf(["time","date","month","year"]),locale:PropTypes.object,showDateInput:PropTypes.bool,showWeekNumber:PropTypes.bool,showToday:PropTypes.bool,showOk:PropTypes.bool,onSelect:PropTypes.func,onOk:PropTypes.func,onKeyDown:PropTypes.func,timePicker:PropTypes.element,dateInputPlaceholder:PropTypes.any,onClear:PropTypes.func,onChange:PropTypes.func,onPanelChange:PropTypes.func,disabledDate:PropTypes.func,disabledTime:PropTypes.any,renderFooter:PropTypes.func,renderSidebar:PropTypes.func},mixins:[CommonMixin,CalendarMixin],getDefaultProps:function(){return{showToday:!0,showDateInput:!0,timePicker:null,onOk:noop,onPanelChange:noop}},getInitialState:function(){return{mode:this.props.mode||"date"}},componentWillReceiveProps:function(e){"mode"in e&&this.state.mode!==e.mode&&this.setState({mode:e.mode})},onKeyDown:function(e){if("input"!==e.target.nodeName.toLowerCase()){var t=e.keyCode,a=e.ctrlKey||e.metaKey,o=this.props.disabledDate,n=this.state.value;switch(t){case KeyCode.DOWN:return goWeek.call(this,1),e.preventDefault(),1;case KeyCode.UP:return goWeek.call(this,-1),e.preventDefault(),1;case KeyCode.LEFT:return a?goYear.call(this,-1):goDay.call(this,-1),e.preventDefault(),1;case KeyCode.RIGHT:return a?goYear.call(this,1):goDay.call(this,1),e.preventDefault(),1;case KeyCode.HOME:return goStartMonth.call(this),e.preventDefault(),1;case KeyCode.END:return goEndMonth.call(this),e.preventDefault(),1;case KeyCode.PAGE_DOWN:return goMonth.call(this,1),e.preventDefault(),1;case KeyCode.PAGE_UP:return goMonth.call(this,-1),e.preventDefault(),1;case KeyCode.ENTER:return o&&o(n)||this.onSelect(n,{source:"keyboard"}),e.preventDefault(),1;default:return this.props.onKeyDown(e),1}}},onClear:function(){this.onSelect(null),this.props.onClear()},onOk:function(){var e=this.state.selectedValue;this.isAllowedDate(e)&&this.props.onOk(e)},onDateInputChange:function(e){this.onSelect(e,{source:"dateInput"})},onDateTableSelect:function(e){var t=this.props.timePicker;if(!this.state.selectedValue&&t){var a=t.props.defaultValue;a&&syncTime(a,e)}this.onSelect(e)},onToday:function(){var e=this.state.value,t=getTodayTime(e);this.onSelect(t,{source:"todayButton"})},onPanelChange:function(e,t){var a=this.props,o=this.state;"mode"in a||this.setState({mode:t}),a.onPanelChange(e||o.value,t)},getRootDOMNode:function(){return ReactDOM.findDOMNode(this)},openTimePicker:function(){this.onPanelChange(null,"time")},closeTimePicker:function(){this.onPanelChange(null,"date")},render:function(){var e=this.props,t=this.state,a=e.locale,o=e.prefixCls,n=e.disabledDate,r=e.dateInputPlaceholder,l=e.timePicker,s=e.disabledTime,i=t.value,c=t.selectedValue,p=t.mode,d="time"===p,u=d&&s&&l?getTimeConfig(c,s):null,m=null;if(l&&d){var h=_extends({showHour:!0,showSecond:!0,showMinute:!0},l.props,u,{onChange:this.onDateInputChange,value:c,disabledTime:s});void 0!==l.props.defaultValue&&(h.defaultOpenValue=l.props.defaultValue),m=React.cloneElement(l,h)}var f=e.showDateInput?React.createElement(DateInput,{format:this.getFormat(),key:"date-input",value:i,locale:a,placeholder:r,showClear:!0,disabledTime:s,disabledDate:n,onClear:this.onClear,prefixCls:o,selectedValue:c,onChange:this.onDateInputChange}):null,y=[e.renderSidebar(),React.createElement("div",{className:o+"-panel",key:"panel"},f,React.createElement("div",{className:o+"-date-panel"},React.createElement(CalendarHeader,{locale:a,mode:p,value:i,onValueChange:this.setValue,onPanelChange:this.onPanelChange,showTimePicker:d,prefixCls:o}),l&&d?React.createElement("div",{className:o+"-time-picker"},React.createElement("div",{className:o+"-time-picker-panel"},m)):null,React.createElement("div",{className:o+"-body"},React.createElement(DateTable,{locale:a,value:i,selectedValue:c,prefixCls:o,dateRender:e.dateRender,onSelect:this.onDateTableSelect,disabledDate:n,showWeekNumber:e.showWeekNumber})),React.createElement(CalendarFooter,{showOk:e.showOk,renderFooter:e.renderFooter,locale:a,prefixCls:o,showToday:e.showToday,disabledTime:s,showTimePicker:d,showDateInput:e.showDateInput,timePicker:l,selectedValue:c,value:i,disabledDate:n,okDisabled:!this.isAllowedDate(c),onOk:this.onOk,onSelect:this.onSelect,onToday:this.onToday,onOpenTimePicker:this.openTimePicker,onCloseTimePicker:this.closeTimePicker})))];return this.renderRoot({children:y,className:e.showWeekNumber?o+"-week-number":""})}});export default Calendar;