1、把course-detail.html复制到templates目录下

2、编辑course-detail.html,分析页面,继承base.html

3、编辑courses.views

....

class CourseDetailView(View):
def get(self, request, course_id):
return render(request, 'course-detail.html', {})

4、创建一个url,编辑courses.urls.py

...
from .views CourseDetailView urlpatterns = [
...
url(r'^detail/(?P<course_id>\d+)/$', CourseDetailView.as_view(), name='course_detail'), ] 

5、现在去课程列表页,把进入课程详情的连接改下

现在,我们在课程列表页点击课程,就能够进入课程详情页了,只是里面的内容我们还没有进行动态展示,下面来完成

分析页面,先完成第一部分

编辑courses.views.py

class CourseDetailView(View):
def get(self, request, course_id):
course = Course.objects.get(id=course_id) #根据课程id参数查询到课程
return render(request, 'course-detail.html', {
"course": course,
})

前端展示

现在主要是"章节数","学习用户"该如何获取?可以在数据模型写个方法获取(Django外键反向取出数据)

class Course(models.Model):
name = models.CharField(max_length=50, verbose_name='课程名')
course_org = models.ForeignKey(CourseOrg, verbose_name='课程机构')
desc = models.CharField(max_length=300, verbose_name='课程描述')
details = models.TextField(verbose_name='课程详情')
degree = models.CharField(verbose_name='课程难度', choices=(('cj', '初级'), ('zj', '中级'), ('gj', '高级')), max_length=2)
learn_times = models.IntegerField(default=0, verbose_name='学习时长(分钟)')
students = models.IntegerField(default=0, verbose_name='学习人数')
fav_nums = models.IntegerField(default=0, verbose_name='收藏人数')
image = models.ImageField(upload_to='courses/%Y/%m', verbose_name='封面图', max_length=100)
click_nums = models.IntegerField(default=0, verbose_name='点击数')
category = models.CharField(max_length=20, default='', verbose_name=u'课程类别')
add_time = models.DateTimeField(default=datetime.now, verbose_name='添加时间') class Meta:
verbose_name = '课程'
verbose_name_plural = verbose_name def get_lesson_nums(self):
"""获取章节数"""
return self.lesson_set.count() def get_learn_students(self):
"""获取3个学习用户"""
return self.usercourse_set.all()[:3] def __str__(self):
return self.name

现在前端就可以取出这两项了  

完成第二部分:授课机构

教师数和前面一样,因为Teacher表有外键关联到机构,因此我们可以通过机构来反向获取到教师数

class CourseOrg(models.Model):
name = models.CharField(max_length=50, verbose_name='机构名称')
desc = models.TextField(verbose_name='机构描述')
category = models.CharField(max_length=20, default='jg', choices=(('jg', '机构'), ('gr', '个人'), ('gx', '高校')),
verbose_name='机构类别')
click_nums = models.IntegerField(default=0, verbose_name='点击数')
fav_nums = models.IntegerField(default=0, verbose_name='收藏数')
image = models.ImageField(upload_to='organization/%Y/%m', verbose_name='封面图', max_length=100)
address = models.CharField(max_length=150, verbose_name='机构地址', blank=True)
city = models.ForeignKey(CityDict, verbose_name='所在城市')
students = models.IntegerField(default=0, verbose_name='学习人数')
course_nums = models.IntegerField(default=0, verbose_name='课程数')
add_time = models.DateTimeField(default=datetime.now, verbose_name='添加时间') class Meta:
verbose_name = '课程机构'
verbose_name_plural = verbose_name def get_teacher_nums(self):
"""获取机构教师数"""
return self.teacher_set.count() def __str__(self):
return self.name

前端动态数据展示

完成第三部分:相关课程推荐

要实现相关课程推荐,我们可以在课程那里添加个字段(tag),然后根据tag筛选出相关课程

①、编辑courses.models.py,在Course下添加tag字段

②数据结构同步到数据库

③编辑courses.views

class CourseDetailView(View):
def get(self, request, course_id):
course = Course.objects.get(id=course_id) # 进入详情页面,增加1次点击量
course.click_nums += 1 # 相关课程推荐
tag = course.tag
if tag:
relate_courses = Course.objects.filter(tag=tag)[:2]
else:
relate_courses = [] return render(request, 'course-detail.html', {
"course": course,
"relate_courses": relate_courses,
})

前端动态展示数据

把课程详情部分改掉

第四部分:收藏功能

收藏功能可以直接使用之前在课程机构那里定义的接口

编辑course-detail.html下面的js

编辑courses.views.py

...
from operation.models import UserFavorite class CourseDetailView(View):
def get(self, request, course_id):
course = Course.objects.get(id=course_id) # 进入详情页面,增加1次点击量
course.click_nums += 1 # 相关课程推荐
tag = course.tag
if tag:
relate_courses = Course.objects.filter(tag=tag)[:2]
else:
relate_courses = [] # 收藏
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=1):
has_fav_org = True return render(request, 'course-detail.html', {
"course": course,
"relate_courses": relate_courses,
"has_fav_course": has_fav_course,
"has_fav_org": has_fav_org,
})

前端页面配置

