<template>
  <el-dialog
    v-model="show" width="800" title="选择考官" append-to-body
    draggable
  >
    <el-form ref="dialogQueryRef" :inline="true" :model="queryParams" label-position="top">
      <el-form-item label="考官姓名" prop="name">
        <el-input v-model="queryParams.name" style="width: 214px;" placeholder="考官姓名" clearable @keyup.enter="handleQuery" />
      </el-form-item>
      <el-form-item label="证件号码" prop="idcCode">
        <el-input v-model="queryParams.idcCode" placeholder="身份证号" style="width: 214px" clearable @keyup.enter="handleQuery" />
      </el-form-item>
      <el-form-item label="&nbsp">
        <el-button type="primary" icon="Search" @click="handleQuery">查 询</el-button>
        <el-button type="" icon="Refresh" @click="resetQuery">重 置</el-button>
      </el-form-item>
    </el-form>
    <el-table v-loading="loading" border  :data="infoList">
      <el-table-column type="index" width="55" align="center" label="序号" />
      <el-table-column label="姓名" align="center" prop="name" />
      <!-- <el-table-column label="头像" align="center">
        <template #default="props">
          <el-image style="width: 70px; height: 70px" :src="fillImgUrl(props.row.photo)" />
        </template>
      </el-table-column> -->
      <el-table-column label="会员号" align="center" prop="perCode" />
      <el-table-column label="证件号码" align="center" prop="idcCode" min-width="200" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
          <span v-if="checkChosen(scope.row)">选择</span>
          <el-button v-else link type="primary" @click="handleChoose(scope.row)">选择</el-button>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>

<script setup>

import { getCurrentInstance, ref, toRefs } from 'vue'
import { reactive } from '@vue/runtime-core'
import { coachList } from '@/api/exam/info'
import _ from 'lodash'

const { proxy } = getCurrentInstance()
const emit = defineEmits(['chosen'])

const show = ref(false)
const infoList = ref([])
const loading = ref(false)

const data = reactive({
  queryParams: {
    name: null,
    idcCode: null,
    type: ''
  }
})
const { queryParams } = toRefs(data)


async function getList() {
  // 只能输入姓名+证件号  或  证件号
  if (!queryParams.value.idcCode) {
    return proxy.$modal.msgError('证件号不能为空')
  }
  loading.value = true
  infoList.value = []
  const res = await coachList(queryParams.value)
  loading.value = false
  if (res.data.length == 0) {
    return proxy.$modal.msgError('未查询到考官信息')
  }

  infoList.value = res.data
}

function checkChosen(row) {
  return _.some(chosen, (c) => {
    return c.perId == row.perId
  })
}

function handleQuery() {
  getList()
}

function resetQuery() {
  proxy.resetForm('dialogQueryRef')
  infoList.value = []
}

function handleChoose(row) {
  emit('chosen', {
    perId: row.perId,
    name: row.name
  }, ec)

  show.value = false
}

let ec = null
let chosen = null
function open(params) {
  ec = params.ec
  queryParams.value.type = params.type
  chosen = params.chosen || []
  resetQuery()
  show.value = true
}
defineExpose({
  open
})
</script>

<style scoped>

</style>