【Django】开发日报_5.1_Day：手机号码管理系统（3）

1、分页组件的封装

重新整理前端

后端：

def pretty_list(request):
    """靓号列表"""
    # for i in range(100):
    #     models.PrettyNum.objects.create(mobile="12332112311",price=10,level=1,status=1)

    # 搜索字典
    data_dict = {}
    value = request.GET.get("q", "")
    if value:
        data_dict["mobile__contains"] = value
    # 获取的列表按等级降序排列
    # select * from 表 order by level desc;
    # qureyset = models.PrettyNum.objects.all().order_by("-level")
    # 分页功能
    # 根据用户访问页码计算起始位置
    page = int(request.GET.get("page", 1))
    page_size = 10
    start = (page - 1) * page_size
    end = page * page_size

    qureyset = models.PrettyNum.objects.filter(**data_dict).order_by("-level")[start:end]
    # 生成页码代码
    """
                <li><a href="?page=1">1</a></li>
                <li><a href="?page=2">2</a></li>
                <li><a href="?page=3">3</a></li>
                <li><a href="?page=4">4</a></li>
                <li><a href="?page=5">5</a></li>
                ……
    """
    # 获取数据库中的数据条数
    total_count = models.PrettyNum.objects.filter(**data_dict).order_by("-level").count()
    # 总页数
    total_page_count, div = divmod(total_count, page_size)  # divmod除法函数，返回值：商，余数
    if div:
        total_page_count += 1
    # 设置按钮显示范围
    plus = 5
    if total_page_count <= 2 * plus + 1:
        start_page = 1
        end_page = total_page_coun + 1
    else:
        # 当前页小于5
        if page <= plus:
            start_page = 1
            end_page = 2 * plus + 1
        else:
            if (page + plus) > total_page_count:
                start_page = total_page_count - 2 * plus
                end_page = total_page_count
            else:
                start_page = page - plus
                end_page = page + plus + 1

    # 页码列表
    page_str_list = []
    # 首页
    page_str_list.append('<li><a href="?page={}">首页</a></li>'.format(1))
    # 上一页
    if page > 1:
        prev = '<li><a href="?page={}">上一页</a></li>'.format(page - 1)
    else:
        prev = '<li><a href="?page={}">上一页</a></li>'.format(1)
    page_str_list.append(prev)
    # 页码
    for i in range(start_page, end_page):  # range前取后不取，所以还要加一
        if i == page:  # 当前页显示按钮样式
            ele = '<li class="active"><a href="?page={}">{}</a></li>'.format(i, i)
        else:
            ele = '<li><a href="?page={}">{}</a></li>'.format(i, i)
        page_str_list.append(ele)
    # 下一页
    if page < total_page_count:
        prev = '<li><a href="?page={}">下一页</a></li>'.format(page + 1)
    else:
        prev = '<li><a href="?page={}">下一页</a></li>'.format(total_page_count)
    page_str_list.append(prev)
    # 尾页
    page_str_list.append('<li><a href="?page={}">尾页</a></li>'.format(total_page_count))
    # 输入框
    search_string = """
        <li>
                    <!--输入框组件-->
                    <form style="float: left;margin-left: -1px" method="get">
                            <input name="page"
                                   style="position: relative;float: left;display: inline-block;width: 80px;border-radius: 0;"
                                   type="text" class="form-control" placeholder="页码">
                            <button style="border-radius: 0" class="btn btn-default" type="submit">跳转</button>
                    </form>
                </li>
    """
    page_str_list.append(search_string)
    page_string = mark_safe("".join(page_str_list))
    return render(request, "pretty_list.html", {"qureyset": qureyset, "value": value, "page_string": page_string})

（1）新建目录和文件

app01-utils-pagination

 pagination.py

