drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #3207 from huanghong1125/2.0

Browse source 
Table fixed columns support mouse scroll
This commit is contained in:
Aresn 2018-03-22 10:33:03 +08:00 • committed by GitHub
commit dac3df9242
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 153 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

39
src/components/table/table.vue
View file

@ -47,7 +47,7 @@
:columns-width="columnsWidth"
:data="rebuildData"></table-head>
</div>
<div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" ref="fixedBody">
<div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" ref="fixedBody" @mousewheel="handleFixedMousewheel" @DOMMouseScroll="handleFixedMousewheel">
<table-body
fixed="left"
:prefix-cls="prefixCls"
@ -69,7 +69,7 @@
:columns-width="columnsWidth"
:data="rebuildData"></table-head>
</div>
<div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" ref="fixedRightBody">
<div :class="[prefixCls + '-fixed-body']" :style="fixedBodyStyle" ref="fixedRightBody"@mousewheel="handleFixedMousewheel" @DOMMouseScroll="handleFixedMousewheel">
<table-body
fixed="right"
:prefix-cls="prefixCls"
@ -539,6 +539,41 @@
if (this.isRightFixed) this.$refs.fixedRightBody.scrollTop = event.target.scrollTop;
this.hideColumnFilter();
},
handleFixedMousewheel(event) {
let deltaY = event.deltaY;
if(!deltaY && event.detail){
deltaY = event.detail * 40;
}
if(!deltaY && event.wheelDeltaY){
deltaY = -event.wheelDeltaY;
}
if(!deltaY && event.wheelDelta){
deltaY = -event.wheelDelta;
}
if(!deltaY) return;
const body = this.$refs.body;
const currentScrollTop = body.scrollTop;
if (deltaY < 0 && currentScrollTop !== 0) {
event.preventDefault();
}
if (deltaY > 0 && body.scrollHeight - body.clientHeight > currentScrollTop) {
event.preventDefault();
}
//body.scrollTop += deltaY;
let step = 0;
let timeId = setInterval(()=>{
step += 5;
if(deltaY>0){
body.scrollTop += 2;
}
else{
body.scrollTop -= 2;
}
if(step >= Math.abs(deltaY)){
clearInterval(timeId);
}
}, 5);
},
handleMouseWheel (event) {
const deltaX = event.deltaX;
const $body = this.$refs.body;