From 393721bef7512d03da3edf09bcba99536e9d5b67 Mon Sep 17 00:00:00 2001
From: ZhangXianQiang <1135831638@qq.com>
Date: 星期一, 18 三月 2024 16:43:11 +0800
Subject: [PATCH] style:表格样式
---
src/views/screen/components/screen-examine/components/examine-table.vue | 77 +++++++++++++++++++++++++++++++-------
1 files changed, 62 insertions(+), 15 deletions(-)
diff --git a/src/views/screen/components/screen-examine/components/examine-table.vue b/src/views/screen/components/screen-examine/components/examine-table.vue
index b66611f..7513b10 100644
--- a/src/views/screen/components/screen-examine/components/examine-table.vue
+++ b/src/views/screen/components/screen-examine/components/examine-table.vue
@@ -1,8 +1,8 @@
<template>
<div class="table-container">
- <div class="table-content">
- <el-table :data="tableData" border :height="tableHeight" :max-height="tableHeight">
- <el-table-column prop="date" label="鎺掑悕" align="center">
+ <div class="table-content" ref="tabContent">
+ <el-table :data="tableData" border :height="tableHeight" :max-height="tableHeight" class="rank-table">
+ <el-table-column prop="date" label="鎺掑悕" align="center" width="100">
</el-table-column>
<el-table-column prop="name" label="鍚嶇О" align="center">
</el-table-column>
@@ -73,21 +73,15 @@
methods: {
computedHeight() {
this.$nextTick(() => {
-
+ setTimeout(() => {
+ const content = this.$refs.tabContent;
+ this.tableHeight = content.offsetHeight;
+ })
})
- const content = this.$refs.tabContent;
- console.log(content);
- // this.tableHeight = content.clientHeight;
}
},
mounted() {
- this.$nextTick(() => {
- setTimeout(() => {
- this.computedHeight();
-
- },1000)
-
- })
+ this.computedHeight();
}
}
</script>
@@ -96,7 +90,6 @@
.table-container {
width: 100%;
flex: 1;
- border: 1px solid red;
position: relative;
.table-content {
@@ -106,4 +99,58 @@
bottom: 0;
}
}
+
+
+
+.rank-table {
+ background-color: transparent !important;
+ color: #fff !important;
+
+ //婊氬姩鏉＄殑鑳屾櫙鑹�
+ ::-webkit-scrollbar-track {
+ background-color: transparent;
+ }
+}
+
+::v-deep .el-table tr {
+ background-color: transparent !important;
+}
+
+::v-deep .el-table .el-table__header-wrapper th,
+.el-table .el-table__fixed-header-wrapper th {
+ background-color: transparent !important;
+
+}
+
+::v-deep .el-table--group,
+.el-table--border {
+ border: 0;
+}
+
+::v-deep .el-table th.el-table__cell.is-leaf,
+.el-table td.el-table__cell {
+ border-color: #56739e99 !important;
+}
+
+::v-deep .el-table--border .el-table__cell {
+ border-color: #56739e99 !important;
+}
+
+::v-deep .el-table th.el-table__cell>.cell {
+ color: #447ED6;
+}
+
+::v-deep .el-scrollbar__bar.is-vertical {
+ display: none !important;
+}
+
+::v-deep .el-table::before,
+.el-table--group::after,
+.el-table--border::after {
+ background-color: transparent !important;
+}
+
+::v-deep .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
+ background-color: #447ed648;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0