分页获取题目

src/components/question/question-content.vue

@@ -2,10 +2,7 @@
   <section class="qeustion-content-wrapper">
     <article class="public-title" v-show="currentQuestion.unionType">
       <p class="text" v-show="currentQuestion.unionType == 1">
-        我们建议使用 CDN 引入 Element 的永固在机舱在链接
-        地址上锁定版本，以免将来 Element 升级时受到非兼容
-        性更新的影响。例如，如需锁定版本为 1.4.8如需锁定版
-        本为 1.4.8
+        {{currentQuestion.unionQuestion}}
       </p>
       <article
         class="select-wrapper"
@@ -32,8 +29,8 @@
     </article>
     <article class="select-wrapper">
       <div class="item" v-for="(item, index) in currentQuestion.options" :key="index" @click="selectOption(index)">
-        <span v-if="!item.isSelected" class="option border">{{getOrderVac(index)}}</span>
-        <span v-if="item.isSelected && !currentQuestion.commitFlag" class="option bg">{{getOrderVac(index)}}</span>
+        <span v-if="!item.isSelected && !((item.isSelected && !currentQuestion.commitFlag) || (!item.isSelected && currentQuestion.commitFlag && item.isCorrect))" class="option border">{{getOrderVac(index)}}</span>
+        <span v-if="(item.isSelected && !currentQuestion.commitFlag) || (!item.isSelected && currentQuestion.commitFlag && item.isCorrect)" class="option bg">{{getOrderVac(index)}}</span>
         <template v-else>
           <img v-if="item.isSelected && item.isCorrect" src="../../images/question/correct.png" alt />
           <img v-if="item.isSelected && !item.isCorrect" src="../../images/question/error.png" alt />
@@ -44,7 +41,7 @@
         >{{currentQuestion.unionType == 2 ? getOrderVac(index) : item.text}}</span>
         <span v-else
           class="content"
-          :class="{'select': item.isSelected && item.isCorrect, 'error': item.isSelected && !item.isCorrect}"
+          :class="{'select': item.isCorrect, 'error': item.isSelected && !item.isCorrect}"
         >{{currentQuestion.unionType == 2 ? getOrderVac(index) : item.text}}</span>
       </div>
 
@@ -64,12 +61,12 @@
     <article class="c-btn-wrapper" v-show="currentQuestion.typeId == 2 && !currentQuestion.commitFlag" @click="commitAnswer">
       <van-button size="large" round color="#449284">确 认</van-button>
     </article>
-    <article class="answer-wrapper" v-show="currentQuestion.isAnalyzed || currentQuestion.commitFlag">
+    <article class="answer-wrapper" v-show="currentQuestion.isAnalyzed">
       <span class="content">正确答案：{{currentQuestion.answer}}</span>
     </article>
     <article class="analysis-wrapper" v-show="currentQuestion.isAnalyzed">
       <span class="title">解析</span>
-      <div class="content" v-html="analysisContent"></div>
+      <div class="content" v-html="currentQuestion.intro"></div>
     </article>
   </section>
 </template>
@@ -132,6 +129,9 @@ export default {
         } else {
           this.currentQuestion.commitFlag = 2;
         }
+        let myAnswer = this.getOrderVac(index);
+        let isAnalyzed = this.currentQuestion.commitFlag && myAnswer != this.currentQuestion.answer;
+        this.currentQuestion.isAnalyzed = isAnalyzed;
         this.currentQuestion.myAnswer = this.getOrderVac(index);
         this.commitAnswer();
       }
