<script setup lang="ts">
import type { Contestant } from '../types'
import { useMapStore } from '@/stores/map'
import { contestMode } from '@/utils/dictionary'

interface Props {
  data: Contestant
}

const props = defineProps<Props>()
// 参赛形式
const modeText = computed(() => {
  return contestMode[props.data.mode] || props.data.mode
})
// 性别
const genderList = useMapStore().getMapValuesByKey('system_gender')
const genderText = computed(() => {
  const found = genderList.find(item => item.value === props.data.student.gender)
  return found?.label || props.data.student.gender
})
// 证件类型
const idTypeList = useMapStore().getMapValuesByKey('system_id_type')
const idTypeText = computed(() => {
  const found = idTypeList.find(item => item.value === props.data.student.id_type)
  return found?.label || props.data.student.id_type
})
</script>

<template>
  <el-dialog title="查看参赛选手信息">
    <el-descriptions :column="4" border>
      <el-descriptions-item label="报名赛项">{{ data.competition.name }}</el-descriptions-item>
      <el-descriptions-item label="参赛形式">{{ modeText }}</el-descriptions-item>
      <el-descriptions-item label="姓名">{{ data.student.name }}</el-descriptions-item>
      <el-descriptions-item label="性别">{{ genderText }}</el-descriptions-item>
      <el-descriptions-item label="证件类型">{{ idTypeText }}</el-descriptions-item>
      <el-descriptions-item label="证件号码">{{ data.student.id_number }}</el-descriptions-item>
      <el-descriptions-item label="学校名称">{{ data.student.org?.department_name }}</el-descriptions-item>
      <el-descriptions-item label="省">{{ data.student.info.province_name }}</el-descriptions-item>
      <el-descriptions-item label="市">{{ data.student.info.city_name }}</el-descriptions-item>
      <el-descriptions-item label="区/县">{{ data.student.info.county_name }}</el-descriptions-item>
      <el-descriptions-item label="专业名称">{{ data.student.specialty?.name }}</el-descriptions-item>
      <el-descriptions-item label="年级">{{ data.grade }}</el-descriptions-item>
      <el-descriptions-item label="班级">{{ data.student.class?.name }}</el-descriptions-item>
      <el-descriptions-item label="指导教师">{{ data.teacher_name }}</el-descriptions-item>
      <el-descriptions-item label="证件照"><img :src="data.picture" width="200" /></el-descriptions-item>
    </el-descriptions>
    <el-row justify="center" style="margin-top: 40px">
      <el-button round auto-insert-space @click="$emit('update:modelValue', false)">关闭</el-button>
    </el-row>
  </el-dialog>
</template>
