Merge branch 'master' into gcj

src/components/Adult/Preview.vue

@@ -1,6 +1,6 @@
 <!--  -->
 <template>
-  <div class="NNPE-Big-Book-preview NPC-Book-Sty">
+  <div class="NNPE-Big-Book-preview adult-book-preview-sty preview-red">
     <div class="NNPE-title">
       <h1>{{ fatherName }}</h1>
       <div class="NNPE-operate">
@@ -13,7 +13,7 @@
         <h2 v-if="item.title_z">{{ item.title_z }}</h2>
         <h3 v-if="item.title_f">{{ item.title_f }}</h3>
         <div
-          :class="['NNPE-tableList', item.Isbg ? 'NNPE-tableList-hasBg' : '']"
+          :class="['NNPE-tableList', item.is_bg ? 'NNPE-tableList-hasBg' : '']"
         >
           <div
             class="NNPE-tableList-tr"
@@ -95,6 +95,15 @@
                 <template v-if="itemss.type == 'sudoku_chs'">
                   <Soduko :curQue="itemss.data" />
                 </template>
+                <template v-if="itemss.type == 'single_chs'">
+                  <Single :curQue="itemss.data" />
+                </template>
+                <template v-if="itemss.type == 'text_problem_chs'">
+                  <TextProblem :curQue="itemss.data" />
+                </template>
+                <template v-if="itemss.type == 'newWord_preview_chs'">
+                  <NewWordShow :curQue="itemss.data" />
+                </template>
               </template>
             </div>
           </div>
@@ -117,9 +126,12 @@ import Ligature from "./preview/Ligature.vue";
 import InputHasRecord from "./preview/InputHasRecord.vue"; // 输入加录音
 import TextInputRecord from "./preview/TextInputRecord.vue"; // 文本+输入+录音
 import SentenceInput from "./preview/SentenceInput.vue"; // 输入选项
