using Microsoft.AspNetCore.Mvc.RazorPages;
using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Pagination;

namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components
{
    public class PaginatorModel : PageModel
    {
        public PagerModel PagerModel { get; set; }

        public void OnGet(int currentPage, string sort)
        {
            PagerModel = new PagerModel(100, 10, currentPage, 10, "/Components/Paginator", sort);
        }
    }
}

<div class="row mt-3">
    <div class="col-sm-12 col-md-5">
        Showing 80 to 90 of 100 entries.
    </div>
    <div class="col-sm-12 col-md-7">
        <nav aria-label="Page navigation">
            <ul class="pagination justify-content-end">
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=7">Previous</a>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=1">1</a>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=2">2</a>
                </li>
                <li class="page-item ">
                    <span class="page-link gap">…</span>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=7">7</a>
                </li>
                <li class="page-item active">
                     <span class="page-link">
                        8
                        <span class="visually-hidden">(current)</span>
                     </span>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=9">9</a>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=10">10</a>
                </li>
                <li class="page-item ">
                    <a tabindex="-1" class="page-link" href="/Components/Paginator?currentPage=9">Next</a>
                </li>
            </ul>
         <!-- nav-->
    </nav></div>
</div>