撤销表头吸顶

This commit is contained in:
yanran200730
2023-09-12 16:27:52 +08:00
parent 1bda9ec3ad
commit a155102c53
3 changed files with 17 additions and 56 deletions

View File

@@ -140,6 +140,8 @@ export default {
}
.ai-list__content--right-wrapper {
display: flex;
flex-direction: column;
// margin: 0 20px;
padding: 20px 20px !important;
}

View File

@@ -1,18 +1,18 @@
<template>
<div class="ai-table" :class="[isShowBorder ? 'ai-table__border' : 'ai-table__noborder']">
<el-table :data="tableData"
header-cell-class-name="ai-table__header"
cell-class-name="ai-table__cell"
row-class-name="ai-table__row"
:class="{'ai-header__border': isShowBorder}"
:ref="refName"
:size="tableSize"
:stripe="stripe"
:tooltip-effect="tooltipEffect"
@selection-change="handleSelectionChange"
v-on="$listeners"
v-bind="$attrs"
v-loading="loading">
header-cell-class-name="ai-table__header"
cell-class-name="ai-table__cell"
row-class-name="ai-table__row"
:class="{'ai-header__border': isShowBorder}"
:ref="refName"
:size="tableSize"
:stripe="stripe"
:tooltip-effect="tooltipEffect"
@selection-change="handleSelectionChange"
v-on="$listeners"
v-bind="$attrs"
v-loading="loading">
<template v-for="colConfig in colConfigs.filter(e=>!e.hide)">
<slot v-if="colConfig.slot && colConfig.slot !== 'options'" :name="colConfig.slot"/>
<component
@@ -154,14 +154,7 @@ export default {
pagerCount: this.pagerCount,
...this.pageConfig
}
},
},
mounted() { //添加监听滚动条事件
window.addEventListener('scroll', this.handleScroll, true)
},
destroyed() { //移除(跳转页面后移除)
window.removeEventListener('scroll', this.handleScroll, true)
}
},
methods: {
@@ -173,41 +166,6 @@ export default {
})
},
handleScroll() {
const top = document.querySelector('.top') ? document.querySelector('.top').clientHeight + 56 : 56
let heightTop = document.getElementsByClassName('ai-list__content--right')[0].scrollTop //距离顶部高度
if (heightTop >= top) {
document.getElementsByClassName('el-table__header-wrapper')[0].style.position = `fixed`
document.getElementsByClassName('el-table__header-wrapper')[0].style.zIndex = '10000'
document.getElementsByClassName('el-table__header-wrapper')[0].style.top = `${112}px`
document.getElementsByClassName('el-table__fixed-right')[0].style.top = `${document.querySelector('.top') ? -66 : -41}px`
for (let i = 0; i < document.querySelectorAll('.el-table__header-wrapper th div').length; i++) {
document.querySelectorAll('.el-table__header-wrapper th div')[i].style.visibility = 'inherit'
}
// for (let i = 0; i < document.querySelectorAll('.el-table__body-wrapper .is-hidden .cell').length; i++) {
// document.querySelectorAll('.el-table__body-wrapper .is-hidden .cell')[i].style.visibility = 'inherit'
// }
// document.getElementsByClassName('el-table__fixed-header-wrapper')[0].style.position = `fixed`
// document.getElementsByClassName('el-table__fixed-header-wrapper')[0].style.zIndex = '9999'
// document.getElementsByClassName('el-table__fixed-header-wrapper')[0].style.top = `${112}px`
} else {
document.getElementsByClassName('el-table__header-wrapper')[0].style.position = ''
document.getElementsByClassName('el-table__header-wrapper')[0].style.top = ''
document.getElementsByClassName('el-table__header-wrapper')[0].style.zIndex = ''
document.getElementsByClassName('el-table__fixed-right')[0].style.top = `${0}px`
for (let i = 0; i < document.querySelectorAll('.el-table__header-wrapper th div').length; i++) {
document.querySelectorAll('.el-table__header-wrapper th div')[i].style.visibility = 'visible'
}
// for (let i = 0; i < document.querySelectorAll('.el-table__body-wrapper .is-hidden .cell').length; i++) {
// document.querySelectorAll('.el-table__body-wrapper .is-hidden .cell')[i].style.visibility = 'visible'
// }
}
},
handleSizeChange(size) {
this.$emit('update:size', size)
this.$emit('update:pageConfig', {...this.pageConfig, size})

View File

@@ -82,6 +82,7 @@
<ai-table
:isShowPagination="false"
:tableData="list"
height="500"
:col-configs="colConfigs"
:total="list.length"
style="margin-top: 8px;"