day82---博客项目之文章详情页渲染

urls.py

	url(r'^(?P<username>\w+)/articles/(?P<param>\d+)\.html$', views.article_detail),
	url(r'^article_up_down/$', views.article_up_down),

views.py

	from django.http import JsonResponse
	from django.db.models import F
	from django.db import transaction
	from django.db.utils import IntegrityError
	def article_detail(request, username, param):
		user_obj = UserInfo.objects.filter(username=username).first()
		article_obj = Article.objects.filter(id=param).first()
		comment_list = Comment.objects.filter(article_id=param)
		return render(request, 'article_detail.html', locals())
	def article_up_down(request):
		up_down_response = {'status': True}
		if request.is_ajax():
			user_id = request.user.id
			article_id = request.POST.get('article_id')
			up_down = json.loads(request.POST.get('up_down'))
			try:
				with transaction.atomic():
					ArticleUpDown.objects.create(user_id=user_id, article_id=article_id, up_down=up_down)
					if up_down:
						Article.objects.filter(id=article_id).update(up_count=F('up_count') + 1)
					else:
						Article.objects.filter(id=article_id).update(down_count=F('down_count') + 1)
			except IntegrityError:
				up_down_response['status'] = False
		return JsonResponse(up_down_response)

article_detail.html

	{% extends 'home_base.html' %}
	{% block content %}
		<div class="article_detail">
			<div class="article_text">
				<div class="article_title text-center h2"><a href="">{{ article_obj.title }}</a></div>
				<div class="article_about article_info text-right">
					<div class="h6">
						<span>posted</span>
						<span>&#64</span>
						<span>{{ article_obj.c_time| date:'Y-m-d H:i' }}</span>
						<span>{{ article_obj.user.nickname }}</span>
					</div>
					<div class="article_category h6">
						<span class="space text-danger">文章分类: {{ article_obj.category.c_name }}</span>
					</div>
					<div class="article_tag">
						<span class="space text-success">文章标签: </span>
						{% for tag in article_obj.tag.values %}
							<span class="text-success">
						{{ tag.t_name }}
					</span>
						{% endfor %}
					</div>
				</div>
				<hr>
				<div class="article_content">{{ article_obj.article_detail.content|safe }}</div>
			</div>
			<hr>
			<div class="article_button">
				<span class="space">
					<a class="article_comment btn btn-primary btn-sm">评论 <i class="glyphicon glyphicon-comment"></i></a>
					(<span id="comment_count">{{ article_obj.comment_count }}</span>)
				</span>
				<span class="space">
					<a class="up_down article_up btn btn-success btn-sm">支持 <i
							class="glyphicon glyphicon-thumbs-up"></i></a>
					(<span id="up_count">{{ article_obj.up_count }}</span>)
				</span>
				<span class="space">
					<a class="up_down article_down btn btn-danger btn-sm">反对 <i class="glyphicon glyphicon-thumbs-down"></i></a>
					(<span id="down_count">{{ article_obj.down_count }}</span>)
				</span>
			</div>
			<div class="article_up_down_error h5"></div>
			<br>
			<div class="article_comment">
				<div>
					<textarea name="" id="" cols="80" rows="10"></textarea>
				</div>
				<div class="">
					<input type="button" value="提交" class="btn btn-primary">
				</div>
			</div>
			<br><br><br><br><br><br><br><br><br><br>
		</div>
		{% csrf_token %}
		<script>
			$(".up_down").click(function () {
				if ("{{ request.user.username }}") {
					var up_down = $(this).hasClass("article_up");
					$.ajax({
						url: "/article_up_down/",
						type: "post",
						data: {
							"csrfmiddlewaretoken": $("[name='csrfmiddlewaretoken']").val(),
							"article_id": {{ article_obj.id }},
							"up_down": up_down
						},
						success: function (data) {
							if (data.status) {
								if (up_down) {
									var up = parseInt($("#up_count").text()) + 1;
									$("#up_count").text(up);
								} else {
									var down = parseInt($("#down_count").html()) + 1;
									$("#down_count").text(down);
								}
							} else {
								$(".article_up_down_error").html("您已经点赞或踩灭过了").css("color", "red");
							}
						}
					})
				} else {
					var $error = "您还未登录, <a href='/login/'>请登录</a>";
					$(".article_up_down_error").html($error).css("color", "red");
				}
			});
			setInterval(function () {
				$(".article_up_down_error").html("")
			}, 3000)
		</script>
	{% endblock %}