|
@@ -1,13 +1,13 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
<el-table
|
|
|
- :show-header="false"
|
|
|
+ :show-header="false"
|
|
|
v-loading="shujuloading"
|
|
|
:data="tableData"
|
|
|
:max-height="maxHeight"
|
|
|
-
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
ref="shujuscroll_Table"
|
|
|
- strip
|
|
|
+
|
|
|
@mouseenter.native="shujuautoScroll(true)"
|
|
|
@mouseleave.native="shujuautoScroll(false)"
|
|
|
id="Tabtab"
|
|
@@ -19,7 +19,7 @@
|
|
|
:prop="column.prop"
|
|
|
:label="column.label"
|
|
|
show-overflow-tooltip
|
|
|
- :width="getColumnWidth(column.prop)"
|
|
|
+ :width="getColumnWidth(column.prop)"
|
|
|
></el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
@@ -86,8 +86,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
getColumnWidth(prop) {
|
|
|
- return this.columnWidths[prop] + 'px'; // 根据传入的属性(prop)获取对应的列宽度
|
|
|
- return this.YCcolumnWidths[prop] + 'px'; // 根据传入的属性(prop)获取对应的列宽度
|
|
|
+ return this.columnWidths[prop] + "px"; // 根据传入的属性(prop)获取对应的列宽度
|
|
|
+ return this.YCcolumnWidths[prop] + "px"; // 根据传入的属性(prop)获取对应的列宽度
|
|
|
},
|
|
|
tableRowClassName({ row, rowIndex }) {
|
|
|
if (rowIndex % 2 === 1) {
|
|
@@ -105,20 +105,36 @@ export default {
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
|
|
|
-::v-deep.el-table .el-table__cell {
|
|
|
+/* 单元格 padding、去掉底部白线 */
|
|
|
+::v-deep .el-table .el-table__cell {
|
|
|
padding: 2px 0 !important;
|
|
|
+ border-bottom: none !important;
|
|
|
}
|
|
|
|
|
|
-/* 去掉最下面的那一条线 */
|
|
|
-.el-table::before {
|
|
|
- height: 0px;
|
|
|
+/* 去掉 el-table 自带底部边框 */
|
|
|
+::v-deep .el-table::before {
|
|
|
+ height: 0 !important;
|
|
|
}
|
|
|
|
|
|
-/* 滚动条样式 */
|
|
|
-::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
|
|
|
- background-color: #004f5f;
|
|
|
+/* 设置奇偶行背景色 */
|
|
|
+::v-deep .warning-row {
|
|
|
+
|
|
|
+ background-color: #1b3b7f !important;
|
|
|
+ color: white !important;
|
|
|
+}
|
|
|
+::v-deep .success-row {
|
|
|
+ background-color: #0b255d !important;
|
|
|
+ color: white !important;
|
|
|
}
|
|
|
|
|
|
+/* ✅ 解决 hover 行不变色问题 —— 统一高亮 hover 行为 */
|
|
|
+::v-deep .el-table__body .el-table__row:hover > td {
|
|
|
+ background-color: #50a7e3 !important;
|
|
|
+ color: white !important;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
::v-deep .el-table__body-wrapper::-webkit-scrollbar {
|
|
|
width: 0px;
|
|
|
opacity: 0.5;
|
|
@@ -126,6 +142,8 @@ export default {
|
|
|
|
|
|
::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
|
|
border-radius: 15px;
|
|
|
- // background-color: rgba(0, 79, 95, 0.75);
|
|
|
}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
</style>
|