pagination-ajax.blade.php 3.8 KB
<div class="mt-2 text-left">
<b>{{$paginator->firstItem()}}</b><b>{{$paginator->lastItem()}}</b> ,总共 <b>{{$paginator->total()}}</b>
    <ul class="pagination pagination-sm float-right">
       {{-- <li class="pagination-jump ">
            <input type="number" class="page-input-ajax" value="1">
        </li>
        <li class="page-go">
            <a class="jump-go page-link" href="javascript:jumpAjax();">跳转</a>
        </li>
--}}
        @if ($paginator->onFirstPage())
            <li class="page-item disabled"><span class="page-link">&laquo;</span></li>
        @else
            <li class="page-item"><a class="page-link" href="{{ $paginator->previousPageUrl() }}"  rel="prev">&laquo;</a></li>
        @endif

        @foreach ($elements as $element)
            @if (is_string($element))
                <li class="page-item disabled"><span class="page-link">{{ $element }}</span></li>
            @endif
            @if (is_array($element))
                @foreach ($element as $page => $url)
                    @if ($page == $paginator->currentPage())
                        <li class="page-item active"><span class="page-link">{{ $page }}</span></li>
                    @else
                        <li class="page-item"><a class="page-link" href="{{$paginator->url($page)}}">{{ $page }}</a></li>
                    @endif
                @endforeach
            @endif
        @endforeach
        @if ($paginator->hasMorePages())
            <li class="page-item"><a class="page-link" href="{{ $paginator->nextPageUrl() }}" rel="next">&raquo;</a></li>
        @else
            <li class="page-item disabled"><span class="page-link">&raquo;</span></li>
        @endif
    </ul>
</div>
    <script>
    /*function page(url) {
        layer_loading();
        $.ajax({
            type:"get",
            url: url,
            success:function(msg){
                $(".modal-body #pagination-ajax-box").html("");
                if(msg){
                    $(".modal-body #pagination-ajax-box").html(msg)
                }
                layer_loading_close();
            },
            error:function (request) {
                layer_loading_close();
            }
        })
    }*/

    function jumpAjax(){
        let fullUrl = "{{request()->fullUrl()}}";
        let url = "{{request()->url()}}";
        let para = fullUrl.replace(url, '');
        console.log(fullUrl)
        console.log(url)
        let lastPage = {{$paginator->lastPage()}};
        let path = "{{$paginator->path()}}";
        {{--let query = {{$paginator->getQuery()}};--}}
        let page = $(".page-input-ajax").val();
        if (page < 0) {
            page = 1;
        } else if(page > lastPage) {
            page = lastPage;
        }
        if (!para) {
            para += "?";
        }
        para.replace('&amp;', '&');
        path +=  para + "&page="+page
        path = htmlDecode(path);
        layer_loading();
        $.ajax({
            type:"get",
            url: path,
            success:function(msg){
                $(".modal-body #pagination-ajax-box").html("");
                if(msg){
                    $(".modal-body #pagination-ajax-box").html(msg)
                }
                layer_loading_close();
            },
            error:function (request) {
                layer_loading_close();
            }
        })
        // console.log(path);
        // window.location.href = path
        // $.pjax({container:'#pagination-ajax-box', url: path});
    }

    function htmlDecode(value){
        return $('<div/>').html(value).text();
    }
    </script>

<style>
    .pagination-jump .page-input-ajax {
        padding: 4px 0px 3px 8px;
        border: 1px solid #dee2e6;
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
        width: 60px;
        text-align: center;
        border-right: none;
    }
</style>