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')