"""
【自定义分页组件】
以后如果想要复用这个分页组件，需要做的事情如下：
（1）在视图函数中
def pretty_list(request):
    #1、根据需求筛选数据
    queryset = models.PrettyNum.objects.all()
    #2、实例化分页对象
    page_object = Pagination(request,queryset)
    #参数字典
    contex = {
        "qureyset": page_object.page_queryset,  #分完页的数据
        "page_string": page_object.html(),      #生成的页码
    }
    #返回值
    return render(request, "pretty_list.html", contex)
（2）在html页面中
            处理数据
            {% for qurey in qureyset %}
                obj.xxx
            {% endfor %}
            分页样式
            <ul class="pagination">
                {
   
   { page_string }}
            </ul>
"""
from django.utils.safestring import mark_safe
class Pagination(object):
    def __init__(self,request,queryset,page_size=10,page_param="page",plus = 5):
        """

        :param request: 请求的对象
        :param queryset:符合条件的数据（根据这个数据给他进行分页处理）
        :param page_size:每页显示多少条数据
        :param page_param:在URL中传递的获取分页的参数，例如：/pretty/list/?page=1
        :param plus:显示当前页的前或后几页（页码）
        """
        #获取当前页
        page = request.GET.get(page_param,"1")
        #判断是否是十进制数
        if page.isdecimal():
            page=int(page)
        else:
            page=1

        self.page = page
        self.page_size = page_size

        self.start = (page - 1) * page_size
        self.end = page * page_size

        self.page_queryset = queryset[self.start:self.end]

        # 获取数据库中的数据条数
        total_count = queryset.count()
        # 总页数
        total_page_count, div = divmod(total_count, page_size)  # divmod除法函数，返回值：商，余数
        if div:
            total_page_count += 1
        self.total_page_count = total_page_count
        self.plus = plus

    def html(self):
        # 设置按钮显示范围
        if self.total_page_count <= 2 * self.plus + 1:
            start_page = 1
            end_page = self.total_page_count + 1
        else:
            # 当前页小于5
            if self.page <= self.plus:
                start_page = 1
                end_page = 2 * self.plus + 1
            else:
                if (self.page + self.plus) > self.total_page_count:
                    start_page = self.total_page_count - 2 * self.plus
                    end_page = self.total_page_count
                else:
                    start_page = self.page - self.plus
                    end_page = self.page + self.plus + 1

        # 页码列表
        page_str_list = []
        # 首页
        page_str_list.append('<li><a href="?page={}">首页</a></li>'.format(1))
        # 上一页
        if self.page > 1:
            prev = '<li><a href="?page={}">上一页</a></li>'.format(self.page - 1)
        else:
            prev = '<li><a href="?page={}">上一页</a></li>'.format(1)
        page_str_list.append(prev)
        # 页码
        for i in range(start_page, end_page):  # range前取后不取，所以还要加一
            if i == self.page:  # 当前页显示按钮样式
                ele = '<li class="active"><a href="?page={}">{}</a></li>'.format(i, i)
            else:
                ele = '<li><a href="?page={}">{}</a></li>'.format(i, i)
            page_str_list.append(ele)
        # 下一页
        if self.page < self.total_page_count:
            prev = '<li><a href="?page={}">下一页</a></li>'.format(self.page + 1)
        else:
            prev = '<li><a href="?page={}">下一页</a></li>'.format(self.total_page_count)
        page_str_list.append(prev)
        # 尾页
        page_str_list.append('<li><a href="?page={}">尾页</a></li>'.format(self.total_page_count))
        # 输入框
        search_string = """
                <li>
                            <!--输入框组件-->
                            <form style="float: left;margin-left: -1px" method="get">
                                    <input name="page"
                                           style="position: relative;float: left;display: inline-block;width: 80px;border-radius: 0;"
                                           type="text" class="form-control" placeholder="页码">
                                    <button style="border-radius: 0" class="btn btn-default" type="submit">跳转</button>
                            </form>
                        </li>
            """
        page_str_list.append(search_string)
        page_string = mark_safe("".join(page_str_list))
        return page_string

views.py

def pretty_list(request):
    """靓号列表"""
    # 搜索字典
    data_dict = {}
    value = request.GET.get("q", "")
    if value:
        data_dict["mobile__contains"] = value
    #获取查找值
    queryset = models.PrettyNum.objects.filter(**data_dict).order_by("-level")
    # 分页组件类实例化
    page_object = Pagination(request,queryset)
    #参数字典
    contex = {
        "value": value,#数据库搜索值
        "qureyset": page_object.page_queryset,#分完页的数据
        "page_string": page_object.html(),#生成的页码
    }
    return render(request, "pretty_list.html", contex)

pretty_list.html

<!--分页组件-->
        <div class="clearfix">
            <ul class="pagination">
                {
   
   { page_string }}
            </ul>
        </div>

(2)修改BUG

 分页功能保留搜索条件

Pagination.py

