系统功能
1、博客列表展示
2、新增博客、修改博客、删除博客、搜索博客
3、后台管理
后台管理
django自带后台管理系统Admin，被授权的用户可以直接在后台管理系统中操作数据库。同时，我们可以按照需求对Admin进行定制。
1、创建超级用户
python manage.py createsuperuser
根据提示，输入用户名、邮箱、密码。
2、测试访问
访问地址 http://localhost:8000/admin/ ，输入用户名密码，登录后台管理系统。
3、改成中文
后台管理系统，默认是英文的，修改settings.py：
# LANGUAGE_CODE = 'en-us'
LANGUAGE_CODE = 'zh-hans'
刷新后台管理页面，发现变成了中文。
4、注册model
此时，我们在后台管理中看不到article等表数据，要想显示数据，需要在blog/admin.py中注册model。
from django.contrib import admin
from . import models
# Register your models here.
admin.site.register(models.Article)
刷新后台管理页面，发现article表已经出现。
5、点击进入Articles，发现里面有很多Article Object，因为我们在blog/models.py中添加了__str__方法，所以显示的名称是文章标题。
def __str__(self):
return self.title
页面开发
主页面
1、在blog/urls.py中配置路由
url(r'^$', views.index, name='index'),
url(r'^index$', views.index, name='index'),
2、在blog/views.py中修改index方法
def index(request):
articles = models.Article.objects.all()
return render(request, 'blog/index.html', {'articles': articles})
3、修改blog/templates/blog/index.html
首页
博客列表
博客标题
发布时间
操作
{% for article in articles %}
{{article.title}}
{{article.pub_time}}
删除
{% endfor %}
4、测试访问
访问地址 http://localhost:8000/blog 或 http://localhost:8000/blog/index
静态资源
blog/index.html中，没有添加样式。接下来，我们修改一下项目结构，把样式表放在静态资源目录中。参考DJango 1.8 配置静态资源文件可访问 和 Django 静态文件。
1、新建djsite/static/css层级目录，在css下新建index.css，内容参见源码分享。
2、在settings.py中添加
# 设置STATIC_URL为存储静态文件的路径（基于根目录）
STATIC_URL = '/static/'
# 配置存储静态文件的路径映射值，这个值用于模版引用路径的转换
STATICFILES_DIRS = (
os.path.join(BASE_DIR, "static"),
)
3、修改blog/index.html为：
{% load staticfiles %}
首页
查看博客页面
1、在blog/urls.py中添加：
url(r'^(?P[0-9]+)$', views.detail, name='detail'),
2、在blog/views.py中添加方法：
def detail(request,article_id):
article = models.Article.objects.get(pk=article_id)
return render(request, 'blog/article.html',
{'article': article})
3、在blog/templates/blog中添加article.html：
{% load staticfiles %}
{{article.title}}
{{article.title}}
{{article.content}}
4、测试访问
访问地址 http://localhost:8000/blog/1
添加博客页面
1、在blog/urls.py中添加：
url(r'^toadd$', views.toadd, name='toadd'),
2、在blog/views.py添加方法：
def toadd(request):
return render(request, 'blog/add.html')
3、在blog/templates/blog中添加add.html：
添加博客
4、修改blog/views.py中的add方法为：
@csrf_exempt
def add(request):
title = request.POST.get('title', 'defaultTitle')
content = request.POST.get('content', 'defaultContent')
pub_time = utc2local(timezone.now())
LOCAL_FORMAT = "%Y-%m-%d %H:%M:%S"
pub_time = pub_time.strftime(LOCAL_FORMAT)
models.Article.objects.create(title=title, content=content, pub_time=pub_time)
articles = models.Article.objects.all()
return render(request, 'blog/index.html',{'articles': articles})
5、测试访问
访问地址 http://localhost:8000/blog/toadd
修改博客页面
1、在blog/urls.py中添加：
url(r'^toedit/(?P[0-9]+)$', views.toedit, name='toedit'),
2、在blog/views.py添加方法：
def toedit(request, article_id):
article = models.Article.objects.get(pk=article_id)
return render(request, 'blog/edit.html', {'article': article})
3、在blog/templates/blog中添加edit.html：
修改博客
4、修改blog/views.py中的edit方法：
@csrf_exempt
def edit(request):
article_id = request.POST.get('id', 0)
title = request.POST.get('title', 'defaultTitle')
content = request.POST.get('content', 'defaultContent')
pub_time = utc2local(timezone.now())
LOCAL_FORMAT = "%Y-%m-%d %H:%M:%S"
pub_time = pub_time.strftime(LOCAL_FORMAT)
article = models.Article.objects.get(pk=article_id)
article.title = title
article.content = content
article.pub_time = pub_time
article.save()
articles = models.Article.objects.all()
return render(request, 'blog/index.html', {'articles': articles})
删除博客
1、修改blog/templates/blog/index.html，添加js引入：
2、创建static/js目录，js目录中新建index.js：
$(function(){
$('table').on('click','.del',function(){
$that = $(this);
layer.confirm('确认删除？', {
btn: ['确认','取消'] //按钮
}, function(){
var $tr = $that.parents('tr');
var id = $tr.attr('data-id');
$.ajax({
url: '/blog/delete',
type: 'POST',
dataType: 'json',
data: {id: id},
success: function(data){
console.log(data);
if(data.code == '0'){
$tr.remove();
layer.msg('删除成功');
}
},
error: function(xhr){
console.log(xhr);
}
});
}, function(){
// nothing
});
});
});
3、修改blog/views.py中的delete方法：
@csrf_exempt
def delete(request):
article_id = request.POST.get('id', 0)
models.Article.objects.get(pk=article_id).delete()
result = {'code': 0, 'ext': 'success'}
return HttpResponse(json.dumps(result, ensure_ascii=False))
4、测试访问
访问地址 http://localhost:8000/blog/ ，点击文章后面的删除按钮即可。
查找博客
1、在blog/urls.py中添加：
url(r'^search$', views.search, name='search')
2、在blog/views.py中添加search方法：
from django.db.models import Q
@csrf_exempt
def search(request):
key = request.POST.get('key')
articles = models.Article.objects.filter(Q(title__contains=key) | Q(content__contains=key))
json_data = serializers.serialize("json", articles)
dict_data = json.loads(json_data)
result = {
'code': 0,
'ext': 'success',
'articles': dict_data}
return HttpResponse(json.dumps(result, ensure_ascii=False))
3、在blog/templates/blog/index.html中添加：
4、在index.js中添加：
$('.search').on('click',function(){
var key = $('.search-input').val();
$.ajax({
url: '/blog/search',
type: 'POST',
dataType: 'json',
data: {key: key},
success: function(data){
console.log(data);
if(data.code == '0'){
var html = template('tr_template',{articles: data.articles});
$('tbody').html(html);
}
},
error: function(xhr){
console.log(xhr);
}
});
});
$('.search-input').keypress(function(event) {
var key = event.which;
// console.log(key);
if(key == 13){
//do something
$('.search').trigger('click');
}
});
效果演示
源码分享
https://github.com/voidking/djsite/releases/tag/v0.2.0
书签
django入门与实践