-import NumberSelectHasRecord from "./preview/NumberSelectHasRecord.vue"; // 数字组合
-import SelectTone from "./preview/SelectTone.vue"; // 选择声调
-import Soduko from "./preview/Soduko.vue"; // 数独
+import NumberSelectHasRecord from "./preview/NumberSelectHasRecord.vue" // 数字组合
+import SelectTone from './preview/SelectTone.vue' // 选择声调
+import Soduko from './preview/Soduko.vue' // 数独
+import Single from './preview/Single.vue' // 单选
+import TextProblem from './preview/TextProblem.vue' // 课文上方的问题 
+import NewWordShow from './preview/NewWordShow.vue' // 生字展示
 export default {
   name: "preview",
   components: {
@@ -138,6 +150,9 @@ export default {
     NumberSelectHasRecord,
     SelectTone,
     Soduko,
+    Single,
+    TextProblem,
+    NewWordShow,
   },
   props: ["context", "fatherName"],
   data() {
@@ -311,7 +326,10 @@ export default {
       border-radius: 8px;
       padding: 12px 8px;
       &.NNPE-tableList-hasBg {
-        background: #f3f3f3;
+        background: #F7F7F7;
+        border: 1px solid rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+        border-radius: 8px;
       }
       .NNPE-tableList-tr {
         display: flex;

src/components/Adult/common/SentenceModule.vue

@@ -33,6 +33,18 @@
         @blur="onBlur(curQueItem, 'en')"
       ></el-input>
     </div>
+    <div
+      class="adult-book-input-item"
+      v-if="type == 'sentence_listen_read_chs'"
+    >
+      <span class="adult-book-lable">选项字体：</span>
+      <el-radio-group v-model="curQueItem.font">
+        <el-radio label="cn">中文字体</el-radio>
+        <el-radio label="en">英文字体</el-radio>
+        <el-radio label="py">拼音字体</el-radio>
+      </el-radio-group>
+    </div>
+
     <div v-for="(item, i) in fn_list" :key="i + 'answer'">
       <template v-if="item.type == 'sentence_input_chs' && item.isFn">
         <div class="adult-book-input-item">
@@ -84,7 +96,11 @@
     <div v-for="(item, i) in fn_list" :key="i + 'record'">
       <div
         class="adult-book-input-item"
-        v-if="item.type == 'sentence_record_chs' && item.isFn&&type!='sentence_listen_read_chs'"
+        v-if="
+          item.type == 'sentence_record_chs' &&
+          item.isFn &&
+          type != 'sentence_listen_read_chs'
+        "
       >
         <span class="adult-book-lable">录音：</span>
         <el-radio-group v-model="curQueItem.IsRecord">
@@ -97,7 +113,8 @@
       class="adult-book-input-item"
       v-if="
         (type == 'sentence_input_record_chs' && curQueItem.IsRecord) ||
-        type == 'sentence_record_chs'||type=='sentence_listen_read_chs'
+        type == 'sentence_record_chs' ||
+        type == 'sentence_listen_read_chs'
       "
     >
       <span class="adult-book-lable">录音组件：</span>

src/components/Adult/common/data3.js

@@ -774,6 +774,14 @@ let fnData = [{
         type: "zi_transverse_line_chs",
         name: "字+横线",
     },
+    {
+        type: "select_input_chs",
+        name: "选择填空控件",
+    },
+    {
+        type: "play_input_record_chs",
+        name: "播放+输入+录音",
+    },
 ]
 
 

src/components/Adult/inputModules/PlayInputReacord.vue

@@ -0,0 +1,481 @@
+<!--  -->
+<template>
+  <div class="Big-Book-PurePreview" 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"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="onBlur(curQue, 'title')"
+        ></el-input>
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">排列方式：</span>
+        <el-radio-group v-model="curQue.arrangeWay" @change="changearrangeWay">
+          <el-radio label="单列">单列</el-radio>
+          <el-radio label="双列">双列</el-radio>
+          <el-radio label="四列">四列</el-radio>
+        </el-radio-group>
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">配置：</span>
+        <div class="xorl">
+          <el-switch v-model="curQue.Isnumber" active-text="序号"> </el-switch>
+          <el-switch v-model="curQue.IsRecord" active-text="录音"> </el-switch>
+        </div>
+      </div>
+      <div class="main">
+        <div
+          class="row"
+          v-for="(row, rowIndex) in curQue.option"
+          :key="'row' + rowIndex"
+        >
+          <div
+            :style="{
+              width: `${
+                curQue.arrangeWay == '单列'
+                  ? '732px'
+                  : curQue.arrangeWay == '双列'
+                  ? '362px'
+                  : '177px'
+              }`,
+            }"
+            class="col"
+            v-for="(col, colIndex) in row"
+            :key="'col' + colIndex"
+          >
+            <div class="td">
+              <span v-if="curQue.Isnumber">{{ col.number }}</span>
+              <div class="content">
+                <div
+                  style="display: flex"
+                  v-for="(item, i) in col.list"
+                  :key="'cont' + i"
+                >
+                  <div
+                    v-for="(text, txIndex) in item.conList"
+                    :key="'text' + txIndex"
+                    style="display: flex"
+                  >
+                    <div v-if="text != '_'">
+                      {{ text }}
+                    </div>
+                    <span v-else>
+                      {{ text }}
+                    </span>
+                  </div>
+                  <img
+                    v-if="curQue.IsRecord"
+                    src="../../../assets/adult/mini.png"
+                    alt=""
+                  />
+                </div>
+              </div>
+            </div>
+            <p>
+              <span @click="edit(col, rowIndex, colIndex)"> 编辑 </span>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="80%"
+      :before-close="handleClose"
+    >
+      <div class="Module" v-if="dialogData">
+        <div class="adult-book-input-item">
+          <el-radio-group v-model="dialogData.type">
+            <el-radio label="英文">英文</el-radio>
+            <el-radio label="拼音+中文">拼音+中文</el-radio>
+          </el-radio-group>
+        </div>
+        <div class="Modulemain">
+          <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="dialogData.leftCon"
+                @blur="onBlur(dialogData, 'leftCon')"
+                @change="changecon(dialogData)"
+              ></el-input>
+            </div>
+            <div
+              class="adult-book-input-item"
+              v-if="dialogData.type == '拼音+中文'"
+            >
+              <span class="adult-book-lable">拼音：</span>
+              <el-input
+                class="adult-book-input"
+                type="textarea"
+                :autosize="{ minRows: 2 }"
+                placeholder="请输入拼音"
+                v-model="dialogData.leftPinyin"
+                @blur="onBlur(dialogData, 'leftPinyin')"
+              ></el-input>
+            </div>
+          </div>
+          <div>
+            <div class="adult-book-input-item" v-if="curQue.Isnumber">
+              <span class="adult-book-lable">序号：</span>
+              <el-input
+                class="adult-book-input"
+                type="textarea"
+                :autosize="{ minRows: 2 }"
+                placeholder="请输入标题"
+                v-model="dialogData.number"
+                @blur="onBlur(dialogData, 'number')"
+              ></el-input>
+            </div>
+            <div v-for="(item, index) in dialogData.list" :key="'h' + index">
+              <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="item.con"
+                  @blur="onBlur(item, 'con')"
+                  @change="changecon(item)"
+                ></el-input>
+                <img
+                  @click="deleterow(index)"
+                  class="close"
+                  src="../../../assets/adult/del-close.png"
+                  alt=""
+                />
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-if="dialogData.type == '拼音+中文'"
+              >
+                <span class="adult-book-lable">拼音：</span>
+                <el-input
+                  class="adult-book-input"
+                  type="textarea"
+                  :autosize="{ minRows: 2 }"
+                  placeholder="请输入拼音"
+                  v-model="item.pinyin"
+                  @blur="onBlur(item, 'pinyin')"
+                ></el-input>
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-if="dialogData.type == '拼音+中文'"
+              >
+                <span class="adult-book-lable">拼音位置：</span>
+                <el-radio-group v-model="item.pinyinSite">
+                  <el-radio label="top">上</el-radio>
+                  <el-radio label="bottom">下</el-radio>
+                  <el-radio label="left">左</el-radio>
+                  <el-radio label="right">右</el-radio>
+                </el-radio-group>
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-for="(answ, anIndex) in item.answer"
+                :key="'anw' + anIndex"
+              >
+                <span class="adult-book-lable">答案：</span>
+                <el-input
+                  class="adult-book-input"
+                  type="textarea"
+                  :autosize="{ minRows: 2 }"
+                  placeholder="请输入答案"
+                  v-model="answ.con"
+                  @blur="onBlur(answ, 'con')"
+                ></el-input>
+                <img
+                  @click="deleteAnswer(index, anIndex)"
+                  class="close"
+                  src="../../../assets/adult/del-close.png"
+                  alt=""
+                />
+              </div>
+              <div class="addoption" @click="addAnswer(index)">增加答案</div>
+            </div>
+            <div class="addoption" @click="addrowCol">增加</div>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="save">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Upload from "../common/Upload";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
+export default {
+  name: "PurePreview",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    SentenceSegwordChs,
+    Upload,
+  },
+  data() {
+    return {
+      checkList: [],
+      mp3Number: 1,
+      form: {
+        stem: {
+          con: "",
+          pinyin: "",
+          english: "",
+          highlight: "",
+          underline: "",
+          img_url: [],
+          mp3_url: [],
+        },
+      },
+      data_structure: {
+        type: "play_input_record_chs",
+        name: "",
+        title: "",
+        arrangeWay: "单列", //排列方式
+        Isnumber: false, //需不需要 序号
+        IsRecord: false, //需不需要录音
+        option: [
+          [
+            {
+              type: "英文", //英文还是拼音+中文
+              number: "",
+              list: [
+                {
+                  leftCon: "",
+                  leftPinyin: "",
+                  con: "",
+                  pinyin: "",
+                  pinyinSite: "", //拼音的位置
+                  answer: [
+                    {
+                      con: "",
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        ],
+        numberList: {
+          type: "number",
+          name: "每行几个",
+          con: "2",
+          arr: [
+            {
+              id: 1,
+              value: 1,
+            },
+            {
+              id: 2,
+              value: 2,
+            },
+            {
+              id: 3,
+              value: 3,
+            },
+            {
+              id: 4,
+              value: 4,
+            },
+          ],
+        },
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    onBlur(item, field) {
+      item[field] = item[field] ? item[field].trim() : "";
+    },
+
+    // 增加答案
+    addanswer(index) {
+      let obj;
+      if (this.type == "zi_transverse_line_chs") {
+        obj = JSON.parse(
+          JSON.stringify(this.data_structure.option[0].answer[0])
+        );
+        this.curQue.option[index].answer.push(obj);
+      }
+    },
+    // 删除答案
+    deleteanswer(aindex, index) {
+      if (this.curQue.option[index].answer.length <= 1) {
+        this.$message.warning("至少要保留1个答案");
+        return;
+      }
+      this.curQue.option[index].answer.splice(aindex, 1);
+    },
+    // 删除其中一个选项
+    deleteOptionOne(index) {
+      if (this.curQue.option.length <= 1) {
+        this.$message.warning("至少要保留1个选项");
+        return;
+      }
+      this.curQue.option.splice(index, 1);
+    },
+    // 新增选项
+    addOption() {
+      let obj = JSON.parse(JSON.stringify(this.data_structure.option[0]));
+      this.curQue.option.push(obj);
+    },
+    initcurQue() {
+      let data = JSON.parse(JSON.stringify(this.data_structure));
+      this.changeCurQue(data);
+    },
+    // 选项的音频
+    changeMp3(fileList, item, index) {
+      const articleImgList = JSON.parse(JSON.stringify(fileList));
+      const articleImgRes = [];
+      articleImgList.forEach((item) => {
+        if (item.response) {
+          const obj = {
+            name: item.name,
+            url: item.response.file_info_list[0].file_url,
+            id: "[FID##" + item.response.file_info_list[0].file_id + "##FID]",
+            media_duration: item.response.file_info_list[0].media_duration, //音频时长
+          };
+          articleImgRes.push(obj);
+        }
+      });
+      this.curQue.option[index].mp3_list = JSON.parse(
+        JSON.stringify(articleImgRes)
+      );
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      this.initcurQue();
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scope>
+//@import url(); 引入公共css类
+.Big-Book-PurePreview {
+  &-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: 200px;
+    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;
+    margin-bottom: 15px;
+  }
+  .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;
+  }
+  .close {
+    width: 24px;
+    cursor: pointer;
+  }
+  .xorl {
+    display: flex;
+    align-items: center;
+    margin-top: 5px;
+    > :nth-child(1) {
+      margin-right: 33px;
+    }
+  }
+}
+</style>
+<style lang="scss">
+</style>

src/components/Adult/inputModules/PurePreview.vue

@@ -16,228 +16,178 @@
           @blur="onBlur(curQue, 'title')"
         ></el-input>
       </div>
-      <template v-if="type == 'listen_record_single_syllable_chs'">
-        <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.number"
-            @blur="onBlur(curQue, 'number')"
-          ></el-input>
-        </div>
-        <div class="adult-book-input-item">
-          <span class="adult-book-lable">音频：</span>
-          <Upload
-            :changeFillId="timuchangeMp3"
-            :datafileList="curQue.mp3_list"
-            :filleNumber="mp3Number"
-            :uploadType="'mp3'"
-          />
+      <template
+        v-if="type == 'text_problem_chs' || type == 'newWord_preview_chs'"
+      >
+        <div
+          class="Big-Book-main"
+          v-for="(item, index) in curQue.option"
+          :key="item + index"
+          style="margin-bottom: 20px"
+        >
+          <template v-if="type == 'text_problem_chs'">
+            <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="item.number"
+                @blur="onBlur(item, 'number')"
+              ></el-input>
+              <img
+                @click="deleteOptionOne(index)"
+                class="close"
+                src="../../../assets/adult/del-close.png"
+                alt=""
+              />
+            </div>
+            <div class="NPC-sentence-Segword">
+              <SentenceSegwordChs :curQue="item.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="item.en"
+                @blur="onBlur(item, 'en')"
+              ></el-input>
+              <img
+                @click="deleteOptionOne(index)"
+                class="close"
+                src="../../../assets/adult/del-close.png"
+                alt=""
+              />
+            </div>
+          </template>
+          <template v-if="type == 'newWord_preview_chs'">
+            <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="item.pinyin"
+                @blur="onBlur(item, 'pinyin')"
+              ></el-input>
+              <img
+                @click="deleteOptionOne(index)"
+                class="close"
+                src="../../../assets/adult/del-close.png"
+                alt=""
+              />
+            </div>
+            <div class="adult-book-input-item">
+              <span class="adult-book-lable">展示方式：</span>
+              <el-radio-group v-model="item.imgOrText">
+                <el-radio label="image">图片</el-radio>
+                <el-radio label="text">文本</el-radio>
+              </el-radio-group>
+            </div>
+            <template v-if="item.imgOrText == 'image'">
+              <div class="adult-book-input-item">
+                <span class="adult-book-lable">图片：</span>
+                <Upload
+                  :changeFillId="changeImage"
+                  :datafileList="item.img_list"
+                  :filleNumber="mp3Number"
+                  :uploadType="'image'"
+                  :index="index"
+                />
+              </div>
+            </template>
+            <template v-if="item.imgOrText == 'text'">
+              <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="item.con"
+                  @blur="onBlur(item, 'con')"
+                ></el-input>
+              </div>
+              <div class="adult-book-input-item">
+                <span class="adult-book-lable">音频：</span>
+                <Upload
+                  :changeFillId="changeMp3"
+                  :datafileList="item.mp3_list"
+                  :filleNumber="mp3Number"
+                  :uploadType="'mp3'"
+                  :index="index"
+                />
+              </div>
+            </template>
+          </template>
         </div>
       </template>
-      <div
-        class="Big-Book-main"
-        v-for="(item, index) in curQue.option"
-        :key="item + index"
-        style="margin-bottom: 20px"
-      >
-        <template v-if="type == 'text_problem_chs'">
+      <template v-if="type == 'listen_record_single_syllable_chs'">
+        <div
+          class="Big-Book-main"
+          v-for="(item, index) in curQue"
+          :key="item + index"
+          style="margin-bottom: 20px"
+        >
           <div class="adult-book-input-item">
             <span class="adult-book-lable">序号：</span>
             <el-input
               class="adult-book-input"
               type="textarea"
               :autosize="{ minRows: 2 }"
-              placeholder="请输入序号"
+              placeholder="请输入拼音"
               v-model="item.number"
               @blur="onBlur(item, 'number')"
             ></el-input>
             <img
-              @click="deleteOptionOne(index)"
-              class="close"
-              src="../../../assets/adult/del-close.png"
-              alt=""
-            />
-          </div>
-          <div class="NPC-sentence-Segword">
-            <SentenceSegwordChs :curQue="item.detail" />
-          </div>
-        </template>
-        <template v-if="type == 'newWord_preview_chs'">
-          <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="item.pinyin"
-              @blur="onBlur(item, 'pinyin')"
-            ></el-input>
-            <img
-              @click="deleteOptionOne(index)"
+              @click="deleteyinjie(index, itI)"
               class="close"
               src="../../../assets/adult/del-close.png"
               alt=""
             />
           </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="item.con"
-              @blur="onBlur(item, 'con')"
-            ></el-input>
-          </div>
-          <div class="adult-book-input-item">
             <span class="adult-book-lable">音频：</span>
             <Upload
-              :changeFillId="changeMp3"
+              :changeFillId="listenchangeMp3"
               :datafileList="item.mp3_list"
               :filleNumber="mp3Number"
               :uploadType="'mp3'"
               :index="index"
             />
           </div>
-        </template>
-        <template v-if="type == 'listen_record_single_syllable_chs'">
-          <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="item.pinyin"
-              @blur="onBlur(item, 'pinyin')"
-            ></el-input>
-            <img
-              @click="deleteOptionOne(index)"
-              class="close"
-              src="../../../assets/adult/del-close.png"
-              alt=""
-            />
-          </div>
-        </template>
-        <template v-if="type == 'zi_transverse_line_chs'">
-          <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="item.number"
-              @blur="onBlur(item, 'number')"
-            ></el-input>
-            <img
-              @click="deleteOptionOne(index)"
-              class="close"
-              src="../../../assets/adult/del-close.png"
-              alt=""
-            />
-          </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="item.con"
-              @blur="onBlur(item, 'con')"
-            ></el-input>
-          </div>
-          <div
-            class="adult-book-input-item"
-            v-for="(ans, anIndex) in item.answer"
-            :key="'an' + anIndex"
-          >
-            <span class="adult-book-lable">答案：</span>
-            <el-input
-              class="adult-book-input"
-              type="textarea"
-              :autosize="{ minRows: 2 }"
-              placeholder="请输入答案"
-              v-model="ans.con"
-              @blur="onBlur(ans, 'con')"
-            ></el-input>
-            <img
-              @click="deleteanswer(anIndex, index)"
-              class="close"
-              src="../../../assets/adult/del-close.png"
-              alt=""
-            />
-          </div>
-          <div class="addoption" @click="addanswer(index)">添加答案</div>
-          <div class="adult-book-input-item">
-            <span class="adult-book-lable">拼音状态：</span>
-            <el-radio-group v-model="item.Ispinyin">
-              <el-radio :label="true">需要拼音</el-radio>
-              <el-radio :label="false">不需要拼音</el-radio>
-            </el-radio-group>
-          </div>
-          <div class="adult-book-input-item" v-if="item.Ispinyin">
-            <span class="adult-book-lable">拼音位置：</span>
-            <el-radio-group v-model="item.pinyinSite">
-              <el-radio label="top">上</el-radio>
-              <el-radio label="bottom">下</el-radio>
-              <el-radio label="left">左</el-radio>
-              <el-radio label="right">右</el-radio>
-            </el-radio-group>
-          </div>
-          <template v-if="item.Ispinyin && item.pinyinSite">
-            <div
-              class="adult-book-input-item"
-              v-for="(py, pyIndex) in item.pinyinList"
-              :key="'py' + pyIndex"
-            >
+          <div v-for="(it, itI) in item.option" :key="'it' + itI">
+            <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="py.con"
-                @blur="onBlur(py, 'con')"
+                v-model="it.pinyin"
+                @blur="onBlur(it, 'pinyin')"
               ></el-input>
               <img
-                @click="deletepinyin(pyIndex, index)"
+                @click="deleteyinjie(index, itI)"
                 class="close"
                 src="../../../assets/adult/del-close.png"
                 alt=""
               />
             </div>
-            <div class="addoption" @click="addpinyin(index)">添加拼音</div>
-          </template>
-          <div class="adult-book-input-item">
-            <span class="adult-book-lable">音频控件：</span>
-            <img src="../../../assets/adult/mini.png" alt="" />
           </div>
-        </template>
-      </div>
+          <div class="addoption" @click="addyinjie(index, itI)">
+            添加一个音节
+          </div>
+        </div>
+      </template>
       <div class="Big-Book-addrole">
         <div class="addoption" @click="addOption">添加一个</div>
       </div>
-      <div class="Big-Book-divide" v-if="type == 'zi_transverse_line_chs'">
-        <el-divider content-position="center">功能设置</el-divider>
-        <span style="margin: 0 10px">请选择每行数量</span>
-        <el-select v-model="curQue.numberList.con" placeholder="请选择">
-          <el-option
-            v-for="(item, i) in curQue.numberList.arr"
-            :key="i"
-            :label="item.value"
-            :value="item.id"
-          >
-          </el-option>
-        </el-select>
-      </div>
     </div>
   </div>
 </template>
@@ -276,6 +226,7 @@ export default {
             mp3_list: [],
             number: "",
             detail: {
+              en: "",
               pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
               sentence: "", //句子
               segList: [], //分词结果
@@ -288,126 +239,65 @@ export default {
           },
         ],
       },
-
       data_structure2: {
         type: "newWord_preview_chs",
         name: "生字展示",
         title: "",
+        imgOrText: null,
         option: [
           {
             mp3_list: [],
+            img_list: [],
             con: "", //生字
             pinyin: "", //拼音
           },
         ],
       },
-      data_structure3: {
-        type: "listen_record_single_syllable_chs",
-        name: "听录音选择音节",
-        title: "",
-        mp3_list: [],
-        number: "",
-        option: [
-          {
-            pinyin: "", //拼音
-          },
-        ],
-      },
-      data_structure4: {
-        type: "zi_transverse_line_chs",
-        name: "字+横线",
-        title: "",
-        mp3_list: [],
-        option: [
-          {
-            number: "", //序号
-            con: "", //内容
-            Ispinyin: null, //是否有拼音
-            pinyinSite: null, //拼音位置
-            pinyinList: [{ con: "" }],
-            answer: [
-              {
-                con: "",
-              },
-            ],
-          },
-        ],
-
-        numberList: {
-          type: "number",
-          name: "每行几个",
-          con: "2",
-          arr: [
-            {
-              id: 1,
-              value: 1,
-            },
-            {
-              id: 2,
-              value: 2,
-            },
-            {
-              id: 3,
-              value: 3,
-            },
+      data_structure3: [
+        {
+          type: "listen_record_single_syllable_chs",
+          name: "听录音选择音节",
+          title: "",
+          mp3_list: [],
+          number: "",
+          option: [
             {
-              id: 4,
-              value: 4,
+              number: "",
+              pinyin: "", //拼音
             },
           ],
         },
-      },
+      ],
     };
   },
   computed: {},
   watch: {},
   //方法集合
   methods: {
-    onBlur(item, field) {
-      item[field] = item[field] ? item[field].trim() : "";
-    },
-    // 增加拼音
-    addpinyin(index) {
-      let obj;
-      if (this.type == "zi_transverse_line_chs") {
-        obj = JSON.parse(
-          JSON.stringify(this.data_structure4.option[0].pinyinList[0])
-        );
-        this.curQue.option[index].pinyinList.push(obj);
-      }
+    // 添加音节
+    addyinjie(index) {
+      let obj = JSON.parse(JSON.stringify(this.data_structure3[0].option[0]));
+      this.curQue[index].option.push(obj);
     },
-    // 删除拼音
-    deletepinyin(aindex, index) {
-      if (this.type == "zi_transverse_line_chs") {
-        if (this.curQue.option[index].pinyinList.length <= 1) {
-          this.$message.warning("至少要保留1个拼音");
-          return;
-        }
-        this.curQue.option[index].pinyinList.splice(aindex, 1);
+    // 删除音节
+    deleteyinjie(index, yjIndex) {
+      if (this.curQue[index].option.length <= 1) {
+        this.$message.warning("至少要保留1个音节");
+        return;
       }
+      this.curQue[index].option.splice(yjIndex, 1);
     },
-    // 增加答案
-    addanswer(index) {
-      let obj;
-      if (this.type == "zi_transverse_line_chs") {
-        obj = JSON.parse(
-          JSON.stringify(this.data_structure4.option[0].answer[0])
-        );
-        this.curQue.option[index].answer.push(obj);
-      }
+    onBlur(item, field) {
+      item[field] = item[field] ? item[field].trim() : "";
     },
-    // 删除答案
-    deleteanswer(aindex, index) {
-      if (this.type == "zi_transverse_line_chs") {
-        if (this.curQue.option[index].answer.length <= 1) {
-          this.$message.warning("至少要保留1个答案");
+    // 删除其中一个选项
+    deleteOptionOne(index) {
+      if (this.type == "listen_record_single_syllable_chs") {
+        if (this.curQue[index].option.length <= 1) {
+          this.$message.warning("至少要保留1个选项");
           return;
         }
-        this.curQue.option[index].answer.splice(aindex, 1);
       }
-    },
-    // 删除其中一个选项
-    deleteOptionOne(index) {
       if (this.curQue.option.length <= 1) {
         this.$message.warning("至少要保留1个选项");
         return;
@@ -419,14 +309,14 @@ export default {
       let obj;
       if (this.type == "newWord_preview_chs") {
         obj = JSON.parse(JSON.stringify(this.data_structure2.option[0]));
+        this.curQue.option.push(obj);
       } else if (this.type == "text_problem_chs") {
         obj = JSON.parse(JSON.stringify(this.data_structure.option[0]));
+        this.curQue.option.push(obj);
       } else if (this.type == "listen_record_single_syllable_chs") {
-        obj = JSON.parse(JSON.stringify(this.data_structure3.option[0]));
-      } else if (this.type == "zi_transverse_line_chs") {
-        obj = JSON.parse(JSON.stringify(this.data_structure4.option[0]));
+        obj = JSON.parse(JSON.stringify(this.data_structure3[0]));
+        this.curQue.push(obj);
       }
-      this.curQue.option.push(obj);
     },
     initcurQue() {
       let data;
@@ -436,8 +326,6 @@ export default {
         data = JSON.parse(JSON.stringify(this.data_structure));
       } else if (this.type == "listen_record_single_syllable_chs") {
         data = JSON.parse(JSON.stringify(this.data_structure3));
-      } else if (this.type == "zi_transverse_line_chs") {
-        data = JSON.parse(JSON.stringify(this.data_structure4));
       }
       this.changeCurQue(data);
     },
@@ -460,6 +348,23 @@ export default {
         JSON.stringify(articleImgRes)
       );
     },
+    // 听录音选择音调的上传音频
+    listenchangeMp3(fileList, item, index) {
+      const articleImgList = JSON.parse(JSON.stringify(fileList));
+      const articleImgRes = [];
+      articleImgList.forEach((item) => {
+        if (item.response) {
+          const obj = {
+            name: item.name,
+            url: item.response.file_info_list[0].file_url,
+            id: "[FID##" + item.response.file_info_list[0].file_id + "##FID]",
+            media_duration: item.response.file_info_list[0].media_duration, //音频时长
+          };
+          articleImgRes.push(obj);
+        }
+      });
+      this.curQue[index].mp3_list = JSON.parse(JSON.stringify(articleImgRes));
+    },
     // 题目的音频
     timuchangeMp3(fileList) {
       const articleImgList = JSON.parse(JSON.stringify(fileList));

src/components/Adult/inputModules/SelectInpue.vue

@@ -0,0 +1,263 @@
+<!--  -->
+<template>
+  <div class="Big-Book-PurePreview" 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"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="onBlur(curQue, 'title')"
+        ></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 v-for="(item, Oindex) in curQue.option" :key="'op' + Oindex">
+        <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="item.con"
+            @blur="onBlur(item, 'con')"
+          ></el-input>
+          <img
+            @click="deleteOptionOne(Oindex)"
+            class="close"
+            src="../../../assets/adult/del-close.png"
+            alt=""
+          />
+        </div>
+      </div>
+      <div class="addoption" @click="addOption">添加一个选项</div>
+      <div v-for="(item, awindex) in curQue.answer" :key="'aw' + awindex">
+        <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="item.con"
+            @blur="onBlur(item, 'con')"
+          ></el-input>
+          <img
+            @click="deleteAnswer(awindex)"
+            class="close"
+            src="../../../assets/adult/del-close.png"
+            alt=""
+          />
+        </div>
+      </div>
+      <div class="addoption" @click="addAnswer">添加一个答案</div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Upload from "../common/Upload";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
+export default {
+  name: "PurePreview",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    SentenceSegwordChs,
+    Upload,
+  },
+  data() {
+    return {
+      checkList: [],
+      mp3Number: 1,
+      form: {
+        stem: {
+          con: "",
+          pinyin: "",
+          english: "",
+          highlight: "",
+          underline: "",
+          img_url: [],
+          mp3_url: [],
+        },
+      },
+      data_structure: {
+        type: "选择填空控件",
+        name: "select_input_chs",
+        title: "",
+        con: "",
+        option: [
+          {
+            con: "",
+          },
+        ],
+        answer: [
+          {
+            con: "",
+          },
+        ],
+      },
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    onBlur(item, field) {
+      item[field] = item[field] ? item[field].trim() : "";
+    },
+    // 删除其中一个选项
+    deleteOptionOne(index) {
+      if (this.curQue.option.length <= 1) {
+        this.$message.warning("至少要保留1个选项");
+        return;
+      }
+      this.curQue.option.splice(index, 1);
+    },
+    // 新增选项
+    addOption() {
+      let obj = JSON.parse(JSON.stringify(this.data_structure.option[0]));
+      this.curQue.option.push(obj);
+    },
+    // 添加答案
+    addAnswer() {
+      let obj = JSON.parse(JSON.stringify(this.data_structure.answer[0]));
+      this.curQue.answer.push(obj);
+    },
+    // 删除其中一个答案
+    deleteAnswer(index) {
+      if (this.curQue.answer.length <= 1) {
+        this.$message.warning("至少要保留1个答案");
+        return;
+      }
+      this.curQue.answer.splice(index, 1);
+    },
+    initcurQue() {
+      let data = JSON.parse(JSON.stringify(this.data_structure));
+      this.changeCurQue(data);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      this.initcurQue();
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scope>
+//@import url(); 引入公共css类
+.Big-Book-PurePreview {
+  &-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: 200px;
+    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;
+  }
+  .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;
+  }
+  .close {
+    width: 24px;
+    cursor: pointer;
+  }
+}
+</style>
+<style lang="scss">
+</style>

src/components/Adult/inputModules/Sentence.vue

@@ -117,6 +117,7 @@ export default {
           {
             mp3_list: [],
             number: "",
+            font:"",
             detail: {
               pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
               sentence: "", //句子

src/components/Adult/inputModules/ZiLine.vue

@@ -0,0 +1,660 @@
+<!--  -->
+<template>
+  <div class="Big-Book-PurePreview" 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"
+          type="textarea"
+          :autosize="{ minRows: 2 }"
+          placeholder="请输入标题"
+          v-model="curQue.title"
+          @blur="onBlur(curQue, 'title')"
+        ></el-input>
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">排列方式：</span>
+        <el-radio-group v-model="curQue.arrangeWay" @change="changearrangeWay">
+          <el-radio label="单列">单列</el-radio>
+          <el-radio label="双列">双列</el-radio>
+          <el-radio label="四列">四列</el-radio>
+        </el-radio-group>
+      </div>
+      <div class="adult-book-input-item">
+        <span class="adult-book-lable">配置：</span>
+        <div class="xorl">
+          <el-switch v-model="curQue.Isnumber" active-text="序号"> </el-switch>
+          <el-switch v-model="curQue.IsRecord" active-text="录音"> </el-switch>
+        </div>
+      </div>
+      <div class="main">
+        <div
+          class="row"
+          v-for="(row, rowIndex) in curQue.option"
+          :key="'row' + rowIndex"
+        >
+          <div
+            :style="{
+              width: `${
+                curQue.arrangeWay == '单列'
+                  ? '732px'
+                  : curQue.arrangeWay == '双列'
+                  ? '362px'
+                  : '177px'
+              }`,
+            }"
+            class="col"
+            v-for="(col, colIndex) in row"
+            :key="'col' + colIndex"
+          >
+            <div class="td">
+              <span v-if="curQue.Isnumber">{{ col.number }}</span>
+              <div class="content">
+                <div
+                  style="display: flex"
+                  v-for="(item, i) in col.list"
+                  :key="'cont' + i"
+                >
+                  <div
+                    v-for="(text, txIndex) in item.conList"
+                    :key="'text' + txIndex"
+                    style="display: flex"
+                  >
+                    <div v-if="text != '_'">
+                      {{ text }}
+                    </div>
+                    <span v-else>
+                      {{ text }}
+                    </span>
+                  </div>
+                  <img
+                    v-if="curQue.IsRecord"
+                    src="../../../assets/adult/mini.png"
+                    alt=""
+                  />
+                </div>
+              </div>
+            </div>
+            <p>
+              <span @click="edit(col, rowIndex, colIndex)"> 编辑 </span>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="80%"
+      :before-close="handleClose"
+    >
+      <div class="Module" v-if="dialogData">
+        <div class="adult-book-input-item">
+          <el-radio-group v-model="dialogData.type">
+            <el-radio label="英文">英文</el-radio>
+            <el-radio label="拼音+中文">拼音+中文</el-radio>
+          </el-radio-group>
+        </div>
+        <div class="Modulemain">
+          <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="dialogData.leftCon"
+                @blur="onBlur(dialogData, 'leftCon')"
+                @change="changecon(dialogData)"
+              ></el-input>
+            </div>
+            <div
+              class="adult-book-input-item"
+              v-if="dialogData.type == '拼音+中文'"
+            >
+              <span class="adult-book-lable">拼音：</span>
+              <el-input
+                class="adult-book-input"
+                type="textarea"
+                :autosize="{ minRows: 2 }"
+                placeholder="请输入拼音"
+                v-model="dialogData.leftPinyin"
+                @blur="onBlur(dialogData, 'leftPinyin')"
+              ></el-input>
+            </div>
+          </div>
+          <div>
+            <div class="adult-book-input-item" v-if="curQue.Isnumber">
+              <span class="adult-book-lable">序号：</span>
+              <el-input
+                class="adult-book-input"
+                type="textarea"
+                :autosize="{ minRows: 2 }"
+                placeholder="请输入标题"
+                v-model="dialogData.number"
+                @blur="onBlur(dialogData, 'number')"
+              ></el-input>
+            </div>
+            <div v-for="(item, index) in dialogData.list" :key="'h' + index">
+              <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="item.con"
+                  @blur="onBlur(item, 'con')"
+                  @change="changecon(item)"
+                ></el-input>
+                <img
+                  @click="deleterow(index)"
+                  class="close"
+                  src="../../../assets/adult/del-close.png"
+                  alt=""
+                />
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-if="dialogData.type == '拼音+中文'"
+              >
+                <span class="adult-book-lable">拼音：</span>
+                <el-input
+                  class="adult-book-input"
+                  type="textarea"
+                  :autosize="{ minRows: 2 }"
+                  placeholder="请输入拼音"
+                  v-model="item.pinyin"
+                  @blur="onBlur(item, 'pinyin')"
+                ></el-input>
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-if="dialogData.type == '拼音+中文'"
+              >
+                <span class="adult-book-lable">拼音位置：</span>
+                <el-radio-group v-model="item.pinyinSite">
+                  <el-radio label="top">上</el-radio>
+                  <el-radio label="bottom">下</el-radio>
+                  <el-radio label="left">左</el-radio>
+                  <el-radio label="right">右</el-radio>
+                </el-radio-group>
+              </div>
+              <div
+                class="adult-book-input-item"
+                v-for="(answ, anIndex) in item.answer"
+                :key="'anw' + anIndex"
+              >
+                <span class="adult-book-lable">答案：</span>
+                <el-input
+                  class="adult-book-input"
+                  type="textarea"
+                  :autosize="{ minRows: 2 }"
+                  placeholder="请输入答案"
+                  v-model="answ.con"
+                  @blur="onBlur(answ, 'con')"
+                ></el-input>
+                <img
+                  @click="deleteAnswer(index, anIndex)"
+                  class="close"
+                  src="../../../assets/adult/del-close.png"
+                  alt=""
+                />
+              </div>
+              <div class="addoption" @click="addAnswer(index)">增加答案</div>
+            </div>
+            <div class="addoption" @click="addrowCol">增加</div>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="handleClose">取 消</el-button>
+        <el-button type="primary" @click="save">确 定</el-button>
+      </span>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Upload from "../common/Upload";
+import SentenceSegwordChs from "../common/SentenceSegwordChs/index.vue";
+export default {
+  name: "PurePreview",
+  props: ["curQue", "fn_data", "changeCurQue", "type"],
+  components: {
+    SentenceSegwordChs,
+    Upload,
+  },
+  data() {
+    return {
+      checkList: [],
+      mp3Number: 1,
+      form: {
+        stem: {
+          con: "",
+          pinyin: "",
+          english: "",
+          highlight: "",
+          underline: "",
+          img_url: [],
+          mp3_url: [],
+        },
+      },
+      data_structure: {
+        type: "zi_transverse_line_chs",
+        name: "字+横线",
+        title: "",
+        arrangeWay: "单列", //排列方式
+        Isnumber: false, //需不需要 序号
+        IsRecord: false, //需不需要录音
+        option: [
+          [
+            {
+              type: "英文", //英文还是拼音+中文
+              number: "",
+              list: [
+                {
+                  leftCon: "",
+                  leftPinyin: "",
+                  con: "",
+                  pinyin: "",
+                  pinyinSite: "", //拼音的位置
+                  answer: [
+                    {
+                      con: "",
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        ],
+        numberList: {
+          type: "number",
+          name: "每行几个",
+          con: "2",
+          arr: [
+            {
+              id: 1,
+              value: 1,
+            },
+            {
+              id: 2,
+              value: 2,
+            },
+            {
+              id: 3,
+              value: 3,
+            },
+            {
+              id: 4,
+              value: 4,
+            },
+          ],
+        },
+      },
+      dialogVisible: false,
+      dialogData: null,
+      rowIndex: null,
+      colIndex: null,
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    changecon(value) {
+      value.conList = value.con.split("");
+    },
+    //   增加答案
+    addAnswer(index) {
+      let obj = JSON.stringify(this.data_structure.option[0][0].list[0].answer);
+      this.dialogData.list[index].answer.push(obj);
+    },
+    //   删除答案
+    deleteAnswer(index, anindex) {
+      if (this.dialogData.list[index].answer.length <= 1) {
+        this.$message.warning("至少要存在一个答案");
+        return;
+      }
+      this.dialogData.list[index].answer.splice(anindex, 1);
+    },
+    //   删除某一个的行
+    deleterow(index) {
+      if (this.dialogData.list.length <= 1) {
+        this.$message.warning("至少要存在一个");
+        return;
+      }
+      this.dialogData.list.splice(index, 1);
+    },
+    //   增加某一个的行数
+    addrowCol() {
+      let obj = JSON.parse(
+        JSON.stringify(this.data_structure.option[0][0].list[0])
+      );
+      this.dialogData.list.push(obj);
+    },
+    // 保存
+    save() {
+      this.curQue.option[this.rowIndex][this.colIndex] = JSON.parse(
+        JSON.stringify(this.dialogData)
+      );
+      this.rowIndex = null;
+      this.colIndex = null;
+    },
+    //   编辑某一个
+    edit(item, rindex, cindex) {
+      console.log(item);
+      this.dialogData = JSON.parse(JSON.stringify(item));
+      this.dialogVisible = true;
+      //   记录索引
+      this.rowIndex = rindex;
+      this.colIndex = cindex;
+    },
+    //   关闭弹窗
+    handleClose() {
+      this.dialogVisible = false;
+      this.dialogData = null;
+      this.rowIndex = null;
+      this.colIndex = null;
+    },
+    //   修改排列方式
+    changearrangeWay(value) {
+      let obj = this.data_structure.option[0][0];
+      if (value == "双列") {
+        this.curQue.option.forEach((row) => {
+          if (row.length > 1) {
+            row.splice(2, row.length - 1);
+          } else {
+            row.push(obj);
+          }
+        });
+      } else if (value == "四列") {
+        this.curQue.option.forEach((row) => {
+          if (row.length >= 2) {
+            for (let i = 0; i < 2; i++) {
+              row.push(obj);
+            }
+          } else {
+            for (let i = 0; i < 3; i++) {
+              row.push(obj);
+            }
+          }
+        });
+      } else if (value == "单列") {
+        this.curQue.option.forEach((row) => {
+          row.splice(1, row.length - 1);
+        });
+      }
+    },
+    onBlur(item, field) {
+      item[field] = item[field] ? item[field].trim() : "";
+    },
+    // 增加拼音
+    addpinyin(index) {
+      let obj;
+      obj = JSON.parse(
+        JSON.stringify(this.data_structure.option[0].pinyinList[0])
+      );
+      this.curQue.option[index].pinyinList.push(obj);
+    },
+    // 删除拼音
+    deletepinyin(aindex, index) {
+      if (this.type == "zi_transverse_line_chs") {
+        if (this.curQue.option[index].pinyinList.length <= 1) {
+          this.$message.warning("至少要保留1个拼音");
+          return;
+        }
+        this.curQue.option[index].pinyinList.splice(aindex, 1);
+      }
+    },
+    // 增加答案
+    addanswer(index) {
+      let obj;
+      if (this.type == "zi_transverse_line_chs") {
+        obj = JSON.parse(
+          JSON.stringify(this.data_structure.option[0].answer[0])
+        );
+        this.curQue.option[index].answer.push(obj);
+      }
+    },
+    // 删除答案
+    deleteanswer(aindex, index) {
+      if (this.curQue.option[index].answer.length <= 1) {
+        this.$message.warning("至少要保留1个答案");
+        return;
+      }
+      this.curQue.option[index].answer.splice(aindex, 1);
+    },
+    // 删除其中一个选项
+    deleteOptionOne(index) {
+      if (this.curQue.option.length <= 1) {
+        this.$message.warning("至少要保留1个选项");
+        return;
+      }
+      this.curQue.option.splice(index, 1);
+    },
+    // 新增选项
+    addOption() {
+      let obj = JSON.parse(JSON.stringify(this.data_structure.option[0]));
+      this.curQue.option.push(obj);
+    },
+    initcurQue() {
+      let data = JSON.parse(JSON.stringify(this.data_structure));
+      this.changeCurQue(data);
+    },
+    // 选项的音频
+    changeMp3(fileList, item, index) {
+      const articleImgList = JSON.parse(JSON.stringify(fileList));
+      const articleImgRes = [];
+      articleImgList.forEach((item) => {
+        if (item.response) {
+          const obj = {
+            name: item.name,
+            url: item.response.file_info_list[0].file_url,
+            id: "[FID##" + item.response.file_info_list[0].file_id + "##FID]",
+            media_duration: item.response.file_info_list[0].media_duration, //音频时长
+          };
+          articleImgRes.push(obj);
+        }
+      });
+      this.curQue.option[index].mp3_list = JSON.parse(
+        JSON.stringify(articleImgRes)
+      );
+    },
+    // 题目的音频
+    timuchangeMp3(fileList) {
+      const articleImgList = JSON.parse(JSON.stringify(fileList));
+      const articleImgRes = [];
+      articleImgList.forEach((item) => {
+        if (item.response) {
+          const obj = {
+            name: item.name,
+            url: item.response.file_info_list[0].file_url,
+            id: "[FID##" + item.response.file_info_list[0].file_id + "##FID]",
+            media_duration: item.response.file_info_list[0].media_duration, //音频时长
+          };
+          articleImgRes.push(obj);
+        }
+      });
+      this.curQue.mp3_list = JSON.parse(JSON.stringify(articleImgRes));
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    if (!this.curQue) {
+      this.initcurQue();
+    }
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scope>
+//@import url(); 引入公共css类
+.Big-Book-PurePreview {
+  &-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: 200px;
+    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;
+    margin-bottom: 15px;
+  }
+  .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;
+  }
+  .close {
+    width: 24px;
+    cursor: pointer;
+  }
+  .xorl {
+    display: flex;
+    align-items: center;
+    margin-top: 5px;
+    > :nth-child(1) {
+      margin-right: 33px;
+    }
+  }
+  .main {
+    width: 780px;
+    min-height: 251px;
+    background: #f2f2f2;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    box-sizing: border-box;
+    border-radius: 8px;
+    padding: 24px 20px;
+    .row {
+      display: flex;
+      .col {
+        width: 732px;
+        margin: 0 4px;
+        .td {
+          width: 100%;
+          background: #ffffff;
+          border: 1px solid rgba(0, 0, 0, 0.1);
+          box-sizing: border-box;
+          border-radius: 8px;
+          min-height: 48px;
+          display: flex;
+          align-items: center;
+          padding: 8px 12px;
+          > div {
+            margin: 0 8px;
+            flex: 1;
+            > :nth-child(1) {
+              margin-bottom: 8px;
+            }
+          }
+          > span {
+            display: inline-block;
+            width: 16px;
+            height: 16px;
+            color: white;
+            background: #de4444;
+            border-radius: 50%;
+            text-align: center;
+            font-size: 12px;
+            line-height: 16px;
+          }
+        }
+        > p {
+          width: 100%;
+          text-align: center;
+          span {
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+  .Module {
+    .Modulemain {
+      display: flex;
+    }
+  }
+}
+</style>
+<style lang="scss">
+</style>

src/components/Adult/preview/InputHasRecord.vue

@@ -68,7 +68,7 @@ export default {
     }
     .luyin-box{
         justify-content: start;
-        padding: 4px 8px;
+        padding: 4px 12px;
         height: 40px;
         width: 280px;
         justify-content: flex-start;

src/components/Adult/preview/NewWordShow.vue

@@ -0,0 +1,155 @@
+<!--  -->
+<template>
+  <div class="Big-Book-prev-Textdes NewWordShow" v-if="curQue">
+      <div class="item-box">
+          <div class="item" v-for="(item,index) in curQue.option" :key="index">
+              <p v-if="item.pinyin">{{item.pinyin}}</p>
+              <div class="con-box">
+                  <template v-if="item.imgOrText=='text'">
+                    <div
+                        :key="conindex"
+                        class="strockplay"
+                        v-for="(conItem, conindex) in item.con"
+                        @click="handleShow(conItem)"
+                    >
+                        <Strockplayredline
+                            :Book_text="conItem"
+                            :playStorkes="true"
+                            :targetDiv="'bwcHanziIntp' + conItem + conindex"
+                        />
+                        <div
+                            class="bwc-line"
+                            v-if="conindex < item.con.length - 1"
+                        ></div>
+                    </div>
+                </template>
+                <template v-else>
+                    <div class="img-box" v-for="(imgItem,imgIndex) in item.img_list" :key="imgIndex">
+                        <el-image
+                            :src="imgItem.url"
+                            fit="scale-down"
+                            class="img_url"
+                        >
+                            <div slot="placeholder" class="image-slot">
+                                <img src="../../../assets/common/icon-imgloading.png" />
+                            </div>
+                        </el-image>
+                    </div>
+                </template>
+              </div>
+          </div>
+      </div>
+  </div>
+</template>
+
+<script>
+import Strockplayredline from "../preview/components/Strockplayredline.vue";
+export default {
+  components: {Strockplayredline},
+  props: ["curQue"],
+  data() {
+    return {
+        
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    // 处理数据
+    handleData(){
+        let _this = this
+        
+    },
+    handleShow(item){
+        alert('11')
+    }
+    
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scoped>
+//@import url(); 引入公共css类
+.NewWordShow{
+    width: 100%;
+    padding: 0 4px;
+    background: #F7F7F7;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
+    .item-box{
+        display: flex;
+        flex-flow: wrap;
+        padding-bottom: 8px;
+        .item{
+            display: flex;
+            align-items: flex-end;
+            justify-content: center;
+            flex-flow: wrap;
+            margin: 9px 20px;
+            >p{
+                color: #2C2C2C;
+                font-size: 14px;
+                line-height: 130%;
+                font-family: 'GB-PINYINOK-B';
+                width: 100%;
+                text-align: center;
+                margin: 0 0 8px 0;
+            }
+            .strockplay {
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                position: relative;
+                width: 64px;
+                height: 64px;
+            }
+            .strockplayRedInner{
+                width: 64px;
+                height: 64px;
+            }
+            .bwc-line {
+                width: 1px;
+                height: 62px;
+                background: #BF875E;
+            }
+        }
+        .con-box{
+            display: flex;
+            border: 1px solid #BF875E;
+            border-radius: 8px;
+            overflow: hidden;
+            .img-box{
+                background: url('../../../assets/NPC/chinaTianYellow.png') center no-repeat;
+                background-size: cover;
+                .img_url{
+                    width: 64px;
+                    height: 64px;
+                }
+            }
+        }
+    }
+}
+</style>
+<style lang="scss">
+.NewWordShow{
+    .strock-play-box{
+        width: 16px;
+        height: 16px;
+        right: -1px;
+        background: url('../../../assets/NPC/strock-play-yellow-click.png') center no-repeat;
+        background-size: cover;
+    }
+}
+</style>

src/components/Adult/preview/NumberSelectHasRecord.vue

@@ -175,7 +175,7 @@ export default {
                 font-family: 'FZJCGFKTK';
             }
             .luyin-box{
-                width: 68px;
+                width: 64px;
                 height: 32px;
                 border: 1px solid rgba(0, 0, 0, 0.1);
                 border-radius: 8px;

src/components/Adult/preview/Picture.vue

@@ -300,7 +300,7 @@ export default {
                 .luyin-box{
                     flex: 1;
                     justify-content: start;
-                    padding-left: 8px;
+                    padding-left: 12px;
                     border: 1px solid rgba(0, 0, 0, 0.1);
                     border-radius: 8px;
                 }

src/components/Adult/preview/SelectYinjie.vue

@@ -0,0 +1,42 @@
+<!--  -->
+<template>
+  <div class="Big-Book-prev-Textdes SelectYinjie" v-if="curQue">
+      <div class="item-box" v-for="(item,index) in curQue.option" :key="index">
+          
+      </div>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: ["curQue"],
+  data() {
+    return {
+        
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scoped>
+//@import url(); 引入公共css类
+
+</style>

src/components/Adult/preview/SentenceInput.vue

@@ -5,11 +5,47 @@
     {{dataType}}
     <ul>
       <li v-for="(items, indexs) in curQue.option" :key="indexs">
+          <b v-if="items.number">{{ items.number }}.</b>
           <p :class="[oldsrc==items.mp3_list[0].url?palyClass:'']" @click="handlePlayVoice(items.mp3_list[0].url)" v-if="items.mp3_list&&items.mp3_list.length>0">
           </p>
-          <b v-if="items.number">{{ items.number }}.</b>
-          <span class="item-con">{{items.con}}</span>
-          <template v-if="curQue.ChildType=='sentence_answer'">
+          <!-- 句子内容 -->
+          <div class="item-content">
+              <!-- 如果不是填空题 不替换 -->
+              <template v-if="dataType.indexOf('sentence_input_chs')==-1">
+                  <template v-if="items.detail.wordsList.length==0">
+                      <p :class="['content-con']" v-if="items.detail.sentence">{{items.detail.sentence}}</p>
+                  </template>
+                  <template v-else>
+                      <div class="con-box">
+                          <div :class="['con-item',indexCon===0?'con-item-0':'']" v-for="(itemCon,indexCon) in items.detail.resArr" :key="indexCon" v-show="itemCon.isShow">
+                              <template v-if="items.detail.wordsList[indexCon + 1] && items.detail.wordsList[indexCon + 1].chs && chsFhList.indexOf(items.detail.wordsList[indexCon + 1].chs) > -1">
+                                  <div class="synthesis-box">
+                                      <div>
+                                            <span class="pinyin">{{itemCon.pinyin}}</span>
+                                            <span class="hanzi content-con">{{itemCon.chs}}</span>
+                                        </div>
+                                        <div style="text-align: left">
+                                            <span class="pinyin">{{items.detail.wordsList[indexCon + 1].pinyin}}</span>
+                                            <span class="hanzi content-con">{{items.detail.wordsList[indexCon + 1].chs}}</span>
+                                        </div>
+                                  </div>
+                                  
+                              </template>
+                              <template v-else>
+                                    <span class="pinyin">{{itemCon.pinyin}}</span>
+                                    <span class="hanzi content-con">{{itemCon.chs}}</span>
+                              </template>
+                          </div>
+                      </div>
+                  </template>
+                  <b class="content-en" v-if="items.en">{{items.en}}</b>
+              </template>
+              <template v-else>
+                  
+                  
+              </template>
+          </div>
+          <template v-if="dataType.indexOf('sentence_answer_chs')>-1">
             <input
                     @input="handleInput"
                     :class="['item-input']"
@@ -17,14 +53,14 @@
                     placeholder="输入"
                 >
           </template>
-          <template v-if="curQue.ChildType=='sentence_judge'">
+          <template v-if="dataType.indexOf('sentence_judge_chs')>-1">
             <div class="judge-box">
                 <a :class="['right-btn',curQue.Bookanswer[indexs]=='right'?'active':'']" @click="handleSelectJudge('right',indexs)"></a>
                 <a :class="['error-btn',curQue.Bookanswer[indexs]=='error'?'active':'']" @click="handleSelectJudge('error',indexs)"></a>
             </div>
           </template>
-          <template v-if="curQue.ChildType=='sentence_Record'">
-              <Soundrecord @handleWav="handleWav" type="mini" class="luyin-box"/>
+          <template v-if="dataType.indexOf('sentence_record_chs')>-1">
+              <Soundrecord @handleWav="handleWav" type="mini" class="luyin-box" v-if="items.IsRecord"/>
           </template>
       </li>
     </ul>
@@ -42,6 +78,7 @@ export default {
         oldsrc: '', // 存储播放音频的src 用来比对是否点击的是同一个音频
         palyClass: '',
         dataType: [], // 题型
+        chsFhList: ["，", "。", "“", "：", "》", "《", "？", "！", "；"],
     };
   },
   computed: {},
@@ -86,12 +123,52 @@ export default {
                     _this.dataType.push(item.type)
                 }
             })
+            let curQue = JSON.parse(JSON.stringify(this.curQue));
+            curQue.option.forEach((dItem, dIndex) => {
+                let paraArr = []
+                dItem.detail.wordsList.forEach((sItem, sIndex) => {
+                    this.mergeWordSymbol(dItem.detail.wordsList, sItem, sIndex);
+                    let obj = {
+                        pinyin: sItem.pinyin,
+                        chs: sItem.chs,
+                        isShow: sItem.isShow,
+                    };
+                    paraArr.push(obj);
+                })
+                this.$set(_this.curQue.option[dIndex].detail,'resArr',paraArr)
+                if(paraArr.length==0){
+                    let str = '就那天___'
+                    let arrs = str.split(/_{2,}/g)
+                    
+                }
+            })
+        },
+        //词和标点合一起
+        mergeWordSymbol(sItem, wItem, curIndex) {
+            let leg = sItem.length;
+            if (curIndex < leg - 1) {
+                if (this.chsFhList.indexOf(wItem.chs) > -1) {
+                    wItem.isShow = false;
+                } else {
+                    wItem.isShow = true;
+                }
+            }
         },
         // 判断题选择
         handleSelectJudge(obj,index){
             this.$set(this.curQue.Bookanswer, index, obj);
         },
+        handleWav(data) {
         
+        },
+        handleDatas (str, type) {
+            str = str.trim();
+            str = str.replace(/_{2,}/g, "^ ");
+            str =
+                type == "hanzi" ? str.replace(/\s+/g, "") : str.replace(/\s+/g, " ");
+            let resArr = type == "hanzi" ? str.split("") : str.split(/\s+/);
+            return resArr;
+        },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {
@@ -168,15 +245,50 @@ export default {
                     background-size: 24px;
                 }
             }
-            .item-con{
+            .item-content{
                 flex: 1;
-                font-size: 16px;
-                line-height: 150%;
-                color: #000000;
-                margin-right: 8px;
-                word-break: break-word;
-                // margin-top: 4px;
-                font-family: 'FZJCGFKTK';
+                .content-con{
+                    font-size: 20px;
+                    line-height: 150%;
+                    color: #000000;
+                    font-family: 'FZJCGFKTK';
+                    margin: 0;
+                    &.content-con-small{
+                        font-size: 16px;
+                    }
+                }
+                .content-en{
+                    font-weight: normal;
+                    font-size: 16px;
+                    line-height: 150%;
+                    color: #000000;
+                    font-family: 'robot';
+                }
+                .con-box{
+                    display: flex;
+                    flex-flow: wrap;
+                    .con-item{
+                        text-align: center;
+                        padding: 0 3px;
+                        &.con-item-0{
+                            text-align: left;
+                            padding-left: 0;
+                        }
+                    }
+                    span{
+                        display: block;
+                    }
+                    .pinyin{
+                        font-family: 'GB-PINYINOK-B';
+                        font-size: 14px;
+                        line-height: 130%;
+                        color: #000000;
+                        height: 18px;
+                    }
+                    .synthesis-box{
+                        display: flex;
+                    }
+                }
             }
             input{
                 width: 68px;
@@ -219,7 +331,7 @@ export default {
             .luyin-box{
                 border: 1px solid rgba(0, 0, 0, 0.1);
                 border-radius: 8px;
-                width: 68px;
+                width: 64px;
             }
         }
     }

src/components/Adult/preview/Single.vue

@@ -1,68 +1,91 @@
 <!--  -->
 <template>
-  <div class="Big-Book-prev-Textdes" v-if="curQue">
-    <p v-if="curQue.con" v-html="curQue.con"></p>
-    <p v-if="curQue.con" v-html="curQue.english"></p>
-    <ul v-if="curQue.option">
-      <li v-for="(item, index) in curQue.option" :key="item.id">
-        <template v-if="curQue.type == 'single'">
-          <el-radio
-            v-model="item.isAnswer"
-            :label="index"
-            style="margin-right: 0"
-          >
-            {{ item.con }}
-          </el-radio>
-        </template>
-        <template v-if="curQue.type == 'checkbox'">
-          <el-checkbox v-model="item.isAnswer" :label="index">
-            {{ item.con }}
-          </el-checkbox>
-        </template>
-        <ul v-if="item.img_list && item.img_list.length > 0" class="imglist">
-          <li v-for="it in item.img_list" :key="it.id">
-            <img :src="it.url" class="img" />
-          </li>
+  <div class="Big-Book-prev-Textdes NNPE-single" v-if="curQue">
+    <div v-for="(itemI,indexI) in curQue" :key="indexI">
+        <div class="stem-box">
+            <b v-if="itemI.topicNumber">{{itemI.topicNumber}}.</b>
+            <p v-if="itemI.topic.con" :class="[/^[\u4e00-\u9fa5]/.test(itemI.topic.con)?'hasCn':'']">{{itemI.topic.con}}</p>
+            <Audio
+                :mp3="
+                itemI.topic.mp3_list.length > 0 ? itemI.topic.mp3_list[0].url : ''"
+                class="audio-play"
+            />
+            <div v-for="(itemss,indexss) in itemI.topic.img_list" :key="indexss">
+                <el-image
+                    :src="itemss.url"
+                    fit="scale-down"
+                    class="img_url"
+                >
+                    <div slot="placeholder" class="image-slot">
+                        <img src="../../../assets/common/icon-imgloading.png" />
+                    </div>
+                </el-image>
+            </div>
+        </div>
+        <ul v-if="itemI.option">
+        <li v-for="(item, index) in itemI.option" :key="index" :class="['option'+itemI.numberList.con,single[indexI]===index?'active':'']">
+            <el-radio
+                v-model="single[indexI]"
+                :label="index"
+                style="margin-right: 0"
+            >
+                <span v-if="item.number">{{item.number}}.</span>
+                <p :class="[item.font=='py'?'hasPinyin':item.font=='en'?'hasEn':item.font=='cn'?'hasCn':'']">{{ item.con }}</p>
+                <div v-for="(itemss,indexss) in item.img_list" :key="indexss">
+                    <el-image
+                        :src="itemss.url"
+                        fit="scale-down"
+                        class="img_urls"
+                    >
+                        <div slot="placeholder" class="image-slot">
+                            <img src="../../../assets/common/icon-imgloading.png" />
+                        </div>
+                    </el-image>
+                </div>
+            </el-radio>
+            <!-- <template v-if="curQue.type == 'checkbox'">
+            <el-checkbox v-model="single" :label="index">
+                {{ item.con }}
+            </el-checkbox>
+            </template> -->
+        </li>
         </ul>
-        <ul v-if="item.mp3_list && item.mp3_list.length > 0" class="audioList">
-          <li
-            v-for="(it, itindex) in item.mp3_list"
-            :key="it.id + itindex"
-            @click="playAudio(it, index)"
-          >
-            <img src="../../../assets/adult/Dialogue-audio.png" alt="" />
-            <span>3s</span>
-            <audio
-              :id="it.name + itindex"
-              v-if="item.mp3_list.length > 0"
-              :src="it.url"
-            ></audio>
-          </li>
-        </ul>
-      </li>
-    </ul>
-
+        <Soundrecord @handleWav="handleWav" type="pro" class="luyin-box" v-if="itemI.IsRecord"/>
+    </div>
+    
   </div>
 </template>
 
 <script>
+import Soundrecord from "../preview/Soundrecord.vue"; // 录音模板
+import Audio from "../preview/components/AudioRed.vue"; // 音频播放
 export default {
-  components: {},
+  components: {Soundrecord, Audio},
   props: ["curQue"],
   data() {
-    return {};
+    return {
+        single:[]
+    };
   },
   computed: {},
   watch: {},
   //方法集合
   methods: {
-    playAudio(item, index) {
-      let audio = document.getElementById(`${item.name}${index}`);
-      audio.play();
+    // 处理数据
+    handleData(){
+        let _this = this
+        _this.curQue.forEach(item => {
+            _this.single.push(null)
+        });
+    },
+    handleWav(data) {
+        
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
-  created() {},
+  created() {
+      this.handleData()
+  },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前
@@ -79,38 +102,136 @@ export default {
 ul {
   list-style: none;
   margin: 0;
-  li {
-    margin-bottom: 10px;
-  }
-}
-.imglist {
   display: flex;
-  img {
-    margin-left: 2px;
+  justify-content: start;
+  flex-flow: wrap;
+  li {
+    padding: 8px 16px;
+    border-radius: 4px;
+    &:hover,&.active{
+        background: #fff;
+    }
+    &.option1{
+        width: 100%;
+    }
+    &.option2{
+        width: 50%;
+    }
+    &.option3{
+        width: 33.33%;
+    }
+    &.option4{
+        width: 25%;
+    }
+    .el-radio{
+        width: 100%;
+    }
   }
 }
-.audioList {
-  display: flex;
-  > li {
-    width: 144px;
-    height: 40px;
-    background: #ffffff;
+.Big-Book-prev-Textdes{
+    width: 100%;
+    background: #F7F7F7;
     border: 1px solid rgba(0, 0, 0, 0.1);
-    box-sizing: border-box;
-    border-radius: 4px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 0 8px;
-    img {
-      width: 24px;
-      height: 24px;
-    }
-    cursor: pointer;
-    margin-right: 10px;
-  }
+    padding: 24px;
+    border-radius: 8px;
+    >div{
+        margin-bottom: 16px;
+    }
+    .stem-box{
+        display: flex;
+        align-items: flex-start;
+        justify-content: flex-start;
+        margin-bottom: 8px;
+        .audio-play{
+            width: 24px;
+            margin-left: 4px;
+        }
+        b{
+            font-size: 16px;
+            font-weight: normal;
+            line-height: 24px;
+        }
+        p{
+            margin: 0 0 0 8px;
+            color: #000000;
+            font-size: 16px;
+            line-height: 24px;
+        }
+    }
+    .hasCn{
+        font-family: 'FZJCGFKTK';
+    }
+    .hasPinyin{
+        font-family: 'GB-PINYINOK-B';
+    }
+    .hasEn{
+        font-family: 'robot';
+    }
+    .luyin-box{
+        width: 200px;
+        height: 32px;
+        background: #FFFFFF;
+        border: 1px solid rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+        border-radius: 8px;
+        padding: 8px 12px;
+        margin-top: 16px;
+    }
+    .img_url{
+        width: 380px;
+        height: 265px;
+        background: #FFFFFF;
+        border: 1px solid rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+        border-radius: 8px;
+        margin-left: 24px;
+    }
+    .img_urls{
+        margin-left: 5px;
+        width: 100%;
+        height: 221px;
+        background: #FFFFFF;
+        border: 1px solid rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+        border-radius: 8px;
+    }
 }
-.img {
-  width: 200px;
+</style>
+<style lang="scss">
+.NNPE-single{
+    .el-radio{
+        display: flex;
+        align-items: flex-start;
+    }
+    .el-radio__label{
+        color: #000;
+        font-size: 16px;
+        line-height: 150%;
+        font-weight: normal;
+        display: flex;
+        align-items: flex-start;
+    }
+    .el-radio__input.is-checked+.el-radio__label{
+        color: #000;
+    }
+    .el-radio__inner::after{
+        width: 8px;
+        height: 8px;
+    }
+    .el-radio__label{
+        span{
+            font-family: 'FZJCGFKTK';
+            margin-right: 4px;
+        }
+        p{
+            margin: 0;
+        }
+    }
+    .el-radio__inner{
+        width: 16px;
+        height: 16px;
+        margin-top: 4px;
+        margin-right: 2px;
+    }
 }
 </style>

src/components/Adult/preview/Soduko.vue

@@ -5,7 +5,7 @@
           <div class="item-box">
             <div :class="['item']" v-for="(item,index) in curQue.option" :key="index">
                 <div v-for="(items,indexs) in item" :key="indexs" 
-                    :class="[indexs%3==2?'noBorder':'',indexs>5?'noBorder-bottom':'',index==seletcItem[0]&&indexs==seletcItem[1]?'active':'',styleList[index][indexs]]">
+                    :class="[indexs%3==2?'noBorder':'',indexs>5?'noBorder-bottom':'',index==seletcItem[0]&&indexs==seletcItem[1]?'active':'',styleList[index][indexs],items.isHint?'notClick':'canClick']">
                     <span v-if="items.isHint">
                         {{items.value}}
                     </span>
@@ -48,6 +48,7 @@ export default {
       handleData(){
           let _this = this
           _this.soduko = []
+          _this.seletcItem = []
           _this.styleList = []
           _this.curQue.option.forEach(item => {
               let arr = []
@@ -155,12 +156,12 @@ export default {
                     // border-bottom: none;
                     margin-bottom: 0px;
                 }
-                &.active{
-                    border-color: #0086FF;
-                }
-                &:hover{
+                &.canClick:hover{
                     border-color: #737373;
                 }
+                &.canClick.active{
+                    border-color: #0086FF;
+                }
                 &.right{
                     background: #F5FFF9;
                     border-color: #F5FFF9;
@@ -193,7 +194,7 @@ export default {
                     background: initial;
                     line-height: 58px;
                     margin: 0;
-                    
+                    cursor: pointer;
                 }
             }
         }

src/components/Adult/preview/Soundrecord.vue

@@ -11,6 +11,7 @@
           'record-time',
           microphoneStatus ? 'record-ing' : '',
           selectIndex || selectIndex == 0 ? 'record-black' : '',
+          type && type == 'normal'?'record-time-flex':''
         ]"
         v-if="type && type == 'normal'"
         >{{ isPlaying ? "-" : "" }}{{ handleDateTime(recordtime) }}</span
@@ -272,9 +273,15 @@ export default {
       if (this.selectIndex || this.selectIndex == 0) {
         this.recordList.splice(this.selectIndex, 1);
         this.selectIndex =
-          this.recordList.length > 1 ? this.recordList.length - 1 : null;
-        this.hasMicro = "";
-        this.recordtime = 0;
+        this.recordList.length > 0 ? this.recordList.length - 1 : null;
+        this.hasMicro = this.recordList.length > 0 ? "normal" :"";
+        this.recordtime = this.recordList.length > 0 ? this.recordList[this.selectIndex].toltime :0;
+        this.audio.pause()
+        this.audio = new window.Audio()
+        this.wavblob = this.recordList.length > 0 ? this.recordList[this.selectIndex].wavData : null;
+        this.oldIndex = null;
+        this.isPlaying = false;
+        clearInterval(this.timer);
       }
     },
   },
@@ -323,9 +330,9 @@ export default {
   // border: 1px solid rgba(0, 0, 0, 0.1);
   // border-radius: 8px;
   .playBack {
-    width: 24px;
-    height: 24px;
-    margin-left: 4px;
+    width: 16px;
+    height: 16px;
+    margin-left: 8px;
     background: url("../../../assets/newImage/common/luyin-play.png") center
       no-repeat;
     background-size: 100%;
@@ -349,8 +356,8 @@ export default {
     margin-left: 8px;
   }
   .record {
-    width: 24px;
-    height: 24px;
+    width: 16px;
+    height: 16px;
     background: url("../../../assets/newImage/common/luyin.png") center
       no-repeat;
     background-size: 100%;
@@ -358,33 +365,37 @@ export default {
     &.active {
       background: url("../../../assets/newImage/common/luyin-active.png") center
         no-repeat;
-      background-size: 16px;
+      background-size: 100%;
     }
     &.active:hover {
       background: url("../../../assets/newImage/common/luyin-stop.png") center
         no-repeat;
-      background-size: 16px;
+      background-size: 100%;
     }
   }
   .record-time {
     color: rgba(0, 0, 0, 0.3);
     font-size: 16px;
     line-height: 150%;
-    margin-left: 4px;
+    margin-left: 8px;
+    font-family: 'robot';
     &.record-black {
       color: #000000;
     }
     &.record-ing {
       color: #de4444;
     }
+    &.record-time-flex{
+        flex: 1;
+    }
   }
   .el-select {
     margin-left: 8px;
   }
   .record-delete {
-    width: 24px;
-    height: 24px;
-    // margin-left: 4px;
+    width: 16px;
+    height: 16px;
+    margin-left: 8px;
     background: url("../../../assets/newImage/common/luyin-delete.png") center
       no-repeat;
     background-size: 100%;

src/components/Adult/preview/TextInputRecord.vue

@@ -129,10 +129,10 @@ export default {
             .luyin-box{
                 border: 1px solid rgba(0, 0, 0, 0.1);
                 border-radius: 8px;
-                width: 292px;
+                width: 280px;
                 height: 40px;
                 margin-left: 8px;
-                padding: 0 8px;
+                padding: 0 12px;
             }
         }
     }

src/components/Adult/preview/TextProblem.vue

@@ -0,0 +1,182 @@
+<!--  -->
+<template>
+  <div class="Big-Book-prev-Textdes Textproblem" v-if="curQue">
+      <h2 v-if="curQue.title">{{curQue.title}}</h2>
+      <ul>
+          <li v-for="(item,index) in curQue.option" :key="index">
+              <b v-if="item.number">{{item.number}}.</b>
+              <div class="content-right">
+                  <template v-if="item.detail.wordsList.length>0">
+                      <div class="con-box">
+                          <div :class="['con-item',indexCon===0?'con-item-0':'']" v-for="(itemCon,indexCon) in item.detail.resArr" :key="indexCon" v-show="itemCon.isShow">
+                              <template v-if="item.detail.wordsList[indexCon + 1] && item.detail.wordsList[indexCon + 1].chs && chsFhList.indexOf(item.detail.wordsList[indexCon + 1].chs) > -1">
+                                  <div class="synthesis-box">
+                                      <div>
+                                            <span class="pinyin" v-if="item.detail.pyPosition=='top'">{{itemCon.pinyin}}</span>
+                                            <span class="hanzi content-con">{{itemCon.chs}}</span>
+                                            <span class="pinyin" v-if="item.detail.pyPosition=='bottom'">{{itemCon.pinyin}}</span>
+                                        </div>
+                                        <div style="text-align: left">
+                                            <span class="pinyin" v-if="item.detail.pyPosition=='top'">{{item.detail.wordsList[indexCon + 1].pinyin}}</span>
+                                            <span class="hanzi content-con">{{item.detail.wordsList[indexCon + 1].chs}}</span>
+                                            <span class="pinyin" v-if="item.detail.pyPosition=='bottom'">{{item.detail.wordsList[indexCon + 1].pinyin}}</span>
+                                        </div>
+                                  </div>
+                                  
+                              </template>
+                              <template v-else>
+                                    <span class="pinyin" v-if="item.detail.pyPosition=='top'">{{itemCon.pinyin}}</span>
+                                    <span class="hanzi content-con">{{itemCon.chs}}</span>
+                                    <span class="pinyin" v-if="item.detail.pyPosition=='bottom'">{{itemCon.pinyin}}</span>
+                              </template>
+                          </div>
+                      </div>
+                  </template>
+                  <template v-else>
+                      <p class="hanzi content-con">
+                          {{item.detail.sentence}}
+                      </p>
+                  </template>
+                  <span class="english" v-if="item.en">{{item.en}}</span>
+              </div>
+          </li>
+      </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {},
+  props: ["curQue"],
+  data() {
+    return {
+        chsFhList: ["，", "。", "“", "：", "》", "《", "？", "！", "；"],
+    };
+  },
+  computed: {},
+  watch: {},
+  //方法集合
+  methods: {
+    // 处理数据
+    handleData(){
+        let _this = this
+        let curQue = JSON.parse(JSON.stringify(this.curQue));
+        curQue.option.forEach((dItem, dIndex) => {
+            let paraArr = []
+            dItem.detail.wordsList.forEach((sItem, sIndex) => {
+                this.mergeWordSymbol(dItem.detail.wordsList, sItem, sIndex);
+                let obj = {
+                    pinyin: sItem.pinyin,
+                    chs: sItem.chs,
+                    isShow: sItem.isShow,
+                };
+                paraArr.push(obj);
+            })
+            this.$set(_this.curQue.option[dIndex].detail,'resArr',paraArr)
+        })
+    },
+    //词和标点合一起
+    mergeWordSymbol(sItem, wItem, curIndex) {
+        let leg = sItem.length;
+        if (curIndex < leg - 1) {
+            if (this.chsFhList.indexOf(wItem.chs) > -1) {
+                wItem.isShow = false;
+            } else {
+                wItem.isShow = true;
+            }
+        }
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+      this.handleData()
+  },
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='scss' scoped>
+//@import url(); 引入公共css类
+.Textproblem{
+    width: 100%;
+    padding: 8px 24px;
+    background: #F7F7F7;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
+    h2{
+        margin: 16px 0 0;
+        font-weight: 500;
+        font-size: 16px;
+        line-height: 24px;
+        color: #000000;
+    }
+    ul{
+        padding-top: 16px;
+        li{
+            display: flex;
+            margin-bottom: 16px;
+            b{
+                color: rgba(0, 0, 0, 0.85);
+                font-size: 16px;
+                line-height: 24px;
+                font-family: 'FZJCGFKTK';
+                margin-right: 4px;
+                font-weight: normal;
+            }
+            .content-right{
+                flex: 1;
+                .content-con{
+                    font-size: 16px;
+                    line-height: 24px;
+                    color: #000000;
+                    font-family: 'FZJCGFKTK';
+                    margin: 0;
+                    &.content-con-small{
+                        font-size: 16px;
+                    }
+                }
+                .con-box{
+                    display: flex;
+                    flex-flow: wrap;
+                    .con-item{
+                        text-align: center;
+                        padding: 0 1px;
+                        &.con-item-0{
+                            text-align: left;
+                            padding-left: 0;
+                        }
+                    }
+                    span{
+                        display: block;
+                    }
+                    .pinyin{
+                        font-family: 'GB-PINYINOK-B';
+                        font-size: 12px;
+                        line-height: 20px;
+                        color: #000000;
+                        height: 20px;
+                    }
+                    .synthesis-box{
+                        display: flex;
+                    }
+                }
+                .english{
+                    color: rgba(0, 0, 0, 0.85);
+                    font-size: 14px;
+                    line-height: 150%;
+                    font-family: 'robot';
+                    display: block;
+                    word-break: break-word;
+                }
+            }
+        }
+    }
+}
+</style>

src/components/Adult/preview/components/Strockplayredline.vue

@@ -48,9 +48,10 @@ export default {
         }
       );
     },
-    playHanzi() {
+    playHanzi(event) {
       let _this = this;
       _this.writer.animateCharacter();
+      event.stopPropagation();
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）

src/views/adultInput3.vue

@@ -290,13 +290,12 @@
                       </template>
                       <template v-else> </template>
                     </template>
+
                     <template
                       v-if="
                         topicIitem.type == 'text_problem_chs' ||
                         topicIitem.type == 'newWord_preview_chs' ||
-                        topicIitem.type ==
-                          'listen_record_single_syllable_chs' ||
-                        topicIitem.type == 'zi_transverse_line_chs'
+                        topicIitem.type == 'listen_record_single_syllable_chs'
                       "
                     >
                       <template v-if="topicIitem.is_edit">
@@ -309,6 +308,41 @@
                       </template>
                       <template v-else> </template>
                     </template>
+                    <template
+                      v-if="topicIitem.type == 'zi_transverse_line_chs'"
+                    >
+                      <template v-if="topicIitem.is_edit">
+                        <ZiLine
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
+                    <template v-if="topicIitem.type == 'select_input_chs'">
+                      <template v-if="topicIitem.is_edit">
+                        <SelectInpue
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
+                    <template v-if="topicIitem.type == 'play_input_record_chs'">
+                      <template v-if="topicIitem.is_edit">
+                        <PlayInputReacord
+                          :curQue="topicIitem.data"
+                          :type="topicIitem.type"
+                          :fn_data="fn_data"
+                          :changeCurQue="changeCurQue"
+                        />
+                      </template>
+                      <template v-else> </template>
+                    </template>
                   </div>
                   <div
                     class="addoption"
@@ -432,6 +466,10 @@ import ToneSelect from "@/components/Adult/inputModules/ToneSelect.vue";
 import NumberCombination from "@/components/Adult/inputModules/NumberCombination.vue";
 import ImageQuestion from "@/components/Adult/inputModules/ImageQuestion.vue";
 import PurePreview from "@/components/Adult/inputModules/PurePreview.vue";
+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 Textdes from "@/components/Adult/inputModules/Textdes.vue";
 import Record from "@/components/Adult/inputModules/Record.vue";
@@ -500,6 +538,9 @@ export default {
     ToneSelect,
     ImageQuestion,
     PurePreview,
+    ZiLine,
+    SelectInpue,
+    PlayInputReacord,
   },
   data() {
     return {