修改模拟考试

src/api/exam.js

 import httpRequest from '@/utils/axios'
+/**
+ * 获取模拟考试试题
+ */
+export function getExamList(params) {
+  return httpRequest.get('/api/zy/v2/examination/examination-papers-list', { params })
+}
 /**
  * 获取模拟考试试题
  */

src/pages/exam/testExam/exam/index.vue

@@ -54,10 +54,7 @@ import * as api from '@/api/exam.js'
 import answerCard from '../../components/answerCard.vue'
 import question from '../../components/question.vue'
 export default {
-  components: {
-    question,
-    answerCard
-  },
+  components: { question, answerCard },
   data() {
     return {
       time: {
@@ -90,6 +87,20 @@ export default {
       handleTime: null
     }
   },
+  computed: {
+    examId() {
+      return this.$route.query.exam_id
+    },
+    changeQuestionIndex() {
+      return this.questionParams.questionIndex
+    }
+  },
+  watch: {
+    // 监听题的变化
+    changeQuestionIndex(newV, oldV) {
+      this.changeData()
+    }
+  },
   beforeDestroy() {
     // this.handlePapers()
     clearInterval(this.handleTime)
@@ -130,8 +141,15 @@ export default {
     // 收藏试题
     collectQuestion() {
       const data = this.questionParams.question
-      data.isCollection
-        ? this.removeCall(data.id, () => { data.isCollection = false }) : this.addCall(data.id, () => { data.isCollection = true })
+      if (data.isCollection) {
+        this.removeCall(data.id, () => {
+          data.isCollection = false
+        })
+      } else {
+        this.addCall(data.id, () => {
+          data.isCollection = true
+        })
+      }
     },
     addCall(id, call) {
       api.addCollection({ question_id: id }).then(response => {
@@ -203,6 +221,7 @@ export default {
     getTopic() {
       const param = {
         type: 2,
+        paper_id: this.examId,
         is_create: this.$route.query.id || this.$route.query.is_create === undefined ? 0 : this.$route.query.is_create
       }
       api.getExamQuestion(param).then(response => {
@@ -274,7 +293,10 @@ export default {
                 return this.A_Z()[findIndex]
               })
               data.question_analysis = cItem.question_analysis
-              optGroup = findAB.sort().toString().replace(new RegExp(',', 'g'), '')
+              optGroup = findAB
+                .sort()
+                .toString()
+                .replace(new RegExp(',', 'g'), '')
               data.question_answer = optGroup
             }
           }
@@ -314,11 +336,13 @@ export default {
       let _tmp = null
       arr.length && (_tmp = arr[0][str])
       for (const i in arr) {
-        arr[i][str] === _tmp ? _t.push(arr[i]) : (() => {
+        if (arr[i][str] === _tmp) {
+          _t.push(arr[i])
+        } else {
           _tmp = arr[i][str]
           _arr.push(_t)
           _t = [arr[i]]
-        })()
+        }
       }
       _arr.push(_t)
       return _arr
@@ -367,17 +391,6 @@ export default {
         return item.filter(is => is)
       })
     }
-  },
-  computed: {
-    changeQuestionIndex() {
-      return this.questionParams.questionIndex
-    }
-  },
-  watch: {
-    // 监听题的变化
-    changeQuestionIndex(newV, oldV) {
-      this.changeData()
-    }
   }
 }
 </script>

src/pages/exam/testExam/index.vue

 <template>
-  <app-container title="模拟考试介绍">
-    <div class="desc-exam">
-      <p>考试时间20分钟。</p>
-      <p>演示考试题目共10题，全部为单选题。</p>
-    </div>
-    <template #footer>
+  <app-container title="模拟考试">
+    <ul class="exam-list">
+      <li v-for="item in examList" :key="item.id" class="exam-item" @click="startExam(item)">
+        <el-card shadow="hover">
+          <h3>{{ item.paper_title }}</h3>
+          <p v-if="[1, 2].includes(item.status)">已完成</p>
+          <p v-if="[0, 3].includes(item.status)">待完成</p>
+          <!-- <p>重新考试</p> -->
+        </el-card>
+      </li>
+    </ul>
+    <!-- <template #footer>
       <div class="app-container-ft"><el-button type="primary" @click="getExamStatus">开始考试</el-button></div>
-    </template>
+    </template> -->
   </app-container>
 </template>
 
@@ -16,73 +22,60 @@ import AppContainer from '@/components/AppContainer'
 export default {
   components: { AppContainer },
   data() {
-    return {}
+    return {
+      examList: []
+    }
   },
   mounted() {
-    // this.open()
+    this.getExamList()
   },
   methods: {
-    getExamStatus() {
-      api
-        .getExamStatus({ type: 2 })
-        .then(response => {
-          if (response.status === 0 || response.status === 3) {
-            this.open()
-          } else {
-            this.$router.push({
-              path: '/testExam/exam',
-              query: {
-                is_create: 1
-              }
-            })
-          }
-        })
-        .finally(() => {
-          // this.loaded = true
-        })
+    getExamList() {
+      api.getExamList().then(response => {
+        // 考试状态(0,3：已缓存，1：已提交，2：已评阅，100：未做)
+        this.examList = response.papers
+      })
+    },
+    startExam(item) {
+      if (item.status === 0 || item.status === 3) {
+        this.open(item)
+      } else {
+        this.$router.push({ path: '/testExam/exam', query: { exam_id: item.id, is_create: 1 } })
+      }
     },
-    open() {
-      const h = this.$createElement
+    open(item) {
       this.$msgbox({
-        title: '消息',
-        message: h('p', null, [h('span', null, '您上次未做完试题 ')]),
+        title: '提示',
+        message: '您上次未做完试题',
         showCancelButton: true,
         confirmButtonText: '继续答题',
-        cancelButtonText: '重新答题',
-        beforeClose: (action, instance, done) => {
-          done()
-          if (action === 'confirm') {
-            this.$router.push({
-              path: '/testExam/exam',
-              query: {
-                is_create: 0
-              }
-            })
-          } else {
-            this.$router.push({
-              path: '/testExam/exam',
-              query: {
-                is_create: 1
-              }
-            })
-          }
-        }
-      }).then(action => {
-        // this.$message({
-        //   type: 'info',
-        //   message: 'action: ' + action
-        // })
+        cancelButtonText: '重新答题'
       })
+        .then(() => {
+          this.$router.push({ path: '/testExam/exam', query: { exam_id: item.id, is_create: 0 } })
+        })
+        .catch(() => {
+          this.$router.push({ path: '/testExam/exam', query: { exam_id: item.id, is_create: 1 } })
+        })
     }
   }
 }
 </script>
 <style lang="scss" scoped>
-.desc-exam {
+.exam-list {
+}
+.exam-item {
+  display: inline-block;
+  width: 300px;
+  margin: 0 20px 20px 0;
+  text-align: center;
+  cursor: pointer;
+  h3 {
+    line-height: 30px;
+  }
   p {
-    margin-bottom: 20px;
-    line-height: 20px;
-    color: #333;
+    height: 24px;
+    line-height: 24px;
   }
 }
 </style>