blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-24 15:39:15 +08:00
Code Issues Projects Releases Wiki Activity

feat(Calendar): support max-range when type is multiple (#6202)

Browse Source 
* feat(Calendar): support max-range when type is multiple

* docs: fix version tag
This commit is contained in:
neverland 2020-05-03 09:11:14 +08:00 committed by GitHub
parent 8348819cc8
commit 3cda85e122
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 45 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/calendar/README.md
View File

@ -255,10 +255,19 @@ Following props are supported when the type is range
| Attribute | Description | Type | Default |
| --- | --- | --- | --- |
| max-range `v2.4.3` | Number of selectable days | _number \| string_ | - |
| max-range `v2.4.3` | Number of selectable days | _number \| string_ | Unlimitied |
| range-prompt `v2.4.3` | Error message when exceeded max range | _string_ | `Choose no more than xx days` |
| allow-same-day `v2.5.6` | Whether the start and end time of the range is allowed on the same day | _boolean_ | `fasle` |
### Multiple Props
Following props are supported when the type is multiple
| Attribute | Description | Type | Default |
| --- | --- | --- | --- |
| max-range `v2.7.2` | Max count of selectable days | _number \| string_ | Unlimitied |
| range-prompt `v2.4.3` | Error message when exceeded max count | _string_ | `Choose no more than xx days` |
### Data Structure of Day
| Key | Description | Type |

11
src/calendar/README.zh-CN.md
View File

@ -257,10 +257,19 @@ export default {
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| max-range `v2.4.3` | 日期区间最多可选天数，默认无限制 | _number \| string_ | - |
| max-range `v2.4.3` | 日期区间最多可选天数 | _number \| string_ | 无限制 |
| range-prompt `v2.4.3` | 范围选择超过最多可选天数时的提示文案 | _string_ | `选择天数不能超过 xx 天` |
| allow-same-day `v2.5.6` | 是否允许日期范围的起止时间为同一天 | _boolean_ | `fasle` |
### Multiple Props
当 Canlendar 的 `type` 为 `multiple` 时，支持以下 props:
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| max-range `v2.7.2` | 日期最多可选天数 | _number \| string_ | 无限制 |
| range-prompt `v2.4.3` | 选择超过最多可选天数时的提示文案 | _string_ | `选择天数不能超过 xx 天` |
### Day 数据结构
日历中的每个日期都对应一个 Day 对象，通过`formatter`属性可以自定义 Day 对象的内容

2
src/calendar/index.js
View File

@ -293,6 +293,8 @@ export default createComponent({
if (selected) {
const [unselectedDate] = currentDate.splice(selectedIndex, 1);
this.$emit('unselect', copyDate(unselectedDate));
} else if (this.maxRange && currentDate.length >= this.maxRange) {
Toast(this.rangePrompt || t('rangePrompt', this.maxRange));
} else {
this.select([...currentDate, date]);
}

25
src/calendar/test/prop.spec.js
View File

@ -2,7 +2,7 @@ import Calendar from '..';
import { mount, later } from '../../../test';
import { minDate, maxDate, formatRange, formatDate } from './utils';
test('max-range prop when showConfirm is false', async () => {
test('max-range prop when type is range and showConfirm is false', async () => {
const wrapper = mount(Calendar, {
propsData: {
type: 'range',
@ -27,7 +27,7 @@ test('max-range prop when showConfirm is false', async () => {
expect(wrapper.emitted('confirm')).toBeFalsy();
});
test('max-range prop when showConfirm is true', async () => {
test('max-range prop when type is range and showConfirm is true', async () => {
const wrapper = mount(Calendar, {
propsData: {
type: 'range',
@ -51,6 +51,27 @@ test('max-range prop when showConfirm is true', async () => {
expect(wrapper.emitted('confirm')).toBeFalsy();
});
test('max-range prop when type is multiple', async () => {
const wrapper = mount(Calendar, {
propsData: {
type: 'multiple',
minDate,
maxDate,
maxRange: 2,
poppable: false,
showConfirm: false,
},
});
await later();
const days = wrapper.findAll('.van-calendar__day');
days.at(13).trigger('click');
days.at(14).trigger('click');
expect(wrapper.emitted('select').length).toEqual(1);
});
test('show-title prop', () => {
const wrapper = mount(Calendar, {
propsData: {