前端实现

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>分页示例</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css">
</head>
<body>

<div id="dataContainer"></div>

<script src="../lib/jquery-1.9.1.min.js"></script>
<script src="../lib/bootstrap.min.js"></script>
<script src="../build/bootstrap-paginator.min.js"></script>
<script>
    let current = 1;
    const size = 3;

    function fetchData() {
        $.ajax({
            url: "/api/alarms",
            data: {
                page: current,
                pageSize: size,
                content: 'HUM',
                imei: '867726030890182'
            },
            dataType: "json",
            success: function (res) {
                console.log(res);
                $("#dataContainer").text(JSON.stringify(res.data, null, 2));
                initPaginator(current, Math.ceil(res.count / size), fetchData);
            }
        });
    }

    function initPaginator(currPage, totalPage, refreshFn) {
        $("#dataContainer").bootstrapPaginator({
            size: "small",
            alignment: "center",
            itemTexts: function (type) {
                const texts = {
                    first: "首页",
                    prev: "上一页",
                    next: "下一页",
                    last: "末页",
                    page: type === "page" ? arguments[1] : ""
                };
                return texts[type];
            },
            currentPage: currPage,
            totalPages: totalPage,
            onPageClicked: function (e, originalEvent, type, page) {
                current = page;
                refreshFn();
            }
        });
    }

    fetchData();
</script>
</body>
</html>

后端实现（基于 SQLAlchemy）

content = self.get_argument('content')
imei = self.get_argument('imei')
page = int(self.get_argument('page'))
page_size = int(self.get_argument('pageSize'))

# 构建查询
base_query = db_session.query(Alarm).filter(
    Alarm.content == content,
    Alarm.IMEI == imei
)

total = base_query.count()

# 分页数据：跳过 (page - 1) * page_size 条，取 page_size 条
offset = (page - 1) * page_size
paged_results = [
    {'warning': alarm.warning, 'createtime': alarm.createtime}
    for alarm in base_query
        .offset(offset)
        .limit(page_size)
        .all()
]

self.write(json.dumps({
    'code': 0,
    'data': paged_results,
    'count': total
}, cls=DatetimeEncoder, ensure_ascii=False))

该方案结合 SQLAlchemy 的 offset 与 limit 实现高效数据库分页，前端使用 Bootstrap Paginator 组件渲染分页控件，通过 AJAX 动态加载数据。