问卷

src/pages/activity/activity-type.vue

@@ -62,16 +62,15 @@
                 <ul>
                   <div class="ques-title">题目</div>
                   <li
-                    v-for="(question, index) in questionnaireList"
+                    v-for="(item, index) in question"
                     :key="index"
                     :class="{
                       selected:
-                        question.type === 'single'
-                          ? !!question.answer
-                          : !!question.answer && question.answer.length,
+                        item.type === 'radio'
+                          ? !!item.Answer
+                          : !!item.Answer && item.Answer.length,
                     }"
                   >
-                  <!-- :href="`/#/activity-type/#${question.id}?type=satisfaction`" -->
                     <a>
                       {{ index + 1 }}
                     </a>
@@ -156,54 +155,52 @@
             </div>
             <!-- 问卷调查 -->
             <div class="satisfaction" v-show="activityType === 'satisfaction'">
-              <div class="s-title">大理市博物馆观众调查问卷</div>
+              <div class="s-title">{{entity.name}}</div>
               <div class="s-des">
                 为了更好地发挥大理市博物馆在宣传展示和社会服务方面的作用，我们希望能够通过您对这些问题的回答，提高我们的工作质量，我们会认真考虑您的意见和建议。非常感谢您对我们工作的配合和支持！
               </div>
               <ul>
-                <li v-for="(question, index) in questionnaireList" :key="index">
+                <li v-for="(item, index) in question" :key="index">
                   <div class="line"></div>
                   <div class="question">
                     <div class="q-title">
-                      {{ index + 1 }}. {{ question.title
-                      }}{{ question.type === "multiple" ? `(可多选)` : `` }}:
+                      {{ index + 1 }}. {{ item.question
+                      }}{{ item.type === "multiple" ? `(可多选)` : `` }}:
                       <span
-                        v-if="question.type === 'multiple'"
+                        v-if="item.type === 'multiple'"
                         v-html="`<br>`"
                       ></span>
                     </div>
                     <ul class="q-answer">
                       <!-- 单选 -->
-                      <div class="single" v-if="question.type === 'single'">
-                        <li
-                          v-for="(choose, optionIndex) in question.chooseList"
-                          :key="optionIndex"
-                        >
+                      <div class="single" v-if="item.type === 'radio'">
+                        <li v-for="(choose, optionIndex) in item.answer"
+                          :key="optionIndex">
                         <!-- :id="`${question.id}`" -->
                           <a>
                             <input
                               type="radio"
-                              v-model="question.answer"
-                              :value="choose"
+                              v-model="item.Answer"
+                              :value="choose.value"
                             />
-                            <label>{{ choose }}</label>
+                            <label>{{ choose.value }}</label>
                           </a>
                         </li>
                       </div>
                       <!-- 多选题 -->
-                      <ul class="multiple" v-if="question.type === 'multiple'">
+                      <ul class="multiple" v-if="item.type === 'multiple'">
                         <li
-                          v-for="(choose, optionIndex) in question.chooseList"
+                          v-for="(choose, optionIndex) in item.answer"
                           :key="optionIndex"
                         >
                         <!-- :id="`${question.id}`" -->
                           <a>
                             <input
                               type="checkbox"
-                              :value="choose"
-                              v-model="question.answer"
+                              :value="choose.value"
+                              v-model="item.Answer"
                             />
-                            <label>{{ choose }}</label>
+                            <label>{{ choose.value }}</label>
                           </a>
                         </li>
                       </ul>
@@ -250,6 +247,7 @@ export default {
       typeChange: {
         onLine: "online",
         volunteer: "volunteer",
+        satisfaction:'satisfaction'
       },
       questionnaireList: [
         {
@@ -368,6 +366,8 @@ export default {
       name: "",
       phone: "",
       questionComplete: false,
+      entity:{},
+      question:[]
     };
   },
   //监听属性 类似于data概念
@@ -389,6 +389,19 @@ export default {
       });
       this.dataList = result.data.list;
       this.paging.total = result.data.total;
+      console.log('this.dataList',this.dataList)
+    },
+    async getQuestion() {
+      let result = await this.$http({
+        method: "get",
+        url: "/api/web/questionGroup/getIndex"
+      });
+      console.log('result',result)
+     this.entity = result && result['data'] && result['data']['entity'];
+     this.question = result && result['data'] && result['data']['question'];
+     this.question = this.question.map(item=>{
+       return {...item,answer:JSON.parse(item.answer),Answer:item.type === 'multiple'? []:''}
+     })
     },
     switchType(type) {
       this.activityType = type;
@@ -397,6 +410,8 @@ export default {
       this.paging.current = 1;
       if (type != "satisfaction") {
         this.getList();
+      } else {
+        this.getQuestion()
       }
     },
     back() {
@@ -415,14 +430,13 @@ export default {
       });
     },
     save() {
-      console.log("this.questionnaireList", this.questionnaireList);
-      this.questionnaireList.forEach((item) => {
-        if (item.type === "single" && !item.answer) {
+      this.question.forEach((item) => {
+        if (item.type === "radio" && !item.Answer) {
           this.questionComplete = true;
         }
         if (
-          (item.type === "mutiple" && !item.answer) ||
-          (!!item.answer && item.answer.length === 0)
+          (item.type === "multiple" && !item.Answer) ||
+          (!!item.Answer && item.Answer.length === 0)
         ) {
           this.questionComplete = true;
         }
@@ -447,7 +461,10 @@ export default {
     this.activityType =
       (this.$route.query && this.$route.query["type"]) || "onLine";
     this.params["type"] = this.typeChange[this.activityType];
-    if (!this.params["type"]) return;
+    if (this.params["type"] === 'satisfaction') {
+      this.getQuestion()
+      return;
+    } 
     this.getList();
   },
   //生命周期 - 挂载完成（可以访问DOM元素）