<template>
    <div style="height:100%;">
        <div class="main-box">
            <div class="top">
                智能组卷
            </div>
            <a-steps :current="current" class="steps-item">
                <a-step title="步骤一" description="预设试卷基础配置及确定试卷组卷方式。" />
                <a-step title="步骤二" description="设置相应的学科题型、题量等试卷数据，开始组卷" />
            </a-steps>
            <div class="steps-group">
                <Steps1 :examBox="examBox" ref="Steps1" v-if="current===0" style="width:500px" />
                <Steps2 :examBox="examBox" ref="Steps2" v-if="current===1" style="width:100%" />
            </div>
            <div class="bottom-box">
                <div v-if="current===0">
                    <a-button @click="toPath('qusetionBankManage')">取消</a-button>
                    <a-button type="primary" @click="comp(1)">下一步</a-button>
                </div>
                <div v-if="current===1">
                    <a-button :disabled="loading" @click="comp(-1)">上一步</a-button>
                    <a-button :loading="loading" type="primary" @click="_PaperAutoPaper">开始组卷</a-button>
                </div>
            </div>
        </div>
        <!-- 试卷分析抽屉 -->
        <div class="right-btn" @click="showDrawer" v-if="current===1">
            试卷分析
        </div>
        <TestAnalysisDraw ref="TestAnalysisDraw" />
    </div>
