move files to subfolders

src/components/date-picker/base/month-table.vue

@@ -1,79 +0,0 @@
-<template>
-    <div :class="classes" @click="handleClick">
-        <span :class="getCellCls(cell)" v-for="(cell, index) in cells"><em :index="index">{{ tCell(cell.text) }}</em></span>
-    </div>
-</template>
-<script>
-    import { deepCopy } from '../../../utils/assist';
-    import Locale from '../../../mixins/locale';
-    const prefixCls = 'ivu-date-picker-cells';
-
-    export default {
-        mixins: [ Locale ],
-        props: {
-            date: {},
-            month: {
-                type: Number
-            },
-            disabledDate: {},
-            selectionMode: {
-                default: 'month'
-            }
-        },
-        computed: {
-            classes () {
-                return [
-                    `${prefixCls}`,
-                    `${prefixCls}-month`
-                ];
-            },
-            cells () {
-                let cells = [];
-                const cell_tmpl = {
-                    text: '',
-                    selected: false,
-                    disabled: false
-                };
-
-                for (let i = 0; i < 12; i++) {
-                    const cell = deepCopy(cell_tmpl);
-                    cell.text = i + 1;
-
-                    const date = new Date(this.date);
-                    date.setMonth(i);
-                    cell.disabled = typeof this.disabledDate === 'function' && this.disabledDate(date)  && this.selectionMode === 'month';
-
-                    cell.selected = Number(this.month) === i;
-                    cells.push(cell);
-                }
-
-                return cells;
-            }
-        },
-        methods: {
-            getCellCls (cell) {
-                return [
-                    `${prefixCls}-cell`,
-                    {
-                        [`${prefixCls}-cell-selected`]: cell.selected,
-                        [`${prefixCls}-cell-disabled`]: cell.disabled
-                    }
-                ];
-            },
-            handleClick (event) {
-                const target = event.target;
-                if (target.tagName === 'EM') {
-                    const index = parseInt(event.target.getAttribute('index'));
-                    const cell = this.cells[index];
-                    if (cell.disabled) return;
-
-                    this.$emit('on-pick', index);
-                }
-                this.$emit('on-pick-click');
-            },
-            tCell (cell) {
-                return this.t(`i.datepicker.months.m${cell}`);
-            }
-        }
-    };
-</script>

src/components/date-picker/base/year-table.vue

@@ -1,30 +1,34 @@
 <template>
-    <div :class="classes" @click="handleClick">
+    <div :class="classes">
-        <span :class="getCellCls(cell)" v-for="(cell, index) in cells"><em :index="index">{{ cell.text }}</em></span>
+        <span
+            :class="getCellCls(cell)"
+            v-for="cell in cells"
+            @click="handleClick(cell)"
+            @mouseenter="handleMouseMove(cell)"
+        >
+            <em>{{ cell.date.getFullYear() }}</em>
+        </span>
     </div>
 </template>
 <script>
+    import { clearHours, isInRange } from '../util';
     import { deepCopy } from '../../../utils/assist';
