diff options
author | 偏右 <afc163@gmail.com> | 2016-11-11 14:02:21 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2016-11-11 14:02:21 +0800 |
commit | e59f4eae17cbfd7eed19cd385ec64312ffe266c4 (patch) | |
tree | 81fc9b6ec28ca54204cf6ed2ef035b5d7ee194ab | |
parent | 614f6c90232d890984d0f4f2f13ff41fdb144b27 (diff) | |
parent | 37c36c09e0a4d693a2ec5623ff2ebc8d9ee16a06 (diff) | |
download | time-picker-e59f4eae17cbfd7eed19cd385ec64312ffe266c4.tar.gz time-picker-e59f4eae17cbfd7eed19cd385ec64312ffe266c4.tar.zst time-picker-e59f4eae17cbfd7eed19cd385ec64312ffe266c4.zip |
Merge pull request #25 from react-component/feat-show-minute
Feat show minute
-rw-r--r-- | README.md | 1 | ||||
-rw-r--r-- | examples/format.html | 0 | ||||
-rw-r--r-- | examples/format.js | 26 | ||||
-rw-r--r-- | src/Combobox.jsx | 6 | ||||
-rw-r--r-- | src/Panel.jsx | 4 | ||||
-rw-r--r-- | src/TimePicker.jsx | 23 |
6 files changed, 47 insertions, 13 deletions
@@ -60,6 +60,7 @@ API | |||
60 | | value | moment | null | current value | | 60 | | value | moment | null | current value | |
61 | | placeholder | String | '' | time input's placeholder | | 61 | | placeholder | String | '' | time input's placeholder | |
62 | | showHour | Boolean | whether show hour | | | 62 | | showHour | Boolean | whether show hour | | |
63 | | showMinute | Boolean | whether show minute | | | ||
63 | | showSecond | Boolean | whether show second | | | 64 | | showSecond | Boolean | whether show second | | |
64 | | format | String | | | | 65 | | format | String | | | |
65 | | disabledHours | Function | disabled hour options | | | 66 | | disabledHours | Function | disabled hour options | | |
diff --git a/examples/format.html b/examples/format.html new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/examples/format.html | |||
diff --git a/examples/format.js b/examples/format.js new file mode 100644 index 0000000..c9a9539 --- /dev/null +++ b/examples/format.js | |||
@@ -0,0 +1,26 @@ | |||
1 | import 'rc-time-picker/assets/index.less'; | ||
2 | import React from 'react'; | ||
3 | import ReactDom from 'react-dom'; | ||
4 | import moment from 'moment'; | ||
5 | import TimePicker from 'rc-time-picker'; | ||
6 | |||
7 | const App = React.createClass({ | ||
8 | render() { | ||
9 | return ( | ||
10 | <div> | ||
11 | <TimePicker defaultValue={moment()} showHour={false} /> | ||
12 | <TimePicker defaultValue={moment()} showMinute={false} /> | ||
13 | <TimePicker defaultValue={moment()} showSecond={false} /> | ||
14 | |||
15 | <TimePicker defaultValue={moment()} showMinute={false} showSecond={false} /> | ||
16 | <TimePicker defaultValue={moment()} showHour={false} showSecond={false}/> | ||
17 | <TimePicker defaultValue={moment()} showHour={false} showMinute={false} /> | ||
18 | </div> | ||
19 | ); | ||
20 | }, | ||
21 | }); | ||
22 | |||
23 | ReactDom.render( | ||
24 | <App />, | ||
25 | document.getElementById('__react-content') | ||
26 | ); | ||
diff --git a/src/Combobox.jsx b/src/Combobox.jsx index 9d9da16..013617c 100644 --- a/src/Combobox.jsx +++ b/src/Combobox.jsx | |||
@@ -26,6 +26,7 @@ const Combobox = React.createClass({ | |||
26 | value: PropTypes.object, | 26 | value: PropTypes.object, |
27 | onChange: PropTypes.func, | 27 | onChange: PropTypes.func, |
28 | showHour: PropTypes.bool, | 28 | showHour: PropTypes.bool, |
29 | showMinute: PropTypes.bool, | ||
29 | showSecond: PropTypes.bool, | 30 | showSecond: PropTypes.bool, |
30 | hourOptions: PropTypes.array, | 31 | hourOptions: PropTypes.array, |
31 | minuteOptions: PropTypes.array, | 32 | minuteOptions: PropTypes.array, |
@@ -73,7 +74,10 @@ const Combobox = React.createClass({ | |||
73 | }, | 74 | }, |
74 | 75 | ||
75 | getMinuteSelect(minute) { | 76 | getMinuteSelect(minute) { |
76 | const { prefixCls, minuteOptions, disabledMinutes, defaultOpenValue } = this.props; | 77 | const { prefixCls, minuteOptions, disabledMinutes, defaultOpenValue, showMinute } = this.props; |
78 | if (!showMinute) { | ||
79 | return null; | ||
80 | } | ||
77 | const value = this.props.value || defaultOpenValue; | 81 | const value = this.props.value || defaultOpenValue; |
78 | const disabledOptions = disabledMinutes(value.hour()); | 82 | const disabledOptions = disabledMinutes(value.hour()); |
79 | 83 | ||
diff --git a/src/Panel.jsx b/src/Panel.jsx index 0ed60e9..fddea1c 100644 --- a/src/Panel.jsx +++ b/src/Panel.jsx | |||
@@ -34,6 +34,7 @@ const Panel = React.createClass({ | |||
34 | onEsc: PropTypes.func, | 34 | onEsc: PropTypes.func, |
35 | allowEmpty: PropTypes.bool, | 35 | allowEmpty: PropTypes.bool, |
36 | showHour: PropTypes.bool, | 36 | showHour: PropTypes.bool, |
37 | showMinute: PropTypes.bool, | ||
37 | showSecond: PropTypes.bool, | 38 | showSecond: PropTypes.bool, |
38 | onClear: PropTypes.func, | 39 | onClear: PropTypes.func, |
39 | addon: PropTypes.func, | 40 | addon: PropTypes.func, |
@@ -88,7 +89,7 @@ const Panel = React.createClass({ | |||
88 | render() { | 89 | render() { |
89 | const { | 90 | const { |
90 | prefixCls, className, placeholder, disabledHours, disabledMinutes, | 91 | prefixCls, className, placeholder, disabledHours, disabledMinutes, |
91 | disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showSecond, | 92 | disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond, |
92 | format, defaultOpenValue, clearText, onEsc, addon, | 93 | format, defaultOpenValue, clearText, onEsc, addon, |
93 | } = this.props; | 94 | } = this.props; |
94 | const { | 95 | const { |
@@ -130,6 +131,7 @@ const Panel = React.createClass({ | |||
130 | format={format} | 131 | format={format} |
131 | onChange={this.onChange} | 132 | onChange={this.onChange} |
132 | showHour={showHour} | 133 | showHour={showHour} |
134 | showMinute={showMinute} | ||
133 | showSecond={showSecond} | 135 | showSecond={showSecond} |
134 | hourOptions={hourOptions} | 136 | hourOptions={hourOptions} |
135 | minuteOptions={minuteOptions} | 137 | minuteOptions={minuteOptions} |
diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx index 358b596..e9f18a9 100644 --- a/src/TimePicker.jsx +++ b/src/TimePicker.jsx | |||
@@ -29,9 +29,10 @@ const Picker = React.createClass({ | |||
29 | placeholder: PropTypes.string, | 29 | placeholder: PropTypes.string, |
30 | format: PropTypes.string, | 30 | format: PropTypes.string, |
31 | showHour: PropTypes.bool, | 31 | showHour: PropTypes.bool, |
32 | showMinute: PropTypes.bool, | ||
33 | showSecond: PropTypes.bool, | ||
32 | style: PropTypes.object, | 34 | style: PropTypes.object, |
33 | className: PropTypes.string, | 35 | className: PropTypes.string, |
34 | showSecond: PropTypes.bool, | ||
35 | disabledHours: PropTypes.func, | 36 | disabledHours: PropTypes.func, |
36 | disabledMinutes: PropTypes.func, | 37 | disabledMinutes: PropTypes.func, |
37 | disabledSeconds: PropTypes.func, | 38 | disabledSeconds: PropTypes.func, |
@@ -53,6 +54,7 @@ const Picker = React.createClass({ | |||
53 | defaultOpenValue: moment(), | 54 | defaultOpenValue: moment(), |
54 | allowEmpty: true, | 55 | allowEmpty: true, |
55 | showHour: true, | 56 | showHour: true, |
57 | showMinute: true, | ||
56 | showSecond: true, | 58 | showSecond: true, |
57 | disabledHours: noop, | 59 | disabledHours: noop, |
58 | disabledMinutes: noop, | 60 | disabledMinutes: noop, |
@@ -121,24 +123,22 @@ const Picker = React.createClass({ | |||
121 | }, | 123 | }, |
122 | 124 | ||
123 | getFormat() { | 125 | getFormat() { |
124 | const format = this.props.format; | 126 | const { format, showHour, showMinute, showSecond } = this.props; |
125 | if (format) { | 127 | if (format) { |
126 | return format; | 128 | return format; |
127 | } | 129 | } |
128 | if (!this.props.showSecond) { | 130 | return [ |
129 | return 'HH:mm'; | 131 | showHour ? 'HH' : '', |
130 | } | 132 | showMinute ? 'mm' : '', |
131 | if (!this.props.showHour) { | 133 | showSecond ? 'ss' : '', |
132 | return 'mm:ss'; | 134 | ].filter(item => !!item).join(':'); |
133 | } | ||
134 | return 'HH:mm:ss'; | ||
135 | }, | 135 | }, |
136 | 136 | ||
137 | getPanelElement() { | 137 | getPanelElement() { |
138 | const { | 138 | const { |
139 | prefixCls, placeholder, disabledHours, | 139 | prefixCls, placeholder, disabledHours, |
140 | disabledMinutes, disabledSeconds, hideDisabledOptions, | 140 | disabledMinutes, disabledSeconds, hideDisabledOptions, |
141 | allowEmpty, showHour, showSecond, defaultOpenValue, clearText, | 141 | allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText, |
142 | addon, | 142 | addon, |
143 | } = this.props; | 143 | } = this.props; |
144 | return ( | 144 | return ( |
@@ -151,8 +151,9 @@ const Picker = React.createClass({ | |||
151 | onClear={this.onPanelClear} | 151 | onClear={this.onPanelClear} |
152 | defaultOpenValue={defaultOpenValue} | 152 | defaultOpenValue={defaultOpenValue} |
153 | showHour={showHour} | 153 | showHour={showHour} |
154 | onEsc={this.onEsc} | 154 | showMinute={showMinute} |
155 | showSecond={showSecond} | 155 | showSecond={showSecond} |
156 | onEsc={this.onEsc} | ||
156 | allowEmpty={allowEmpty} | 157 | allowEmpty={allowEmpty} |
157 | format={this.getFormat()} | 158 | format={this.getFormat()} |
158 | placeholder={placeholder} | 159 | placeholder={placeholder} |