和之前的机构列表差不多,继承自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字段经常用
网友评论