</template>
<script>
    let difficultyArr = [
        {
            name: '容易',
            value: 1,
            difficulty: 1,
            proportion: 20
        },
        {
            name: '较易',
            value: 2,
            difficulty: 2,
            proportion: 20
        },
        {
            name: '中等',
            value: 3,
            difficulty: 3,
            proportion: 20
        },
        {
            name: '较难',
            value: 4,
            difficulty: 4,
            proportion: 20
        },
        {
            name: '困难',
            value: 5,
            difficulty: 5,
            proportion: 20
        },
    ]
    import Steps1 from './components/Steps1.vue'
    import Steps2 from './components/Steps2.vue'
    import TestAnalysisDraw from './components/TestAnalysisDraw.vue'
    import { PaperCreate, PaperAutoPaper } from '@/api/api'
    export default {
        components: {
            Steps1,
            Steps2,
            TestAnalysisDraw
        },
        data() {
            return {
                loading: false,
                current: 0,
                examBox: {
                    name: '',
                    examTime: 0,
                    totalScore: 0,
                    difficulty: JSON.parse(JSON.stringify(difficultyArr)),//难度[]
                    subjectIds: [],//学科id
                    disciplines: [],//学科[]
                    paperCompositionModel: null,//组卷方式
                    autoPaperDisciplineSettings: [],//自动组卷学科设置
                }
            }
        },
        computed: {
            // difficultyArr() {
            //     return this.$store.state.baseInfo.Difficulty
            // }
        },
        watch: {
            // difficultyArr(nVal) {
            //     console.log(nVal, 'nVal难度')
            //     this.examBox.difficulty = [];
            //     nVal.forEach(item => {
            //         this.$nextTick(() => {
            //             this.examBox.difficulty.push({
            //                 ...item,
            //                 difficulty: item.value,
            //                 proportion: 0
            //             })
            //         })
            //     })
            // }
        },
        mounted() {
            // this.$store.dispatch('GetDifficulty')
        },
        methods: {
            //组卷
            _PaperAutoPaper() {
                let isOk = true;
                this.examBox.disciplines.forEach(item => {
                    item.autoPaperTypeSettings = [];
                    item.groupArr.forEach(v => {
                        item.autoPaperTypeSettings.push(...v.QuestionType)
                    })
                    try {
                        item.autoPaperTypeSettings.forEach(v => {
                            if (!v.disciplineQuestionTypeId) {
                                this.$message.error('您有题型未完成选择，请先完成选择再进行组卷')
                                isOk = false;
                                throw Error();
                            }
                        })
                    } catch (err) {
                        return;
                    }
                })
                if (!isOk) { return; }
                console.log(this.examBox, 'examBox')
                this.loading = true;
                //开始创建试卷
                let createData = {
                    name: this.examBox.name,
                    examTime: this.examBox.examTime,
                    disciplines: this.examBox.subjectIds
                }
                PaperCreate(createData).then(res => {
                    console.log(res, '创建返回res')
                    let params = {
                        paperId: res
                    }
                    let autoData = {
                        totalScore: this.examBox.totalScore,
                        autoPaperDisciplineSettings: this.examBox.disciplines,
                        paperCompositionModel: this.examBox.paperCompositionModel
                    }
                    PaperAutoPaper(autoData, params).then(res2 => {
                        console.log(res2, '自动组卷返回值')
                        this.loading = false;
                        this.$message.success('组卷成功')
                    }).catch(err => {
                        console.log(err, 'errr9999999')
                        this.$message.error(err.details)
                        this.loading = false;
                    })
                }).catch(err => {
                    this.loading = false;
                })
            },
            toPath(path) {
                this.$router.push({
                    name: path,
                })
            },
            comp(num) {
                if (num == 1) {
                    if (!this.examBox.name) {
                        this.$message.error('请输入试卷名称!')
                        return;
                    }
                    if (!this.examBox.examTime) {
                        this.$message.error('请输入考试时间!')
                        return;
                    }
                    if (!this.examBox.totalScore) {
                        this.$message.error('请输入总分数!')
                        return;
                    }
                    if (this.examBox.subjectIds.length == 0) {
                        this.$message.error('请选择学科!')
                        return;
                    }
                    if (this.examBox.paperCompositionModel == null) {
                        this.$message.error('请选择组卷方式!')
                        return;
                    }
                    let totalProportion = 0;
                    this.examBox.difficulty.forEach(item => {
                        totalProportion = totalProportion + item.proportion;
                    })
                    if (totalProportion != 100) {
                        this.$message.error('占比总和必须为100%!')
                        return;
                    }
                    this.examBox.disciplines = []
                    this.examBox.subjectIds.forEach(item => {
                        this.$store.state.baseInfo.Subjects.forEach(v => {
                            if (item == v.id) {
                                this.examBox.disciplines.push({
                                    ...v,
                                    disciplineId: v.id,
                                    autoPaperTypeSettings: [],
                                    totalScore: 0,
                                    groupArr: [],
                                    questionTypeArr: []
                                })
                            }
                        })
                    })
                    console.log(this.examBox, 'examBox')
                }
                this.current += num;
            },
            showDrawer() {
                this.$refs.TestAnalysisDraw.showDrawer(this.examBox)
            }
        }
    }
</script>
<style scoped>
    .main-box {
        position: relative;
        height: 100%;
    }

    .top {
        height: 50px;
        border-bottom: 1px solid rgba(232, 232, 232, 1);
        font-size: 21px;
        columns: #333333;
        padding: 8px 16px;
        font-family: 'Arial Normal', 'Arial', sans-serif;
        font-weight: 400;
        box-sizing: border-box;
    }

    .steps-item {
        height: 100px;
        margin-top: 24px;
        padding: 0 50px;
    }

    .steps-group {
        width: 100%;
        padding: 16px 50px;
        height: calc(100% - 224px);
        overflow-y: auto;
        display: flex;
        justify-content: center;
        /* background-color: pink; */
        box-sizing: border-box;
    }

    .bottom-box {
        width: 100%;
        height: 50px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        border-top: 1px solid rgba(232, 232, 232, 1);
        position: absolute;
        bottom: 0;
        left: 0;
    }

    .bottom-box button {
        margin-right: 36px;
    }

    .right-btn {
        position: absolute;
        right: 0;
        top: 45%;
        width: 36px;
        word-break: break-all;
        color: #fff;
        background-color: #40a9ff;
        border-radius: 2px;
        text-align: center;
        padding: 14px;
        cursor: pointer;
    }
</style>