<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-wrap 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>
    <el-divider />
    <div class="text-center">
        <el-button type="primary" size="large" @click="buildPaper">生成试卷</el-button>
    </div>
</template>

<script setup name="QuestionIntelligent">

import {useProvidePaperQuestionCondition} from "@/views/dz/papers/hooks/usePaperQuestionCondition.js";
import {useInjectPaperKnowledgeCondition} from "@/views/dz/papers/hooks/usePaperKnowledgeCondition.js";

const props = defineProps({
    exactMode: Boolean
})
const emits = defineEmits(['submit'])

const seqClass = 'inline-block rounded-full bg-blue-100 w-5 h-5 text-center mr-2'
const {knowledgeCheckNodes, removeKnowledge} = useInjectPaperKnowledgeCondition()
const {qTypes} = useProvidePaperQuestionCondition(props.exactMode, false)

const buildPaper = function () {
    emits('submit', qTypes)
}
</script>

<style scoped>

</style>