2020-05-12--Django项目10-courselis

2020-05-13  本文已影响0人  program_white

courselist 所属机构的显示

设置Course类与CourseOrg类进行关联

机构类与课程类进行一对多的关联
外键添加到课程类中,所以在courses/models.py中的Course模型类中添加外键course_org。

course_org = models.ForeignKey(CourseOrg, null=True, blank=True, on_delete=models.CASCADE, verbose_name="课程机构")

要再次进行数据迁移:

makemigrations courses
migrate courses

刷新数据库:



进入xadmin对之前添加的课程设置其所属的课程机构:



再次刷新数据库:

发现机构的id已经存入数据库中了。

然后要在courselist页面进行展示:
多找一语法:

多对象.外键.一属性

运行:



成功显示。

筛选和排序的联动

首先进行筛选功能的完成

根据课程类别(category)进行筛选,所以我们要做的首先是把它们都取出来显示在页面上。

注意:这里要进行去重操作

在取出所有数据之后
还是从后端传过来所以在courses/views.py,写在取出所有数据之后:

#取出筛选选项,根据课程标签(category)进行筛选
        cate_list = []
        for course in all_courses:
            if course.category not in cate_list:
                cate_list.append(course.category)

                  .......
                  .......

   return render(request,'courselist.html',{
            'all_courses':courses,
            'course_nums':course_nums,
            'cate_list':cate_list
        })

解析:取出所有数据之后,遍历所有的对象,如果这个对象没有在这个数组中,那么就添加到数组中。返回这个数组。

在前端html中进行遍历数组:

 {% for cate in cate_list %}
       <a href="?ct={{ cate }}"><span class="">{{ cate }}</span></a>
{% endfor %}

这里的高亮变换我还不会弄。
当用户点击某个选项后,把这个选项的的名称传到后台。
后端接受参数ct的值。
因为筛选选项涉及数量的变化,所以要写在获取课程数据个数之前。
view.py:

        #根据筛选选项筛选课程数据
        cate_name = request.GET.get('ct','')   # 获取前台接口数据
        if cate_name:
            # 过滤类别为用户选择的数据
            all_courses = all_courses.filter(category=cate_name)

解析:获取接口数据后,如果这个值存在,就根据课程类别(category)等于这个值进行过滤。记得用变量接着。
运行:


排序(并与筛选选项联动)

首先找到前端代码的位置:



要进行联动,就要对接口进行改写,把筛选选项在后台获取的cate_name
传到前台来。
在view.py中加上cate_name的传递:

        return render(request,'courselist.html',{
            'all_courses':courses,
            'course_nums':course_nums,
            'cate_list':cate_list,

            'cate_name':cate_name
        })

改写接口:



排序的sort值道传给view进行处理:
排序的话不影响数量的变化,所以无所谓,为了整洁,还是写在获取数量之前。
view.py:

    #排序
        sort = request.GET.get('sort','')
        if sort == 'hot':
            # 根据热门(点击数)进行排序,一定要拿变量接着。
            all_courses = all_courses.order_by('-click_nums')
        elif sort == 'students':
            # 根据学生数进行排序
            all_courses = all_courses.order_by('-students')

这块就不解析了
还有一个高亮变化的问题:
在前台有根据sort的值进行高亮的选择:
所以要把view获取的sort值再传给前台:



前端:

class="{% ifequal sort '接口值' %}active{% endifequal %}"
image.png

运行:
点击后端开发和最热门:



点击后端开发和参与人数:


热门课程推荐

首先找到相应的html代码:



只保留一项。



还是要在后端取到数据传到前端进行循环显示
获取按照点击数逆序排行的前三项课程,并返回

views.py:

    #获取热门课程 前三个
        hot_courses = Course.objects.order_by('-click_nums')[:3]
              ......
              ......
return render(request,'courselist.html',{

            'hot_courses':hot_courses          #热门课程前三个
        })

在前端进行数据循环和数据绑定:

{% for hot_cours in hot_courses %}
                      <dl>
                            <dt>
                                <a target="_blank" href="">
                                    <img width="240" height="220" class="scrollLoading"
                                         src="{{ hot_cours.image.url }}"/>
                                </a>
                            </dt>
                            <dd>
                                <a target="_blank" href=""><h2>{{ hot_cours.name }}</h2></a>
                                <span class="fl">难度:<i class="key">{{ hot_cours.get_degree_display }}</i></span>
                            </dd>
                  </dl>
{% endfor %}

在之间显示图片的路径是再用字符串拼接:
{{ MEDIA_ROOT }}{{ hot_cours.image }}
而这里也可以使用:
{{ hot_cours.image.url }}
这两个方法都是可以的。
运行:



显示成功。

上一篇下一篇

猜你喜欢

热点阅读