dtd/lib/time-picker/rc-time-picker/TimePicker.js

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

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _extends2=require("babel-runtime/helpers/extends"),_extends3=_interopRequireDefault(_extends2),_toConsumableArray2=require("babel-runtime/helpers/toConsumableArray"),_toConsumableArray3=_interopRequireDefault(_toConsumableArray2),_classCallCheck2=require("babel-runtime/helpers/classCallCheck"),_classCallCheck3=_interopRequireDefault(_classCallCheck2),_createClass2=require("babel-runtime/helpers/createClass"),_createClass3=_interopRequireDefault(_createClass2),_possibleConstructorReturn2=require("babel-runtime/helpers/possibleConstructorReturn"),_possibleConstructorReturn3=_interopRequireDefault(_possibleConstructorReturn2),_inherits2=require("babel-runtime/helpers/inherits"),_inherits3=_interopRequireDefault(_inherits2),_react=require("react"),React=_interopRequireWildcard(_react),_reactDom=require("react-dom"),_propTypes=require("prop-types"),PropTypes=_interopRequireWildcard(_propTypes),_rcTrigger=require("rc-trigger"),_rcTrigger2=_interopRequireDefault(_rcTrigger),_Panel=require("./Panel"),_Panel2=_interopRequireDefault(_Panel),_placements=require("./placements"),_placements2=_interopRequireDefault(_placements),_moment=require("moment"),_moment2=_interopRequireDefault(_moment);function _interopRequireWildcard(e){if(e&&e.__esModule)return e;var o={};if(null!=e)for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&(o[t]=e[t]);return o.default=e,o}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var isEqual=require("lodash.isequal");function noop(){}function refFn(e,o){this[e]=o}var preventDefaultEvent=function(e){return e.preventDefault()},UNSELECTABLE_STYLE={userSelect:"none",WebkitUserSelect:"none"},Picker=function(e){function i(e){(0,_classCallCheck3.default)(this,i);var u=(0,_possibleConstructorReturn3.default)(this,(i.__proto__||Object.getPrototypeOf(i)).call(this,e));u.onPanelChange=function(e){u.setValue(e)},u.onPanelClear=function(){u.setValue(null),u.setOpen(!1)},u.onVisibleChange=function(e){u.setOpen(e)},u.onEsc=function(){u.setOpen(!1),u.focus()},u.onKeyDown=function(e){40===e.keyCode&&u.setOpen(!0)},u.handleMultipleClick=function(e,o){e.preventDefault();var t=o.state.value,n=u.props,r=n.maximum,a=n.maximumCb,s=void 0===a?noop:a,l=u.state.value;if(r&&l.length>=r)s();else{var p=[].concat((0,_toConsumableArray3.default)(l),[t]);u.setState({value:p}),u.props.onChange&&u.props.onChange(p)}u.setOpen(!1)},u.multipleAddOn=function(o){var e=u.props.addon;return e&&e(o,function(e){return u.handleMultipleClick(e,o)})},u.removeSelected=function(e,t,n){var o=u.state,r=o.open,a=o.value;r||e.stopPropagation();var s=a.filter(function(e,o){return!isEqual(t,e)||o!==n});u.setState({value:s}),u.props.onChange&&u.props.onChange(s)},u.renderMultiple=function(e){var o=u.props,t=o.prefixCls,n=o.placeholder,r=void 0===n?"请选择时间":n,a=u.renderMultipleNode(e),s=!1;e.length&&(s=!0);var l=React.createElement("div",{onMouseDown:preventDefaultEvent,style:(0,_extends3.default)({display:s?"none":"block"},UNSELECTABLE_STYLE),className:t+"-selection__placeholder"},r);return React.createElement("div",{key:"selection",className:t+"-selection__rendered"},l,React.createElement("ul",null,a))},u.renderMultipleNode=function(e){var o=u.props,r=o.prefixCls,a=o.disabled,s=a?r+"-selection__choice "+r+"-selection__choice__disabled":r+"-selection__choice";return e.map(function(o,t){var e=(0,_moment2.default)(o).format(u.getFormat()),n=React.createElement("span",{className:r+"-selection__choice__remove",onClick:function(e){u.removeSelected(e,o,t)}});return React.createElement("li",{style:UNSELECTABLE_STYLE,onMouseDown:preventDefaultEvent,className:s,key:t,title:e},React.createElement("div",{className:r+"-selection__choice__content"},o&&(0,_moment2.default)(o).format(u.getFormat())||""),a?"":n)})},u.cacularPopOffset=function(e){var o=(u.panelDom&&u.panelDom.getBoundingClientRect()||{height:32}).height,t=u.panelDom&&u.panelDom.querySelector("li");if(t&&e){var n=getComputedStyle(t),r=n.width,a=n.marginRight,s=n.marginLeft,l=parseFloat(r||"1")+parseFloat(a||"0")+parseFloat(s||"0"),p=u.panelDom.querySelector("."+u.props.prefixCls+"-selection__rendered"),i=getComputedStyle(p).width;return[e%parseInt((parseFloat(i||"1")/l).toString()||"1",10)*l,o]}return[0,o]},u.saveInputRef=refFn.bind(u,"picker"),u.savePanelRef=refFn.bind(u,"panelInstance");var o=e.defaultOpen,t=e.defaultValue,n=e.open,r=void 0===n?o:n,a=e.value,s=void 0===a?t:a,l=e.multiple,p=void 0;return p=void 0!==l&&l?(p=Array.isArray(s)?s:s?[s]:[]).map(function(e){if(e&&_moment2.default.isMoment(e))return e;var o=e&&(0,_moment2.default)(e).format(u.getFormat())||"";return o&&o.isValid()?o:(0,_moment2.default)()}):s,u.state={open:r,value:p},u}return(0,_inherits3.default)(i,e),(0,_createClass3.default)(i,[{key:"componentDidMount",value:function(){this.panelDom=(0,_reactDom.findDOMNode)(this)}},{key:"componentWillReceiveProps",value:function(e){var o=e.value,t=e.open;"value"in e&&this.setState({value:o}),void 0!==t&&this.setState({open:t})}},{key:"setValue",value:function(e){"value"in this.props||this.setState({value:e}),this.props.onChange&&this.props.onChange(e)}},{key:"getFormat",value:function(){var e=this.props,o=e.format,t=e.showHour,n=e.showMinute,r=e.showSecond,a=e.use12Hours;return o||(a?[t?"h":"",n?"mm":"",r?"ss":""].filter(function(e){return!!e}).join(":").concat(" a"):[t?"HH":"",n?"mm":"",r?"ss":""].filter(function(e){return!!e}).join(":"))}},{key:"getPanelElement",value:function(){var e=this,o=this.props,t=o.prefixCls,n=o.placeholder,r=void 0===n?"":n,a=o.disabledHours,s=void 0===a?noop:a,l=o.disabledMinutes,p=void 0===l?noop:l,i=o.disabledSeconds,u=void 0===i?noop:i,c=o.hideDisabledOptions,d=void 0!==c&&c,m=o.inputReadOnly,f=void 0!==m&&m,h=o.allowEmpty,y=void 0!==h&&h,v=o.showHour,_=void 0!==v&&v,b=o.showMinute,C=void 0!==b&&b,P=o.showSecond,g=void 0!==P&&P,T=o.defaultOpenValue,O=void 0===T?{}:T,R=o.clearText,S=void 0===R?"":R,D=o.addon,E=void 0===D?noop:D,w=o.use12Hours,q=void 0!==w&&w,k=o.focusOnOpen,N=void 0!==k&&k,x=o.onKeyDown,M=void 0===x?noop:x,F=o.hourStep,H=void 0===F?1:F,V=o.minuteStep,A=void 0===V?1:V,j=o.secondStep,L=void 0===j?1:j,B=o.multiple,K=void 0!==B&&B,W=this.state.value;if(K){var I=W.length;W=I?W[I-1]:(0,_moment2.default)()}return React.createElement(_Panel2.default,{clearText:S,prefixCls:t+"-panel",ref:this.savePanelRef,value:W,inputReadOnly:f,onChange:K?noop:this.onPanelChange,onClear:K?function(){return e.setOpen(!1)}:this.onPanelClear,defaultOpenValue:O,showHour:_,showMinute:C,showSecond:g,onEsc:this.onEsc,allowEmpty:y,format:this.getFormat(),placeholder:r,disabledHours:s,disabledMinutes:p,disabledSeconds:u,hideDisabledOptions:d,use12Hours:q,hourStep:H,minuteStep:A,secondStep:L,addon:K?this.multipleAddOn:E,focusOnOpen:N,onKeyDown:M})}},{key:"getPopupClassName",value:function(){var e=this.props,o=e.showHour,t=e.showMinute,n=e.showSecond,r=e.use12Hours,a=e.prefixCls,s=this.props.popupClassName;o&&t&&n||r||(s+=" "+a+"-panel-narrow");var l=0;return o&&(l+=1),t&&(l+=1),n&&(l+=1),r&&(l+=1),s+=" "+a+"-panel-column-"+l}},{key:"setOpen",value:function(e){var o=this.props,t=o.onOpen,n=void 0===t?noop:t,r=o.onClose,a=void 0===r?noop:r;this.state.open!==e&&("open"in this.props||this.setState({open:e}),e?n({open:e}):a({open:e}))}},{key:"focus",value:function(){this.picker.focus()}},{key:"blur",value:function(){this.picker.blur()}},{key:"render",value:function(){var e=this.props,o=e.prefixCls,t=e.placeholder,n=e.placement,r=e.align,a=e.id,s=e.disabled,l=e.transitionName,p=e.style,i=e.className,u=e.getPopupContainer,c=e.name,d=e.autoComplete,m=e.onFocus,f=e.onBlur,h=e.autoFocus,y=e.inputReadOnly,v=e.multiple,_=void 0!==v&&v,b=this.state,C=b.open,P=b.value,g=this.getPopupClassName(),T=_?React.createElement("div",{className:o+"-multiple "+i},React.createElement("div",{className:o+"-selection "+o+"-selection--multiple",style:p,placeholder:t,id:a},this.renderMultiple(P))):React.createElement("span",{className:o+" "+i,style:p},React.createElement("input",{className:o+"-input",ref:this.saveInputRef,type:"text",placeholder:t,name:c,onKeyDown:this.onKeyDown,disabled:s,value:P&&P.format(this.getFormat())||"",autoComplete:d,onFocus:m,onBlur:f,autoFocus:h,onChange:noop,readOnly:!!y,id:a}),React.createElement("span",{className:o+"-icon"}));return React.createElement(_rcTrigger2.default,{prefixCls:o+"-panel",popupClassName:g,popup:this.getPanelElement(),popupAlign:_?{offset:this.cacularPopOffset(P.length)}:r,builtinPlacements:_placements2.default,popupPlacement:n,action:s?[]:["click"],destroyPopupOnHide:!0,getPopupContainer:u,popupTransitionName:l,popupVisible:C,onPopupVisibleChange:this.onVisibleChange},T)}}]),i}(React.Component);(exports.default=Picker).propTypes={prefixCls:PropTypes.string,clearText:PropTypes.string,value:PropTypes.oneOfType([PropTypes.object,PropTypes.arrayOf(PropTypes.object)]),defaultOpenValue:PropTypes.object,inputReadOnly:PropTypes.bool,disabled:PropTypes.bool,allowEmpty:PropTypes.bool,defaultValue:PropTypes.object,open:PropTypes.bool,defaultOpen:PropTypes.bool,align:PropTypes.object,placement:PropTypes.any,transitionName:PropTypes.string,getPopupContainer:PropTypes.func,placeholder:PropTypes.string,format:PropTypes.string,showHour:PropTypes.bool,showMinute:PropTypes.bool,showSecond:PropTypes.bool,style:PropTypes.object,className:PropTypes.string,popupClassName:PropTypes.string,disabledHours:PropTypes.func,disabledMinutes:PropTypes.func,disabledSeconds:PropTypes.func,hideDisabledOptions:PropTypes.bool,onChange:PropTypes.func,onOpen:PropTypes.func,onClose:PropTypes.func,onFocus:PropTypes.func,onBlur:PropTypes.func,addon:PropTypes.func,name:PropTypes.string,autoComplete:PropTypes.string,use12Hours:PropTypes.bool,hourStep:PropTypes.number,minuteStep:PropTypes.number,secondStep:PropTypes.number,focusOnOpen:PropTypes.bool,onKeyDown:PropTypes.func,autoFocus:PropTypes.bool,id:PropTypes.string,multiple:PropTypes.bool},Picker.defaultProps={clearText:"clear",prefixCls:"rc-time-picker",defaultOpen:!1,inputReadOnly:!1,style:{},className:"",popupClassName:"",id:"",align:{},defaultOpenValue:(0,_moment2.default)(),allowEmpty:!0,showHour:!0,showMinute:!0,showSecond:!0,disabledHours:noop,disabledMinutes:noop,disabledSeconds:noop,hideDisabledOptions:!1,placement:"bottomLeft",onChange:noop,onOpen:noop,onClose:noop,onFocus:noop,onBlur:noop,addon:noop,use12Hours:!1,focusOnOpen:!1,onKeyDown:noop},module.exports=exports.default;