文章音频长度 生词背景色 序号大小

src/components/Adult/Preview.vue

@@ -3330,6 +3330,9 @@ export default {
     padding-bottom: 10px;
     // transform-origin: 0 0; /* 设置变换的原点为元素的左上角 */
     // transform: scale(0.6);
+    .title-big h2 {
+      letter-spacing: -0.5px;
+    }
     .NNPE-tableList-item2 {
       width: 48% !important;
     }

src/components/Adult/phonePreview/ArticleViewChs/NormalModelChs.vue

@@ -25,7 +25,7 @@
             :getCurTime="getCurTime"
             :duration="curQue.mp3_list[0].media_duration"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             :ed="ed"
             type="audioLine"
             ref="audioLine"

src/components/Adult/phonePreview/ArticleViewChs/PhraseModelChs.vue

@@ -24,7 +24,7 @@
             :mp3="curQue.mp3_list[0].id"
             :getCurTime="getCurTime"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             ref="audioLine"
             :baseSizePhone="baseSizePhone"
           />

src/components/Adult/phonePreview/ArticleViewChs/Practicechs.vue

@@ -24,7 +24,7 @@
           :getCurTime="getCurTime"
           ref="audioLine"
           :stopAudio="stopAudio"
-          :width="160"
+          :width="windowWidth - 240"
           :mp3Source="curQue.mp3_list[0].source"
           :ed="ed"
           type="audioLine"
@@ -546,7 +546,8 @@ export default {
         .toString(36)
         .substr(2),
       ed: undefined,
-      refresh: true
+      refresh: true,
+      windowWidth: window.innerWidth
     };
   },
   computed: {

src/components/Adult/phonePreview/ArticleViewChs/WordModelChs.vue

@@ -24,7 +24,7 @@
             :mp3="curQue.mp3_list[0].id"
             :getCurTime="getCurTime"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             ref="audioLine"
             :baseSizePhone="baseSizePhone"
           />

src/components/Adult/phonePreview/ArticleViewChs/index.vue

@@ -177,8 +177,8 @@ import NormalModelChs from "./NormalModelChs.vue";
 import Practice from "./Practicechs.vue"; // 语音练习模式
 import WordModel from "./WordModelChs.vue"; // 语音练习模式
 import Voicefullscreen from "../Voicefullscreen.vue";
-import { getToken } from "@/utils/auth";
-import { analysSubmit } from "@/api/ajax";
+import { getToken } from "../../../../utils/auth";
+import { analysSubmit } from "../../../../api/ajax";
 
 export default {
   name: "ArticleViewChs",

src/components/Adult/phonePreview/DialogueArticleViewChs/AnswerModel.vue

@@ -1416,6 +1416,7 @@ export default {
           // line-height: 1.6;
           min-height: 33px;
           color: #000000;
+          letter-spacing: -0.5px;
           &.active {
             background: rgba(60, 200, 99, 0.2);
           }

src/components/Adult/phonePreview/DialogueArticleViewChs/NormalModelChs.vue

@@ -24,7 +24,7 @@
             :mp3="curQue.mp3_list[0].id"
             :getCurTime="getCurTime"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             :ed="ed"
             type="audioLine"
             ref="audioLine"

src/components/Adult/phonePreview/DialogueArticleViewChs/PhraseModelChs.vue

@@ -24,7 +24,7 @@
             :mp3="curQue.mp3_list[0].id"
             :getCurTime="getCurTime"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             ref="audioLine"
             :baseSizePhone="baseSizePhone"
           />

src/components/Adult/phonePreview/DialogueArticleViewChs/Practicechs.vue

@@ -26,7 +26,7 @@
             :getCurTime="getCurTime"
             ref="audioLine"
             :stopAudio="stopAudio"
-            :width="160"
+            :width="windowWidth - 240"
             :isRepeat="isRepeat"
             :mp3Source="curQue.mp3_list[0].source"
             :ed="ed"
@@ -672,7 +672,8 @@ export default {
       highWords: null,
       highWordsArr: [],
       highIndex: 0,
-      newWordList: []
+      newWordList: [],
+      windowWidth: window.innerWidth
     };
   },
   computed: {

src/components/Adult/phonePreview/DialogueArticleViewChs/WordModelChs.vue

@@ -24,7 +24,7 @@
             :mp3="curQue.mp3_list[0].id"
             :getCurTime="getCurTime"
             :mp3Source="curQue.mp3_list[0].source"
-            :width="160"
+            :width="windowWidth - 220"
             ref="audioLine"
             :baseSizePhone="baseSizePhone"
           />

src/components/Adult/phonePreview/DialogueArticleViewChs/index.vue

@@ -184,8 +184,8 @@ import NormalModelChs from "./NormalModelChs.vue";
 import Practice from "./Practicechs.vue"; // 语音练习模式
 import WordModel from "./WordModelChs.vue"; // 语音练习模式
 import Voicefullscreen from "../Voicefullscreen.vue";
-import { analysSubmit, getContentFile } from "@/api/ajax";
-import { getToken } from "@/utils/auth";
+import { analysSubmit, getContentFile } from "../../../../api/ajax";
+import { getToken } from "../../../../utils/auth";
 export default {
   name: "DialogueArticleViewChs",
   props: [

src/components/Adult/phonePreview/InputHasRecord.vue

@@ -17,7 +17,11 @@
           <b
             class="xuhao"
             v-if="items.number"
-            :style="{ fontSize: baseSizePhone - 2 + 'px' }"
+            :style="{
+              fontSize: baseSizePhone - 2 + 'px',
+              width: 18 + (baseSizePhone - 14) * 2 + 'px',
+              height: 18 + (baseSizePhone - 14) * 2 + 'px'
+            }"
             >{{ items.number }}</b
           >
           <template v-if="items.detail.wordsList.length == 0">
@@ -212,7 +216,16 @@
             </h2>
             <div v-for="(items, indexs) in curQue.option" :key="indexs">
               <div class="item-content">
-                <b class="xuhao" v-if="items.number">{{ items.number }}</b>
+                <b
+                  class="xuhao"
+                  v-if="items.number"
+                  :style="{
+                    'font-size': baseSizePhone - 2 + 'px',
+                    width: 18 + (baseSizePhone - 14) * 2 + 'px',
+                    height: 18 + (baseSizePhone - 14) * 2 + 'px'
+                  }"
+                  >{{ items.number }}</b
+                >
                 <template v-if="items.detail.wordsList.length == 0">
                   <p
                     :class="['content-con', items.font]"
@@ -406,7 +419,11 @@
             <b
               class="xuhao"
               v-if="items.number"
-              :style="{ 'font-size': baseSizePhone - 2 + 'px' }"
+              :style="{
+                'font-size': baseSizePhone - 2 + 'px',
+                width: 18 + (baseSizePhone - 14) * 2 + 'px',
+                height: 18 + (baseSizePhone - 14) * 2 + 'px'
+              }"
               >{{ items.number }}</b
             >
             <template v-if="items.detail.wordsList.length == 0">
@@ -738,16 +755,17 @@ export default {
   b.xuhao {
     background: #de4444;
     text-align: center;
-    width: 16px;
-    height: 16px;
+    min-width: 16px;
+    min-height: 16px;
+    max-width: 28px;
+    max-height: 28px;
     color: #ffffff;
     border-radius: 50%;
     font-size: 12px;
     font-family: "robot";
-    line-height: 16px;
-    margin-right: 8px;
+    line-height: 1.3;
     flex-shrink: 0;
-    margin-top: 6px;
+    padding: 2px;
   }
   .inputInner {
     max-width: 520px;
@@ -776,7 +794,8 @@ export default {
   .item-content {
     display: flex;
     justify-content: flex-start;
-    // align-items: center;
+    align-items: center;
+    gap: 5px;
     .content-con {
       font-size: 20px;
       line-height: 150%;

src/components/Adult/phonePreview/SentenceSortQP.vue

@@ -332,7 +332,7 @@ export default {
       flex-shrink: 0;
     }
     .content-box {
-      background: rgba(250, 249, 249, 1);
+      // background: rgba(250, 249, 249, 1);
       padding: 8px;
       border-radius: 8px;
     }
@@ -373,12 +373,12 @@ export default {
           // width: 82px;
           // height: 70px;
           padding: 0px 16px;
-          background: #ffffff;
+          // background: #ffffff;
           border-radius: 8px;
           text-align: center;
           color: #000000;
           cursor: pointer;
-          border: 1px solid #ffffff;
+          border: 1px solid #ccc;
           display: flex;
           flex-wrap: wrap;
           align-items: end;

src/components/Adult/phonePreview/TinyModule.vue

@@ -54,11 +54,10 @@ export default {
           );
           heightStr = heightStr.substring(0, heightStr.indexOf('"'));
           heightStr = 'height="' + heightStr + '"';
-          console.log(heightStr);
           imgArr[i].replace(heightStr, 'height="auto"');
           imgArr[i] =
             imgArr[i].substring(0, imgArr[i].indexOf('width="') + 7) +
-            "80%" +
+            "70%" +
             imgArr[i].substring(
               imgArr[i].indexOf('width="') + 7 + widthStr.length,
               imgArr[i].indexOf(heightStr)

src/components/Adult/phonePreview/WordPhrase.vue

@@ -96,7 +96,7 @@
             >
               <div class="content-box">
                 <div
-                  style="display: flex;flex-flow: wrap; width: 100%; gap: 10px;"
+                  style="display: flex;flex-flow: wrap; width: 100%; gap: 10px;align-items: center"
                 >
                   <template v-if="sItem.bg || sItem.ed">
                     <a
@@ -141,7 +141,9 @@
                       <b
                         class="tabNum"
                         :style="{
-                          fontSize: baseSizePhone - 2 + 'px'
+                          fontSize: baseSizePhone - 2 + 'px',
+                          width: 18 + (baseSizePhone - 14) * 2 + 'px',
+                          height: 18 + (baseSizePhone - 14) * 2 + 'px'
                         }"
                         >{{ sItem.number ? sItem.number : index + 1 }}</b
                       >
@@ -381,7 +383,6 @@
         :bg="data && data.bg ? data.bg : null"
         :ed="data && data.ed ? data.ed : null"
         type="newWordDetail"
-        :isPhone="isPhone"
       />
     </div>
     <audio ref="newwordAudio" />
@@ -760,7 +761,7 @@ export default {
   .NPC-word-table {
     width: 100%;
     > .NPC-word-tr {
-      background: rgba(250, 249, 249, 1);
+      // background: rgba(250, 249, 249, 1);
       border-radius: 8px;
 
       margin-bottom: 8px;
@@ -805,16 +806,17 @@ export default {
       .tabNum {
         background: #de4444;
         text-align: center;
-        width: 16px;
-        height: 16px;
+        min-width: 16px;
+        min-height: 16px;
+        max-width: 28px;
+        max-height: 28px;
         color: #ffffff;
         border-radius: 50%;
         font-size: 12px;
         font-family: "robot", "alabo";
-        line-height: 16px;
-        margin-top: 4px;
-        margin-left: 8px;
+        line-height: 1.3;
         display: block;
+        padding: 2px;
       }
       .NPC-word-tab-box {
         width: 240px;
@@ -979,7 +981,6 @@ export default {
     opacity: 0.5;
   }
   .play-btn {
-    margin-top: 4px;
     width: 16px;
     height: 16px;
     background: url("../../../assets/NPC/play-red.png") center no-repeat;