<template>
  <div class="app-container">
    <mx-question-content v-if="question" :options="questionOptions"></mx-question-content>
    <div v-else-if="questionId">
      loading question id: {{ questionId }}
    </div>
    <div v-else>请输入questionId</div>
  </div>
</template>

<script>
import { getNextQuestionForImageGenerate } from '@/api/webApi/webQue'
import MxQuestionContent from '@/components/MxPaper/mx-question-content'

export default {
  name: 'QuestionPreview',
  components: { MxQuestionContent },
  data() {
    return {
      question: null
    }
  },
  computed: {
    questionId() {
      return this.$route.query.id || this.$route.query.questionId || 0
    },
    questionOptions() {
      return {
        question: this.question,
        allowAnswer: false,
        allowScore: false,
        examineeType: '',
        paperOptions: null
      }
    }
  },
  mounted() {
    this.loadQuestion()
  },
  methods: {
    loadQuestion() {
      if (this.questionId) {
        getNextQuestionForImageGenerate(this.$route.query)
          .then(res => this.question = res.data)
      }
    }
  }
}
</script>

<style scoped>

</style>