-    const prefixCls = 'ivu-date-picker-cells';
+    import mixin from './mixin';
+    import prefixCls from './prefixCls';
 
     export default {
-        props: {
+        mixins: [ mixin ],
-            date: {},
+
-            year: {},
+        props: {/* in mixin */},
-            disabledDate: {},
-            selectionMode: {
-                default: 'year'
-            }
-        },
         computed: {
-            classes () {
+            classes() {
                 return [
                     `${prefixCls}`,
                     `${prefixCls}-year`
                 ];
             },
             startYear() {
-                return Math.floor(this.year / 10) * 10;
+                return Math.floor(this.tableDate.getFullYear() / 10) * 10;
             },
             cells () {
                 let cells = [];
@@ -34,15 +38,18 @@
                     disabled: false
                 };
 
+                const rangeStart = this.rangeState.from && clearHours(new Date(this.rangeState.from.getFullYear(), 0, 1));
+                const rangeEnd = this.rangeState.to && clearHours(new Date(this.rangeState.to.getFullYear(), 0, 1));
+                const selectedDays = this.dates.filter(Boolean).map(date => clearHours(new Date(date.getFullYear(), 0, 1)));
+
+
                 for (let i = 0; i < 10; i++) {
                     const cell = deepCopy(cell_tmpl);
-                    cell.text = this.startYear + i;
+                    cell.date = new Date(this.startYear + i, 0, 1);
-
+                    cell.disabled = typeof this.disabledDate === 'function' && this.disabledDate(cell.date) && this.selectionMode === 'year';
-                    const date = new Date(this.date);
+                    const time = clearHours(cell.date);
-                    date.setFullYear(cell.text);
+                    cell.range = isInRange(time, rangeStart, rangeEnd);
-                    cell.disabled = typeof this.disabledDate === 'function' && this.disabledDate(date) && this.selectionMode === 'year';
+                    cell.selected = selectedDays.includes(time);
-
-                    cell.selected = Number(this.year) === cell.text;
                     cells.push(cell);
                 }
 
@@ -55,26 +62,11 @@
                     `${prefixCls}-cell`,
                     {
                         [`${prefixCls}-cell-selected`]: cell.selected,
-                        [`${prefixCls}-cell-disabled`]: cell.disabled
+                        [`${prefixCls}-cell-disabled`]: cell.disabled,
+                        [`${prefixCls}-cell-range`]: cell.range && !cell.start && !cell.end
                     }
                 ];
             },
-            nextTenYear() {
-                this.$emit('on-pick', Number(this.year) + 10, false);
-            },
-            prevTenYear() {
-                this.$emit('on-pick', Number(this.year) - 10, false);
-            },
-            handleClick (event) {
-                const target = event.target;
-                if (target.tagName === 'EM') {
-                    const cell = this.cells[parseInt(event.target.getAttribute('index'))];
-                    if (cell.disabled) return;
-
-                    this.$emit('on-pick', cell.text);
-                }
-                this.$emit('on-pick-click');
-            }
         }
     };
 </script>

src/components/date-picker/panel/Date/date-panel-mixin.js

@@ -0,0 +1,50 @@
+
+import { oneOf } from '../../../../utils/assist';
+import {initTimeDate } from '../../util';
+
+
+export default {
+    props: {
+        confirm: {
+            type: Boolean,
+            default: false
+        },
+        showTime: {
+            type: Boolean,
+            default: false
+        },
+        format: {
+            type: String,
+            default: 'yyyy-MM-dd'
+        },
+        selectionMode: {
+            type: String,
+            validator (value) {
+                return oneOf(value, ['year', 'month', 'date', 'time']);
+            },
+            default: 'date'
+        },
+        shortcuts: {
+            type: Array,
+            default: () => []
+        },
+        disabledDate: {
+            type: Function,
+            default: () => false
+        },
+        value: {
+            type: Array,
+            default: () => [initTimeDate(), initTimeDate()]
+        }
+    },
+    computed: {
+        isTime(){
+            return this.currentView === 'time';
+        }
+    },
+    methods: {
+        handleToggleTime(){
+            this.currentView = this.currentView === 'time' ? this.selectionMode : 'time';
+        },
+    }
+};

src/components/date-picker/panel/Time/time-range.vue

