<template>
    <view class="bg-white mx-card">
        <view class="p-30">
            <mx-question-content v-model="question.answer" :question="question" :sys-answer="question.answer1"
                                 disabled readonly/>
            <mx-question-parse :question="question" class="mt-40"/>
        </view>
        <uv-line/>
        <view class="grid grid-cols-3 py-20">
            <mx-question-collect :question="question" class="!items-start"/>
            <mx-question-correct :question="question" class="!items-center"/>
            <mx-tag-button type="error" icon="trash" text="删除" class="!items-end" @click="handleDelete"/>
        </view>
    </view>
</template>

<script setup>
import {createPropDefine} from "@/utils";
import MxQuestionParse from "@/components/mx-question/components/mx-question-parse.vue";
import MxQuestionCollect from "@/components/mx-question/components/mx-question-collect.vue";
import MxQuestionCorrect from "@/components/mx-question/components/mx-question-correct.vue";
import {confirmAsync} from "@/utils/uni-helper";
import {deleteWrongQuestion} from "@/api/webApi/webQue";

const props = defineProps({
    question: createPropDefine({}, Object)
})
const emits = defineEmits(['delete'])

const handleDelete = async () => {
    await confirmAsync('确认从错题本删除该题？')
    await deleteWrongQuestion({questionId: props.question.questionId})
    emits('delete', props.question.questionId)
}
</script>

<style lang="scss" scoped>
</style>
