Commit 09998006 authored by Data Governance Dev's avatar Data Governance Dev

perf(web2): 去掉表头 checkbox 整列变灰联动,避免大表卡顿

问题:
- IdCardTable 数据列 el-table-column 上挂了两个动态 class-name 绑定:
    :class-name="isColSelected(c) ? '' : 'idcard-table__col-unselected'"
    :header-class-name="isColSelected(c) ? '' : 'idcard-table__col-unselected'"
- 任意一列 checkbox 切换都让 columnSelection 变化 → 每列重算 className
  → el-table 对全表 <td> 重写 class 属性
- 800+ 行 × 19 列 ≈ 15000+ 次 DOM patch,操作密集导致卡顿

修复:
- 删掉 el-table-column 上的 :class-name / :header-class-name 绑定
- 删掉对应的 .idcard-table__col-unselected 样式
- 保留 checkbox 勾选状态、selectedColumns / exportedDataColumns 响应式数据
  以及工具栏「已勾选 N 列」提示;导出仍按 selectedDataColumns 过滤

效果:勾选/取消 checkbox 不再让整列变灰,表格交互流畅度恢复正常。
parent 1cb480b4
......@@ -121,8 +121,6 @@
:width="isIdCard(colName) ? 220 : undefined"
resizable
show-overflow-tooltip
:class-name="isColSelected(colName) ? '' : 'idcard-table__col-unselected'"
:header-class-name="isColSelected(colName) ? '' : 'idcard-table__col-unselected'"
>
<template #header>
<div class="idcard-table__head-cell">
......@@ -555,15 +553,6 @@ function applyHeaderStyle(ws, cols) {
margin: 0 2px;
}
/* 未勾选的列:表头灰显 + 数据列轻微变灰,让用户一眼看出这列不参与导出 */
.idcard-table :deep(.idcard-table__col-unselected) {
background-color: #fafafa !important;
color: #c0c4cc !important;
}
.idcard-table :deep(.idcard-table__col-unselected .cell) {
color: #c0c4cc;
}
/* 表头单元格:checkbox + 字段名(横向排列) */
.idcard-table__head-cell {
display: inline-flex;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment