会员中心页面，如下图所示

用户登录后，修改密码页面，如下图所示

用户查看自己的评论页面，如下图所示

用户查看自己的登录日志页面，如下图所示

用户查看自己收藏的电影的页面，如下图所示

1. 定义用户主页面左侧部分

在上面的图片里，可以看到，整个页面的顶部和左侧都是一样的

在之前，已经把顶部部分单独定义在templates目录的home目录下

这里可以把用户主页的左侧也单独定义一个文件menu.html，然后让包含左侧部分的页面引入menu.html页面

menu.html页面的内容：

    
    
     
        
                   会员中心                
                   修改密码                
                   评论记录                
                   登录日志                
                   收藏电影            
     
    

2. 定义用户登录后的主页面代码

2.1 在home目录下的forms.py文件中，定义用户主页显示用户详细信息的表单类UserdetailForm

可以通过调用UserdetailForm表单类直接在前端页面上渲染生成用户详细信息的字段标签

from flask_wtf import FlaskFormfrom wtforms.fields import StringField, PasswordField, SubmitField, FileField, TextAreaFieldfrom wtforms.validators import DataRequired, EqualTo, Email, Regexp, ValidationErrorfrom app.models import Userclass UserdetailForm(FlaskForm):    name = StringField(        label="呢称",        validators=[            DataRequired("请输入呢称！")        ],        description="呢称",        render_kw={            "class": "form-control",            "placeholder": "请输入呢称！"        }    )    email = StringField(        label="邮箱",        validators=[            DataRequired("请输入邮箱！"),            Email("邮箱的格式不正确，请重新输入！")        ],        description="邮箱",        render_kw={            "class": "form-control",            "placeholder": "请输入邮箱！"        }    )    phone = StringField(        label="手机号",        validators=[            DataRequired("请输入手机号！"),            Regexp("1[34578]\\d{9}", message="输入的手机号格式不正确！"),        ],        description="手机号",        render_kw={            "class": "form-control",            "placeholder": "请输入手机号！"        }    )    face = FileField(        label="头像",        validators=[            DataRequired("请上传头像！")        ],        description="头像"    )    info = TextAreaField(        label="简介",        validators=[            DataRequired("请输入简介！")        ],        description="简介",        render_kw={            "class": "form-control",            "rows": "10"        }    )    submit = SubmitField(        "保存修改",        render_kw={            "class": "btn btn-success",        }    )

2.2 定义用户主页面的视图函数user

@home.route("/user/", methods=['GET', 'POST'])def user():    form = UserdetailForm()    user = User.query.get(int(session.get("user_id")))    form.face.validators = []    if request.method == 'GET':        form.name.data = user.name        form.email.data = user.email        form.phone.data = user.phone        form.info.data = user.info    if form.validate_on_submit():        data = form.data        file_face = secure_filename(form.face.data.filename)        if not os.path.exists(app.config['FC_DIR']):            os.makedirs(app.config['FC_DIR'])            os.chmod(app.config['FC_DIR'])        user.face = change_filename(file_face)        form.face.data.save(app.config['FC_DIR'] + user.face)        name_count = User.query.filter_by(name=data.get("name")).count()        if data.get("name") != user.name and name_count == 1:            flash("用户名已经存在,请重新输入！", "err")            return redirect(url_for("home.user"))        email_count = User.query.filter_by(email=data.get("email")).count()        if data.get("email") != user.email and email_count == 1:            flash("邮箱已经存在，请重新输入！", "err")            return redirect(url_for("home.user"))        phone_count = User.query.filter_by(phone=data.get('phone')).count()        if data.get("phone") != user.phone and phone_count == 1:            flash("手机号已经存在，请重新输入！", "err")            return redirect(url_for("home.user"))        user.name = data.get("name")        user.email = data.get("email")        user.phone = data.get("phone")        user.info = data.get("info")        db.session.add(user)        db.session.commit()        flash("修改已经保存！", "ok")        return redirect(url_for("home.user"))    return render_template("home/user.html", form=form, user=user)

