美文网首页
32.课程列表页面

32.课程列表页面

作者: hs_a2d1 | 来源:发表于2018-02-18 09:30 被阅读0次

和之前的机构列表差不多,继承自base.html,{% extends 'base.html' %}。改一下面包屑,左侧部分改成循环。配置url,在根url文件里include,namespace="course",响应函数里,from pure_pagination import Paginator, EmptyPage, PageNotAnInteger用于分页。

class CourseListView(View):
    def get(self,request):
        all_course = Course.objects.all()
        # 对课程机构分页
        try:
            page = request.GET.get('page', 1)
        except PageNotAnInteger:
            page = 1

        p = Paginator(all_course, 3, request=request, )

        courses = p.page(page)
        return render(request,'course-list.html',{
            "all_course":courses,})

直接把all_course传进去不能分页,把p传进去就是分了页的。但前端用需要{% for course in all_course.object_list %}
对于前端分页功能都可以这样:

                     <div class="pageturn">
                     <ul class="pagelist">
                        {% if all_course.has_previous %}
                            <li class="long"><a href="?{{ all_course.previous_page_number.querystring }}">上一页</a></li>
                        {% endif %}

                        {% for page in all_course.pages %}
                            {% if page %}
                                {% ifequal page all_course.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_course.has_next %}
                            <li class="long"><a href="?{{ all_course.next_page_number.querystring }}">下一页</a></li>
                        {% endif %}

                      </ul>
                      </div>

然后是按不同字段排序,在页面右边显示热门课程,注意先排序后分页。

from pure_pagination import Paginator, EmptyPage, PageNotAnInteger

from .models import Course

class CourseListView(View):
    def get(self,request):
        all_course = Course.objects.all().order_by("-add_time")
        # 对课程排序,带-为倒序排列
        hot_courses = Course.objects.all().order_by('-click_nums')[0:3]
        sort = request.GET.get('sort', "")
        if sort:
            if sort == "students":
                all_course= all_course.order_by("-students")
            elif sort == "hot":
                all_course= all_course.order_by("click_nums")
        # 对课程机构分页
        try:
            page = request.GET.get('page', 1)
        except PageNotAnInteger:
            page = 1

        p = Paginator(all_course, 3, request=request, )

        courses = p.page(page)
        return render(request,'course-list.html',{
            "all_course":courses,
            "sort":sort,
            'hot_courses':hot_courses
                                                  })

sort 来自前端,用户点击一个排序标准后传递给后台,后台按此标准把课程排序传给前端。排序标准也传给前端用于凸显选中状态。前端

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

.

            <div class="right layout">
                <div class="head">热门课程推荐</div>
                <div class="group_recommend">
                    {% for hot_course in hot_courses %}
                    <dl>
                        <dt>
                            <a target="_blank" href="">
                                <img width="240" height="220" class="scrollLoading" src="{{ MEDIA_URL }}{{ hot_course.image }}"/>
                            </a>
                        </dt>
                        <dd>
                            <a target="_blank" href=""><h2> {{ hot_course.name }}</h2></a>
                            <span class="fl">难度:<i class="key">{{ hot_course.get_degree_display }}</i></span>
                        </dd>
                    </dl>
                    {% endfor %}

                </div>
            </div>

课程难度字段“degree”是choice,如果直接调用会显示cj、zj、gj不是初级中级高级。hot_course.get_degree_display这样就可以显示初级中级高级了。这种用法choice字段经常用

相关文章

网友评论

      本文标题:32.课程列表页面

      本文链接:https://www.haomeiwen.com/subject/vuovtftx.html