页面修改

src/api/question/questionconfig.js

@@ -68,6 +68,21 @@ export function CreateQuestion(questionKey) {
         Content: ""
       })
       break;
+      //资料题
+    case "data-question":
+      AnswerList.push({
+        Content: ""
+      })
+      break;
+      //连线题
+    case "matching":
+        var array1=[{Name:"1",Content:""}];
+        var array2=[{Name:"A",Content:""}];
+        var array3=[{Name:"1",Content:"A"}];
+        AnswerList.push(array1);
+        AnswerList.push(array2);
+        AnswerList.push(array3);
+      break;
   }
   return AnswerList;
 }

src/components/question/question-form.vue

@@ -45,9 +45,12 @@
           <short-answer v-if="questionObj.Key=='short-answer'||questionObj.Key=='noun-explanation'||questionObj.Key=='essay-question'
             ||questionObj.Key=='calculation'
             " :setOption="objOption"> </short-answer>
-          <!--分录题-->
-          <entry-problem v-if="questionObj.Key=='entry-problem'" :questionData="AnswerList" @getChild="getChildData">
+          <!--分录题、资料题-->
+          <entry-problem v-if="questionObj.Key=='entry-problem'|| questionObj.Key=='data-question'"
+            :questionData="AnswerList" @getChild="getChildData">
           </entry-problem>
+          <!--连线题-->
+          <matching v-if="questionObj.Key=='matching'" :questionData="AnswerList" @getChild="getChildData"></matching>
           <br />
           <div class="col-12">
             答案解析<UeEditor v-model="objOption.AnswerParse" :config="config" ref="AnswerParse"></UeEditor>
@@ -103,6 +106,7 @@
   import judge from '../questiontype/judge'
   import shortAnswer from '../questiontype/short-answer'
   import entryProblem from '../questiontype/entry-problem'
+  import matching from '../questiontype/matching'
   export default {
     components: {
       UeEditor,
@@ -113,6 +117,7 @@
       judge, //判断题
       shortAnswer, //简答题
       entryProblem, //分录题
+      matching, //连线题
     },
     props: {
       setingObj: {
@@ -207,6 +212,7 @@
       },
       //题型点击
       onItemClick(item) {
+        this.AnswerList = [];
         this.questionObj = item;
         this.objOption.QuestionTypeId = item.QId;
         this.objOption.QuestionTypeKey = item.Key;

src/components/questiontype/matching.vue

+<!--连线题-->
+<style>
+
+</style>
+<template>
+  <div class="matchingQuestion">
+    <span>第一组</span>
+    <table v-if="data&&data.length>0">
+      <tr v-for="(item,index) in data[0]">
+        <td>
+          {{item.Name}}
+        </td>
+        <td>
+          <UeEditor v-model="item.Content" :config="config"></UeEditor>
+        </td>
+        <td>
+          <a style="cursor:pointer;" @click="deleteOpion(0,index)">删除</a>
+        </td>
+      </tr>
+      <tfoot>
+        <tr>
+          <td colspan="3">
+            <a style="cursor:pointer;" @click="addOption(0)">添加选项</a>
+          </td>
+        </tr>
+      </tfoot>
+    </table>
+    <span>第二组</span>
+    <table v-if="data&&data.length>1">
+      <tr v-for="(item,index) in data[1]">
+        <td>
+          {{item.Name}}
+        </td>
+        <td>
+          <UeEditor v-model="item.Content" :config="config"></UeEditor>
+        </td>
+        <td>
+          <a style="cursor:pointer;" @click="deleteOpion(0,index)">删除</a>
+        </td>
+      </tr>
+      <tfoot>
+        <tr>
+          <td colspan="3">
+            <a style="cursor:pointer;" @click="addOption(1)">添加选项</a>
+          </td>
+        </tr>
+      </tfoot>
+    </table>
+    <span>答案</span>
+    <table v-if="data&&data.length>2">
+      <tr v-for="(item,index) in data[2]">
+        <td>
+          {{item.Name}}
+        </td>
+        <td>
+          -----
+        </td>
+        <td>
+          {{data[1]}}
+          <el-select v-model="item.Content">
+            <el-option v-for="(cItem,cIndex) in data[1]" :key="cIndex" :label="cItem.Name" :value="cItem.Name">
+            </el-option>
+          </el-select>
+        </td>
+      </tr>
+    </table>
+  </div>
+</template>
+<script>
+  import {
+    getOptionList, //获取选择标签【A,B,C,D....】
+  } from '../../api/question/questionconfig'
+  import UeEditor from '../editor/UeEditor'
+  export default {
+    props: {
+      questionData: {
+        type: Array,
+      },
+    },
+    components: {
+      UeEditor
+    },
+    data() {
+      return {
+        data: this.questionData,
+        config: {
+          initialFrameWidth: null,
+          initialFrameHeight: 80,
+        },
+        optionTitleList: [],
+      };
+    },
+    created() {
+      this.initConfig();
+    },
+    methods: {
+      initConfig() {
+        this.optionTitleList = getOptionList();
+      },
+      //删除选项
+      deleteOpion(index, subIndex) {
+        this.data[index].splice(subIndex, 1);
+        this.calcOptionTitle();
+      },
+      //新增选项
+      addOption(index) {
+        if (index == 0) {
+          this.data[2].push({
+            Name: "",
+            Content: "A",
+          });
+        }
+        this.data[index].push({
+          Name: "",
+          Content: "",
+        });
+        this.calcOptionTitle();
+      },
+      //重新计算选择Title[A,B,C,D....]
+      calcOptionTitle() {
+        if (this.data && this.data.length > 0) {
+          this.data.forEach((item, index) => {
+            item.forEach((subItem, subIndex) => {
+              if (index == 0 || index == 2) {
+                subItem.Name = subIndex + 1;
+              } else if (index == 1) {
+                subItem.Name = this.optionTitleList[subIndex];
+              }
+            })
+          })
+        }
+      },
+      //返回数据到父组件
+      returnDataToParent() {
+        this.$emit('getChild', this.data);
+      },
+    },
+    mounted() {
+
+    },
+    watch: {
+      data: {
+        handler(newValue) {
+          this.returnDataToParent();
+        },
+        deep: true
+      },
+    }
+  };
+
+</script>