<template>
  <div class="app-container">
    <div>  
      <div class="djs">得分成绩/满分成绩: <span class="df">0</span>/100</div>
    </div>
    <el-table
      :data="tableData"
      :span-method="arraySpanMethod"
      border
      style="width: 100%;margin-top:1%">
      <el-table-column
        prop="id"
        label="序号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="评分标准">
      </el-table-column>
      <el-table-column
        prop="name2"
        label="扣分">
      </el-table-column>
      <el-table-column
        prop="name3"
        label="维修情况">
        <template scope="scope">
            <span v-if="scope.row.name3==='排除'" style="color: green">排除</span>
            <span v-else-if="scope.row.name3==='未排除'" style="color: red">未排除</span>
            <span v-else-if="scope.row.name3==='初始化'" style="color: gray">初始化</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="name4"
        label="题目">
      </el-table-column>
    </el-table>

    <el-table
      :data="tableData1"
      :span-method="arraySpanMethod"
      border
      style="width: 100%;">
      <el-table-column
        prop="id"
        label="序号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="评分标准">
      </el-table-column>
      <el-table-column
        prop="name2"
        label="扣分">
      </el-table-column>
      <el-table-column 
        prop="name3"
        label="报告情况">
        <template scope="scope">
            <span v-if="scope.row.name3==='正确'" style="color: green">正确</span>
            <span v-else-if="scope.row.name3==='错误'" style="color: red">错误</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="name4"
        label="学生答题情况">
      </el-table-column>
    </el-table>

    <el-form ref="elForm" size="medium" label-width="100px" style="margin-top: 2%;text-align: center;">
        <el-form-item size="large">
            <el-button type="primary" @click="submitForm" style="width: 8%;">结束</el-button>
        </el-form-item>
    </el-form>

  </div>
</template>
<style>
.djs{
  margin-right: 5%;
  text-align: right;
  line-height:8px;
  font-size:20px;
}
.df {
  color:red;
}
</style>
<script>
import {examStudentReport } from "@/api/sim/exam";
  export default {
    data() {
      return {
        examId:'',
        tableData: [{
          id:'一.故障排除(75分)',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        },{
          id:1,
          name: '故障一未排除扣25分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:2,
          name: '故障二未排除扣25分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:3,
          name: '故障三未排除扣25分',
          name2: '',
          name3: '',
          name4: '',
        }],

        tableData1: [{
          id:'二.修理报告表(15分)',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        },{
          id:1,
          name: '故障现象少写或错写1条扣1分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:2,
          name: '可能原因少写或错写1条扣1分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:3,
          name: '故障部位少写或错写1条扣1分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:4,
          name: '排除方法少写或错写1条扣1分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:5,
          name: '修复结论错扣2分',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:'三.维修时间(10分)',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:'按没超过1分钟扣1分的比例扣分',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:'扣分小计',
          name: '',
          name2: '超时：',
          name3: '',
          name4: '',
        }, {
          id:'五.成绩',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        }, {
          id:'说明',
          name: '',
          name2: '',
          name3: '',
          name4: '',
        }],
      };
    },
    created() {
      this.getList();
    },
    mounted() {
      this.examId = this.$route.params.examId;
      let timer = setInterval(() => {
        this.getList();
      }, 5000);
    },
    methods: {
      getList() {
        this.loading = true;
        const examId = this.$route.params.examId;
        examStudentReport(examId).then(response => {
          console.log(response);
          let minus1 =  response.data.listPart1[0].minus;
          let minus2 =  response.data.listPart1[1].minus;
          let minus3 =  response.data.listPart1[2].minus;

          let text11 = '';
          if(response.data.listPart1[0].answerRight ==0){
            text11 = '初始化';
          }else if(response.data.listPart1[0].answerRight ==1){
            text11 = '排除';
          }else{
            text11 = '未排除';
          }

          console.log(text11);
          console.log('text11');
          let text12 = '';
          if(response.data.listPart1[1].answerRight==0){
            text12 = '初始化';
          }else if(response.data.listPart1[1].answerRight==1){
            text12 = '排除';
          }else{
            text12 = '未排除';
          }

          let text13 = '';
          if(response.data.listPart1[2].answerRight==0){
            text13 = '初始化';
          }else if(response.data.listPart1[2].answerRight==1){
            text13 = '排除';
          }else{
            text13 = '未排除';
          }
          let topic1 = response.data.listPart1[0].fault.name;
          let topic2 = response.data.listPart1[1].fault.name;
          let topic3 = response.data.listPart1[2].fault.name;

          this.tableData = [{
            id:'一.故障排除(75分)',
          },{
            id:1,
            name: '故障一未排除扣25分',
            name2: minus1,
            name3: text11,
            name4: topic1,
          }, {
            id:2,
            name: '故障二未排除扣25分',
            name2: minus2,
            name3: text12,
            name4: topic2,
          }, {
            id:3,
            name: '故障三未排除扣25分',
            name2: minus3,
            name3: text13,
            name4: topic3,
          }];         
        });
      },
      //首页合并
      arraySpanMethod({ row, column, rowIndex, columnIndex }) {
        if (rowIndex === 0) {
          if (columnIndex === 0) {
            return [1, 5];
          } else {
            return [0, 0];
          }
        }
        if (rowIndex === 6) {
          if (columnIndex === 0) {
            return [1, 5];
          } else {
            return [0, 0];
          }
        }
        //按每超时1分钟扣分的比例扣分
        if (rowIndex>6) {
          if (columnIndex === 0) {
            return [1, 2];
          }else if(columnIndex ===2){
            return [1, 3];
          } else {
            return [0, 0];
          }
        }
      },
      /** 结束按钮 */
      submitForm() {
        this.$router.push("/exam/exam");
      },
    }
  };
</script>