dtd
Version:
根据数梦工场视觉规范打造的组件库，感谢react-components和ant design
1 lines • 2.82 kB
JavaScript
import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";import*as React from"react";import{PREFIX_CLS}from"./Constants";import Select from"../select";import{Button,Group}from"../radio";var Option=Select.Option,Header=function(e){function t(){_classCallCheck(this,t);var e=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments));return e.onYearChange=function(t){var a=e.props.value.clone();a.year(parseInt(t,10));var r=e.props.onValueChange;r&&r(a)},e.onMonthChange=function(t){var a=e.props.value.clone();a.month(parseInt(t,10));var r=e.props.onValueChange;r&&r(a)},e.onTypeChange=function(t){var a=e.props.onTypeChange;a&&a(t.target.value)},e.getCalenderHeaderNode=function(t){e.calenderHeaderNode=t},e}return _inherits(t,e),_createClass(t,[{key:"getYearSelectElement",value:function(e){for(var t=this,a=this.props,r=a.yearSelectOffset,n=a.yearSelectTotal,l=a.locale,o=a.prefixCls,s=a.fullscreen,c=e-r,i=c+n,u="年"===l.year?"年":"",p=[],h=c;h<i;h++)p.push(React.createElement(Option,{key:""+h},h+u));return React.createElement(Select,{size:s?"default":"small",dropdownMatchSelectWidth:!1,className:o+"-year-select",onChange:this.onYearChange,value:String(e),getPopupContainer:function(){return t.calenderHeaderNode}},p)}},{key:"getMonthsLocale",value:function(e){for(var t=e.clone(),a=e.localeData(),r=[],n=0;n<12;n++)t.month(n),r.push(a.monthsShort(t));return r}},{key:"getMonthSelectElement",value:function(e,t){for(var a=this,r=this.props,n=r.prefixCls,l=r.fullscreen,o=[],s=0;s<12;s++)o.push(React.createElement(Option,{key:""+s},t[s]));return React.createElement(Select,{size:l?"default":"small",dropdownMatchSelectWidth:!1,className:n+"-month-select",value:String(e),onChange:this.onMonthChange,getPopupContainer:function(){return a.calenderHeaderNode}},o)}},{key:"render",value:function(){var e=this.props,t=e.type,a=e.value,r=e.prefixCls,n=e.locale,l=e.fullscreen,o=this.getYearSelectElement(a.year()),s="date"===t?this.getMonthSelectElement(a.month(),this.getMonthsLocale(a)):null,c=l?"default":"small",i=React.createElement(Group,{onChange:this.onTypeChange,value:t,size:c},React.createElement(Button,{value:"date"},n.month),React.createElement(Button,{value:"month"},n.year));return React.createElement("div",{className:r+"-header",ref:this.getCalenderHeaderNode},React.createElement("div",{className:r+"-current-date"},a.year(),"年",a.month()+1,"月"),React.createElement("div",{className:r+"-filter-date"},o,s,i))}}]),t}(React.Component);export default Header;Header.defaultProps={prefixCls:PREFIX_CLS+"-header",yearSelectOffset:10,yearSelectTotal:20};