留言分页序号功能
1000
0
2022-02-25
2022-12-02
Hey、小怪兽
- • 介绍：在留言页面，每个留言卡片都有自己的序号，从大到小显示，但在分页模式下，也要保持这个序号的正确（此功能在v2.10.3已更新）
- • 如图所示，在Message Board卡片下面增加一个分页的模块
- • 而下面每个MESSAGE#后面要带上此卡片的序号，这样就可以看到是在几号的留言卡片留言了，首先需要分析需求：
- - 是降序的排列，可以用到Django的模板语法forloop.revcounter
- - 一页显示4个MESSAGE卡片（后期改成15个，等留言多了再说）
- - 最后一页不一定是4个MESSAGE，是小于等于4
- • 之后开始图文分析了，先假设有13条数据，那么就是这样的，因为一页显示4个，所以第1页4个的序号是13，12，11，10，最后一页是1个，序号是1：
- • 我们用到的是forloop.revcounter，它的渲染是这样的，每一页都是4，3，2，1，这样就不需要考虑单页的自增问题：
- • forloop.revcounter和上面的表格就结合：
- • 规律是第3页+1，第2页+5，第1页+9这样吗，其实并不是，因为这是13条数据的结果，最后一页只有1个数据，我们将数据改为14，15，16：
- • 就会发现，其实这个加的数值和最后一页的个数有关，这里我们拿15条数据来分析：
- • 可以看出是最后一页的余数加上总数减去当前页数再-1，其实可以这样看，加上余数其实也是等于减去（最后一页的卡片数 - 个数）
- • 这样表格就可以改为：
- • 规律：
- - 第4页（最后一页）forloop.revcounter+0
- - 第3页是forloop.revcounter+(4-3)*4 - (4-3)
- - 第2页是forloop.revcounter+(4-2)*4 - (4-3)
- - 第1页是forloop.revcounter+(4-1)*4 - (4-3)
- - forloop.revcounter+ (总的页数 - 当前页数) * 每页显示卡片数 - (每页显示卡片数 - 最后一页的卡片数)
- • 知道这个规律就可以直接写代码了
- • 首先是每页显示的卡片数，我们设置为cardNum，如果想要一页显示8个直接改后面的数字就可以了
-
cardNum = 4 - • 从数据库取出留言，tree=0就是留言，tree有数字就是留言回复，取出messages后，messages.count()就是卡片的总数了
-
messages = Message.objects.filter(tree=0).order_by("-date_comment") - • 这里用Django自带的分页功能，n就是当前页码，totalNum就是总的页码
-
from django.core.paginator import Paginator # 每一页要几条动态 cardNum = 4 paginator = Paginator(messages, cardNum) page_number = request.GET.get('page', 1) # 当前页码 n = int(page_number) # 总页码 totalNum = math.ceil(messages.count()/cardNum) - • 取最后一页的个数：
-
# 取最后一页的个数 if messages.count() % cardNum == 0: reNum = cardNum else: reNum = messages.count() % cardNum - • 接着，如果n==totalNum，也就是如果是最后一页的话，那就啥都不加，如果不是最后一页就是套上面的公式
-
if n == totalNum: addNum = 0 else: addNum = (totalNum - n) * cardNum - (cardNum - reNum) - • 在HTML添加模板语言就可以了，forloop.revcounter就是刚才的4321倒序的，|add就是加上，addNum：
-
<span>MESSAGE #{{ forloop.revcounter|add:addNum }}</span> - • 因为这里只介绍了卡片的序号在分页模式下的实现，没有分页器的代码，完整代码里会贴上
- • 完整代码：
- • HTML-分页器
-
<!-- 分页器--> {% if message %} <div class="pagination col-12 ta-anime-pagination mt-3"> {% if message.has_previous %} <a href="?page=1"> <i class="las la-angle-double-left"></i> </a>  <a href="?page={{ message.previous_page_number }}"> <i class="las la-angle-left"></i> </a>  {% endif %} {% for page in allPage %} {% if page == n %} <a href="?page={{ page }}"> <i class="las la-cookie-bite"></i> </a>  {% else %} <a href="?page={{ page }}">{{ page }}</a>  {% endif %} {% endfor %} {% if message.has_next %} <a href="?page={{ message.next_page_number }}"> <i class="las la-angle-right"></i> </a>  <a href="?page={{ message.paginator.num_pages }}"> <i class="las la-angle-double-right"></i> </a> {% endif %} </div> {% endif %} - • HTML-卡片序号
-
<span>MESSAGE #{{ forloop.revcounter|add:addNum }}</span> - • 后端方法
-
import json import uuid import math from json import dumps from django.core.paginator import Paginator from django.http import HttpResponse from django.shortcuts import render, redirect from townbase.models import * from townbase.views.method import * def message_view(request): # 留言数据 messages = Message.objects.filter(tree=0).order_by("-date_comment") # 留言回复数据 reply = Message.objects.exclude(tree=0).order_by("date_comment") # 每一页要几条动态 cardNum = 4 paginator = Paginator(messages, cardNum) page_number = request.GET.get('page', 1) # 当前页码 n = int(page_number) # 分页过的数据 message = paginator.get_page(n) # 总的页数，是个range allPage = page(n, paginator) # 总页码 totalNum = math.ceil(messages.count()/cardNum) # 取最后一页的个数 if messages.count() % cardNum == 0: reNum = cardNum else: reNum = messages.count() % cardNum if n == totalNum: addNum = 0 else: addNum = (totalNum - n) * cardNum - (cardNum - reNum) return render(request, 'block/message.html', locals())