Picker only emit user change (#6214)

* only emit user change for timepicker and datepicker

* Test: remove custom timeout
This commit is contained in:
Dreamacro 2017-09-20 14:34:49 +08:00 committed by 杨奕
parent b922664aa6
commit 1912c473ef
9 changed files with 43 additions and 41 deletions

View File

@ -215,7 +215,7 @@
this.$emit('pick', {
minDate: this.minDate,
maxDate: this.maxDate
});
}, true, false);
}
}
},

View File

@ -88,11 +88,11 @@
},
nextTenYear() {
this.$emit('pick', Number(this.year) + 10, false);
this.$emit('pick', Number(this.year) + 10, false, true);
},
prevTenYear() {
this.$emit('pick', Number(this.year) - 10, false);
this.$emit('pick', Number(this.year) - 10, false, true);
},
handleYearTableClick(event) {
@ -100,7 +100,7 @@
if (target.tagName === 'A') {
if (hasClass(target.parentNode, 'disabled')) return;
const year = target.textContent || target.innerText;
this.$emit('pick', Number(year));
this.$emit('pick', Number(year), true, true);
}
}
}

View File

@ -308,7 +308,7 @@
this.minDate = newVal[0] ? toDate(newVal[0]) : null;
this.maxDate = newVal[1] ? toDate(newVal[1]) : null;
if (this.minDate) this.date = new Date(this.minDate);
this.handleConfirm(true);
this.handleConfirm(true, false);
}
}
},
@ -392,7 +392,7 @@
}
},
handleRangePick(val, close = true) {
handleRangePick(val, close = true, user = true) {
if (this.maxDate === val.maxDate && this.minDate === val.minDate) {
return;
}
@ -400,7 +400,7 @@
this.maxDate = val.maxDate;
this.minDate = val.minDate;
if (!close || this.showTime) return;
this.handleConfirm();
this.handleConfirm(false, user);
},
changeToToday() {
@ -477,9 +477,9 @@
this.resetDate();
},
handleConfirm(visible = false) {
handleConfirm(visible = false, user = true) {
if (this.minDate && this.maxDate) {
this.$emit('pick', [this.minDate, this.maxDate], visible);
this.$emit('pick', [this.minDate, this.maxDate], visible, user);
}
},

View File

@ -161,7 +161,7 @@
this.date = newVal;
this.year = newVal.getFullYear();
this.month = newVal.getMonth();
this.$emit('pick', newVal, false);
this.$emit('pick', newVal, false, false);
}
},
@ -190,7 +190,7 @@
methods: {
handleClear() {
this.date = this.$options.defaultValue ? new Date(this.$options.defaultValue) : new Date();
this.$emit('pick');
this.$emit('pick', this.date);
},
resetDate() {
@ -256,7 +256,7 @@
}
},
handleTimePick(picker, visible, first) {
handleTimePick(picker, visible) {
if (picker) {
let oldDate = new Date(this.date.getTime());
let hour = picker.getHours();
@ -273,9 +273,7 @@
this.date = new Date(oldDate.getTime());
}
if (!first) {
this.timePickerVisible = visible;
}
this.timePickerVisible = visible;
},
handleMonthPick(month) {
@ -294,28 +292,28 @@
}
},
handleDatePick(value) {
handleDatePick(value, close, user = true) {
if (this.selectionMode === 'day') {
if (!this.showTime) {
this.$emit('pick', new Date(value.getTime()));
this.$emit('pick', new Date(value.getTime()), false, user);
}
this.date.setFullYear(value.getFullYear());
this.date.setMonth(value.getMonth(), value.getDate());
} else if (this.selectionMode === 'week') {
this.week = value.week;
this.$emit('pick', value.date);
this.$emit('pick', value.date, false, user);
}
this.resetDate();
},
handleYearPick(year, close = true) {
handleYearPick(year, close = true, user) {
this.year = year;
if (!close) return;
this.date.setFullYear(year);
if (this.selectionMode === 'year') {
this.$emit('pick', new Date(year, 0, 1));
this.$emit('pick', new Date(year, 0, 1), false, user);
} else {
this.currentView = 'month';
}
@ -330,6 +328,7 @@
},
confirm() {
console.log(111);
this.date.setMilliseconds(0);
this.$emit('pick', this.date);
},

View File

@ -147,12 +147,12 @@
hours: time.minTime.getHours(),
minutes: time.minTime.getMinutes(),
seconds: time.minTime.getSeconds()
});
}, true);
this.handleMaxChange({
hours: time.maxTime.getHours(),
minutes: time.maxTime.getMinutes(),
seconds: time.maxTime.getSeconds()
});
}, true);
},
handleClear() {
@ -163,7 +163,7 @@
this.$emit('pick');
},
handleChange() {
handleChange(notUser) {
if (this.minTime > this.maxTime) return;
MIN_TIME.setFullYear(this.minTime.getFullYear());
MIN_TIME.setMonth(this.minTime.getMonth(), this.minTime.getDate());
@ -171,10 +171,10 @@
MAX_TIME.setMonth(this.maxTime.getMonth(), this.maxTime.getDate());
this.$refs.minSpinner.selectableRange = [[MIN_TIME, this.maxTime]];
this.$refs.maxSpinner.selectableRange = [[this.minTime, MAX_TIME]];
this.handleConfirm(true);
this.handleConfirm(true, false, notUser);
},
handleMaxChange(date) {
handleMaxChange(date, notUser) {
if (date.hours !== undefined) {
this.maxTime.setHours(date.hours);
this.maxHours = this.maxTime.getHours();
@ -190,7 +190,7 @@
this.handleChange();
},
handleMinChange(date) {
handleMinChange(date, notUser) {
if (date.hours !== undefined) {
this.minTime.setHours(date.hours);
this.minHours = this.minTime.getHours();
@ -217,7 +217,7 @@
this.selectionRange = [start + this.offset, end + this.offset];
},
handleConfirm(visible = false, first = false) {
handleConfirm(visible = false, first = false, notUser = false) {
const minSelectableRange = this.$refs.minSpinner.selectableRange;
const maxSelectableRange = this.$refs.maxSpinner.selectableRange;
@ -225,7 +225,7 @@
this.maxTime = limitRange(this.maxTime, maxSelectableRange);
if (first) return;
this.$emit('pick', [this.minTime, this.maxTime], visible, first);
this.$emit('pick', [this.minTime, this.maxTime], visible, !notUser);
},
adjustScrollTop() {

View File

@ -79,9 +79,9 @@
value(val) {
if (!val) return;
if (this.minTime && compareTime(val, this.minTime) < 0) {
this.$emit('pick');
this.$emit('pick', '', false, false);
} else if (this.maxTime && compareTime(val, this.maxTime) > 0) {
this.$emit('pick');
this.$emit('pick', '', false, false);
}
this.$nextTick(() => this.scrollToOption());
}
@ -95,7 +95,7 @@
},
handleClear() {
this.$emit('pick');
this.$emit('pick', '', false, false);
},
scrollToOption(className = 'selected') {
@ -122,6 +122,7 @@
}
if (!items[index].disabled) {
this.value = items[index].value;
this.$emit('pick', this.value, true);
}
}
},

View File

@ -79,7 +79,7 @@
hours: date.getHours(),
minutes: date.getMinutes(),
seconds: date.getSeconds()
});
}, true);
this.$nextTick(_ => this.adjustScrollTop());
},
@ -121,7 +121,7 @@
methods: {
handleClear() {
this.$emit('pick');
this.$emit('pick', '', false, true);
},
handleCancel() {
@ -132,10 +132,10 @@
this.minutes = this.currentDate.getMinutes();
this.seconds = this.currentDate.getSeconds();
const date = new Date(limitRange(this.currentDate, this.selectableRange, 'HH:mm:ss'));
this.$emit('pick', date);
this.$emit('pick', date, false, true);
},
handleChange(date) {
handleChange(date, notUser) {
if (date.hours !== undefined) {
this.currentDate.setHours(date.hours);
this.hours = this.currentDate.getHours();
@ -148,8 +148,7 @@
this.currentDate.setSeconds(date.seconds);
this.seconds = this.currentDate.getSeconds();
}
this.handleConfirm(true);
this.handleConfirm(true, null, notUser);
},
setSelectionRange(start, end) {
@ -157,10 +156,10 @@
this.selectionRange = [start, end];
},
handleConfirm(visible = false, first) {
handleConfirm(visible = false, first, notUser = false) {
if (first) return;
const date = new Date(limitRange(this.currentDate, this.selectableRange, 'HH:mm:ss'));
this.$emit('pick', date, visible, first);
this.$emit('pick', date, visible, !notUser);
},
adjustScrollTop() {

View File

@ -267,7 +267,6 @@ export default {
}
},
displayValue(val) {
this.$emit('change', val);
this.dispatch('ElFormItem', 'el.form.change');
}
},
@ -492,10 +491,13 @@ export default {
this.picker.resetView && this.picker.resetView();
this.picker.$on('dodestroy', this.doDestroy);
this.picker.$on('pick', (date = '', visible = false) => {
this.picker.$on('pick', (date = '', visible = false, user = true) => {
// do not emit if values are same
if (!valueEquals(this.value, date)) {
this.$emit('input', date);
if (user && this.value !== date) {
this.$nextTick(() => this.$emit('change', this.displayValue));
};
}
this.pickerVisible = this.picker.visible = visible;
this.picker.resetView && this.picker.resetView();

View File

@ -45,6 +45,7 @@ export default {
if (keyCode === 9 || keyCode === 27 || keyCode === 13) {
this.pickerVisible = false;
event.stopPropagation();
this.picker.confirm();
this.currentValue = this.picker.date;
this.$refs.reference.$refs.input.blur();
return;