<template>
    <div class="text-main mb-3 flex items-center">
        <div :class="seqClass">1</div>选择知识点（从左侧勾选）
    </div>
    <div class="flex flex-row flex-wrap gap-3">
        <el-tag v-for="k in knowledgeCheckNodes" type="primary" round closable @close="removeKnowledge(k)">{{k.name}}</el-tag>
    </div>
    <div class="text-main mt-10 mb-3 flex items-center">
        <div :class="seqClass">2</div>试题设置
    </div>
    <div class="flex flex-row flex-warp gap-10">
        <div v-for="t in qTypes" class="flex items-center gap-3">
            <el-text class="font-bold break-keep">{{t.dictLabel}}</el-text>
            <el-input-number v-model="t.count" :min="0"/>
        </div>
    </div>
    <div class="mt-10 text-right">
        <el-button type="primary" size="large" @click="buildPaper">生成试卷</el-button>
    </div>
</template>

<script setup name="PaperQuestionIntelligent">

import {useInjectPaperExactCondition} from "@/views/dz/papers/hooks/usePaperExactCondition.js";
import {useInjectPaperFullCondition} from "@/views/dz/papers/hooks/usePaperFullCondition.js";
import {useProvidePaperQuestionCondition} from "@/views/dz/papers/hooks/usePaperQuestionCondition.js";
import {useInjectLoading} from "@/views/hooks/useLoading.js";
import {ElMessage} from "element-plus";
import {buildPaperAuto} from "@/api/dz/papers.js";
import {sleep} from "@/utils/index.js";
import router from "@/router/index.js";

const props = defineProps({
    allowMultiple: Boolean,
    exactMode: Boolean
})

const seqClass = 'inline-block rounded-full bg-blue-100 w-5 h-5 text-center mr-2'
const {knowledgeCheckNodes, removeKnowledge, paperArgs} = props.exactMode ? useInjectPaperExactCondition() : useInjectPaperFullCondition()
const {qTypes} = useProvidePaperQuestionCondition(props.exactMode, props.allowMultiple, true)
const {loading} = useInjectLoading()

const buildPaper = async function () {
    // validation
    const {batchId} = paperArgs.value
    if (!batchId) return ElMessage.error('请选择批次')
    if (!knowledgeCheckNodes.value.length) return ElMessage.error('请选择知识点')
    if (!qTypes.value.length || qTypes.value.every(t => !t.count)) return ElMessage.error('请填写题量')

    // build
    const commit = {
        ...paperArgs.value,
        paperDef: {
            knowIds: knowledgeCheckNodes.value.map(k => k.id),
            types: qTypes.value.map(t => ({
                type: t.dictValue,
                title: t.dictLabel,
                count: t.count
            }))
        }
    }
    await buildPaperAuto(commit)
    ElMessage.success('生成成功，即将打开组卷记录')
    sleep(2000)
    router.push('/paper/list')
}
</script>

<style scoped>

</style>