2.3 定义用户主页的前端页面

{% extends "home/home.html" %}{% block css %}    {% endblock %}{% block content %}    {% include "home/menu.html" %}    
    
        
     
            
      
                
       
 会员中心
            
      
            
      
                
                       {% for msg in get_flashed_messages(category_filter=["err"]) %}                    
       
{
   { msg }}
                {% endfor %}                {% for msg in get_flashed_messages(category_filter=["ok"]) %}                    
       
{
   { msg }}
                {% endfor %}                
       
                    
        
                        
         
 
           { { form.name.label }} { { form.name }} 
         
                        
                                 {% for err in form.name.errors %}                            
         
 
          { { err }} 
         
                        {% endfor %}                        
         
 
           { { form.email.label }} { { form.email }} 
         
                        
                                 {% for err in form.email.errors %}                            
         
 
          { { err }} 
         
                        {% endfor %}                        
         
 
           { { form.phone.label }} { { form.phone }} 
         
                        
                                 {% for err in form.phone.errors %}                            
         
 
          { { err }} 
         
                        {% endfor %}                        
         
 
           { { form.face.label }} { { form.face }} {% if user.face %} 
           {% else %} 
           {% endif %} 
         
                        
                                 {% for err in form.face.errors %}                            
         
 
          { { err }} 
         
                        {% endfor %}                        
         
 
           { { form.info.label }} { { form.info }} 
         
                        
                                 {% for err in form.info.errors %}                            
         
 
          { { err }} 
         
                        {% endfor %}                        {
   { form.csrf_token }}                        {
   { form.submit }}                    
        
                
       
            
      
        
     
    
    
{% endblock %}{% block js %}    {% endblock %}

3. 定义用户修改密码的页面代码

3.1 在home目录下的forms.py文件中，定义用户修改密码的表单类PwdForm

可以通过调用PwdForm表单类直接在前端页面上渲染生成用户修改密码需要的字段标签

from flask_wtf import FlaskFormfrom wtforms.fields import StringField, PasswordField, SubmitField, FileField, TextAreaFieldfrom wtforms.validators import DataRequired, EqualTo, Email, Regexp, ValidationErrorclass PwdForm(FlaskForm):    old_pwd = PasswordField(        label="旧密码",        validators=[            DataRequired("请输入旧密码!")        ],        description="旧密码",        render_kw={            "class": "form-control",            "placeholder": "请输入旧密码!"        }    ),    new_pwd = PasswordField(        label="新密码",        validators=[            DataRequired("请输入新密码!")        ],        description="新密码",        render_kw={            "class": "form-control",            "placeholder": "请输入新密码!"        }    )    submit = SubmitField(        "修改密码",        render_kw={            "class": "btn btn-success"        }    )

3.2 定义用户修改密码的视图函数pwd

@home.route("/pwd/", methods=['GET', 'POST'])def pwd():    form = PwdForm()    if form.validate_on_submit():        data = form.data        user = User.query.filter_by(name=session.get("user")).first()        if not user.check_pwd(data.get("pwd")):            flash("旧密码输入错误，请重新输入！", "err")            return redirect(url_for("home.pwd"))        from werkzeug.security import generate_password_hash        user.pwd = generate_password_hash(data.get("new_pwd"))        db.session.add(user)        db.session.commit()        flash("修改密码成功，请重新登录！", "ok")        return redirect(url_for("home.logout"))    return render_template("home/pwd.html", form=form)

3.3 定义用户修改密码的前端页面的代码

{% extends "home/home.html" %}{% block content %}{% block css %}{% endblock%}{% include "home/menu.html" %}
    
        
     
            
      
                
       
 会员中心
            
      
            
      
                
       
                    
        
                            
         
 
           旧密码 
           
         
                            
         
                            
         
 
           新密码 
           
         
                            
         
                            
          修改密码                        
        
                
       
            
      
        
     
    
    
{% endblock %}{% block js %}{% endblock %}

