专栏首页python3python flask 的分页使用

python flask 的分页使用

1、views 如下示例代码:

@admin.route("/account/list/<int:page>/", methods=["GET"])
@admin_login_req
def account_list(page=None):
    if page is None:
        page = 1
    page_data = Account.query.order_by(
        Account.name.desc()
    ).paginate(page=page, per_page=10)
    return render_template('admin/account_list.html', page_data=page_data)

2、模板 account_list.html

{% extends 'admin/base.html' %}
{% import "admin/ui/admin_page.html" as pg %}

{% block css %}

{% endblock %}
{% block content %}

<div class="panel panel-default">
    <div class="panel-heading">
        查询条件
    </div>
    <div class='panel-body'>
        <div class="row">
            <form role="form">
                <div class="col-sm-6 col-md-6 col-lg-4">
                    <div class="form-group">
                        <div class="input-group">
                            <div class="input-group-addon">查找</div>
                            <input class="form-control" type="email">
                        </div>
                    </div>
                </div>
                <div class="col-lg-12">
                    <hr class="mt5 mb15">
                    <button type="submit" class="king-btn king-info">查询</button>
                    <a class="king-btn king-success" href="{{ url_for('admin.account_add') }}">添加账号</a>
                </div>

            </form>
        </div>
    </div>
</div>
<!---->
<div class="panel panel-default">
    <div class="panel-heading">
        带边框的表格
    </div>
    {% for msg in get_flashed_messages(category_filter=["ok"]) %}
    <div class="king-notice2 king-notice-success notice-borders">
        <i class="fa fa-check-circle"></i>
        <div class="notice-text">
            <p>{{ msg }}</p>
        </div>
    </div>
    {% endfor %}
    <div class='panel-body'>
        <div class="table-responsive">
            <table class="table table-bordered table-hover table-striped">
                <thead>
                <tr>
                    <th>名称</th>
                    <th>网站/IP</th>
                    <th>用户名</th>
                    <th>密码</th>
                    <th>备注</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                {% for v in page_data.items %}
                <tr>
                    <td>{{ v.name }}</td>
                    <td>{{ v.website }}</td>
                    <td>{{ v.username }}</td>
                    <td>{{ v.pwd }}</td>
                    <td>{{ v.comment }}</td>
                    <td>
                        <button type="submit" class="king-btn king-warning">编辑</button>
                        <a href="{{ url_for('admin.account_del', id=v.id) }}" type="submit"
                           class="king-btn king-danger">删除</a>
                    </td>
                </tr>
                {% endfor %}
                <tfoot>
                <tr>
                    <td colspan="6">
                        <div class="pagination-info pull-left">共有{{ page_data.total }}条,每页显示:{{ page_data.per_page }}条
                        </div>
                        <div class="pull-right king-page-box">
                            {{ pg.page(page_data, 'admin.account_list') }}
                        </div>
                    </td>
                </tr>
                </tfoot>
                </tbody>
            </table>
        </div>
    </div>
</div>

</div>
{% endblock %}

{% block js %}

{% endblock %}

3、admin_page.html  为分页的模板

{% macro page(data, url) -%}
{% if data %}
<ul class="pagination pagination-small pull-right">
    <li><a href="{{ url_for(url, page=1) }}">首页</a></li>

    {% if data.has_prev %}
    <li class="active"><a href="{{ url_for(url, page=data.prev_num) }}">上一页</a></li>
    {% else %}
    <li class="disabled"><a href="#">上一页</a></li>
    {% endif %}

    {% for v in data.iter_pages() %}
        {% if v == data.page %}
        <li class="active"><a>{{ v }}</a></li>
        {% else %}
        <li><a href="{{ url_for(url, page=v) }}">{{ v }}</a></li>
        {% endif %}
    {% endfor %}

    {% if data.has_next %}
        <li class="active"><a href="{{ url_for(url, page=data.next_num) }}">下一页</a></li>
    {% else %}
        <li class="disabled"><a href="#">下一页</a></li>
    {% endif %}

    <li><a href="{{ url_for(url, page=data.pages) }}">尾页</a></li>
</ul>
{% endif %}
{%- endmacro %}

flask-sqlalchemy 的分页参考文档 http://www.pythondoc.com/flask-sqlalchemy/api.html#id1

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • jQuery

    jQuery是目前使用最广泛的javascript函数库。据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库。微软公司甚至把jQuer...

    py3study
  • 一起学爬虫——使用xpath库爬取猫眼电

    之前分享了一篇使用requests库爬取豆瓣电影250的文章,今天继续分享使用xpath爬取猫眼电影热播口碑榜

    py3study
  • python UTC 与 本地时间互转

    最近在操作 MongoDB 时候出现了时区转换的问题,导致 Python 的时间对象存到 MongoDB 转成了 UTC 时间的格式,但是使用 Golang 查...

    py3study
  • PHP实现新型冠状病毒疫情实时图的实例

    砸漏
  • Jump Start Bootstrap 第4章

    JavaScript是网页上事实上的脚本语言。流行的网页功能,例如:漂亮的图片幻灯片、下拉菜单、弹出框等,都可以结合JavaScript和CSS实现。在这章,我...

    Remember_Ray
  • 发送短信倒计时(附带数据验证)##干货

    Happy、Liu
  • BootStrap应用开发学习入门1

    什么是字体图标? 答:字体图标是在 Web 项目中使用的图标字体,可以通过基于项目的 Bootstrap 来免费使用这些图标。

    WeiyiGeek
  • ASP.NET MVC使用Bootstrap系列(4)——使用JavaScript插件

    序言 Bootstrap的JavaScript插件是以JQuery为基础,提供了全新的功能并且还可以扩展现有的Bootstrap组件。通过添加data att...

    用户1161731
  • 基于web页面开发串口程序界面---html代码

    MiaoGIS
  • 电子规范管理系统(2)

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/hotqin888/article/det...

    hotqin888

扫码关注云+社区

领取腾讯云代金券