bootstrap Table实现锁定列不滚动功能

当表格中的数据列比较多，各列的数据宽度大于页面的可用显示宽度时，就会出现横向滚动条，向右滚动时，左侧的数据列会隐藏，有时左侧列数据标识数据，隐藏了不方便数据查看，所以这时可以指定左侧的特定几列不进行滚动。

1. 锁定属性配置

# 在属性初始化中添加下面的属性
var options = {
    ...
    fixedColumns: true,
    fixedNumber: 2,
    fixedRightNumber: 3,
    ...
}

$.table.init(options);

其中fixedColumns表示开启锁定列功能，fixedNumber表示需要锁定的列数量，该参数表示从左侧开始的列数。fixedRightNumber表示锁定右侧的列数量。

2. 增加锁定列js文件

<th:block th:include="include :: bootstrap-table-fixed-columns-js" />

对应的js文件是：

<!-- 表格冻结列插件 -->
<div th:fragment="bootstrap-table-fixed-columns-js">
	<script th:src="@{/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.js?v=1.18.3}"></script>
</div>

3. 当表格的列比较多需要滚动时，可以确保左侧前两列不会滚动

 滚动以后如下：

 可以看到系统模块列在滚动后，隐藏了，右边的操作列显示出来了。