mirror of https://github.com/ElemeFE/element
date-picker: fix value-format change event
parent
79dc2c5d6e
commit
55bc6f35ba
|
@ -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) {
|
||||
|
|
|
@ -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);
|
||||
|
|
Loading…
Reference in New Issue