<template>
  <DialogLayout :visible="show" @onCancel="show=false" width="350px" title="选择老师" @onConfirm="$emit('onChange',current_teacher)">
    <div class="gy-form" style="--fix:70px;">
      <div class="gy-form-item mb">
        <div class="gy-label middle">老师：</div>
        <el-select
            v-model="current_teacher"
            placeholder="请选择" value-key="id">
            <el-option
              v-for="v in form_manage_teacher"
              :key="v.id"
              :label="v.name"
              :value="v"
            />
          </el-select>
      </div>
    </div>
  </DialogLayout>
</template>

<script>
import '@/views/assessment-evaluation/utils/gyStyle.scss'
import DialogLayout from '@/components/layout/DialogLayout.vue'
import { getAllTeacher } from '@/api/assessment-evaluation/exam'
export default {
  components: { DialogLayout },
  data: _ => ({
    show: false,
    form_manage_teacher: [],
    current_teacher: {}
  }),
  mounted () {
    this.getAllTeacher()
  },
  props: {
    value: {
      default: false
    },
    teacher: {
      default: null
    }
  },
  watch: {
    value: {
      immediate: true,
      handler (nv) { this.show = nv }
    },
    show: {
      handler (nv) { this.$emit('input', nv) }
    },
    teacher: {
      handler (nv) {
        if (nv) {
          this.current_teacher = nv
        }
      }
    }
  },
  methods: {
    /**
     * 获取系统中所有教员
     */
    getAllTeacher () {
      getAllTeacher().then(res => {
        this.form_manage_teacher = res.data
      })
    }
  }
}
</script>

<style>

</style>
