Merge pull request #99 from shikorism/fix/68-paginator

ページャーの改善
This commit is contained in:
shibafu 2019-02-17 20:41:46 +09:00 committed by GitHub
commit a5b4eeee36
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 78 additions and 51 deletions

View File

@ -53,6 +53,15 @@
border-bottom: 1px solid rgba(0, 0, 0, .125);
}
.tis-page-selector {
margin-left: -1px;
width: calc(100% + 2px);
height: 100%;
border: 1px solid #dee2e6;
border-radius: 0;
line-height: 1.25;
}
@media (min-width: 992px) {
.tis-sidebar-info {
font-size: small;

6
public/js/tissue.js vendored
View File

@ -46,4 +46,10 @@
});
};
$.fn.pageSelector = function () {
return this.on('change', function () {
location.href = $(this).find(':selected').data('href');
});
};
})(jQuery);

View File

@ -16,22 +16,6 @@
</a>
@endforeach
</div>
<ul class="pagination mt-4 justify-content-center">
<li class="page-item {{ $informations->currentPage() === 1 ? 'disabled' : '' }}">
<a class="page-link" href="{{ $informations->previousPageUrl() }}" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
@for ($i = 1; $i <= $informations->lastPage(); $i++)
<li class="page-item {{ $i === $informations->currentPage() ? 'active' : '' }}"><a href="{{ $informations->url($i) }}" class="page-link">{{ $i }}</a></li>
@endfor
<li class="page-item {{ $informations->currentPage() === $informations->lastPage() ? 'disabled' : '' }}">
<a class="page-link" href="{{ $informations->nextPageUrl() }}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
{{ $informations->links(null, ['className' => 'mt-4 justify-content-center']) }}
</div>
@endsection

View File

@ -160,6 +160,7 @@
@endguest
$('[data-toggle="tooltip"]').tooltip();
$('.alert').alert();
$('.tis-page-selector').pageSelector();
@if (session('status'))
setTimeout(function () {
$('#status').alert('close');

View File

@ -58,23 +58,7 @@
</li>
@endforeach
</ul>
<ul class="pagination mt-4 justify-content-center">
<li class="page-item {{ $results->currentPage() === 1 ? 'disabled' : '' }}">
<a class="page-link" href="{{ $results->previousPageUrl() }}" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
@for ($i = 1; $i <= $results->lastPage(); $i++)
<li class="page-item {{ $i === $results->currentPage() ? 'active' : '' }}"><a href="{{ $results->url($i) }}" class="page-link">{{ $i }}</a></li>
@endfor
<li class="page-item {{ $results->currentPage() === $results->lastPage() ? 'disabled' : '' }}">
<a class="page-link" href="{{ $results->nextPageUrl() }}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
{{ $results->links(null, ['className' => 'mt-4 justify-content-center']) }}
@endif
@endsection

View File

@ -87,23 +87,7 @@
</li>
@endforelse
</ul>
<ul class="pagination mt-4 justify-content-center">
<li class="page-item {{ $ejaculations->currentPage() === 1 ? 'disabled' : '' }}">
<a class="page-link" href="{{ $ejaculations->previousPageUrl() }}" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
<span class="sr-only">Previous</span>
</a>
</li>
@for ($i = 1; $i <= $ejaculations->lastPage(); $i++)
<li class="page-item {{ $i === $ejaculations->currentPage() ? 'active' : '' }}"><a href="{{ $ejaculations->url($i) }}" class="page-link">{{ $i }}</a></li>
@endfor
<li class="page-item {{ $ejaculations->currentPage() === $ejaculations->lastPage() ? 'disabled' : '' }}">
<a class="page-link" href="{{ $ejaculations->nextPageUrl() }}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
<span class="sr-only">Next</span>
</a>
</li>
</ul>
{{ $ejaculations->links(null, ['className' => 'mt-4 justify-content-center']) }}
@endif
@component('components.modal', ['id' => 'deleteCheckinModal'])

View File

@ -0,0 +1,59 @@
@if ($paginator->hasPages())
{{-- for PC : >= lg --}}
<ul class="pagination d-none d-lg-flex {{ $className ?? '' }}">
{{-- Previous Page Link --}}
@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
{{-- Pagination Elements --}}
@foreach ($elements as $element)
{{-- "Three Dots" Separator --}}
@if (is_string($element))
<li class="page-item disabled"><span class="page-link">{{ $element }}</span></li>
@endif
{{-- Array Of Links --}}
@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="{{ $url }}">{{ $page }}</a></li>
@endif
@endforeach
@endif
@endforeach
{{-- Next Page Link --}}
@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>
{{-- for Phone : <= md --}}
<ul class="pagination d-flex d-lg-none {{ $className ?? '' }}">
@if ($paginator->onFirstPage())
<li class="page-item w-25 text-center disabled"><span class="page-link">&laquo;</span></li>
@else
<li class="page-item w-25 text-center"><a class="page-link" href="{{ $paginator->previousPageUrl() }}" rel="prev">&laquo;</a></li>
@endif
<li class="page-item w-25 text-center">
<select class="custom-select tis-page-selector" aria-label="Page">
@for ($i = 1; $i <= $paginator->lastPage(); $i++)
<option value="{{ $i }}" {{ $i === $paginator->currentPage() ? 'selected' : '' }} data-href="{{ $paginator->url($i) }}">{{ $i }}</option>
@endfor
</select>
</li>
@if ($paginator->hasMorePages())
<li class="page-item w-25 text-center"><a class="page-link" href="{{ $paginator->nextPageUrl() }}" rel="next">&raquo;</a></li>
@else
<li class="page-item w-25 text-center disabled"><span class="page-link">&raquo;</span></li>
@endif
</ul>
@endif