<template>
  <el-dialog v-model="showDialog" title="选择考官" destroy-on-close>
    <el-button :disabled="forbid" icon="Finished" type="success" @click="handelBatch">确定选择</el-button>
    <el-button icon="plus" type="primary" @click="handelAdd">添加考官</el-button>
    <br>
    <br>
    <el-table
      ref="multipleTableRef" v-loading="showLoading" border :data="list"
      style="width: 100%;" @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="40" align="center" />
      <el-table-column label="序号" type="index" width="55" align="center" />
      <el-table-column label="姓名" align="center" prop="perName" show-overflow-tooltip />
      <el-table-column label="会员号" align="center" prop="perCode" />
      <el-table-column label="有效日期" align="center" min-width="100">
        <template #default="{row}">
          <span :class="{'text-danger':row.canChoose!=1}">{{
            parseTime(row?.roleInfo?.validTime, '{y}-{m}-{d}')
          }}</span>
        </template>
      </el-table-column>
      <el-table-column label="注册单位" align="center" prop="roleInfo.unit" show-overflow-tooltip />
      <el-table-column label="添加方式" align="center" show-overflow-tooltip>
        <template #default="{row}">
          {{ row.type == 1 ? '省级' : '自行添加' }}
        </template>
      </el-table-column>
    </el-table>
    <!--    <ChooseExaminer ref="ChooseExaminerRef" is-validity="0" @chosen="chosenExaminer" />-->
    <ChooseRankExaminer ref="ChooseRankExaminerRef" is-validity="0" @chosen="chosenExaminer" />
  </el-dialog>
</template>


<script setup>
import { ref, computed, nextTick, getCurrentInstance } from 'vue'
import { listApi, otherAdd, selfAdd } from '@/api/exam/examinationAudit'
import useUserStore from '@/store/modules/user'
// import ChooseExaminer from '/@/views/exam/components/chooseExaminer.vue'
import ChooseRankExaminer from '/@/views/exam/components/chooseRankExaminer.vue'

const emit = defineEmits(['handelExaminer'])
const { proxy } = getCurrentInstance()
const memId = computed(() => useUserStore().memId)
const multipleTableRef = ref(null)
const showDialog = ref(false)
const list = ref([])
const ids = ref([])
const showLoading = ref(false)
const forbid = ref(true)
const selectList = ref([])

async function getList() {
  showLoading.value = true
  const res = await listApi({
    memId: memId.value
  })
  showLoading.value = false
  list.value = res.rows
  await nextTick(() => {
    for (const val of list.value) {
      if (val.roleInfo) val.roleInfo = JSON.parse(val.roleInfo)
      if (selectList.value.some(item => item.perId == val.perId)) {
        multipleTableRef.value.toggleRowSelection(val, true)
      }
    }
  })
}

function open(arr) {
  selectList.value = arr
  forbid.value = true
  showDialog.value = true
  getList()
}

function handelBatch() {
  const arr = []
  let flag = true
  for (const val of ids.value) {
    if (val.canChoose != 1) {
      proxy.$modal.msgError(`${val.perName}考官资质已过期`)
      flag = false
      return
    } else {
      arr.push({
        perId: val.perId,
        name: val.perName
      })
    }
  }
  if (ids.value.length % 2 === 0) {
    proxy.$modal.msgError('录入的考官人数必须为单数')
    return
  }
  if (ids.value.length > 3) {
    proxy.$modal.msgError('录入的考官人数不能超过3人')
    return
  }

  if (flag) {
    emit('handelExaminer', arr)
    showDialog.value = false
  }
}

function handleSelectionChange(row) {
  ids.value = row
  forbid.value = !row.length
}

function handelAdd() {
  proxy.$refs['ChooseRankExaminerRef'].open({
    ec: memId.value,
    type: '1',
    chosen: list.value
  })
}

async function chosenExaminer(row) {
  await selfAdd(memId.value, row.perId)
  await proxy.$modal.msgSuccess('操作成功！')
  await getList()
}


defineExpose({
  open

})
</script>


<style scoped lang="scss">

</style>