supermarkpp/src/views/tasks/Index.vue

<template>
  <section class="content">
    <div class="breadcrumb">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item><a href="/">阅卷管理</a></el-breadcrumb-item>
        <el-breadcrumb-item>阅卷任务</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <el-form :model="queryParams" label-width="80px" class="filter-form" :inine="true">
      <el-row>
        <el-col :span="4">
          <el-form-item label="学校">
            <el-select size="mini" v-model="queryParams.school_id">
              <el-option label="人大附中" value="人大附中">人大附中</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="年级" v-model="queryParams.grade_id">
            <el-select v-model="queryParams.school_id" size="mini">
              <el-option label="高三一班" value="高三一班">高三一班</el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label-width="10" style="margin-left: 10px">
            <el-button type="primary" @click="getData" size="mini">筛选</el-button>
            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-table v-loading="loading" :data="list" style="width: 100%; margin-top: 10px" height="50vh">
      <el-table-column prop="name" label="作业名称"> </el-table-column>
      <el-table-column prop="full_score" label="满分">
        <template slot-scope="scope">
          <div class="bold">{{ scope.row.full_score }}</div>
        </template>
      </el-table-column>
      <el-table-column prop="max_score" label="最高分">
        <template slot-scope="scope">
          <div class="bold">{{ scope.row.max_score }}</div>
        </template>
      </el-table-column>
      <el-table-column prop="avg_score" label="平均分">
        <template slot-scope="scope">
          <div class="bold">{{ scope.row.avg_score }}</div>
        </template>
      </el-table-column>
      <el-table-column prop="pass_rate" label="及格率">
        <template slot-scope="scope">
          <div class="bold" style="color: #0a9dff">
            {{ scope.row.pass_rate }}
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="phone" label="批阅进度" width="180">
        <template slot-scope="scope">
          <div class="d-f prosss_box">
            <el-progress :percentage="scope.row.ww" :stroke-width="8" :color="
      	            scope.row.total_students == scope.row.marked_students
      	              ? '#0A9DFF'
      	              : '#FA0A2F'
      	          "></el-progress>
            <div class="contrasts">
              <span>{{ scope.row.marked_students }}/</span>
              <span>{{ scope.row.total_students }}</span>
            </div>
          </div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="ctime" label="创建时间" />
      <el-table-column align="center" prop="date" label="操作" width="380">
        <template slot-scope="scope">

          <el-button @click="jump(
	            '/task/markpaper?title=' +
	              scope.row.name +
	              '&id=' +
	              scope.row.task_id
            )" size="mini" type="success">开始阅卷</el-button>
          <el-button @click="remarkSet(scope.row)" size="mini" type="warning">阅卷设置</el-button>
          <el-button @click="edit(scope.row.id)" size="mini" type="warning">编辑</el-button>
          <el-button @click="openUploadPaper(scope.row.task_id)" size="mini" type="primary">上传试卷</el-button>
          <el-button @click="del(scope.row.task_id)" size="mini" type="danger">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <Page ref="pageButton" :current="form.page" :page_size="form.page_size" :total="total" @pageChange="gopage" />
    <!-- 新增/编辑阅卷任务 -->
    <el-dialog title="新增/编辑阅卷任务" :visible.sync="open" width="80%" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="考试名称" prop="name">
              <el-input clearable v-model="form.name" placeholder="请输入名称"></el-input>
            </el-form-item>
            <el-form-item label="参考班级" prop="role">
              <el-row>
                <el-col :span="12">
                  <el-select @change="getClassList" v-model="form.school_id" placeholder="请选择学校" filterable clearable>
                    <el-option v-for="item in schoolList" :key="item.id" :label="item.name" :value="item.school_id">
                    </el-option>
                  </el-select>
                </el-col>
                <el-col :span="12">
                  <el-select @change="getClassList" v-model="form.grade_name" placeholder="请选择年级" filterable clearable>
                    <el-option v-for="item in gradeList" :key="item" :label="item" :value="item">
                    </el-option>
                  </el-select>
                </el-col>
                <el-col :span="24" v-if="form.grade_name">
                  <el-checkbox-group v-model="checkClassList">
                    <el-checkbox v-for="item in classList" :key="item.class_id" :label="item.class_id">{{item.name}}
                    </el-checkbox>
                  </el-checkbox-group>
                </el-col>
              </el-row>
            </el-form-item>
            <el-form-item label="备注" prop="name">
              <el-input clearable v-model="form.remark" placeholder="请输入备注"></el-input>
            </el-form-item>

          </el-col>
          <el-col :span="12">
            <el-form-item label="试卷模板" prop="role">
              <el-select v-model="form.paper_id" placeholder="请选择试卷模板" filterable>
                <el-option v-for="item in papersList" :key="item.id" :label="item.name" :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="open = false">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 预览识别结果 -->
    <el-dialog title="预览识别结果" :visible.sync="showAnsVisible" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-image :src="curStudentRecImg">
          <div slot="error" class="image-slot">
            <i class="el-icon-picture-outline"></i>
          </div>
        </el-image>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="showAnsVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
    <!-- 上传试卷 -->
    <el-dialog title="试卷上传" :visible.sync="uploadDialogVisible" width="90%" @close="closeUploadDialog">
      <el-row :gutter="20">
        <el-col :span="24">
          <!-- <el-row>
            <el-col :span="6">参考人数:{{studentsList.length}}</el-col>
            <el-col :span="6">已上传:{{studentsList.length}}</el-col>
            <el-col :span="6">识别异常:</el-col>
          </el-row> -->
          <el-form :inline="true">
            <el-form-item label="姓名">
              <el-input size="mini" placeholder="请输入姓名/考号" v-model="queryName" clearable></el-input>
            </el-form-item>
            <el-form-item label="识别异常">
              <el-select v-model="queryMarkStatus" size="mini" clearable>
                <el-option v-for="item in $const.recErrorList" :label="item.label" :value="item.value"></el-option>

              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" size="mini" @click=searchMarkData>搜索</el-button>
              <el-button size="mini" @click="reSetMarkData">重置</el-button>
              <el-button @click="downloadObjectiveResult(curTaskId)" type="warning" size="mini" icon="el-icon-download">
                导出</el-button>
              <el-button @click="reTryMark" size="mini" type="success" icon="el-icon-printer">重新识别</el-button>
            </el-form-item>
            <el-form-item>
              <el-button size="mini" type="warning" icon="el-icon-printer">
                试卷扫描</el-button>

            </el-form-item>
            <el-form-item>
              <el-upload class="upload-demo" action="http://test.scxjc.club/api/admin/papers/uploadpaper"
                :on-success="handleUploadSuccess" :data="{taskid:taskid}" :on-change="handleChange" list-type="picture"
                multiple>
                <el-button size="mini" type="primary" @click="openTaskImgList">点击上传</el-button>
              </el-upload>
            </el-form-item>
          </el-form>
          <el-row>
            <el-col :span="24">
              <el-tabs v-model="activeName" @tab-click="handleTabClick">
                <el-tab-pane :label="'正常('+recSucTotal+')'" name="1"></el-tab-pane>
                <el-tab-pane :label="'异常('+recErrTotal+')'" name="100"></el-tab-pane>
              </el-tabs>
            </el-col>
          </el-row>
          <el-table v-loading="loading" :data="studentsList" style="width: 100%; margin-top: 10px"
            @selection-change="handleSelectionChange" height="60vh">
            <el-table-column type="selection" width="45" v-if="activeName==100"></el-table-column>
            <el-table-column align="center" prop="student_name" label="姓名" width="80" />
            <el-table-column align="center" prop="student_no" label="考号" width="150">
              <template slot-scope="scope">
                <el-button type="text" @click="showStudentImgs(scope.row)" size="mini">{{scope.row.student_no}}
                </el-button>
              </template>
            </el-table-column>
            <el-table-column align="center" prop="objective_score" label="得分" />
            <!-- <el-table-column align="center" prop="mark_status" label="试卷状态">
              <template slot-scope="scope">
                <span v-if="scope.row.mark_status==0" style="color:#e6a23c;">待上传</span>
                <span v-if="scope.row.mark_status==1" style="color:#85ce61;">已上传</span>
              </template>
            </el-table-column> -->
            <el-table-column align="center" prop="mark_status_name" label="识别状态">
              <template slot-scope="scope">
                <span v-if="scope.row.mark_status<=0" style="color:#f78989;">{{scope.row.mark_status_name}}</span>
                <span v-if="scope.row.mark_status==1" style="color:#85ce61;">正常</span>
              </template>
            </el-table-column>
            <el-table-column align="center" prop="ctime" label="时间" width="140px">
              <template slot-scope="scope">
                <span style="font-size:12px;">{{scope.row.ctime}}</span>
              </template>
            </el-table-column>
            <el-table-column align="center" prop="date" label="操作" fixed="right" width="120px">
              <template slot-scope="scope">
                <el-button v-if="scope.row.mark_status!=0" @click="showCurRecImg(scope.row)" size="mini" type="text">查看
                </el-button>
                <el-button v-if="scope.row.mark_status!=0" @click="showCurRecKhImg(scope.row)" size="mini" type="text">
                  考号</el-button>
                <el-button @click="delStudents(scope.row.student_id,scope.$index)" size="mini" type="text">删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <Page ref="pageButton" :current="recPage" :page_size="recPageSize" :total="recTotal"
            @pageChange="goRecPage" />
        </el-col>
      </el-row>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="closeUploadDialog">关 闭</el-button>
      </div>
      <!-- 试卷上传 -->
      <el-dialog title="试卷预览" :visible.sync="imgListVisible" width="750px" @close="closeTaskImgDialog" append-to-body>
        <div style="text-align:right;">
          <font>成功上传:{{taskImgTotal}}</font>&nbsp;&nbsp;&nbsp;&nbsp;
          <el-button v-loading="loading" type="primary" size="mini" @click="startRecPaper">开始识别</el-button>
        </div>
        <div style="width:156px;display: inline-block;margin:10px;border:1px solid #ccc;"
          v-for="(item,index) in fileList">
          <el-image width="100px" alt="" :src="item.url" :preview-src-list="[item.url]"></el-image>
        </div>
        <Page ref="pageImgButton" :current="imgForm.page" :page_size="imgForm.page_size" :total="taskImgTotal" @pageChange="goTaskImg" />
      </el-dialog>
    </el-dialog>
    <!-- 重新识别 -->
    <el-dialog title="重新识别" :visible.sync="remarkDialogVisible" width="60%" @close="closeRemarkDialog">
      <el-form :inline="true">
        <el-form-item label="考号噪声参数">
          <el-input-number v-model="form.khVoiceNum" :min="1" :max="5"></el-input-number>
        </el-form-item>
        <el-form-item label="考号填涂比例阈值">
          <el-input-number v-model="form.khFillRate" :min="1" :max="5"></el-input-number>
        </el-form-item>
        <el-form-item label="题目噪声参数">
          <el-input-number v-model="form.tmVoiceNum" :min="1" :max="5"></el-input-number>
        </el-form-item>
        <el-form-item label="题目填涂比例阈值">
          <el-input-number v-model="form.tmFillRate" :min="1" :max="5"></el-input-number>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="doReTryMark">确 定</el-button>
      </div>
    </el-dialog>
    <!--阅卷设置-->
    <MarkTaskSetDialog :remarkSetVisible="remarkSetVisible" :paperId="curPaperId" :taskId="curTaskId" @close="closeMarkTaskSet" />
  </section>
