Commit 6c1994c66255e069cd3908124110d9d7deb4c743

Authored by Aresn
Committed by GitHub
2 parents 58cd4675 030a522d

Merge pull request #1931 from SergioCrisostomo/fix-datepicker-blur

make picker close on blur
src/components/date-picker/panel/date-range.vue
1 1 <template>
2   - <div :class="classes">
  2 + <div :class="classes" @mousedown.prevent>
3 3 <div :class="[prefixCls + '-sidebar']" v-if="shortcuts.length">
4 4 <div
5 5 :class="[prefixCls + '-shortcut']"
... ...
src/components/date-picker/panel/date.vue
1 1 <template>
2   - <div :class="classes">
  2 + <div :class="classes" @mousedown.prevent>
3 3 <div :class="[prefixCls + '-sidebar']" v-if="shortcuts.length">
4 4 <div
5 5 :class="[prefixCls + '-shortcut']"
... ...
src/components/date-picker/panel/time-range.vue
1 1 <template>
2   - <div :class="classes">
  2 + <div :class="classes" @mousedown.prevent>
3 3 <div :class="[prefixCls + '-body']">
4 4 <div :class="[prefixCls + '-content', prefixCls + '-content-left']">
5 5 <div :class="[timePrefixCls + '-header']">
... ... @@ -205,4 +205,4 @@
205 205 if (this.$parent && this.$parent.$options.name === 'DatePicker') this.showDate = true;
206 206 }
207 207 };
208   -</script>
209 208 \ No newline at end of file
  209 +</script>
... ...
src/components/date-picker/panel/time.vue
1 1 <template>
2   - <div :class="[prefixCls + '-body-wrapper']">
  2 + <div :class="[prefixCls + '-body-wrapper']" @mousedown.prevent>
3 3 <div :class="[prefixCls + '-body']">
4 4 <div :class="[timePrefixCls + '-header']" v-if="showDate">{{ visibleDate }}</div>
5 5 <div :class="[prefixCls + '-content']">
... ...
src/components/date-picker/picker.vue
... ... @@ -12,6 +12,7 @@
12 12 :name="name"
13 13 @on-input-change="handleInputChange"
14 14 @on-focus="handleFocus"
  15 + @on-blur="handleBlur"
15 16 @on-click="handleIconClick"
16 17 @mouseenter.native="handleInputMouseenter"
17 18 @mouseleave.native="handleInputMouseleave"
... ... @@ -290,6 +291,9 @@
290 291 if (this.readonly) return;
291 292 this.visible = true;
292 293 },
  294 + handleBlur () {
  295 + this.visible = false;
  296 + },
293 297 handleInputChange (event) {
294 298 const oldValue = this.visualValue;
295 299 const value = event.target.value;
... ... @@ -478,6 +482,9 @@
478 482 if (this.picker) this.picker.resetView && this.picker.resetView(true);
479 483 this.$refs.drop.destroy();
480 484 if (this.open === null) this.$emit('on-open-change', false);
  485 + // blur the input
  486 + const input = this.$el.querySelector('input');
  487 + if (input) input.blur();
481 488 }
482 489 },
483 490 internalValue(val) {
... ...