<template>
  <div class="edit-paper">
    <div class="edit-header">
      <div class="edit-header-top box-justify">
        <div class="header-info">
          <div class="header-info-item">
            <span>课程代码：</span>
            <span>{{ paper.course.code }}</span>
          </div>
          <div class="header-info-item">
            <span>课程名称：</span>
            <span>{{ paper.course.name }}</span>
          </div>
          <div class="header-info-item">
            <span>试卷名称：</span>
            <span>
              <el-tooltip class="item" effect="dark" placement="top-start">
                <div slot="content">{{ paper.name }}</div>
                <el-input
                  v-model="paper.name"
                  size="mini"
                  class="header-info-input"
                  placeholder="试卷名称"
                ></el-input>
              </el-tooltip>
            </span>
          </div>
          <div class="header-info-item">
            <span>试卷标题：</span>
            <span>
              <el-tooltip class="item" effect="dark" placement="top-start">
                <div slot="content">{{ paper.title }}</div>
                <el-input
                  v-model="paper.title"
                  size="mini"
                  class="header-info-input"
                  placeholder="试卷标题"
                ></el-input>
              </el-tooltip>
            </span>
          </div>
          <div class="header-info-item">
            <span>试卷总分：</span>
            <span>{{ paper.totalScore }}</span>
          </div>
        </div>
        <div class="header-btns">
          <el-button type="primary" size="small" @click="toSavePaper">
            保存
          </el-button>
          <el-button
            type="danger"
            plain
            size="small"
            @click="toDeletePaper(paper.id)"
          >
            删除
          </el-button>
          <el-button
            v-if="checkDuplicateBtnShow"
            type="primary"
            size="small"
            plain
            @click="toCheckDuplicate"
          >
            进入查重
          </el-button>
          <el-button
            size="small"
            type="primary"
            plain
            @click="toImportPaperAnswer"
            >导入答案</el-button
          >
          <el-button
            size="small"
            type="primary"
            plain
            @click="toExportPaperAnswer"
            >导出答案</el-button
          >
          <el-button
            size="small"
            type="danger"
            plain
            icon="icon icon-back"
            @click="toBack"
            >返回</el-button
          >
        </div>
      </div>
      <div class="edit-header-bottom box-justify">
        <div>
          <el-button type="info" size="small" @click="toViewBaseInfo">
            基础构成
          </el-button>
          <el-button type="info" size="small" @click="toViewQuestypeInfo">
            题型分布
          </el-button>
          <el-button type="info" size="small" @click="toViewBlueInfo">
            蓝图分布
          </el-button>
          <el-button type="info" size="small" @click="toViewAuditInfo">
            审核记录
          </el-button>
          <el-button
            v-if="enableCardEdit"
            type="info"
            size="small"
            @click="toEditCard"
          >
            编辑题卡
          </el-button>
        </div>
        <div>
          <el-button
            type="primary"
            size="small"
            plain
            @click="toSwitchQuesTagShowHide"
          >
            {{ quesTagShow ? "隐藏" : "显示" }}属性
          </el-button>
          <el-button
            type="primary"
            size="small"
            plain
            @click="toSwitchQuesAnswerShowHide"
          >
            {{ quesAnswerShow ? "隐藏" : "显示" }}答案
          </el-button>
        </div>
      </div>
    </div>

    <div class="edit-body">
      <!-- 考试说明 -->
      <div class="edit-part-list">
        <div class="edit-part">
          <div class="edit-cont">
            <div class="edit-cont-title">
              <h3>考试说明</h3>
            </div>
            <div class="edit-cont-action">
              <el-button
                type="primary"
                plain
                size="small"
                @click="toEditExamRemark"
                >编辑</el-button
              >
            </div>
            <div class="edit-cont-body">
              <rich-text :text-json="paper.examRemark"></rich-text>
            </div>
          </div>
        </div>
      </div>

      <!-- 循环大题 -->
      <div
        v-for="(paperDetail, detailIndex) in paper.paperDetails"
        :key="paperDetail.id"
        class="edit-part-list"
      >
        <div class="edit-part">
          <div class="edit-cont">
            <div class="edit-cont-title">
              <h3>
                <span>{{ paperDetail.cnNum }}</span> <span>.</span>
                <span>{{ paperDetail.name }}</span>
                <span>
                  ({{
                    !paperDetail.title ? "本大题" : paperDetail.title + "，"
                  }}共{{ paperDetail.unitCount }}小题，满分{{
                    paperDetail.score
                  }}分)
                </span>
              </h3>
            </div>
            <rich-text
              class="edit-cont-body"
              :text-json="paperDetail.description"
            ></rich-text>
            <div class="edit-cont-action">
              <el-button
                v-show="parentView === 'gen_paper'"
                size="small"
                type="primary"
                plain
                @click="toSelectPaperDetailQues(paperDetail)"
                >选题
              </el-button>
              <el-button
                size="small"
                type="primary"
                plain
                @click="toEditPaperDetail(paperDetail)"
                >编辑
              </el-button>
              <el-button
                v-if="detailIndex"
                size="small"
                type="primary"
                plain
                @click="toMovePaperDetail(paperDetail, 'up')"
                >上移
              </el-button>
              <el-button
                v-if="detailIndex < paper.paperDetails.length - 1"
                size="small"
                type="primary"
                plain
                @click="toMovePaperDetail(paperDetail, 'down')"
                >下移
              </el-button>
              <el-button
                size="small"
                type="danger"
                @click="toDeletePaperDetail(paperDetail)"
                >删除
              </el-button>
              <el-button
                size="small"
                type="primary"
                plain
                :icon="
                  paperDetail.showQuestions
                    ? 'el-icon-arrow-up'
                    : 'el-icon-arrow-down'
                "
                @click.stop="
                  paperDetail.showQuestions = !paperDetail.showQuestions
                "
              ></el-button>
            </div>
          </div>
          <div v-show="quesTagShow" class="edit-property">
            <div class="edit-property-box">
              <div
                v-for="(paperDetailTag, tagIndex) in paperDetail.tags"
                :key="tagIndex"
                class="edit-property-item"
              >
                <div class="edit-property-body edit-property-danger">
                  <div class="edit-property-title">
                    {{ paperDetailTag.tag }}
                  </div>
                  <div class="edit-property-content">
                    {{ paperDetailTag.content }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 循环小题 -->
        <div v-show="paperDetail.showQuestions" class="edit-paper-questions">
          <template
            v-for="(paperDetailUnit, unitIndex) in paperDetail.paperDetailUnits"
          >
            <div
              :key="`question-${unitIndex}`"
              :class="[
                'edit-part',
                {
                  'question-duplicate':
                    paperDetailUnit.question.checkDuplicateStatus ==
                    'TO_BE_DISPOSE',
                },
              ]"
            >
              <div class="edit-cont">
                <div class="edit-cont-title">
                  <span>{{ paperDetailUnit.number }}.</span>
                  <rich-text
                    :text-json="paperDetailUnit.question.quesBody"
                  ></rich-text>
                  <span> （{{ paperDetailUnit.score }}分） </span>
                </div>
                <div class="edit-cont-body">
                  <div
                    v-for="(quesOption, optionIndex) in paperDetailUnit.question
                      .quesOptions"
                    :key="optionIndex"
                    class="paper-option"
                  >
                    <span>{{ optionIndex | optionOrderWordFilter }}. </span>
                    <rich-text :text-json="quesOption.optionBody"></rich-text>
                  </div>
                  <div v-if="!isNested(paperDetailUnit.questionType)">
                    <div v-show="quesAnswerShow" class="paper-answer">
                      <span>答案：</span>
                      <question-answer
                        :data="paperDetailUnit.question"
                      ></question-answer>
                    </div>
                  </div>
                </div>
                <div class="edit-cont-action">
                  <span class="tips-info">
                    {{ paperDetailUnit.question.bodyLengthText }}
                  </span>
                  <el-button
                    v-if="
                      paperDetailUnit.question.checkDuplicateStatus ===
                      'TO_BE_DISPOSE'
                    "
                    size="small"
                    type="primary"
                    plain
                    @click="
                      toCheckDuplicateQuestion(paperDetailUnit.question.id)
                    "
                    >进入查重
                  </el-button>
                  <el-button
                    size="small"
                    type="primary"
                    plain
                    @click="toEditQues(paperDetailUnit)"
                    >编辑
                  </el-button>
                  <el-button
                    v-if="unitIndex"
                    size="small"
                    type="primary"
                    plain
                    @click="
                      toMoveQues(paperDetail.id, paperDetailUnit.id, 'up')
                    "
                    >上移
                  </el-button>
                  <el-button
                    v-if="unitIndex < paperDetail.paperDetailUnits.length"
                    size="small"
                    type="primary"
                    plain
                    @click="
                      toMoveQues(paperDetail.id, paperDetailUnit.id, 'down')
                    "
                    >下移
                  </el-button>
                  <el-button
                    type="danger"
                    size="small"
                    @click="toDeleteQues(paperDetailUnit)"
                    >删除
                  </el-button>
                  <el-button
                    v-if="isNested(paperDetailUnit.questionType)"
                    size="small"
                    :icon="
                      paperDetailUnit.showSubQuestions
                        ? 'el-icon-arrow-up'
                        : 'el-icon-arrow-down'
                    "
                    @click.stop="
                      paperDetailUnit.showSubQuestions =
                        !paperDetailUnit.showSubQuestions
                    "
                  ></el-button>
                </div>
              </div>
              <div v-show="quesTagShow" class="edit-property">
                <div class="edit-property-box">
                  <div
                    v-for="(questionTag, tagIndex) in paperDetailUnit.question
                      .tags"
                    :key="tagIndex"
                    class="edit-property-item"
                  >
                    <div class="edit-property-body">
                      <div class="edit-property-title">
                        {{ questionTag.tag }}
                      </div>
                      <div class="edit-property-content">
                        {{ questionTag.content }}
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              v-if="isNested(paperDetailUnit.questionType)"
              v-show="paperDetailUnit.showSubQuestions"
              :key="`question-sub-${unitIndex}`"
              class="edit-paper-question-subs"
            >
              <div
                v-for="(subQuestion, subIndex) in paperDetailUnit.question
                  .subQuestions"
                :key="subIndex"
                class="edit-part"
              >
                <div class="edit-cont">
                  <div class="edit-cont-title">
                    <span>{{ subIndex + 1 }}. </span>
                    <rich-text :text-json="subQuestion.quesBody"></rich-text>
                    <span
                      >（{{ paperDetailUnit.subScoreList[subIndex] }}分）</span
                    >
                  </div>
                  <div
                    v-if="!isMatchingQuestion(paperDetailUnit.questionType)"
                    class="edit-cont-body"
                  >
                    <div
                      v-for="(
                        subQuesOption, subOptIndex
                      ) in subQuestion.quesOptions"
                      :key="subOptIndex"
                      class="paper-option"
                    >
                      <span>{{ subOptIndex | optionOrderWordFilter }}. </span>
                      <rich-text
                        :text-json="subQuesOption.optionBody"
                      ></rich-text>
                    </div>
                  </div>
                  <div v-show="quesAnswerShow" class="paper-answer">
                    <span>答案：</span>
                    <question-answer :data="subQuestion"></question-answer>
                    <!-- <rich-text :text-json="subQuestion.quesAnswer"></rich-text> -->
                  </div>
                </div>
                <div v-show="quesTagShow" class="edit-property">
                  <div class="edit-property-box">
                    <div
                      v-for="(subQuestionTag, tagIndex) in subQuestion.tags"
                      :key="tagIndex"
                      class="edit-property-item"
                    >
                      <div class="edit-property-body">
                        <div class="edit-property-title">
                          {{ subQuestionTag.tag }}
                        </div>
                        <div class="edit-property-content">
                          {{ subQuestionTag.content }}
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </template>
        </div>
      </div>
    </div>

    <!-- 编辑考试说明 -->
    <modify-rich-text
      ref="ModifyRichText"
      :content="paper.examRemark"
      @modified="examRemarkModified"
    ></modify-rich-text>
    <!-- 编辑大题弹框 -->
    <modify-detail-struct
      ref="ModifyDetailStruct"
      :detail="curDetail"
      only-name
      @modified="detailModified"
    ></modify-detail-struct>
    <!-- 基础构成 -->
    <paper-base-info ref="PaperBaseInfo" :paper-id="paperId"></paper-base-info>
    <!-- 上传答案文件 -->
    <import-file-dialog
      ref="ImportAnswerDialog"
      dialog-title="上传答案文件"
      :template-url="answerTemplateUrl"
      :upload-url="uploadAnswerUrl"
      add-file-param="dataFile"
      @uploaded="initPaper"
    ></import-file-dialog>
    <!-- 题型分布 -->
    <paper-questype-info
      ref="PaperQuestypeInfo"
      :paper-id="paperId"
    ></paper-questype-info>
    <!-- 蓝图分布 -->
    <paper-blue-info
      ref="PaperBlueInfo"
      :paper-id="paperId"
      :course-id="paper.course.id"
    ></paper-blue-info>
    <!-- 审核记录 -->
    <paper-audit-info
      ref="PaperAuditInfo"
      :paper-id="paperId"
    ></paper-audit-info>
    <!-- 试题编辑  -->
    <question-edit-dialog
      ref="QuestionEditDialog"
      :question="curQuestion"
      @modified="questionEdited"
    ></question-edit-dialog>
    <!-- SelectQuestionDialog -->
    <select-question-dialog
      ref="SelectQuestionDialog"
      :course-id="paper.course.id"
      :disabled-question-ids="paperQuestionIds"
      @confirm="questionSelected"
    ></select-question-dialog>
  </div>
