登录注册
1. 进入.html文件确定请求的地址
{%block form%}
<form action=’/login/’>
2. 进入views.py文件
3. 查看models.py文件
4. 设置注册页面register.html
5. 创建.css文件
login.css
p{
margin:0;
}
#container{
width:990px;
margin:0 auto;
}
#container>h2{
color:#999;
font-weight:normal;
margin:50px 0 30px 0;
padding-bottom:15px;
border-bottom:1px solid #ccc;
}
#container>p.user-pic{
float:left;
}
#user-login{
float:right;
margin-right:40px;
margin-top:80px;
}
#user-login .form-line{
overflow:hidden;
margin-bottom:20px;
}
#user-login .form-line>p{
float:left;
/*宽度，文本右对齐，右外边距，行高，文本颜色*/
width:64px;
text-align:right;
margin-right:40px;
line-height:40px;
color:#999;
height:40px;
}
#user-login .form-line>div{
float:left;
}
#uphone,#upwd{
/*宽度，高度，边框，内边距*/
width:278px;
height:38px;
border:1px solid #ccc;
padding:0 10px;
color:#555;
/*取消轮廓，文本大小*/
outline:none;
font-size:18px;
}
#uphone:focus,#upwd:focus{
border-color:#64A131;
box-shadow:0 0 2px #64A131;
}
#user-login .forget-pwd{
width:300px;
}
#user-login .forget-pwd p{
float:right;
}
#user-login .forget-pwd a{
color:#999;
text-decoration:underline;
}
#user-login .forget-pwd input{
width:18px;
height:18px;
vertical-align:middle;
}
#user-login .form-btn{
width:300px;
}
#user-login .form-btn .register{
float:right;
width:143px;
height:38px;
border:1px solid #64A131;
background:#F5FFED;
border-radius:5px;
font-size:18px;
text-decoration:none;
color:#64a131;
text-align:center;
line-height:40px;
}
#user-login .form-btn input{
/*宽度，高度，取消边框，边框倒角，背景颜色，文本颜色，文字大小*/
width:145px;
height:40px;
border:none;
border-radius:5px;
background:#64a131;
color:#fff;
font-size:18px;
}
/**绝对定位练习*/
#container p.user-pic{
/*目的是为了配合 a 标记做绝对定位*/
position:relative;
}
#container p.user-pic a{
position:absolute;
left:175px;
bottom:20px;
/*宽度，高度，边框，倒角，文字大小，颜色，水平居中，垂直居中*/
width:153px;
height:48px;
border:1px solid #64A131;
border-radius:5px;
font-size:18px;
color:#64a131;
text-align:center;
line-height:50px;
text-decoration:none;
}
#uphone_err{
margin-top:10px;
}
register.css
.form-control{
/*宽度，高度，边框，内边距*/
width:278px;
height:38px;
border:1px solid #ccc;
padding:0 10px;
color:#555;
/*取消轮廓，文本大小*/
outline:none;
font-size:18px;
}
.form-control:focus{
border-color:#64A131;
box-shadow:0 0 2px #64A131;
}
#user-login{
margin-top:40px;
}
.register.html文件（注册页面）
{%extends 'login.html'%}
{%load static%}
{%block style%}
<link rel="stylesheet" href="{%static 'css/register.css'%}">
{%endblock%}
{%block title%}
注册会员
{%endblock%}
{%block btn%}
<a href="{%url 'login'%}">会员登录</a>
{%endblock%}
{%block form%}
<form action="/register/" method="post">
{%csrf_token%}
<div class="form-line">
<p>手机号</p>
<div>
<input type="text" name="uphone" class="form-control">
<p id="uphone_err">
{{errMsg}}
</p>
</div>
</div>
<div class="form-line">
<p>密码</p>
<div>
<input type="password" name="upwd" class="form-control">
</div>
</div>
<div class="form-line">
<p>确认密码</p>
<div>
<input type="password" id="cpwd" class="form-control">
</div>
</div>
<div class="form-line">
<p>用户名称</p>
<div>
<input type="text" name='uname' class="form-control">
</div>
</div>
<div class="form-line">
<p>邮箱</p>
<div>
<input type="email" name="uemail" class="form-control">
</div>
</div>
<div class="form-line">
<p></p>
<div class="form-btn">
<a href="{%url 'login'%}" class="register">会员登录</a>
<input type="submit" value="注册">
</div>
</div>
</form>
{%endblock%}
.models文件
from django.db import models
# Create your models here.
class Users(models.Model):
uphone = models.CharField(max_length=20, verbose_name='联系方式')
upass = models.CharField(max_length=50, verbose_name='密码')
uemail = models.EmailField(verbose_name='邮箱')
uname = models.CharField(max_length=20, null=True, verbose_name='用户名')
isActive = models.BooleanField(default=True, verbose_name='启用')
def __str__(self):
return self.uname
class Meta:
db_table = 'users'
verbose_name = '用户'
verbose_name_plural = verbose_name
class GoodsType(models.Model):
title = models.CharField(max_length=30, verbose_name='类型名称')
desc = models.TextField(null=True, verbose_name='类型描述')
picture = models.ImageField(
upload_to='static/upload/goodstype', verbose_name='类型图片')
def __str__(self):
return self.title
class Meta:
db_table = 'goodstype'
verbose_name = '商品类型'
verbose_name_plural = verbose_name
class Goods(models.Model):
title = models.CharField(max_length=100, verbose_name='商品名称')
price = models.DecimalField(
max_digits=7, decimal_places=2, verbose_name='商品价格')
spec = models.CharField(max_length=30, verbose_name='商品规格')
picture = models.ImageField(
upload_to='static/upload/goods', verbose_name='商品图片')
isActive = models.BooleanField(default=True, verbose_name='销售中')
goodsType = models.ForeignKey(GoodsType, null=True)
def __str__(self):
return self.title
class Meta:
db_table = 'goods'
verbose_name = '商品信息'
verbose_name_plural = verbose_name
.urls文件
from django.conf.urls import url
from .views import *
urlpatterns = [
url(r'^login/$', login_views,name='login'),
url(r'^register/$', register_views,name='register'),
]
.views文件
from django.shortcuts import render
from django.http import HttpResponse
from .models import *
# Create your views here.
def login_views(request):
# 判断request.method是get还是post
if request.method == 'GET':
return render(request, 'login.html')
else:
uphone = request.POST.get('uphone', '')
upwd = request.POST.get('upwd', '')
# if uphone and upwd:
# users = Users.objects.filter(uphone=uphone, upass=upwd)
# if users:
# return HttpResponse('登录成功!!')
# else:
# errMsg = '手机号或密码不正确'
# return render(request, 'login.html', locals())
if uphone and upwd:
users = Users.objects.filter(uphone=uphone)
if users:
u = users[0]
if upwd == u.upass:
return HttpResponse('登录成功')
else:
errMsg = '对不起,输入的密码不正确'
return render(request, 'login.html', locals())
else:
errMsg = '对不起,手机号码不存在'
return render(request, 'login.html', locals())
else:
errMsg = '手机号或密码不能为空'
return render(request, 'login.html', locals())
def register_views(request):
# 判断request.method 得到用户的意图
if request.method == 'GET':
return render(request, 'register.html')
else:
# 实现注册操作
uphone = request.POST.get('uphone', '')
upwd = request.POST.get('upwd', '')
uname = request.POST.get('uname', '')
uemail = request.POST.get('uemail', '')
if uphone and upwd and uname and uemail:
# 先判断uphone的数据是否存在
u = Users.objects.filter(uphone=uphone)
if u:
errMsg = '手机号码已存在'
return render(request, 'register.html', locals())
else:
Users.objects.create(uphone=uphone, upass=upwd,
uname=uname, uemail=uemail)
return HttpResponse('注册成功!!!')
else:
return HttpResponse('数据不能为空')
.html文件
{%load static%}
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="{%static 'css/login.css'%}">
<script src="{%static 'js/jquery-1.11.3.js'%}"></script>
<script src="{%static 'js/login.js'%}"></script>
{%block style%}
{%endblock%}
</head>
<body>
<div id="container">
<!-- 1、上 ：会员登录 -->
<h2>
{%block title%}
会员登录
{%endblock%}
</h2>
<!-- 2、下：左，登录图像 -->
<p class="user-pic">
<img src="{%static 'images/huiyuan.jpg'%}">
<!-- 会员注册超链接 -->
{%block btn%}
<a href="{%url 'register'%}">会员注册</a>
{%endblock%}
</p>
<!-- 3、下：右，表单以及控件 -->
<div id="user-login">
{%block form%}
<form action="/login/" method="post">
{%csrf_token%}
<!-- 1、第一行：手机号 -->
<div class="form-line">
<!-- 左：文本，手机号<p> -->
<p>手机号</p>
<!-- 右：文本框 <div> -->
<div>
<input type="text" id="uphone" name="uphone" value="{{u.uphone}}">
<p id="uphone_err">
{{errMsg}}
</p>
</div>
</div>
<!-- 2、密码 -->
<div class="form-line">
<p>密码</p>
<div>
<input type="password" id="upwd" name="upwd">
</div>
</div>
<!-- 3、记住密码 -->
<div class="form-line">
<p></p>
<div class="forget-pwd">
<p>
<a href="#">忘记密码?</a>
<a href="#">快捷登录</a>
</p>
<input type="checkbox" name="isSave">
记住密码
</div>
</div>
<!-- 4、登录 & 注册会员 -->
<div class="form-line">
<p></p>
<div class="form-btn">
<a href="#" class="register">注册会员</a>
<input type="submit" value="登录">
</div>
</div>
</form>
{%endblock%}
</div>
<!-- 4、增加空块级元素，将container撑起来 -->
<div style="clear:both;"></div>
</div>
</body>
</html>
