diff --git a/README.md b/README.md index 1098b6ad..8955ee2d 100644 --- a/README.md +++ b/README.md @@ -68,10 +68,12 @@ API | showHour | Boolean | true | whether show hour | | | showMinute | Boolean | true | whether show minute | | showSecond | Boolean | true | whether show second | +| showMillisecond | Boolean | false | whether show millisecond | | format | String | - | moment format | | disabledHours | Function | - | disabled hour options | | disabledMinutes | Function | - | disabled minute options | | disabledSeconds | Function | - | disabled second options | +| disabledMilliseconds | Function | - | disabled millisecond options | | use12Hours | Boolean | false | 12 hours display mode | | hideDisabledOptions | Boolean | false | whether hide disabled options | | onChange | Function | null | called when time-picker a different value | @@ -85,10 +87,11 @@ API | hourStep | Number | 1 | interval between hours in picker | | minuteStep | Number | 1 | interval between minutes in picker | | secondStep | Number | 1 | interval between seconds in picker | +| millisecondStep | Number | 1 | interval between milliseconds in picker | | focusOnOpen | Boolean | false | automatically focus the input when the picker opens | -| inputReadOnly | Boolean | false | set input to read only | -| inputIcon | ReactNode | | specific the time-picker icon. | -| clearIcon | ReactNode | | specific the clear icon. | +| inputReadOnly | Boolean | false | set input to read only | +| inputIcon | ReactNode | | specific the select icon. | +| clearIcon | ReactNode | | specific the clear icon. | ## Test Case diff --git a/assets/index/Panel.less b/assets/index/Panel.less index 68e6c8e7..a46318bf 100644 --- a/assets/index/Panel.less +++ b/assets/index/Panel.less @@ -26,4 +26,8 @@ &-narrow { max-width: 113px; } + + &-wide { + width: 227px; + } } diff --git a/examples/disabled.js b/examples/disabled.js index d7011adb..cbe5c802 100644 --- a/examples/disabled.js +++ b/examples/disabled.js @@ -45,6 +45,10 @@ function disabledSeconds(h, m) { return [h + (m % 60)]; } +function disabledMilliseconds() { + return [1, 5, 10]; +} + const App = () => ( <>

Disabled picker

@@ -52,12 +56,14 @@ const App = () => (

Disabled options

); diff --git a/examples/format.js b/examples/format.js index 6b6d1126..dffabc54 100644 --- a/examples/format.js +++ b/examples/format.js @@ -8,6 +8,7 @@ const App = () => ( + diff --git a/src/Combobox.jsx b/src/Combobox.jsx index 77dc4119..ae36130b 100644 --- a/src/Combobox.jsx +++ b/src/Combobox.jsx @@ -56,8 +56,11 @@ class Combobox extends Component { } } onAmPmChange(ampm); - } else { + } else if (type === 'second') { value.second(+itemValue); + } else { + itemValue += '0'; + value.millisecond(+itemValue); } onChange(value); }; @@ -154,6 +157,33 @@ class Combobox extends Component { ); } + getMillisecondSelect(millisecond) { + const { + prefixCls, + millisecondOptions, + disabledMilliseconds, + showMillisecond, + defaultOpenValue, + value: propValue, + } = this.props; + if (!showMillisecond) { + return null; + } + const value = propValue || defaultOpenValue; + const disabledOptions = disabledMilliseconds(value.hour(), value.minute(), value.second()); + + return ( +