AdminLTE Login验证页面例子

#Login验证页面例子

##登陆验证页面后台输入项目定义
```forms.py
"""
页面form定义
"""
from __future__ import absolute_import, print_function, unicode_literals

from flask_wtf import FlaskForm
import wtforms as wtf


class LoginForm(FlaskForm):
    """
    登陆页面入力项目的验证定义
    """

    email = wtf.StringField(
        'email:', validators=[
            wtf.validators.DataRequired(),
            wtf.validators.Length(min=6, max=35)])

    password = wtf.PasswordField(
        'password:', validators=[
            wtf.validators.DataRequired()])
```


##登陆验证页面url定义

```view_login.py
@app.route('/')
def view_login():
    """
    登陆页面

    登陆成功后，非表示
    """
    # 页面form设定取得
    form = forms.LoginForm(request.form)

    # 页面标题设置
    res = {
        'page_title': '登陆',
    }

    # 页面表示数据
    context = {
        'res': res,
        'form': form,
    }

    return render_template(
        'view_login.html',
        **context
    )
```

##登陆按钮事件定义
```view_login.py
@app.route('/login', methods=['POST'])
def view_login_action():

    # Formobj
    form = forms.LoginForm(request.form)

    # 页面标题设置
    res = {
        'page_title': '登陆结果',
    }

    # 页面表示数据
    context = {
        'res': res,
        'form': form,
    }

    # 输入验证
    for key, value in form.errors.items():
        form.errors[key] = form[key].error_class()

    if not form.validate():
        # 错误信息页面表示
        for key, value in form.errors.items():
            flash('{}: {}'.format(key, str(value)), 'error')

        return render_template(
            'view_login.html',
            **context,
        )

    # 邮件地址
    email = form.email.data
    # 密码
    password = form.password.data

    if not (email == 'aa@bb.cc' and password == '1234'):
        flash('输入信息有误！')
        return render_template(
            'view_login.html',
            **context,
        )

    return "login sucess"
```

##前台html定义
```view_login.html
<!DOCTYPE html>
<html lang="ja">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <title>{{res.page_title}}</title>

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="stylesheet" href="{{ url_for('static', filename='fontawesome-free/css/all.min.css')}}" />
  <link rel="stylesheet" href="{{ url_for('static', filename='AdminLTE/css/adminlte.min.css')}}" />

</head>

<body class="hold-transition login-page">

  <div class="login-box">
    <div class="login-logo">
      <a href="{{ url_for('views.login.view_login') }}">{{res.page_title}}</a>
    </div>

    <div class="card">

      {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
          <div class="alert alert-danger alert-dismissible">
            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
            <p><i class="fas fa-exclamation"></i>登陆错误信息</p>
            {% for category, message in messages %}
            {{ message }}
            {% endfor %}
          </div>
        {% endif %}
      {% endwith %}

      <div class="card-body login-card-body">
        <p class="login-box-msg">Login</p>

        <form action="{{ url_for('views.login.view_login_action') }}" method="post">
          {{ form.csrf_token }}
          <div class="input-group mb-3">
            {{ form.email(class_="form-control", type="email", placeholder="Email") }}
            <div class="input-group-append">
              <span class="fa input-group-text"><i class="fas fa-envelope"></i></span>
            </div>
          </div>

          <div class="input-group mb-3">
            {{ form.password(class_="form-control", type="password", placeholder="Password") }}
            <div class="input-group-append">
              <span class="fa input-group-text"><i class="fas fa-lock"></i></span>
            </div>
          </div>

          <div class="row">
            <div class="col-8">
            </div>
            <div class="col-4">
              <button type="submit" class="btn btn-primary btn-block float-right">Login</button>
            </div>
          </div>

        </form>

      </div>
    </div>

  </div>

  <script type="text/javascript" src="{{ url_for('static', filename='jquery/jquery.min.js') }}"></script>
  <script type="text/javascript" src="{{ url_for('static', filename='bootstrap/js/bootstrap.bundle.min.js') }}"></script>
</body>

</html>
```
#参照
##AdminLTE源代码
https://github.com/ColorlibHQ/AdminLTE
##例子
https://adminlte.io/themes/dev/AdminLTE/index.html