aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
-rw-r--r--README.md3
-rw-r--r--src/Panel.jsx20
-rw-r--r--src/TimePicker.jsx8
-rw-r--r--tests/Select.spec.jsx34
4 files changed, 59 insertions, 6 deletions
diff --git a/README.md b/README.md
index a2758b9..26e05fc 100644
--- a/README.md
+++ b/README.md
@@ -77,6 +77,9 @@ API
77| name | String | - | sets the name of the generated input | 77| name | String | - | sets the name of the generated input |
78| onOpen | Function({ open }) | | when TimePicker panel is opened | 78| onOpen | Function({ open }) | | when TimePicker panel is opened |
79| onClose | Function({ open }) | | when TimePicker panel is opened | 79| onClose | Function({ open }) | | when TimePicker panel is opened |
80| hourStep | Number | 1 | interval between hours in picker |
81| minuteStep | Number | 1 | interval between minutes in picker |
82| secondStep | Number | 1 | interval between seconds in picker |
80 83
81## Test Case 84## Test Case
82 85
diff --git a/src/Panel.jsx b/src/Panel.jsx
index 8a6c872..4e09b57 100644
--- a/src/Panel.jsx
+++ b/src/Panel.jsx
@@ -8,9 +8,9 @@ import classNames from 'classnames';
8function noop() { 8function noop() {
9} 9}
10 10
11function generateOptions(length, disabledOptions, hideDisabledOptions) { 11function generateOptions(length, disabledOptions, hideDisabledOptions, step = 1) {
12 const arr = []; 12 const arr = [];
13 for (let value = 0; value < length; value++) { 13 for (let value = 0; value < length; value += step) {
14 if (!disabledOptions || disabledOptions.indexOf(value) < 0 || !hideDisabledOptions) { 14 if (!disabledOptions || disabledOptions.indexOf(value) < 0 || !hideDisabledOptions) {
15 arr.push(value); 15 arr.push(value);
16 } 16 }
@@ -39,6 +39,9 @@ class Panel extends Component {
39 showSecond: PropTypes.bool, 39 showSecond: PropTypes.bool,
40 onClear: PropTypes.func, 40 onClear: PropTypes.func,
41 use12Hours: PropTypes.bool, 41 use12Hours: PropTypes.bool,
42 hourStep: PropTypes.number,
43 minuteStep: PropTypes.number,
44 secondStep: PropTypes.number,
42 addon: PropTypes.func, 45 addon: PropTypes.func,
43 onKeyDown: PropTypes.func, 46 onKeyDown: PropTypes.func,
44 }; 47 };
@@ -92,6 +95,7 @@ class Panel extends Component {
92 prefixCls, className, placeholder, disabledHours, disabledMinutes, 95 prefixCls, className, placeholder, disabledHours, disabledMinutes,
93 disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond, 96 disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond,
94 format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, onKeyDown, 97 format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, onKeyDown,
98 hourStep, minuteStep, secondStep,
95 } = this.props; 99 } = this.props;
96 const { 100 const {
97 value, currentSelectPanel, 101 value, currentSelectPanel,
@@ -100,9 +104,15 @@ class Panel extends Component {
100 const disabledMinuteOptions = disabledMinutes(value ? value.hour() : null); 104 const disabledMinuteOptions = disabledMinutes(value ? value.hour() : null);
101 const disabledSecondOptions = disabledSeconds(value ? value.hour() : null, 105 const disabledSecondOptions = disabledSeconds(value ? value.hour() : null,
102 value ? value.minute() : null); 106 value ? value.minute() : null);
103 const hourOptions = generateOptions(24, disabledHourOptions, hideDisabledOptions); 107 const hourOptions = generateOptions(
104 const minuteOptions = generateOptions(60, disabledMinuteOptions, hideDisabledOptions); 108 24, disabledHourOptions, hideDisabledOptions, hourStep
105 const secondOptions = generateOptions(60, disabledSecondOptions, hideDisabledOptions); 109 );
110 const minuteOptions = generateOptions(
111 60, disabledMinuteOptions, hideDisabledOptions, minuteStep
112 );
113 const secondOptions = generateOptions(
114 60, disabledSecondOptions, hideDisabledOptions, secondStep
115 );
106 116
107 return ( 117 return (
108 <div className={classNames({ [`${prefixCls}-inner`]: true, [className]: !!className })}> 118 <div className={classNames({ [`${prefixCls}-inner`]: true, [className]: !!className })}>
diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx
index 271515d..5f2239a 100644
--- a/src/TimePicker.jsx
+++ b/src/TimePicker.jsx
@@ -48,6 +48,9 @@ export default class Picker extends Component {
48 name: PropTypes.string, 48 name: PropTypes.string,
49 autoComplete: PropTypes.string, 49 autoComplete: PropTypes.string,
50 use12Hours: PropTypes.bool, 50 use12Hours: PropTypes.bool,
51 hourStep: PropTypes.number,
52 minuteStep: PropTypes.number,
53 secondStep: PropTypes.number,
51 onKeyDown: PropTypes.func, 54 onKeyDown: PropTypes.func,
52 }; 55 };
53 56
@@ -163,7 +166,7 @@ export default class Picker extends Component {
163 prefixCls, placeholder, disabledHours, 166 prefixCls, placeholder, disabledHours,
164 disabledMinutes, disabledSeconds, hideDisabledOptions, 167 disabledMinutes, disabledSeconds, hideDisabledOptions,
165 allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText, 168 allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText,
166 addon, use12Hours, onKeyDown, 169 addon, use12Hours, onKeyDown, hourStep, minuteStep, secondStep,
167 } = this.props; 170 } = this.props;
168 return ( 171 return (
169 <Panel 172 <Panel
@@ -186,6 +189,9 @@ export default class Picker extends Component {
186 disabledSeconds={disabledSeconds} 189 disabledSeconds={disabledSeconds}
187 hideDisabledOptions={hideDisabledOptions} 190 hideDisabledOptions={hideDisabledOptions}
188 use12Hours={use12Hours} 191 use12Hours={use12Hours}
192 hourStep={hourStep}
193 minuteStep={minuteStep}
194 secondStep={secondStep}
189 addon={addon} 195 addon={addon}
190 onKeyDown={onKeyDown} 196 onKeyDown={onKeyDown}
191 /> 197 />
diff --git a/tests/Select.spec.jsx b/tests/Select.spec.jsx
index b2c111d..2a15e7c 100644
--- a/tests/Select.spec.jsx
+++ b/tests/Select.spec.jsx
@@ -7,6 +7,8 @@ import expect from 'expect.js';
7import async from 'async'; 7import async from 'async';
8import moment from 'moment'; 8import moment from 'moment';
9 9
10const map = (arr, fn) => Array.prototype.map.call(arr, fn);
11
10describe('Select', () => { 12describe('Select', () => {
11 let container; 13 let container;
12 14
@@ -59,6 +61,38 @@ describe('Select', () => {
59 done(); 61 done();
60 }); 62 });
61 }); 63 });
64
65 it('shows only numbers according to step props', (done) => {
66 const picker = renderPicker({
67 hourStep: 5,
68 minuteStep: 15,
69 secondStep: 21,
70 });
71 const input = TestUtils.scryRenderedDOMComponentsWithClass(picker,
72 'rc-time-picker-input')[0];
73 async.series([(next) => {
74 Simulate.click(input);
75 setTimeout(next, 100);
76 }, (next) => {
77 const selectors = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance,
78 'rc-time-picker-panel-select');
79
80 const hourSelector = selectors[0];
81 const minuteSelector = selectors[1];
82 const secondSelector = selectors[2];
83
84 const hours = map(hourSelector.getElementsByTagName('li'), (li) => li.innerHTML);
85 expect(hours).to.eql(['00', '05', '10', '15', '20']);
86
87 const minutes = map(minuteSelector.getElementsByTagName('li'), (li) => li.innerHTML);
88 expect(minutes).to.eql(['00', '15', '30', '45']);
89
90 const seconds = map(secondSelector.getElementsByTagName('li'), (li) => li.innerHTML);
91 expect(seconds).to.eql(['00', '21', '42']);
92
93 next();
94 }], done);
95 });
62 }); 96 });
63 97
64 describe('select number', () => { 98 describe('select number', () => {