1 import React, {PropTypes} from 'react';
3 const Header = React.createClass({
5 formatter: PropTypes.object,
6 prefixCls: PropTypes.string,
7 gregorianTimePickerLocale: PropTypes.object,
8 locale: PropTypes.object,
9 disabledDate: PropTypes.func,
10 placeholder: PropTypes.string,
11 value: PropTypes.object,
12 hourOptions: PropTypes.array,
13 minuteOptions: PropTypes.array,
14 secondOptions: PropTypes.array,
15 onChange: PropTypes.func,
16 onClear: PropTypes.func,
17 showClear: PropTypes.bool,
21 const value = this.props.value;
23 str: value && this.props.formatter.format(value) || '',
28 componentWillReceiveProps(nextProps) {
29 const value = nextProps.value;
31 str: value && nextProps.formatter.format(value) || '',
36 onInputChange(event) {
37 const str = event.target.value;
42 const {formatter, gregorianTimePickerLocale, hourOptions, minuteOptions, secondOptions, onChange} = this.props;
45 const originalValue = this.props.value;
47 value = formatter.parse(str, {
48 locale: gregorianTimePickerLocale,
60 hourOptions.indexOf(value.fields[4]) < 0 ||
61 minuteOptions.indexOf(value.fields[5]) < 0 ||
62 secondOptions.indexOf(value.fields[6]) < 0
70 if (originalValue && value) {
72 originalValue.fields[4] !== value.fields[4] ||
73 originalValue.fields[5] !== value.fields[5] ||
74 originalValue.fields[6] !== value.fields[6]
78 } else if (originalValue !== value) {
97 this.setState({str: ''});
102 const { locale, prefixCls, showClear } = this.props;
106 return <a className={`${prefixCls}-clear-btn`} role="button" title={locale.clear} onMouseDown={this.onClear} />;
110 const { prefixCls, placeholder } = this.props;
111 const { invalid, str } = this.state;
112 const invalidClass = invalid ? `${prefixCls}-input-invalid` : '';
113 return <input className={`${prefixCls}-input ${invalidClass}`} value={str} placeholder={placeholder} onChange={this.onInputChange} />;
117 const { prefixCls } = this.props;
119 <div className={`${prefixCls}-input-wrap`}>
121 {this.getClearButton()}
127 export default Header;