github
/
RuoYi
mirror of https://gitee.com/y_project/RuoYi.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

更换表格冻结列插件

pull/193/head
RuoYi 2020-07-27 09:15:51 +08:00
parent 4a6e5a0fba
commit b1c60695e6
6 changed files with 1563 additions and 341 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1775
ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.js
View File

File diff suppressed because it is too large Load Diff

10
ruoyi-admin/src/main/resources/static/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

58
ruoyi-admin/src/main/resources/static/ruoyi/css/ry-ui.css
View File

@ -867,49 +867,35 @@ label {
} }
/** 表格冻结列样式 **/ /** 表格冻结列样式 **/
.left-fixed-table-columns, .left-fixed-body-columns { .fixed-columns, .fixed-columns-right {
position: absolute; position: absolute;
top: 0;
height: 100%;
background-color: #fff; background-color: #fff;
display: none;
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; z-index: 1;
} }
.left-fixed-table-columns .table, .left-fixed-body-columns .table { .fixed-columns {
border-right: 1px solid #ddd; left: 0;
} }
.left-fixed-table-columns .table.table-no-bordered, .left-fixed-body-columns .table.table-no-bordered { .fixed-columns .fixed-table-body {
border-right: 1px solid transparent; overflow: hidden !important;
} }
.left-fixed-body-columns table { .fixed-columns-right {
position: absolute; right: 0;
animation: none; }
.fixed-columns-right .fixed-table-body {
overflow-x: hidden !important;
} }
.bootstrap-table .table-hover > tbody > tr.hover > td { .bootstrap-table .table-hover > tbody > tr.hover > td {
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.right-fixed-table-columns{
position: absolute;
right:63px;
border-left:1px solid #ddd;
display: none;
z-index:100;
}
/** 表格全屏样式 **/
.bootstrap-table.fullscreen {
position: fixed;
top: 0;
left: 0;
z-index: 1050;
width: 100%!important;
background: #FFF;
}
/** 表格树样式 **/ /** 表格树样式 **/
.bootstrap-tree-table .treetable-indent {width:16px; height: 16px; display: inline-block; position: relative;} .bootstrap-tree-table .treetable-indent {width:16px; height: 16px; display: inline-block; position: relative;}
.bootstrap-tree-table .treetable-expander {width:16px; height: 16px; display: inline-block; position: relative; cursor: pointer;} .bootstrap-tree-table .treetable-expander {width:16px; height: 16px; display: inline-block; position: relative; cursor: pointer;}
@ -1070,14 +1056,20 @@ label {
/* 设置滚动条样式 */ /* 设置滚动条样式 */
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 6px; width:10px!important;
height: 10px; height:10px!important;
background-color: #F5F5F5; -webkit-appearance:none;
background:#f1f1f1
} }
::-webkit-scrollbar-thumb { ::-webkit-scrollbar-thumb {
border-radius: 6px; height:5px;
background-color: #999; border:1px solid transparent;
border-top:0;
border-bottom:0;
border-radius:6px;
background-color:#ccc;
background-clip:padding-box
} }
/* 设置placeholder样式 */ /* 设置placeholder样式 */

6
ruoyi-admin/src/main/resources/static/ruoyi/js/ry-ui.js
View File

@ -66,8 +66,7 @@ var table = {
rememberSelected: false, rememberSelected: false,
fixedColumns: false, fixedColumns: false,
fixedNumber: 0, fixedNumber: 0,
rightFixedColumns: false, fixedRightNumber: 0,
rightFixedNumber: 0,
queryParams: $.table.queryParams, queryParams: $.table.queryParams,
rowStyle: {}, rowStyle: {},
}; };
@ -124,8 +123,7 @@ var table = {
rememberSelected: options.rememberSelected, // 启用翻页记住前面的选择 rememberSelected: options.rememberSelected, // 启用翻页记住前面的选择
fixedColumns: options.fixedColumns, // 是否启用冻结列（左侧） fixedColumns: options.fixedColumns, // 是否启用冻结列（左侧）
fixedNumber: options.fixedNumber, // 列冻结的个数（左侧） fixedNumber: options.fixedNumber, // 列冻结的个数（左侧）
rightFixedColumns: options.rightFixedColumns, // 是否启用冻结列（右侧） fixedRightNumber: options.fixedRightNumber, // 列冻结的个数（右侧）
rightFixedNumber: options.rightFixedNumber, // 列冻结的个数（右侧）
onReorderRow: options.onReorderRow, // 当拖拽结束后处理函数 onReorderRow: options.onReorderRow, // 当拖拽结束后处理函数
queryParams: options.queryParams, // 传递参数（*） queryParams: options.queryParams, // 传递参数（*）
rowStyle: options.rowStyle, // 通过自定义函数设置行样式 rowStyle: options.rowStyle, // 通过自定义函数设置行样式

3
ruoyi-admin/src/main/resources/templates/demo/table/fixedColumns.html
View File

@ -37,8 +37,7 @@
showColumns: false, showColumns: false,
fixedColumns: true, fixedColumns: true,
fixedNumber: 3, fixedNumber: 3,
rightFixedColumns: true, fixedRightNumber: 3,
rightFixedNumber: 3,
columns: [{ columns: [{
checkbox: true checkbox: true
}, },

16
ruoyi-admin/src/main/resources/templates/include.html
View File

@ -10,10 +10,10 @@
<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/> <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
<link th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/> <link th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
<!-- bootstrap-table 表格插件样式 --> <!-- bootstrap-table 表格插件样式 -->
<link th:href="@{/ajax/libs/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet"/> <link th:href="@{/ajax/libs/bootstrap-table/bootstrap-table.min.css?v=20200727}" rel="stylesheet"/>
<link th:href="@{/css/animate.css}" rel="stylesheet"/> <link th:href="@{/css/animate.css}" rel="stylesheet"/>
<link th:href="@{/css/style.css?v=20200318}" rel="stylesheet"/> <link th:href="@{/css/style.css?v=20200727}" rel="stylesheet"/>
<link th:href="@{/ruoyi/css/ry-ui.css}" rel="stylesheet"/> <link th:href="@{/ruoyi/css/ry-ui.css?v=4.3.1}" rel="stylesheet"/>
</head> </head>
<!-- 通用JS --> <!-- 通用JS -->
@ -22,9 +22,9 @@
<script th:src="@{/js/jquery.min.js}"></script> <script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script> <script th:src="@{/js/bootstrap.min.js}"></script>
<!-- bootstrap-table 表格插件 --> <!-- bootstrap-table 表格插件 -->
<script th:src="@{/ajax/libs/bootstrap-table/bootstrap-table.min.js?v=20200529}"></script> <script th:src="@{/ajax/libs/bootstrap-table/bootstrap-table.min.js?v=20200727}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script> <script th:src="@{/ajax/libs/bootstrap-table/locale/bootstrap-table-zh-CN.min.js?v=20200727}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/extensions/mobile/bootstrap-table-mobile.js}"></script> <script th:src="@{/ajax/libs/bootstrap-table/extensions/mobile/bootstrap-table-mobile.js?v=20200727}"></script>
<!-- jquery-validate 表单验证插件 --> <!-- jquery-validate 表单验证插件 -->
<script th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script> <script th:src="@{/ajax/libs/validate/jquery.validate.min.js}"></script>
<script th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script> <script th:src="@{/ajax/libs/validate/messages_zh.min.js}"></script>
@ -182,7 +182,7 @@
</div> </div>
<div th:fragment="bootstrap-table-editable-js"> <div th:fragment="bootstrap-table-editable-js">
<script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-editable.min.js}"></script> <script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-editable.min.js}"></script>
<script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-table-editable.js}"></script> <script th:src="@{/ajax/libs/bootstrap-table/extensions/editable/bootstrap-table-editable.min.js?v=20200727}"></script>
</div> </div>
<!-- 表格导出插件 --> <!-- 表格导出插件 -->
@ -193,5 +193,5 @@
<!-- 表格冻结列插件 --> <!-- 表格冻结列插件 -->
<div th:fragment="bootstrap-table-fixed-columns-js"> <div th:fragment="bootstrap-table-fixed-columns-js">
<script th:src="@{/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.js}"></script> <script th:src="@{/ajax/libs/bootstrap-table/extensions/columns/bootstrap-table-fixed-columns.min.js?v=20200727}"></script>
</div> </div>