]>
Commit | Line | Data |
---|---|---|
0e62bf0b M |
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 GregorianCalendar from 'gregorian-calendar'; | |
9 | import DateTimeFormat from 'gregorian-calendar-format'; | |
10 | import zhCn from 'gregorian-calendar/lib/locale/zh_CN'; | |
11 | ||
12 | import TimePicker from 'rc-time-picker'; | |
13 | import TimePickerLocale from 'rc-time-picker/src/locale/zh_CN'; | |
14 | ||
15 | const showSecond = true; | |
16 | const str = showSecond ? 'HH:mm:ss' : 'HH:mm'; | |
17 | ||
18 | const formatter = new DateTimeFormat(str); | |
19 | ||
20 | const now = new GregorianCalendar(zhCn); | |
21 | now.setTime(Date.now()); | |
22 | ||
71bd9bc1 M |
23 | function generateOptions(length, excludedOptions) { |
24 | const arr = []; | |
25 | for (let value = 0; value < length; value++) { | |
26 | if (excludedOptions.indexOf(value) < 0) { | |
27 | arr.push(value); | |
28 | } | |
29 | } | |
30 | return arr; | |
31 | } | |
32 | ||
0e62bf0b M |
33 | function onChange(value) { |
34 | console.log(value && formatter.format(value)); | |
35 | } | |
36 | ||
71bd9bc1 M |
37 | function disabledHours() { |
38 | return [0, 1, 2, 3, 4, 5, 6, 7, 8, 22, 23]; | |
39 | } | |
40 | ||
41 | function disabledMinutes(h) { | |
42 | switch (h) { | |
43 | case 9: | |
44 | return generateOptions(60, [30]); | |
45 | case 21: | |
46 | return generateOptions(60, [0]); | |
47 | default: | |
48 | return generateOptions(60, [0, 30]); | |
49 | } | |
50 | } | |
51 | ||
52 | function disabledSeconds(h, m) { | |
53 | return [h + m % 60]; | |
54 | } | |
55 | ||
0e62bf0b M |
56 | ReactDom.render( |
57 | <TimePicker formatter={formatter} locale={TimePickerLocale} | |
58 | showSecond={showSecond} | |
59 | defaultValue={now} | |
60 | className="xxx" | |
61 | onChange={onChange} | |
71bd9bc1 M |
62 | disabledHours={disabledHours} |
63 | disabledMinutes={disabledMinutes} | |
64 | disabledSeconds={disabledSeconds} />, | |
0e62bf0b M |
65 | document.getElementById('__react-content') |
66 | ); |