生词序号自定义

src/components/Adult/common/NewordPhraseModule.vue

@@ -4,13 +4,12 @@
     <div class="Big-Book-content m">
       <div class="Big-Book-main2">
         <div class="adult-book-input-item">
-          <span class="adult-book-lable">汉字：</span>
+          <span class="adult-book-lable">序号：</span>
           <el-input
-            placeholder="请输入汉字"
-            v-model="curQueItem.new_word"
-            @blur="onBlur(curQueItem, 'new_word')"
+            placeholder="请输入序号"
+            v-model="curQueItem.number"
+            @blur="onBlur(curQueItem, 'number')"
             class="adult-book-input"
-            :autosize="{ minRows: 2 }"
             maxlength="200"
             show-word-limit
           ></el-input>
@@ -33,6 +32,18 @@
           >
         </div>
         <div class="adult-book-input-item">
+          <span class="adult-book-lable">汉字：</span>
+          <el-input
+            placeholder="请输入汉字"
+            v-model="curQueItem.new_word"
+            @blur="onBlur(curQueItem, 'new_word')"
+            class="adult-book-input"
+            :autosize="{ minRows: 2 }"
+            maxlength="200"
+            show-word-limit
+          ></el-input>
+        </div>
+        <div class="adult-book-input-item">
           <span class="adult-book-lable">星号标识：</span>
           <el-radio-group v-model="curQueItem.starFlag" @change="forupdata">
             <el-radio :label="true">需要</el-radio>

src/components/Adult/inputModules/Neword.vue

@@ -15,45 +15,46 @@
           show-word-limit
         ></el-input>
       </div> -->
-      <SentenceSegwordChs :curQue="curQue.conDetail" name='标题' :type="'NewWord_chs'" />
+      <SentenceSegwordChs
+        :curQue="curQue.conDetail"
+        name="标题"
+        :type="'NewWord_chs'"
+      />
       <div class="adult-book-input-item">
-        <span class="adult-book-lable">标题颜色：</span>  
+        <span class="adult-book-lable">标题颜色：</span>
         <div class="adult-book-main">
           <el-radio-group v-model="curQue.titleBg">
             <el-radio label="white">白色</el-radio>
-            <el-radio label="themeColor">书的主题色</el-radio> </el-radio-group
-          >  
+            <el-radio label="themeColor">书的主题色</el-radio>
+          </el-radio-group>
         </div>
       </div>
       <div class="adult-book-input-item">
-        <span class="adult-book-lable">详细信息：</span>  
+        <span class="adult-book-lable">详细信息：</span>
         <div class="adult-book-main">
           <el-radio-group v-model="curQue.isInfor">
             <el-radio :label="true">有</el-radio>
-            <el-radio :label="false">没有</el-radio> </el-radio-group
-          >  
+            <el-radio :label="false">没有</el-radio>
+          </el-radio-group>
         </div>
-              
       </div>
       <div class="adult-book-input-item">
-        <span class="adult-book-lable">预览展开：</span>  
+        <span class="adult-book-lable">预览展开：</span>
         <div class="adult-book-main">
           <el-radio-group v-model="curQue.isWordShow">
             <el-radio :label="true">是</el-radio>
-            <el-radio :label="false">否</el-radio> </el-radio-group
-          >  
+            <el-radio :label="false">否</el-radio>
+          </el-radio-group>
         </div>
-              
       </div>
       <div class="adult-book-input-item">
-        <span class="adult-book-lable">汉字换行：</span>  
+        <span class="adult-book-lable">汉字换行：</span>
         <div class="adult-book-main">
           <el-radio-group v-model="curQue.whiteSpace">
             <el-radio :label="true">是</el-radio>
-            <el-radio :label="false">否</el-radio> </el-radio-group
-          >  
+            <el-radio :label="false">否</el-radio>
+          </el-radio-group>
         </div>
-              
       </div>
       <div class="adult-book-input-item">
         <span class="adult-book-lable">题目音频：</span>
@@ -108,24 +109,24 @@
         style="border-bottom: 1px #ccc solid; margin-bottom: 20px"
       >
         <div class="Big-Book-mian-op">
-            <span>{{'第'+(index+1)+'组'}}   </span>
-            <el-button
-                type="primary"
-                size="small"
-                icon="el-icon-top"
-                @click="moveElement(item, index, 'up')"
-                >上移</el-button
-            >
-            <el-button
-                type="primary"
-                size="small"
-                icon="el-icon-bottom"
-                @click="moveElement(item, index, 'down')"
-                >下移</el-button
-            >
-            <el-button size="mini" type="danger" @click="delsItem(index)">
+          <span>{{ "第" + (index + 1) + "组" }} </span>
+          <el-button
+            type="primary"
+            size="small"
+            icon="el-icon-top"
+            @click="moveElement(item, index, 'up')"
+            >上移</el-button
+          >
+          <el-button
+            type="primary"
+            size="small"
+            icon="el-icon-bottom"
+            @click="moveElement(item, index, 'down')"
+            >下移</el-button
+          >
+          <el-button size="mini" type="danger" @click="delsItem(index)">
             删除本组
