Python custom paging methods and examples

Python custom paging methods and examples

Backend writing:


# 适用于UI的分页前端
# 适用于所有数据分页,普通分页
class Pagination(object):
    # totalCnt代表表单内容总数量
    def __init__(self, currentPage, perPageCnt, totalCnt, pageIndexCnt, urls):
        self.currentPage = currentPage
        self.perPageCnt = perPageCnt
        self.totalCnt = totalCnt
        self.pageIndexCnt = pageIndexCnt  # 表示分页索引显示几个页面,一般显示5个
        self.urls = urls

    # 加上@property时,调用方法不用加()
    @property
    def page_nums(self):
        if self.totalCnt % self.perPageCnt == 0:
            return int(self.totalCnt / self.perPageCnt)
        else:
            return int(self.totalCnt / self.perPageCnt) + 1

    # 其实条数,切片用
    @property
    def startNum(self):
        return (self.currentPage - 1) * self.perPageCnt

    @property
    def endNum(self):
        return self.currentPage * self.perPageCnt

    @property
    def prevPage(self):
        return self.currentPage - 1

    @property
    def nextPage(self):
        return self.currentPage + 1

    # 分页显示页码,比如显示: prev<< 4,5,6,7,8 >>next
    @property
    def pageRange(self):
        part = int(self.pageIndexCnt / 2)
        if self.pageIndexCnt < self.page_nums:
            if self.currentPage < int(self.pageIndexCnt / 2 + 1):
                return range(1, self.pageIndexCnt + 1)
            elif self.currentPage > self.page_nums - part:
                return range(self.page_nums - self.pageIndexCnt, self.page_nums + 1)
            else:
                return range(self.currentPage - part, self.currentPage + part + 1)
        else:
            return range(1, self.page_nums + 1)

    # 直接输送代码给模板
    @property
    def pageStr(self):
        pageNumStr = []
        prev_page = ""
        next_page = ""
        # 页码
        if self.currentPage > 1 and self.currentPage < self.page_nums:
            prev_page = "<li><a href=" + self.urls + "?p=%s>&laquo; Prev</a></li>" % (self.currentPage - 1)
            next_page = "<li><a href=" + self.urls + "?p=%s>Next &raquo;</a></li>" % (self.currentPage + 1)
        if self.currentPage <= 1:
            prev_page = "<li class='am-disabled'><a href='#'>&laquo; Prev</a></li>"
        if self.currentPage >= self.page_nums:
            next_page = "<li class='am-disabled'><a href='#'>Next &raquo;</a></li>"

        for page in self.pageRange:
            if page == self.currentPage:
                pageNumStr.append("<li class='am-active'><a href=" + self.urls + "?p=%s>%s</a></li>" % (page, page))
            else:
                pageNumStr.append("<li><a href=" + self.urls + "?p=%s>%s</a></li>" % (page, page))
            # print(pageNumStr)

        return prev_page + "".join(pageNumStr) + next_page


# 适用于UI的分页前端
# 对已经分页的数据进行查询,对查询后的数据再次进行分页
# 思路:url请求除了需要带current page 还需要带查询的内容
class PaginationQuery(object):
    # content代表需要查询的关键字
    def __init__(self, currentPage, perPageCnt, totalCnt, pageIndexCnt, urls, content):
        self.currentPage = currentPage  # 当前页码
        self.perPageCnt = perPageCnt  # 每页要显示多少条
        self.totalCnt = totalCnt  # totalCnt代表表单内容总数量
        self.pageIndexCnt = pageIndexCnt  # 表示分页索引显示几个页面,一般显示5个
        self.urls = urls  # 请求路径
        self.content = content  # 查询关键字

    # 加上@property时,调用方法不用加()
    @property
    def page_nums(self):
        if self.totalCnt % self.perPageCnt == 0:
            return int(self.totalCnt / self.perPageCnt)
        else:
            return int(self.totalCnt / self.perPageCnt) + 1

    # 其实条数,切片用
    @property
    def startNum(self):
        return (self.currentPage - 1) * self.perPageCnt

    @property
    def endNum(self):
        return self.currentPage * self.perPageCnt

    @property
    def prevPage(self):
        return self.currentPage - 1

    @property
    def nextPage(self):
        return self.currentPage + 1

    # 分页显示页码,比如显示: prev<< 4,5,6,7,8 >>next
    @property
    def pageRange(self):
        part = int(self.pageIndexCnt / 2)
        if self.pageIndexCnt < self.page_nums:
            if self.currentPage < int(self.pageIndexCnt / 2 + 1):
                return range(1, self.pageIndexCnt + 1)
            elif self.currentPage > self.page_nums - part:
                return range(self.page_nums - self.pageIndexCnt, self.page_nums + 1)
            else:
                return range(self.currentPage - part, self.currentPage + part + 1)
        else:
            return range(1, self.page_nums + 1)

    # 直接输送代码给模板
    @property
    def pageStr(self):
        pageNumStr = []
        prev_page = ""
        next_page = ""

        # 页码
        if self.currentPage > 1 and self.currentPage < self.page_nums:
            prev_page = "<li><a href=" + self.urls + "?p=%s&content=%s>&laquo; Prev</a></li>" % (
                self.currentPage - 1, self.content)
            next_page = "<li><a href=" + self.urls + "?p=%s&content=%s>Next &raquo;</a></li>" % (
                self.currentPage + 1, self.content)
        if self.currentPage <= 1:
            prev_page = "<li class='am-disabled'><a href='#'>&laquo; Prev</a></li>"
        if self.currentPage >= self.page_nums:
            next_page = "<li class='am-disabled'><a href='#'>Next &raquo;</a></li>"

        for page in self.pageRange:
            if page == self.currentPage:
                pageNumStr.append("<li class='am-active'><a href=" + self.urls + "?p=%s&content=%s>%s</a></li>" % (
                    page, self.content, page))
            else:
                pageNumStr.append(
                    "<li><a href=" + self.urls + "?p=%s&content=%s>%s</a></li>" % (page, self.content, page))
            # print(pageNumStr)

        return prev_page + "".join(pageNumStr) + next_page

