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>« 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时,调用方法不用加()
@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>« 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)) # 当前页,如果没有默认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 }}条数据 </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>
<!-- 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: