<template>
  <el-dialog
    :title="dialogObj.title"
    :visible.sync="dialogObj.show"
  >
    <el-form ref="form" :model="form" label-width="120px">
      <el-form-item label="老师">
        <el-select v-model="form.teacher_id" placeholder="请选择">
          <el-option
            v-for="(data,index) in teacherList"
            :key="index"
            :label="data.name"
            :value="data.id">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
        <el-button @click="dialogObj.show = false">取 消</el-button>
        <el-button type="primary" @click="onSave">确 定</el-button>
      </span>
  </el-dialog>
</template>

<script>
  import {getTeacherListApi,addRelatedTeacherApi} from "../../service/api";
  export default {
    props:[
      'dialogObj'
    ],
    data(){
      return{
        form:{
          id: '',
          teacher_id:'',
        },
        teacherList:[],
      }
    },
    methods:{
      initPage(){
        let json ={
          page:1,
          limit:200
        }
        getTeacherListApi(json).then(res=>{
          this.teacherList = res.list;
        });
        this.form = {
          id: this.dialogObj.id,
          teacher_id: this.dialogObj.teacher_id ? this.dialogObj.teacher_id : ''
        };
      },
      onSave(){
        let json = {
          teacher_id:  this.form.teacher_id ? this.form.teacher_id : 0
        };
        addRelatedTeacherApi(this.form.id, json).then(res => {
          this.$message({
            type: 'success',
            message: '绑定成功!'
          });
          this.$emit("reflash");
          this.dialogObj.show = false;
        })
      }
    },
    watch:{
      'dialogObj.show'(value){
        if(value){
          this.initPage()
        }
      }
    }
  }
</script>

<style scoped>

</style>