# 分页在方法中的应用
def index(request):
    content = request.GET.get("content", '').strip()
    # 判断是否有查询内容
    if content:
        vuls = Vul.objects.filter(Q(acquired=1),
                    (
                    Q(title__icontains=content) |
                    Q(vul_brief_intro__icontains=content) |
                    Q(vul_anno__icontains=content)|
                    Q(danger_level__contains=content)|
                    Q(threat_type__contains=content)
                    )
                ).order_by("-release_time")
    else:
        vuls = Vul.objects.filter(acquired=1,danger_level__in=('中危','高危','超危')).order_by("-release_time")
    # 分页显示
    # 分页显示
    currentPage = int(request.GET.get("p", 1))  # 当前页,如果没有默认1
    perPageCnt = int(request.GET.get("perPageCnt", 25))  # 每页显示数据数量,默认10
    totalCnt = vuls.count()  # 获取全部数据个数
    pageIndexCnt = 5  # 显示页码 5个,
    # 判断是否有查询,如果没有就取全部index即可(调用PaginationQuery),如果有内容就调用PaginationQuery
    if content:
        pagination = PaginationQuery(currentPage, perPageCnt, totalCnt, pageIndexCnt, request.path, content)
    else:
        pagination = Pagination(currentPage, perPageCnt, totalCnt, pageIndexCnt, request.path)
    # pagination = Pagination(currentPage, perPageCnt, totalCnt, pageIndexCnt, request.path)
    # 获取当前页面要显示的内容,使用切片模式
    if currentPage > 0 and currentPage < pagination.page_nums:
        vuls = vuls[pagination.startNum:pagination.endNum]
    elif currentPage == pagination.page_nums:
        vuls = vuls[pagination.startNum::]
    else:
        vuls = vuls[0:10]
    ctx = {
    
    
        'vuls': vuls,
        "pagination": pagination,
        'content':content
    }
    return render(request, "index.html", ctx)

Front-end writing:

<!-- Amaze UI css -->
    <link rel="stylesheet" href="{% static 'AmazeUI-2.7.2/assets/css/amazeui.min.css' %}">

 <div style="display: inline;margin-bottom: 15%">
    <ul class="am-pagination am-pagination-centered">
         <li>共{
   
   { pagination.totalCnt }}条数据&nbsp</li>
         <li><a href="{
     
     { pagination.urls }}?p=1&&content={
     
     { content }}">首页</a></li>

         {
   
   { pagination.pageStr|safe }}

         <li><a href="{
     
     { pagination.urls }}?p={
     
     { pagination.page_nums }}&&content={
     
     { content }}">尾页</a></li>
         <li>
             总页数: {
   
   { pagination.page_nums }}
         </li>
         <li>&nbsp;
             <input type="text" name="pageNum" id="pageNum" style="width: 60px">
             <button type="button" class="am-btn am-btn-default  am-btn-sm" onclick="fun()">跳转页
             </button>
         </li>
     </ul>
 </div>
<!-- Amaze UI JS -->
<script src="{% static 'AmazeUI-2.7.2/assets/js/amazeui.min.js' %}"></script>
<script>
    function fun() {
      
      
        var pageNum = document.getElementById('pageNum').value;
        window.location.href = '{
      
      { pagination.urls }}?p=' + pageNum;
    }


</script>

Front-end effect:
Insert image description here

Guess you like

Origin blog.csdn.net/longe20111104/article/details/130963003