1. 程式人生 > 實用技巧 >276 Flask學習【第05篇】:用Falsk實現的分頁

276 Flask學習【第05篇】:用Falsk實現的分頁

一、flask實現的分頁元件

from urllib.parse import urlencode,quote,unquote
class Pagination(object):
    """
    自定義分頁
    """
    def __init__(self,current_page,total_count,base_url,params,per_page_count=10,max_pager_count=11):
        try:
            current_page = int(current_page)
        except Exception as e:
            current_page 
= 1 if current_page <=0: current_page = 1 self.current_page = current_page # 資料總條數 self.total_count = total_count
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 每頁顯示10條資料</span>
    self.per_page_count =<span style="color: rgba(0, 0, 0, 1)"> per_page_count

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 頁面上應該顯示的最大頁碼</span>
    max_page_num, div =<span style="color: rgba(0, 0, 0, 1)"> divmod(total_count, per_page_count)
    </span><span style="color: rgba(0, 0, 255, 1)">if</span><span style="color: rgba(0, 0, 0, 1)"> div:
        max_page_num </span>+= 1<span style="color: rgba(0, 0, 0, 1)">
    self.max_page_num </span>=<span style="color: rgba(0, 0, 0, 1)"> max_page_num

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 頁面上預設顯示11個頁碼(當前頁在中間)</span>
    self.max_pager_count =<span style="color: rgba(0, 0, 0, 1)"> max_pager_count
    self.half_max_pager_count </span>= int((max_pager_count - 1) / 2<span style="color: rgba(0, 0, 0, 1)">)

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> URL字首</span>
    self.base_url =<span style="color: rgba(0, 0, 0, 1)"> base_url

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> request.GET</span>
    <span style="color: rgba(0, 0, 255, 1)">import</span><span style="color: rgba(0, 0, 0, 1)"> copy
    params </span>=<span style="color: rgba(0, 0, 0, 1)"> copy.deepcopy(params)
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> params._mutable = True</span>
    get_dict =<span style="color: rgba(0, 0, 0, 1)"> params.to_dict()
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 包含當前列表頁面所有的搜/索條件</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> {source:[2,], status:[2], gender:[2],consultant:[1],page:[1]}</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> self.params[page] = 8</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> self.params.urlencode()</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> source=2&amp;status=2&amp;gender=2&amp;consultant=1&amp;page=8</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> href="/hosts/?source=2&amp;status=2&amp;gender=2&amp;consultant=1&amp;page=8"</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> href="%s?%s" %(self.base_url,self.params.urlencode())</span>
    self.params =<span style="color: rgba(0, 0, 0, 1)"> get_dict

@property
</span><span style="color: rgba(0, 0, 255, 1)">def</span><span style="color: rgba(0, 0, 0, 1)"> start(self):
    </span><span style="color: rgba(0, 0, 255, 1)">return</span> (self.current_page - 1) *<span style="color: rgba(0, 0, 0, 1)"> self.per_page_count

@property
</span><span style="color: rgba(0, 0, 255, 1)">def</span><span style="color: rgba(0, 0, 0, 1)"> end(self):
    </span><span style="color: rgba(0, 0, 255, 1)">return</span> self.current_page *<span style="color: rgba(0, 0, 0, 1)"> self.per_page_count

