setup 考试-试题界面

http-test/online-exam.http

@@ -7,7 +7,7 @@ Content-Type: application/json;charset=UTF-8
 "accountType":"STUDENT_CODE"}
 
 
-@token = 807870010c1a4e20bdd627ab68f62ecd
+@token = 2d8084de57894655bef55cd9b6460cca
 @key = U_S_109_53286
 
 ###
@@ -33,6 +33,11 @@ GET https://ecs-dev.qmth.com.cn:8878/api/ecs_core/org/logo?domain=ecs-dev.qmth.c
 ###
 GET https://ecs-dev.qmth.com.cn:8878/api/ecs_core/org/getRootOrgByCode?code=ecs-dev.qmth.com.cn
 
+### 考试信息
+GET https://ecs-dev.qmth.com.cn:8878/api/ecs_exam_work/exam/153
+token: {{token}}
+key: {{key}}
+
 ### 开始考试
 GET https://ecs-dev.qmth.com.cn:8878/api/exam_control/start?stu_exam_info_id=194505112781
 token: {{token}}
@@ -46,4 +51,11 @@ key: {{key}}
 ### heartbeat
 GET https://ecs-dev.qmth.com.cn:8878/api/exam_control/heartbeat
 token: {{token}}
-key: {{key}}
+key: {{key}}
+
+### question
+GET https://ecs-dev.qmth.com.cn:8878/api/exam_question/3086506
+token: {{token}}
+key: {{key}}
+
+

src/features/OnlineExam/Examing/ExamingHome.vue

@@ -7,7 +7,7 @@
       <Button class="qm-primary-button">交卷</Button>
     </div>
     <div class="main">
-      main
+      <QuestionView :exam-question="examQuestion"></QuestionView>
     </div>
     <div class="side">
       <div class="question-nav">
@@ -24,13 +24,15 @@
 import RemainTime from "./RemainTime.vue";
 import OverallProgress from "./OverallProgress.vue";
 import QuestionFilters from "./QuestionFilters.vue";
+import QuestionView from "./QuestionView.vue";
 
 export default {
   data() {
     return {
       exam: null,
       paperStruct: null,
-      examQuestionList: []
+      examQuestionList: [],
+      examQuestion: null
     };
   },
   async mounted() {
@@ -49,11 +51,13 @@ export default {
       "/api/exam_question/?exam_record_id=" + this.$route.query.examRecordId
     );
     this.examQuestionList = examQuestionList.data;
+    this.examQuestion = this.examQuestionList[0];
   },
   components: {
     RemainTime,
     OverallProgress,
-    QuestionFilters
+    QuestionFilters,
+    QuestionView
   }
 };
 </script>
@@ -69,4 +73,3 @@ export default {
   height: 80px;
 }
 </style>
-

src/features/OnlineExam/Examing/OverallProgress.vue

@@ -27,4 +27,3 @@ export default {
   justify-self: flex-start;
 }
 </style>
-

src/features/OnlineExam/Examing/QuestionFilters.vue

@@ -40,4 +40,3 @@ export default {
   grid-template-columns: 1fr 1fr 1fr 1fr;
 }
 </style>
-

src/features/OnlineExam/Examing/QuestionView.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="question-view">
+    <div class="question-group">{{examQuestion}}</div>
+    <div class="question-group-progress">{{examQuestion}}</div>
+    <div class="question-body">{{examQuestion}}</div>
+    <div class="question-options">{{examQuestion}}</div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "QuestionView",
+  data() {
+    return {};
+  },
+  props: {
+    examQuestion: Object
+  },
+  async mounted() {},
+  computed: {
+    all: function() {}
+  }
+};
+</script>
+
+<style scoped>
+question-view {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr 1fr;
+}
+</style>

src/features/OnlineExam/OnlineExamFaceCheckModal.vue

@@ -13,7 +13,7 @@
         </div>
       </div>
       <div class="camera">
-        <FaceRecognition width="400" height="300" :close-camera="closeCamera" @on-recognize-result="getFaceRecognitionResult">
+        <FaceRecognition v-if="faceCheckModalOpen" width="400" height="300" :close-camera="closeCamera" @on-recognize-result="getFaceRecognitionResult">
         </FaceRecognition>
       </div>
       <div class="verify-desc qm-primary-text">

src/features/OnlineExam/OnlineExamOverview.vue

@@ -9,10 +9,8 @@
       </div>
       <!-- data-ui-sref="exam.start({examRecordId: startInfo.id,stuExamInfoId:stateParams.stuExamInfoId,examMins:startInfo.paperMins,examId:examInfo.id,faceVerifyMinute:startInfo.faceVerifyMinute})" -->
 
-      <a class="qm-primary-button" v-show="remainTime > 110" disabled style="display: inline-block; width: 100%;">
-        强制阅读（倒计时：{{remainTimeFormatted}}）</a>
-      <a class="qm-primary-button" v-show="remainTime < 110" style="display: inline-block; width: 100%;">
-        开始答题（倒计时：{{remainTimeFormatted}}）</a>
+      <Button class="qm-primary-button" :disabled="remainTime > 110" @click="goToPaper" style="display: inline-block; width: 100%;">
+        {{ remainTime > 110 ? '强制阅读' : '开始答题'}}（倒计时：{{remainTimeFormatted}}）</Button>
     </div>
 
     <div class="exam-detail">
@@ -54,10 +52,9 @@ export default {
   },
   async mounted() {
     this.intervalId = setInterval(() => {
-      this.remainTime = --this.remainTime;
-      if (remainTime === 0) {
-        this.$router.push("/online-exam/exam/:id/");
-        window.clearInterval(this.intervalId);
+      this.remainTime = this.remainTime - 1; // 为了界面更新，不能写 this.remainTime--
+      if (this.remainTime === 0) {
+        this.goToPaper();
       }
     }, 1000);
     const exam = await this.$http.get(
@@ -153,7 +150,17 @@ export default {
   },
   computed: {
     remainTimeFormatted: function() {
-      return moment.utc(this.remainTime).format("hh:mm:ss");
+      return moment.utc(this.remainTime * 1000).format("HH:mm:ss");
+    }
+  },
+  methods: {
+    goToPaper: function() {
+      this.$router.push(
+        `/online-exam/exam/${this.$route.params.examId}/?examRecordId=${
+          this.examRecordId
+        }`
+      );
+      window.clearInterval(this.intervalId);
     }
   }
 };
@@ -193,5 +200,3 @@ export default {
   float: right;
 }
 </style>
-
-