From 138eae594dd440ce815e45d811a0778cb3e7583f Mon Sep 17 00:00:00 2001 From: tanjinzhou <415800467@qq.com> Date: Sun, 26 Apr 2020 16:37:15 +0800 Subject: [PATCH] feat: date-picker add inputreadonly --- components/date-picker/RangePicker.jsx | 2 ++ components/date-picker/createPicker.js | 3 ++- components/date-picker/interface.js | 1 + components/vc-calendar/src/Calendar.jsx | 3 +++ components/vc-calendar/src/RangeCalendar.jsx | 1 + components/vc-calendar/src/date/DateInput.jsx | 14 +++++++++++++- .../src/range-calendar/CalendarPart.jsx | 3 +++ types/date-picker/common.d.ts | 2 ++ 8 files changed, 27 insertions(+), 2 deletions(-) diff --git a/components/date-picker/RangePicker.jsx b/components/date-picker/RangePicker.jsx index 24c0f4b96..88e05b569 100644 --- a/components/date-picker/RangePicker.jsx +++ b/components/date-picker/RangePicker.jsx @@ -292,6 +292,7 @@ export default { localeCode, format, separator, + inputReadOnly, } = props; const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('calendar', customizePrefixCls); @@ -351,6 +352,7 @@ export default { value: showDate, hoverValue, showToday, + inputReadOnly, }, on: { change: calendarChange, diff --git a/components/date-picker/createPicker.js b/components/date-picker/createPicker.js index 40d9e37b0..4aac434f5 100644 --- a/components/date-picker/createPicker.js +++ b/components/date-picker/createPicker.js @@ -140,7 +140,7 @@ export default function createPicker(TheCalendar, props) { const { panelChange = noop, focus = noop, blur = noop, ok = noop } = listeners; const props = getOptionProps(this); - const { prefixCls: customizePrefixCls, locale, localeCode } = props; + const { prefixCls: customizePrefixCls, locale, localeCode, inputReadOnly } = props; const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('calendar', customizePrefixCls); this._prefixCls = prefixCls; @@ -189,6 +189,7 @@ export default function createPicker(TheCalendar, props) { monthCellContentRender, renderFooter: this.renderFooter, value: showDate, + inputReadOnly, }, on: { ok, diff --git a/components/date-picker/interface.js b/components/date-picker/interface.js index 1412cde46..25f2d7ab0 100644 --- a/components/date-picker/interface.js +++ b/components/date-picker/interface.js @@ -36,6 +36,7 @@ export const PickerProps = () => ({ tagPrefixCls: PropTypes.string, tabIndex: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), align: PropTypes.object.def(() => ({})), + inputReadOnly: PropTypes.bool, }); export const SinglePickerProps = () => ({ diff --git a/components/vc-calendar/src/Calendar.jsx b/components/vc-calendar/src/Calendar.jsx index 9d1b16d3f..06a06cfce 100644 --- a/components/vc-calendar/src/Calendar.jsx +++ b/components/vc-calendar/src/Calendar.jsx @@ -54,6 +54,7 @@ const Calendar = { clearIcon: PropTypes.any, focusablePanel: PropTypes.bool.def(true), inputMode: PropTypes.string, + inputReadOnly: PropTypes.bool, }, mixins: [BaseMixin, CommonMixin, CalendarMixin], @@ -250,6 +251,7 @@ const Calendar = { sMode, renderFooter, inputMode, + inputReadOnly, monthCellRender, monthCellContentRender, $props: props, @@ -303,6 +305,7 @@ const Calendar = { clearIcon={clearIcon} onSelect={this.onDateInputSelect} inputMode={inputMode} + inputReadOnly={inputReadOnly} /> ) : null; const children = []; diff --git a/components/vc-calendar/src/RangeCalendar.jsx b/components/vc-calendar/src/RangeCalendar.jsx index 1a35d07be..80ea948f7 100644 --- a/components/vc-calendar/src/RangeCalendar.jsx +++ b/components/vc-calendar/src/RangeCalendar.jsx @@ -119,6 +119,7 @@ const RangeCalendar = { renderSidebar: PropTypes.func.def(() => null), dateRender: PropTypes.func, clearIcon: PropTypes.any, + inputReadOnly: PropTypes.bool, }, mixins: [BaseMixin, CommonMixin], diff --git a/components/vc-calendar/src/date/DateInput.jsx b/components/vc-calendar/src/date/DateInput.jsx index d96275411..ad528c824 100644 --- a/components/vc-calendar/src/date/DateInput.jsx +++ b/components/vc-calendar/src/date/DateInput.jsx @@ -26,6 +26,7 @@ const DateInput = { selectedValue: PropTypes.object, clearIcon: PropTypes.any, inputMode: PropTypes.string, + inputReadOnly: PropTypes.bool, }, data() { @@ -166,7 +167,17 @@ const DateInput = { }, render() { - const { invalid, str, locale, prefixCls, placeholder, disabled, showClear, inputMode } = this; + const { + invalid, + str, + locale, + prefixCls, + placeholder, + disabled, + showClear, + inputMode, + inputReadOnly, + } = this; const clearIcon = getComponentFromProp(this, 'clearIcon'); const invalidClass = invalid ? `${prefixCls}-input-invalid` : ''; return ( @@ -193,6 +204,7 @@ const DateInput = { onFocus={this.onFocus} onBlur={this.onBlur} inputMode={inputMode} + readOnly={inputReadOnly} /> {showClear ? ( diff --git a/components/vc-calendar/src/range-calendar/CalendarPart.jsx b/components/vc-calendar/src/range-calendar/CalendarPart.jsx index 7ca6349cc..1ac96deb9 100644 --- a/components/vc-calendar/src/range-calendar/CalendarPart.jsx +++ b/components/vc-calendar/src/range-calendar/CalendarPart.jsx @@ -33,6 +33,7 @@ const CalendarPart = { clearIcon: PropTypes.any, dateRender: PropTypes.func, inputMode: PropTypes.string, + inputReadOnly: PropTypes.bool, }, render() { const { $props: props } = this; @@ -59,6 +60,7 @@ const CalendarPart = { showWeekNumber, showClear, inputMode, + inputReadOnly, } = props; const clearIcon = getComponentFromProp(this, 'clearIcon'); const { @@ -117,6 +119,7 @@ const CalendarPart = { onSelect={inputSelect} clearIcon={clearIcon} inputMode={inputMode} + inputReadOnly={inputReadOnly} /> ); const headerProps = { diff --git a/types/date-picker/common.d.ts b/types/date-picker/common.d.ts index 9e0b81e76..7f6ffdb37 100644 --- a/types/date-picker/common.d.ts +++ b/types/date-picker/common.d.ts @@ -86,4 +86,6 @@ export declare class DatepickerCommon extends AntdComponent { * @type any (VNode | slot) */ suffixIcon: any; + + inputReadOnly: boolean; }