Laravel 自定义分页可以调整显示数目

Posted 2020-10-06 strenghthen

{{-- 增加输入框，跳转任意页码和显示任意条数 --}}
<ul class="pagination pagination-sm">
    <li>
        <span data-toggle="tooltip" data-placement="bottom" title="输入页码" style=" padding: 3.5px; margin-top: 3px;">
            第 <input type="text" class="text-center no-padding"  name="{{ $name or \'page\' }}" form="{{ $formId or \'\' }}"  value="{{ $data->currentPage() or \'1\' }}" id="{{ $id or \'customPage\'}}" data-total-page="{{ $data->lastPage() }}" style="width: 50px;"> 页 / 共 {{ $data->lastPage() }} 页
        </span>
    </li>
    <li style="">
        <span data-toggle="tooltip" data-placement="bottom" title="选择每页显示条数" style=" padding: 5.5px; margin-top: 3px;">
           <!--  每页 <input type="text" class="text-center no-padding" name=\'perPage\' form="{{ $formId or \'\' }}"  value="{{ $data->perPage() }}" id="customLimit" data-total="{{ $data->total() }}" style="width: 50px;" > 条 / 共 {{ $data->total() }} 条
            <div class="form-group"> -->
                <label class="text-center no-padding no-margin">每页显示:</label>
                <select id="perPage" class="text-center no-padding" name=\'perPage\' form="{{ $formId or \'\' }}" style="width: 50px;">
                    <option {{ $data->perPage() == 16 ? \'selected\': \'\'}} value="16">默认</option>
                    <option {{ $data->perPage() == 20 ? \'selected\': \'\'}} value="20">20</option>
                    <option {{ $data->perPage() == 50 ? \'selected\': \'\'}} value="50">50</option>
                    <option {{ $data->perPage() == 100 ? \'selected\': \'\'}} value="100">100</option>

                </select>
                <label class="text-center no-padding no-margin">条</label>
            </div>
        </span>
    </li>
</ul>
{{--
    @include(\'admin.widget.paginate-jump\', [
        \'data\' => \'data\',
        <!-- \'id\' => \'customPage\', -->
        <!-- \'name\' => \'page\', -->
        \'formId\' => \'formId\',
    ])
--}}

<script src="/assets/libs/single_file/jquery.min.js"></script>
<script type="text/javascript">
    $(function(){
        // 页面跳转
        $(\'#{{$id or "customPage"}}\').blur(function(){
            var jump_page = $(this).val();
            if (jump_page > {{ $data->lastPage()}} || jump_page <= 0) {
                $(this).val({{ $data->currentPage() }});
                jump_page = {{ $data->currentPage() }};
            }
            $(\'#{{$formId}}\').submit();
            // var url = "{!! $data->url( $data->currentPage() ) !!}";
            // var page_posite = url.indexOf(\'page=\');
            // var str = url.substr(0,page_posite) + \'page=\' + jump_page;
            // window.location.href = str;
            // console.log(jump_page, url,page_posite,str )
        });
        // 每页显示条数
       $(\'#perPage\').change(function(){
            var per_page = $(this).val();
            console.log(per_page);
            $(\'#{{$formId}}\').submit();
       })
    });
</script>