</template>
<script>
  import Page from "../../components/Page";
  import MarkTaskSetDialog from "./components/MarkTaskSetDialog"
  export default {
    components: {
      Page,
      MarkTaskSetDialog
    },
    data() {
      return {
        loading: false,
        queryParams: {
          page: 1,
          page_size: 20
        },
        form: {
          khVoiceNum: 5,
          khFillRate: 3.0,
          tmVoiceNum: 3,
          tmFillRate: 1.8,
          class_list: ["高三一班", "高三二班"],
          checkList: []
        },
        imgForm:{
          page:1,
          page_size:10
        },
        form1: {},
        form2: {},
        list: [{}, {}],
        total: 0,
        imgTotal:0,
        title: "新增用户",
        open: false,
        doctorList: [],
        rules: {},
        uploadDialogVisible: false,
        remarkDialogVisible: false,
        fileList: [],
        papersList: [],
        taskid: null,
        timer: null,
        timer2: null,
        studentsList: [],
        showAnsVisible: false,
        curStudentRecImg: "",
        activeName: "1",
        curTaskId: null,
        curPaperId:null,
        recPage: 1,
        recPageSize: 20,
        recTotal: 0,
        recParams: {},
        recSucTotal: 0,
        recErrTotal: 0,
        queryName: "",
        queryMarkStatus: null,
        selectException: [],
        checkClassList: [],
        schoolList: [],
        gradeList: [],
        classList: [],
        imgListVisible: false,
        taskImgTotal: 0,
        remarkSetVisible: false,
        activeSetName: "first",
        addQueForm:{},
        objectiveQueList:[],
        subjectiveQueList:[],
        subjectiveMarkTeacherList:[],
        checkList:[]
      };
    },
    methods: {
      jump(url, id) {
        id == 2 ? localStorage.setItem("sonNav", 2) : '';
        if (url) {
          this.$router.push(url);
        }
      },
      submitUpload() {
        this.$refs.upload.submit();
      },
      del(id) {
        this.$confirm("确认删除?", "提示", {
          type: "warning",
        }).then(() => {
          this.$api
            .delMarkTask({
              id: id,
            })
            .then((res) => {
              if (!res.data.code) {
                this.msgSuccess("删除成功");
                this.getData();
              } else {
                this.$msgError(res.data.message);
              }
            });
        });
      },
      gopage(size) {
        if (size) {
          this.queryParams.page_size = size;
        }
        this.queryParams.page = this.$refs.pageButton.page;
        this.getData();
      },
      goTaskImg(page){
        if (page) {
          this.imgForm.page_size = size;
        }
        this.imgForm.page = this.$refs.pageImgButton.page;
        let that = this;
        that.$api.getTaskImgList({
            task_id: that.curTaskId,
            page:that.imgForm.page,
            page_size:that.imgForm.page_size
          }).then(res => {
            that.fileList = res.data.data.list
            that.taskImgTotal = res.data.data.total;
          })
      },
      goRecPage(size) {
        if (size) {
          this.recPageSize = size;
        }
        this.recPage = this.$refs.pageButton.page;
        this.recParams = {
          task_id: this.curTaskId,
          page: this.recPage,
          page_size: this.recPageSize,
          status: this.activeName,
          name: this.queryName,
          err_status: this.queryMarkStatus
        }
        window.clearInterval(this.timer);
        this.openUploadPaper(this.curTaskId)
      },
      getData() {
        this.loading = true;
        // 试卷列表
        this.$api
          .getPapersSearch({})
          .then((res) => {
            this.papersList = res.data.data;
            this.loading = false
          });
        // 阅卷任务列表
        this.$api.getMarkTaskList(this.queryParams).then(res => {
          this.total = res.data.data.total;
          this.list = res.data.data.list;
        })
      },
      getSchoolList() {
        let params = {
          school_id: this.form.school_id,
          grade_name: this.form.grade_name,
          page: 1,
          page_size: 1000
        }
        // 学校列表
        this.$api.schoolList(params).then(res => {
          this.schoolList = res.data.data.list;
        })
      },
      getGradeList() {
        // 年级列表
        this.$api.gradeList({}).then(res => {
          this.gradeList = res.data.data;
        })
      },
      getClassList() {
        let params = {
          school_id: this.form.school_id,
          grade_name: this.form.grade_name,
          page: 1,
          page_size: 1000
        }
        // 班级列表
        this.$api.classList(params).then(res => {
          this.classList = res.data.data.list;
        })
      },
      handleAdd() {
        this.open = true;
        this.title = "新增医生";
        this.form = {};
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate((valid) => {
          if (valid) {
            this.form.class_id = this.checkClassList.join();
            let selSchool = this.schoolList.filter(item => item.school_id == this.form.school_id);
            this.form.school_name = selSchool[0].name;
            let selClass = this.classList.filter(item => this.checkClassList.indexOf(item.class_id) != -1);
            this.form.class_name = selClass.map(item => item.name).join();
            if (this.form.id != null) {
              this.$api.editMarkTask(this.form).then((res) => {
                if (res.data.code == 0) {
                  this.msgSuccess("成功!");
                  this.open = false;
                  this.getData();
                } else {
                  this.msgError(res.data.message);
                }
              });
            } else {
              this.$api.addMarkTask(this.form).then((res) => {
                if (res.data.code == 0) {
                  this.msgSuccess("成功!");
                  this.open = false;
                  this.getData();
                } else {
                  this.msgError(res.data.message);
                }
              });
            }
          }
        });
      },
      remoteMethod(query) {
        if (query !== "") {
          // this.loading = true;
          this.$api
            .getDoctorsSearchList({
              name: query,
            })
            .then((res) => {
              this.doctorList = res.data.data;
              this.$set(this.doctorList, res.data.data);
              // this.loading = false;
            });
        } else {
          this.doctorList = [];
        }
      },
      searchMarkData() {
        this.recParams.name = this.queryName;
        this.recParams.errStatus = this.queryMarkStatus;
        window.clearInterval(this.timer);
        this.openUploadPaper(this.curTaskId);
      },
      reSetMarkData() {
        this.queryName = null;
        this.queryMarkStatus = null;
        this.queryParams.name = null;
        this.queryParams.err_status = null;
        window.clearInterval(this.timer);
        this.openUploadPaper(this.curTaskId);
      },
      openUploadPaper(id) {
        this.curTaskId = id
        this.uploadDialogVisible = true
        this.taskid = id
        let that = this;
        this.loading = true;
        this.recParams = {
          task_id: id,
          page: this.recPage,
          page_size: this.recPageSize,
          status: this.activeName,
          name: this.queryName,
          err_status: this.queryMarkStatus
        }
        this.$api.getMarkTaskStudents(this.recParams).then(res => {
          this.studentsList = res.data.data.list;
          this.studentsList.forEach(item => {
            let mark_status = item.mark_status;
            if (mark_status != 1) {
              item.mark_status_name = this.$const.recErrorList.filter((ritem) => {
                return ritem.value == mark_status;
              })[0].label
            } else {
              item.mark_status_name = "正常"
            }
          })
          this.recTotal = res.data.data.total;
          this.recSucTotal = res.data.data.suc_total;
          this.recErrTotal = res.data.data.err_total;
          this.loading = false;
        })
        window.clearInterval(this.timer);
        this.timer = setInterval(function () {
          that.$api.getMarkTaskStudents(that.recParams).then(res => {
            that.studentsList = res.data.data.list;
            that.studentsList.forEach(item => {
              let mark_status = item.mark_status;
              if (mark_status != 1) {
                item.mark_status_name = that.$const.recErrorList.filter((ritem) => {
                  return ritem.value == mark_status;
                })[0].label
              } else {
                item.mark_status_name = "正常"
              }
            })
            that.recTotal = res.data.data.total;
            that.recSucTotal = res.data.data.suc_total;
            that.recErrTotal = res.data.data.err_total;
          })
        }, 4000)
      },
      closeUploadDialog() {
        this.uploadDialogVisible = false;
        this.fileList = [];
        window.clearInterval(this.timer);
      },
      closeRemarkDialog() {
        this.remarkDialogVisible = false;
        this.fileList = []
      },
      closeTaskImgDialog() {
        this.imgListVisible = false;
        window.clearInterval(this.timer2);
      },
      handlePreview(file) {
        console.log(file);
      },
      handleChange(file, fileList) {},
      openTaskImgList() {
        let that = this;
        this.imgListVisible = true
        window.clearInterval(this.timer2);
        this.timer2 = setInterval(function () {
          that.$api.getTaskImgList({
            task_id: that.curTaskId,
            page:that.imgForm.page,
            page_size:that.imgForm.page_size
          }).then(res => {
            that.fileList = res.data.data.list
            that.taskImgTotal = res.data.data.total;
          })
        }, 2000)
      },
      handleUploadSuccess(res, file, fileList) {
        if (!res.code) {
          if (fileList.every(item => item.status == "success")) {
            fileList.map(item => {
              item.response && this.fileList.push({
                "url": res.data.url,
                "name": res.data.name
              })
            })
          }
        }
      },
      delStudents(id, index) {
        this.$api.delMarkTaskStudents({
          id: id
        }).then(res => {
          this.msgSuccess("删除成功!");
          this.studentsList.splice(index, 1)
        })
      },
      handleRemove(e) {
        console.log(e)
      },
      showStudentImgs(row) {
        this.curStudentRecImg = row.imgs;
        this.showAnsVisible = true;
      },
      showCurRecImg(row) {
        this.curStudentRecImg = row.ans_imgs.replace(".png", "_draw_ans.png");
        this.showAnsVisible = true;
      },
      showCurRecKhImg(row) {
        let ext = row.ans_imgs.split("/").pop()
        if (ext) {
          ext = "." + ext.split(".")[1]
        }
        this.curStudentRecImg = row.ans_imgs.replace("_ans" + ext, "_sno" + ext);
        this.showAnsVisible = true;
      },

      handleTabClick(tab, event) {
        this.activeName = tab.name;
        this.recParams = {
          task_id: this.curTaskId,
          page: this.recPage,
          page_size: this.recPageSize,
          status: this.activeName,
          name: this.queryName,
          err_status: this.queryMarkStatus
        }
        window.clearInterval(this.timer);
        this.openUploadPaper(this.curTaskId)
      },
      downloadObjectiveResult(task_id) {
        this.$api
          .downloadObjectiveResult({
            task_id: task_id
          })
          .then((res) => {
            var elink = document.createElement("a");
            let blob = new Blob([res.data], {
              type: "application/vnd.ms-excel,charset=UTF-8",
            });
            let objUrl = URL.createObjectURL(blob);
            let file_name = decodeURIComponent(
              res.headers["content-disposition"].split("=")[1]
            );
            elink.download = file_name;
            elink.style.display = "none";
            elink.href = objUrl;
            document.body.appendChild(elink);
            elink.click();
            document.body.removeChild(elink);
            this.download_loading = false;
          });
      },
      handleSelectionChange(val) {
        this.selectException = [];
        if (val.length > 0) {
          val.forEach(item => {
            let task_img = item.task_id + ";;" + item.imgs + ";;" + item.id;
            this.selectException.push(task_img);
          })
          window.clearInterval(this.timer);
        }
      },
      reTryMark() {
        if (this.selectException.length < 1) {
          this.msgError("请选择需要重新识别的答卷!");
        } else {
          this.remarkDialogVisible = true;
        }
      },
      doReTryMark() {
        let urls = []
        this.selectException.forEach(item => {
          item = item + ";;" + String(this.form.khVoiceNum) + ";;" + String(this.form.khFillRate);
          item = item + ";;" + String(this.form.tmVoiceNum) + ";;" + String(this.form.tmFillRate);
          urls.push(item);
        })
        let that = this;
        this.$api.reTryMarkPaper({
          urls: urls
        }).then(res => {
          this.remarkDialogVisible = false;
          this.getData();
          window.clearInterval(this.timer);
          this.timer = setInterval(function () {
            that.$api.getMarkTaskStudents(that.recParams).then(res => {
              that.studentsList = res.data.data.list;
              that.studentsList.forEach(item => {
                let mark_status = item.mark_status;
                if (mark_status != 1) {
                  item.mark_status_name = that.$const.recErrorList.filter((ritem) => {
                    return ritem.value == mark_status;
                  })[0].label
                } else {
                  item.mark_status_name = "正常"
                }
              })
              that.recTotal = res.data.data.total;
              that.recSucTotal = res.data.data.suc_total;
              that.recErrTotal = res.data.data.err_total;
            })
          }, 4000)
        })
      },
      startRecPaper() {
        this.loading = true
        this.$api.startRecPaper({
          task_id: this.curTaskId
        }).then(res => {
          this.loading = false
        })
      },
      remarkSet(row) {
        this.remarkSetVisible = true
        this.curTaskId = row.task_id;
        this.curPaperId = row.paper_id;
      },
      closeMarkTaskSet(){
        this.remarkSetVisible = false
      }
    },
    created() {
      this.getData();
      this.getSchoolList();
      this.getGradeList();
      this.getClassList();
    },
  };
</script>
<style lang="scss">
  .el-upload-list {
    display: none !important;
  }

  .el-upload-list--picture .el-upload-list__item {
    width: 150px;
    float: left;
    margin-right: 10px;
    position: relative;
  }

  .el-upload-list--picture .el-upload-list__item.is-success .el-upload-list__item-name {
    position: absolute;
    z-index: 100;
    height: 70px;
    line-height: 130px;
  }

  .el-upload-list--picture .el-upload-list__item-thumbnail {
    width: 125px;
  }

  .prosss_box .el-progress.el-progress--line {
    width: 88px;
    margin: auto 5px auto 0;
  }

  .prosss_box .el-progress-bar {
    padding-right: 0;
  }

  .prosss_box .el-progress__text {
    display: none;
  }

  .prosss_box {
    display: flex;
  }
</style>