完成单选题

http-test/online-exam.http

@@ -7,7 +7,7 @@ Content-Type: application/json;charset=UTF-8
 "accountType":"STUDENT_CODE"}
 
 
-@token = c6be55a5ae7f4dbbbd27c831947c034c
+@token = 53f112e9fadb4074a747e2e249dee000
 @key = U_S_109_53286
 
 ###
@@ -69,3 +69,12 @@ token: {{token}}
 key: {{key}}
 
 
+### answer question
+PUT http://localhost:8080/api/exam_question/3088073
+Content-Type: application/json;charset=UTF-8
+token: {{token}}
+key: {{key}}
+
+{"stuAnswer": "C"}
+
+

http-test/sys.http

@@ -10,7 +10,57 @@ Content-Type: application/json;charset=UTF-8
 @token = d991f4022c0949abaa238cbe823ba024
 @key = U_S_109_53286
 
+/**
+登录应该取出所有用户的基础信息.
+用户唯一标识
+姓名
+机构 & 学习中心
+头像
+
+**/
+
 ###
 GET https://ecs-dev.qmth.com.cn:8878/api/sys_param?org_id=109
 token: {{token}}
 key: {{key}}
+
+
+/**
+废弃?
+**/
+
+
+/**
+网考学生端总体API/model规划:
+User
+Exam (startTime/endTime, scoreList)
+  startExam
+  verifySnapshotPhoto
+  heartbeat (leftTime)
+  Question
+  saveQuestion (answer, signed)
+  uploadSnapshotPhoto
+  *notifications (15秒检查一次? 比如准备活体检测)
+  updateMediaPlayTimes
+  submitExam
+  getExamScore (latest)
+PracticeExam
+OfflineExam
+  uploadAnswer
+
+**/
+
+/**
+云平台总体API/model规划:
+User/Student
+Exam
+Mark
+
+导入考生
+导入试卷
+设置考试
+调卷规则
+专业
+课程
+
+**/

jsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}

src/features/OnlineExam/Examing/QuestionView.vue

@@ -2,12 +2,13 @@
   <div v-if="question && examQuestion" class="question-view">
     <div class="question-group">{{"大题占位"}}</div>
     <div class="question-group-progress">{{"大题进度占位"}}</div>
-    <div class="question-body" v-html="question.body"></div>
-    <div class="question-options" v-html="question.options[0].content"></div>
+    <single-question-view :question="question" :examQuestion="examQuestion" />
   </div>
 </template>
 
 <script>
+import SingleQuestionView from "./SingleQuestionView";
+
 export default {
   name: "QuestionView",
   data() {
@@ -18,9 +19,6 @@ export default {
   props: {
     examQuestion: Object
   },
-  computed: {
-    all: function() {}
-  },
   methods: {
     async updateQuestion() {
       if (!this.examQuestion) {
@@ -105,6 +103,9 @@ export default {
     examQuestion: function() {
       this.updateQuestion();
     }
+  },
+  components: {
+    SingleQuestionView
   }
 };
 </script>

src/features/OnlineExam/Examing/SingleQuestionView.vue

@@ -0,0 +1,71 @@
+<template>
+  <div class="question-view">
+    <div class="question-body" v-html="question.body"></div>
+    <div class="ops">
+      <div class="stu-answer"> {{stuAnswer}}</div>
+      <i-button @click="resetQuestion(examQuestion.id)">重置</i-button>
+      <div class="score">({{question.questionScore}}分)</div>
+    </div>
+    <div v-for="(option, index) in question.options" :key="option.id" class="option" @click="answerQuestion(examQuestion.id, optionName[index])">
+      <input type="radio" name="question" value="optionName[index]" :checked="stuAnswer === optionName[index]" />
+      <span>{{optionName[index]}}: </span>
+      <span class="question-options" v-html="option.content"></span>
+    </div>
+
+  </div>
+</template>
+
+<script>
+const optionName = ["A", "B", "C", "D", "E", "F"];
+export default {
+  name: "SingleQuestionView",
+  data() {
+    return {
+      // question: null
+      optionName,
+      stuAnswer: this.examQuestion.stuAnswer
+    };
+  },
+  props: {
+    question: Object,
+    examQuestion: Object
+  },
+  methods: {
+    answerQuestion: function(examQuestionId, stuAnswer) {
+      this.stuAnswer = stuAnswer;
+      this.$http.put("/api/exam_question/" + examQuestionId, { stuAnswer });
+    },
+    resetQuestion: function(examQuestionId) {
+      this.stuAnswer = null;
+      this.$http.put("/api/exam_question/" + examQuestionId, {
+        stuAnswer: null
+      });
+    }
+  },
+  watch: {}
+};
+</script>
+
+<style scoped>
+.question-view {
+  display: block;
+}
+
+.ops {
+  display: flex;
+  align-items: flex-end;
+}
+
+.stu-answer {
+  width: 100px;
+  border-bottom: 1px solid black;
+}
+
+.option {
+  display: flex;
+}
+.question-options {
+  text-align: left;
+  padding-left: 10px;
+}
+</style>