zoukankan      html  css  js  c++  java
  • 新闻网站项目django--登录页

    models.py:

    # 用户信息表
    class UserProfile(models.Model):
        belong_to = models.OneToOneField(to=User, related_name="profile")  # 所属用户
        avatar = models.FileField(upload_to='avatar')  # 用户头像
    
        def __str__(self):
            return self.belong_to.username
    

    views.py:

    def login(request):
        if request.method == 'GET':
            form = LoginForm()
        if request.method == 'POST':
            form = LoginForm(request.POST)
            if form.is_valid():
                username = form.cleaned_data.get("username")
                password = form.cleaned_data.get("password")
                user = authenticate(username=username,password=password)
                if user:
                    user_login(request,user)              #由于login方法和我自定义的login视图重名,这里将django.contrib.auth中的login方法重命名为user_login导入
                    return redirect(to='index')
                else:
                    return HttpResponse('用户名不存在或用户名密码错误')
    
        context={}
        context['form'] = form
    
        return render(request,'login.html',context=context)
    

    模板css login.css:

    body{
        background-image:url(../images/login/backgroundimg.png);
        background-size: cover;
        background-repeat: no-repeat;
    }
    .ui.basic.segment.container.content{
       425px;
    
      margin-left: 50%;
      margin-top: 389px;
    }
    .ui.header{
      color:red;
      font-size: 50px !important;
      height: 75px;
    }
    input{
        border-radius: 31.5px!important;
        height: 31px!important;
        background-color: #ffffff!important;
        border: solid 1px #ededed!important;
    }
    .field{
      position: relative;
    }
    .two.fields > .field{
      position: relative;
    }
    .ui.image.top{
      position: absolute;
      left: -20px;
      top:10px;
    }
    .ui.image.bottom{
       10px;
      height: 10px;
      position: absolute;
      left: -20px;
      margin: 0;
    }
    label{
      font-size: 12px!important;
      color: #9b9b9b !important;
    }
    .ui.right.floated.red.circular.button{
         102px;
        height: 31px;
        background-color: #f30c28;
        margin-top: 6px;
        margin-right: 5px;
        font-size: 16px!important;
        font-weight: bold;
        padding-top: 7px;
    }
    .ui.basic.segment.container.footer{
      position: relative;
      margin-top: 150px;
    }
    .ui.circular.red.button.backtoindex{
       31px!important;
      height: 62px;
      border-radius: 15.5px;
      background-color: #f30c28;
      position: absolute;
      transform: translate(-50%,-50%);
      left: 50%;
      top:30px;
      padding: 0;
    }
    img{
      margin-left: 2px;
    }
    h4{
        font-size: 12px!important;
        color: #ffffff;
        margin-left: 2px;
    }
    .ui.image.title{
      position: relative;
      transform: translate(-50%);
      left: 50%;
      top:45px;
    }
    

    模板文件 login.html:

    <!DOCTYPE html>
    {% load staticfiles %}
    <html>
      <head>
        <meta charset="utf-8">
        <title>登录页</title>
        <link rel="stylesheet" href="{% static 'css/semantic.css' %}" media="screen" title="no title" charset="utf-8">
        <link rel="stylesheet" href="{% static 'css/login.css' %}" media="screen" title="no title" charset="utf-8">
      </head>
      <body>
        <div class="ui basic segment container content">
          <h1 class="ui center aligned header">登录</h1>
          <form class="ui form" method="post">
            <div class="field">
              <div class="ui image top">
                <img src="{% static 'images/login/usericon.png' %}" alt="" />
              </div>
              {{form.username}}
            </div>
            <div class="field">
              <div class="ui image top">
                <img src="{% static 'images/login/lockicon.png' %}" alt="" />
              </div>
              {{form.password}}
            </div>
            {% csrf_token %}
            <div class="two fields">
              <div class="field">
                <div class="ui image bottom" style="top:6px;">
                  <img src="{% static 'images/login/checkboxicon.png' %}" alt="" />
                </div>
                <label>记住我</label>
                <div class="ui image bottom" style="top:29px;">
                  <img src="{% static 'images/login/passwordicon.png' %}" alt="" />
                </div>
                <label>忘记密码</label>
              </div>
              <div class="field">
                <button class="ui right floated red circular button" type="submit" name="button">登录</button>
              </div>
           </div>
        </form>
        </div>
        <div class="ui basic segment container footer">
          <div class="bottom">
            <div class="ui divider"></div>
            <button type="button" name="button" class="ui circular red button backtoindex">
                <img src="{% static 'images/login/homeicon.png' %}" style="position:absolute;left:18%;top:10%;">
                <h4>首页</h4>
            </button>
            <div class="ui image title">
                <img src="{% static 'images/login/zhiribao.png' %}" alt="" />
            </div>
          </div>
    </div> </body> </html>

    urls.py:

        url(r'^login/', login, name='login')

  • 相关阅读:
    C#Type类中的IsAssignableFrom、IsInstanceOfType、IsSubclassOf
    C# IsAssignableFrom & IsInstanceOfType & IsSubclassOf & Is
    VS2017桌面应用程序打包成.msi或者.exe
    C# 10个常用特性
    ADO.NET 的六大对象及其关系图
    Expression表达式树(C#)
    表达式树 Expression Trees
    特性 Attribute
    C# 特性(attribute)
    Vue中使用axios
  • 原文地址:https://www.cnblogs.com/xyxpython/p/6725091.html
Copyright © 2011-2022 走看看