"""
【自定义分页组件】
以后如果想要复用这个分页组件，需要做的事情如下：
（1）在视图函数中
def pretty_list(request):
    #1、根据需求筛选数据
    queryset = models.PrettyNum.objects.all()
    #2、实例化分页对象
    page_object = Pagination(request,queryset)
    #参数字典
    contex = {
        "qureyset": page_object.page_queryset,  #分完页的数据
        "page_string": page_object.html(),      #生成的页码
    }
    #返回值
    return render(request, "pretty_list.html", contex)
（2）在html页面中
            处理数据
            {% for qurey in qureyset %}
                obj.xxx
            {% endfor %}
            分页样式
            <ul class="pagination">
                {
   
   { page_string }}
            </ul>
"""
from django.utils.safestring import mark_safe
class Pagination(object):
    def __init__(self,request,queryset,page_size=10,page_param="page",plus = 5):
        """

        :param request: 请求的对象
        :param queryset:符合条件的数据（根据这个数据给他进行分页处理）
        :param page_size:每页显示多少条数据
        :param page_param:在URL中传递的获取分页的参数，例如：/pretty/list/?page=1
        :param plus:显示当前页的前或后几页（页码）
        """
        #获取URL
        from django.http.request import QueryDict
        import copy
        query_dict = copy.deepcopy(request.GET)
        query_dict._mutable = True
        self.query_dict = query_dict
        self.page_param = page_param
        #获取当前页
        page = request.GET.get(page_param,"1")
        #判断是否是十进制数
        if page.isdecimal():
            page=int(page)
        else:
            page=1

        self.page = page
        self.page_size = page_size

        self.start = (page - 1) * page_size
        self.end = page * page_size

        self.page_queryset = queryset[self.start:self.end]

        # 获取数据库中的数据条数
        total_count = queryset.count()
        # 总页数
        total_page_count, div = divmod(total_count, page_size)  # divmod除法函数，返回值：商，余数
        if div:
            total_page_count += 1
        self.total_page_count = total_page_count
        self.plus = plus

    def html(self):
        # 设置按钮显示范围
        if self.total_page_count <= 2 * self.plus + 1:
            start_page = 1
            end_page = self.total_page_count + 1
        else:
            # 当前页小于5
            if self.page <= self.plus:
                start_page = 1
                end_page = 2 * self.plus + 1
            else:
                if (self.page + self.plus) > self.total_page_count:
                    start_page = self.total_page_count - 2 * self.plus
                    end_page = self.total_page_count
                else:
                    start_page = self.page - self.plus
                    end_page = self.page + self.plus + 1

        # 页码列表
        page_str_list = []
        #获取url全部参数
        self.query_dict.setlist(self.page_param,[1])
        # 首页
        page_str_list.append('<li><a href="?{}">首页</a></li>'.format(self.query_dict.urlencode()))
        # 上一页
        if self.page > 1:
            self.query_dict.setlist(self.page_param, [self.page - 1])
            prev = '<li><a href="?{}">上一页</a></li>'.format(self.query_dict.urlencode())
        else:
            self.query_dict.setlist(self.page_param, [1])
            prev = '<li><a href="?{}">上一页</a></li>'.format(self.query_dict.urlencode())
        page_str_list.append(prev)
        # 页码
        for i in range(start_page, end_page):  # range前取后不取，所以还要加一
            self.query_dict.setlist(self.page_param, [i])
            if i == self.page:  # 当前页显示按钮样式
                ele = '<li class="active"><a href="?{}">{}</a></li>'.format(self.query_dict.urlencode(), i)
            else:
                ele = '<li><a href="?{}">{}</a></li>'.format(self.query_dict.urlencode(), i)
            page_str_list.append(ele)
        # 下一页
        if self.page < self.total_page_count:
            self.query_dict.setlist(self.page_param, [self.page + 1])
            prev = '<li><a href="?{}">下一页</a></li>'.format(self.query_dict.urlencode())
        else:
            self.query_dict.setlist(self.page_param, [self.total_page_count])
            prev = '<li><a href="?{}">下一页</a></li>'.format(self.query_dict.urlencode())
        page_str_list.append(prev)
        # 尾页
        self.query_dict.setlist(self.page_param, [self.total_page_count])
        page_str_list.append('<li><a href="?{}">尾页</a></li>'.format(self.query_dict.urlencode()))
        # 输入框
        search_string = """
                <li>
                            <!--输入框组件-->
                            <form style="float: left;margin-left: -1px" method="get">
                                    <input name="page"
                                           style="position: relative;float: left;display: inline-block;width: 80px;border-radius: 0;"
                                           type="text" class="form-control" placeholder="页码">
                                    <button style="border-radius: 0" class="btn btn-default" type="submit">跳转</button>
                            </form>
                        </li>
            """
        page_str_list.append(search_string)
        page_string = mark_safe("".join(page_str_list))
        return page_string