<script setup lang="ts">
import { ref } from "vue";
import request, { download } from '~/utils/request';

// #region (constant)
const TABLE_KEY = 'xdjx_xsdj_id'
const URL_CUT = '/xdjx/xsdj'
// #endregion

// #region (type)
type TYPE_TABLE_FIELD = {
  [TABLE_KEY]: string;
  'xdjx_xsdj_xsxm': string; // 学生姓名
  'xdjx_xsdj_gender': string; // 性别
  'xdjx_xsdj_mz': string; // 民族
  'xdjx_xsdj_sfz': string; // 身份证
  'xdjx_xsdj_csrq': string; // 出生日期
  'xdjx_xsdj_lxfs': string; // 联系方式
  'xdjx_xsdj_jkzk': string; // 健康状况
  'xdjx_xsdj_djsj': string; // 登记时间
  'xdjx_xsdj_bhd': string; // 编号段
  'xdjx_xsdj_mssj': string; // 面试时间
  'xdjx_xsdj_bhjjr': string; // 包含节假日
}
// #endregion

// #region (variable)
const loading = ref(true)
// #endregion

// #region (props)
const props = defineProps<{
  aid: string,
}>()
// #endregion

function detailApi(_id: string) {
  return request({
    url: URL_CUT + '/detail',
    data: {
      [TABLE_KEY]: _id,
    }
  })
}

const detail_Data = ref<TYPE_TABLE_FIELD>()

// #region (page init)
async function init() {
  const res = await detailApi(props.aid)
  detail_Data.value = (res.data.one_info)
  loading.value = false
}
init()
// #endregion

</script>

<template>
  <div :loading="loading">
    <template v-if="detail_Data">
      <div class="flex">
        <div>学生姓名</div><div>{{detail_Data.xdjx_xsdj_xsxm}}</div>
      </div>
      <div class="flex">
        <div>性别</div><div>{{detail_Data.xdjx_xsdj_gender}}</div>
      </div>
      <div class="flex">
        <div>民族</div><div>{{detail_Data.xdjx_xsdj_mz}}</div>
      </div>
      <div class="flex">
        <div>身份证</div><div>{{detail_Data.xdjx_xsdj_sfz}}</div>
      </div>
      <div class="flex">
        <div>出生日期</div><div>{{detail_Data.xdjx_xsdj_csrq}}</div>
      </div>
      <div class="flex">
        <div>联系方式</div><div>{{detail_Data.xdjx_xsdj_lxfs}}</div>
      </div>
      <div class="flex">
        <div>健康状况</div><div>{{detail_Data.xdjx_xsdj_jkzk}}</div>
      </div>
      <div class="flex">
        <div>登记时间</div><div>{{detail_Data.xdjx_xsdj_djsj}}</div>
      </div>
      <div class="flex">
        <div>编号段</div><div>{{detail_Data.xdjx_xsdj_bhd}}</div>
      </div>
      <div class="flex">
        <div>面试时间</div><div>{{detail_Data.xdjx_xsdj_mssj}}</div>
      </div>
      <div class="flex">
        <div>包含节假日</div><div>{{detail_Data.xdjx_xsdj_bhjjr}}</div>
      </div>
    </template>      
  </div>

</template>
