Browse Source

添加了单选多选后退加载答案的功能

Mask96 4 years ago
parent
commit
ca5b3ea68c
2 changed files with 113 additions and 37 deletions
  1. 104 37
      src/components/WebQn.vue
  2. 9 0
      src/main.js

+ 104 - 37
src/components/WebQn.vue

@@ -12,7 +12,7 @@
     <div v-else-if="stage == 2">
     <div v-else-if="stage == 2">
       <mt-header title="问卷调查-结束语" fixed></mt-header>
       <mt-header title="问卷调查-结束语" fixed></mt-header>
       <p>
       <p>
-        <img src="static/ending-image.jpeg" style="width: 100%;"/>
+        <img src="static/ending-image.jpeg" style="width: 100%;" />
       </p>
       </p>
     </div>
     </div>
 
 
@@ -118,7 +118,7 @@ export default {
       lastCheckList: [],
       lastCheckList: [],
 
 
       // 选择题选中开放式选项的开放回答值
       // 选择题选中开放式选项的开放回答值
-      selectedOpenList:[]
+      selectedOpenList: []
     };
     };
   },
   },
   mounted: function() {
   mounted: function() {
@@ -313,17 +313,22 @@ export default {
       for (var index = 0; index < opts.length; index++) {
       for (var index = 0; index < opts.length; index++) {
         // let label = `${i + 1}、${opts[i].optionContent}`;
         // let label = `${i + 1}、${opts[i].optionContent}`;
         let label = `${opts[index].optionContent}`;
         let label = `${opts[index].optionContent}`;
-        for(var openIndex = 0; openIndex < openList.length; openIndex++){
-          if (openList[openIndex]&&openList[openIndex].selectedIndex == index && opts[index].open && openList[openIndex].selectedValue) {
+        for (var openIndex = 0; openIndex < openList.length; openIndex++) {
+          if (
+            openList[openIndex] &&
+            openList[openIndex].selectedIndex == index &&
+            opts[index].open &&
+            openList[openIndex].selectedValue
+          ) {
             label = label + "(" + openList[openIndex].selectedValue + ")";
             label = label + "(" + openList[openIndex].selectedValue + ")";
-          } 
+          }
         }
         }
         let value = index.toString();
         let value = index.toString();
         Vue.set(opts[index], "label", label);
         Vue.set(opts[index], "label", label);
         Vue.set(opts[index], "value", value);
         Vue.set(opts[index], "value", value);
       }
       }
       return opts;
       return opts;
-    },
+    }
   },
   },
   watch: {
   watch: {
     questionHEAD() {
     questionHEAD() {
@@ -437,18 +442,22 @@ export default {
         // 多选
         // 多选
         let isUnselect = this.lastCheckList.length > index.length;
         let isUnselect = this.lastCheckList.length > index.length;
 
 
-        if (isUnselect){
+        if (isUnselect) {
           // 取消选中,先判断取消选中的是哪个index,然后在判断开放选项中是否有取消选择的,将其删除掉
           // 取消选中,先判断取消选中的是哪个index,然后在判断开放选项中是否有取消选择的,将其删除掉
           let unselectItem;
           let unselectItem;
-          for(var item in this.lastCheckList){
-            if (index.indexOf(this.lastCheckList[item])<0) {
-                unselectItem = this.lastCheckList[item]
-              }
+          for (var item in this.lastCheckList) {
+            if (index.indexOf(this.lastCheckList[item]) < 0) {
+              unselectItem = this.lastCheckList[item];
+            }
           }
           }
-          for(var oIndex =0; oIndex<this.selectedOpenList.length; oIndex++){
-              if(this.selectedOpenList[oIndex].selectedIndex == unselectItem){
-                this.selectedOpenList.splice(oIndex,1);
-              }
+          for (
+            var oIndex = 0;
+            oIndex < this.selectedOpenList.length;
+            oIndex++
+          ) {
+            if (this.selectedOpenList[oIndex].selectedIndex == unselectItem) {
+              this.selectedOpenList.splice(oIndex, 1);
+            }
           }
           }
         }
         }
         if (!isUnselect) {
         if (!isUnselect) {
@@ -465,7 +474,7 @@ export default {
         }
         }
       } else if (_type == "string") {
       } else if (_type == "string") {
         selectedOpt = this.questionOptions[index];
         selectedOpt = this.questionOptions[index];
-        this.selectedOpenList.splice(0,1);
+        this.selectedOpenList.splice(0, 1);
       }
       }
 
 
       // 处理开放选项
       // 处理开放选项
@@ -473,32 +482,85 @@ export default {
         this.$prompt(selectedOpt.openOptionTips, "请填写", {
         this.$prompt(selectedOpt.openOptionTips, "请填写", {
           confirmButtonText: "确定",
           confirmButtonText: "确定",
           cancelButtonText: "取消",
           cancelButtonText: "取消",
-          customClass: "select-open-dialog",
+          customClass: "select-open-dialog"
         }).then(({ value }) => {
         }).then(({ value }) => {
           console.log(`Dialog value: ${value}, `);
           console.log(`Dialog value: ${value}, `);
-          this.$set(this.selectedOpenList, this.selectedOpenList.length ,{
-            selectedIndex : selectedOpt.value,
-            selectedValue : value
-          })
+          this.$set(this.selectedOpenList, this.selectedOpenList.length, {
+            selectedIndex: selectedOpt.value,
+            selectedValue: value
+          });
           this.answerNote[selectedOpt.id] = value;
           this.answerNote[selectedOpt.id] = value;
         });
         });
       }
       }
     },
     },
+    autoSelect() {
+      // 后退或者继续时,如果下一道题已经填写过,则自动加载答案
+      let lastQuestionId = this.questionaire.questions[this.questionHEAD].id;
+      let lastAnswer = this.answers[lastQuestionId];
+      if (
+        this.questionaire.questions[this.questionHEAD].type == 1 &&
+        this.questionaire.questions[this.questionHEAD].maxOptions == 1
+      ) {
+        // 返回的是单选题
+        for (var i in this.questionOptions) {
+          if (this.questionOptions[i].id == lastAnswer.answer) {
+            this.selectedSingle = i;
+            if (lastAnswer.answerNote) {
+              // 如果有开放选项内容,再添加内容
+              this.$set(this.selectedOpenList, this.selectedOpenList.length, {
+                selectedIndex: i,
+                selectedValue: lastAnswer.answerNote
+              });
+            }
+            break;
+          }
+        }
+      } else if (
+        this.questionaire.questions[this.questionHEAD].type == 1 &&
+        this.questionaire.questions[this.questionHEAD].maxOptions > 1
+      ) {
+        // 返回的是多选题
+        let idList = lastAnswer.answer.split(",");
+        let lastAnswerNote = JSON.parse(lastAnswer.answerNote);
+        for (var idIndex in idList) {
+          for (var i in this.questionOptions) {
+            if (this.questionOptions[i].id == idList[idIndex]) {
+              if (idList[idIndex] in lastAnswerNote) {
+                let optId = idList[idIndex];
+                // let optNote = lastAnswerNote. optId;
+                this.$set(this.selectedOpenList, this.selectedOpenList.length, {
+                  selectedIndex: i,
+                  selectedValue: lastAnswerNote[optId]
+                });
+              }
+              this.selectedMultiple.push(i);
+              break;
+            }
+          }
+        }
+      } else {
+        this.answerValue = lastAnswer.answer;
+      }
+      if (this.currentQuestion.type == 1 && lastAnswer.answerNote) {
+        this.answerNote[lastAnswer.answer] = lastAnswer.answerNote;
+      }
+    },
     onQuestionLoaded(isBack) {
     onQuestionLoaded(isBack) {
       console.log("call onQuestionLoaded");
       console.log("call onQuestionLoaded");
       if (isBack) {
       if (isBack) {
-        let lastQuestionId = this.questionaire.questions[this.questionHEAD].id;
-        let lastAnswer = this.answers[lastQuestionId];
-        this.answerValue = lastAnswer.answer;
-        if (this.currentQuestion.type == 1 && lastAnswer.answerNote) {
-          this.answerNote[lastAnswer.answer] = lastAnswer.answerNote;
-        }
-        delete this.answers[lastQuestionId];
+        this.autoSelect();
+        // delete this.answers[lastQuestionId];
       } else {
       } else {
-        this.answerValue = "";
-        this.answerNote = {};
-        this.selectedSingle = "";
-        this.selectedMultiple = [];
+        let curQuestionId = this.questionaire.questions[this.questionHEAD].id;
+        let curAnswer = this.answers[curQuestionId];
+        if (curAnswer) {
+          this.autoSelect();
+        } else {
+          this.answerValue = "";
+          this.answerNote = {};
+          this.selectedSingle = "";
+          this.selectedMultiple = [];
+        }
       }
       }
 
 
       // 根据题目类型,动态展示对应的答题方式
       // 根据题目类型,动态展示对应的答题方式
@@ -539,11 +601,13 @@ export default {
       if (this.currentQuestion.type == 1) {
       if (this.currentQuestion.type == 1) {
         if (this.questionType == "单选题") {
         if (this.questionType == "单选题") {
           if (this.selectedSingle) {
           if (this.selectedSingle) {
-            selectionIds.push(this.questionOptions[this.selectedSingle].id);
+            selectionIds.pushNoRepeat(
+              this.questionOptions[this.selectedSingle].id
+            );
           }
           }
         } else {
         } else {
           for (let i = 0; i < this.selectedMultiple.length; i++) {
           for (let i = 0; i < this.selectedMultiple.length; i++) {
-            selectionIds.push(
+            selectionIds.pushNoRepeat(
               this.questionOptions[this.selectedMultiple[i]].id
               this.questionOptions[this.selectedMultiple[i]].id
             );
             );
           }
           }
@@ -563,9 +627,12 @@ export default {
           alert(`最少需选中${this.currentQuestion.minOptions}项`);
           alert(`最少需选中${this.currentQuestion.minOptions}项`);
           return;
           return;
         }
         }
-        for(let index in this.selectedOpenList){
-          if(this.selectedOpenList[index].selectedIndex && !this.selectedOpenList[index].selectedValue ){
-            alert("请填写开放性选项答案")
+        for (let index in this.selectedOpenList) {
+          if (
+            this.selectedOpenList[index].selectedIndex &&
+            !this.selectedOpenList[index].selectedValue
+          ) {
+            alert("请填写开放性选项答案");
             return;
             return;
           }
           }
         }
         }

+ 9 - 0
src/main.js

@@ -13,6 +13,15 @@ Vue.use(ElementUI);
 Vue.config.productionTip = false;
 Vue.config.productionTip = false;
 Vue.prototype.$baseUrl = process.env.ROOT_API;
 Vue.prototype.$baseUrl = process.env.ROOT_API;
 
 
+Array.prototype.pushNoRepeat = function(){
+    for(var i=0; i<arguments.length; i++){
+      var ele = arguments[i];
+      if(this.indexOf(ele) == -1){
+          this.push(ele);
+      }
+  }
+}; 
+
 axios.interceptors.response.use(function (response) {
 axios.interceptors.response.use(function (response) {
     // Do something with response data
     // Do something with response data
     return response;
     return response;