注意:

如果发现点击"收藏"没反应,在base.html把{% block custom_js %}{% endblock %}放到body最后面

20、Django实战第20天:课程详情页的更多相关文章

  1. mxonline实战10,课程列表页,课程详情页1

    对应github地址:第10天   一. 课程列表页   1. 拷贝course-list.html到templates目录中 2. 编写url和view 在courses/views.py中新加

  2. mxonline实战11,课程详情页2,课程章节页

    对应github地址:第11天   一. 课程详情页2   1. 课程详情页第2块中的课程介绍中,修改course-detail.html中代码,搜索课程详情,找到如下代码

  3. Luffy之课程详情页

    Luffy之课程详情页 提前写好课程详情的template,并放入到Vue中 注册路由 import CourseDetail from "../components/CourseDetai ...

  4. Django实战(20):分页(Pagination)

    在上一节我们实现了针对某个产品的订单订阅功能.但是我们可能需要直接在站点上查询所有的订单.显然,随着时间的增长订单会越来越多,所以分页(Pagination)是个好办法:每次只显示一部分订单. 分页是 ...

  5. 21、Django实战第21天:课程章节信息

    在课程详情页中,点击"开始学习",就进入到这课程章节信息,这里面包含了两个页面:"章节"和评论 1.把course-video.html(章节).course- ...

  6. mxonline实战12, 课程评论,相关课程推荐,课程视频页

    对应github地址:第12天   一. 课程评论   1. 创建URL, VIEW courses/views.py -> Course

  7. day82:luffy:课程详情页面显示&章节和课时显示&视频播放组件&CKEditor富文本编辑器

    目录 1.初始课程详情页面 2.视频播放组件 3.课程详情页面后端接口实现 4.课程详情页面-前端 5.CKEditor富文本编辑器 6.课程章节和课时显示-后端接口 7.课程章节和课时显示-前端 1 ...

  8. 22、Django实战第22天:课程评论

    1.编辑course-comment.html 2.编辑courses.views.py class CourseCommentView(LoginRequiredMixin, View): def ...

  9. 17、Django实战第17天:机构详情展示

    1.进入xadmin添加测试数据(教师.课程) 2.把以下4个前端页面复制到templates中 先打开这几个页面分析,它们和之前的课程机构列表页是不一样的机构,且没有共同的部分,但是这4个页面却是类 ...

随机推荐

  1. [LOJ#2553][CTSC2018]暴力写挂

    [LOJ#2553][CTSC2018]暴力写挂 试题描述 temporaryDO 是一个很菜的 OIer .在 4 月,他在省队选拔赛的考场上见到了<林克卡特树>一题,其中 \(k = ...

  2. 【BZOJ 1409】 Password 数论(扩展欧拉+矩阵快速幂+快速幂)

    读了一下题就会很愉快的发现,这个数列是关于p的幂次的斐波那契数列,很愉快,然后就很愉快的发现可以矩阵快速幂一波,然后再一看数据范围就......然后由于上帝与集合对我的正确启示,我就发现这个东西可以用 ...

  3. [NOI2002] 银河英雄传说 (带权并查集)

    题目描述 公元五八○一年,地球居民迁至金牛座α第二行星,在那里发表银河联邦创立宣言,同年改元为宇宙历元年,并开始向银河系深处拓展. 宇宙历七九九年,银河系的两大军事集团在巴米利恩星域爆发战争.泰山压顶 ...

  4. [fzu 2271]不改变任意两点最短路至多删的边数

    题目链接:http://acm.fzu.edu.cn/problem.php?pid=2271 题目中说每条边的边权都是[1,10]之间的整数,这个条件非常关键!以后一定要好好读题啊…… 做10次循环 ...

  5. Java中文乱码问题(转)

    解决JSP中文乱码问题 大家在JSP的开发过程中,经常出现中文乱码的问题,可能一至困扰着大家,现把JSP开发中遇到的中文乱码的问题及解决办法写出来供大家参考.首先了解一下Java中文问题的由来: Ja ...

  6. TOM的show_space

    show_space查看对像数据块的空闲情况 CREATE OR REPLACE PROCEDURE show_space(p_segname IN VARCHAR2, p_owner IN VARC ...

  7. 模拟实现jdk动态代理

    实现步骤 1.生成代理类的源代码 2.将源代码保存到磁盘 3.使用JavaCompiler编译源代码生成.class字节码文件 4.使用JavaCompiler编译源代码生成.class字节码文件 5 ...

  8. 大数问题,通常用JAVA

    e.g. HDU1002 简单加法 import java.math.BigInteger; import java.util.Scanner; public class Main { public ...

  9. jstack 堆栈日志分析

    一.线程的状态 线程间的状态转换:  1. 新建(new):新创建了一个线程对象. 2. 可运行(runnable):线程对象创建后,其他线程(比如main线程)调用了该对象的start()方法.该状 ...

  10. 【uva11468-Substring】AC自动机+dp

    http://acm.hust.edu.cn/vjudge/problem/31655 题意:给定k个模板串,n个字符以及选择它的概率pro[i],要构造一个长度问L的字符串s,问s不包含任意一个模板 ...