interact.vue 4.27 KB
<template>
  <el-table :data="resultData" border style="width: 100%">
    <el-table-column
      prop="studentCode"
      label="学号"
      align="center"
    ></el-table-column>
    <el-table-column
      prop="studentName"
      label="姓名"
      align="center"
    ></el-table-column>
    <template v-if="types != 3">
      <el-table-column
        prop="rushAnswerTimes"
        label="抢答成功次数"
        sortable
        align="center"
      ></el-table-column>
      <el-table-column
        prop="rushAnswerCorrectTimes"
        label="答对次数"
        sortable
        align="center"
      ></el-table-column>
      <el-table-column
        prop="checkAnswerTimes"
        label="抽答次数"
        sortable
        align="center"
      ></el-table-column>
      <el-table-column
        prop="checkAnswerCorrectTimes"
        label="抽答答对次数"
        sortable
        align="center"
      ></el-table-column>
      <el-table-column
        prop="interactionsNum"
        label="参与得分"
        sortable
        align="center"
      ></el-table-column>
      <el-table-column
        prop="interactionsCorrectNum"
        label="对错得分"
        sortable
        align="center"
      ></el-table-column>
    </template>
    <template v-else>
      <el-table-column
        v-for="(item, index) in phaseInter"
        :key="index"
        :label="item"
        align="center"
      >
        <el-table-column
          align="center"
          v-if="index == 0"
          label="参与分"
          sortable
          :prop="'interactionsNum' + item"
        >
          <template slot-scope="scoped">{{
            scoped.row["interactionsNum" + item] ||
            Number(scoped.row["interactionsNum" + item]) === 0
              ? scoped.row["interactionsNum" + item]
              : "-"
          }}</template>
        </el-table-column>
        <el-table-column
          v-else
          align="center"
          label="互动数"
          :prop="'interactionsNum' + item"
        >
          <template slot-scope="scoped">{{
            scoped.row["interactionsNum" + item] ||
            Number(scoped.row["interactionsNum" + item]) === 0
              ? scoped.row["interactionsNum" + item]
              : "-"
          }}</template>
        </el-table-column>
        <el-table-column
          v-if="index == 0"
          align="center"
          label="对错分"
          sortable
          :prop="'interactionsCorrectNum' + item"
        >
          <template slot-scope="scoped">{{
            scoped.row["interactionsCorrectNum" + item] ||
            Number(scoped.row["interactionsCorrectNum" + item]) === 0
              ? scoped.row["interactionsCorrectNum" + item]
              : "-"
          }}</template>
        </el-table-column>
        <el-table-column
          v-else
          align="center"
          label="参与数"
          :prop="'interactionsCorrectNum' + item"
        >
          <template slot-scope="scoped">{{
            scoped.row["interactionsCorrectNum" + item] ||
            Number(scoped.row["interactionsCorrectNum" + item]) === 0
              ? scoped.row["interactionsCorrectNum" + item]
              : "-"
          }}</template>
        </el-table-column>
      </el-table-column>
    </template>
  </el-table>
</template>
<script>
export default {
  props: {
    tableData: Array,
    types: Number,
  },
  data() {
    return {
      phaseInter: [], //互动补充数据
    };
  },
  computed: {
    resultData: function () {
      let resultData = [];
      if (this.tableData.length) {
        let subjectName = [];
        resultData = this.tableData?.map((item) => {
          let params = {};
          item.dataList?.map((items, index) => {
            if (!subjectName.includes(items.subjectName)) {
              subjectName.push(items.subjectName);
            }
            params["interactionsNum" + items.subjectName] =
              items.interactionsNum;
            params["interactionsCorrectNum" + items.subjectName] =
              items.interactionsCorrectNum;
          });
          return {
            ...item,
            ...params,
          };
        });
        this.phaseInter = [...subjectName];
      } else {
        resultData = [];
        this.optionsList = [];
      }
      return resultData;
    },
  },
};
</script>