优化音频作答UI

src/features/OnlineExam/Examing/ExamingHome.vue

@@ -587,6 +587,7 @@ export default {
                 studentAnswer: q.audioFileUrl
               });
               q.saved = true;
+              this.$Message.info("音频题作答已更新");
             })
             .catch(() => {
               this.$Message.error({

src/features/OnlineExam/Examing/TextQuestionView.vue

@@ -63,17 +63,34 @@
         ></div>
       </div>
       <div v-else>
-        <div v-if="!this.examQuestion.studentAnswer">
-          <div v-if="qrValue && !this.examQuestion.studentAnswer">
+        <div>
+          <div v-if="qrValue" style="display: flex">
             <qrcode :value="qrValue" :options="{ width: 200 }"></qrcode>
-            <div>请使用微信扫码二维码后，在微信小程序上录音，并上传录音</div>
-            <div v-if="qrScanned">已扫描 <Icon type="md-checkmark" /></div>
+            <div style="margin-top: 10px;">
+              <div>
+                请使用<span style="font-weight: 900; color: #1E90FF;">微信</span
+                >扫描二维码后，在微信小程序上录音，并上传录音。
+              </div>
+              <div v-if="qrScanned" style="margin-top: 30px; font-size: 30px;">
+                已扫描 <Icon type="md-checkmark" />
+              </div>
+            </div>
           </div>
           <div v-else>正在获取二维码...</div>
         </div>
 
-        <div v-else>
-          <audio controls :src="this.examQuestion.studentAnswer" />
+        <div
+          class="audio-answer audio-answer-line-height"
+          style="margin-top: 20px ;"
+        >
+          <span class="audio-answer-line-height">音频答案：</span>
+          <audio
+            class="audio-answer-line-height"
+            v-if="this.examQuestion.studentAnswer"
+            controls
+            :src="this.examQuestion.studentAnswer"
+          />
+          <span v-else class="audio-answer-line-height">未上传音频</span>
         </div>
       </div>
       <div class="reset" style="padding-top: 20px">
@@ -268,4 +285,13 @@ export default {
   min-height: 300px;
   border: 1px solid grey;
 }
+
+.audio-answer {
+  font-size: 24px;
+  line-height: 54px;
+}
+.audio-answer-line-height {
+  line-height: 54px;
+  vertical-align: text-bottom;
+}
 </style>