ieplus/back-ui/src/views/dz/papers/components/paper-full-hand.vue

<template>
    <div v-loading="questionLoading" element-loading-text="加载试题中...">
        <el-row :gutter="20">
            <el-col :span="8">
                <el-form label-width="68px">
                    <BatchYearSelect v-model:batch-id="batchId" :batch-list="batchList" />
                    <el-form-item label="考生类型">
                        <el-select v-model="examType" clearable style="width: 227px">
                            <el-option v-for="e in examTypes" :label="e.dictLabel" :value="e.dictValue"/>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="科目">
                        <el-select v-model="subjectId" clearable style="width: 227px">
                            <el-option-group v-for="g in groupedSubjects" :label="g.label">
                                <el-option v-for="s in g.items" :label="`${s.subjectName}(${s.subjectId})`" :value="s.subjectId"/>
                            </el-option-group>
                        </el-select>
                    </el-form-item>
                </el-form>
            </el-col>
            <el-col :span="16">
                <class-statistic-table @stat-click="handleStatClick"/>
            </el-col>
        </el-row>
        <el-divider/>
        <el-row v-if="!hasBuiltPaper" :gutter="20">
            <el-col :span="6">
                <knowledge-tree/>
            </el-col>
            <el-col :span="18">
                <question-hand @submit="handleSubmit"/>
            </el-col>
        </el-row>
        <built-paper-list ref="built" @send="handleSubmit" />
        
        <!-- 学生列表弹窗 -->
        <student-list-dialog ref="studentDialogRef" :stat-type-map="statTypeMap"/>
    </div>
</template>

<script setup name="PaperFullHand">
import { ref, computed } from 'vue'
import {ElMessage} from "element-plus";
import router from "@/router/index.js";
import consts from "@/utils/consts.js";
import {useProvidePaperClassStatisticCondition} from "@/views/dz/papers/hooks/usePaperClassStatisticCondition.js";
import {useProvidePaperKnowledgeCondition} from "@/views/dz/papers/hooks/usePaperKnowledgeCondition.js";
import {useProvidePaperFullCondition} from "@/views/dz/papers/hooks/usePaperFullCondition.js";
import {usePaperStorage} from "@/views/dz/papers/hooks/usePaperStorage.js";
import ClassStatisticTable from "@/views/dz/papers/components/plugs/class-statistic-table.vue";
import KnowledgeTree from "@/views/dz/papers/components/plugs/knowledge-tree.vue";
import QuestionHand from "@/views/dz/papers/components/plugs/question-hand.vue";
import BuiltPaperList from "@/views/dz/papers/components/plugs/built-paper-list.vue";
import StudentListDialog from "@/views/dz/papers/components/plugs/student-list-dialog.vue";
import {useInjectGlobalLoading} from "@/views/hooks/useGlobalLoading.js";
import BatchYearSelect from "@/views/dz/papers/components/BatchYearSelect.vue";

const type = consts.enums.buildType.FullHand
const {
    batchId,
    batchList,
    examType,
    examTypes,
    subjectId,
    groupedSubjects,
    conditionArgs,
    onConditionReady,
    onBatchReady
} = useProvidePaperFullCondition(type)
const {selectedClasses, classList, loadClassStatistic} = useProvidePaperClassStatisticCondition()
const {knowledgeNode, knowledgeCheckNodes, loadKnowledge} = useProvidePaperKnowledgeCondition()
const {loading: globalLoading} = useInjectGlobalLoading()
const questionLoading = computed(() => globalLoading.value)
const built = ref(null)
const hasBuiltPaper = computed(() => built.value?.hasPaper)

// 统计字段映射
const statTypeMap = {
    'send': '组卷已完成',
    'total': '总人数',
    'unfinish': '组卷未完成',
    'unsend': '未组卷'
}

// 学生列表弹窗引用
const studentDialogRef = ref(null)

// 处理统计字段点击
const handleStatClick = async (row, statType) => {
    if (!row || !statType || !batchId.value) {
        console.error('参数错误:', { row, statType, batchId: batchId.value })
        return
    }
    
    // 构建查询条件参数
    const queryParams = {}
    if (conditionArgs.value) {
        if (conditionArgs.value.examType) queryParams.examType = conditionArgs.value.examType
        if (conditionArgs.value.subjectId) queryParams.subjectId = conditionArgs.value.subjectId
    }
    
    // 打开学生列表弹窗
    studentDialogRef.value?.open(row, statType, type, batchId.value, queryParams)
}

const handleSubmit = async (questions) => {
    // 如果 questions 未定义，说明是从已生成试卷触发的，不需要处理
    if (!questions) return
    
    // validation
    if (!batchId.value) return ElMessage.error('请选择批次')
    if (!examType.value) return ElMessage.error('请选择考生类型')
    if (!subjectId.value) return ElMessage.error('请选择科目')
    const classIds = selectedClasses.value.map(c => c.classId)
    if (!classIds.length) return ElMessage.error('请选择班级')
    if (!questions.length) return ElMessage.error('请将试题加入试题篮')

    const paper = {
        buildType: type,
        batchId: toValue(batchId),
        examType: toValue(examType),
        subjectId: toValue(subjectId),
        classIds,
        questions
    }
    usePaperStorage(paper)
    // 检查当前路由，避免冗余导航
    if (router.currentRoute.value.name !== 'PaperDetail') {
        await router.push({name: 'PaperDetail'})
    } else {
        // 如果已经在详情页，添加时间戳参数强制刷新
        await router.replace({
            name: 'PaperDetail',
            query: { _t: Date.now() }
        })
    }
}

let statArg = null
const _loadClassStatistic = async () => {
    selectedClasses.value = []
    classList.value = []

    await loadClassStatistic(statArg)
}

onConditionReady(async (payload) => {
    statArg = payload
    knowledgeNode.value = null
    knowledgeCheckNodes.value = []

    await loadKnowledge(payload)
    await _loadClassStatistic()
    await built.value.loadBuiltPaper(payload)
})

// 监听批次变化，调用接口
onBatchReady(async (payload) => {
    // 如果已经有完整的条件参数，更新批次ID；否则只使用批次
    if (statArg) {
        statArg = { ...statArg, batchId: payload.batchId }
    } else {
        statArg = payload
    }
    await _loadClassStatistic()
    await built.value.loadBuiltPaper(statArg)
})

watch(conditionArgs, () => built.value.reset())

// 刷新数据
const refresh = async () => {
    if (statArg) {
        await _loadClassStatistic()
        await built.value.loadBuiltPaper(statArg)
    }
}

defineExpose({ refresh })
</script>

<style scoped>

</style>