chapter 8 课程页面

目录

 

8.1 将课进行分页和筛选，文档链接  https://github.com/jamespacileo/django-pure-pagination

8.2课程内容设置

8.3 课程相对应的课程机构信息，并做收藏

8.4课程章节页面

8.6 comment 评论页面

8.7该同学还学过，其他什么课程，登陆验证，再将课程和用户进行关联：

8.8课程播放页面

---

8.1 将课进行分页和筛选，文档链接  https://github.com/jamespacileo/django-pure-pagination

前端分页代码，注意第一行的

all_courses.object_list

插入课程页表

{% for course in all_courses.object_list %}
    <div class="box">
        <a href="course-detail.html">
            <img width="280" height="350" class="scrollLoading"
                 src="{{ MEDIA_URL }}{{ course.image }}"/>
        </a>
        <div class="des">
            <a href="course-detail.html">
                <h2>{{ course.name }}</h2>
            </a>
            <span class="fl">时长：{{ course.learn_times }}<i class="key">0</i></span>
            <span class="fr">学习人数：{{ course.student }}  </span>
        </div>
        <div class="bottom">
            <a href="course-detail.html"><span class="fl">{{ course.course_org.name }}</span></a>
            <span class="star fr  notlogin
                " data-favid="15">
                {{ course.fav_number }}
            </span>
        </div>
    </div>
{% endfor %}

 

改变下标页码

<ul class="pagelist">
                                    {% if all_courses.has_previous %}
                                    <li class="long"><a href="?{{ all_courses.previous_page_number.querystring }}">上一页</a>
                                    </li>
                                {% endif %}
                                {% for page in all_courses.pages %}
                                    {% if page %}
                                        {% ifequal page all_courses.number %}
                                            <li class="active"><a href="?page=1">{{ page }}</a></li>
                                        {% else %}
                                            <li><a href="?{{ page.querystring }}" class="page">{{ page }}</a></li>
                                        {% endifequal %}
                                    {% else %}
                                        <li class="none"><a href="">...</a></li>
                                    {% endif %}
                                {% endfor %}

                                {% if all_courses.has_next %}
                                    <li class="long"><a href="?{{ all_courses.next_page_number.querystring }}">下一页</a></li>
                                {% endif %}
                            </ul>

views.py

class CourseList(View):
    def get(self,request):
        all_courses = Course.objects.all()

        try:
            page = int(request.GET.get('page', 1))#这里要做一下int转换,这里的request.GET.get('page', 1)中的page是Django在分页时自动生成的
        except PageNotAnInteger:
            page = 1
        paginator = Paginator(all_courses,6,request=request)#每页显示条数3
        courses = paginator.page(page)

        return render(request,'course-list.html',{
            'all_courses': courses,
            # 'sort':sort
        })

 

 

 

排序：

views.py

    def get(self,request):
        all_courses = Course.objects.all()

        #课程排序
        sort = request.GET.get('sort','')
        if sort:
            if sort == 'hot':
                all_courses = all_courses.order_by('-click_number')
            elif sort == 'students':
                all_courses = all_courses.order_by('-students')

        try:
            page = int(request.GET.get('page', 1))#这里要做一下int转换,这里的request.GET.get('page', 1)中的page是Django在分页时自动生成的
        except PageNotAnInteger:
            page = 1
        paginator = Paginator(all_courses,6,request=request)#每页显示条数3
        courses = paginator.page(page)

        return render(request,'course-list.html',{
            'all_courses': courses,
            'sort':sort
        })

前端代码

<ul class="tab_header">
                        <li {% ifequal sort '' %}class="active"{% endifequal %}><a href="?sort=">最新 </a></li>
                        <li {% ifequal sort 'hot' %}class="active"{% endifequal %}><a href="?sort=hot">最热门</a></li>
                        <li {% ifequal sort 'students' %}class="active"{% endifequal %}><a href="?sort=students">参与人数</a></li>
                    </ul>

 

8.2课程内容设置

 

后台代码

courses.views.py

class CourseDetail(View):
    def get(self,request,course_id):
        if request.user.is_authenticated:
            username = request.user
        else:
            username = '未登录，请点击登陆'
        course = Course.objects.get(id = course_id)
        course.click_nums+=1
        course.save()#记录点击课程的次数
        return render(request,'course-detail.html',{
            'course':course,
            'username': username,
        })

courses.uels.py

urlpatterns = [
    #name 的作用是在前端配置路由的时候使用 url 'message:getpost'这个getpost是name = 'getpost'中的getpost
    path('list/',CourseList.as_view(), name="course_list"),
    re_path('detail/(?P<course_id>\d)/$',CourseDetail.as_view(), name="course_detail"),
]

courses.models.py

class Course(models.Model):#定义课程
    course_org = models.ForeignKey(CourseOrg,verbose_name="课程机构",null=True,on_delete=models.CASCADE)
    name = models.CharField(max_length=50,verbose_name=u"课程")
    desc = models.CharField(max_length=300,verbose_name=u"课程描述")
    detail = models.TextField(verbose_name=u"课程详情")
    degree = models.CharField(choices=(("cj",u"初级"),('zj',u"中级"),('gj',u"高级")),max_length=5)#课程难度
    learn_times = models.IntegerField(default=0,verbose_name=u"学习时长（分钟数）")
    student = models.IntegerField(default=0,verbose_name=u"学习人数")
    fav_nums= models.IntegerField(default=0,verbose_name=u"收藏人数")
    image = models.ImageField(upload_to="courses/%Y/%m",verbose_name=u"封面")
    click_nums = models.IntegerField(default=0,verbose_name=u"课程点击数")
    add_time = models.DateTimeField(default=datetime.now,verbose_name=u"课程添加时间")

    class Meta:
        verbose_name = u"课程"
        verbose_name_plural = verbose_name

    def __str__(self):
        return self.name

    def get_lesson_count(self):
        lesson_count = self.lesson_set.all().count()#获取到这门课程的所有章节数，前提是course是lesson的外键,不在同一文件下也可以用
        return  lesson_count

 