@@ -0,0 +1,163 @@
+<template>
+    <div :class="classes" @mousedown.prevent>
+        <div :class="[prefixCls + '-body']">
+            <div :class="[prefixCls + '-content', prefixCls + '-content-left']">
+                <div :class="[timePrefixCls + '-header']">
+                    <template v-if="showDate">{{ leftDatePanelLabel }}</template>
+                    <template v-else>{{ t('i.datepicker.startTime') }}</template>
+                </div>
+                <time-spinner
+                    ref="timeSpinner"
+                    :steps="steps"
+                    :show-seconds="showSeconds"
+                    :hours="dateStart.getHours()"
+                    :minutes="dateStart.getMinutes()"
+                    :seconds="dateStart.getSeconds()"
+                    :disabled-hours="disabledHours"
+                    :disabled-minutes="disabledMinutes"
+                    :disabled-seconds="disabledSeconds"
+                    :hide-disabled-options="hideDisabledOptions"
+                    @on-change="handleStartChange"
+                    @on-pick-click="handlePickClick"></time-spinner>
+            </div>
+            <div :class="[prefixCls + '-content', prefixCls + '-content-right']">
+                <div :class="[timePrefixCls + '-header']">
+                    <template v-if="showDate">{{ rightDatePanelLabel }}</template>
+                    <template v-else>{{ t('i.datepicker.endTime') }}</template>
+                </div>
+                <time-spinner
+                    ref="timeSpinnerEnd"
+                    :steps="steps"
+                    :show-seconds="showSeconds"
+                    :hours="dateEnd.getHours()"
+                    :minutes="dateEnd.getMinutes()"
+                    :seconds="dateEnd.getSeconds()"
+                    :disabled-hours="disabledHours"
+                    :disabled-minutes="disabledMinutes"
+                    :disabled-seconds="disabledSeconds"
+                    :hide-disabled-options="hideDisabledOptions"
+                    @on-change="handleEndChange"
+                    @on-pick-click="handlePickClick"></time-spinner>
+            </div>
+            <Confirm
+                v-if="confirm"
+                @on-pick-clear="handlePickClear"
+                @on-pick-success="handlePickSuccess"></Confirm>
+        </div>
+    </div>
+</template>
+<script>
+    import TimeSpinner from '../../base/time-spinner.vue';
+    import Confirm from '../../base/confirm.vue';
+    import Options from '../../time-mixins';
+
+
+    import Mixin from '../panel-mixin';
+    import Locale from '../../../../mixins/locale';
+
+    import { initTimeDate, formatDateLabels } from '../../util';
+
+    const prefixCls = 'ivu-picker-panel';
+    const timePrefixCls = 'ivu-time-picker';
+
+    const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
+
+    export default {
+        name: 'RangeTimePickerPanel',
+        mixins: [ Mixin, Locale, Options ],
+        components: { TimeSpinner, Confirm },
+        props: {
+            steps: {
+                type: Array,
+                default: () => []
+            },
+            format: {
+                type: String,
+                default: 'HH:mm:ss'
+            },
+            value: {
+                type: Array,
+                required: true
+            },
+        },
+        data () {
+            const [dateStart, dateEnd] = this.value.slice();
+            return {
+                prefixCls: prefixCls,
+                timePrefixCls: timePrefixCls,
+                showDate: false,
+                dateStart: dateStart || initTimeDate(),
+                dateEnd: dateEnd || initTimeDate(),
+                confirm: false
+            };
+        },
+        computed: {
+            classes () {
+                return [
+                    `${prefixCls}-body-wrapper`,
+                    `${timePrefixCls}-with-range`,
+                    {
+                        [`${timePrefixCls}-with-seconds`]: this.showSeconds
+                    }
+                ];
+            },
+            showSeconds () {
+                return (this.format || '').indexOf('ss') !== -1;
+            },
+            leftDatePanelLabel () {
+                return this.panelLabelConfig(this.date);
+            },
+            rightDatePanelLabel () {
+                return this.panelLabelConfig(this.dateEnd);
+            }
+        },
+        watch: {
+            value (dates) {
+                const [dateStart, dateEnd] = dates.slice();
+                this.dateStart = dateStart || initTimeDate();
+                this.dateEnd = dateEnd || initTimeDate();
+            }
+        },
+        methods: {
+            panelLabelConfig (date) {
+                const locale = this.t('i.locale');
+                const datePanelLabel = this.t('i.datepicker.datePanelLabel');
+                const { labels, separator } = formatDateLabels(locale, datePanelLabel, date || initTimeDate());
+                return [labels[0].label, separator, labels[1].label].join('');
+            },
+            handleChange (start, end, emit = true) {
+
+                const dateStart = new Date(this.dateStart);
+                let dateEnd = new Date(this.dateEnd);
+
+                // set dateStart
+                Object.keys(start).forEach(type => {
+                    dateStart[`set${capitalize(type)}`](start[type])
+                });
+
+                // set dateEnd
+                Object.keys(end).forEach(type => {
+                    dateEnd[`set${capitalize(type)}`](end[type]);
+                });
+
+                // judge endTime > startTime?
+                if (dateEnd < dateStart) dateEnd = dateStart;
+
+                if (emit) this.$emit('on-pick', [dateStart, dateEnd], true);
+            },
+            handleStartChange (date) {
+                this.handleChange(date, {});
+            },
+            handleEndChange (date) {
+                this.handleChange({}, date);
+            },
+            updateScroll () {
+                this.$refs.timeSpinner.updateScroll();
+                this.$refs.timeSpinnerEnd.updateScroll();
+            }
+        },
+        mounted () {
+            if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
+        }
+    };
+</script>

src/components/date-picker/panel/Time/time.vue

