django+xadmin在线教育平台（十五）

7-4 课程机构列表页数据展示2

前去html中进行数据填充

mark

可以看到所有城市是通过a标签，当前选中城市为active。

mark

之后把下面的写死的城市删除掉。

mark

这时就是我们在后台添加的数据了

mark

可以看到每个课程机构都是一个dl

同理使用for循环。

如何将imageField转换为图片地址

数据库中img存放的是字符串：相对路径

mark

上图这种取法会取出一个相对地址。

mark

将setting中配置的mediaurl放在前面可以补全地址。

设置media处理器

mark

注册之后，mediaurl将可以在html中使用

mark

图片还是没有显示。因为url中没有处理图片相应路径的url

Django1.9.8 urls.py:

from django.views.static import serve

    # 处理图片显示的url,使用Django自带serve,传入参数告诉它去哪个路径找，我们有配置好的路径MEDIAROOT

    url(r'^media/(?P<path>.*)$', serve, {"document_root": MEDIA_ROOT })

mark

Django2.0.1 urls.py:

from django.views.static import serve

# 处理图片显示的url,使用Django自带serve,传入参数告诉它去哪个路径找，我们有配置好的路径MEDIAROOT

    re_path(r'^media/(?P<path>.*)', serve, {"document_root": MEDIA_ROOT })

完善xadmin的adminx为机构添加分类索引字段

organization/adminx.py

# 机构课程信息管理器

class CourseOrgAdmin(object):

    list_display = ['name', 'desc','category', 'click_nums', 'fav_nums','add_time' ]

    search_fields = ['name', 'desc', 'category','click_nums', 'fav_nums']

    list_filter = ['name', 'desc','category' ,'click_nums', 'fav_nums','city__name','address','add_time']

去除加载小圈圈

static/css/style.css中scrollLoading置为空:

.scrollLoading {

}

完成后台数据添加，列表页数据展示。对应7-3&7-4

7-5 列表分页功能

github搜索django-pure-pagination

pip install django-pure-pagination

mark

install app中添加:

'pure_pagination',

可设置参数；

PAGINATION_SETTINGS = {

    'PAGE_RANGE_DISPLAYED': 10,

    'MARGIN_PAGES_DISPLAYED': 2,

    'SHOW_FIRST_PAGE_WHEN_INVALID': True,

}

mark

PAGE_RANGE_DISPLAYED是总共会显示多少个page。(包括省略号，包括两边和中间)
MARGIN_PAGES_DISPLAYED是旁边会显示多少个。
SHOW_FIRST_PAGE_WHEN_INVALID:当输入页数不合法是否要跳到第一页

官方实例；

from django.shortcuts import render_to_response

from pure_pagination import Paginator, EmptyPage, PageNotAnInteger

    # 尝试获取页数参数

    try:

        page = request.GET.get('page', 1)

    except PageNotAnInteger:

        page = 1

    # objects是取到的数据

    objects = ['john', 'edward', 'josh', 'frank']

    # Provide Paginator with the request object for complete querystring generation

    # 对于取到的数据进行分页处理。

    p = Paginator(objects, request=request)

    # 此时前台显示的就应该是我们此时获取的第几页的数据

    people = p.page(page)

    return render_to_response('index.html', {

        'people': people,

    }

我们对照着的实现：

from pure_pagination import Paginator, EmptyPage, PageNotAnInteger

class OrgView(View):

    def get(self,request):

        # 查找到所有的课程机构

        all_orgs = CourseOrg.objects.all()

        # 总共有多少家机构使用count进行统计

        org_nums = all_orgs.count()

        # 取出所有的城市

        all_city = CityDict.objects.all()

        # 对课程机构进行分页

        # 尝试获取前台get请求传递过来的page参数

        # 如果是不合法的配置参数默认返回第一页

        try:

            page = request.GET.get('page', 1)

        except PageNotAnInteger:

            page = 1

        # 这里指从allorg中取五个出来，每页显示5个

        p = Paginator(all_orgs, 5, request=request)

        orgs = p.page(page)

        return render(request, "org-list.html", {

            "all_orgs":orgs,

            "all_city": all_city,

            "org_nums": org_nums,

        })

对于html中分页进行配置

不再是objects，而是objectlist

mark

使用默认的render

mark

mark

自定义html的样式

mark

本小节完成对应commit:

7-3, 4 & 5:完成列表数据展示列表分页功能：使用pure_pagination

7-6 分类筛选功能

mark

当用户点击某一个city时对应加上参数city的id

在后台处理这个city

mark

获取传入的参数进行进一步筛选。

mark

将city_id传回html，使得可以知道哪个是选中的。

mark

因为city.id是后端传回来的值是一个int。所以我们要做类型转换。

mark

当city_id为空的时候，显示全部。

后台处理类别

  # 类别筛选

        category = request.GET.get('ct', "")

        if category:

            # 我们就在机构中作进一步筛选类别

            all_orgs = all_orgs.filter(category=category)

返回前台类别值以active

  return render(request, "org-list.html", {

            "all_orgs":orgs,

            "all_city": all_city,

            "org_nums": org_nums,

            "city_id":city_id,

            "category":category,

        })

mark

对于类别做同样的ifequal判断

mark

如上图所示进行城市与分类的联动:

当选择全部类别的时候，就只通过当前城市id。
当选择全部城市的时候，就只通过当前目录id。
当两者都选的时候使用&连接。

刚才统计机构数目过早，应该移到后面后面已经筛选过后，

 # 总共有多少家机构使用count进行统计

        org_nums = all_orgs.count()

课程机构排名

   # 热门机构,如果不加负号会是有小到大。

        hot_orgs = all_orgs.order_by("-click_nums")[:3]

mark

循环时内置变量forloop.counter取当前循环到第几次

待完成:点击排名机构的连接

课程机构排序。

学习人数，课程数

organization/models.py
CourseOrg

 # 当学生点击学习课程，找到所属机构，学习人数加1

    students = models.IntegerField(default=0, verbose_name=u"学习人数")

    # 当发布课程就加1

    course_nums =  models.IntegerField(default=0, verbose_name=u"课程数")

makemigrations organization

migrate organization

前端页面学习人数，添加参数sort

mark

 # 进行排序

        sort = request.GET.get('sort', "")

        if sort:

            if sort == "students":

                all_orgs = all_orgs.order_by("-students")

            elif sort == "courses":

                all_orgs = all_orgs.order_by("-course_nums")

添加选择效果

mark

原文学习来自简书，作者：天涯明月笙
链接：https://www.jianshu.com/p/516349eacdc6