<template>
  <div class="question-audit">
    <div class="part-box">
      <h2 class="part-box-title">试题审核</h2>
      <el-tabs v-model="activeName" @tab-click="tabChange">
        <el-tab-pane label="待审核列表" name="wait" lazy>
          <audit-question-wait ref="AuditQuestionWait"></audit-question-wait>
        </el-tab-pane>
        <el-tab-pane label="我审核的记录" name="audited" lazy>
          <audit-question-audited
            ref="AuditQuestionAudited"
          ></audit-question-audited>
        </el-tab-pane>
        <el-tab-pane label="我提交的审核" name="apply" lazy>
          <audit-question-apply ref="AuditQuestionApply"></audit-question-apply>
        </el-tab-pane>
        <el-tab-pane label="待提交的试题" name="unsubmit" lazy>
          <audit-question-unsubmit
            ref="AuditQuestionUnsubmit"
          ></audit-question-unsubmit>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import AuditQuestionApply from "../components/AuditQuestionApply.vue";
import AuditQuestionAudited from "../components/AuditQuestionAudited.vue";
import AuditQuestionWait from "../components/AuditQuestionWait.vue";
import AuditQuestionUnsubmit from "../components/AuditQuestionUnsubmit.vue";

export default {
  name: "QuestionAudit",
  components: {
    AuditQuestionWait,
    AuditQuestionAudited,
    AuditQuestionApply,
    AuditQuestionUnsubmit,
  },
  data() {
    return {
      activeName: "wait",
    };
  },
  methods: {
    tabChange(tab) {
      const tabName = tab.name[0].toUpperCase() + tab.name.substr(1);
      const compName = `AuditQuestion${tabName}`;
      this.$refs[compName] && this.$refs[compName].getList();
    },
  },
};
</script>
