1 import React, {PropTypes} from 'react';
2 import Select from './Select';
3 import GregorianCalendar from 'gregorian-calendar';
5 const formatOption = (option) => {
12 const Combobox = React.createClass({
14 formatter: PropTypes.object,
15 prefixCls: PropTypes.string,
16 value: PropTypes.object,
17 onChange: PropTypes.func,
18 showHour: PropTypes.bool,
19 gregorianCalendarLocale: PropTypes.object,
20 showSecond: PropTypes.bool,
21 hourOptions: PropTypes.array,
22 minuteOptions: PropTypes.array,
23 secondOptions: PropTypes.array,
26 onItemChange(type, itemValue) {
27 const { onChange } = this.props;
28 let value = this.props.value;
30 value = value.clone();
32 value = this.getNow().clone();
34 if (type === 'hour') {
35 value.setHourOfDay(itemValue);
36 } else if (type === 'minute') {
37 value.setMinutes(itemValue);
39 value.setSeconds(itemValue);
45 const { prefixCls, hourOptions, showHour } = this.props;
52 options={hourOptions.map(option => formatOption(option))}
53 selectedIndex={hourOptions.indexOf(hour)}
55 onSelect={this.onItemChange}
60 getMinuteSelect(minute) {
61 const { prefixCls, minuteOptions } = this.props;
65 options={minuteOptions.map(option => formatOption(option))}
66 selectedIndex={minuteOptions.indexOf(minute)}
68 onSelect={this.onItemChange}
73 getSectionSelect(second) {
74 const { prefixCls, secondOptions, showSecond } = this.props;
81 options={secondOptions.map(option => formatOption(option))}
82 selectedIndex={secondOptions.indexOf(second)}
84 onSelect={this.onItemChange}
93 const value = new GregorianCalendar(this.props.gregorianCalendarLocale);
94 value.setTime(Date.now());
100 const { prefixCls } = this.props;
101 const value = this.props.value || this.getNow();
103 <div className={`${prefixCls}-combobox`}>
104 {this.getHourSelect(value.getHourOfDay())}
105 {this.getMinuteSelect(value.getMinutes())}
106 {this.getSectionSelect(value.getSeconds())}
112 export default Combobox;