Select: update scroll bar position

pull/8473/head
Leopoldthecoder 2017-11-23 18:11:28 +08:00 committed by 杨奕
parent 9cfdc433c3
commit 6a99f03e1f
4 changed files with 28 additions and 61 deletions

View File

@ -210,34 +210,27 @@ export default {
this.oldValue = event.target.value; this.oldValue = event.target.value;
}, },
handleBlur({ target }) { handleBlur({ target }) {
this.reassignMaxValue(target); this.resetValueIfNeed(target.value);
}, this.reassignMaxValue(target.value);
handleKeyUp(event) {
const key = event.key || '';
const keyCode = event.keyCode || '';
if ((key && key === 'Enter') || (keyCode && keyCode === 13)) {
this.reassignMaxValue(event.target);
this.handleChange(event.target.value);
}
}, },
handleChange(value) { handleChange(value) {
this.$parent.internalCurrentPage = this.$parent.getValidCurrentPage(value); this.$parent.internalCurrentPage = this.$parent.getValidCurrentPage(value);
this.oldValue = null; this.oldValue = null;
this.resetValueIfNeed(target); this.resetValueIfNeed(value);
}, },
resetValueIfNeed(target) { resetValueIfNeed(value) {
const num = parseInt(target.value, 10); const num = parseInt(value, 10);
if (!isNaN(num)) { if (!isNaN(num)) {
if (num < 1) { if (num < 1) {
target.value = 1; this.$refs.input.$el.querySelector('input').value = 1;
} else { } else {
this.reassignMaxValue(target); this.reassignMaxValue(value);
} }
} }
}, },
reassignMaxValue(target) { reassignMaxValue(value) {
if (+target.value > this.$parent.internalPageCount) { if (+value > this.$parent.internalPageCount) {
target.value = this.$parent.internalPageCount; this.$refs.input.$el.querySelector('input').value = this.$parent.internalPageCount;
} }
} }
}, },
@ -253,10 +246,10 @@ export default {
value={ this.$parent.internalCurrentPage } value={ this.$parent.internalCurrentPage }
domPropsValue={ this.$parent.internalCurrentPage } domPropsValue={ this.$parent.internalCurrentPage }
type="number" type="number"
ref="input"
onChange={ this.handleChange } onChange={ this.handleChange }
onFocus={ this.handleFocus } onFocus={ this.handleFocus }
onBlur={ this.handleBlur } onBlur={ this.handleBlur }/>
nativeOnKeyup={ this.handleKeyUp }/>
{ this.t('el.pagination.pageClassifier') } { this.t('el.pagination.pageClassifier') }
</span> </span>
); );

View File

@ -90,6 +90,7 @@
tag="ul" tag="ul"
wrap-class="el-select-dropdown__wrap" wrap-class="el-select-dropdown__wrap"
view-class="el-select-dropdown__list" view-class="el-select-dropdown__list"
ref="scrollbar"
:class="{ 'is-empty': !allowCreate && query && filteredOptionsCount === 0 }" :class="{ 'is-empty': !allowCreate && query && filteredOptionsCount === 0 }"
v-show="options.length > 0 && !loading"> v-show="options.length > 0 && !loading">
<el-option <el-option
@ -417,6 +418,7 @@
const menu = this.$refs.popper.$el.querySelector('.el-select-dropdown__wrap'); const menu = this.$refs.popper.$el.querySelector('.el-select-dropdown__wrap');
scrollIntoView(menu, target); scrollIntoView(menu, target);
} }
this.$refs.scrollbar && this.$refs.scrollbar.handleScroll();
}, },
handleMenuEnter() { handleMenuEnter() {

View File

@ -142,7 +142,7 @@
@include button-size($--button-mini-padding-vertical, $--button-mini-padding-horizontal, $--button-mini-font-size, $--button-mini-border-radius); @include button-size($--button-mini-padding-vertical, $--button-mini-padding-horizontal, $--button-mini-font-size, $--button-mini-border-radius);
} }
@include m(text) { @include m(text) {
border: none; border-color: transparent;
color: $--color-primary; color: $--color-primary;
background: transparent; background: transparent;
padding-left: 0; padding-left: 0;

View File

@ -223,55 +223,27 @@ describe('Pagination', () => {
}; };
changeValue(1); changeValue(1);
setTimeout(() => { setTimeout(() => {
expect(vm.page).to.equal(1); expect(input.value).to.equal(1);
expect(input.value).to.equal('1');
changeValue(10000);
setTimeout(() => {
expect(vm.page).to.equal(10);
changeValue('我好帅');
setTimeout(() => {
expect(vm.page).to.equal(1);
expect(input.value).to.equal('1');
// min-max // min-max
input.value = 0; changeValue(0);
triggerEvent(input, 'change'); setTimeout(() => {
setTimeout(()=>{ expect(input.value).to.equal(1);
expect(vm.page).to.equal(1); changeValue(0);
expect(input.value).to.equal('1'); setTimeout(() => {
expect(input.value).to.equal(1);
input.value = 0; changeValue(1000);
triggerEvent(input, 'change'); setTimeout(() => {
setTimeout(()=>{ expect(input.value).to.equal(10);
expect(vm.page).to.equal(1); changeValue(1000);
expect(input.value).to.equal('1'); setTimeout(() => {
expect(input.value).to.equal(10);
input.value = 1000;
triggerEvent(input, 'change');
setTimeout(()=>{
expect(vm.page).to.equal(10);
expect(input.value).to.equal('10');
input.value = 1000;
triggerEvent(input, 'change');
setTimeout(()=>{
expect(vm.page).to.equal(10);
expect(input.value).to.equal('10');
done(); done();
}, 50); }, 50);
}, 50); }, 50);
}, 50); }, 50);
}, 50); }, 50);
}, 50); }, 50);
}, 50);
}, 50);
}); });
it('event:current-change', (done) => { it('event:current-change', (done) => {