• Data Governance Dev's avatar
    feat(web3): 通用结果表组件 ResultTable · ce3693a6
    Data Governance Dev authored
    **新增 web3/src/components/ResultTable.vue**
    - props: columns / rows / pageSizes / defaultPageSize / rowKey
    - 自动追加末尾「备注」列(展示该行所有 issues)
    - 错误单元格 el-tooltip 出错误描述(按 col.cn 匹配 issues)
    - 表头「⚠ N规则」+ el-tooltip(col.rules / col.ruleList 驱动)
    - 内置分页 + 每页条数下拉
    - rows 长度变化自动回第 1 页(避免停在空页)
    - 空数据占位行
    - 样式复用 global.css 已定义的 .dq-table / .cell-error / .err-flag / .col-reason / .issue-line
    
    **重构 web3/src/views/DataQualityView.vue**
    - 删:内嵌 <thead><tbody>、isErrorCell/errTip/cellClass/ruleHint 辅助、page/pageSize/pagedRows/rangeStart/rangeEnd 计算、分页按钮块
    - 删:「操作」列(修改/删除按钮按 plan §3 决策拿掉)
    - 换:<ResultTable :columns="fields" :rows="rows" ... />
    - 留:查询区、任务信息条、卡片头部操作按钮(字段配置/导出/导入/批量删除)、FieldConfigDrawer
    
    **API 契约(结果表通用)**
      row[col.key]              显示值
      row.errorCells?: [key]    哪些单元格标红+tooltip
      row.issues?: [{field,desc}] 备注列展开
      col.rules                 表头规则数
      col.ruleList?             表头 tooltip 明细
    
    踩坑(详见 work-logs/2026-08-20.md 主题 29)
    - el-tooltip 默认包 <div> 会破坏 td inline 布局 → 触发元素改 inline-flex span
    - global.css 旧 .cell-error:hover .err-tip 还在,hover 可能出鬼影 tooltip,留待清理
    - 组件内管分页必须 watch rows 长度变 → 回第 1 页,否则批量删除后停在空页
    ce3693a6
ResultTable.vue 7.85 KB