@@ -7,9 +7,9 @@
                     ref="timeSpinner"
                     :show-seconds="showSeconds"
                     :steps="steps"
-                    :hours="hours"
+                    :hours="date.getHours()"
-                    :minutes="minutes"
+                    :minutes="date.getMinutes()"
-                    :seconds="seconds"
+                    :seconds="date.getSeconds()"
                     :disabled-hours="disabledHours"
                     :disabled-minutes="disabledMinutes"
                     :disabled-seconds="disabledSeconds"
@@ -25,42 +25,45 @@
     </div>
 </template>
 <script>
-    import TimeSpinner from '../base/time-spinner.vue';
+    import TimeSpinner from '../../base/time-spinner.vue';
-    import Confirm from '../base/confirm.vue';
+    import Confirm from '../../base/confirm.vue';
+    import Options from '../../time-mixins';
 
-    import Mixin from './mixin';
-    import Locale from '../../../mixins/locale';
 
-    import { initTimeDate } from '../util';
+    import Mixin from '../panel-mixin';
+    import Locale from '../../../../mixins/locale';
+
+    import { initTimeDate } from '../../util';
 
     const prefixCls = 'ivu-picker-panel';
     const timePrefixCls = 'ivu-time-picker';
 
+    const capitalize = (str) => str[0].toUpperCase() + str.slice(1);
+
     export default {
-        name: 'TimePicker',
+        name: 'TimePickerPanel',
-        mixins: [ Mixin, Locale ],
+        mixins: [ Mixin, Locale, Options ],
         components: { TimeSpinner, Confirm },
         props: {
             steps: {
                 type: Array,
                 default: () => []
-            }
+            },
+            format: {
+                type: String,
+                default: 'HH:mm:ss'
+            },
+            value: {
+                type: Array,
+                required: true
+            },
         },
         data () {
             return {
                 prefixCls: prefixCls,
                 timePrefixCls: timePrefixCls,
-                date: initTimeDate(),
+                date: this.value[0] || initTimeDate(),
-                value: '',
                 showDate: false,
-                format: 'HH:mm:ss',
-                hours: '',
-                minutes: '',
-                seconds: '',
-                disabledHours: [],
-                disabledMinutes: [],
-                disabledSeconds: [],
-                hideDisabledOptions: false,
                 confirm: false
             };
         },
@@ -68,7 +71,7 @@
             showSeconds () {
                 return (this.format || '').indexOf('ss') !== -1;
             },
-            visibleDate () {
+            visibleDate () { // TODO
                 const date = this.date;
                 const month = date.getMonth() + 1;
                 const tYear = this.t('i.datepicker.year');
@@ -77,44 +80,22 @@
             }
         },
         watch: {
-            value (newVal) {
+            value (dates) {
-                if (!newVal) return;
+                let newVal = dates[0] || initTimeDate();
                 newVal = new Date(newVal);
-                if (!isNaN(newVal)) {
+                this.date = newVal;
-                    this.date = newVal;
-                    this.handleChange({
-                        hours: newVal.getHours(),
-                        minutes: newVal.getMinutes(),
-                        seconds: newVal.getSeconds()
-                    }, false);
-                }
             }
         },
         methods: {
-            handleClear() {
-                this.date = initTimeDate();
-                this.hours = '';
-                this.minutes = '';
-                this.seconds = '';
-            },
             handleChange (date, emit = true) {
-                if (date.hours !== undefined) {
+
-                    this.date.setHours(date.hours);
+                const newDate = new Date(this.date);
-                    this.hours = this.date.getHours();
+                Object.keys(date).forEach(
-                }
+                    type => newDate[`set${capitalize(type)}`](date[type])
-                if (date.minutes !== undefined) {
+                );
-                    this.date.setMinutes(date.minutes);
+
-                    this.minutes = this.date.getMinutes();
+                if (emit) this.$emit('on-pick', newDate, true);
-                }
-                if (date.seconds !== undefined) {
-                    this.date.setSeconds(date.seconds);
-                    this.seconds = this.date.getSeconds();
-                }
-                if (emit) this.$emit('on-pick', this.date, true);
             },
-            updateScroll () {
-                this.$refs.timeSpinner.updateScroll();
-            }
         },
         mounted () {
             if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;

src/components/date-picker/panel/panel-mixin.js

@@ -15,13 +15,32 @@ export default {
             if (shortcut.onClick) shortcut.onClick(this);
         },
         handlePickClear () {
+            this.resetView();
             this.$emit('on-pick-clear');
         },
         handlePickSuccess () {
+            this.resetView();
             this.$emit('on-pick-success');
         },
         handlePickClick () {
             this.$emit('on-pick-click');
-        }
+        },
+        resetView(){
+            setTimeout(
+                () => this.currentView = this.selectionMode,
+                500 // 500ms so the dropdown can close before changing
+            );
+        },
+        handleClear() {
+            this.dates = this.dates.map(() => null);
+            this.rangeState = {};
+            this.$emit('on-pick', this.dates);
+            this.handleConfirm();
+            //  if (this.showTime) this.$refs.timePicker.handleClear();
+        },
+        handleConfirm(visible) {
+            this.$emit('on-pick', this.dates, visible);
+        },
+
     }
 };

