利用Flask搭建微电影视频网站（八）：预告管理

2018-09-11 本文已影响35人啃饼小白

关于博主

努力与运动兼备～~~有任何问题可以加我好友或者关注微信公众号，欢迎交流，我们一起进步！

                                      微信公众号:  啃饼思录

                                    QQ: 2810706745（啃饼小白）

写在前面

本篇笔记，我们介绍预告管理，这个和前面介绍的标签管理差不多，话不多说，开始学习吧。

本篇笔记对应上传的仓库为:https://github.com/licheetools/movie对应第八篇。

预告管理

包括添加预告和预告列表这两个模块，下面我们先介绍添加预告这个功能的实现。

使用到的内容

我们将使用到的内容有：
模型：Preview
表单: PreviewForm
请求方法: GET ,POST
访问控制: @admin_login_req

1、添加表单验证字段

打开forms.py，我们定义Form字段，注意因为是预告添加模块，所以对应的html页面就是preview_add.html，而且我们在forms.py里面定义的字段必须与preview_add.html里面的保持一致！（如果觉得不是很容易看出来，可以运行项目，直接访问preview_add.html页面，这样明显多了！）

# 添加预告
class PreviewForm(FlaskForm):
    title = StringField(
        label="预告标题",
        validators=[
            DataRequired("预告标题不能为空")
        ],
        description="预告标题",
        render_kw={
            "class": "form-control",
            "id": "input_title",
            "placeholder": "请输入预告标题！！"
        }
    )
    logo = FileField(
        label="预告封面",
        validators=[
            DataRequired("请上传预告封面！")
        ],
        description="预告封面",
    )
    submit = SubmitField(
        '编辑',
        render_kw={
            "class": "btn btn-primary",
        }
    )

2、准备页面渲染字段

打开admin/views.py文件，我们修改preview_add函数：

from app.admin.forms import PreviewForm
from app.models import Preview

# 上映预告列表
@admin.route('/preview/add')
@admin_login_req
def preview_add():
    form = PreviewForm()
    return render_template("admin/preview_add.html", form=form)

3、后台页面传值显示以及操作信息提示

可以仿照前面的movie_add.html来修改preview_add.html:

记得在submit的上面添加{{ form.csrf_token }}，还有form提交的方法以及上传文件类别：

  <form role="form" method="post" enctype="multipart/form-data">

4、后台页面错误信息提示

打开preview_add.html页面，我们同样可以仿照movie_add.html来进行修改：

{% for err in form.title.errors %}
<div class="col-md-12">
<p style="color:red">{{ err }}</p>
</div>
{% endfor %}

5、为视图函数添加方法

# 上映预告添加
@admin.route('/preview/add', methods=["GET", "POST"])
@admin_login_req
def preview_add():
    return render_template("admin/preview_add.html")

6、修改预告添加函数

# 上映预告添加
@admin.route('/preview/add', methods=["GET", "POST"])
@admin_login_req
def preview_add():
    form = PreviewForm()
    if form.validate_on_submit():
        data = form.data
        file_logo = secure_filename(form.logo.data.filename)
        if not os.path.exists(app.config["UP_DIR"]):  # 如果文件夹不存在
            os.makedirs(app.config["UP_DIR"])  # 新建对应的文件夹
            os.chmod(app.config["UP_DIR"], "rw")  # 给文件夹赋予读写的权限
        logo = change_filename(file_logo)
        # 把他们进行保存到文件夹下面
        form.logo.data.save(app.config["UP_DIR"] + logo)
        # 之后的url和logo就是我们修改之后的地址
        preview = Preview(
            title=data["title"],
            logo=logo,
        )
        db.session.add(preview)
        db.session.commit()
        flash("添加预告成功！", "ok")
        return redirect(url_for("admin.preview_add"))
    return render_template("admin/preview_add.html", form=form)

然后运行一下我们的manage.py文件，就可以去后台添加我们的上映预告了。

预告列表的配置

打开我们的views.py文件，我们参考之前的电影列表的配置，对预告列表进行配置：

# 上映预告列表
@admin.route('/preview/list/<int:page>/', methods=["GET"])
@admin_login_req
def preview_list(page=None):
    if page is None:
        page = 1
    # 查询的时候关联标签，采用join来加进去,多表关联用filter,过滤用filter_by
    page_data = Preview.query.order_by(
        Preview.addtime.desc()
    ).paginate(page=page, per_page=10)
    return render_template("admin/preview_list.html", page_data=page_data)

接着去我们的grid.html页面添加page参数（page=1），记住所以的列表都要有一个初始页，也就是说肯定有一个页面去显示，就算没有数据也要有页面，否则就是404嘛，这既然不是404，就得有个页面，空的页面也是可以的：

然后我们打开preview_list.html页面，进行for循环的填充：

接着就是分页功能了，我们参考之前在电影列表页面的配置，打开preview_list.html：

<ul class="pagination pagination-sm no-margin pull-right">
                            <li><a href="#">首页</a></li>
                            <li><a href="#">上一页</a></li>
                            <li><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">下一页</a></li>
                            <li><a href="#">尾页</a></li>
 </ul>

去掉上面一段代码，我们在开头导入刚才的admin_page.html文件，然后开始调用：

{% import "ui/admin_page.html" as pg %}

将下面的代码填充你刚才删除的那段的位置：

{{ pg.page(page_data, "admin.preview_list") }}

然后运行一下我们的manage.py发现图片太大了，我们可以限制一下它的大小：

刷新一下，这样就好多了：

至此，关于预告列表的介绍就到此为止了！接下来是预告的删除和编辑！

预告的删除

打开views.py文件，我们在预告列表的下面新增以下代码：

# 预告删除
@admin.route('/preview/del/<int:id>', methods=["GET"])
@admin_login_req
def preview_del(id=None):
    preview = Preview.query.get_or_404(int(id))
    db.session.delete(preview)
    db.session.commit()
    flash("预告删除成功！", "ok")
    return redirect(url_for("admin.preview_list", page=1))

接着打开preview_list.html页面，我们复制提示成功的代码：

 {% for msg in get_flashed_messages(category_filter=["ok"]) %}
 <div class="alert alert-success alert-dismissible">
     <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×
 </button>
    <h4><i class="icon fa fa-check"></i> 操作成功</h4>
   {{ msg }}
  </div>
 {% endfor %}

放在这个位置：

<div class="box-body table-responsive no-padding">

....
</div>

然后打开preview_list.html页面，修改删除的跳转链接：

<a href="{{ url_for('admin.preview_del', id=v.id) }}" class="label label-danger">删除</a>

然后就可以测试你的项目了！

预告的编辑