</span><span style="color: rgba(0, 0, 255, 1)">def</span><span style="color: rgba(0, 0, 0, 1)"> page_html(self):
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 如果總頁數 &lt;= 11</span>
    <span style="color: rgba(0, 0, 255, 1)">if</span> self.max_page_num &lt;=<span style="color: rgba(0, 0, 0, 1)"> self.max_pager_count:
        pager_start </span>= 1<span style="color: rgba(0, 0, 0, 1)">
        pager_end </span>=<span style="color: rgba(0, 0, 0, 1)"> self.max_page_num
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 如果總頁數 &gt; 11</span>
    <span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
        </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 如果當前頁 &lt;= 5</span>
        <span style="color: rgba(0, 0, 255, 1)">if</span> self.current_page &lt;=<span style="color: rgba(0, 0, 0, 1)"> self.half_max_pager_count:
            pager_start </span>= 1<span style="color: rgba(0, 0, 0, 1)">
            pager_end </span>=<span style="color: rgba(0, 0, 0, 1)"> self.max_pager_count
        </span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
            </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 當前頁 + 5 &gt; 總頁碼</span>
            <span style="color: rgba(0, 0, 255, 1)">if</span> (self.current_page + self.half_max_pager_count) &gt;<span style="color: rgba(0, 0, 0, 1)"> self.max_page_num:
                pager_end </span>=<span style="color: rgba(0, 0, 0, 1)"> self.max_page_num
                pager_start </span>= self.max_page_num - self.max_pager_count + 1   <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)">倒這數11個</span>
            <span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
                pager_start </span>= self.current_page -<span style="color: rgba(0, 0, 0, 1)"> self.half_max_pager_count
                pager_end </span>= self.current_page +<span style="color: rgba(0, 0, 0, 1)"> self.half_max_pager_count

    page_html_list </span>=<span style="color: rgba(0, 0, 0, 1)"> []
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> {source:[2,], status:[2], gender:[2],consultant:[1],page:[1]}</span>
    <span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 首頁</span>
    self.params[<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">'</span>] = 1<span style="color: rgba(0, 0, 0, 1)">
    first_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li&gt;&lt;a href="%s?%s"&gt;首頁&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url,urlencode(self.params),)
    page_html_list.append(first_page)
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 上一頁</span>
    self.params[<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">"</span>] = self.current_page - 1
    <span style="color: rgba(0, 0, 255, 1)">if</span> self.params[<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">"</span>] &lt; 1<span style="color: rgba(0, 0, 0, 1)">:
        pervious_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li class="disabled"&gt;&lt;a href="%s?%s" aria-label="Previous"&gt;上一頁&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url, urlencode(self.params))
    </span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
        pervious_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li&gt;&lt;a href = "%s?%s" aria-label = "Previous" &gt;上一頁&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> ( self.base_url, urlencode(self.params))
    page_html_list.append(pervious_page)
    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 中間頁碼</span>
    <span style="color: rgba(0, 0, 255, 1)">for</span> i <span style="color: rgba(0, 0, 255, 1)">in</span> range(pager_start, pager_end + 1<span style="color: rgba(0, 0, 0, 1)">):
        self.params[</span><span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">'</span>] =<span style="color: rgba(0, 0, 0, 1)"> i
        </span><span style="color: rgba(0, 0, 255, 1)">if</span> i ==<span style="color: rgba(0, 0, 0, 1)"> self.current_page:
            temp </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li class="active"&gt;&lt;a href="%s?%s"&gt;%s&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url,urlencode(self.params), i,)
        </span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
            temp </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li&gt;&lt;a href="%s?%s"&gt;%s&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url,urlencode(self.params), i,)
        page_html_list.append(temp)

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 下一頁</span>
    self.params[<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">"</span>] = self.current_page + 1
    <span style="color: rgba(0, 0, 255, 1)">if</span> self.params[<span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">"</span>] &gt;<span style="color: rgba(0, 0, 0, 1)"> self.max_page_num:
        self.params[</span><span style="color: rgba(128, 0, 0, 1)">"</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">"</span>] =<span style="color: rgba(0, 0, 0, 1)"> self.current_page
        next_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li class="disabled"&gt;&lt;a href = "%s?%s" aria-label = "Next"&gt;下一頁&lt;/span&gt;&lt;/a&gt;&lt;/li &gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url, urlencode(self.params))
    </span><span style="color: rgba(0, 0, 255, 1)">else</span><span style="color: rgba(0, 0, 0, 1)">:
        next_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li&gt;&lt;a href = "%s?%s" aria-label = "Next"&gt;下一頁&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url, urlencode(self.params))
    page_html_list.append(next_page)

    </span><span style="color: rgba(0, 128, 0, 1)">#</span><span style="color: rgba(0, 128, 0, 1)"> 尾頁</span>
    self.params[<span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">page</span><span style="color: rgba(128, 0, 0, 1)">'</span>] =<span style="color: rgba(0, 0, 0, 1)"> self.max_page_num
    last_page </span>= <span style="color: rgba(128, 0, 0, 1)">'</span><span style="color: rgba(128, 0, 0, 1)">&lt;li&gt;&lt;a href="%s?%s"&gt;尾頁&lt;/a&gt;&lt;/li&gt;</span><span style="color: rgba(128, 0, 0, 1)">'</span> %<span style="color: rgba(0, 0, 0, 1)"> (self.base_url, urlencode(self.params),)
    page_html_list.append(last_page)

    </span><span style="color: rgba(0, 0, 255, 1)">return</span> <span style="color: rgba(128, 0, 0, 1)">''</span>.join(page_html_list)</pre>

二、使用元件

#!usr/bin/env python
# -*- coding:utf-8 -*-
from flask import Flask,render_template,request,redirect
from pager import Pagination
from urllib.parse import urlencode
app = Flask(__name__)

=========================django的用法=======================================
# pager_obj = Pagination(request.GET.get('page', 1), len(HOST_LIST), request.path_info, request.GET)
# host_list = HOST_LIST[pager_obj.start:pager_obj.end] # html = pager_obj.page_html() # return render(request, 'hosts.html', {'host_list': host_list, "page_html": html}) @app.route('/pager') def pager(): li = [] for i in range(1,100): li.append(i) # print(li)
  
  ===================================flask的用法=============================== pager_obj = Pagination(request.args.get("page",1),len(li),request.path,request.args,per_page_count=10) # print(request.args) index_list = li[pager_obj.start:pager_obj.end] html = pager_obj.page_html() return render_template("pager.html",index_list=index_list, html = html,condition=path)

if name == 'main':
app.run(debug
=True)

pager.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width">
    <title>Title</title>
    <link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <style>
        .container{
            margin-top: 20px;
        }
    </style>
</head>
<body>
<div class="container">
    <a href="/add?{{ condition }}"><button class="btn btn-primary">新增</button></a>
    <div class="row " style="margin-top: 10px">
            <ul>
                {% for foo in index_list %}
                    <li>{{ foo }}</li>
                {% endfor %}
            </ul>
            <nav aria-label="Page navigation" class="pull-right">
                <ul class="pagination">
                    {{ html|safe }}
                </ul>
            </nav>
    </div>
</div>
</body>
</html>