test/element
1
0
Fork 0
mirror of https://gitee.com/ElemeFE/element.git synced 2024-12-02 12:18:46 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

InputNumber, DatePicker: Clearify the logic of increase and decrease. Fix date-picker.spec.js bugs. (#2145)

Browse Source 
* InputNumber: clearify the logic of increase and decrease.

* DatePicker: Fix test specs
This commit is contained in:
Cyril Su 2017-01-03 12:23:01 +08:00 committed by cinwell.li
parent 23423e39e7
commit f93a163f40
2 changed files with 85 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
packages/input-number/src/input-number.vue
View File

@ -27,6 +27,8 @@
@blur="handleBlur"
:disabled="disabled"
:size="size"
:max="max"
:min="min"
ref="input"
>
<template slot="prepend" v-if="$slots.prepend">
@ -49,8 +51,7 @@
bind(el, binding, vnode) {
let interval = null;
let startTime;
const handler = () => vnode.context[binding.expression]();
const handler = () => vnode.context[binding.expression].apply();
const clear = () => {
if (new Date() - startTime < 100) {
handler();
@ -81,7 +82,7 @@
},
min: {
type: Number,
default: 0
default: -Infinity
},
value: {
default: 0
@ -104,6 +105,7 @@
this.$emit('input', this.max);
value = this.max;
}
return {
currentValue: value
};
@ -124,69 +126,57 @@
},
computed: {
minDisabled() {
return this.accSub(this.value, this.step) < this.min;
return this._decrease(this.value, this.step) < this.min;
},
maxDisabled() {
return this.accAdd(this.value, this.step) > this.max;
return this._increase(this.value, this.step) > this.max;
},
precision() {
const { value, step, getPrecision } = this;
return Math.max(getPrecision(value), getPrecision(step));
}
},
methods: {
accSub(arg1, arg2) {
var r1, r2, m, n;
try {
r1 = arg1.toString().split('.')[1].length;
} catch (e) {
r1 = 0;
}
try {
r2 = arg2.toString().split('.')[1].length;
} catch (e) {
r2 = 0;
}
m = Math.pow(10, Math.max(r1, r2));
n = (r1 >= r2) ? r1 : r2;
return parseFloat(((arg1 * m - arg2 * m) / m).toFixed(n));
toPrecision(num, precision) {
if (precision === undefined) precision = this.precision;
return parseFloat(parseFloat(Number(num).toFixed(precision)));
},
accAdd(arg1, arg2) {
var r1, r2, m, c;
try {
r1 = arg1.toString().split('.')[1].length;
} catch (e) {
r1 = 0;
getPrecision(value) {
const valueString = value.toString();
const dotPosition = valueString.indexOf('.');
let precision = 0;
if (dotPosition !== -1) {
precision = valueString.length - dotPosition - 1;
}
try {
r2 = arg2.toString().split('.')[1].length;
} catch (e) {
r2 = 0;
}
c = Math.abs(r1 - r2);
m = Math.pow(10, Math.max(r1, r2));
if (c > 0) {
var cm = Math.pow(10, c);
if (r1 > r2) {
arg1 = Number(arg1.toString().replace('.', ''));
arg2 = Number(arg2.toString().replace('.', '')) * cm;
} else {
arg1 = Number(arg1.toString().replace('.', '')) * cm;
arg2 = Number(arg2.toString().replace('.', ''));
}
} else {
arg1 = Number(arg1.toString().replace('.', ''));
arg2 = Number(arg2.toString().replace('.', ''));
}
return (arg1 + arg2) / m;
return precision;
},
_increase(val, step) {
if (typeof val !== 'number') return this.currentValue;
const precisionFactor = Math.pow(10, this.precision);
return this.toPrecision((precisionFactor * val + precisionFactor * step) / precisionFactor);
},
_decrease(val, step) {
if (typeof val !== 'number') return this.currentValue;
const precisionFactor = Math.pow(10, this.precision);
return this.toPrecision((precisionFactor * val - precisionFactor * step) / precisionFactor);
},
increase() {
if (this.maxDisabled) return;
if (this.disabled || this.maxDisabled) return;
const value = this.value || 0;
if (this.accAdd(value, this.step) > this.max || this.disabled) return;
this.currentValue = this.accAdd(value, this.step);
const newVal = this._increase(value, this.step);
if (newVal > this.max) return;
this.currentValue = newVal;
},
decrease() {
if (this.minDisabled) return;
if (this.disabled || this.minDisabled) return;
const value = this.value || 0;
if (this.accSub(value, this.step) < this.min || this.disabled) return;
this.currentValue = this.accSub(value, this.step);
const newVal = this._decrease(value, this.step);
if (newVal < this.min) return;
this.currentValue = newVal;
},
handleBlur() {
this.$refs.input.setCurrentValue(this.currentValue);

62
test/unit/specs/date-picker.spec.js
View File

@ -1,4 +1,9 @@
import { createTest, createVue, destroyVM, triggerEvent } from '../util';
import {
createTest,
createVue,
destroyVM,
triggerEvent
} from '../util';
import DatePicker from 'packages/date-picker';
const DELAY = 10;
@ -27,7 +32,9 @@ describe('DatePicker', () => {
<el-date-picker ref="compo" v-model="value"></el-date-picker>
`,
data() {
return { value: '' };
return {
value: ''
};
}
}, true);
const input = vm.$el.querySelector('input');
@ -50,13 +57,13 @@ describe('DatePicker', () => {
arrowLeftElm.click();
}
count = 18;
count = 20;
while (--count) {
arrowRightElm.click();
}
setTimeout(_ => {
expect(spans[0].textContent).to.include(date.getFullYear() - 1);
expect(spans[1].textContent).to.include(date.getMonth() - 1);
expect(spans[1].textContent).to.include(date.getMonth() + 1);
$el.querySelector('td.available').click();
vm.$nextTick(_ => {
expect(vm.value).to.exist;
@ -72,7 +79,9 @@ describe('DatePicker', () => {
<el-date-picker v-model="value" ref="compo"></el-date-picker>
`,
data() {
return { value: '' };
return {
value: ''
};
}
}, true);
const input = vm.$el.querySelector('input');
@ -97,7 +106,9 @@ describe('DatePicker', () => {
<el-date-picker v-model="value" ref="compo" :clearable="false"></el-date-picker>
`,
data() {
return { value: '' };
return {
value: ''
};
}
}, true);
const input = vm.$el.querySelector('input');
@ -122,7 +133,9 @@ describe('DatePicker', () => {
<el-date-picker ref="compo" v-model="value"></el-date-picker>
`,
data() {
return { value: '' };
return {
value: ''
};
}
}, true);
const input = vm.$el.querySelector('input');
@ -163,7 +176,9 @@ describe('DatePicker', () => {
},
data() {
return { value: '' };
return {
value: ''
};
}
}, true);
@ -178,8 +193,10 @@ describe('DatePicker', () => {
picker.$el.querySelector('td.available').click();
vm.$nextTick(_ => {
const date = picker.date;
let month = date.getMonth() + 1;
if (month < 10) month = '0' + month;
expect(inputValue).to.equal(`${date.getFullYear()}-${date.getMonth() + 1 }`);
expect(inputValue).to.equal(`${date.getFullYear()}-${ month }`);
done();
});
}, DELAY);
@ -442,7 +459,10 @@ describe('DatePicker', () => {
setTimeout(_ => {
panels[1].querySelector('td.available').click();
const { minDate, maxDate } = vm.picker;
const {
minDate,
maxDate
} = vm.picker;
expect(minDate).to.exist;
expect(maxDate).to.exist;
expect(maxDate > minDate).to.true;
@ -534,7 +554,10 @@ describe('DatePicker', () => {
triggerEvent(rightCell, 'click', true);
setTimeout(_ => {
const { minDate, maxDate } = vm.picker;
const {
minDate,
maxDate
} = vm.picker;
const minMonth = minDate.getMonth();
const maxMonth = maxDate.getMonth();
@ -698,9 +721,10 @@ describe('DatePicker', () => {
const prevMonthLen = vm.picker.$el.querySelectorAll('.prev-month').length;
const firstWeek = vm.picker.$el.querySelector('tr th');
const offset = i > 3 ? 7 - i : -i;
const day = FirstDayOfCurrentMonth === 0 ? 7 : FirstDayOfCurrentMonth;
expect(firstWeek.innerText).to.equal(chineseWeek[i - 1]);
expect(prevMonthLen - FirstDayOfCurrentMonth).to.equal(offset);
expect(prevMonthLen - day).to.equal(offset);
done();
});
});
@ -712,15 +736,13 @@ describe('DatePicker', () => {
let test;
vm = createTest(DatePicker, {
pickerOptions: {
shortcuts: [
{
text: '今天',
onClick(picker) {
test = true;
picker.$emit('pick', new Date());
}
shortcuts: [{
text: '今天',
onClick(picker) {
test = true;
picker.$emit('pick', new Date());
}
]
}]
}
}, true);
const input = vm.$el.querySelector('input');