零基础使用Django2.0.1打造在线教育网站（二十三）：个人

2018-08-17 本文已影响22人啃饼小白

写在前面

本篇笔记我们将介绍个人信息相关页面的配置，具体包括我的课程，我的收藏，我的消息等功能，下面我们依次介绍一下。

本篇笔记对应于第二十三篇代码，对应于github的位置是https://github.com/licheetools/eduline。

我的课程

老规矩，让我们的usercenter_mycourse继承我们的usercenter_base.html页面：

然后就是先配置path，打开users/urls.py文件，新增以下代码:

from .views import  MyCourseView

  # 用户个人中心我的课程url
    path("mycourse/", MyCourseView.as_view(), name="mycourse"),

然后打开users/views.py文件，新增以下代码：

# 用户个人中心我的课程函数
class MyCourseView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        return render(request, "usercenter-mycourse.html" ,{

        })

然后去usercenter-base.html页面设置我们的跳转链接：

然后运行我们的项目，就可以点击我的课程了：

接下来就是课程的动态填充了，自己先尝试一下在MyCourseView这个函数里面写一下业务逻辑代码：

# 用户个人中心我的课程函数
class MyCourseView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        user_courses = UserCourse.objects.filter(user=request.user)

        return render(request, "usercenter-mycourse.html", {
            "user_courses": user_courses,

        })

然后打开usercenter-mycourse.html页面,配置动态加载：

接着刷新我们的页面，就可以看到我的课程了：

我的收藏

收藏授课机构

这里面有3个页面，我们一个个的来弄，先弄usercenter_fav_org页面。老规矩，让我们的usercenter_fav_org继承我们的usercenter_base.html页面：

然后就是先配置path，打开users/urls.py文件，新增以下代码:

from .views import MyFavOrgView

 # 我收藏的课程机构url
    path("myfav/org/", MyFavOrgView.as_view(), name="myfav_org"),

然后打开users/views.py文件，新增以下代码：

from operation.models import UserFavorite
from organization.models import CourseOrg

# 我收藏的课程机构函数
class MyFavOrgView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        org_list = []
        fav_orgs = UserFavorite.objects.filter(user=request.user, fav_type=2)
        for fav_org in fav_orgs:
            org_id = fav_org.fav_id
            org = CourseOrg.objects.get(id=org_id)
            org_list.append(org)
        return render(request, "usercenter-fav-org.html", {
            "org_list": org_list,

        })

然后去usercenter-base.html页面设置我们的跳转链接：

然后运行我们的项目，就可以点击我的课程了：

然后打开usercenter-fav_org.html页面,配置动态加载：

接着刷新我们的页面，就可以看到我收藏的课程机构了：

收藏课程机构

收藏授课讲师

我们现在来弄usercenter_fav_teacher页面。老规矩，让我们的usercenter_fav_teacher继承我们的usercenter_base.html页面：

然后就是先配置path，打开users/urls.py文件，新增以下代码:

from .views import MyFavTeacherView

 # 我收藏的授课讲师url
    path("myfav/teacher/", MyFavTeacherView.as_view(), name="myfav_teacher"),

然后打开users/views.py文件，新增以下代码：

from organization.models import Teacher


# 我收藏的授课讲师函数
class MyFavTeacherView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        teacher_list = []
        fav_teachers = UserFavorite.objects.filter(user=request.user, fav_type=3)
        for fav_teacher in fav_teachers:
            teacher_id = fav_teacher.fav_id
            teacher = Teacher.objects.get(id=teacher_id)
            teacher_list.append(teacher)
        return render(request, "usercenter-fav-teacher.html", {
            "teacher_list": teacher_list,

        })

然后去usercenter-fav_teacher.html页面设置我们的跳转链接和配置动态加载：

打开oganization/models.py文件，在Teacher函数新增用于获取课程数的函数：

 def get_course_nums(self):
        return self.course_set.all().count()

就是这样：

还有记得去usercenter-fav_org.html页面设置我们的跳转链接，否则就跳不到机构讲师页面了：

然后运行我们的项目，就可以看到我收藏的授课讲师了：

收藏公开课程

我们现在来弄usercenter_fav_course页面。老规矩，让我们的usercenter_fav_course继承我们的usercenter_base.html页面：

然后就是先配置path，打开users/urls.py文件，新增以下代码:

from .views import MyFavCourseView

 # 我收藏的公开课程url
    path("myfav/course/", MyFavCourseView.as_view(), name="myfav_course"),

然后打开users/views.py文件，新增以下代码：

from courses.models import Course


