1.3 前端页面说明
我的课程列表使用element 的card组件，如下：

页面布局代码如下：

<template>
<section> <el‐row ><el‐col :span="8"  :offset=2 >     <el‐card :body‐style="{ padding: '10px' }">  <img src="/static/images/add.jpg" class="image" height="150px"> <div style="padding: 10px;">   <span>课程名称</span>    <div class="bottom clearfix">  <time class="time"></time>  <router‐link class="mui‐tab‐item" :to="{path:'/course/add/base'}">        <el‐button type="text" class="button" >新增课程</el‐button>    </router‐link>     </div>   </div>    </el‐card>   </el‐col>    <el‐col :span="8" v‐for="(course, index) in courses" :key="course.id" :offset="index > 0 ?  2 : 2">  <el‐card :body‐style="{ padding: '10px' }">   <img :src="course.pic!=null?imgUrl+course.pic:'/static/images/nonepic.jpg'"  class="image" height="150px"> <div style="padding: 10px;">

<span>{{course.name}}</span> <div class="bottom clearfix">    <time class="time"></time>    <el‐button type="text" class="button" @click="handleManage(course.id)">管理课程 </el‐button>    </div>  </div>     </el‐card>   </el‐col>    <!‐‐分页‐‐>  <el‐col :span="24" class="toolbar"> <el‐pagination background layout="prev, pager, next" @currentchange="handleCurrentChange" :page‐size="size"     :total="total" :current‐page="page"   style="float:right;">  </el‐pagination>   </el‐col></el‐row> </section></template><script> import * as courseApi from '../api/course'; import utilApi from '../../../common/utils';   let sysConfig = require('@/../config/sysConfig')export default { data() {return { page:1,   size:7,    total: 0,   courses: [], sels: [],//列表选中列  imgUrl:sysConfig.imgUrl    }  },   methods: {  //分页方法   handleCurrentChange(val) {  this.page = val; },  //获取课程列表   getCourse() {  },   handleManage: function (id) {  console.log(id)    this.$router.push({ path: '/course/manager/'+id}) }    },created(){},    mounted() { }} </script> <style scoped>.el‐col‐8{  width:20%}   .el‐col‐offset‐2{  margin‐left:2%  }
.time { font‐size: 13px;   color: #999;
}
.bottom {   margin‐top: 13px;   line‐height: 12px; }   .button { padding: 0;   float: right;  }  .image { width: 100%;   display: block;  }   .clearfix:before,
.clearfix:after { display: table;   content: "";   } .clearfix:after {  clear: both  } </style>

1.4 Api接口
输入参数：
页码、每页显示个数、查询条件

输出结果类型：
QueryResponseResult<自定义类型>
在api工程创建course包，创建CourseControllerApi接口。

//查询课程列表 @ApiOperation("查询我的课程列表") public QueryResponseResult<CourseInfo> findCourseList( int page,     int size,     CourseListRequest courseListRequest );