aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/module/Combobox.jsx
diff options
context:
space:
mode:
authoryiminghe <yiminghe@gmail.com>2016-08-04 19:53:55 +0800
committeryiminghe <yiminghe@gmail.com>2016-08-04 19:53:55 +0800
commit4984ed85e54f442998a335db70618d6184fa397e (patch)
tree6ae348b2cac5f48f3afb6f7b8dd0c2fd02f044fc /src/module/Combobox.jsx
parentdeaa6062ea2e274d50d58c70251c1237c0c03c67 (diff)
downloadtime-picker-4984ed85e54f442998a335db70618d6184fa397e.tar.gz
time-picker-4984ed85e54f442998a335db70618d6184fa397e.tar.zst
time-picker-4984ed85e54f442998a335db70618d6184fa397e.zip
2.x :boom:2.0.0
Diffstat (limited to 'src/module/Combobox.jsx')
-rw-r--r--src/module/Combobox.jsx141
1 files changed, 0 insertions, 141 deletions
diff --git a/src/module/Combobox.jsx b/src/module/Combobox.jsx
deleted file mode 100644
index f1e7c5b..0000000
--- a/src/module/Combobox.jsx
+++ /dev/null
@@ -1,141 +0,0 @@
1import React, {PropTypes} from 'react';
2import Select from './Select';
3import GregorianCalendar from 'gregorian-calendar';
4
5const formatOption = (option, disabledOptions) => {
6 let value = `${option}`;
7 if (option < 10) {
8 value = `0${option}`;
9 }
10
11 let disabled = false;
12 if (disabledOptions && disabledOptions.indexOf(option) >= 0) {
13 disabled = true;
14 }
15
16 return {
17 value,
18 disabled,
19 };
20};
21
22const Combobox = React.createClass({
23 propTypes: {
24 formatter: PropTypes.object,
25 prefixCls: PropTypes.string,
26 value: PropTypes.object,
27 onChange: PropTypes.func,
28 showHour: PropTypes.bool,
29 gregorianCalendarLocale: PropTypes.object,
30 showSecond: PropTypes.bool,
31 hourOptions: PropTypes.array,
32 minuteOptions: PropTypes.array,
33 secondOptions: PropTypes.array,
34 disabledHours: PropTypes.func,
35 disabledMinutes: PropTypes.func,
36 disabledSeconds: PropTypes.func,
37 onCurrentSelectPanelChange: PropTypes.func,
38 },
39
40 onItemChange(type, itemValue) {
41 const { onChange } = this.props;
42 let value = this.props.value;
43 if (value) {
44 value = value.clone();
45 } else {
46 value = this.getNow().clone();
47 }
48 if (type === 'hour') {
49 value.setHourOfDay(itemValue);
50 } else if (type === 'minute') {
51 value.setMinutes(itemValue);
52 } else {
53 value.setSeconds(itemValue);
54 }
55 onChange(value);
56 },
57
58 onEnterSelectPanel(range) {
59 this.props.onCurrentSelectPanelChange(range);
60 },
61
62 getHourSelect(hour) {
63 const { prefixCls, hourOptions, disabledHours, showHour } = this.props;
64 if (!showHour) {
65 return null;
66 }
67 const disabledOptions = disabledHours();
68
69 return (
70 <Select
71 prefixCls={prefixCls}
72 options={hourOptions.map(option => formatOption(option, disabledOptions))}
73 selectedIndex={hourOptions.indexOf(hour)}
74 type="hour"
75 onSelect={this.onItemChange}
76 onMouseEnter={this.onEnterSelectPanel.bind(this, 'hour')}
77 />
78 );
79 },
80
81 getMinuteSelect(minute) {
82 const { prefixCls, minuteOptions, disabledMinutes } = this.props;
83 const value = this.props.value || this.getNow();
84 const disabledOptions = disabledMinutes(value.getHourOfDay());
85
86 return (
87 <Select
88 prefixCls={prefixCls}
89 options={minuteOptions.map(option => formatOption(option, disabledOptions))}
90 selectedIndex={minuteOptions.indexOf(minute)}
91 type="minute"
92 onSelect={this.onItemChange}
93 onMouseEnter={this.onEnterSelectPanel.bind(this, 'minute')}
94 />
95 );
96 },
97
98 getSecondSelect(second) {
99 const { prefixCls, secondOptions, disabledSeconds, showSecond } = this.props;
100 if (!showSecond) {
101 return null;
102 }
103 const value = this.props.value || this.getNow();
104 const disabledOptions = disabledSeconds(value.getHourOfDay(), value.getMinutes());
105
106 return (
107 <Select
108 prefixCls={prefixCls}
109 options={secondOptions.map(option => formatOption(option, disabledOptions))}
110 selectedIndex={secondOptions.indexOf(second)}
111 type="second"
112 onSelect={this.onItemChange}
113 onMouseEnter={this.onEnterSelectPanel.bind(this, 'second')}
114 />
115 );
116 },
117
118 getNow() {
119 if (this.showNow) {
120 return this.showNow;
121 }
122 const value = new GregorianCalendar(this.props.gregorianCalendarLocale);
123 value.setTime(Date.now());
124 this.showNow = value;
125 return value;
126 },
127
128 render() {
129 const { prefixCls } = this.props;
130 const value = this.props.value || this.getNow();
131 return (
132 <div className={`${prefixCls}-combobox`}>
133 {this.getHourSelect(value.getHourOfDay())}
134 {this.getMinuteSelect(value.getMinutes())}
135 {this.getSecondSelect(value.getSeconds())}
136 </div>
137 );
138 },
139});
140
141export default Combobox;