@@ -181,6 +181,9 @@ export default {
 </script>
 <style lang="less" scoped>
 .qeustion-content-wrapper {
+  img {
+    width: 98% !important;
+  }
   font-size: 14px;
   .public-title {
     .text {

src/components/question/question-footer.vue

@@ -64,6 +64,7 @@ export default {
           "SET_CURRENT_QUESTION",
           this.questionList[cIndex - 1] || { answerList: [] }
         );
+        console.log(this.currentQuestion.isAnalyzed || (this.currentQuestion.commitFlag == 2));
         if(cIndex == 1 && this.currentQuestion.titleNo > 2) {
           this.$emit("pageQuestion", 0, this.questionList[0].titleNo);
         }
@@ -83,6 +84,7 @@ export default {
           "SET_CURRENT_QUESTION",
           this.questionList[cIndex + 1] || { answerList: [] }
         );
+        console.log(this.currentQuestion.isAnalyzed || (this.currentQuestion.commitFlag == 2));
         if((cIndex == this.questionList.length - 2) && (this.questionList.length < this.totalCount)) {
           this.$emit("pageQuestion", 1, this.questionList[this.questionList.length - 1].titleNo);
         }
@@ -92,7 +94,7 @@ export default {
 
     // 解析
     toggleAnalysis() {
-      this.currentQuestion.isAnalyzed = !this.currentQuestion.isAnalyzed;
+      this.currentQuestion.isAnalyzed = true;
       // this.$store.commit('SET_CURRENT_QUESTION', this.currentQuestion);
     },
 

src/store/modules/question.js

@@ -96,7 +96,6 @@ const question = {
 
     // 处理返回的数据
     handlerQuestionList({ commit, state }, rezultData) {
-      // debugger
       let questionList = rezultData.practiseTitleModelList || [];
       let handlerList = [], question, option, optionList = [], myAnswer = "", answer = "";
       
@@ -104,7 +103,8 @@ const question = {
         myAnswer = item.myAnswer;
         answer =  item.answer;
         question = JSON.parse(JSON.stringify(item));
-        question.isAnalyzed = false;
+        let isAnalyzed = question.commitFlag && myAnswer != answer;
+        question.isAnalyzed = isAnalyzed;
         option = {};
         optionList = [];
         question.options.forEach( (text, i) => {
@@ -122,18 +122,21 @@ const question = {
         handlerList.push(question);
       });
       console.log('in handlerList', handlerList);
-      let cIndex = findQuestionIndexNo(handlerList, 'titleNo', rezultData.currentTitleNo || 1);
       let newList = concatArray(state.questionList, handlerList, 'titleNo');
-      let titleConfig = {
-        bindStatus: rezultData.bindStatus,            // 绑卡状态：0未绑卡 1已绑卡
-        commitKind: rezultData.commitKind,            // 答题来源 1：错题集 2：收藏 3：题库
-        currentTitleNo: rezultData.currentTitleNo,    // 定位答题题目id
-        resultId: rezultData.resultId,                // 刷题库轮次ID
-        totalCount: rezultData.totalCount,            // 题目总数
-      }
-      commit("SET_CURRENT_QUESTION", newList[cIndex] || {titleNo: 1});
       commit("SET_QUESTION_LIST", newList);
-      commit("SET_TITLE_CONIFG", titleConfig);
+
+      if(rezultData.isFirst) {
+        let cIndex = findQuestionIndexNo(handlerList, 'titleNo', rezultData.currentTitleNo || 1);
+        let titleConfig = {
+          bindStatus: rezultData.bindStatus,            // 绑卡状态：0未绑卡 1已绑卡
+          commitKind: rezultData.commitKind,            // 答题来源 1：错题集 2：收藏 3：题库
+          currentTitleNo: rezultData.currentTitleNo,    // 定位答题题目id
+          resultId: rezultData.resultId,                // 刷题库轮次ID
+          totalCount: rezultData.totalCount,            // 题目总数
+        }
+        commit("SET_CURRENT_QUESTION", newList[cIndex] || {titleNo: 1});
+        commit("SET_TITLE_CONIFG", titleConfig);
+      }
     },
 
   },

src/views/question-detail.vue

@@ -123,61 +123,15 @@ export default {
 
     this.init();
 
-    let firstArr = [
-      {
-        titleNo: 1,
-        name: "11"
-      },
-      {
-        titleNo: 2,
-        name: "11"
-      },
-      {
-        titleNo: 3,
-        name: "11"
-      },
-      {
-        titleNo: 4,
-        name: "11"
-      },
-      {
-        titleNo: 5,
-        name: "11"
-      }
-    ];
-
-    let secondArr = [
-      {
-        titleNo: 3,
-        name: "11"
-      },
-      {
-        titleNo: 4,
-        name: "11"
-      },
-      {
-        titleNo: 5,
-        name: "11"
-      },
-      {
-        titleNo: 6,
-        name: "11"
-      },
-      {
-        titleNo: 7,
-        name: "11"
-      }
-    ];
-
     window.__getUserInfoForQD = function(param) {
       _this.token = param.userToken;
       _this.setUserInfo(param);
-      this.getPractiseTitles();
+      this.getPractiseTitles(true);
 
       // _this.checkToken();
     };
     if (__isWeb) {
-      this.getPractiseTitles();
+      this.getPractiseTitles(true);
     } else {
       _this.getUserInfo();
     }
@@ -323,10 +277,11 @@ export default {
     },
 
     // 分页获取题目（前、后翻页）
-    getPractiseTitles() {
+    getPractiseTitles(isFirst) {
       this.GET(`portal/titleTest/practise/titles`, this.queryParams).then(
         ({ data }) => {
           this.currentTitleNo = data.currentTitleNo;
+          data.isFirst = isFirst;
           this.handlerQuestionList(data);
           // this.handlerPractiseData(data.practiseTitleModelList);
           console.log(data);