读汉字写拼音 移动端

src/components/Adult/phonePreview/TextInputRecord.vue

@@ -1,8 +1,7 @@
 <!--  -->
 <template>
   <div
-    class="Big-Book-prev-Textdes"
-    :class="[isPhone ? 'textInput-phone' : '']"
+    class="Big-Book-prev-Textdes textInput-phone"
     v-if="
       curQue && judgeAnswer == 'standardAnswer'
         ? userErrList.length > 0
@@ -11,7 +10,9 @@
         : true
     "
   >
-    <h2 v-if="curQue.title">{{ curQue.title }}</h2>
+    <h2 v-if="curQue.title" :style="{ fontSize: baseSizePhone + 2 + 'px' }">
+      {{ curQue.title }}
+    </h2>
     <div
       class="aduioLine-box"
       :style="{ display: judgeAnswer == 'standardAnswer' ? 'none' : 'block' }"
@@ -29,6 +30,7 @@
         type="audioLine"
         ref="audioLine"
         @handleListenRead="handleListenRead"
+        :baseSizePhone="baseSizePhone"
       />
     </div>
     <ul>
@@ -63,9 +65,16 @@
             )
           "
         ></a>
-        <b v-if="items.number">{{ items.number }}</b>
+        <b
+          v-if="items.number"
+          :style="{ fontSize: baseSizePhone - 2 + 'px' }"
+          >{{ items.number }}</b
+        >
         <span
-          :style="{ width: items.con ? '260px' : '' }"
+          :style="{
+            width: items.con ? '260px' : '',
+            fontSize: baseSizePhone + 2 + 'px'
+          }"
           class="item-con"
           :class="[items.font]"
           v-if="items.con"
@@ -84,6 +93,7 @@
           maxlength="200"
           :readonly="TaskModel == 'ANSWER'"
           @change="changeuserAnswerJudge(indexs)"
+          :style="{ fontSize: baseSizePhone + 2 + 'px' }"
         />
         <template v-if="items.IsRecord">
           <Soundrecord
@@ -95,7 +105,7 @@
             "
             :tmIndex="indexs"
             :TaskModel="TaskModel"
-            type="pro"
+            type="normal"
             class="luyin-box"
           />
         </template>
@@ -105,14 +115,14 @@
 </template>
 
 <script>
-import Soundrecord from "../preview/Soundrecord.vue"; // 录音模板
-import Audio from "../preview/components/AudioRed.vue"; // 音频播放
-import AudioLine from "../preview/AudioLine.vue";
-import AnswerTitle from "../preview/components/AnswerTitle.vue";
+import Soundrecord from "../phonePreview/Soundrecord.vue"; // 录音模板
+import Audio from "../phonePreview/components/AudioRed.vue"; // 音频播放
+import AudioLine from "../phonePreview/AudioLine.vue";
+import AnswerTitle from "../phonePreview/components/AnswerTitle.vue";
 
 export default {
   components: { Soundrecord, Audio, AudioLine, AnswerTitle },
-  props: ["curQue", "themeColor", "TaskModel", "judgeAnswer", "isPhone"],
+  props: ["curQue", "themeColor", "TaskModel", "judgeAnswer", "baseSizePhone"],
   data() {
     return {
       resArr: [],
@@ -353,7 +363,7 @@ export default {
 .Big-Book-prev-Textdes {
   width: 100%;
   // margin-top: 16px;
-  background: #f7f7f7;
+  // background: #f7f7f7;
   border: 1px solid rgba(0, 0, 0, 0.1);
   box-sizing: border-box;
   border-radius: 8px;
@@ -373,7 +383,7 @@ export default {
     padding: 24px;
     li {
       width: 100%;
-      background: #ffffff;
+      // background: #ffffff;
       border: 1px solid rgba(0, 0, 0, 0.1);
       box-sizing: border-box;
       border-radius: 8px;
@@ -436,6 +446,7 @@ export default {
         color: #000000;
         font-size: 16px;
         line-height: 150%;
+        background: transparent;
         &.py {
           font-family: "GB-PINYINOK-B";
         }