生成音频样式

src/views/exercise_questions/create/components/exercises/ChineseQuestion.vue

@@ -34,7 +34,7 @@
             >
               <div v-if="item.audio_file_id" class="upload-play">
                 <AudioPlay :file-id="item.audio_file_id" theme-color="gray" />
-                <SvgIcon icon-class="delete" @click="deleteAudio(i)" />
+                <SvgIcon icon-class="delete-back-line" @click="deleteAudio(i)" />
               </div>
               <UploadAudio
                 v-else
@@ -52,8 +52,9 @@
                 v-loading="loading_list[i] ? loading_list[i].loading : false"
                 class="auto-btn"
                 @click="handleMatically(item, i)"
-                >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+                >{{ item.audio_file_id ? '已生成' : '生成音频' }}</span
               >
+              <SvgIcon v-if="item.audio_file_id" icon-class="delete-back-line" @click="deleteAudio(i)" />
             </div>
             <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
             <el-input v-model="item.definition" placeholder="输入释义" />
@@ -419,7 +420,7 @@ export default {
     .auto-matically,
     .upload-audio-play {
       .audio-wrapper {
-        margin-right: 12px;
+        // margin-right: 12px;
 
         :deep .audio-play {
           width: 16px;
@@ -461,6 +462,7 @@ export default {
       display: flex;
       flex-shrink: 0;
       align-items: center;
+      justify-content: space-between;
       width: 233px;
       padding: 5px 12px;
       background-color: $fill-color;

src/views/exercise_questions/create/components/exercises/ChooseToneQuestion.vue

@@ -41,7 +41,7 @@
             >
               <div v-if="item.audio_file_id" class="upload-play">
                 <AudioPlay :file-id="item.audio_file_id" theme-color="gray" />
-                <SvgIcon icon-class="delete" @click="deleteAudio(i)" />
+                <SvgIcon icon-class="delete-back-line" @click="deleteAudio(i)" />
               </div>
               <UploadAudio
                 v-else
@@ -59,8 +59,9 @@
                 v-loading="loading_list[i] ? loading_list[i].loading : false"
                 class="auto-btn"
                 @click="handleMatically(item, i)"
-                >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+                >{{ item.audio_file_id ? '已生成' : '生成音频' }}</span
               >
+              <SvgIcon v-if="item.audio_file_id" icon-class="delete-back-line" @click="deleteAudio(i)" />
             </div>
             <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
             <SvgIcon icon-class="delete" class="delete pointer" @click="deleteOption(i, item.audio_file_id)" />
@@ -406,7 +407,7 @@ export default {
     .auto-matically,
     .upload-audio-play {
       .audio-wrapper {
-        margin-right: 12px;
+        // margin-right: 12px;
 
         :deep .audio-play {
           width: 16px;
@@ -447,6 +448,7 @@ export default {
     .auto-matically {
       display: flex;
       align-items: center;
+      justify-content: space-between;
       width: 233px;
       padding: 5px 12px;
       background-color: $fill-color;

src/views/exercise_questions/create/components/exercises/RepeatQuestion.vue

@@ -34,7 +34,7 @@
             >
               <div v-if="item.audio_file_id" class="upload-play">
                 <AudioPlay :file-id="item.audio_file_id" theme-color="gray" />
-                <SvgIcon icon-class="delete" @click="deleteAudio(i)" />
+                <SvgIcon icon-class="delete-back-line" @click="deleteAudio(i)" />
               </div>
               <UploadAudio
                 v-else
@@ -52,8 +52,9 @@
                 v-loading="loading_list[i] ? loading_list[i].loading : false"
                 class="auto-btn"
                 @click="handleMatically(item, i)"
-                >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+                >{{ item.audio_file_id ? '已生成' : '生成音频' }}</span
               >
+              <SvgIcon v-if="item.audio_file_id" icon-class="delete-back-line" @click="deleteAudio(i)" />
             </div>
             <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
             <SvgIcon icon-class="delete" class="delete pointer" @click="deleteOption(i, item.audio_file_id)" />
@@ -330,7 +331,7 @@ export default {
   .auto-matically,
   .upload-audio-play {
     .audio-wrapper {
-      margin-right: 12px;
+      // margin-right: 12px;
 
       :deep .audio-play {
         width: 16px;
@@ -372,6 +373,7 @@ export default {
     display: flex;
     flex-shrink: 0;
     align-items: center;
+    justify-content: space-between;
     width: 233px;
     padding: 5px 12px;
     background-color: $fill-color;

src/views/exercise_questions/create/components/exercises/WordCardQuestion.vue

@@ -45,7 +45,7 @@
                 >
                   <div v-if="item.audio_file_id" class="upload-play">
                     <AudioPlay :file-id="item.audio_file_id" theme-color="gray" />
-                    <SvgIcon icon-class="delete" @click="deleteAudio(i)" />
+                    <SvgIcon icon-class="delete-back-line" @click="deleteAudio(i)" />
                   </div>
                   <UploadAudio
                     v-else
@@ -63,8 +63,9 @@
                     v-loading="loading_list[i] ? loading_list[i].loading : false"
                     class="auto-btn"
                     @click="handleMatically(item, i)"
-                    >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+                    >{{ item.audio_file_id ? '已生成' : '生成音频' }}</span
                   >
+                  <SvgIcon v-if="item.audio_file_id" icon-class="delete-back-line" @click="deleteAudio(i)" />
                 </div>
                 <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
                 <el-input v-model="item.definition" placeholder="输入释义" type="textarea" :rows="1" />
@@ -273,8 +274,12 @@ export default {
       })
         .then(() => {
           this.data.option_list.splice(i, 1);
-          this.data.file_id_list.splice(this.data.file_id_list.indexOf(file_id), 1);
-          this.data.file_id_list.splice(this.data.file_id_list.indexOf(pic_id), 1);
+          if (file_id && this.data.file_id_list.indexOf(file_id) > -1) {
+            this.data.file_id_list.splice(this.data.file_id_list.indexOf(file_id), 1);
+          }
+          if (pic_id && this.data.file_id_list.indexOf(pic_id) > -1) {
+            this.data.file_id_list.splice(this.data.file_id_list.indexOf(pic_id), 1);
+          }
           this.loading_list.splice(i, 1);
         })
         .catch(() => {});
@@ -540,7 +545,7 @@ export default {
     .auto-matically,
     .upload-audio-play {
       .audio-wrapper {
-        margin-right: 12px;
+        // margin-right: 12px;
 
         :deep .audio-play {
           width: 16px;
@@ -582,6 +587,7 @@ export default {
       display: flex;
       flex-shrink: 0;
       align-items: center;
+      justify-content: space-between;
       width: 233px;
       padding: 5px 12px;
       background-color: $fill-color;

src/views/exercise_questions/create/components/exercises/WordDictationQuestion.vue

@@ -31,7 +31,7 @@
             >
               <div v-if="item.audio_file_id" class="upload-play">
                 <AudioPlay :file-id="item.audio_file_id" theme-color="gray" />
-                <SvgIcon icon-class="delete" @click="deleteAudio(i)" />
+                <SvgIcon icon-class="delete-back-line" @click="deleteAudio(i)" />
               </div>
               <UploadAudio
                 v-else
@@ -49,8 +49,9 @@
                 v-loading="loading_list[i] ? loading_list[i].loading : false"
                 class="auto-btn"
                 @click="handleMatically(item, i)"
-                >{{ item.audio_file_id ? '已生成' : '自动生成' }}</span
+                >{{ item.audio_file_id ? '已生成' : '生成音频' }}</span
               >
+              <SvgIcon v-if="item.audio_file_id" icon-class="delete-back-line" @click="deleteAudio(i)" />
             </div>
             <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
             <SvgIcon icon-class="delete" class="delete pointer" @click="deleteOption(i, item.audio_file_id)" />
@@ -348,7 +349,7 @@ export default {
     .auto-matically,
     .upload-audio-play {
       .audio-wrapper {
-        margin-right: 12px;
+        // margin-right: 12px;
 
         :deep .audio-play {
           width: 16px;
@@ -390,6 +391,7 @@ export default {
       display: flex;
       flex-shrink: 0;
       align-items: center;
+      justify-content: space-between;
       width: 233px;
       padding: 5px 12px;
       background-color: $fill-color;

src/views/exercise_questions/preview/WordCardPreview.vue

@@ -142,7 +142,6 @@ export default {
     },
   },
   created() {
-    console.log(this.data);
     // this.handleData();
   },
   mounted() {},