diff --git a/public/css/bootstrap-tables-sticky-header.css b/public/css/bootstrap-tables-sticky-header.css new file mode 100644 index 0000000000000000000000000000000000000000..521a8b04d6e9c1ff09120dd32012f7c33977445d Binary files /dev/null and b/public/css/bootstrap-tables-sticky-header.css differ diff --git a/public/css/dist/all.css b/public/css/dist/all.css index 7f8ab24dfa27837a7c9ea38d6b82c74ea6df2a1c..dbe1278a8a3be44d080727e08082b6a6366ad066 100644 Binary files a/public/css/dist/all.css and b/public/css/dist/all.css differ diff --git a/resources/views/partials/bootstrap-table.blade.php b/resources/views/partials/bootstrap-table.blade.php index cb2ab5cc48609c373edfe1b2b729ba0f762f2945..30020b083ac7e20f75f804dde177e1a5897d685b 100644 --- a/resources/views/partials/bootstrap-table.blade.php +++ b/resources/views/partials/bootstrap-table.blade.php @@ -11,10 +11,28 @@ <script src="{{ asset('js/jspdf.plugin.autotable.js') }}"></script> <script src="{{ asset('js/extensions/export/jquery.base64.js') }}"></script> <script src="{{ asset('js/extensions/toolbar/bootstrap-table-toolbar.js') }}"></script> +<script src="{{ asset('js/extensions/sticky-header/bootstrap-table-sticky-header.js') }}"></script> @endif <script nonce="{{ csrf_token() }}"> -$('.snipe-table').bootstrapTable({ + + var $table = $('.snipe-table'); + $(function () { + buildTable($table, 20, 50); + }); + function buildTable($el) { + var stickyHeaderOffsetY = 0; + + if ( $('.navbar-fixed-top').css('height') ) { + stickyHeaderOffsetY = +$('.navbar-fixed-top').css('height').replace('px',''); + } + if ( $('.navbar-fixed-top').css('margin-bottom') ) { + stickyHeaderOffsetY += +$('.navbar-fixed-top').css('margin-bottom').replace('px',''); + } + + + +$('.snipe-table').bootstrapTable('destroy').bootstrapTable({ classes: 'table table-responsive table-no-bordered', undefinedText: '', iconsPrefix: 'fa', @@ -38,6 +56,11 @@ $('.snipe-table').bootstrapTable({ cookie: true, cookieExpire: '2y', showExport: true, + + stickyHeader: true, + stickyHeaderOffsetY: stickyHeaderOffsetY + 'px', + + @if (isset($showFooter)) showFooter: true, @endif @@ -101,6 +124,8 @@ $('.snipe-table').bootstrapTable({ }, }); + } + function dateRowCheckStyle(value) { diff --git a/webpack.mix.js b/webpack.mix.js index 5be691fdd9a220748e35c5b0121d60b7ac0bc55a..5d51c488c45dfc58fc6e7b1cea0c6ed02454870d 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -23,7 +23,8 @@ mix.styles([ 'resources/assets/css/font-awesome/font-awesome.min.css', './bower_components/iCheck/skins/minimal/minimal.css', './node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker.standalone.css', - 'public/css/overrides.css', + 'public/css/bootstrap-tables-sticky-header.css', + 'public/css/overrides.css' ], 'public/css/dist/all.css'); mix.js(