后台逻辑
C:\Users\hlg\PycharmProjects\MxOnline\apps\courses\views.py
# _*_ encoding:utf-8 _*_
from django.shortcuts import render
from django.views.generic.base import View
from pure_pagination import Paginator, EmptyPage, PageNotAnInteger
from .models import Course
from operation.models import UserFavorite
# Create your views here.
class CourseListView(View):
def get(self, request):
all_courses = Course.objects.all().order_by("-add_time")
hot_courses = Course.objects.all().order_by("-click_nums")[:3]
sort = request.GET.get('sort', "")
if sort:
if sort == "students":
all_courses = all_courses.order_by("-students")
elif sort == "sort":
all_courses = all_courses.order_by("-click_nums")
# 对课程进行分页
try:
page = request.GET.get('page', 1)
except PageNotAnInteger:
page = 1
# 一定要3个参数，不然报错
p = Paginator(all_courses, 5, request=request)
courses = p.page(page)
return render(request, 'course-list.html',{
"all_courses":courses,
"sort":sort,
"hot_courses": hot_courses
})
class CourseDetailView(View):
"""
课程详情页
"""
def get(self, request, course_id):
course = Course.objects.get(id=int(course_id))
# 增加课程点击数
course.click_nums +=1
course.save()
# 是否收藏课程
has_fav_course = False
# 是否收藏机构
has_fav_org = False
if request.user.is_authenticated():
if UserFavorite.objects.filter(user=request.user, fav_id=course.id, fav_type=1):
has_fav_course = True
if UserFavorite.objects.filter(user=request.user, fav_id=course.course_org.id, fav_type=2):
has_fav_org = True
tag = course.tag
if tag:
relate_courses = Course.objects.filter(tag=tag)[:1]
else:
relate_courses = []
return render(request, "course-detail.html",{
"course": course,
"relate_courses": relate_courses,
"has_fav_course":has_fav_course,
"has_fav_org":has_fav_org,
})
# _*_ encoding:utf-8 _*_
from django.conf.urls import url, include
from .views import CourseListView ,CourseDetailView
urlpatterns = [
# 课程列表页
url(r'^list/$', CourseListView.as_view(), name="course_list"),
# 课程详情页
url(r'^detail/(?P<course_id>\d+)/$', CourseDetailView.as_view(), name="course_detail"),
]
html页面
{% extends 'base.html' %}
{% block title %}公开课列表 - 慕学在线网{% endblock %}
{% load staticfiles %}
{% block custom_bread %}
<section>
<div class="wp">
<ul class="crumbs">
<li><a href="index.html">首页</a>></li>
<li><a href="{% url 'course:course_list' %}">公开课</a></li>
<li>课程详情</li>
</ul>
</div>
</section>
{% endblock %}
{% block content %}
<section>
<div class="wp">
<div class="groupPurchase_detail detail">
<div class="toppro">
<div class="left">
<div class="picbox">
<div class="tb-booth tb-pic">
<img width="440" height="445" src="{{ MEDIA_URL }}{{ course.image }}" class="jqzoom" />
</div>
</div>
<div class="des">
<h1 title="django 从入门到精通体验开始了">{{ course.name }}</h1>
<span class="key">{{ course.desc }}</span>
<div class="prize">
<span class="fl">难度：<i class="key">{{ course.get_degree_display }}</i></span>
<span class="fr">学习人数：{{ course.students }}</span>
</div>
<ul class="parameter">
<li><span class="pram word3">时 长：</span><span>{{ course.learn_times }}</span></li>
<li><span class="pram word3">章 节 数：</span><span>{{ course.get_zj_nums }}</span></li>
<li><span class="pram word3">课程类别：</span><span title="">{{ course.category }}</span></li>
<li class="piclist"><span class="pram word4">学习用户：</span>
{% for user_course in course.get_learn_users %}
<span class="pic"><img width="40" height="40" src="{{ MEDIA_URL }}{{ user_course.user.image }}"/></span>
{% endfor %}
</li>
</ul>
<div class="btns">
<div class="btn colectgroupbtn" id="jsLeftBtn">
{% if has_fav_course %}已收藏{% else %}收藏{% endif %}
</div>
<div class="buy btn"><a style="color: white" href="course-video.html">开始学习</a></div>
</div>
</div>
<div class="group-share-box">
<div class="bdsharebuttonbox"
data-text="django开始了"
data-desc="我在#慕课网#发现了"
data-comment=""
data-url="/group/groupdetail/15/">
<span class="fl">分享到：</span>
<a href="#" class="bds_more" data-cmd="more"></a>
<a title="分享到QQ空间" href="#" class="bds_qzone" data-cmd="qzone"></a>
<a title="分享到新浪微博" href="#" class="bds_tsina" data-cmd="tsina"></a>
<a title="分享到腾讯微博" href="#" class="bds_tqq" data-cmd="tqq"></a>
<a title="分享到人人网" href="#" class="bds_renren" data-cmd="renren"></a>
<a title="分享到微信" href="#" class="bds_weixin" data-cmd="weixin"></a>
</div>
</div>
</div>
<div class="right">
<div class="head">
<h1>授课机构</h1>
<p>世界名校，课程权威</p>
</div>
<div class="pic">
<a href="/company/14/">
<img width="150" height="80" src="{{ MEDIA_URL }}{{ course.course_org.image }}"/>
</a>
</div>
<a href="/company/14/">
<h2 class="center" title="清华大学">{{ course.course_org.name }}</h2>
</a>
<div class="btn notlogin
"data-favid="14" id="jsRightBtn">
{% if has_fav_org %}已收藏{% else %}收藏{% endif %}
</div>
<div class="clear">
<ul>
<li>
<span>课 程 数： {{ course.course_org.course_nums }}</span>
</li>
<li>
<span>教 师 数： {{ course.course_org.get_teacher_nums }}</span>
</li>
<li>所在地区： {{ course.course_org.address }}</li>
<li>认 证 :
<img title="金牌机构", src="../images/gold.png"/>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<section>
<div class="wp">
<div class="list groupPurchase_detail_pro">
<div class="left layout">
<div class="head">
<ul class="tab_header">
<li class="active">课程详情</li>
</ul>
</div>
<div class="tab_cont tab_cont1">
<p>{{ course.detail }}</p>
</div>
<div class="tab_cont tab_cont2" >
<div class="comment">
<div class="comenlist">
</div>
</div>
</div>
</div>
<div class="right layout">
<div class="head">相关课程推荐</div>
<div class="group_recommend">
{% for relate_course in relate_courses %}
<dl>
<dt>
<a target="_blank" href="">
<img width="240" height="220" class="scrollLoading" src="{{ MEDIA_URL }}{{ relate_course.image }}"/>
</a>
</dt>
<dd>
<a target="_blank" href=""><h2> {{ relate_course.name }}</h2></a>
<span class="fl">学习时长：<i class="key">{{ relate_course.learn_times }}</i></span>
</dd>
</dl>
{% endfor %}
</div>
</div>
</div>
</div>
</section>
{% endblock %}
{% block custom_js %}
<script type="text/javascript">
//收藏分享
function add_fav(current_elem, fav_id, fav_type){
$.ajax({
cache: false,
type: "POST",
url:"{% url "org:add_fav" %}",
data:{'fav_id':fav_id, 'fav_type':fav_type},
async: true,
beforeSend:function(xhr, settings){
xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");
},
success: function(data) {
if(data.status == 'fail'){
if(data.msg == '用户未登录'){
window.location.href="/login/";
}else{
alert(data.msg)
}
}else if(data.status == 'success'){
current_elem.text(data.msg)
}
},
});
}
$('#jsLeftBtn').on('click', function(){
add_fav($(this), {{ course.id }}, 1);
});
$('#jsRightBtn').on('click', function(){
add_fav($(this), {{ course.course_org.id }}, 2);
});
</script>
{% endblock %}
效果图：
