<script setup lang="ts">
import { getExperimentScore } from '../api'

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

let detail = $ref<any>()

function fetchInfo() {
  getExperimentScore({ experiment_id: props.experiment_id }).then(res => {
    detail = res.data
  })
}
onMounted(() => {
  fetchInfo()
})
</script>

<template>
  <el-dialog title="实验成绩详情" width="600px" :close-on-click-modal="false">
    <el-form label-width="120px" label-suffix="：" v-if="detail">
      <el-form-item label="实验名称">{{ detail.experiment.name }}</el-form-item>
      <el-form-item label="实验课程名称">{{ detail.experiment.course.name }}</el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="学生姓名">{{ detail.experiment.student.name }}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="学生学号">{{ detail.experiment.student.sno_number }}</el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="所属专业">{{ detail.experiment.student.specialty.name }}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="所属班级">{{ detail.experiment.student.specialty.name }}</el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="评分教师">
            {{
              detail.achievement.checker_sso_user.real_name ||
              detail.achievement.checker_sso_user.nickname ||
              detail.achievement.checker_sso_user.username
            }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="评分时间">{{ detail.achievement.check_time }}</el-form-item>
        </el-col>
      </el-row>
      <div>
        <p>实验得分{{ detail.achievement.score }}</p>
        <!-- <el-table :data="item.files" stripe :header-cell-style="{ background: '#ededed' }">
          <el-table-column label="实验成绩组成项" align="center"></el-table-column>
          <el-table-column label="权重" prop="type" align="center"> </el-table-column>
          <el-table-column label="得分" width="100" align="center">
            <template #default="{ row }">
              <el-button text type="primary"><a :href="row.url" target="_blank">查看明细</a></el-button>
            </template>
          </el-table-column>
        </el-table> -->
      </div>
    </el-form>
  </el-dialog>
</template>
