learning-system-portal/src/views/lecturer/CoachingPage.vue

<script>
import {addTeacher, getCertificationProcess, setOfflineTutoring} from "@/api/modules/lecturer";
import processStatus from "@/components/processStatus.vue";

export default {
  name: "CoachingPage",
  components: {processStatus},
  data(){
    return{

      options: [],
      value: '',
      value2:'',
      teacherId:''
    }
  },
  created() {
    //读取路由参数
    this.teacherId=this.$route.query.teacherId
    //获取老师列表
    this.getTeacherList()
  },
  methods:{
    getTeacherList() {
      addTeacher({pageNo:1,pageSize:20,keyword:''}).then(res=>{
        this.options = res.data.map(item => {
          return { value: item.realName, label: item.realName };
        });
      })
    },
    getCoachingTeacher(val){
      addTeacher({pageNo:1,pageSize:20,keyword:val}).then(res=>{
        this.options = res.data.map(item => {
          return { value: item.realName, label: item.realName };
        });
      })
    },

    getJump(){
      let tutor=this.value.join(',')
      let tutorTime=this.value2
      if (tutor==''||tutorTime==''){
        this.$message({
          message: '请填写必填信息',
          type: 'error'
        });
      }else {
        setOfflineTutoring({teacherId:this.teacherId,tutor,tutorTime}).then(res=>{
          this.$router.push({
            path:'/need/coachingsuccess',
            query:{
              teacherId:this.teacherId
            }
          })
        })
      }
    }
  }
}
</script>

<template>
  <div>
    <process-status :teacherId="teacherId"></process-status>
    <div class="title">线下辅导</div>
    <el-container>
      <div class="form-table">
        <div class="tip" style="margin-bottom: 20px;color: #d7d7d7;">您还未完成线下辅导，快去约辅导老师辅导课件吧！</div>
        <el-form >
          <el-form-item required label="辅导老师：">
            <el-select
              v-model="value"
              multiple
              filterable
              remote
              reserve-keyword
              placeholder="请输入辅导老师姓名"
              :remote-method="getCoachingTeacher"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item required label="辅导时间：">
            <el-date-picker
              v-model="value2"
              type="datetime"
              placeholder="请选择辅导完成时间"
              format="yyyy-MM-dd HH:mm"
              value-format="yyyy-MM-dd HH:mm:ss">
            </el-date-picker>
          </el-form-item>
          <el-button type="primary" size="medium" style="margin-top: 20px;margin-left: 70px" @click="getJump()">已完成</el-button>
        </el-form>
        <div class="tip" style="margin-bottom: 20px;color: #797979;margin-top: 24px">提示：如若未完成线下辅导，请勿点击已完成！</div>
      </div>
    </el-container>

  </div>
</template>

<style scoped lang="scss">
.title{
  font-size: 16px;
  font-weight: 800;
  border-bottom: 1px solid rgba(153, 153, 153, 0.2);
  padding: 2px 2px 20px 2px;
}
.form-table{
  width: 100%;
  margin-top: 20px;
}
</style>