新增批阅试卷页面

src/modules/exam/api.js

@@ -85,3 +85,15 @@ export function importStudent(data) {
     withCredentials: true
   })
 }
+/**
+ * 获取试卷详情
+ */
+export function getPaperDetails(params) {
+  return httpRequest.get('/api/exam/v1/exam/sheet-detail', { params })
+}
+/**
+ * 批改试卷
+ */
+export function submitPaper(data) {
+  return httpRequest.post('/api/exam/v1/exam/submit-sheet', data)
+}

src/modules/exam/components/PaperQuestion.vue

+<template>
+  <el-card class="container">
+    <div slot="header" class="clearfix">
+      <span>{{options.question_item_title}}</span>
+    </div>
+    <div class="content">
+      <template v-for="item in options.question_list">
+        <div class="sub-content" v-if="item.group_id" :key="item.id">
+          <div class="title" v-html="item.common_content"></div>
+          <div class="sub-container">
+            <question-item v-for="subItem in item.list" :key="subItem.id" :question="{item: subItem, question_item_id, questionType}" :question_item_id="question_item_id" />
+          </div>
+        </div>
+        <question-item v-else :question="{item, question_item_id, questionType}" :question_item_id="question_item_id" :key="item.id" />
+      </template>
+    </div>
+  </el-card>
+</template>
+<script>
+import QuestionItem from './QuestionItem.vue'
+export default {
+  props: {
+    options: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    question_item_id: {
+      type: String
+    }
+  },
+  components: { QuestionItem },
+  data() {
+    return {}
+  },
+  computed: {
+    questionType() {
+      return this.options.question_item_type
+    },
+    // 选项类型
+    questionTypeText() {
+      const map = { 1: '单选题', 2: '多选题', 3: '问答题', 5: '案例题', 6: '判断题', 7: '实操题', 8: '情景题' }
+      return map[this.questionType]
+    }
+  },
+  created() {
+    // console.log(this.options)
+  }
+}
+</script>
+<style lang="scss" scoped>
+.container{
+  background:#fff;
+  border:1px solid #f3f3f3;
+  margin-bottom:20px;
+  border-radius:6px;
+  ::v-deep .el-card__body{
+    padding:10px 20px;
+  }
+  .content{
+    // border:1px solid #f3f3f3;
+    padding:10px;
+    .title{
+      line-height:40px;
+      font-size:16px;
+    }
+    .sub-container{
+      border:1px solid #e3e3e3;
+      padding:15px 15px 0;
+      border-radius:4px;
+    }
+    .sub-content{
+      margin-bottom:20px;
+    }
+    .question-item:last-child{
+      border:none;
+    }
+  }
+}
+</style>

src/modules/exam/components/QuestionItem.vue

