在线教育项目-day04【后台讲师添加模块】

1. 在teacher.js中添加如下代码

    //3.添加讲师

    save(teacher) {

        return request({

            url: `/eduservice/edu-teacher/addTeacher`,

            method: 'post',

            data: teacher

        })

    }

2. save.vue

<template>
  <div class="app-container">
    <el-form label-width="120px">
      <el-form-item label="讲师名称">
        <el-input v-model="teacher.name"/>
      </el-form-item>
      <el-form-item label="讲师排序">
        <el-input-number v-model="teacher.sort" controls-position="right" min="0"/>
      </el-form-item>
      <el-form-item label="讲师头衔">
        <el-select v-model="teacher.level" clearable placeholder="请选择">
          <!--
            数据类型一定要和取出的json中的一致，否则没法回填
            因此，这里value使用动态绑定的值，保证其数据类型是number
          -->
          <el-option :value="1" label="高级讲师"/>
          <el-option :value="2" label="首席讲师"/>
        </el-select>
      </el-form-item>
      <el-form-item label="讲师资历">
        <el-input v-model="teacher.career"/>
      </el-form-item>
      <el-form-item label="讲师简介">
        <el-input v-model="teacher.intro" :rows="10" type="textarea"/>
      </el-form-item>


      <!-- 讲师头像：TODO -->



      <el-form-item>
        <el-button :disabled="saveBtnDisabled" type="primary" @click="saveOrUpdate">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import teacher from "@/api/teacher/teacher";
export default {
    data(){
      return {
          teacher:{
              name: '',
              sort: 0,
              level: 1,
              career: '',
              intro: '',
              avatar: ''
          }
      }
    },
    created(){



    },
    methods:{
      saveOrUpdate(){
        this.saveTeacher()
      },
      saveTeacher(){
        teacher.save(this.teacher)
        .then(response=>{
            //提示信息
            return this.$message({
              type: 'success',
              message: '保存成功!'
            })
        
        })
        .then(response1=>{
　　　　　　//路由跳转
          this.$router.push({ path: '/example/table' })
        })
      }
    }
}
</script>

 3.为了展示的有顺序我们在查询方法中添加排序方法

    @PostMapping("PageFindCondition/{current}/{limit}")
    public R pageListCondition(@PathVariable long current,
                               @PathVariable long limit,
                               @RequestBody(required = false) TeacherQuery teacherQuery){
        Page<EduTeacher> page=new Page<>(current,limit);
        QueryWrapper<EduTeacher> wrapper=new QueryWrapper();
        //判断条件是否为空
        String name = teacherQuery.getName();
        Integer level = teacherQuery.getLevel();
        String begin = teacherQuery.getBegin();
        String end = teacherQuery.getEnd();
        if(!StringUtils.isEmpty(name)){
            wrapper.like("name",name);
        }
        if(!StringUtils.isEmpty(level)){
            wrapper.eq("level",level);
        }
        if(!StringUtils.isEmpty(begin)){
            wrapper.ge("gmt_create",begin);
        }
        if(!StringUtils.isEmpty(end)){
            wrapper.le("gmt_create",end);
        }
        wrapper.orderByDesc("gmt_create");
        eduTeacherService.page(page,wrapper);
        long total=page.getTotal();
        List<EduTeacher> records=page.getRecords();
        return R.OK().data("total",total).data("rows",records);
    }

 最终测试：