十四、授课教师功能
1、讲师列表页面
1.1 前端页面配置
将讲师列表页面teachers-list.html拷贝到templates下。
继承base页面，重写需要block的地方：
1.2 讲师列表接口
在organization/views.py中编写讲师列表的接口：
1 class TeacherListView(View): 2 """讲师列表""" 3 def get(self, request): 4 # 获取所有的讲师 5 all_teachers = Teacher.objects.all() 6 7 return render(request, 'teachers-list.html', { 8 'all_teachers': all_teachers 9 })
配置url：
from .views import TeacherListView urlpatterns = [ re_path('teacher/list/', TeacherListView.as_view(), name='teacher_list'), # 讲师列表 ]
修改index.html中跳转到讲师列表页面的url：
在讲师列表页面需要显示讲师的年龄，需要在teacher的model中增加一个年龄的字段：
1 class Teacher(models.Model): 2 """机构老师""" 3 org = models.ForeignKey(CourseOrg, verbose_name='所属机构', on_delete=models.CASCADE) 4 name = models.CharField('老师名', max_length=50) 5 age = models.IntegerField('年龄', default=25) 6 work_years =models.IntegerField('工作年限', default=0) 7 work_company = models.CharField('就职公司', max_length=50) 8 work_position = models.CharField('工作职位', max_length=50) 9 points = models.CharField('教学特点', max_length=50) 10 click_nums = models.IntegerField('点击数', default=0) 11 fav_nums = models.IntegerField('收藏数', default=0) 12 image = models.ImageField('头像', upload_to='teacher/%Y/%m', max_length=100, default='') 13 add_time = models.DateTimeField('添加时间', default=datetime.now) 14 15 class Meta: 16 verbose_name = '教师' 17 verbose_name_plural = verbose_name 18 19 def __str__(self): 20 return '[{}]机构的教师:{}'.format(self.org.name, self.name)
迁移数据库。
然后修改讲师列表页面显示讲师信息的代码：
1.3 分页功能
在讲师列表接口中完善分页的逻辑：
1 class TeacherListView(View): 2 """讲师列表""" 3 def get(self, request): 4 # 获取所有的讲师 5 all_teachers = Teacher.objects.all() 6 7 # 统计讲师的总数 8 teacher_nums = all_teachers.count() 9 10 # 分页 11 try: 12 page = request.GET.get('page', 1) 13 except PageNotAnInteger: 14 page = 1 15 p = Paginator(all_teachers, 5, request=request) 16 teachers = p.page(page) 17 18 return render(request, 'teachers-list.html', { 19 'all_teachers': teachers, 20 'teacher_nums': teacher_nums 21 })
在遍历讲师的时候需要加上object_list属性，否则在分页会抛出异常：
修改前端分页显示的代码：
1.4 排序功能
讲师可以根据人气进行排序，完善讲师列表接口中排序的逻辑：
1 class TeacherListView(View): 2 """讲师列表""" 3 def get(self, request): 4 # 获取所有的讲师 5 all_teachers = Teacher.objects.all() 6 7 # 统计讲师的总数 8 teacher_nums = all_teachers.count() 9 10 # 排序,按点击数排序 11 sort = request.GET.get('sort', '') 12 if sort: 13 if sort == 'hot': 14 all_teachers = all_teachers.order_by('-click_nums') 15 16 # 分页 17 try: 18 page = request.GET.get('page', 1) 19 except PageNotAnInteger: 20 page = 1 21 p = Paginator(all_teachers, 5, request=request) 22 teachers = p.page(page) 23 24 return render(request, 'teachers-list.html', { 25 'all_teachers': teachers, 26 'teacher_nums': teacher_nums, 27 'sort': sort 28 })
修改讲师列表页面中按人气选中的状态显示代码：
在讲师列表页面右侧有讲师排行版，完善讲师列表接口中排行榜的逻辑：
1 class TeacherListView(View): 2 """讲师列表""" 3 def get(self, request): 4 # 获取所有的讲师 5 all_teachers = Teacher.objects.all() 6 7 # 统计讲师的总数 8 teacher_nums = all_teachers.count() 9 10 # 排序,按点击数排序 11 sort = request.GET.get('sort', '') 12 if sort: 13 if sort == 'hot': 14 all_teachers = all_teachers.order_by('-click_nums') 15 16 # 讲师排行版 17 teacher_sorted = all_teachers.order_by('-click_nums')[:3] 18 19 # 分页 20 try: 21 page = request.GET.get('page', 1) 22 except PageNotAnInteger: 23 page = 1 24 p = Paginator(all_teachers, 5, request=request) 25 teachers = p.page(page) 26 27 return render(request, 'teachers-list.html', { 28 'all_teachers': teachers, 29 'teacher_nums': teacher_nums, 30 'sort': sort, 31 'teacher_sorted': teacher_sorted 32 })
修改讲师列表页面中显示讲师排行榜的代码：
2、讲师详情页面
2.1 前端页面配置
将讲师详情页面teacher-detail.html拷贝到templates下。
继承base页面，重写需要block的地方：
2.2 讲师详情接口
1 class TeacherDetailView(View): 2 """讲师详情页面""" 3 def get(self, request, teacher_id): 4 # 根据前端的讲师id找到对应的讲师 5 teacher = Teacher.objects.get(id=int(teacher_id)) 6 7 # 获取该老师所有的课程 8 all_courses = Course.objects.filter(teacher=teacher) 9 10 # 讲师排行 11 teacher_sorted = Teacher.objects.all().order_by('-click_nums')[:3] 12 13 return render(request, 'teacher-detail.html', { 14 'teacher': teacher, 15 'all_courses': all_courses, 16 'teacher_sorted': teacher_sorted 17 })
配置url：
1 from .views import TeacherDetailView 2 3 urlpatterns = [ 4 re_path('teacher/detail/(?P<teacher_id>d+)/', TeacherDetailView.as_view(), name='teacher_detail'), # 讲师详情 5 ]
在讲师列表页面修改点击讲师跳转到讲师详情页面的url：
修改讲师详情页面信息的显示代码：
2.3 收藏
在讲师详情页面可以收藏讲师，右侧可以收藏机构，完善讲师详情接口中收藏的判断逻辑：
1 class TeacherDetailView(View): 2 """讲师详情页面""" 3 def get(self, request, teacher_id): 4 # 根据前端的讲师id找到对应的讲师 5 teacher = Teacher.objects.get(id=int(teacher_id)) 6 7 # 获取该老师所有的课程 8 all_courses = Course.objects.filter(teacher=teacher) 9 10 # 讲师排行 11 teacher_sorted = Teacher.objects.all().order_by('-click_nums')[:3] 12 13 # 讲师收藏、机构收藏 14 has_teahcer_faved = False 15 if UserFavorite.objects.filter(user=request.user, fav_type=3, fav_id=teacher_id): 16 has_teahcer_faved = True 17 has_org_faved = False 18 if UserFavorite.objects.filter(user=request.user, fav_type=2, fav_id=teacher.org.id): 19 has_org_faved = True 20 21 return render(request, 'teacher-detail.html', { 22 'teacher': teacher, 23 'all_courses': all_courses, 24 'teacher_sorted': teacher_sorted, 25 'has_teahcer_faved': has_teahcer_faved, 26 'has_org_faved': has_org_faved 27 })
修改讲师详情页面中收藏的判断代码：
因为收藏操作是由前端通过ajax异步操作的，需要在讲师详情页面的最下面加上script代码：
1 {% block custom_js %} 2 <script type="text/javascript"> 3 //收藏分享 4 function add_fav(current_elem, fav_id, fav_type){ 5 $.ajax({ 6 cache: false, 7 type: "POST", 8 url:"{% url "org:add_fav" %}", 9 data:{'fav_id':fav_id, 'fav_type':fav_type}, 10 async: true, 11 beforeSend:function(xhr, settings){ 12 xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}"); 13 }, 14 success: function(data) { 15 if(data.status == 'fail'){ 16 if(data.msg == '用户未登录'){ 17 window.location.href="/login/"; 18 }else{ 19 alert(data.msg) 20 } 21 22 }else if(data.status == 'success'){ 23 current_elem.text(data.msg) 24 } 25 }, 26 }); 27 } 28 29 $('#jsLeftBtn').on('click', function(){ 30 add_fav($(this), {{ teacher.id }}, 3); 31 }); 32 33 $('#jsRightBtn').on('click', function(){ 34 add_fav($(this), {{ teacher.org.id }}, 2); 35 }); 36 </script> 37 {% endblock %}