页面修改

src/components/questiontype/v-cloze.vue

@@ -45,7 +45,7 @@
           </tr>
         </thead>
         <tbody class="contant">
-          <tr v-for="(subItem,subIndex) in item">
+          <tr v-for="(subItem,subIndex) in item.OptionList" :key="subIndex">
             <td style="width:40px;text-align:center;">
               <template v-if="isOperate">
                 <div class="Answer_List" @click="ChangeItem(item,subItem)" :class="{'Is_Answer':subItem.IsAnswer}">

src/pages/exam/examtestinfo.vue

+<style>
+  .examPaperInfo_Top {
+    height: 83px;
+    border-bottom: 1px solid #d9d9d9;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin: 0 100px;
+  }
+
+  .Exam-main {
+    height: auto !important;
+    overflow: hidden;
+    margin: 20px 100px;
+  }
+
+  .Exam-left {
+    width: 29%;
+    border-right: 1px solid #d9d9d9;
+    border-bottom: 1px solid #d9d9d9;
+    border-radius: 3px;
+    border-top: 1px solid #d9d9d9;
+    background: #f0f0f0;
+    padding-top: 20px;
+    padding-bottom: 0px;
+  }
+
+  .f1 {
+    float: left;
+  }
+
+  .Exam-right {
+    width: 65%;
+    min-height: 795px;
+    background: #fff;
+    border-radius: 3px;
+    overflow-y: auto;
+    border: 1px solid #d9d9d9;
+    margin-left: 20px;
+  }
+
+  .Left-ptitel {
+    font-size: 14px;
+    color: #777;
+    padding-left: 18px;
+  }
+
+  .Left-ptitel span {
+    font-size: 14px;
+    color: #333;
+  }
+
+  .Left-ptitel i {
+    color: #c90000;
+    font-style: normal;
+  }
+
+  .Left-list {
+    width: 100%;
+    border-top: 1px solid #d9d9d9;
+  }
+
+  .List-ul {
+    margin: 0;
+    padding: 0;
+  }
+
+  .List-ul li {
+    height: 33px;
+    border-bottom: 1px solid #f3f3f3;
+    list-style-type: none;
+  }
+
+  .List-ul-li-checked {
+    background: #a6a6a6;
+    color: #333;
+    width: 328px;
+  }
+
+  .List-ul li {
+    display: block;
+    padding-left: 25px;
+    line-height: 33px;
+    font-size: 12px;
+    height: 33px;
+    border-bottom: 1px solid #f3f3f3;
+    color: #555;
+    text-decoration: none;
+    display: flex;
+  }
+
+  .List-ul-li-checked b {
+    color: #000;
+  }
+
+  .Showbtn {
+    display: block;
+    width: 90px;
+    float: right;
+    padding-top: 8px;
+    z-index: 1000;
+  }
+
+  .Left-btn {
+    height: 58px;
+    padding: 20px 0 20px 20px;
+    width: 100%;
+    border-bottom: 1px solid #d9d9d9;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .List-bt {
+    width: 100%;
+    height: 27px;
+    margin-left: 1px;
+    background: #fdfdfd;
+    font-size: 14px;
+    line-height: 27px;
+    padding-left: 10px;
+  }
+
+  .List-bt i {
+    position: relative;
+    top: 1px;
+    left: 5px;
+  }
+
+  .List-bt i:hover {
+    color: #2961fe;
+    cursor: pointer;
+  }
+
+  .List-ul li:hover {
+    background: #a6a6a6;
+    color: #333;
+  }
+
+  .checkUl {
+    background: #a6a6a6;
+    color: #333;
+  }
+
+  .List-ul li:hover .exam_ListSHow {
+    display: block;
+  }
+
+  .left-btn-list {
+    padding: 5px 10px;
+    display: inline-block;
+    color: #555;
+    border-radius: 3px;
+    font-size: 14px;
+    border: 1px solid #999;
+    margin-right: 10px;
+    cursor: pointer;
+  }
+
+  #btn1 {
+    background: #26a69a !important;
+  }
+
+  .difficulty_Degree {
+    display: inline-block;
+    width: 80px;
+    text-align: right;
+    line-height: 56px;
+  }
+
+  .Left-list::-webkit-scrollbar {
+    width: 3px;
+    height: 3px;
+    background-color: #F5F5F5;
+  }
+
+  /*!*定义滚动条轨道 内阴影+圆角*!*/
+  .Left-list::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+    border-radius: 10px;
+    background-color: #F5F5F5;
+  }
+
+  /*!*定义滑块 内阴影+圆角*!*/
+  .Left-list::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    -webkit-box-shadow: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));
+    background-color: #0ae;
+  }
+
+  .commonDalei {
+    display: flex;
+    align-content: center;
+    margin-bottom: 20px;
+  }
+
+  .examPaper .edui-editor {
+    z-index: 99 !important;
+  }
+
+  .List-bt input {
+    outline: none;
+    height: 25px;
+  }
+
+  .exam_DetailList {
+    width: 80%;
+    display: inline-block;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    margin-left: 5px;
+  }
+
+  .exam_ListSHow {
+    display: none;
+  }
+
+  .exam_ListSHow i:hover {
+    color: #2961fe;
+  }
+
+  .pGroupName {
+    color: #202020;
+    font-size: 16px;
+  }
+
+  .paper_Title p {
+    display: inline;
+  }
+
+  .pGNameDiv {
+    font-size: 12px;
+    margin-top: 20px;
+  }
+
+  .Exam-main .common_TiTable {
+    border-spacing: 0;
+  }
+
+  .examPaperInfo_Top .vClozeQuestion .clozeTest_question_tit {
+    margin: 15px 0;
+  }
+
+</style>
+<!--阅卷-->
+<template>
+  <div class="examPaper page-body">
+    <div class="examPaperInfo_Top">
+      <div>
+        <div>
+          {{DataObj.PaperName}} <br />
+          题量：{{examNum}} &nbsp;&nbsp;&nbsp; 满分：{{examScore}}
+          <br />
+          学生总得分:{{studentScore}}
+          <q-input filled stack-label maxlength="100" :dense="false" v-model="DataObj.StuComment"
+            class="col-6 q-pb-lg q-pr-lg" label="评语" />
+        </div>
+      </div>
+      <div style="width:20%;text-align:right;">
+        <q-btn color="accent" size="sm" class="q-mr-md" @click="submitTeacherScoring()" label="提交阅卷" />
+        <q-btn color="accent" size="sm" class="q-mr-md" @click="goBack()" label="返回" />
+      </div>
+    </div>
+    <div class="Exam-main">
+      <template v-if="DataObj&&DataObj.GroupList&&DataObj.GroupList.length>0">
+        <div v-for="(gItem,gIndex) in DataObj.GroupList" :key="gIndex">
+          <div class="pGNameDiv"><span class="pGroupName">{{NoToChinese(gIndex+1)}}、{{gItem.GroupName}}</span> （共
+            {{gItem.DetailsList.length}} 题，{{gItem.GScore}}分）</div>
+          <div v-for="(dItem,dIndex) in gItem.DetailsList" :key="dIndex">
+            <span>{{dIndex+1}}、</span>
+            <span class="paper_Title" v-html="dItem.Title"></span>
+            <span style="margin:10px 0;display:inline-block;">
+              ({{dItem.Score}}分)
+            </span>
+            <!--单选题-->
+            <v-single v-if="dItem.QuestionTypeKey=='single'||dItem.QuestionTypeKey=='single-number'"
+              :questionObj="dItem" :isShowAnswer="isShowAnswer" :isShowStudentAnswer="isShowStudentAnswer"
+              @getScore="calcPaper">
+            </v-single>
+            <!--多选题-->
+            <v-multiple v-if="dItem.QuestionTypeKey=='multiple'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-multiple>
+            <!--填空题-->
+            <v-fillin v-if="dItem.QuestionTypeKey=='fill-in'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-fillin>
+            <!--判断题-->
+            <v-judge v-if="dItem.QuestionTypeKey=='judge'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper"></v-judge>
+
+            <!--简答题、名词解释、论述题、计算题、口语题、其它-->
+            <v-shortanswer v-if="dItem.QuestionTypeKey=='short-answer'
+            ||dItem.QuestionTypeKey=='noun-explanation'
+            ||dItem.QuestionTypeKey=='essay-question'
+            ||dItem.QuestionTypeKey=='calculation' 
+            || dItem.QuestionTypeKey=='spoken'
+            || dItem.QuestionTypeKey=='other'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-shortanswer>
+
+            <!--分录题、资料题-->
+            <v-entryproblem v-if="dItem.QuestionTypeKey=='entry-problem'|| dItem.QuestionTypeKey=='data-question'"
+              :questionObj="dItem" :isShowAnswer="isShowAnswer" :isShowStudentAnswer="isShowStudentAnswer"
+              @getScore="calcPaper">
+            </v-entryproblem>
+            <!--连线题-->
+            <v-matching v-if="dItem.QuestionTypeKey=='matching'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-matching>
+            <!--排序题-->
+            <v-sortingproblem v-if="dItem.QuestionTypeKey=='sorting-problem'" :questionObj="dItem"
+              :isShowAnswer="isShowAnswer" :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-sortingproblem>
+
+            <!--完型填空-->
+            <v-cloze v-if="dItem.QuestionTypeKey=='cloze'" :questionObj="dItem" :isShowAnswer="isShowAnswer"
+              :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper"></v-cloze>
+
+            <!--阅读理解、听力题-->
+            <v-readingcomprehensio
+              v-if="dItem.QuestionTypeKey=='reading-comprehensio'||dItem.QuestionTypeKey=='listening'"
+              :questionObj="dItem" :isShowAnswer="isShowAnswer" :isShowStudentAnswer="isShowStudentAnswer"
+              @getScore="calcPaper">
+            </v-readingcomprehensio>
+
+            <!--共用选择题-->
+            <v-sharingchoose v-if="dItem.QuestionTypeKey=='sharing-choose'" :questionObj="dItem"
+              :isShowAnswer="isShowAnswer" :isShowStudentAnswer="isShowStudentAnswer" @getScore="calcPaper">
+            </v-sharingchoose>
+          </div>
+        </div>
+      </template>
+    </div>
+  </div>
+</template>
+<script>
+  import vSingle from '../../components/questiontype/v-single'
+  import vMultiple from '../../components/questiontype/v-multiple'
+  import vFillin from '../../components/questiontype/v-fillin'
+  import vJudge from '../../components/questiontype/v-judge'
+  import vShortanswer from '../../components/questiontype/v-shortanswer'
+  import vEntryproblem from '../../components/questiontype/v-entryproblem'
+  import vMatching from '../../components/questiontype/v-matching'
+  import vSortingproblem from '../../components/questiontype/v-sortingproblem'
+  import vCloze from '../../components/questiontype/v-cloze'
+  import vReadingcomprehensio from '../../components/questiontype/v-readingcomprehensio'
+  import vSharingchoose from '../../components/questiontype/v-sharingchoose'
+  import {
+    queryPaperDetails,
+    saveTeacherScoring,
+  } from '../../api/teacher/index';
+  export default {
+    components: {
+      vSingle,
+      vMultiple,
+      vFillin,
+      vJudge,
+      vShortanswer,
+      vEntryproblem,
+      vMatching,
+      vSortingproblem,
+      vCloze,
+      vReadingcomprehensio,
+      vSharingchoose
+    },
+    meta: {
+      title: "阅卷"
+    },
+    watch: {
+
+    },
+    data() {
+      return {
+        msg: {
+          GuestId: 0,
+          PaperId: 0,
+          PublishId: 0,
+          isShowAnswer: true,
+        },
+        //试卷对象
+        DataObj: {
+          StuComment: "", //学员评语
+          PaperId: 0, //试卷编号
+          PaperName: '', //试卷名称
+          GuestId: 0, //学员编号
+          PublishId: 0, //考试编号
+          GroupList: [], //试卷答题分类
+        },
+        PaperConfig: {}, //试卷配置
+        isShowAnswer: true, //是否显示答案
+        isShowStudentAnswer: true, //是否显示学生答案
+        studentScore: 0, //学生总得分
+        examScore: 0, //总分,
+        examNum: 0, //总题量
+      }
+    },
+    created() {
+      if (this.$route.query) {
+        if (this.$route.query.GuestId && this.$route.query.GuestId > 0) {
+          this.msg.GuestId = this.$route.query.GuestId;
+        }
+        if (this.$route.query.PaperId && this.$route.query.PaperId > 0) {
+          this.msg.PaperId = this.$route.query.PaperId;
+        }
+        if (this.$route.query.PublishId && this.$route.query.PublishId > 0) {
+          this.msg.PublishId = this.$route.query.PublishId;
+        }
+      }
+    },
+    mounted() {
+      this.GetPaperInfo()
+    },
+    methods: {
+      NoToChinese(str) {
+        str = str + '';
+        var len = str.length - 1;
+        var idxs = ['', '十', '百', '千', '万', '十', '百', '千', '亿', '十', '百', '千', '万', '十', '百', '千', '亿'];
+        var num = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
+        return str.replace(/([1-9]|0+)/g, function ($, $1, idx, full) {
+          var pos = 0;
+          if ($1[0] != '0') {
+            pos = len - idx;
+            if (idx == 0 && $1[0] == 1 && idxs[len - idx] == '十') {
+              return idxs[len - idx];
+            }
+            return num[$1[0]] + idxs[len - idx];
+          } else {
+            var left = len - idx;
+            var right = len - idx + $1.length;
+            if (Math.floor(right / 4) - Math.floor(left / 4) > 0) {
+              pos = left - left % 4;
+            }
+            if (pos) {
+              return idxs[pos] + num[$1[0]];
+            } else if (idx + $1.length >= len) {
+              return '';
+            } else {
+              return num[$1[0]]
+            }
+          }
+        });
+      },
+      //获取试卷详情
+      GetPaperInfo() {
+        queryPaperDetails(this.msg).then(res => {
+          var tempData = res.Data;
+          if (res.Code == 1) {
+            this.DataObj.PaperId = tempData.Paper.PaperId;
+            this.DataObj.PaperName = tempData.Paper.PaperName;
+            this.DataObj.GuestId = tempData.Paper.GuestId;
+            this.DataObj.PublishId = tempData.Paper.PublishId;
+            if (tempData.Paper.GroupList && tempData.Paper.GroupList.length > 0) {
+              this.DataObj.GroupList = tempData.Paper.GroupList;
+            }
+            this.PaperConfig = tempData.Publish;
+            this.calcPaper();
+          }
+        })
+      },
+      //计算试卷相关
+      calcPaper() {
+        this.examScore = 0;
+        this.examNum = 0;
+        this.studentScore = 0;
+        if (this.DataObj && this.DataObj.GroupList) {
+          this.DataObj.GroupList.forEach(x => {
+            if (x.DetailsList && x.DetailsList.length > 0) {
+              this.examNum += x.DetailsList.length;
+              x.DetailsList.forEach(y => {
+                if (y.Score) {
+                  this.examScore += Number(y.Score);
+                  this.studentScore += Number(y.StundetScore)
+                }
+              })
+            }
+          })
+        }
+      },
+      //返回
+      goBack() {
+        this.$router.push({
+          path: '/exam/examlist'
+        })
+      },
+      //老师提交阅卷
+      submitTeacherScoring() {
+        saveTeacherScoring(this.DataObj).then(res => {
+          if (res.Code == 1) {
+            this.$q.notify({
+              icon: 'iconfont icon-chenggong',
+              color: 'accent',
+              timeout: 2000,
+              message: '操作成功!',
+              position: 'top'
+            })
+            this.GetPaperInfo();
+          }
+        })
+      }
+    }
+  }
+
+</script>