From b62c0e32cf1357081431281fe637a4c3dec3fbf9 Mon Sep 17 00:00:00 2001 From: Mikasa33 Date: Sat, 5 Sep 2020 14:36:20 +0800 Subject: [PATCH 1/4] feat(ActionSheet): add closeable prop (#7099) * feat(ActionSheet): add closeable prop * feat(ActionSheet): add closeable prop * Update index.tsx Co-authored-by: neverland --- src/action-sheet/README.md | 1 + src/action-sheet/README.zh-CN.md | 1 + src/action-sheet/index.tsx | 19 +++++++++++++------ src/action-sheet/test/index.spec.js | 12 ++++++++++++ 4 files changed, 27 insertions(+), 6 deletions(-) diff --git a/src/action-sheet/README.md b/src/action-sheet/README.md index c819f68d0..c7e67d974 100644 --- a/src/action-sheet/README.md +++ b/src/action-sheet/README.md @@ -155,6 +155,7 @@ export default { | title | Title | _string_ | - | | cancel-text | Text of cancel button | _string_ | - | | description | Description above the options | _string_ | - | +| closeable `v2.10.5` | Whether to show close icon | _boolean_ | `true` | | close-icon | Close icon name | _string_ | `cross` | | duration | Transition duration, unit second | _number \| string_ | `0.3` | | round | Whether to show round corner | _boolean_ | `true` | diff --git a/src/action-sheet/README.zh-CN.md b/src/action-sheet/README.zh-CN.md index fb11024b0..4c536711d 100644 --- a/src/action-sheet/README.zh-CN.md +++ b/src/action-sheet/README.zh-CN.md @@ -161,6 +161,7 @@ export default { | title | 顶部标题 | _string_ | - | | cancel-text | 取消按钮文字 | _string_ | - | | description | 选项上方的描述信息 | _string_ | - | +| closeable `v2.10.5` | 是否显示关闭图标 | _boolean_ | `true` | | close-icon | 关闭[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `cross` | | duration | 动画时长，单位秒 | _number \| string_ | `0.3` | | round | 是否显示圆角 | _boolean_ | `true` | diff --git a/src/action-sheet/index.tsx b/src/action-sheet/index.tsx index b06e657ec..bf91976a4 100644 --- a/src/action-sheet/index.tsx +++ b/src/action-sheet/index.tsx @@ -30,6 +30,7 @@ export type ActionSheetProps = PopupMixinProps & { title?: string; actions?: ActionSheetItem[]; duration: number | string; + closeable?: boolean; closeIcon: string; cancelText?: string; description?: string; @@ -50,7 +51,7 @@ function ActionSheet( slots: ActionSheetSlots, ctx: RenderContext ) { - const { title, cancelText } = props; + const { title, cancelText, closeable } = props; function onCancel() { emit(ctx, 'input', false); @@ -62,11 +63,13 @@ function ActionSheet( return (
{title} - + {closeable && ( + + )}
); } @@ -179,6 +182,10 @@ ActionSheet.props = { type: Boolean, default: true, }, + closeable: { + type: Boolean, + default: true, + }, closeIcon: { type: String, default: 'cross', diff --git a/src/action-sheet/test/index.spec.js b/src/action-sheet/test/index.spec.js index 04365ac75..f73946c2e 100644 --- a/src/action-sheet/test/index.spec.js +++ b/src/action-sheet/test/index.spec.js @@ -198,3 +198,15 @@ test('close-icon prop', () => { expect(wrapper).toMatchSnapshot(); }); + +test('closeable prop', () => { + const wrapper = mount(ActionSheet, { + propsData: { + value: true, + title: 'Title', + closeable: false, + }, + }); + + expect(wrapper).toMatchSnapshot(); +}); From e7deea7195a65c38cfff087df389153a26bc71e9 Mon Sep 17 00:00:00 2001 From: neverland Date: Sat, 5 Sep 2020 14:54:05 +0800 Subject: [PATCH 2/4] fix(Field): disallow minus when using digit type (#7114) --- src/field/index.js | 4 ++-- src/utils/format/number.ts | 18 +++++++++++++----- src/utils/test/index.spec.js | 21 +++++++++++---------- 3 files changed, 26 insertions(+), 17 deletions(-) diff --git a/src/field/index.js b/src/field/index.js index 8e74a921c..eff30d6ba 100644 --- a/src/field/index.js +++ b/src/field/index.js @@ -301,8 +301,8 @@ export default createComponent({ } if (this.type === 'number' || this.type === 'digit') { - const allowDot = this.type === 'number'; - value = formatNumber(value, allowDot); + const isNumber = this.type === 'number'; + value = formatNumber(value, isNumber, isNumber); } if (this.formatter && trigger === this.formatTrigger) { diff --git a/src/utils/format/number.ts b/src/utils/format/number.ts index e1c71567b..79317a359 100644 --- a/src/utils/format/number.ts +++ b/src/utils/format/number.ts @@ -4,26 +4,34 @@ export function range(num: number, min: number, max: number): number { function trimExtraChar(value: string, char: string, regExp: RegExp) { const index = value.indexOf(char); - + if (index === -1) { - return value; + return value; } if (char === '-' && index !== 0) { - return value.slice(0, index); + return value.slice(0, index); } return value.slice(0, index + 1) + value.slice(index).replace(regExp, ''); } -export function formatNumber(value: string, allowDot?: boolean) { +export function formatNumber( + value: string, + allowDot = true, + allowMinus = true +) { if (allowDot) { value = trimExtraChar(value, '.', /\./g); } else { value = value.split('.')[0]; } - value = trimExtraChar(value, '-', /-/g); + if (allowMinus) { + value = trimExtraChar(value, '-', /-/g); + } else { + value = value.replace(/-/, ''); + } const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g; diff --git a/src/utils/test/index.spec.js b/src/utils/test/index.spec.js index a9d6bea10..2dd16e4d4 100644 --- a/src/utils/test/index.spec.js +++ b/src/utils/test/index.spec.js @@ -99,19 +99,20 @@ test('isNumeric', () => { }); test('formatNumber', () => { - expect(formatNumber('abc')).toEqual(''); - expect(formatNumber('1.2')).toEqual('1'); - expect(formatNumber('abc1.2')).toEqual('1'); - expect(formatNumber('123.4.')).toEqual('123'); - // with dot - expect(formatNumber('abc', true)).toEqual(''); - expect(formatNumber('1.2', true)).toEqual('1.2'); - expect(formatNumber('abc1.2', true)).toEqual('1.2'); - expect(formatNumber('123.4.', true)).toEqual('123.4'); + expect(formatNumber('abc')).toEqual(''); + expect(formatNumber('1.2')).toEqual('1.2'); + expect(formatNumber('abc1.2')).toEqual('1.2'); + expect(formatNumber('123.4.')).toEqual('123.4'); + + // without dot + expect(formatNumber('1.2', false)).toEqual('1'); + expect(formatNumber('abc1.2', false)).toEqual('1'); + expect(formatNumber('123.4.', false)).toEqual('123'); // minus - expect(formatNumber('-1.2')).toEqual('-1'); + expect(formatNumber('-1.2', false)).toEqual('-1'); + expect(formatNumber('-1.2', false, false)).toEqual('1'); expect(formatNumber('-1.2', true)).toEqual('-1.2'); expect(formatNumber('-1.2-', true)).toEqual('-1.2'); expect(formatNumber('123-')).toEqual('123'); From afb8ac5443fd8004077774a4b579d76bce549ea8 Mon Sep 17 00:00:00 2001 From: neverland Date: Sat, 5 Sep 2020 15:04:16 +0800 Subject: [PATCH 3/4] feat(Calendar): add readonly prop (#7115) --- src/calendar/README.md | 1 + src/calendar/README.zh-CN.md | 1 + src/calendar/index.js | 5 +++++ src/calendar/test/prop.spec.js | 22 ++++++++++++++++++++++ 4 files changed, 29 insertions(+) diff --git a/src/calendar/README.md b/src/calendar/README.md index 69c0d53e7..409de79b3 100644 --- a/src/calendar/README.md +++ b/src/calendar/README.md @@ -241,6 +241,7 @@ Set `poppable` to `false`, the calendar will be displayed directly on the page i | show-title `v2.5.5` | Whether to show title | _boolean_ | `true` | | show-subtitle `v2.5.5` | Whether to show subtitle | _boolean_ | `true` | | show-confirm | Whether to show confirm button | _boolean_ | `true` | +| readonly `v2.10.5` | Whether to be readonly | _boolean_ | `false` | | confirm-text | Confirm button text | _string_ | `Confirm` | | confirm-disabled-text | Confirm button text when disabled | _string_ | `Confirm` | | first-day-of-week `v2.9.2` | Set the start day of week | _0-6_ | `0` | diff --git a/src/calendar/README.zh-CN.md b/src/calendar/README.zh-CN.md index 075b38fa9..56b08b00b 100644 --- a/src/calendar/README.zh-CN.md +++ b/src/calendar/README.zh-CN.md @@ -243,6 +243,7 @@ export default { | show-title `v2.5.5` | 是否展示日历标题 | _boolean_ | `true` | | show-subtitle `v2.5.5` | 是否展示日历副标题（年月） | _boolean_ | `true` | | show-confirm | 是否展示确认按钮 | _boolean_ | `true` | +| readonly `v2.10.5` | 是否为只读状态，只读状态下不能选择日期 | _boolean_ | `false` | | confirm-text | 确认按钮的文字 | _string_ | `确定` | | confirm-disabled-text | 确认按钮处于禁用状态时的文字 | _string_ | `确定` | | first-day-of-week `v2.9.2` | 设置周起始日 | _0-6_ | `0` | diff --git a/src/calendar/index.js b/src/calendar/index.js index 857f08754..e28d51cd6 100644 --- a/src/calendar/index.js +++ b/src/calendar/index.js @@ -27,6 +27,7 @@ export default createComponent({ title: String, color: String, value: Boolean, + readonly: Boolean, formatter: Function, confirmText: String, rangePrompt: String, @@ -338,6 +339,10 @@ export default createComponent({ }, select(date, complete) { + if (this.readonly) { + return; + } + const emit = (date) => { this.currentDate = date; this.$emit('select', copyDates(this.currentDate)); diff --git a/src/calendar/test/prop.spec.js b/src/calendar/test/prop.spec.js index 767609dec..491cc6e57 100644 --- a/src/calendar/test/prop.spec.js +++ b/src/calendar/test/prop.spec.js @@ -213,3 +213,25 @@ test('first day of week', async () => { expect(day.text()).toEqual('1'); expect(day.attributes('style')).toContain(`margin-left: ${(100 * 4) / 7}%`); }); + +test('readonly prop', async () => { + const wrapper = mount(Calendar, { + propsData: { + type: 'multiple', + minDate, + maxDate, + readonly: true, + poppable: false, + }, + }); + + await later(); + + const days = wrapper.findAll('.van-calendar__day'); + days.at(13).trigger('click'); + expect(wrapper.emitted('select')).toBeFalsy(); + + wrapper.setProps({ readonly: false }); + days.at(13).trigger('click'); + expect(wrapper.emitted('select')).toBeTruthy(); +}); From aefec84e14ee9fe3e9b74c4422dfc6568b077a3a Mon Sep 17 00:00:00 2001 From: neverland Date: Sat, 5 Sep 2020 15:22:40 +0800 Subject: [PATCH 4/4] feat(Calendar): allow default-date to be null (#7116) --- src/calendar/README.md | 2 +- src/calendar/README.zh-CN.md | 2 +- src/calendar/components/Month.js | 4 ++++ src/calendar/index.js | 33 +++++++++++++++++++++++++------- 4 files changed, 32 insertions(+), 9 deletions(-) diff --git a/src/calendar/README.md b/src/calendar/README.md index 409de79b3..259b3b768 100644 --- a/src/calendar/README.md +++ b/src/calendar/README.md @@ -232,7 +232,7 @@ Set `poppable` to `false`, the calendar will be displayed directly on the page i | color | Color for the bottom button and selected date | _string_ | `#ee0a24` | | min-date | Min date | _Date_ | Today | | max-date | Max date | _Date_ | Six months after the today | -| default-date | Default selected date | _Date \| Date[]_ | Today | +| default-date | Default selected date | _Date \| Date[] \| null_ | Today | | row-height | Row height | _number \| string_ | `64` | | formatter | Day formatter | _(day: Day) => Day_ | - | | poppable | Whether to show the calendar inside a popup | _boolean_ | `true` | diff --git a/src/calendar/README.zh-CN.md b/src/calendar/README.zh-CN.md index 56b08b00b..20d8c0b17 100644 --- a/src/calendar/README.zh-CN.md +++ b/src/calendar/README.zh-CN.md @@ -234,7 +234,7 @@ export default { | color | 主题色，对底部按钮和选中日期生效 | _string_ | `#ee0a24` | | min-date | 可选择的最小日期 | _Date_ | 当前日期 | | max-date | 可选择的最大日期 | _Date_ | 当前日期的六个月后 | -| default-date | 默认选中的日期，`type`为`multiple`或`range`时为数组 | _Date \| Date[]_ | 今天 | +| default-date | 默认选中的日期，`type` 为 `multiple` 或 `range` 时为数组，传入 `null` 表示默认不选择 | _Date \| Date[] \| null_ | 今天 | | row-height | 日期行高 | _number \| string_ | `64` | | formatter | 日期格式化函数 | _(day: Day) => Day_ | - | | poppable | 是否以弹层的形式展示日历 | _boolean_ | `true` | diff --git a/src/calendar/components/Month.js b/src/calendar/components/Month.js index 8161ca41b..63a0b9abc 100644 --- a/src/calendar/components/Month.js +++ b/src/calendar/components/Month.js @@ -189,6 +189,10 @@ export default createComponent({ return 'disabled'; } + if (currentDate === null) { + return; + } + if (type === 'single') { return compareDay(day, currentDate) === 0 ? 'selected' : ''; } diff --git a/src/calendar/index.js b/src/calendar/index.js index e28d51cd6..360bbae7d 100644 --- a/src/calendar/index.js +++ b/src/calendar/index.js @@ -136,12 +136,13 @@ export default createComponent({ buttonDisabled() { const { type, currentDate } = this; - if (type === 'range') { - return !currentDate[0] || !currentDate[1]; - } - - if (type === 'multiple') { - return !currentDate.length; + if (currentDate) { + if (type === 'range') { + return !currentDate[0] || !currentDate[1]; + } + if (type === 'multiple') { + return !currentDate.length; + } } return !currentDate; @@ -198,6 +199,11 @@ export default createComponent({ scrollIntoView() { this.$nextTick(() => { const { currentDate } = this; + + if (!currentDate) { + return; + } + const targetDate = this.type === 'single' ? currentDate : currentDate[0]; const displayed = this.value || !this.poppable; @@ -222,6 +228,10 @@ export default createComponent({ getInitialDate() { const { type, minDate, maxDate, defaultDate } = this; + if (defaultDate === null) { + return defaultDate; + } + let defaultVal = new Date(); if (compareDay(defaultVal, minDate) === -1) { @@ -295,6 +305,11 @@ export default createComponent({ const { type, currentDate } = this; if (type === 'range') { + if (!currentDate) { + this.select([date, null]); + return; + } + const [startDay, endDay] = currentDate; if (startDay && !endDay) { @@ -311,8 +326,12 @@ export default createComponent({ this.select([date, null]); } } else if (type === 'multiple') { - let selectedIndex; + if (!currentDate) { + this.select([date]); + return; + } + let selectedIndex; const selected = this.currentDate.some((dateItem, index) => { const equal = compareDay(dateItem, date) === 0; if (equal) {