baoman / Ezquiz_Platform

  <template>

    <div ref="main" class="page-container">

      <back-box>
        <template slot="title">
          <span>即时测-数据报表</span>
        </template>

        <template slot="btns">

          <el-tooltip

            v-if="!code && gdClass"

            effect="dark"
            content="已归档试卷"
            placement="bottom"
          >
            <el-button
              type="primary"
              icon="fa fa-archive"
              size="mini"
              plain
              circle
              @click="toArchiving"
            ></el-button>
          </el-tooltip>

        </template>

      </back-box>
      <div class="answer-header">
        <div class="sel-box">

          <el-select
            class="sel"
            v-model="query.classId"
            placeholder="选择班级"
            @change="changeclass"
          >

            <el-option
              v-for="item in classList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-select
            v-if="role == 'ROLE_BANZHUREN'"
            class="sel"
            multiple

            v-model="query.subjectNames"

            placeholder="选择科目"

            @change="changeSub"

          >
            <el-option
              v-for="item in subjectList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-select
            v-else
            class="sel"

            v-model="query.subjectNames"

            placeholder="选择科目"

          >
            <el-option
              v-for="item in subjectList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <div class="d1">
            <el-date-picker
              v-model="query.startDay"
              type="date"
              @change="handleChangeTimeStart"
              placeholder="选择日期时间"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
            ~
            <el-date-picker
              v-model="query.endDay"
              type="date"
              placeholder="选择日期时间"
              @change="handleChangeTimeEnd"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </div>
          <p class="p1">
            <span @click="setDate(1)" :class="[date == 1 ? 'active' : '', 's1']"
              >今天</span
            >
            <span @click="setDate(2)" :class="[date == 2 ? 'active' : '', 's1']"
              >本周</span
            >
            <span @click="setDate(3)" :class="[date == 3 ? 'active' : '', 's1']"
              >本月</span
            >
            <span @click="setDate(4)" :class="[date == 4 ? 'active' : '', 's1']"
              >本季度</span
            >
          </p>
          <el-button type="primary" round @click="_QueryData()">筛选</el-button>
        </div>
      </div>
      <div class="table-box">

        <el-radio-group
          v-model="tabIndex"
          @change="changeTab"
          style="margin-bottom: 20px"
        >

          <template v-for="(item, index) in tabList">
            <el-radio-button
              v-if="index == 0 || query.startDay != query.endDay"
              :key="index"
              :label="index + 1"
              >{{ item }}</el-radio-button
            >
          </template>

        </el-radio-group>

        <div v-show="tabIndex == 1" v-loading="loading">

          <el-table :data="tableData" border style="width: 100%">

            <el-table-column
              prop="title"
              label="试卷名称"

              fixed

              align="center"
            ></el-table-column>
            <el-table-column

              prop="examPaperScore"

              label="卷面分"
              align="center"

              width="68"

            ></el-table-column>

            <el-table-column prop="answeredNum" label="测验人数" align="center"
              ><template slot-scope="scoped">{{
                `${scoped.row.answeredNum}/${scoped.row.classPersonNum}`
              }}</template></el-table-column
            >

            <el-table-column

              prop="examStartTime"

              label="测验时间"

              width="100"

              align="center"
            ></el-table-column>

            <el-table-column prop="avgScore" label="班平均分" align="center"
              ><template slot-scope="scoped">{{

                (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                  scoped.row.answerNum == 0) &&

                scoped.row.recordStatus == 0

                  ? "-"

                  : scoped.row.avgScore
              }}</template></el-table-column
            >
            <el-table-column prop="highestScore" label="班最高分" align="center"
              ><template slot-scope="scoped">{{

                (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                  scoped.row.answerNum == 0) &&

                scoped.row.recordStatus == 0

                  ? "-"

                  : scoped.row.highestScore
              }}</template></el-table-column
            >
            <el-table-column prop="lowestScore" label="班最低分" align="center"
              ><template slot-scope="scoped">{{

                (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                  scoped.row.answerNum == 0) &&

                scoped.row.recordStatus == 0

                  ? "-"

                  : scoped.row.lowestScore
              }}</template></el-table-column
            >

            <el-table-column

              prop="excellenRate"

              label="优秀数(率)"

              sortable
              align="center"

              width="110"
              class-name="p0"
              ><template slot-scope="scoped">
                <p
                  v-if="
                    (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                      scoped.row.answerNum == 0) &&
                    scoped.row.arecordStatus == 0
                  "
                >
                  "-"
                </p>
                <template v-else>
                  <p>{{ scoped.row.excellenNum }}</p>
                  <p v-if="scoped.row.excellenNum">
                    {{ `（${scoped.row.excellenRate}%）` }}
                  </p>
                </template>
              </template></el-table-column

            >
            <el-table-column

              prop="goodRate"

              label="良好数(率)"

              sortable
              align="center"

              width="110"
              class-name="p0"
              ><template slot-scope="scoped">
                <p
                  v-if="
                    (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                      scoped.row.answerNum == 0) &&
                    scoped.row.arecordStatus == 0
                  "
                >
                  "-"
                </p>
                <template v-else>
                  <p>{{ scoped.row.goodNum }}</p>
                  <p v-if="scoped.row.goodNum">
                    {{ `（${scoped.row.goodRate}%）` }}
                  </p>
                </template>

              </template></el-table-column

            >
            <el-table-column

              prop="passRate"

              label="及格数(率)"

              sortable
              align="center"

              width="110"
              class-name="p0"
              ><template slot-scope="scoped">
                <p
                  v-if="
                    (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                      scoped.row.answerNum == 0) &&
                    scoped.row.arecordStatus == 0
                  "
                >
                  "-"
                </p>
                <template v-else>
                  <p>{{ scoped.row.passNum }}</p>
                  <p v-if="scoped.row.passNum">
                    {{ `（${scoped.row.passRate}%）` }}
                  </p>
                </template>

              </template></el-table-column

            >
            <el-table-column

              prop="failedRate"

              label="不及格数(率)"

              sortable
              align="center"

              width="130"
              class-name="p0"
              ><template slot-scope="scoped">
                <p
                  v-if="
                    (scoped.row.subjectiveScore == scoped.row.examPaperScore ||
                      scoped.row.answerNum == 0) &&
                    scoped.row.arecordStatus == 0
                  "
                >
                  "-"
                </p>
                <template v-else>
                  <p>{{ scoped.row.failedNum }}</p>
                  <p v-if="scoped.row.failedNum">
                    {{ `（${scoped.row.failedRate}%）` }}
                  </p>
                </template>
              </template></el-table-column

            >
            <el-table-column label="操作" align="center">
              <template slot-scope="scoped">

                <el-tooltip

                  v-if="
                    scoped.row.answerNum != 0 ||
                    (scoped.row.recordStatus != 0 &&
                      scoped.row.subjectiveScore == scoped.row.examPaperScore)
                  "

                  effect="dark"
                  content="详情"
                  placement="top"
                >

                  <el-button
                    type="primary"
                    circle
                    size="mini"
                    icon="fa fa-arrow-right"
                    @click="linkTo(scoped.row)"
                  ></el-button>
                </el-tooltip>

                <template

                  v-if="
                    scoped.row.answerNum == 0 &&
                    scoped.row.subjectiveScore != scoped.row.examPaperScore
                  "

                >

                  <el-tooltip
                    v-if="role == 'ROLE_JIAOSHI'"
                    effect="dark"
                    content="设置答案"
                    placement="top"
                  >
                    <el-button
                      type="primary"
                      circle
                      size="mini"
                      icon="fa fa-file-text"
                      @click="edit(scoped.row)"
                    ></el-button>
                  </el-tooltip>
                  <template v-else>未设置答案</template>
                </template>

                <el-tooltip

                  v-if="
                    scoped.row.subjectiveScore == scoped.row.examPaperScore &&
                    scoped.row.recordStatus == 0
                  "

                  effect="dark"
                  content="导入主观题"
                  placement="top"
                >
                  <el-button
                    type="primary"
                    circle
                    size="mini"
                    icon="fa fa-cloud"
                    @click="uploadSJ(scoped.row)"
                  ></el-button>
                </el-tooltip>

              </template>
            </el-table-column>
          </el-table>

          <div class="pagination-box">
            <el-pagination
              small=""
              layout="total,prev, pager, next"
              :hide-on-single-page="true"
              :total="total"
              @current-change="changePage"
              :current-page="page"
              :page-size="size"
            >
            </el-pagination>
          </div>

        </div>

        <div v-show="tabIndex == 2" v-loading="loading">

          <el-empty
            :image-size="100"
            v-if="!tableData.length && loading == false"
            description="没有更多数据"
          ></el-empty>
          <template v-if="tableData.length && loading == false">

            <div id="print-content">
              <el-table
                :max-height="tableMaxHeight"
                v-if="role == 'ROLE_JIAOSHI'"
                :data="tableData"
                border
                style="width: 100%"

              >
                <el-table-column

                  prop="studentCode"
                  label="学号"

                  align="center"

                  fixed

                ></el-table-column>
                <el-table-column

                  prop="studentName"
                  label="姓名"
                  fixed

                  align="center"

                >
                  <template slot-scope="scoped"
                    ><span class="click-b" @click="toPortrait(scoped.row)">
                      {{ scoped.row.studentName }}
                    </span></template
                  ></el-table-column
                >

                <el-table-column

                  align="center"

                  v-for="(item, index) in answerList"
                  :key="index"
                  :label="item.title"
                >
                  <el-table-column
                    :prop="'score' + index"
                    :label="index == 0 ? '总分' : '成绩'"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                  <el-table-column
                    :prop="'classRank' + index"
                    label="班名"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                </el-table-column>
              </el-table>
              <el-table
                v-else
                :data="tableData"
                :max-height="tableMaxHeight"
                border
                style="width: 100%"
              >

                <el-table-column

                  prop="studentCode"
                  label="学号"

                  align="center"

                  fixed

                ></el-table-column>

                <el-table-column

                  prop="studentName"
                  label="姓名"
                  fixed

                  align="center"

                >
                  <template slot-scope="scoped"
                    ><span class="click-b" @click="toPortrait(scoped.row)">
                      {{ scoped.row.studentName }}
                    </span></template
                  >
                </el-table-column>

                <el-table-column

                  align="center"

                  v-for="(item, index) in answerList"
                  :key="index"
                  :label="item"
                >
                  <el-table-column
                    :prop="'examCount' + item"
                    label="测练数"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                  <el-table-column
                    :prop="'participationCount' + item"
                    label="参与数"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                  <el-table-column
                    :prop="'score' + item"
                    label="总分"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                  <el-table-column
                    :prop="'classRank' + item"
                    label="班名"
                    align="center"
                    :class-name="index % 2 == 0 ? 'bg' : ''"
                  ></el-table-column>
                </el-table-column>
              </el-table>
            </div>

          </template>

        </div>

        <p class="down" v-if="tabIndex == 2 && tableData.length">

          <el-button
            type="primary"
            plain
            round
            icon="fa fa-cloud-download"
            @click="downExl"

            >导出报表</el-button
          >

          <el-button

            v-if="!this.$store.getters.code"

            @click="print"
            type="primary"
            plain
            round
            icon="el-icon-printer"
            >打印</el-button
          >

        </p>
      </div>

      <el-dialog :close-on-click-modal="false" title="导入主观题分数" :visible.sync="diaUp" width="600">

        <upload

          :url="url"
          :examId="examId"
          @upSuccess="upSuccess"
          fileName="主观题分数"
          v-loading="loadingDown"
        >

          <template slot="down">
            <p class="down-txt">
              第一步：下载模板并编辑完成学生分数
              <el-link type="danger" @click="downExcel">模板下载</el-link> 。
            </p>
            <p class="down-txt">第二步：上传完成编辑的模板文件并导入。</p>
          </template>

        </upload>

        <div class="dialog-footer" slot="footer">
          <el-button @click="diaUp = false">取 消</el-button>
        </div>
      </el-dialog>

    </div>
  </template>
  
  <script>

  import { formatDate, downloadFile, tablePrint } from "utils";

  import BusEvent from "@/utils/busEvent";

  export default {

    data() {
      return {

        code: "",

        gdClass: 0, //已归档班级数量

        exportLoading: false,

        tableMaxHeight: 300,

        role: "",
        loading: false,

        diaUp: false,

        loadingDown: false,

        url: "/api_html/teaching/importSubjectiveScore",
        examId: "",

        form: {
          id: "",
          title: "",
          examPaperScore: "",

        },

        date: "", //今天-昨天-本周
        query: {
          //搜索条件
          classId: "",

          subjectNames: "",

          startDay: "",
          endDay: "",
          day: "",
        },

        tabList: ["单卷测练报表", "阶段测练报表"],

        classList: [], //班级
        subjectList: [], //科目
        tabIndex: 1, //选项卡

        tableData: [],
        answerList: [], //设置多卷内容供tableStage表格数据用
        page: 1,
        size: 20,
        total: 0,

      };
    },
    async created() {

      this.code = localStorage.getItem("csCode") || "";

      this.role =
        this.$store.getters.info.showRole ||
        this.$store.getters.info.permissions[0].role;

      this._QueryClassList2();

      await this._QueryClassList();

      if (!this.query.classId) {
        return;
      }

      await this._QuerySubjectList();

      await this.setDate(1);

      let startDay = this.query?.startDay;
      if (!startDay) {
        this.query.startDay = new Date();
        this.query.endDay = new Date();
      }
    },

    activated() {
      const that = this;
      BusEvent.$on("keepAlive", async function () {

        // if (that.$route.path == "/test") {

        that.query.subjectNames = that.role == "ROLE_BANZHUREN" ? [] : "";
        that._QueryClassList2();
        await that._QueryClassList();
        if (!that.query.classId) {
          return;
        }
        await that._QuerySubjectList();
        await that.setDate(1);
        let startDay = that.query?.startDay;
        if (!startDay) {
          that.query.startDay = new Date();
          that.query.endDay = new Date();
        }

        // }

      });
    },

    methods: {

      print() {

        tablePrint("print-content", "即时测-" + this.tabList[this.tabIndex - 1]);

      },
      changeSub(val) {
        //科目改变触发事件

        let sub;
        if (val && val.length) {
          let leng = val.length - 1;
          sub = val[leng];
        }

        console.log(val);

        this.query.subjectNames = val.filter((item) => {
          return sub != "全部" ? item != "全部" : item == "全部";
        });
      },

      toArchiving() {
        this.$router.push({
          path: "/testArchiving",
        });
      },

      linkTo(obj) {
        //去详情
        this.$router.push({
          path: "/testAnalysis",
          query: {
            id: obj.id,

            title: obj.title,
            score: obj.examPaperScore,

          },
        });
      },

      toPortrait(obj) {

        //暂时不上线

        return;

        if (this.$store.getters.code) {
          return;
        }

        let subjectNames = [];

        subjectNames =
          this.role == "ROLE_BANZHUREN"
            ? [...this.query["subjectNames"]]
            : [this.query["subjectNames"]];

        if (
          this.query["subjectNames"] &&
          this.query["subjectNames"]?.length == 1 &&
          this.query["subjectNames"][0] == "全部"
        ) {
          subjectNames = this.subjectList.map((item) => {
            return item.value;
          });
          subjectNames?.shift();
        }
        //去学生画像
        this.$router.push({
          path: "/portraitDetail",
          query: {
            id: obj.studentId,

            classId: this.query.classId,

            subjectNames: subjectNames.join(","),

            studentName: obj.studentName,
            studentCode: obj.studentCode,

            startDay: this.query.startDay,
            endDay: this.query.endDay,

            date: this.date,

          },
        });
      },
      uploadSJ(obj) {
        //导入开关

        this.examId = obj.id;
        this.diaUp = true;
      },

      setDate(index) {
        const that = this;
        this.date = index == this.date ? "" : index;
        let aYear = new Date().getFullYear();
        let aMonth = new Date().getMonth() + 1;
        that.query.day = "";
        that.query.startDay = "";
        that.query.endDay = "";
        switch (index) {
          case 1:
            that.query.day = formatDate(new Date(), "yyyy-MM-dd");
            that.query.startDay = that.query.day;
            that.query.endDay = that.query.day;

            that.tabIndex = 1;

            break;
          case 2:
            let day = new Date().getDay();
            if (day == 0) {
              //中国式星期天是一周的最后一天
              day = 7;
            }

            day--;

            let aTime = new Date().getTime() - 24 * 60 * 60 * 1000 * day;
            that.query.startDay = formatDate(new Date(aTime), "yyyy-MM-dd");
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
          case 3:
            aMonth = aMonth < 10 ? "0" + aMonth : aMonth;
            that.query.startDay = `${aYear}-${aMonth}-01`;
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
          case 4:

            if (aMonth > 0 && aMonth < 4) {

              aMonth = "1";

            } else if (aMonth > 3 && aMonth < 7) {

              aMonth = "4";

            } else if (aMonth > 6 && aMonth < 10) {

              aMonth = "7";

            } else {
              aMonth = "10";
            }
  
            aMonth = aMonth < 10 ? "0" + aMonth : aMonth;
            that.query.startDay = `${aYear}-${aMonth}-01`;
            that.query.endDay = formatDate(new Date(), "yyyy-MM-dd");
            break;
        }
        this.page = 1;
        this._QueryData();
      },
      handleChangeTimeStart(val) {
        this.query.day = "";
        this.date = "";
        if (this.query.endDay) {
          if (new Date(val).getTime() > new Date(this.query.endDay).getTime()) {
            this.$message.error("任务结束时间不能任务开始时间前面，请重新设置");
            this.query.startDay = "";
          }
        }
      },
      handleChangeTimeEnd(val) {
        this.query.day = "";
        this.date = "";
        if (this.query.startDay) {
          if (new Date(val).getTime() < new Date(this.query.startDay).getTime()) {
            this.$message.error("任务结束时间不能任务开始时间前面，请重新设置");
            this.query.endDay = "";
          }
        }
      },

      changePage(page) {
        this.page = page;
        this._QueryData();

      },

      edit(item) {

        this.$router.push({
          path: "/examinationPaperEdit",
          query: {
            paperId: item.id,
            title: item.title,
            type: 2,
          },
        });

      },

      changeTab() {

        this.tableMaxHeight = this.$refs.main.offsetHeight;

        this.page = 1;
        this._QueryData();

      },

      upSuccess(res) {
        //导入成功
        this.$message.success("导入成功");

        this.diaUp = false;

        this._QueryData();
      },

      async changeclass() {
        await this._QuerySubjectList();
        this.page = 1;
        this._QueryData();

      },

      async changClazz() {

        this.page = 1;

        await this._QuerySubjectList();

        await this._QueryData();

      },

      async _QueryClassList2() {
        const fetchClassList =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTClassList
            : this.$request.tClassList;
        const { data, status, info } = await fetchClassList({ status: 1 });
        if (status === 0) {
          this.gdClass = data?.list?.length || 0;
        } else {
          this.$message.error(info);
        }
      },

      async _QueryClassList() {

        const fetchClassList =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTClassList
            : this.$request.tClassList;
        const { data, status, info } = await fetchClassList();

        if (status === 0) {
          this.classList = data.list.map((item) => {
            return {
              value: item.classId,

              label: item.className,

            };
          });
          this.query.classId = this.classList[0]?.value;
        } else {
          this.$message.error(info);
        }
      },
      async _QuerySubjectList() {

        const fetchSubjectList =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTSubjectList
            : this.$request.tSubjectList;
  
        const { data, status, info } = await fetchSubjectList({

          classId: this.query.classId,
        });
        if (status === 0) {
          this.subjectList =

            data.subjectNames?.map((item) => {

              return {

                value: item,
                label: item,

              };
            }) || [];

          if (this.role == "ROLE_BANZHUREN") {

            this.subjectList.unshift({

              value: "全部",

              label: "全部",
            });

            this.query.subjectNames.push(this.subjectList[0]?.value);

          } else {

            this.query.subjectNames = this.subjectList[0]?.value;

          }

        } else {
          this.$message.error(info);
        }
      },
      async _QueryData() {

        if (!this.query.classId) {
          return;
        }

        this.tableData = [];
        if (this.tabIndex == 1) {
          this.examReportList();
        } else {
          this.phaseExamReport();
        }
      },
      //单卷测练
      async examReportList() {

        this.loading = true;

        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            query[key] = this.query[key];
          }
        }

        if (this.role != "ROLE_BANZHUREN") {
          query.subjectNames = [query.subjectNames];
        } else {
          if (

            query["subjectNames"] &&

            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();

          }

          if (!query["subjectNames"]) {

            this.$message.warning("请选择科目");
            return;

          }
        }
        const { data, status, info } = await this.$request.examReportList({

          ...query,

          page: this.page,
          size: this.size,

        });
        this.loading = false;
        if (status === 0) {

          this.tableData = (data?.list && [...data?.list]) || [];

          this.total = data?.count || 0;

        } else {
          this.$message.error(info);
        }
      },
      //多卷测练
      async phaseExamReport() {
        this.loading = true;
        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            if (key == "subjectNames" && this.role != "ROLE_BANZHUREN") {
              query["subjectName"] = this.query[key];
            } else {
              query[key] = this.query[key];
            }
          }
        }
        if (this.role == "ROLE_BANZHUREN") {
          if (

            query["subjectNames"] &&
            query["subjectNames"]?.length == 1 &&

            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });

            query["subjectNames"]?.shift();

          }
        }
        const phaseExamReport =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTPhaseExamReport
            : this.$request.phaseExamReport;
        const { data, status, info } = await phaseExamReport({
          ...query,
        });
        this.loading = false;
        if (status === 0) {
          this.total = data.count;

          if (this.role == "ROLE_BANZHUREN") {
            let subjectName = [];
            this.tableData = data?.list.map((item) => {
              let params = {};
              item.dataList.map((items, index) => {
                if (!subjectName.includes(items.subjectName)) {
                  subjectName.push(items.subjectName);
                }
                params["examCount" + items.subjectName] = items.examCount;
                params["participationCount" + items.subjectName] =
                  items.participationCount;
                params["score" + items.subjectName] = items.score;
                params["classRank" + items.subjectName] = items.classRank;
              });
              return {
                ...item,
                ...params,
              };
            });
            this.answerList = [...subjectName];
          } else {
            let dataIdsList = [],
              dataList = [];
            data?.list.map((item) => {
              item.examList.map((items) => {

                if (!dataIdsList.includes(items.title)) {
                  dataIdsList.push(items.title);
                  dataList.push(items);
                }

              });

            });

            console.log(dataList);
            this.tableData = data?.list.map((item) => {
              let params = {};
              dataIdsList.map((ids, index) => {
                params["score" + index] = "--";
                params["classRank" + index] = "--";
                item.examList.map((items) => {

                  if (items.title == ids) {
                    params["score" + index] = items.score;
                    params["classRank" + index] = items.classRank;
                  }

                });

              });

              return {
                ...item,
                ...params,
              };

            });

            this.answerList = dataList;
          }

        } else {
          this.$message.error(info);
        }
      },

      async downExl() {
        //报表到处

        if (this.exportLoading == true) return;

        let query = {};
        for (let key in this.query) {
          if (this.query[key] != "") {
            if (key == "subjectNames" && this.role != "ROLE_BANZHUREN") {
              query["subjectName"] = this.query[key];
            } else {
              query[key] = this.query[key];
            }
          }
        }
        if (this.role == "ROLE_BANZHUREN") {
          if (
            query["subjectNames"] &&
            query["subjectNames"].length == 1 &&
            query["subjectNames"][0] == "全部"
          ) {
            query["subjectNames"] = this.subjectList.map((item) => {
              return item.value;
            });
            query["subjectNames"].shift();
          }
          if (!query["subjectNames"]) {
            this.$message.warning("请选择科目");
            return;
          }
        }

        const exportPhaseExamReport =
          this.role == "ROLE_BANZHUREN"
            ? this.$request.cTExportPhaseExamReport
            : this.$request.exportPhaseExamReport;

        this.exportLoading = true;

        const data = await exportPhaseExamReport({ ...query });

        this.exportLoading = false;

        if (data && !data.code) {

          let blob = new Blob([data], {
            type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
          });

          downloadFile("即时测-阶段测练报表.xlsx", blob);

        } else {

          this.$message.error(data.info);

        }

      },

      async downExcel() {
        //模板下载

        this.loadingDown = true;
        let data = await this.$request.subjectiveScoreTemplate({
          examId: this.examId,
        });
        this.loadingDown = false;
        if (data && !data.code) {
          let blob = new Blob([data], {
            type: "application/vnd.ms-excel;charset=utf-8",
          });
          downloadFile(`主观题模版.xlsx`, blob);
        } else {
          this.$message.error(data.info);
        }
      },

    },
  };

  </script>
  

  <style>
  div::-webkit-scrollbar {
    width: 3px;
    height: 10px;
  }
  div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc;
  }
  </style>

  <style lang="scss" scoped>

  .page-container {
    position: relative;

    height: 100%;

    &.active {

      overflow: hidden;
    }
  }

  .table-box {
    margin: 0 20px;
    padding: 16px;
    background: #f8f8f8;
    border-radius: 5px;
    :deep(.fa-arrow-right) {
      padding-left: 2px;
    }
    :deep(.fa-file-text) {
      padding-left: 2px;
    }
  }

  .down {
    padding-top: 16px;
  }

  .click-b {
    cursor: pointer;

    color: #409eff;

    text-decoration: underline;

  }

  </style>