src/components/date-picker/panel/time-range.vue

@@ -1,214 +0,0 @@
-<template>
-    <div :class="classes" @mousedown.prevent>
-        <div :class="[prefixCls + '-body']">
-            <div :class="[prefixCls + '-content', prefixCls + '-content-left']">
-                <div :class="[timePrefixCls + '-header']">
-                    <template v-if="showDate">{{ leftDatePanelLabel }}</template>
-                    <template v-else>{{ t('i.datepicker.startTime') }}</template>
-                </div>
-                <time-spinner
-                    ref="timeSpinner"
-                    :steps="steps"
-                    :show-seconds="showSeconds"
-                    :hours="hours"
-                    :minutes="minutes"
-                    :seconds="seconds"
-                    :disabled-hours="disabledHours"
-                    :disabled-minutes="disabledMinutes"
-                    :disabled-seconds="disabledSeconds"
-                    :hide-disabled-options="hideDisabledOptions"
-                    @on-change="handleStartChange"
-                    @on-pick-click="handlePickClick"></time-spinner>
-            </div>
-            <div :class="[prefixCls + '-content', prefixCls + '-content-right']">
-                <div :class="[timePrefixCls + '-header']">
-                    <template v-if="showDate">{{ rightDatePanelLabel }}</template>
-                    <template v-else>{{ t('i.datepicker.endTime') }}</template>
-                </div>
-                <time-spinner
-                    ref="timeSpinnerEnd"
-                    :steps="steps"
-                    :show-seconds="showSeconds"
-                    :hours="hoursEnd"
-                    :minutes="minutesEnd"
-                    :seconds="secondsEnd"
-                    :disabled-hours="disabledHours"
-                    :disabled-minutes="disabledMinutes"
-                    :disabled-seconds="disabledSeconds"
-                    :hide-disabled-options="hideDisabledOptions"
-                    @on-change="handleEndChange"
-                    @on-pick-click="handlePickClick"></time-spinner>
-            </div>
-            <Confirm
-                v-if="confirm"
-                @on-pick-clear="handlePickClear"
-                @on-pick-success="handlePickSuccess"></Confirm>
-        </div>
-    </div>
-</template>
-<script>
-    import TimeSpinner from '../base/time-spinner.vue';
-    import Confirm from '../base/confirm.vue';
-
-    import Mixin from './mixin';
-    import Locale from '../../../mixins/locale';
-
-    import { initTimeDate, toDate, formatDate, formatDateLabels } from '../util';
-
-    const prefixCls = 'ivu-picker-panel';
-    const timePrefixCls = 'ivu-time-picker';
-
-    export default {
-        name: 'TimePicker',
-        mixins: [ Mixin, Locale ],
-        components: { TimeSpinner, Confirm },
-        props: {
-            steps: {
-                type: Array,
-                default: () => []
-            }
-        },
-        data () {
-            return {
-                prefixCls: prefixCls,
-                timePrefixCls: timePrefixCls,
-                format: 'HH:mm:ss',
-                showDate: false,
-                date: initTimeDate(),
-                dateEnd: initTimeDate(),
-                value: '',
-                hours: '',
-                minutes: '',
-                seconds: '',
-                hoursEnd: '',
-                minutesEnd: '',
-                secondsEnd: '',
-                disabledHours: [],
-                disabledMinutes: [],
-                disabledSeconds: [],
-                hideDisabledOptions: false,
-                confirm: false
-            };
-        },
-        computed: {
-            classes () {
-                return [
-                    `${prefixCls}-body-wrapper`,
-                    `${timePrefixCls}-with-range`,
-                    {
-                        [`${timePrefixCls}-with-seconds`]: this.showSeconds
-                    }
-                ];
-            },
-            showSeconds () {
-                return (this.format || '').indexOf('ss') !== -1;
-            },
-            leftDatePanelLabel () {
-                return this.panelLabelConfig(this.date);
-            },
-            rightDatePanelLabel () {
-                return this.panelLabelConfig(this.dateEnd);
-            }
-        },
-        watch: {
-            value (newVal) {
-                if (!newVal) return;
-                if (Array.isArray(newVal)) {
-                    const valStart = newVal[0] ? toDate(newVal[0]) : false;
-                    const valEnd = newVal[1] ? toDate(newVal[1]) : false;
-
-                    if (valStart && valEnd) {
-                        this.handleChange(
-                            {
-                                hours: valStart.getHours(),
-                                minutes: valStart.getMinutes(),
-                                seconds: valStart.getSeconds()
-                            },
-                            {
-                                hours: valEnd.getHours(),
-                                minutes: valEnd.getMinutes(),
-                                seconds: valEnd.getSeconds()
-                            },
-                            false
-                        );
-                    }
-                }
-            }
-        },
-        methods: {
-            panelLabelConfig (date) {
-                const locale = this.t('i.locale');
-                const datePanelLabel = this.t('i.datepicker.datePanelLabel');
-                const { labels, separator } = formatDateLabels(locale, datePanelLabel, date || initTimeDate());
-                return [labels[0].label, separator, labels[1].label].join('');
-            },
-            handleClear() {
-                this.date = initTimeDate();
-                this.dateEnd = initTimeDate();
-                this.hours = '';
-                this.minutes = '';
-                this.seconds = '';
-                this.hoursEnd = '';
-                this.minutesEnd = '';
-                this.secondsEnd = '';
-            },
-            handleChange (date, dateEnd, emit = true) {
-                const oldDateEnd = new Date(this.dateEnd);
-
-                if (date.hours !== undefined) {
-                    this.date.setHours(date.hours);
-                    this.hours = this.date.getHours();
-                }
-                if (date.minutes !== undefined) {
-                    this.date.setMinutes(date.minutes);
-                    this.minutes = this.date.getMinutes();
-                }
-                if (date.seconds !== undefined) {
-                    this.date.setSeconds(date.seconds);
-                    this.seconds = this.date.getSeconds();
-                }
-                if (dateEnd.hours !== undefined) {
-                    this.dateEnd.setHours(dateEnd.hours);
-                    this.hoursEnd = this.dateEnd.getHours();
-                }
-                if (dateEnd.minutes !== undefined) {
-                    this.dateEnd.setMinutes(dateEnd.minutes);
-                    this.minutesEnd = this.dateEnd.getMinutes();
-                }
-                if (dateEnd.seconds !== undefined) {
-                    this.dateEnd.setSeconds(dateEnd.seconds);
-                    this.secondsEnd = this.dateEnd.getSeconds();
-                }
-                // judge endTime > startTime?
-                if (this.dateEnd < this.date) {
-                    this.$nextTick(() => {
-                        this.dateEnd = new Date(this.date);
-                        this.hoursEnd = this.dateEnd.getHours();
-                        this.minutesEnd = this.dateEnd.getMinutes();
-                        this.secondsEnd = this.dateEnd.getSeconds();
-
-                        const format = 'yyyy-MM-dd HH:mm:ss';
-                        if (formatDate(oldDateEnd, format) !== formatDate(this.dateEnd, format)) {
-                            if (emit) this.$emit('on-pick', [this.date, this.dateEnd], true);
-                        }
-                    });
-                } else {
-                    if (emit) this.$emit('on-pick', [this.date, this.dateEnd], true);
-                }
-            },
-            handleStartChange (date) {
-                this.handleChange(date, {});
-            },
-            handleEndChange (date) {
-                this.handleChange({}, date);
-            },
-            updateScroll () {
-                this.$refs.timeSpinner.updateScroll();
-                this.$refs.timeSpinnerEnd.updateScroll();
-            }
-        },
-        mounted () {
-            if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
-        }
-    };
-</script>