INSTALLED_APPS = [
...
'course'models.py
from django.db import models
from luffyapi.utils.models BaseModel
# Create your models here.
class CourseCategory(BaseModel):
"""
课程分类
"""
name = models.CharField(max_length=64,unique=True,verbose_name="分类名称")
Meta:
db_table = ly_course_category
verbose_name = 课程分类
verbose_name_plural = "
def __str__(self):
return %s" % self.name
Course(BaseModel):
专题课程
course_type = (
(0,付费),(1,VIP专享学位课程)
)
level_choices =初级中级高级上线下线预上线课程名称)
course_img = models.ImageField(upload_to=",max_length=255,1)">封面图片True)
费用类型字段是为了后期一些其他功能拓展用的，现在可以先不用，或者去掉它，目前我们项目用不到
course_type = models.SmallIntegerField(choices=course_type,default=0,1)">付费类型 这个字段是课程详情页里面展示的，并且详情介绍里面用户将来可能要上传一些图片之类的，所以我们会潜入富文本编辑器，让用户填写数据的时候可以上传图片啊、写标题啊、css、html等等内容
brief = models.TextField(max_length=2048,1)">详情介绍True)
level = models.SmallIntegerField(choices=level_choices,default=1,1)">难度等级)
pub_date = models.DateField(verbose_name=发布日期True)
period = models.IntegerField(verbose_name=建议学习周期(day))
课件资料的存放路径
attachment_path = models.FileField(max_length=128,1)">课件路径True)
status = models.SmallIntegerField(choices=status_choices,1)">课程状态)
course_category = models.ForeignKey(CourseCategory)
students = models.IntegerField(verbose_name=学习人数 0)
lessons = models.IntegerField(verbose_name=总课时数量 0)
总课时数量可能10个，但是目前之更新了3个，就跟小说、电视剧连载似的。
pub_lessons = models.IntegerField(verbose_name=课时更新数量课程原价
price = models.DecimalField(max_digits=6,decimal_places=2,1)">课程原价0)
teacher = models.ForeignKey(Teacher授课老师ly_course专题课程"
Teacher(BaseModel):
讲师、导师表
role_choices =讲师导师班主任讲师title)
role = models.SmallIntegerField(choices=role_choices,1)">讲师身份)
title = models.CharField(max_length=64,1)">职位、职称)
signature = models.CharField(max_length=255,1)">导师签名True)
image = models.ImageField(upload_to=teacher讲师封面)
brief = models.TextField(max_length=1024,1)">讲师描述)
ly_teacher讲师导师 self.name
CourseChapter(BaseModel):
课程章节
course = models.ForeignKey(Coursecoursechapters',1)">)
chapter = models.SmallIntegerField(verbose_name=第几章)
name = models.CharField(max_length=128,1)">章节标题)
summary = models.TextField(verbose_name=章节介绍True)
pub_date = models.DateField(verbose_name=True)
ly_course_chapter%s:(第%s章)%s (self.course,self.chapter,self.name)
CourseLesson(BaseModel):
课程课时
section_type_choices =文档练习视频)
)
chapter = models.ForeignKey(CourseChaptercoursesections课时标题orders = models.PositiveSmallIntegerField(verbose_name="课时排序") #在basemodel里面已经有了排序了
section_type = models.SmallIntegerField(default=2,choices=section_type_choices,1)">课时种类)
section_link = models.CharField(max_length=255,1)">课时链接若是video，填vid,若是文档，填link)
duration = models.CharField(verbose_name=视频时长 仅在前端展示使用，所以直接让上传视频的用户直接填写时长进来就可以了。
pub_date = models.DateTimeField(verbose_name=发布时间True)
free_trail = models.BooleanField(verbose_name=是否可试看False)
course = models.ForeignKey(course_lesson课程True)
is_show_list = models.BooleanField(verbose_name=是否推荐到课程列表False)
lesson = models.IntegerField(verbose_name=第几课时ly_course_lesson%s-%s" % (self.chapter,self.name)
4.执行数据库迁移
python manage.py makemigrations
python manage.py migrate
5.把当前新增的课程模型注册到xadmin里面.
courses/adminx.py
xadmin
from .models CourseCategory
CourseCategoryModelAdmin(object):
课程分类模型管理类"""
pass
xadmin.site.register(CourseCategory,CourseCategoryModelAdmin)
Course
CourseModelAdmin(object):
课程模型管理类
xadmin.site.register(Course,CourseModelAdmin)
Teacher
TeacherModelAdmin(object):
老师模型管理类
xadmin.site.register(Teacher,TeacherModelAdmin)
CourseChapter
CourseChapterModelAdmin(object):
课程章节模型管理类
xadmin.site.register(CourseChapter,CourseChapterModelAdmin)
CourseLesson
CourseLessonModelAdmin(object):
课程课时模型管理类
xadmin.site.register(CourseLesson,CourseLessonModelAdmin)
3.后端实现课程分类列表接口
1.添加课程分类的测试数据
INSERT INTO `ly_course_category` (`id`,`orders`,`is_show`,`is_deleted`,`created_time`,`updated_time`,`name`)
VALUES
(1,1); font-weight: bold">11,1); font-weight: bold">0,'2019-08-13 07:08:47.1000742019-08-13 07:44:05.903782python2,1)">2019-08-13 07:08:51.4510932019-08-13 07:43:54.558940go编程3,1)">2019-08-13 07:08:57.3901962019-08-13 07:08:57.390226Linux运维4,1)">2019-08-13 07:09:11.4659632019-08-13 07:09:11.465994前端开发'),(5,1)">php编程6,1)">C/C++7,1)">java web8,1)">UI设计9,1)">语文10,1); font-weight: bold">145,1)">数学英语');
2.为课程分类添加后端接口的路由,并编写视图函数和序列化器
urls.py
from django.urls path
from . views
urlpatterns = [
path(rcategorys/views.py
Create your views here.
from rest_framework.generics ListAPIView
from .serializers CourseCategoryModelSerializer,CourseModelsSerializer
CategoryView(ListAPIView):
queryset = models.CourseCategory.objects.filter(is_deleted=False,is_show=True)
serializer_class = CourseCategoryModelSerializer
serializers.py
from rest_framework serializers
CourseCategoryModelSerializer(serializers.ModelSerializer):
Meta:
model = models.CourseCategory
fields = [idname']
lyapi/urls.py
urlpatterns = [
......
path(rcourse/course.urls)),]
访问后端接口 /course/categorys 可查到分类数据
4.前端发送请求-获取课程分类信息
course.vue
<!-- html -->
<ul ="cate-list">
li ="title">课程分类:</li 点击不同分类进行高亮效果的切换 -->
:class="{this:category===0}" @click="category=0">全部v-for="(value,index) in category_list" :key="value.id"="category=value.id" :class="{this:category===value.id}">{{value.name}}>
ul>
// js
<script>
import Vheader from "./common/Vheader"
import Footer from "./common/Footer"
export default {
name: "Course"return{
category:0,默认分类zhi
category_list:[],}
},components:{
Vheader,Footer,},created() {
this.$axios.get(`${this.$settings.Host}/course/categorys/`)
.then((res)=>{
console.log(res.data);
this.category_list = res.data;
})
}
}
</script>
此时在前端就可以看到课程分类的效果了
5.后端实现课程列表信息的接口
urls.py
courses/views.py
CourseModelSerializer
CourseListAPIView(ListAPIView):
queryset = Course.objects.filter(is_delete=False,is_show=True).order_by(orders)
serializer_class = CourseModelSerializer
添加一些测试数据
INTO `ly_teacher` (`id`,`name`,`role`,`title`,`signature`,`image`,`brief`)
(2019-08-13 07:13:01.5319922019-08-13 07:13:01.532043李老师xx公司技术总监洪七公teacher/logo2x.png222);
`ly_course`
(`id`,`course_img`,`course_type`,`brief`,`level2019-08-13 07:13:50.6789482019-08-15 04:07:11.386224flask框架course/Loginbg.3377d0c.jpg<p>xxxx</p>2019-08-13README.md99,1); font-weight: bold">110,1); font-weight: bold">1110.00,1); font-weight: bold">12019-08-13 07:15:32.4901632019-08-15 04:13:22.430368蘑菇街APPcourse/course-cover.jpeg<p>dxxx</p>logo.svg50,1); font-weight: bold">40,1); font-weight: bold">666.00,1)">2019-08-20 10:49:41.880490django框架course/2.jpeg330.00,1); font-weight: bold">15,1)">2019-08-13 07:15:32.490191python入门dxxx411.00,1); font-weight: bold">16,1)">2019-08-14 02:28:04.791112hbase入门400.00,1); font-weight: bold">17,1)">路飞学城项目实战899.00,1); font-weight: bold">18,1)">2019-08-14 02:29:47.667133负载均衡1088.00,1); font-weight: bold">19,1)">MVC1500.00,1); font-weight: bold">20,1)">2019-08-14 02:28:52.12696821天java入门3000.00,1); font-weight: bold">21,1)">2019-08-14 02:27:01.8500497天玩转Linux运维22,1)">15天掌握flask框架23,1); font-weight: bold">12,1)">2019-08-13 07:23:56.015167C编程嵌入式399.00,1); font-weight: bold">24,1); font-weight: bold">13,1)">2019-08-14 02:29:17.8728403天玩转树莓派25,1); font-weight: bold">14,1)">2019-08-14 02:28:30.783768MongoDB26,1)">2019-08-14 02:30:09.348192Beego框架入门699.00,1); font-weight: bold">27,1)">2019-08-15 02:35:20.997672beego框架进阶28,1)">2019-08-13 07:23:44.546598以太坊入门29,1)">2019-08-15 04:05:10.421736<div style="background:#eeeeee; border:1px solid #cccccc; padding:5px 10px"><span style="color:#16a085"><span style="font-family:Arial,Helvetica,sans-serif"><span style="font-size:28px"><span style="background-color:#f39c12">dxxx</span></span></span></span><img alt="" src="/media/2019/08/15/course-cover.jpeg" /></div>rnrn<div style="background:#eeeeee; border:1px solid #cccccc; padding:5px 10px"> </div>rnrn<div style="background:#eeeeee; border:1px solid #cccccc; padding:5px 10px">rn<table border="1" cellpadding="1" cellspacing="1" style="width:500px">rn <tbody>rn <tr>rn <td>12321</td>rn <td>3232</td>rn <td>111</td>rn </tr>rn <tr>rn <td>33</td>rn <td>33</td>rn <td>22</td>rn </tr>rn <tr>rn <td>11</td>rn <td>22</td>rn <td>23</td>rn </tr>rn </tbody>rn</table>rnrn<p> </p>rn</div>1);
models
]
TeacherModelSerializer(serializers.ModelSerializer):
models.Teacher
fields = [roletitlesignature CourseModelsSerializer(serializers.ModelSerializer):
teacher_name = serializers.CharField(source='teacher.name') #自定义字段，通过sourse关键字就能获取外键关联的指定字段数据，别忘了在fields里面指定一下
方式2
序列化器嵌套
teacher = TeacherModelSerializer() 将外键关联的属性指定为关联表的序列化器对象，就能拿到关联表序列化出来的所有数据，还需要在fields中指定一下，注意，名称必须和外键属性名称相同
models.Course
fields = ["id","name","course_img","students","lessons","pub_lessons","price","teacher",'teacher_name'] #teacher外键属性默认拿的是id值
fields = [course_imgstudentslessonspub_lessonspriceget_lessons"] teacher外键属性默认拿的是id值
如何通过课程找到课时
Course(BaseModel):
......
self.name
def lesson_list(self):
获取当前课程的前8个课时展示到列表中"""
获取所有章节
chapters_list = self.coursechapters.filter(is_delete=False,1)">True)
lesson_list = [] 课时列表
if chapters_list:
for chapter in chapters_list:
lessons = chapter.coursesections.filter(is_delete=False,is_show=True)[:4]
lessons:
for lesson lessons:
lesson_list.append({
:lesson.id,1)">:lesson.name,1)">free_trail:lesson.free_trail
})
return lesson_list[:4]
序列化器字段增加自定义的模型字段
CourseModelSerializer(serializers.ModelSerializer):
默认情况,序列化器转换模型数据时,默认会把外键直接转成主键ID值
所以我们需要重新设置在序列化器中针对外键的序列化
这种操作就是一个序列器里面调用另一个序列化器了.叫"序列化器嵌套"
teacher = TeacherModelSerializer()
coursechapters = CourseChapterModelSerializer(many=True)
Course
fields = (lesson_list")
6.前端显示列表课程信息
-->
div ="course-list">
="course-item" v-for="(course,courseindex) in course_list"="course-image">
img :src="course.course_img" alt="">
div="course-info">
h3><router-link to>{{course.name}}router-link> spansrc="/static/img/avatar1.svg">{{course.students}}人已加入学习></p ="teather-info">{{course.teacher.name}} {{course.teacher.signature}} {{course.teacher.title}} >共{{course.lessons}}
课时/{{course.lessons===course.pub_lessons? '更新完成':`已更新${course.pub_lessons}课时`}}p="lesson-list">
="(lesson,lessonindex) in course.get_lessons"="lessonindex"span ="lesson-title">0{{lessonindex+1}} | 第{{lesson.lesson}}节：{{lesson.name}}v-show="lesson.free_trail" class="free">免费="pay-box"="discount-type">限时免费="discount-price">￥0.00元="original-price">原价：{{course.price}}元="buy-now">立即购买{
course_list:[],1)">this.get_course();
},methods:{
获取课程列表数据
get_course(){
this.$settings.Host}/course/courses/`,{
params:.fitlers,})
.then((res)=>{
this.total = res.data.count
this.course_list = res.data.results;
})
}
}
}
</script>
7.按照指定分类显示课程信息
1.安装字段过滤排序
pip install django-filter
2.在settings/dev.py配置文件中增加过滤后端的设置
INSTALLED_APPS = [
...
'django_filters'
from django_filters.rest_framework DjangoFilterBackend
CourseAPIView(ListAPIView):
queryset = Course.objects.filter(is_delete=False,1)">)
serializer_class = CourseModelSerializer
filter_backends = [DjangoFilterBackend,]
filter_fields = (course_categorydrf测试接口:course/courses/?course_category=1
可以看到分类为1的所有课程信息
4.前端显示
<script>
import Vheader from "./common/Vheader"默认分类值为0 全部
}
},1)">.get_categorys();
.get_course();
},watch:{
category(){
if (this.category>0){
this.fitlers['course_category'] = .category;
}else {
this.fitlers={}
}
console.log('>>>>>',this.fitlers)
this.get_course(); 当分类数据发生变化时，触发获取数据的动作
}
}, 获取所有分类数据
get_categorys(){
{
console.log(res.data);
res.data;
})
},1)">console.log(res.data);
res.data.results;
})
}
}
}
</script>
8.分页显示课程信息
1.前端
template
.....
分页效果展示 -->
el-pagination
background
:page-size="2"
layout="prev,pager,next,sizes,jumper"
:page-sizes="[2,5,10,15,20]"
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
:total="total">
el-pagination>
>
Footer>
>
>
script>
import Vheader from "./common/Vheader
import Footer from ./common/Footer
export default {
name: Coursethis.fitlers['size] = val
// console.log(val);
.get_course();
},handleCurrentChange(val){
page 获取所有分类数据
get_categorys(){
})
},1)"> 获取课程列表数据
get_course(){
})
}
}
}
>
2.后端
pagenation.py
from rest_framework.pagination PageNumberPagination
StandardPageNumberPagination(PageNumberPagination):
默认每一页显示的数据量
page_size = 2
允许客户端通过get参数来控制每一页的数据量
page_size_query_param = size
max_page_size = 10 客户端通过size指定获取数据的条数时,最大不能超过多少
from django.shortcuts render
from .pagenations StandardPageNumberPagination
加过滤
CourseView(ListAPIView):
......
pagination_class = StandardPageNumberPagination
drf接口调试
course/courses/?page=1
course/courses/?page=1&size=5
?
（编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
