使用 Python 从 0 开发属于你的个人管理系统 18 篇 ｜ 任务列表展示优化与分页的实现
现在我们已经实现了任务计划功能的最基本功能，接下来我们来优化一下任务列表的展示以及分页功能的实现。
之前我们对于任务列表的数据是在前端做判断，从而展示「已完成」和「任务列表」，而更好的方式是在后端直接返回相应的数据。
优化展示
在数据库模型创建的时候，我们已经将用户和任务数据表进行了关联，那么现在要通过 is_done 来获取任务列表数据就可以这样：
@app.route('/todolist/<int:is_done>/', methods=['GET', 'POST'])
def todolist(is_done):
user = User.query.filter_by(id=session['user_id']).first_or_404()
todos = Todo.query.with_parent(user).filter_by(is_done=is_done)
在前端 html 中，我们可以把任务的时间加上：
<div class="col">
<div class="h5 mb-0 font-weight-bold text-gray-800">{{ todo.description }}</div>
<div class="h8 mb-0 text-gray-600">{{ todo.create_time }}</div>
</div>
这样就显得清晰一些了：
但在已完成列表中，我们可以做一个判断，显示完成时间，并且把文字加上 del 样式：
{% elif is_done==1 %}
<div class="col">
<div class="h5 mb-0 font-weight-bold text-gray-800"><del>{{ todo.description }}</del></div>
<div class="h8 mb-0 text-gray-600">{{ todo.done_time }}</div>
</div>
<div class="col-auto">
<input type="checkbox" data-todo-id="{{ todo.id }}" class="btn-check" id="btn-check-outlined"
autocomplete="off" checked>
</div>
{% endif %}
效果如下：
分页功能
那么如果用户添加了很多任务，这时候总不能让用户一直用鼠标滚动吧，所以我们可以在页面中添加分页功能。
首先我们可以在
本文隐藏内容 登陆 后才可以浏览
这里主要是讲页数和任务状态传过去后端获取数据。
运行起来吧：
可以看到，我们的分页功能就实现啦！下回见，peace！
