修改录入的问题及字段 分词 录音控件的单独选择

src/components/Adult/common/data.js

@@ -429,20 +429,6 @@ let fnData = [{
                 name: "录音控件-promax",
             },
         ],
-        data_structure: {
-            type: 'record_control',
-            name: "录音控件",
-            option: [{
-                hanzi: '',
-                pinyin: '',
-                mp3_list: [],
-                img_list: [],
-                isAnswer: '',
-                isChecked: '',
-                isJudge: '',
-                correctInput: '',
-            }],
-        },
     },
     {
         type: "pure_input",
@@ -793,6 +779,10 @@ let fnData = [{
         type: "sort_chs",
         name: "排序"
     },
+    {
+        type: "CourseStart_chs",
+        name: "封面",
+    },
 ]
 
 

src/components/Adult/inputModules/CourseStart.vue

@@ -0,0 +1,206 @@
+<!--  -->
+<template>
+  <div class="Big-Book-sentence" 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-radio-group v-model="curQue.titleType">
+          <el-radio label="cn">中文</el-radio>
+          <el-radio label="en">英文</el-radio>
+        </el-radio-group>
+      </div>
+      <div class="adult-book-input-item" v-if="curQue.titleType">
+        <span class="adult-book-lable">标题：</span>
+        <el-input
+          class="adult-book-input"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="onBlur(curQue, 'title')"
+        ></el-input>
+      </div>
+      <div>
+        <SentenceSegwordChs :curQue="curQue.detail" />
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">英文：</span>
+        <el-input
+          class="adult-book-input"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入英文"
+          v-model="curQue.en"
+          @blur="onBlur(curQue, 'en')"
+        ></el-input>
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">内容：</span>
+        <el-input
+          class="adult-book-input"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入内容"
+          v-model="curQue.con"
+          @blur="onBlur(curQue, 'con')"
+        ></el-input>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Upload from "../common/Upload";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
+export default {
+  name: "Single",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    Upload,
+    SentenceSegwordChs,
+  },
+  data() {
+    return {
+      data_structure: {
+        type: "CourseStart_chs",
+        name: "封面",
+        title: "",
+        titleType: "",
+        en: "",
+        con: "",
+        detail: {
+          type: "detail",
+          pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+          sentence: "", //句子
+          segList: [], //分词结果
+          seg_words: "",
+          wordsList: [],
+        },
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {},
+  //生命周期 - 创建完成（可以访问当前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-sentence {
+  &-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;
+        }
+      }
+    }
+  }
+
+  .Big-Book-addrole {
+    > div {
+      width: 300px;
+      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;
+    }
+  }
+  .Big-Book-more {
+    .Big-Book-more-text {
+      position: relative;
+      text-align: center;
+    }
+    .Big-Book-more-text:before,
+    .Big-Book-more-text:after {
+      position: absolute;
+      background: #ccc;
+      content: "";
+      height: 1px;
+      top: 50%;
+      width: 45%;
+    }
+    .Big-Book-more-text:before {
+      left: 10px;
+    }
+    .Big-Book-more-text:after {
+      right: 10px;
+    }
+    .Big-Book-more-main {
+      display: flex;
+      > :not(:nth-child(1)) {
+        margin-left: 30px;
+      }
+    }
+  }
+  .Big-Book-con {
+    display: flex;
+    align-items: center;
+  }
+}
+.lrc-box {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  > span {
+    font-size: 14px;
+    margin-right: 16px;
+  }
+}
+.close {
+  width: 24px;
+  cursor: pointer;
+}
+.addoption {
+  width: 200px;
+  height: 40px;
+  margin-bottom: 15px;
+  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;
+}
+</style>
+<style lang="scss">
+</style>

src/components/Adult/inputModules/InputRecord.vue

@@ -5,16 +5,8 @@
       src="../../../assets/adult/maikefeng-red.png"
       class="Big-Book-Record-icon"
     /> -->
-    <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>
+      <SentenceSegwordChs :curQue="curQue.detail" />
     </div>
     <div
       class="Big-Book-hanzi-option"
