Python 自定义分页方法及示例
后端写法:
# 适用于UI的分页前端
# 适用于所有数据分页,普通分页
class Pagination(object):# totalCnt代表表单内容总数量def __init__(self, currentPage, perPageCnt, totalCnt, pageIndexCnt, urls):self.currentPage = currentPageself.perPageCnt = perPageCntself.totalCnt = totalCntself.pageIndexCnt = pageIndexCnt # 表示分页索引显示几个页面,一般显示5个self.urls = urls# 加上@property时,调用方法不用加()@propertydef page_nums(self):if self.totalCnt % self.perPageCnt == 0:return int(self.totalCnt / self.perPageCnt)else:return int(self.totalCnt / self.perPageCnt) + 1# 其实条数,切片用@propertydef startNum(self):return (self.currentPage - 1) * self.perPageCnt@propertydef endNum(self):return self.currentPage * self.perPageCnt@propertydef prevPage(self):return self.currentPage - 1@propertydef nextPage(self):return self.currentPage + 1# 分页显示页码,比如显示: prev<< 4,5,6,7,8 >>next@propertydef 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)# 直接输送代码给模板@propertydef 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>« Prev</a></li>" % (self.currentPage - 1)next_page = "<li><a href=" + self.urls + "?p=%s>Next »</a></li>" % (self.currentPage + 1)if self.currentPage <= 1:prev_page = "<li class='am-disabled'><a href='#'>« Prev</a></li>"if self.currentPage >= self.page_nums:next_page = "<li class='am-disabled'><a href='#'>Next »</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时,调用方法不用加()@propertydef page_nums(self):if self.totalCnt % self.perPageCnt == 0:return int(self.totalCnt / self.perPageCnt)else:return int(self.totalCnt / self.perPageCnt) + 1# 其实条数,切片用@propertydef startNum(self):return (self.currentPage - 1) * self.perPageCnt@propertydef endNum(self):return self.currentPage * self.perPageCnt@propertydef prevPage(self):return self.currentPage - 1@propertydef nextPage(self):return self.currentPage + 1# 分页显示页码,比如显示: prev<< 4,5,6,7,8 >>next@propertydef 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)# 直接输送代码给模板@propertydef 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>« Prev</a></li>" % (self.currentPage - 1, self.content)next_page = "<li><a href=" + self.urls + "?p=%s&content=%s>Next »</a></li>" % (self.currentPage + 1, self.content)if self.currentPage <= 1:prev_page = "<li class='am-disabled'><a href='#'>« Prev</a></li>"if self.currentPage >= self.page_nums:next_page = "<li class='am-disabled'><a href='#'>Next »</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)) # 当前页,如果没有默认1perPageCnt = int(request.GET.get("perPageCnt", 25)) # 每页显示数据数量,默认10totalCnt = vuls.count() # 获取全部数据个数pageIndexCnt = 5 # 显示页码 5个,# 判断是否有查询,如果没有就取全部index即可(调用PaginationQuery),如果有内容就调用PaginationQueryif 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)
前端写法:
<div style="display: inline;margin-bottom: 15%"><ul class="am-pagination am-pagination-centered"><li>共{{ pagination.totalCnt }}条数据 </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> <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>
<script>function fun() {var pageNum = document.getElementById('pageNum').value;window.location.href = '{{ pagination.urls }}?p=' + pageNum;}</script>
前端效果: