<script setup lang="ts">
import { useCookies } from '@vueuse/integrations/useCookies'
import { getExperimentExamList } from '../api'

interface Props {
  experiment_id: string
}
const props = defineProps<Props>()
const model = defineModel()

const cookies = useCookies()

const list = ref<any[]>([])

// 当前选中的考试
const currentExam = computed(() => {
  return list.value[0]
})

// 考试平台 URL
const examURL = computed(() => {
  if (!currentExam.value) return ''
  return `${import.meta.env.VITE_EXAM_SHOW_URL}/exam/${currentExam.value?.exam_id}`
  // return `https://dev.ezijing.com:5173/exam/7003551966412406784?has_time=0&has_submit=0&has_save=1&show_answer=1`
})

async function fetchInfo() {
  const res = await getExperimentExamList({ experiment_id: props.experiment_id })
  const resCookies = res.data.cookies
  cookies.set(resCookies.key, resCookies.auth_key, { domain: '.ezijing.com', path: '/' })
  list.value = res.data.items || []
  model.value = examURL.value
}
onMounted(() => {
  fetchInfo()
})
</script>

<template>
  <template v-if="currentExam">
    <el-form label-suffix="：" label-position="top">
      <el-form-item label="考试名称">{{ currentExam.exam_info.name }}</el-form-item>
      <el-form-item label="考试时间">{{ currentExam.exam_info.start_time }} ～ {{ currentExam.exam_info.end_time }}</el-form-item>
    </el-form>
    <!-- <teleport to=".lab-box">
      <iframe allowfullscreen class="iframe" :src="examURL" frameborder="0"></iframe>
    </teleport> -->
  </template>
  <el-empty description="暂无数据" v-else />
</template>
