fix: 修复table固定列错位的问题

This commit is contained in:
CaptainB 2022-03-25 14:23:18 +08:00 committed by 刘瑞斌
parent f8b6aa07ca
commit f4ceed2771
3 changed files with 16 additions and 13 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<div v-if="tableActive"> <div>
<el-table <el-table
border border
class="test-content adjust-table ms-table" class="test-content adjust-table ms-table"
@ -164,7 +164,6 @@ export default {
selectDataCounts: 0, selectDataCounts: 0,
selectRows: new Set(), selectRows: new Set(),
selectIds: [], selectIds: [],
tableActive: true,
// hasBatchTipShow: false, // hasBatchTipShow: false,
defaultSort: {} defaultSort: {}
}; };
@ -407,7 +406,7 @@ export default {
}, },
doLayout() { doLayout() {
if (this.$refs.table) { if (this.$refs.table) {
setTimeout(this.$refs.table.doLayout(), 200); setTimeout(this.$refs.table.doLayout, 200);
} }
}, },
filter(filters) { filter(filters) {
@ -480,9 +479,8 @@ export default {
this.$refs.table.toggleRowSelection(); this.$refs.table.toggleRowSelection();
}, },
reloadTable() { reloadTable() {
this.tableActive = false;
this.$nextTick(() => { this.$nextTick(() => {
this.tableActive = true; this.doLayout();
}); });
}, },
addPaddingColClass({column}) { addPaddingColClass({column}) {
@ -552,4 +550,5 @@ export default {
.disable-hover >>> tr:hover>td{ .disable-hover >>> tr:hover>td{
background-color: #ffffff !important; background-color: #ffffff !important;
} }
</style> </style>

View File

@ -429,4 +429,9 @@ export default {
.test-content { .test-content {
width: 100%; width: 100%;
} }
/deep/ .el-table__fixed-body-wrapper {
top: 47px !important; /* 不同表格top值不一样 */
}
</style> </style>

View File

@ -357,10 +357,7 @@ export default {
}); });
}, },
initTableHeader() { initTableHeader() {
this.result.loading = true;
this.fields = getTableHeaderWithCustomFields(this.tableHeaderKey, []); this.fields = getTableHeaderWithCustomFields(this.tableHeaderKey, []);
this.result.loading = false;
setTimeout(this.$refs.table.reloadTable, 200);
}, },
customHeader() { customHeader() {
const list = deepClone(this.tableLabel); const list = deepClone(this.tableLabel);
@ -383,16 +380,14 @@ export default {
this.condition.nodeIds = this.selectNodeIds; this.condition.nodeIds = this.selectNodeIds;
if (this.reviewId) { if (this.reviewId) {
getTestReviewTestCase(this.currentPage, this.pageSize, this.condition, (data) => { this.result = getTestReviewTestCase(this.currentPage, this.pageSize, this.condition, (data) => {
this.total = data.itemCount; this.total = data.itemCount;
this.tableData = data.listObject; this.tableData = data.listObject;
}); });
} }
setTimeout(this.$refs.table.reloadTable, 200);
}, },
getNexPageData() { getNexPageData() {
getTestReviewTestCase(this.currentPage * this.pageSize + 1, 1, this.condition, (data) => { this.result = getTestReviewTestCase(this.currentPage * this.pageSize + 1, 1, this.condition, (data) => {
if (data.listObject && data.listObject.length > 0) { if (data.listObject && data.listObject.length > 0) {
this.nextPageData = { this.nextPageData = {
name: data.listObject[0].name name: data.listObject[0].name
@ -405,7 +400,7 @@ export default {
getPreData() { getPreData() {
// //
if (this.currentPage > 1 && this.tableData.length === 1) { if (this.currentPage > 1 && this.tableData.length === 1) {
getTestReviewTestCase((this.currentPage - 1) * this.pageSize, 1, this.condition, (data) => { this.result = getTestReviewTestCase((this.currentPage - 1) * this.pageSize, 1, this.condition, (data) => {
if (data.listObject && data.listObject.length > 0) { if (data.listObject && data.listObject.length > 0) {
this.prePageData = { this.prePageData = {
name: data.listObject[0].name name: data.listObject[0].name
@ -554,5 +549,9 @@ export default {
.ms-table-header { .ms-table-header {
margin-bottom: 10px; margin-bottom: 10px;
} }
/deep/ .el-table__fixed-body-wrapper {
top: 49px !important; /* 不同表格top值不一样 */
}
</style> </style>