4. 定义用户查看自己评论的页面代码

4.1 定义用户查看自己评论的视图函数

由于每个用户的电影评论数可能有很多，这许多的评论不可能在一个页面上全部显示完成，所以要进行分页，默认显示第一页的评论内容

@home.route("/comments/
    
     /")def comments(page=None):    if page is None:        page = 1    page_data = Comment.query.join(Movie).join(User).filter(        Movie.id == Comment.movie_id,        User.id == session["user_id"]    ).order_by(Comment.id).paginate(page=page, per_page=10)    return render_template("home/comments.html", page_data=page_data)
    

4.2 定义用户查看自己的评论的前端页面代码

{% extends "home/home.html" %}{% import "ui/home_page.html" as pg %}{% block css %}    {% endblock %}{% block content %}    {% include "home/menu.html" %}    
    
        
     
            
      
                
       
 评论记录
            
      
            
      
                
       
                            {% for v in page_data.items %}                        
        
                                                            
         
 
          
 
           
 
            { { v.user.name }} 评论于 
            { { v.addtime }} 
           
 
          
 
          
 
           
{ { v.content | safe }}
 
          
 
         
                        
                    {% endfor %}                
       
                
       
                            {
   { pg.page(page_data,'home.comments') }}                
       
            
      
        
     
    
    
{% endblock %}{% block js %}    {% endblock %}

5. 定义用户登录日志部分代码

5.1 定义用户查看自己的登录日志的视图函数

每个用户登录的次数可以有很多，所以要进行分页，默认显示第一页的登录日志

@home.route("/loginlog/
    
     /", methods=['GET'])def loginlog(page=None):    if page is None:        page = 1    page_data = Userlog.query.filter_by(user_id=int(session.get("user_id"))).order_by(        Userlog.id    ).paginate(page=page, per_page=10)    return render_template("home/loginlog.html", page_data=page_data)
    

5.2 定义用户查看自己的登录日志的前端页面代码

{% extends "home/home.html" %}{% import "ui/home_page.html" as pg %}{% block css %}    {% endblock %}{% block content %}    {% include "home/menu.html" %}    
    
        
     
            
      
                
       
 登录日志
            
      
            
      
                
       
                    {% for v in page_data.items %}                        
                    {% endfor %}                
                            
         
           
编号
           
登录时间
           
登录IP
          
         
           
{ { v.id }}
           
{ { v.addtime }}
           
{ { v.ip }}
          
        
       
                
       
                            {
   { pg.page(page_data,'home.loginlog') }}                
       
            
      
        
     
    
    
{% endblock %}{% block js %}    {% endblock %}

6. 定义用户查看自己的电影收藏的部分的代码

6.1 定义用户查看自己收藏的电影的视图函数

当用户收藏的电影可能有很多，所以需要进行分页，默认显示第一页的内容

@home.route("/moviecol/
    
     /")def moviecol(page=None):    if page is None:        page = 1    page_data = Moviecol.query.join(Movie).join(User).filter(        Movie.id == Moviecol.movie_id,        User.id == session.get("user_id")    ).order_by(Moviecol.id).paginate(page=page, per_page=10)    return render_template("home/moviecol.html", page_data=page_data)
    

6.2 定义用户查看自己收藏的电影的前端页面代码

{% extends "home/home.html" %}{% import "ui/home_page.html" as pg %}{% block css %}    {% endblock %}{% block content %}    {% include "home/menu.html" %}    
    
        
     
            
      
                
       
 收藏电影
            
      
            
      
                
       
                            {% for v in page_data.items %}                        
        
                            
         
 
             
         
                            
         
 
          
{ { v.movie.title }}播放影片
 { { v.movie.info }} 
         
                        
        
                    {% endfor %}                
       
                
       
                            {
   { pg.page(page_data,'home.moviecol') }}                
       
            
      
        
     
    
    
{% endblock %}{% block js %}    {% endblock %}

到这里，用户登录后显示的主页面就已经开发完成了。