[Bug Report]Table 固定列会遮挡横向滚动条导致固定列所遮盖部分的横向滚动条无法被点击

[beiranc]

Environment

操作系统版本: Windows 11 / 浏览器版本: Chrome 103.0.5060.114 / Vue 版本: Vue 3 或 Vue 2 / UI 框架版本: View UI Plus / View UI

Reproduction link

https://run.iviewui.com/jMi7dee1

Steps to reproduce

1. 创建一个 Table
2. 列定义中设置一列或多列为固定列
3. 此时点击被固定列所覆盖的横向滚动条并尝试滚动，发现无法滚动

What is expected?

固定列不应覆盖掉表格的横向滚动条，Fixed 层应当只覆盖表头及内容部分。

What is actually happening?

固定列覆盖掉了表格的横向滚动条导致被覆盖了的横向滚动条无法点击，若需横向滚动，只能点击非固定列下方的横向滚动条来达到滚动的目的。

---

该 Bug 在 View UI（Vue 2）及 View UI Plus（Vue 3）均可重现。

[zhengsixsix]

你需要把固定列的底部用margin-bottom 把滚动条撑开一下

[beiranc]

你需要把固定列的底部用margin-bottom 把滚动条撑开一下

你指的是固定 margin-bottom 吗？这样会导致在开启合计行的情况下样式异常

[beiranc]

目前是通过 pointer-events 来暂时性的解决这个问题，使用的 CSS 如下：

.ivu-table-fixed-shadow {
    height: auto !important;
    pointer-events: none !important;
    td {
        pointer-events: auto !important;
    }
}

除了指示该元素不是鼠标事件的目标之外，值 none 表示鼠标事件 ”穿透“ 该元素并且指定该元素 ”下面“ 的任何东西。