date-picker: fix value-format change event

pull/7480/merge
wacky6.AriesMBP 2017-10-17 13:53:51 +11:00 committed by 杨奕
parent 79dc2c5d6e
commit 55bc6f35ba
2 changed files with 22 additions and 25 deletions

View File

@ -69,7 +69,7 @@
<script>
import Vue from 'vue';
import Clickoutside from 'element-ui/src/utils/clickoutside';
import { formatDate, parseDate, isDate, isDateObject, getWeekNumber } from './util';
import { formatDate, parseDate, isDateObject, getWeekNumber } from './util';
import Popper from 'element-ui/src/utils/vue-popper';
import Emitter from 'element-ui/src/mixins/emitter';
import Focus from 'element-ui/src/mixins/focus';
@ -453,20 +453,19 @@ export default {
},
// {parse, formatTo} Value deals maps component value with internal Date
// parseValue validates value according to panel, requires picker to be mounted
parseValue(value, customFormat) {
if (!value || (!Array.isArray(value) || !value.every(val => val))) {
return null;
parseValue(value) {
const isParsed = isDateObject(value) || (Array.isArray(value) && value.every(isDateObject));
if (this.valueFormat && !isParsed) {
return parseAsFormatAndType(value, this.valueFormat, this.type, this.rangeSeparator) || value;
} else {
return value;
}
const format = customFormat || this.valueFormat;
const parsedValue = parseAsFormatAndType(value, format, this.type, this.rangeSeparator);
return this.isValidValue(parsedValue) ? parsedValue : null;
},
formatToValue(date, customFormat) {
if (this.valueFormat && (isDate(date) || Array.isArray(date))) {
const format = customFormat || this.valueFormat;
return formatAsFormatAndType(date, format, this.type, this.rangeSeparator);
formatToValue(date) {
const isFormattable = isDateObject(date) || (Array.isArray(date) && date.every(isDateObject));
if (this.valueFormat && isFormattable) {
return formatAsFormatAndType(date, this.valueFormat, this.type, this.rangeSeparator);
} else {
return date;
}
@ -739,12 +738,9 @@ export default {
},
emitChange(val) {
const formatted = this.formatToValue(val);
if (!valueEquals(this.valueOnOpen, formatted)) {
this.$emit('change', formatted);
this.dispatch('ElFormItem', 'el.form.change', formatted);
this.valueOnOpen = formatted;
}
this.$emit('change', val);
this.dispatch('ElFormItem', 'el.form.change', val);
this.valueOnOpen = val;
},
emitInput(val) {

View File

@ -376,7 +376,7 @@ describe('DatePicker', () => {
ref="compo"
v-model="value"
type="date"
value-format="dd-MM-yyyy" />`,
value-format="dd/MM yyyy" />`,
data() {
return {
value: ''
@ -395,7 +395,7 @@ describe('DatePicker', () => {
const yyyy = today.getFullYear();
const MM = ('0' + (today.getMonth() + 1)).slice(-2);
const dd = '01'; // first available one should be first day of month
const expectValue = `${dd}-${MM}-${yyyy}`;
const expectValue = `${dd}/${MM} ${yyyy}`;
expect(vm.value).to.equal(expectValue);
expect(spy.calledOnce).to.be.true;
expect(spy.calledWith(expectValue)).to.be.true;
@ -443,8 +443,8 @@ describe('DatePicker', () => {
ref="compo"
v-model="value"
type="date"
value-format="dd-MM-yyyy"
format="yyyy-MM-dd" />`,
format="yyyy-MM-dd"
value-format="dd/MM yyyy" />`,
data() {
return {
value: ''
@ -458,7 +458,7 @@ describe('DatePicker', () => {
triggerEvent(input, 'input');
keyDown(input, ENTER);
setTimeout(_ => {
expect(vm.value).to.equal('01-10-2000');
expect(vm.value).to.equal('01/10 2000');
done();
}, DELAY);
}, DELAY);
@ -471,7 +471,8 @@ describe('DatePicker', () => {
ref="compo"
v-model="value"
type="daterange"
value-format="dd-MM-yyyy" />`,
format="yyyy-MM-dd"
value-format="dd/MM yyyy" />`,
data() {
return {
value: ''
@ -490,7 +491,7 @@ describe('DatePicker', () => {
triggerEvent(inputs[1], 'input');
keyDown(inputs[0], ENTER);
setTimeout(_ => {
expect(vm.value).to.eql(['01-10-2000', '02-10-2000']);
expect(vm.value).to.eql(['01/10 2000', '02/10 2000']);
done();
}, DELAY);
}, DELAY);