<template>
    <el-text type="primary" tag="b">基础信息</el-text>
    <el-descriptions border :column="4" class="mb-5 mt-2">
        <el-descriptions-item label="组卷类型">{{classData.buildTypeName}}</el-descriptions-item>
        <el-descriptions-item label="批次">{{classData.batchName}}</el-descriptions-item>
        <el-descriptions-item label="科目">{{studentData.subjectName}}</el-descriptions-item>
        <el-descriptions-item label="班级">{{classData.className}}</el-descriptions-item>
        <el-descriptions-item label="姓名">{{studentData.studentName}}</el-descriptions-item>
        <el-descriptions-item label="总分">{{studentData.total}}</el-descriptions-item>
        <el-descriptions-item label="得分">{{studentData.score}}</el-descriptions-item>
        <el-descriptions-item label="得分率">{{studentData.rate}}</el-descriptions-item>
    </el-descriptions>
    <el-text type="primary" tag="b">知识点明细</el-text>
    <Table :data="detail" :columns="columns" style="width: 90%; margin-top: 5px">
        <template #rate="{row}">
            <el-text v-if="[undefined, null, NaN].includes(row.rate)">-</el-text>
            <el-text v-else :type="row.rate>90?'success':row.rate>70?'primary':'danger'">{{row.rate}}%</el-text>
        </template>
    </Table>
</template>

<script setup name="StudentDetail">
import Table from '@/components/Table/index.vue';
import {getPaperStudentDetail} from "@/api/dz/papers.js";

const props = defineProps({
    classData: Object,
    studentData: Object
})

const detail = ref([])

const columns = [
    {label: '知识点', prop: 'knowledgeName'},
    {label: '题量', prop: 'num'},
    {label: '正确数', prop: 'correct'},
    {label: '正确率', prop: 'rate', type: 'slot', slotName: 'rate'}
]

onMounted(async () => {
    const query = {
        buildType: props.classData.buildType,
        batchId: props.classData.batchId,
        classId: props.classData.classId,
        paperId: props.studentData.paperId,
        studentId: props.studentData.studentId,
        examineeId: props.studentData.examineeId
    }
    const res = await getPaperStudentDetail(query)
    detail.value = res.data
})
</script>

<style scoped>

</style>