部分后台代码

<li><span class="pram word3">章 节 数：</span><span>{{ course.get_lesson_count }}</span></li>

直接在前端调用course中的一个方法（get_lesson_count）

8.3 课程相对应的课程机构信息，并做收藏

 

courses.views.py 

class CourseDetail(View):
    def get(self,request,course_id):

        course = Course.objects.get(id = course_id)
        course.click_nums+=1
        course.save()#记录点击课程的次数

        course_has_fav = False
        org_has_fav = False
        if request.user.is_authenticated:
            username = request.user
            user = UserProfile.objects.get(Q(username=username) | Q(email=username))
            user_id = user.id
            if UserFavorate.objects.filter(user_id=user_id, fav_id=course.id, fav_type=1):#从数据库中查询
                course_has_fav = True
            if UserFavorate.objects.filter(user_id = user_id ,fav_id = course.course_org.id,fav_type = 2):
                org_has_fav = True
        else:
            username = '未登录，请点击登陆'

        tag = course.tag
        if tag:
            relate_course = Course.objects.filter(tag = tag)
            relate_course = relate_course.exclude(id = course.id)[:1]#將當前課程排除在推薦課程之外
        else:
            relate_course = []
        return render(request,'course-detail.html',{
            'course':course,
            'username': username,
            'relate_course':relate_course,
            'course_has_fav':course_has_fav,
            'org_has_fav':org_has_fav
        })

收藏前端代码：

js相应（course_detail）：

{% block js %}
    <script type="text/javascript">
        //收藏分享
        function add_fav(current_elem, fav_id, fav_type) {
            $.ajax({
                cache: false,
                type: "POST",
                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 %}

判断是否已收藏：

<div class="btn  notlogin  collectionbtn" data-favid="14" id="jsRightBtn">
    {% ifequal org_has_fav False %}
        收藏
    {% endifequal %}
    {% ifequal org_has_fav True %}
        已收藏
    {% endifequal %}
</div>

 

 

8.4课程章节页面

 

 

8.5 忘记写了

8.6 comment 评论页面

8.7该同学还学过，其他什么课程，登陆验证，再将课程和用户进行关联：

    后台，先判断 是否登陆，再通过user_id拿到改用户所学过的所有课程

class CourseCommentView(View):
    def get(self,request,course_id):
        course = Course.objects.get(id = int(course_id))
        resources = CourseResource.objects.filter(course = course)
        all_comments = CourseComment.objects.filter(course = course)
        # pdb.set_trace()
        if request.user.is_authenticated:
            username = request.user
            user = UserProfile.objects.get(Q(username=username) | Q(email=username))
            user_id = user.id
            usercourse = UserCourse.objects.filter(user_id = user_id)[:5]

        return render(request,'course-comment.html',{
            'course':course,
            'resources':resources,
            'all_comments':all_comments,
            'usercourse': usercourse
        })

前端：一般操作

 

登陆验证：

 

后台：在utils文件夹下新增mixin_utils.py文件（前提是utils已经在sittings中注册过路径了）

sittings.py:

sys.path.insert(2,os.path.join(BASE_DIR,"utils"))

mixin_utils.py    

from django.contrib.auth.decorators import login_required
from django.utils.decorators import method_decorator

class LoginRequiredMixin(object):
    @method_decorator(login_required(login_url='/index/login/'))#调用装饰器
    def dispatch(self,request,*args,**kwargs):#函数名称和参数是固定的，不可修改
        return super(LoginRequiredMixin,self).dispatch(request,*args,**kwargs)

courses.views.py 

class CourseInfoVideo(LoginRequiredMixin,View):#继承登陆验证函数，如果未登录则调转到登陆页面

class CourseCommentView(LoginRequiredMixin,View):

将课程和用户进行关联

    后台关联代码：

class CourseInfoVideo(LoginRequiredMixin,View):#继承登陆验证函数，如果未登录则调转到登陆页面
    def get(self,request,course_id):
        course = Course.objects.get(id = int(course_id))
        resources = CourseResource.objects.filter(course = course)
        # pdb.set_trace()

        if request.user.is_authenticated:#该同学还学过哪些课程
            username = request.user
            user = UserProfile.objects.get(Q(username=username) | Q(email=username))
            user_id = user.id
            usercourse = UserCourse.objects.filter(user_id = user_id)[:5]
            user_course = UserCourse.objects.filter(user = username,course = course)
            if not user_course:#如果当前用户的课程学习没有保存这个门课程，这将这门课程保存到，这样用户的信息下
                user_course = UserCourse(user = username,course = course)
                user_course.save()

        return render(request,'course-video.html',{
            'course':course,
            'resources':resources,
            'usercourse':usercourse
        }) if not user_course:#如果当前用户的课程学习没有保存这个门课程，这将这门课程保存到，这样用户的信息下
                user_course = UserCourse(user = username,course = course)
                user_course.save()

        return render(request,'course-video.html',{
            'course':course,
            'resources':resources,
            'usercourse':usercourse
        })

8.8课程播放页面

使用 video.js 插件制作