# 我收藏的公开课程函数
class MyFavCourseView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        course_list = []
        fav_courses = UserFavorite.objects.filter(user=request.user, fav_type=1)
        for fav_course in fav_courses:
            course_id = fav_course.fav_id
            course = Course.objects.get(id=course_id)
            course_list.append(course)
        return render(request, "usercenter-fav-course.html", {
            "course_list": course_list,
        })

然后去usercenter-fav_course.html页面设置我们的跳转链接和配置动态加载：

注意：双箭头指示的url跳转需要在fav_xx.html这3个页面进行修改从而可以3个页面切换自如。

然后运行我们的项目，就可以看到我收藏的公开课程了：

不过右边的取消收藏，也就是删除还没实现：

我们需要在3个fav_xx.html页面修改传递的id即可：

然后打开我们的usercenter_base.html页面，找到这3段代码，这就是实现删除的js代码：

注意一下，这段代码里面需要放csrf_token,否则会出错：

<script type="text/javascript">
    $('.jsDeleteFav_course').on('click', function(){
        var _this = $(this),
            favid = _this.attr('data-favid');
        $.ajax({
                cache: false,
                type: "POST",
                url: "/org/add_fav/",
                data: {
                    fav_type: 1,
                    fav_id: favid,
                    csrfmiddlewaretoken: '{{ csrf_token }}'
                },
                async: true,
                success: function(data) {
                    Dml.fun.winReload();
                }
            });
    });

    $('.jsDeleteFav_teacher').on('click', function(){
            var _this = $(this),
                favid = _this.attr('data-favid');
            $.ajax({
                    cache: false,
                    type: "POST",
                    url: "/org/add_fav/",
                    data: {
                        fav_type: 3,
                        fav_id: favid,
                        csrfmiddlewaretoken: '{{ csrf_token }}'
                    },
                    async: true,
                    success: function(data) {
                        Dml.fun.winReload();
                    }
                });
        });


    $('.jsDeleteFav_org').on('click', function(){
            var _this = $(this),
                favid = _this.attr('data-favid');
            $.ajax({
                    cache: false,
                    type: "POST",
                    url: "/org/add_fav/",
                    data: {
                        fav_type: 2,
                        fav_id: favid,
                        csrfmiddlewaretoken: '{{ csrf_token }}'
                    },
                    async: true,
                    success: function(data) {
                        Dml.fun.winReload();
                    }
                });
        });
</script>

至此，我的收藏3个相关页面就实现了，下面我们来配置我的消息页面。

我的消息

老规矩，让我们的usercenter_message.html继承我们的usercenter_base.html页面：

然后就是先配置path，打开users/urls.py文件，新增以下代码:

from .views import MyMessageView

 # 我的消息url
    path("mymessage/", MyMessageView.as_view(), name="mymessage"),

然后打开users/views.py文件，新增以下代码：

from pure_pagination import Paginator, EmptyPage, PageNotAnInteger
from operation.models import UserMessage

# 我的消息函数
class MyMessageView(LoginRequiredMixin, View):
    login_url = '/login/'
    redirect_field_name = 'next'

    def get(self, request):
        # 取出所有的信息
        all_messages = UserMessage.objects.filter(user=request.user.id)
        # 对消息进行分页,尝试获取前端get请求传递过来的page参数
        # 如果是不合法的配置参数则默认返回第一页
        try:
            page = request.GET.get('page', 1)
        except PageNotAnInteger:
            page = 1
        # 这里指从all_courses中取出来，每页显示9个
        p = Paginator(all_messages, 9, request=request)

        messages = p.page(page)

        return render(request, "usercenter-message.html", {
            "messages": messages,
        })

接着打开usercenter_base.html页面，我们修改页面跳转链接：

然后打开usercenter_message.html页面，我们修改页面信息如下：

然后打开users/views.py文件，找到我们之前的注册函数，新增以下代码：

# 写入欢迎注册的信息
            user_message = UserMessage()
            user_message.user = user_profile.id
            user_message.message = "欢迎注册慕海学习网！"
            user_message.save()

也就是这样：

接下来打开xadmin后台，我们对应id给其加几条信息，然后刷新一下我们的页面：

不知道你是否注意到我们页面顶部的小喇叭，这就是未读消息的提示，所以我们需要统计一下未读消息的数量。打开users/model.py文件，在UserProfile函数里面新增用于获取用户的未读消息的数量的函数：

 def get_unread_nums(self):
        # 获取用户的未读消息的数量
        from operation.models import UserMessage
        return UserMessage.objects.filter(user=self.id).count()

就是这个样子：