-            </el-button>
+          </el-button>
         </div>
         <div
           class="Big-Book-main-inner"
@@ -174,13 +175,13 @@ export default {
         type: "NewWord_chs",
         name: "生词",
         title: "",
-        conDetail:{
+        conDetail: {
           type: "detail",
           pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
           sentence: "", //句子
           segList: [], //分词结果
           seg_words: "",
-          wordsList: [],
+          wordsList: []
         },
         isInfor: true,
         isWordShow: true,
@@ -193,6 +194,7 @@ export default {
         option: [
           [
             {
+              number: "",
               new_word: "",
               starFlag: false,
               cixing: "", //词性
@@ -202,12 +204,12 @@ export default {
               mp3_list: [],
               pinyin_site: "first", //拼音位置
               motif_color: false, //主题色
-              collocation: '', // 搭配
-              liju_list: [""], // 例句
-            },
-          ],
-        ],
-      },
+              collocation: "", // 搭配
+              liju_list: [""] // 例句
+            }
+          ]
+        ]
+      }
     };
   },
   computed: {},
@@ -226,7 +228,7 @@ export default {
       this.$confirm("确定要删除吗?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
-        type: "warning",
+        type: "warning"
       }).then(() => {
         if (this.curQue.option[index].length == 1) {
           this.$message.warning("至少剩余1个，不能全部删除");
@@ -243,7 +245,7 @@ export default {
         definition_list: [""], //需要增加词性
         pinyin: "",
         img_list: [],
-        mp3_list: [],
+        mp3_list: []
       };
       item.push(con);
     },
@@ -251,7 +253,7 @@ export default {
       this.$confirm("确定要删除吗?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
-        type: "warning",
+        type: "warning"
       }).then(() => {
         this.curQue.option.splice(index, 1);
       });
@@ -259,14 +261,14 @@ export default {
     changeMp3(fileList) {
       const articleImgList = JSON.parse(JSON.stringify(fileList));
       const articleImgRes = [];
-      articleImgList.forEach((item) => {
+      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, //音频时长
+            media_duration: item.response.file_info_list[0].media_duration //音频时长
           };
           articleImgRes.push(obj);
         }
@@ -284,13 +286,13 @@ export default {
       } else {
         getContentFile("tool-ParseLRCFile", {
           content_type: "FILE",
-          file_id: this.curQue.lrc_list[0].file_id,
+          file_id: this.curQue.lrc_list[0].file_id
         }).then(({ lrc_list }) => {
           let lrc_list_res = [];
-          lrc_list.forEach((item) => {
+          lrc_list.forEach(item => {
             let obj = {
               bg: item.begin_time,
-              ed: item.end_time,
+              ed: item.end_time
             };
             lrc_list_res.push(obj);
           });
@@ -302,8 +304,8 @@ export default {
     handleNewwordList() {
       let index = 0;
       // let option = JSO
-      this.curQue.option.map((item) => {
-        item.map((sItem) => {
+      this.curQue.option.map(item => {
+        item.map(sItem => {
           this.$set(sItem, "index", index);
           index++;
           return sItem;
@@ -313,17 +315,17 @@ export default {
       console.log(this.curQue.option);
     },
     getBase64(file) {
-      return new Promise(function (resolve, reject) {
+      return new Promise(function(resolve, reject) {
         let reader = new FileReader();
         let imgResult = "";
         reader.readAsDataURL(file);
-        reader.onload = function () {
+        reader.onload = function() {
           imgResult = reader.result;
         };
-        reader.onerror = function (error) {
+        reader.onerror = function(error) {
           reject(error);
         };
-        reader.onloadend = function () {
+        reader.onloadend = function() {
           resolve(imgResult);
         };
       });
@@ -342,9 +344,9 @@ export default {
             taskId: this.curQue.taskId,
             verseList: JSON.stringify(verseList),
             matchType: "chinese",
-            language: "ch",
+            language: "ch"
           };
-          getWordTime(data).then((res) => {
+          getWordTime(data).then(res => {
             this.curQue.wordTime = res.data.result;
             this.isWordTime = false;
           });
@@ -360,14 +362,14 @@ export default {
     // 上传音频文件
     handleChange(file, fileList) {
       let _this = this;
-      _this.getBase64(file.raw).then((res) => {
+      _this.getBase64(file.raw).then(res => {
         let base_res = res.split("base64,");
         let data = {
           fileName: file.raw.name,
           speechBase64: base_res[1],
-          language: "ch",
+          language: "ch"
         };
-        prepareTranscribe(data).then((reses) => {
+        prepareTranscribe(data).then(reses => {
           _this.$set(_this.curQue, "taskId", reses.data.taskId);
         });
       });
@@ -382,7 +384,7 @@ export default {
             duration: fileLists.media_duration,
             url: fileLists.file_url,
             id: "[FID##" + fileLists.file_id + "##FID]",
-            file_id: fileLists.file_id,
+            file_id: fileLists.file_id
           });
         }
       });
@@ -395,7 +397,11 @@ export default {
         this.curQue.option.splice(index + 1, 1);
       }
       if (type == "down" && index < this.curQue.option.length - 1) {
-        this.curQue.option[index] = this.curQue.option.splice(index + 1, 1, this.curQue.option[index])[0]
+        this.curQue.option[index] = this.curQue.option.splice(
+          index + 1,
+          1,
+          this.curQue.option[index]
+        )[0];
       }
     },
     moveElement2(dItem, type, index, index2) {
@@ -405,9 +411,13 @@ export default {
         this.curQue.option[index].splice(index2 + 1, 1);
       }
       if (type == "down" && index2 < this.curQue.option[index].length - 1) {
-        this.curQue.option[index][index2] = this.curQue.option[index].splice(index2 + 1, 1, this.curQue.option[index][index2])[0]
+        this.curQue.option[index][index2] = this.curQue.option[index].splice(
+          index2 + 1,
+          1,
+          this.curQue.option[index][index2]
+        )[0];
       }
-    },
+    }
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
@@ -443,40 +453,40 @@ export default {
       }
       if (!this.curQue.hasOwnProperty("conDetail")) {
         let obj = {
-            type: "detail",
-            pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
-            sentence: this.curQue.title, //句子
-            segList: [], //分词结果
-            seg_words: "",
-            wordsList: [],
-        }
+          type: "detail",
+          pyPosition: "top", //top 拼音在上面；bottom 拼音在下面
+          sentence: this.curQue.title, //句子
+          segList: [], //分词结果
+          seg_words: "",
+          wordsList: []
+        };
         this.$set(this.curQue, "conDetail", obj);
       }
       // let data = JSON.parse(JSON.stringify(this.curQue));
-      this.curQue.option.forEach((item) => {
+      this.curQue.option.forEach(item => {
         // if (!item[0].pinyin_site) {
         //   item[0].pinyin_site = "first"; //拼音位置
         // }
         // if (!item[0].motif_color) {
         //   item[0].motif_color = false; //主题色
         // }
-        item.forEach(items=>{
-            if(!items.hasOwnProperty("starFlag")){
-                this.$set(items, "starFlag", false);
-            }
-            if(!items.hasOwnProperty("pinyin_site")){
-                this.$set(items, "pinyin_site", "first");
-            }
-            if(!items.hasOwnProperty("motif_color")){
-                this.$set(items, "motif_color", false);
-            }
-            if(!items.hasOwnProperty("collocation")){
-                this.$set(items, "collocation", '')
-            }
-            if(!items.hasOwnProperty("liju_list")){
-                this.$set(items, "liju_list", [""])
-            }
-        })
+        item.forEach(items => {
+          if (!items.hasOwnProperty("starFlag")) {
+            this.$set(items, "starFlag", false);
+          }
+          if (!items.hasOwnProperty("pinyin_site")) {
+            this.$set(items, "pinyin_site", "first");
+          }
+          if (!items.hasOwnProperty("motif_color")) {
+            this.$set(items, "motif_color", false);
+          }
+          if (!items.hasOwnProperty("collocation")) {
+            this.$set(items, "collocation", "");
+          }
+          if (!items.hasOwnProperty("liju_list")) {
+            this.$set(items, "liju_list", [""]);
+          }
+        });
       });
       // this.curQue = JSON.parse(JSON.stringify(data));
     }
@@ -487,10 +497,10 @@ export default {
   updated() {}, //生命周期 - 更新之后
   beforeDestroy() {}, //生命周期 - 销毁之前
   destroyed() {}, //生命周期 - 销毁完成
-  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+  activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
 };
 </script>
-<style lang='scss' scope>
+<style lang="scss" scope>
 //@import url(); 引入公共css类
 .Big-Book-Single {
   &-content {
@@ -545,5 +555,4 @@ export default {
   }
 }
 </style>
-<style lang="scss">
-</style>
+<style lang="scss"></style>

src/components/Adult/preview/WordPhrase.vue

@@ -119,8 +119,10 @@
                 <span style="width: 16px; height: 16px"></span>
               </template>
               <div class="tabNum-box">
-                <template v-if="sItem.mIndex == 0">
-                  <b class="tabNum">{{ index + 1 }}</b>
+                <template v-if="sItem.mIndex == 0 || sItem.number">
+                  <b class="tabNum">{{
+                    sItem.number ? sItem.number : index + 1
+                  }}</b>
                 </template>
                 <div
                   v-else