@@ -35,16 +27,24 @@
 
 <script>
 import InputRecordModule from "../common/InputRecordModule.vue";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
 
 export default {
-  components: { InputRecordModule },
+  components: { InputRecordModule, SentenceSegwordChs },
   props: ["curQue", "fn_data", "changeCurQue"],
   data() {
     return {
       data_structure: {
         type: "input_record_chs",
         name: "输入+录音",
-        title: "",
+        detail: {
+          type: "detail",
+          pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+          sentence: "", //句子
+          segList: [], //分词结果
+          seg_words: "",
+          wordsList: [],
+        },
         option: [
           {
             con: "", //标题

src/components/Adult/inputModules/RecordControl.vue

@@ -0,0 +1,114 @@
+<!--  -->
+<template>
+  <div class="Big-Book-Record">
+    <div class="adult-book-input-item">
+      <span class="adult-book-lable">音频控件：</span>
+      <img
+        v-if="type == 'record_control_mini'"
+        src="../../../assets/adult/mini.png"
+        alt=""
+      />
+      <img
+        v-if="type == 'record_control_normal'"
+        src="../../../assets/adult/normal.png"
+        alt=""
+      />
+      <img
+        v-if="type == 'record_control_pro'"
+        src="../../../assets/adult/pro.png"
+        alt=""
+      />
+      <img
+        v-if="type == 'record_control_promax'"
+        src="../../../assets/adult/pro-max.png"
+        alt=""
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: ["curQue", "fn_data", "type", "changeCurQue"],
+  data() {
+    return {
+      data_structure: {
+        type: "record_control_mini",
+        name: "录音控件-mini",
+      },
+      data_structure2: {
+        type: "record_control_normal",
+        name: "录音控件-normal",
+      },
+      data_structure3: {
+        type: "record_control_pro",
+        name: "录音控件-pro",
+      },
+      data_structure4: {
+        type: "record_control_promax",
+        name: "录音控件-promax",
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {},
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      if (this.type == "record_control_mini") {
+        this.changeCurQue(this.data_structure);
+      } else if (this.type == "record_control_normal") {
+        this.changeCurQue(this.data_structure2);
+      } else if (this.type == "record_control_pro") {
+        this.changeCurQue(this.data_structure3);
+      } else if (this.type == "record_control_promax") {
+        this.changeCurQue(this.data_structure4);
+      }
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scoped>
+//@import url(); 引入公共css类
+.Big-Book-Record {
+  &-icon {
+    width: 48px;
+    height: 48px;
+  }
+  .Big-Book-hanzi-option {
+    margin-top: 20px;
+  }
+  .addoption {
+    width: 148px;
+    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;
+    font-size: 14px;
+    color: #000000;
+  }
+  .Big-Book-con {
+    display: flex;
+    align-items: center;
+    span {
+      width: 60px;
+    }
+  }
+}
+</style>

src/components/Adult/inputModules/SentenceSegwordChs/components/ClauseresultChs.vue

@@ -72,6 +72,11 @@ export default {
 </script>
 <style lang='scss' scoped>
 //@import url(); 引入公共css类
+.Big-Book-Maxwidth{
+  display: flex;
+  justify-content: flex-start;
+  align-items: flex-start;
+}
 .NPC-sentence-list {
   display: flex;
   justify-content: flex-start;

src/views/adultInput.vue

@@ -29,6 +29,32 @@
             :label="item.title"
             :name="item.name"
           >
+            <div
+              style="position: relative"
+              v-for="(fc, fcIndex) in item.detailList"
+              :key="'fc' + fcIndex"
+            >
+              <SentenceSegwordChs :curQue="fc" />
+              <img
+                style="position: absolute; right: 699px; top: 2px"
+                @click="deleteDetail(index, fcIndex)"
+                class="close"
+                src="../assets/adult/del-close.png"
+                alt=""
+              />
+            </div>
+            <div class="addoption" @click="addDetail(index)">添加</div>
+            <div class="Big-Book-top" style="margin: 10px 0">
+              <span>课题</span>
+              <el-input
+                v-model="item.classTopic"
+                style="width: 80%"
+                type="textarea"
+                autosize
+                placeholder="请输入课题"
+                @blur="onBlur(item, 'classTopic')"
+              />
+            </div>
             <div class="createTable">
               <el-input
                 v-model="row"
@@ -55,28 +81,36 @@
               :key="'topic' + toindex + index"
             >
               <p>第{{ toindex + 1 }}题</p>
-              <div class="Big-Book-top">
-                <span>正标题</span>
+              <div class="adult-book-input-item">
+                <span class="adult-book-lable">正标题：</span>
                 <el-input
                   v-model="topic.z_title"
-                  style="width: 80%"
                   type="textarea"
-                  autosize
+                  :autosize="{ minRows: 2 }"
                   placeholder="请输入正标题"
                   @blur="onBlur(topic, 'z_title')"
                 />
               </div>
-              <div class="Big-Book-top">
-                <span>副标题</span>
+              <div class="adult-book-input-item">
+                <span class="adult-book-lable">副标题：</span>
                 <el-input
                   v-model="topic.f_title"
-                  style="width: 80%"
+                  :autosize="{ minRows: 2 }"
                   type="textarea"
-                  autosize
                   placeholder="请输入副标题"
                   @blur="onBlur(topic, 'f_title')"
                 />
               </div>
+              <div class="adult-book-input-item">
+                <span class="adult-book-lable">序号：</span>
+                <el-input
+                  v-model="topic.number"
+                  type="textarea"
+                  :autosize="{ minRows: 2 }"
+                  placeholder="请输入序号"
+                  @blur="onBlur(topic, 'number')"
+                />
+              </div>
               <div class="Big-Book-top">
                 <span>是否有背景色</span>
                 <el-radio v-model="topic.is_bg" :label="true">有</el-radio>
@@ -256,7 +290,7 @@
                         />
                       </template>
                     </template>
-                                        <template v-if="topicIitem.type == 'ligature_chs'">
+                    <template v-if="topicIitem.type == 'ligature_chs'">
                       <template v-if="topicIitem.is_edit">
                         <Ligature
                           :curQue="topicIitem.data"
@@ -407,6 +441,46 @@
                       </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>
+                    <template v-if="topicIitem.type == 'CourseStart_chs'">
+                      <template v-if="topicIitem.is_edit">
+                        <CourseStart
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
+                    <template
+                      v-if="
+                        topicIitem.type == 'record_control_mini' ||
+                        topicIitem.type == 'record_control_normal'||
+                        topicIitem.type == 'record_control_pro'||
+                        topicIitem.type == 'record_control_promax'
+                      "
+                    >
+                      <template v-if="topicIitem.is_edit">
+                        <RecordControl
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
                   </div>
                   <div
                     v-if="topicIitem.data && topicIitem.is_edit"
@@ -538,6 +612,8 @@ import PlayInputReacord from "@/components/Adult/inputModules/PlayInputReacord.v
 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 CourseStart from "@/components/Adult/inputModules/CourseStart.vue";
+import RecordControl from "@/components/Adult/inputModules/RecordControl.vue";
 
 import Textdes from "@/components/Adult/inputModules/Textdes.vue";
 import Record from "@/components/Adult/inputModules/Record.vue";
@@ -558,6 +634,7 @@ import NewordPhraseview from "@/components/Adult/preview/WordPhrase.vue";
 import UploadControlView from "@/components/Adult/preview/UploadControlView.vue";
 
 import DialogueAnswerViewChs from "@/components/Adult/preview/DialogueArticleViewChs/DialogueAnswerViewChs.vue";
+import Clauseresult from "@/components/Adult/inputModules/SentenceSegwordChs/components/ClauseresultChs.vue";
 import Preview from "@/components/Adult/Preview.vue";
 import fn from "@/components/Adult/common/data.js";
 import { getContent, getStaticContent } from "@/api/ajax";
@@ -615,6 +692,8 @@ export default {
     Drag,
     SelfAssessment,
     Sort,
+    CourseStart,
+    RecordControl,
   },
   data() {
     return {
@@ -629,6 +708,17 @@ export default {
         {
           name: "tab1",
           title: "第1页",
+          detailList: [
+            {
+              type: "detail",
+              pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+              sentence: "", //句子
+              segList: [], //分词结果
+              seg_words: "",
+              wordsList: [],
+            },
+          ], //目录分词
+          classTopic: "", //课题
           cur_fn_data: [],
         },
       ], // 总的数据列表
@@ -636,6 +726,17 @@ export default {
         {
           name: "tab1",
           title: "第1页",
+          detailList: [
+            {
+              type: "detail",
+              pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+              sentence: "", //句子
+              segList: [], //分词结果
+              seg_words: "",
+              wordsList: [],
+            },
+          ], //目录分词
+          classTopic: "", //课题
           cur_fn_data: [],
         },
       ], // 总的数据列表
@@ -697,6 +798,26 @@ export default {
   activated() {},
   // 方法集合
   methods: {
+    // 增加当前页的分词
+    addDetail(index) {
+      let obj = {
+        type: "detail",
+        pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+        sentence: "", //句子
+        segList: [], //分词结果
+        seg_words: "",
+        wordsList: [],
+      };
+      this.question_list[index].detailList.push(obj);
+    },
+    // 删除当前页的分词
+    deleteDetail(index, fcindex) {
+      if (this.question_list[index].detailList.length <= 1) {
+        this.$message.warning("至少要保留一一个");
+        return;
+      }
+      this.question_list[index].detailList.splice(fcindex, 1);
+    },
     // 随意插入模板获取位置
     changeSite(x, y) {
       this.bgControlX = x;
@@ -718,6 +839,7 @@ export default {
         let arr = {
           z_title: "",
           f_title: "",
+          number: "",
           is_bg: false, // 是否有背景色
           is_layout: false, // 是不是按背景图布局
           table_list: [],
@@ -815,6 +937,17 @@ export default {
           name: `tab${leg + 1}`,
           title: `第${leg + 1}页`,
           cur_fn_data: [],
+          detailList: [
+            {
+              type: "detail",
+              pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+              sentence: "", //句子
+              segList: [], //分词结果
+              seg_words: "",
+              wordsList: [],
+            },
+          ], //目录分词
+          classTopic: "", //课题
         };
         this.question_list.push(obj);
       }
@@ -1205,5 +1338,17 @@ export default {
       margin-right: 10px;
     }
   }
+  .addoption {
+    width: 200px;
+    height: 40px;
+    margin-bottom: 15px;
+    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;
+  }
 }
 </style>