排序及自我介绍

src/components/Adult/common/SelfAssessmentModule.vue

@@ -0,0 +1,136 @@
+<!--  -->
+<template>
+  <div class="Big-Book-single">
+    <div class="Big-Book-content m">
+      <div class="Big-Book-main">
+        <div class="adult-book-input-item">
+          <span class="adult-book-lable">选项内容：</span>
+          <el-input
+            class="adult-book-input"
+            :autosize="{ minRows: 2 }"
+            type="textarea"
+            placeholder="请输入内容"
+            v-model="curQueItem.con"
+            @blur="curQueItem.con = curQueItem.con.trim()"
+          ></el-input>
+          <el-checkbox
+            style="margin-left: 7px"
+            @change="changeIsAnswer"
+            v-model="curQueItem.isAnswer"
+            :label="index"
+            >答案</el-checkbox
+          >
+          <!-- <div class=""></div> -->
+          <img
+            @click="deleteOption"
+            class="close"
+            src="../../../assets/adult/del-close.png"
+            alt=""
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Upload from "./Upload.vue";
+import "@/utils/pinyin_dict_withtone";
+import "@/utils/pinyinUtil";
+export default {
+  components: {
+    Upload,
+  },
+  props: ["curQueItem", "index", "changAnswer", "deleteOptionOne", "type"],
+  data() {
+    return {
+      imgNumber: 10,
+      mp3Number: 10,
+      fileCon: {
+        timu_img_list: [],
+        timu_mp3_list: [],
+        img_list: [],
+        mp3_list: [],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    //   删除当前选项
+    deleteOption() {
+      this.$confirm("确定要删除此选项吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        this.deleteOptionOne(this.index);
+      });
+    },
+    //   修改正确答案
+    changeIsAnswer() {
+      this.changAnswer(this.index);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {
+    if (this.curQueItem) {
+      this.fileCon.img_list = this.curQueItem.img_list;
+      this.fileCon.mp3_list = this.curQueItem.mp3_list;
+    }
+  },
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scoped>
+//@import url(); 引入公共css类
+.Big-Book-single {
+  .Big-Book-content {
+    &.m {
+      display: flex;
+      justify-content: flex-start;
+      align-items: flex-start;
+    }
+    .Big-Book-con {
+      display: flex;
+      align-items: center;
+    }
+    .Big-Book-title {
+      font-size: 16px;
+      line-height: 40px;
+      color: #000;
+      margin-right: 15px;
+    }
+    .Big-Book-main {
+      position: relative;
+      width: 100%;
+      > div {
+        margin-bottom: 10px;
+        &.Big-Book-pinyin,
+        &.Big-Book-con,
+        &.Big-Book-en {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+        }
+      }
+      .close {
+        position: relative;
+        top: -4px;
+        cursor: pointer;
+        width: 24px;
+        height: 24px;
+      }
+    }
+  }
+}
+</style>

src/components/Adult/common/data3.js

@@ -92,6 +92,10 @@ let fnData = [{
         name: "多选题",
     },
     {
+        type: "checkbox_self_assessment_chs",
+        name: "自我评估"
+    },
+    {
         type: "judge",
         name: "判断题",
         data_structure: {
@@ -706,6 +710,10 @@ let fnData = [{
         type: "drag_chs",
         name: "拖拽",
     },
+    {
+        type: "sort_chs",
+        name: "排序"
+    },
 ]
 
 

src/components/Adult/inputModules/SelfAssessment.vue

@@ -0,0 +1,175 @@
+<!--  -->
+<template>
+  <div class="Big-Book-Single" v-if="curQue">
+    <div
+      class="Big-Book-Single-content"
+      style="margin-left: 20px; margin-top: 20px"
+    >
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">标题：</span>
+        <el-input
+          class="adult-book-input"
+          :autosize="{ minRows: 2 }"
+          type="textarea"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="curQue.title = curQue.title.trim()"
+        ></el-input>
+      </div>
+      <div
+        class="Big-Book-main"
+        v-for="(item, index) in curQue.option"
+        :key="item + index"
+        style="border-bottom: 1px #ccc solid; margin-bottom: 20px"
+      >
+        <SelfAssessmentModule
+          :curQueItem="item"
+          :index="index"
+          :changAnswer="changAnswer"
+          :deleteOptionOne="deleteOptionOne"
+          :type="type"
+        />
+      </div>
+      <div class="addoption" @click="addOption(toIndex)">添加一个选项</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import SelfAssessmentModule from "../common/SelfAssessmentModule.vue";
+import Upload from "../common/Upload.vue";
+
+export default {
+  name: "Single",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    SelfAssessmentModule,
+    Upload,
+  },
+  data() {
+    return {
+      form: {
+        stem: {
+          con: "",
+          pinyin: "",
+          english: "",
+          highlight: "",
+          underline: "",
+          img_url: [],
+          mp3_url: [],
+        },
+      },
+      imgNumber: 1,
+      mp3Number: 1,
+      data_structure: {
+        type: "checkbox_self_assessment_chs",
+        name: "自我评估",
+        title: "",
+        option: [
+          {
+            con: "",
+            isAnswer: "",
+          },
+          {
+            con: "",
+            isAnswer: "",
+          },
+        ],
+        correct: [],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    // 修改正确选项中得某一个为正确答案
+    changAnswer(index) {
+      let arr = [];
+      this.curQue.option.forEach((item, i) => {
+        if (index == i && item.isAnswer != "") {
+          this.curQue.correct.push(i);
+        } else if (index == i && item.isAnswer == "") {
+          this.curQue.correct.splice(i, 1);
+        }
+      });
+    },
+    // 删除其中一个选项
+    deleteOptionOne(index) {
+      if (this.curQue.option.length <= 2) {
+        this.$message.warning("至少要保留两个选项");
+        return;
+      }
+      this.curQue.option.splice(index, 1);
+    },
+    //添加一个选项
+    addOption(index) {
+      let obj = JSON.parse(JSON.stringify(this.data_structure[0].option[0]));
+      this.curQue[index].option.push(obj);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      this.changeCurQue(this.data_structure);
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scope>
+//@import url(); 引入公共css类
+.Big-Book-Single {
+  &-content {
+    &.m {
+      display: flex;
+      justify-content: flex-start;
+      align-items: flex-start;
+    }
+
+    .Big-Book-title {
+      font-size: 16px;
+      line-height: 40px;
+      color: #000;
+      margin-right: 15px;
+    }
+    .Big-Book-main {
+      > div {
+        margin-bottom: 10px;
+        &.Big-Book-pinyin {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+        }
+      }
+    }
+  }
+  .addoption {
+    width: 565px;
+    height: 40px;
+    left: 40px;
+    top: 304px;
+    background: #f3f3f3;
+    border: 1px dashed rgba(0, 0, 0, 0.15);
+    box-sizing: border-box;
+    border-radius: 4px;
+    text-align: center;
+    line-height: 40px;
+    cursor: pointer;
+  }
+  .close {
+    width: 24px;
+    cursor: pointer;
+  }
+}
+</style>
+<style lang="scss">
+</style>

src/components/Adult/inputModules/Sentence.vue

@@ -182,6 +182,7 @@ export default {
   //方法集合
   methods: {
     createWordTime() {
+      this.curQue.detail = [];
       this.curQue.option.forEach((item) => {
         this.curQue.detail.push(item.detail);
       });

src/components/Adult/inputModules/Sort.vue

@@ -0,0 +1,253 @@
+<!--  -->
+<template>
+  <div class="Big-Book-Single" v-if="curQue">
+    <div
+      class="Big-Book-Single-content"
+      style="margin-left: 20px; margin-top: 20px"
+    >
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">标题：</span>
+        <el-input
+          class="adult-book-input"
+          :autosize="{ minRows: 2 }"
+          type="textarea"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="curQue.title = curQue.title.trim()"
+        ></el-input>
+      </div>
+      <div
+        class="Big-Book-main"
+        v-for="(item, index) in curQue.option"
+        :key="item + index"
+        style="border-bottom: 1px #ccc solid; margin-bottom: 20px"
+      >
+        <div class="NPC-sentence-Segword" style="position: relative">
+          <SentenceSegwordChs :curQue="item.detail" />
+          <img
+            style="position: absolute; right: 330px; top: 37px"
+            @click="deleteOption(index)"
+            class="close"
+            src="../../../assets/adult/del-close.png"
+            alt=""
+          />
+        </div>
+        <div v-if="item.detail">
+          <div
+            v-for="(fc, fcIndex) in item.detail.wordsList"
+            :key="'fc' + fcIndex"
+          >
+            <div class="fccontent">
+              <template v-if="item.detail.pyPosition == 'top'">
+                <div>
+                  <p>{{ fc.pinyin }}</p>
+                  <p>{{ fc.chs }}</p>
+                </div>
+              </template>
+              <template v-else>
+                <div>
+                  <p>{{ fc.chs }}</p>
+                  <p>{{ fc.pinyin }}</p>
+                </div>
+              </template>
+            </div>
+            <div style="display: flex">
+              <div class="up" @click="upMove(index, fcIndex)">向上移</div>
+              <div class="down" @click="downMove(index, fcIndex)">向下移</div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="addoption" @click="addOption">添加一题</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Upload from "../common/Upload.vue";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
+
+export default {
+  name: "Single",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    Upload,
+    SentenceSegwordChs,
+  },
+  data() {
+    return {
+      form: {
+        stem: {
+          con: "",
+          pinyin: "",
+          english: "",
+          highlight: "",
+          underline: "",
+          img_url: [],
+          mp3_url: [],
+        },
+      },
+      imgNumber: 1,
+      mp3Number: 1,
+      data_structure: {
+        type: "sort_chs",
+        name: "排序",
+        title: "",
+        option: [
+          {
+            detail: {
+              pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+              sentence: "", //句子
+              segList: [], //分词结果
+              seg_words: "",
+              wordsList: [],
+            },
+            correctWordsList: [], //正确的list
+          },
+        ],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    //   向上移动
+    upMove(opIndex, index) {
+      if (this.curQue.option[opIndex].correctWordsList.length < 1) {
+        this.curQue.option[opIndex].correctWordsList =
+          this.curQue.option[opIndex].detail.wordsList;
+      }
+      if (index > 0) {
+        let obj = this.curQue.option[opIndex].detail.wordsList[index - 1];
+        this.curQue.option[opIndex].detail.wordsList[index - 1] =
+          this.curQue.option[opIndex].detail.wordsList[index];
+        this.curQue.option[opIndex].detail.wordsList[index] = obj;
+        this.$forceUpdate();
+      } else {
+        this.$message.warning("当前已经是第一个");
+        return;
+      }
+    },
+    // 向下移动
+    downMove(opIndex, index) {
+      if (this.curQue.option[opIndex].correctWordsList.length < 1) {
+        this.curQue.option[opIndex].correctWordsList =
+          this.curQue.option[opIndex].detail.wordsList;
+      }
+      if (index + 1 >= this.curQue.option[opIndex].detail.wordsList.length) {
+        this.$message.warning("当前已经是最后一个");
+        return;
+      } else {
+        let obj = this.curQue.option[opIndex].detail.wordsList[index + 1];
+        this.curQue.option[opIndex].detail.wordsList[index + 1] =
+          this.curQue.option[opIndex].detail.wordsList[index];
+        this.curQue.option[opIndex].detail.wordsList[index] = obj;
+        this.$forceUpdate();
+      }
+    },
+    // 删除其中一个选项
+    deleteOption(index) {
+      if (this.curQue.option.length <= 1) {
+        this.$message.warning("至少要保留1个问题");
+        return;
+      }
+      this.curQue.option.splice(index, 1);
+    },
+    //添加一个选项
+    addOption(index) {
+      let obj = JSON.parse(JSON.stringify(this.data_structure.option[0]));
+      this.curQue.option.push(obj);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      this.changeCurQue(this.data_structure);
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scope>
+//@import url(); 引入公共css类
+.Big-Book-Single {
+  &-content {
+    &.m {
+      display: flex;
+      justify-content: flex-start;
+      align-items: flex-start;
+    }
+
+    .Big-Book-title {
+      font-size: 16px;
+      line-height: 40px;
+      color: #000;
+      margin-right: 15px;
+    }
+    .Big-Book-main {
+      > div {
+        margin-bottom: 10px;
+        &.Big-Book-pinyin {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+        }
+      }
+    }
+  }
+  .addoption {
+    width: 565px;
+    height: 40px;
+    left: 40px;
+    top: 304px;
+    background: #f3f3f3;
+    border: 1px dashed rgba(0, 0, 0, 0.15);
+    box-sizing: border-box;
+    border-radius: 4px;
+    text-align: center;
+    line-height: 40px;
+    cursor: pointer;
+  }
+  .close {
+    width: 24px;
+    cursor: pointer;
+  }
+  .down,
+  .up {
+    margin-left: 15px;
+    width: 150px;
+    height: 40px;
+    background: #f3f3f3;
+    border: 1px dashed rgba(0, 0, 0, 0.15);
+    box-sizing: border-box;
+    border-radius: 4px;
+    text-align: center;
+    line-height: 40px;
+    cursor: pointer;
+  }
+  .fccontent {
+    margin: 15px 0;
+    width: 82px;
+    height: 70px;
+    background: #e6e6e6;
+    border-radius: 8px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    p {
+      margin: 0;
+    }
+  }
+}
+</style>
+<style lang="scss">
+</style>

src/views/adultInput3.vue

@@ -381,6 +381,30 @@
                       </template>
                       <template v-else> </template>
                     </template>
+                    <template
+                      v-if="topicIitem.type == 'checkbox_self_assessment_chs'"
+                    >
+                      <template v-if="topicIitem.is_edit">
+                        <SelfAssessment
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
+                    <template v-if="topicIitem.type == 'sort_chs'">
+                      <template v-if="topicIitem.is_edit">
+                        <Sort
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
                   </div>
                   <div
                     class="addoption"
@@ -508,6 +532,8 @@ import ZiLine from "@/components/Adult/inputModules/ZiLine.vue";
 import SelectInpue from "@/components/Adult/inputModules/SelectInpue.vue";
 import PlayInputReacord from "@/components/Adult/inputModules/PlayInputReacord.vue";
 import Drag from "@/components/Adult/inputModules/Drag.vue";
+import SelfAssessment from "@/components/Adult/inputModules/SelfAssessment.vue";
+import Sort from "@/components/Adult/inputModules/Sort.vue";
 
 
 import Textdes from "@/components/Adult/inputModules/Textdes.vue";
@@ -581,6 +607,8 @@ export default {
     SelectInpue,
     PlayInputReacord,
     Drag,
+    SelfAssessment,
+    Sort,
   },
   data() {
     return {