</template>

<script>
import {
  paperDetailApi,
  paperSaveApi,
  paperDeleteApi,
  paperDetailUpdateApi,
  paperDetailMoveApi,
  paperDetailDeleteApi,
  paperQuestionMoveApi,
  paperQuestionDeleteApi,
  paperQuestionUnitDeleteApi,
  paperQuestionSaveApi,
  paperDetailAddQuestionApi,
} from "../api";
import { QUESTION_API } from "@/constants/constants";

import ImportFileDialog from "@/components/ImportFileDialog.vue";
import PaperBaseInfo from "../components/PaperBaseInfo.vue";
import PaperQuestypeInfo from "../components/PaperQuestypeInfo.vue";
import PaperBlueInfo from "../components/PaperBlueInfo.vue";
import PaperAuditInfo from "../components/PaperAuditInfo.vue";
import ModifyDetailStruct from "../components/ModifyDetailStruct.vue";
import ModifyRichText from "@/components/ModifyRichText.vue";
import QuestionEditDialog from "../../question/components/QuestionEditDialog.vue";
import SelectQuestionDialog from "../components/SelectQuestionDialog.vue";
import { calcSum } from "@/plugins/utils";

export default {
  name: "EditPaper",
  components: {
    PaperBaseInfo,
    PaperQuestypeInfo,
    PaperAuditInfo,
    PaperBlueInfo,
    ModifyDetailStruct,
    ModifyRichText,
    QuestionEditDialog,
    ImportFileDialog,
    SelectQuestionDialog,
  },
  data() {
    return {
      paperId: "",
      parentView: "",
      paper: {
        name: "",
        title: "",
        totalScore: 0,
        course: {
          id: "",
          code: "",
          name: "",
        },
        examRemark: "",
        paperDetails: [],
      },
      checkDuplicateBtnShow: false,
      quesTagShow: false,
      quesAnswerShow: false,
      curDetail: {},
      curQuestion: {},
      paperQuestionIds: [],
      // upload answer
      uploadAnswerUrl: "",
      answerTemplateUrl: "",
    };
  },
  computed: {
    user() {
      return this.$store.state.user;
    },
    enableCardEdit() {
      return (
        this.paper.auditStatus === "PASS" && this.paper.paperType === "GENERATE"
      );
    },
  },
  created() {
    let qt = sessionStorage.getItem("quesTagShow");
    if (qt) {
      this.quesTagShow = qt === "true";
    }
    let qa = sessionStorage.getItem("quesAnswerShow");
    if (qa) {
      this.quesAnswerShow = qa === "true";
    }
    this.paperId = Number(this.$route.params.id);
    this.parentView = this.$route.params.parentView;
    this.initPaper();
  },
  methods: {
    async initPaper() {
      const res = await paperDetailApi(this.paperId);
      res.data.paperDetails.forEach((detail) => {
        detail.showQuestions = true;
        detail.paperDetailUnits.forEach((question) => {
          question.showSubQuestions = true;
        });
      });
      this.paper = res.data;
      this.showCheckDuplicate();
    },
    // header-actions
    showCheckDuplicate() {
      if (this.paper.checkDuplicateStatus === "DISPOSED") {
        this.checkDuplicateBtnShow = false;
        return;
      }

      this.checkDuplicateBtnShow = this.paper.paperDetails.some((detail) =>
        detail.paperDetailUnits.some(
          (question) =>
            question.question.checkDuplicateStatus === "TO_BE_DISPOSE"
        )
      );
    },
    toCheckDuplicate() {
      this.$router.push({
        name: "check_duplicate_info",
        query: {
          basePaperId: this.paper.id,
          from: "paper",
        },
      });
    },
    // 保存试卷
    async toSavePaper() {
      const res = await paperSaveApi(this.paper).catch((error) => {
        this.$notify({
          type: "error",
          message: error.response.data.desc,
        });
      });

      if (!res) return;
      this.$message.success("保存成功!");
    },
    // 删除试卷
    async toDeletePaper() {
      const confirm = await this.$confirm(`确定要删除该试卷吗?`, "提示", {
        type: "warning",
      }).catch(() => {});
      if (confirm !== "confirm") return;

      const res = await paperDeleteApi(this.paper).catch((error) => {
        this.$notify({
          type: "error",
          message: error.response.data.desc,
        });
      });

      if (!res) return;
      this.$message.success("删除成功!");
      window.history.go(-1);
      this.toBack();
    },
    // 导入答案
    toImportPaperAnswer() {
      const { key, token } = this.user;
      this.answerTemplateUrl = `${QUESTION_API}/paper/answer/template?$key=${key}&$token=${token}`;
      this.uploadAnswerUrl = `${QUESTION_API}/paper/answer/import/${this.paperId}`;
      this.$refs.ImportAnswerDialog.open();
    },
    // 导出答案
    toExportPaperAnswer() {
      const { key, token } = this.user;
      const url = `${QUESTION_API}/paper/answer/export/${this.paperId}?$key=${key}&$token=${token}`;
      window.open(url);
    },
    toBack() {
      window.history.go(-1);
    },
    // 显示/隐藏答案
    toSwitchQuesAnswerShowHide() {
      this.quesAnswerShow = !this.quesAnswerShow;
      sessionStorage.setItem("quesAnswerShow", this.quesAnswerShow);
    },
    // 显示/隐藏属性
    toSwitchQuesTagShowHide() {
      this.quesTagShow = !this.quesTagShow;
      sessionStorage.setItem("quesTagShow", this.quesTagShow);
    },
    // 查看基础构成
    toViewBaseInfo() {
      this.$refs.PaperBaseInfo.open();
    },
    // 查看题型分布
    toViewQuestypeInfo() {
      this.$refs.PaperQuestypeInfo.open();
    },
    // 查看蓝图分布
    toViewBlueInfo() {
      this.$refs.PaperBlueInfo.open();
    },
    // 查看审核信息
    toViewAuditInfo() {
      this.$refs.PaperAuditInfo.open();
    },
    // 编辑题卡
    toEditCard() {
      this.$router.push({
        name: "CardEdit",
        params: {
          idType: "paper",
          paperOrCardId: this.paperId,
        },
      });
    },
    // header-action ----end
    // 考试说明
    toEditExamRemark() {
      this.$refs.ModifyRichText.open();
    },
    examRemarkModified(content) {
      this.paper.examRemark = content;
      this.toSavePaper();
    },
    getPaperQuestionIds() {
      let ids = [];
      this.paper.paperDetails.forEach((detail) => {
        let qids = detail.paperDetailUnits.map((q) => q.question.id);
        ids.push(...qids);
      });
      return ids;
    },
    // detail-action
    // 大题选题
    toSelectPaperDetailQues(detail) {
      this.curDetail = detail;
      this.paperQuestionIds = this.getPaperQuestionIds();
      this.$refs.SelectQuestionDialog.open();
    },
    async questionSelected(questions) {
      if (!questions.length) {
        this.$message.error("请选择试题！");
        return;
      }

      const res = await paperDetailAddQuestionApi(
        this.paperId,
        this.curDetail.id,
        questions
      ).catch(() => {});
      if (!res) return;

      this.$message.success("添加成功！");
      this.initPaper();
    },
    // 大题编辑
    toEditPaperDetail(detail) {
      this.curDetail = detail;
      this.$refs.ModifyDetailStruct.open();
    },
    async detailModified(detail) {
      const res = await paperDetailUpdateApi(this.paperId, detail).catch(
        (error) => {
          this.$notify({
            type: "error",
            message: error.response.data.desc,
          });
        }
      );

      if (!res) return;
      this.$message.success("修改成功!");

      const paperDetail = this.paper.paperDetails.find(
        (item) => item.id === detail.id
      );
      if (!paperDetail) return;
      paperDetail.name = detail.name;
      paperDetail.description = detail.description;
    },
    // 移动大题
    async toMovePaperDetail(detail, vector) {
      const vectorStr = vector == "up" ? "上移" : "下移";
      const confirm = await this.$confirm(
        `确定要${vectorStr}该大题吗?`,
        "提示",
        {
          type: "warning",
        }
      ).catch(() => {});
      if (confirm !== "confirm") return;

      const res = await paperDetailMoveApi({
        paperId: this.paperId,
        detailId: detail.id,
        vector,
      }).catch((error) => {
        this.$notify({
          type: "error",
          message: error.response.data.desc,
        });
      });

      if (!res) return;
      this.$message.success("操作成功!");
      this.initPaper();
    },
    // 删除大题
    async toDeletePaperDetail(detail) {
      if (detail.paperDetailUnits.length) {
        this.$message.error("大题下还有小题，不可删除！");
        return;
      }

      const confirm = await this.$confirm(`确定要删除该大题吗?`, "提示", {
        type: "warning",
      }).catch(() => {});
      if (confirm !== "confirm") return;

      const res = await paperDetailDeleteApi({
        paperId: this.paperId,
        detailId: detail.id,
      }).catch((error) => {
        this.$notify({
          type: "error",
          message: error.response.data.desc,
        });
      });

      if (!res) return;
      this.$message.success("操作成功!");
      this.initPaper();
    },
    // detail-action ----end
    // question-action
    toCheckDuplicateQuestion(questionId) {
      this.$router.push({
        name: "check_duplicate_info",
        query: {
          quesId: questionId,
          basePaperId: this.paperId,
          from: "paper",
        },
      });
    },
    // 编辑小题
    toEditQues(row) {
      let question = row.question;
      const courseInfo = {
        courseId: question.course.id,
        courseCode: question.course.code,
        courseName: question.course.name,
      };
      let curQuestion = {
        ...question,
        ...courseInfo,
        score: row.score,
        editMode: "paper",
        questionUnitId: row.id,
      };
      if (curQuestion.subQuestions && curQuestion.subQuestions.length) {
        curQuestion.subQuestions = curQuestion.subQuestions.map((q, qindex) => {
          return {
            ...q,
            ...courseInfo,
            score: row.subScoreList[qindex],
            editMode: "paper",
          };
        });
      }
      this.curQuestion = curQuestion;

      this.$refs.QuestionEditDialog.open();
    },
    async questionEdited(question) {
      let subScoreList = [];
      if (question.subQuestions && question.subQuestions.length) {
        subScoreList = question.subQuestions.map((item) => item.score || 0);
        question.score = calcSum(subScoreList);
      }
      let questionUnit = {
        id: this.curQuestion.questionUnitId,
        question,
        score: question.score,
      };
      if (subScoreList.length) questionUnit.subScoreList = subScoreList;
      const res = await paperQuestionSaveApi(questionUnit).catch(() => {});
      if (!res) return;
      this.$message.success("保存成功！");
      this.initPaper();
    },
    // 移动小题
    async toMoveQues(detailId, unitid, vector) {
      const vectorStr = vector == "up" ? "上移" : "下移";
      const confirm = await this.$confirm(
        `确定要${vectorStr}该小题吗?`,
        "提示",
        {
          type: "warning",
        }
      ).catch(() => {});
      if (confirm !== "confirm") return;

      const res = await paperQuestionMoveApi({
        detailId,
        unitid,
        vector,
      }).catch((error) => {
        this.$notify({
          type: "error",
          message: error.response.data.desc,
        });
      });

      if (!res) return;
      this.$message.success("操作成功!");
      this.initPaper();
    },
    // 删除小题
    async toDeleteQues(paperDetailUnit) {
      const confirm = await this.$confirm(`确定要删除该题吗?`, "提示", {
        type: "warning",
      }).catch(() => {});
      if (confirm !== "confirm") return;

      if (this.paper.paperType == "GENERATE") {
        const res = await paperQuestionDeleteApi(paperDetailUnit.id).catch(
          (error) => {
            this.$notify({
              type: "error",
              message: error.response.data.desc,
            });
          }
        );
        if (!res) return;
      } else {
        let questionId = paperDetailUnit.question.id;
        const res = await paperQuestionUnitDeleteApi({
          unitid: paperDetailUnit.id,
          questionId,
        }).catch((error) => {
          this.$notify({
            type: "error",
            message: error.response.data.desc,
          });
        });
        if (!res) return;
      }

      this.$message.success("操作成功!");
      this.initPaper();
    },

    // other
    isNested(questionType) {
      const nestedQuestion = [
        "PARAGRAPH_MATCHING",
        "BANKED_CLOZE",
        "CLOZE",
        "READING_COMPREHENSION",
        "LISTENING_QUESTION",
      ];

      return nestedQuestion.includes(questionType);
    },
    isMatchingQuestion(questionType) {
      const typeQuestion = ["PARAGRAPH_MATCHING", "BANKED_CLOZE"];
      return typeQuestion.includes(questionType);
    },
  },
};
</script>
