url配置
#个人站点配置
url(r'^blog/',include("blog.urls")),
# 分发url
from django.conf.urls import url,include
from blogCMS import settings
from blog import views
urlpatterns = [
url(r'^(?P<username>.*)/(?P<condition>tag|category|date)/(?P<para>.*)', views.homeSite),
url(r'^(?P<username>.*)/article/(?P<article_id>d+)', views.homeSite),
url(r'^(?P<username>.*)', views.homeSite,name="blog"),
]
视图相关处理
def homeSite(request,username,**kwargs):
current_user = models.UserInfo.objects.filter(username=username).first() #当前用户
current_blog = current_user.blog #反向查询到博客表
if not current_user:
return render(request,"notFound.html")
# 分类归档 通过category表过滤出当前用户的站点,聚合查询反向
category_list = models.Category.objects.all().filter(blog=current_blog).annotate(c=Count("article__nid")).values_list("title","c")
# 标签归档 通过标签过滤出当前用户的站点,聚合反向查询
tag_list = models.Tag.objects.all().filter(blog=current_blog).annotate(c=Count("article__nid")).values_list("title","c")
# # 日期归档
data_list = models.Article.objects.filter(user=current_user).extra(select={"filter_create_date":"strftime('%%Y/%%m',create_time)"}).values_list("filter_create_date").annotate(Count("nid"))
if kwargs:
if kwargs.get("condition")=="category":
article_list=models.Article.objects.filter(user=current_user,category__title=kwargs.get("para"))
elif kwargs.get("condition") == "tag":
article_list = models.Article.objects.filter(user=current_user, tags__title=kwargs.get("para"))
elif kwargs.get("condition") == "date":
year, month = kwargs.get("para").split("/")
article_list = models.Article.objects.filter(user=current_user, create_time__year=year,create_time__month=month)
if kwargs.get("article_id"):
print("======>",request.path)
user_obj = request.user
article_obj = models.Article.objects.filter(nid=kwargs.get("article_id")).first()
comment_obj_list = article_obj.comment_set.all()
obj = render(request,"article_deatil.html",locals())
obj.set_cookie("next_path",request.path)
print(request.COOKIES.get("next_path"),"======================>")
return obj
else:
article_list = models.Article.objects.filter(user=current_user)
paginator = Paginator(article_list, 3)
page_range = paginator.page_range
num = request.GET.get("page", 1)
article_list = paginator.page(num)
return render(request,"homeSite.html",locals())
前端页面展示
{#<!DOCTYPE html>#}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ current_user.nickname }}</title>
<link rel="stylesheet" href="/static/bootstrap-3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/blog/article_detail.css">
<script src="/static/jquery/jquery-3.2.1.min.js"></script>
<script src="/static/jquery/jquery.cookie.js"></script>
<script src="/static/jquery/jquery.session.js"></script>
<script src="/static/bootstrap-3.3.7/js/bootstrap.min.js"></script>
<script src="/static/blog/homesite.js"></script>
<script src="/static/kindeditor/kindeditor-all.js"></script>
<script src="/static/kindeditor/lang/zh-CN.js"></script>
<link rel="stylesheet" href="/static/theme/{{ current_user.blog.theme }}">
<style>
.tops a {
margin-right: 20px;
}
#comment_con {
width: 500px;
height: 250px;
}
.comment_tree_list {
margin-left: -40px;
}
.offset {
margin-left: 40px;
}
</style>
</head>
<body>
{# 顶部博客名字#}
<div class="headding">
<div class="container"><h2>welcome {{ username }} to myhome_page </h2></div>
</div>
{# 顶部导航#}
<nav class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header tops">
<a class="navbar-brand" href="/index/"><span class="glyphicon glyphicon-home">博客园首页</span></a>
<a class="navbar-brand" href=""><span class="glyphicon glyphicon-phone-alt">联系</span></a>
<a class="navbar-brand" href=""><span class="glyphicon glyphicon-file">订阅</span></a>
<a class="navbar-brand" href="/blog/{{ request.user.username }}/backindex/"><span
class="glyphicon glyphicon-cog">管理</span></a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="">随笔:{{ article_list.count }}</a></li>
<li><a href="">文章:{{ article_list.count }}</a></li>
<li><a href="">评论:{{ article_list.first.comment_count }}</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
{# 博客主体部分#}
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="panel panel-danger">
<div class="panel-heading">个人资料</div>
<div class="panel-body">
<p>头像:<img src="{{ current_user.avatar.url }}" width="80" height="80" alt=""
style="border-radius: 10px"></p>
<p>昵称:{{ current_user.nickname }}</p>
<p>园龄:{{ current_user.create_time }}</p>
<p>关注:{{ current_user.fans.count }}</p>
<p>粉丝:{{ current_user.users.count }}</p>
</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">分类归档</div>
<div class="panel-body">
{% for category in category_list %}
<p>
<a href="/blog/{{ current_user.username }}/category/{{ category.0 }}">{{ category.0 }}({{ category.1 }})</a>
</p>
{% endfor %}
</div>
</div>
<div class="panel panel-success">
<div class="panel-heading">标签归档</div>
<div class="panel-body">
{% for tag in tag_list %}
<p><a href="/blog/{{ current_user.username }}/tag/{{ tag.0 }}">{{ tag.0 }}({{ tag.1 }})</a></p>
{% endfor %}
</div>
</div>
<div class="panel panel-warning">
<div class="panel-heading">日期归档</div>
<div class="panel-body">
{% for data in data_list %}
<p><a href="/blog/{{ current_user.username }}/date/{{ data.0 }}">{{ data.0 }}({{ data.1 }})</a>
</p>
{% endfor %}
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">最新评论</div>
<div class="panel-body">
<p>评论一</p>
<p>评论二</p>
<p>评论三</p>
</div>
</div>
</div>
<div class="col-md-8">
{# 主体#}
{% block content %}
<div class="panel panel-primary">
<div class="panel-heading"><h4>个人博客文章</h4></div>
<div class="panel-body">
{% for article in article_list %}
<div class="row">
<div class="article_title"><h4><a
href="/blog/{{ current_user.username }}/article/{{ article.nid }}">{{ article.title }}</a>
</h4></div>
<div class="article_desc">
<p>{{ article.desc }}</p>
</div>
<div class="info">
发表于 <span>{{ article.create_time|date:"Y-m-d" }}</span>
<span>评论({{ article.comment_count }})</span>
<span>点赞({{ article.up_count }})</span>
<span>阅读({{ article.read_count }})</span>
</div>
</div>
{% endfor %}
</div>
</div>
{% endblock %}
<div class="page_page" style="text-align: center">
{# 分页按钮功能#}
{% block page %}
<nav aria-label="Page navigation">
<ul class="pagination">
{% if article_list.has_previous %}
<li>
<a href="/blog/{{ current_user.username }}?page={{ article_list.previous_page_number }}"
aria-label="Previous">上一页</a>
</li>
{% else %}
<li class="disabled"><a href="" aria-label="Previous">上一页</a></li>
{% endif %}
{% for index in page_range %}
{% if num == index %}
<li class="active"><a
href="/blog/{{ current_user.username }}?page={{ index }}">{{ index }}</a>
</li>
{% else %}
<li><a href="/blog/{{ current_user.username }}?page={{ index }}">{{ index }}</a>
</li>
{% endif %}
{% endfor %}
{% if article_list.has_next %}
<li><a href="/blog/{{ current_user.username }}?page={{ article_list.next_page_number }}"
aria-label="Previous">下一页</a></li>
{% else %}
<li class="disabled"><a href="" aria-label="Previous">下一页</a></li>
{% endif %}
</ul>
</nav>
{% endblock %}
</div>
</div>
</div>
</div>
</body>
</html>
css页面
article_detail样式
.title{
color: #2aabd2;
}
.article_region .article_con{
margin-left: 20px;
}
.updown .diggit{
46px;
height: 52px;
background: url("/static/img/upup.gif") no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
.updown .buryit{
margin-left:20px;
46px;
height: 52px;
background: url("/static/img/downdown.gif") no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
/*.updown{*/
/*margin-left: 0;*/
/*}*/
.subComment_region #tbCommentAuthor{
background-position: 3px -3px;
background-image: url("/static/img/icon_form.gif");
background-repeat: no-repeat;
border: 1px solid #ccc;
padding: 4px 4px 4px 30px;
300px;
font-size: 13px;
}
#commentform_title {
background-image: url("/static/img/icon_addcomment.gif");
background-repeat: no-repeat;
padding: 0 0 0 25px;
margin-bottom: 10px;
}
.author_avatar{
margin-left: 20px;
}
.had_comment_region input.author{
background-image: url("/static/img/icon_form.gif");
background-repeat: no-repeat;
border: 1px solid #ccc;
padding: 4px 4px 4px 30px;
300px;
font-size: 13px;
}
#author_profile {
float: left;
280px;
margin-top: 0;
margin-bottom: 10px;
color: #000;
margin-left: 0;
font-size: 12px;
}
.author_profile_info {
float: left;
line-height: 18px;
}
div {
display: block;
}
.author_avatar {
vertical-align: top;
float: left;
margin-right: 5px;
padding-top: 5px;
padding-left: 2px;
border: 0;
}
.author_profile_info {
float: left;
line-height: 18px;
}
.author_profile .author_profile_info .author_profile_detail a{
border-bottom: 2px dotted #333;
color: #000;
text-decoration: none;
}
.sendMsg2This:link, .sendMsg2This:visited, .sendMsg2This:active {
font-size: 12px;
text-decoration: none;
background: url("/static/img/icoMsg.gif") no-repeat top left;
padding-left: 20px;
}
.feedbackListSubtitle a:hover {
color: #f60;
text-decoration: none;
}
.sendMsg2This:hover {
background: url("/static/img/icoMsg.gif") no-repeat bottom left;
}
.sp:hover{
color: #f60;
text-decoration: none;
}
.sp {
color: #666;
font-weight: normal;
}
.pl{
margin-left: 0;
margin-top: 3px;
border-bottom: 1px solid #EDD9B8;
}
.comment{
margin-left: 20px;
}
homesitejs样式
// var nb = parseInt($(".nb:last").text()) + 1; // {# 建楼层用的 #}
//
// // {# 格式化时间 #}
// Date.prototype.Format = function (fmt) { //author: meizz
// var o = {
// "M+": this.getMonth() + 1, //月份
// "d+": this.getDate(), //日
// "h+": this.getHours(), //小时
// "m+": this.getMinutes(), //分
// "s+": this.getSeconds(), //秒
// "q+": Math.floor((this.getMonth() + 3) / 3), //季度
// "S": this.getMilliseconds() //毫秒
// };
// if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
// for (var k in o)
// if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
// return fmt;
// };
//
// var createTime = new Date().Format("yyyy年MM月dd日 hh:mm");
//
//
// // {# 提交评论#}
// $(".submit").click(function () {
// var cont = $(".text").val();
// // {# 当前输入的内容 #}
//
// $.ajax({
// url: "/blog/{{ current_user }}/com/",
// type: "POST",
// data: {
// csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),
// article_id:{{ article_obj.nid }},
// text: $(".text").val()
// },
// success: function (data) {
// data = JSON.parse(data);
// if (data["success"]) {
//
// var tr = '
// <div class="row pl">
// <div class="col-md-12">
// <div class="row">
// <div class="pull-left">
// <a href="" style="white-space:pre;"># ' + nb + ' 楼</a>
// ' + createTime + ' <a href="">{{ user_obj }}</a>
// </div>
// <a href="" class="sendMsg2This"></a>
// <div class="pull-right"><a href="">回复</a> <a href="">引用</a></div>
// </div>
// <div></div>
// <div class="cont">' + cont + '</div>
// <br>
// </div>
// </div>
// '
// $(".contcont").append(tr);
//
//
// $(".text").val("");
//
// } else {
// alert($.session.get("urls"));
// location.href = "/login/"
// }
// }
// })
// });
//
//
// function foo() {
// $(".diggnum_error").html("")
// }
//
//
// // {# 正常用户#}
// $(".diggit").click(function () {
// $.ajax({
// url: "/blog/up_count/",
// type: "POST",
// data: {
// csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),
// article_id:{{ article_obj.nid }}
// },
// success: function (data) {
// data = JSON.parse(data);
// if (data["state"]) {
// var val = parseInt($("#digg_count").html()) + 1;
// $("#digg_count").html(val)
//
// } else {
// $(".diggnum_error").html("请不要重复点赞").css("color", "red");
// setTimeout(foo, 3000)
//
// }
//
// }
// })
// });
//
//
// $(".buryit").click(function () {
// $.ajax({
// url: "/blog/down_count/",
// type: "POST",
// data: {
// csrfmiddlewaretoken: $("[name='csrfmiddlewaretoken']").val(),
// article_id:{{ article_obj.nid }}
// },
// success: function (data) {
// data = JSON.parse(data);
// console.log(data);
// if (data["state"]) {
// var val = parseInt($("#bury_count").html()) + 1;
// $("#bury_count").html(val)
//
// } else {
//
// $(".diggnum_error").html("去你大爷的,").css("color", "red")
// setTimeout(foo, 3000)
//
// }
//
// }
// })
// });
//
//
//
//
// // {# 游客进来之后吧当前的url写到session中,跳转到login页面#}
// $("#wu_diggnum").click(function () {
// $.session.set("urls", window.location.href);
// location.href = "/login/"
// });
//
//
// $(".reply").click(function () {
// alert("没有资格评论")
// })