]>
Commit | Line | Data |
---|---|---|
1 | /* eslint no-console:0 */ | |
2 | ||
3 | import 'rc-time-picker/assets/index.less'; | |
4 | ||
5 | import React from 'react'; | |
6 | import ReactDom from 'react-dom'; | |
7 | ||
8 | import moment from 'moment'; | |
9 | ||
10 | import TimePicker from 'rc-time-picker'; | |
11 | ||
12 | const showSecond = true; | |
13 | const str = showSecond ? 'HH:mm:ss' : 'HH:mm'; | |
14 | ||
15 | const now = moment().hour(14).minute(30); | |
16 | ||
17 | function generateOptions(length, excludedOptions) { | |
18 | const arr = []; | |
19 | for (let value = 0; value < length; value++) { | |
20 | if (excludedOptions.indexOf(value) < 0) { | |
21 | arr.push(value); | |
22 | } | |
23 | } | |
24 | return arr; | |
25 | } | |
26 | ||
27 | function onChange(value) { | |
28 | console.log(value && value.format(str)); | |
29 | } | |
30 | ||
31 | function disabledHours() { | |
32 | return [0, 1, 2, 3, 4, 5, 6, 7, 8, 22, 23]; | |
33 | } | |
34 | ||
35 | function disabledMinutes(h) { | |
36 | switch (h) { | |
37 | case 9: | |
38 | return generateOptions(60, [30]); | |
39 | case 21: | |
40 | return generateOptions(60, [0]); | |
41 | default: | |
42 | return generateOptions(60, [0, 30]); | |
43 | } | |
44 | } | |
45 | ||
46 | function disabledSeconds(h, m) { | |
47 | return [h + m % 60]; | |
48 | } | |
49 | ||
50 | ReactDom.render( | |
51 | <TimePicker | |
52 | showSecond={showSecond} | |
53 | defaultValue={now} | |
54 | className="xxx" | |
55 | onChange={onChange} | |
56 | disabledHours={disabledHours} | |
57 | disabledMinutes={disabledMinutes} | |
58 | disabledSeconds={disabledSeconds} | |
59 | />, | |
60 | document.getElementById('__react-content') | |
61 | ); |