1 import React, { PropTypes } from 'react';
2 import Select from './Select';
4 const formatOption = (option, disabledOptions) => {
5 let value = `${option}`;
11 if (disabledOptions && disabledOptions.indexOf(option) >= 0) {
21 const Combobox = React.createClass({
23 format: PropTypes.string,
24 defaultOpenValue: PropTypes.object,
25 prefixCls: PropTypes.string,
26 value: PropTypes.object,
27 onChange: PropTypes.func,
28 showHour: PropTypes.bool,
29 showSecond: PropTypes.bool,
30 hourOptions: PropTypes.array,
31 minuteOptions: PropTypes.array,
32 secondOptions: PropTypes.array,
33 disabledHours: PropTypes.func,
34 disabledMinutes: PropTypes.func,
35 disabledSeconds: PropTypes.func,
36 onCurrentSelectPanelChange: PropTypes.func,
39 onItemChange(type, itemValue) {
40 const { onChange, defaultOpenValue } = this.props;
41 const value = (this.props.value || defaultOpenValue).clone();
42 if (type === 'hour') {
43 value.hour(itemValue);
44 } else if (type === 'minute') {
45 value.minute(itemValue);
47 value.second(itemValue);
52 onEnterSelectPanel(range) {
53 this.props.onCurrentSelectPanelChange(range);
57 const { prefixCls, hourOptions, disabledHours, showHour } = this.props;
61 const disabledOptions = disabledHours();
66 options={hourOptions.map(option => formatOption(option, disabledOptions))}
67 selectedIndex={hourOptions.indexOf(hour)}
69 onSelect={this.onItemChange}
70 onMouseEnter={this.onEnterSelectPanel.bind(this, 'hour')}
75 getMinuteSelect(minute) {
76 const { prefixCls, minuteOptions, disabledMinutes, defaultOpenValue } = this.props;
77 const value = this.props.value || defaultOpenValue;
78 const disabledOptions = disabledMinutes(value.hour());
83 options={minuteOptions.map(option => formatOption(option, disabledOptions))}
84 selectedIndex={minuteOptions.indexOf(minute)}
86 onSelect={this.onItemChange}
87 onMouseEnter={this.onEnterSelectPanel.bind(this, 'minute')}
92 getSecondSelect(second) {
93 const { prefixCls, secondOptions, disabledSeconds, showSecond, defaultOpenValue } = this.props;
97 const value = this.props.value || defaultOpenValue;
98 const disabledOptions = disabledSeconds(value.hour(), value.minute());
102 prefixCls={prefixCls}
103 options={secondOptions.map(option => formatOption(option, disabledOptions))}
104 selectedIndex={secondOptions.indexOf(second)}
106 onSelect={this.onItemChange}
107 onMouseEnter={this.onEnterSelectPanel.bind(this, 'second')}
113 const { prefixCls, defaultOpenValue } = this.props;
114 const value = this.props.value || defaultOpenValue;
116 <div className={`${prefixCls}-combobox`}>
117 {this.getHourSelect(value.hour())}
118 {this.getMinuteSelect(value.minute())}
119 {this.getSecondSelect(value.second())}
125 export default Combobox;