table表格滚动条调整,适配问题

This commit is contained in:
liyuetong
2021-08-19 20:40:46 +08:00
committed by dwq
parent ba79069cfc
commit 8d30fbb226
2 changed files with 4 additions and 78 deletions

View File

@@ -63,7 +63,7 @@ export default {
.statisticsTable {
.position02 {
position: fixed;
top: 38px;
top: 57px;
left: 0;
width: 100%;
z-index: 9;

View File

@@ -1,6 +1,5 @@
<template>
<div class="bg" id="bg">
<!-- <div :class="[active == 'Team' ? 'pt10 pb10 position01' : 'pt10 pb10']" style="background-color: #f5f5f5"> -->
<div class="pt10 pb10 bgf5" style="background-color: #f5f5f5">
<div class="m-filterDate">
<div class="number">
@@ -24,7 +23,6 @@
</div>
</div>
</div>
<!-- <div :class="[active == 'Team' ? 'fs12 bntTab mt30 position02' : 'fs12 bntTab mt30']" class="fs12 bntTab mt30"> -->
<div class="fs12 bntTab">
<span :class="[active == 'Personal' ? 'tabLeft mr2' : 'unTabLeft mr2']" @click="tabChange('Personal')">个人数据</span>
<span :class="[active == 'Team' ? 'tabRight mr2' : 'unTabRight mr2']" @click="tabChange('Team')">团队数据</span>
@@ -167,10 +165,8 @@ export default {
}
},
data() {
let isIphone = this.$utils.device().isIphone
return {
selectFixed: false, //是否吸顶
isIphone, // 是否在ios
crownImg: crownImg, //皇冠图片
active: 'Personal', //tab 个人 团队
dateFlag: 'd', //当月 d 当天 m 标识
@@ -294,20 +290,8 @@ export default {
that.active = active
if (that.active == 'Personal') {
that.initDataPersonal()
// if (that.isIphone) {
// console.log(that.isIphone,'that.isIphone')
// document.getElementById("bg").style.position = 'static'
// // document.getElementById("bg").style.top = '0'
// // document.getElementById("bg").style.left = '0'
// }
} else {
that.initData()
// if (that.isIphone) {
// console.log(that.isIphone,'that.isIphone')
// document.getElementById("bg").style.position = 'fixed'
// document.getElementById("bg").style.top = '0'
// document.getElementById("bg").style.left = '0'
// }
}
}
},
@@ -334,12 +318,6 @@ export default {
},
// 团队数据
async initData() {
// 初始化年份筛选数据
// const currentYear = new Date().getFullYear()
// const startYear = currentYear - 10
// for (let year = startYear; year <= currentYear; year++) {
// this.years.unshift(year)
// }
/**
* 查询机构下拉列表
* manageCode, manageLv传空查全国所有二级机构
@@ -419,17 +397,6 @@ export default {
if (res.content.nextPage == 0) {
this.finished = true
}
// this.tableData = [
// {
// name: '网红',
// ysfyc: '11111',
// fyc: '111',
// ggap: '1111',
// lastglevel: '111',
// sgrp: '37438',
// lastslevel: '452434123'
// }
// ]
this.tableData = this.tableData.concat(res.content.list)
// this.tableData.push(...res.content.list)
this.loading = false
@@ -527,15 +494,12 @@ export default {
handleScroll() {
var scrollDistance = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
// let offsetTop = document.getElementsById('classification').offsetTop
console.log(scrollDistance, 'scrollDistance')
// console.log(offsetTop,'offsetTop')
if (scrollDistance >= 50) {
if (scrollDistance >= 100) {
// 触发的位置document
this.selectFixed = true
} else {
this.selectFixed = false
}
console.log(this.selectFixed, 'this.selectFixed')
}
},
created() {
@@ -742,6 +706,7 @@ export default {
left: 0;
width: 100%;
z-index: 9;
height: 35px;
}
.van-icon {
@@ -758,45 +723,6 @@ export default {
// overflow-x: auto;
box-sizing: border-box;
background: #fff;
// margin-top: 245px;
// overflow-y: scroll;
// height: 70.4vh;
// table {
// width: 180vw;
// border-collapse: collapse;
// th {
// width: 130px;
// }
// }
// table,
// th,
// td {
// border: 1px solid #999;
// text-align: center;
// font-size: 14px;
// line-height: 30px;
// background: #fff;
// }
// thead {
// th {
// height: 40px;
// line-height: 40px;
// background: #7886c8;
// color: #fff;
// }
// }
min-height: 300px;
}
// .th-fixed {
// position: sticky;
// left: 0;
// width: 200px;
// padding: 0 5px;
// }
// .td-fixed {
// position: sticky;
// width: 200px;
// padding: 0 5px;
// left: 0;
// text-decoration: underline;
// }
</style>