+<template>
+  <div class="question-item">
+    <div class="question-item-title" v-html="questionData.content"></div>
+    <template v-if="questionType === 1 || questionType === 6">
+      <el-radio-group v-model="questionData.answer[0]" :disabled="true" class="question-item-content" >
+        <div class="question-item-option" v-for="subItem in questionData.options" :key="subItem.id">
+          <el-radio :label="subItem.id">{{ subItem.option }}</el-radio>
+        </div>
+      </el-radio-group>
+    </template>
+    <template v-if="questionType === 2">
+      <el-checkbox-group v-model="questionData.answer" :disabled="true" class="question-item-content"  >
+        <div class="question-item-option" v-for="subItem in questionData.options" :key="subItem.id">
+          <el-checkbox :label="subItem.id"> {{ subItem.option }} </el-checkbox>
+        </div>
+      </el-checkbox-group>
+    </template>
+    <template v-if="questionType === 3">
+      <div class="SAQ">{{questionData.answer || ''}}</div>
+      <div style="text-align:right;">
+        <el-button type="primary" size="mini" plain @click="showComment = !showComment">点击评分</el-button>
+      </div>
+      <div class="comment" v-show="showComment">
+        <div class="comment-top">
+          <p>本题{{questionData.score}}分</p>
+          <div class="get-score">
+            学生得分：<el-input-number v-model="questionData.get_score" controls-position="right" :min="0" :max="questionData.score" size="mini"></el-input-number>
+          </div>
+        </div>
+        <el-input type="textarea" placeholder="请输入评语" v-model="comment" rows="3"/>
+        <div style="text-align:center;padding-top:10px;">
+          <el-button type="primary" size="mini" @click="handleComment">提交点评</el-button>
+        </div>
+      </div>
+    </template>
+    <div class="question-item-score">得分：{{questionData.get_score}}分</div>
+  </div>
+</template>
+<script>
+import { submitPaper } from '../api.js'
+export default {
+  props: {
+    question: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    question_item_id: {
+      type: String
+    }
+  },
+  data() {
+    return {
+      questionData: {},
+      showComment: false,
+      comment: ''
+    }
+  },
+  computed: {
+    questionType() {
+      // 1单选，2多选，3简答，5案例题， 6判断， 7实操，8情景
+      const type = this.questionData.type || this.question.questionType || 1
+      return parseInt(type)
+    },
+    eid() {
+      return this.$route.query.eid
+    }
+    // // 选项类型
+    // questionTypeText() {
+    //   const map = { 1: '单选题', 2: '多选题', 3: '问答题', 5: '案例题', 6: '判断题', 7: '实操题', 8: '情景题' }
+    //   return map[this.questionType]
+    // }
+  },
+  created() {
+    this.questionData = JSON.parse(JSON.stringify(this.question.item))
+    console.log(this.question)
+  },
+  methods: {
+    handleComment() {
+      console.log(this.question_item_id)
+      console.log(this.questionData)
+      this.fetchComment()
+    },
+    fetchComment() {
+      const params = {
+        sheet_id: this.eid,
+        question_item_id: this.question_item_id,
+        question_id: this.questionData.id,
+        score: this.questionData.get_score,
+        comment: this.comment
+      }
+      submitPaper(params).then(res => {
+        if (res.code === 0) {
+          this.$message.success('提交点评成功')
+        } else {
+          this.$message.success('提交点评失败')
+        }
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.question-item{
+  font-size:14px;
+  color:#454545;
+  border-bottom:1px solid #f3f3f3;
+  margin-bottom:10px;
+  .question-item-content{
+    padding-left:10px;
+    .question-item-option{
+      padding-top:10px ;
+    }
+  }
+  .SAQ{
+    min-height:60px;
+    font-size:14px;
+    line-height:24px;
+    color:#888;
+    border:1px solid #eee;
+    background:#f3f3f3;
+    margin:10px 0;
+    border-radius:6px;
+  }
+  .comment{
+    border:1px solid rgba(192,28,64, .3);
+    border-radius:4px;
+    padding:10px;
+    margin-top:15px;
+    background:#f9f9f9;
+    .comment-top{
+      display: flex;
+      margin-bottom:10px;
+      p{
+        flex:1;
+      }
+    }
+  }
+  .question-item-score{
+    color:#777;
+    padding:10px 0;
+  }
+}
+</style>

src/modules/exam/index.js

@@ -25,6 +25,11 @@ const routes = [
         component: () => import('./views/Detail.vue'),
         meta: { title: '考试详情' }
       },
+      {
+        path: 'markingPaper',
+        component: () => import('./views/MarkingPaper.vue'),
+        meta: { title: '批阅试卷' }
+      },
       {
         path: 'createStudent',
         component: () => import('./views/CreateStudent.vue'),

src/modules/exam/views/Detail.vue

@@ -130,7 +130,13 @@ export default {
     }
   },
   methods: {
-    handleDetail() {},
+    handleDetail(row) {
+      console.log(row)
+      this.$router.push({
+        path: 'markingPaper',
+        query: { eid: this.exam_id, sid: row.student_id }
+      })
+    },
     // 获取选中项
     handleSelectionChange(val) {
       this.multipleSelection = val

vite.config.js

@@ -29,7 +29,8 @@ export default defineConfig(({ mode }) => {
           rewrite: path => path.replace(/^\/api\/qbs/, '')
         },
         '/api/exam': {
-          target: 'https://x-exam-admin-api.ezijing.com',
+          // target: 'https://x-exam-admin-api.ezijing.com',
+          target: 'http://localhost-exam-admin.ezijing.com',
           changeOrigin: true,
           rewrite: path => path.replace(/^\/api\/exam/, '')
         },