feat(VDatePicker): pick date range

[YipingRuan]

#1646

Description

Allow datepicker to pick range.
By add new prop "Range", a workaround is provided to handle range picking.

• Value will be kept as an array of size 2 to save [From, To]. New click will clear the array
• Any dates between will be displayed as "selected"
• Can select with both direction (From then To, or To then From)

Motivation and Context

#1646

How Has This Been Tested?

visually and unit

Markup:

<template>
  <v-container>
    <v-date-picker v-model="dates" range width="290" class="mt-4"></v-date-picker>
    v-model value: {{ dates }}
    <v-menu ref="menu" v-model="menu" :close-on-content-click="false" transition="scale-transition" offset-y min-width="290px">
      <template v-slot:activator="{ on }">
        <v-text-field :value="dateRangeText" label="Date range" prepend-icon="event" readonly v-on="on"></v-text-field>
      </template>
      <v-date-picker v-model="dates" range no-title scrollable>
        <div class="flex-grow-1"></div>
        <v-btn text color="primary" @click="$refs.menu.save(dates)">OK</v-btn>
      </v-date-picker>
    </v-menu>
  </v-container>
</template>

<script>
  export default {
    data: () => ({
      dates: ['2018-09-15', '2018-09-20'],
      menu: false,
    }),
    computed: {
      dateRangeText () {
        return this.dates.join(' ~ ')
      },
    },
  }
</script>

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Improvement/refactoring (non-breaking change that doesn't add any features but makes things better)

Checklist:

• The PR title is no longer than 64 characters.
• The PR is submitted to the correct branch (master for bug fixes and documentation updates, dev for new features and breaking changes).
• My code follows the code style of this project.
• I've added relevant changes to the documentation (applies to new features and breaking changes in core library)
• I've added new examples to the kitchen (applies to new features and breaking changes in core library)

6453fa4

[dsseng]

You need to add docs for this. Document new prop + add an example.