布尔值调整为字符串

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

@@ -14,7 +14,7 @@
         <RichText v-if="data.property.stem_type === stemTypeList[1].value" v-model="data.stem" placeholder="输入题干" />
 
         <el-input
-          v-show="data.property.is_enable_description"
+          v-show="data.property.is_enable_description === 'true'"
           v-model="data.description"
           rows="3"
           resize="none"

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

@@ -14,7 +14,7 @@
         <RichText v-if="data.property.stem_type === stemTypeList[1].value" v-model="data.stem" placeholder="输入题干" />
 
         <el-input
-          v-show="data.property.is_enable_description"
+          v-show="data.property.is_enable_description === 'true'"
           v-model="data.description"
           rows="3"
           resize="none"
@@ -26,7 +26,7 @@
       <div class="content">
         <label class="title-little">文章：</label>
         <RichText v-model="data.article" placeholder="输入文章" />
-        <template v-if="data.property.is_enable_sample_text">
+        <template v-if="data.property.is_enable_sample_text === 'true'">
           <el-divider class="write-divider" />
           <label class="title-little">范文：</label>
           <RichText v-model="data.sample_text" placeholder="输入范文" :wordlimit-num="5000" />
@@ -110,7 +110,7 @@
           <el-radio
             v-for="{ value, label } in switchOption"
             :key="value"
-            v-model="data.property.is_enable_upload"
+            v-model="data.property.is_enable_upload_accessory"
             :label="value"
           >
             {{ label }}

src/views/exercise_questions/data/chooseTone.js

@@ -53,7 +53,7 @@ export const ChooseToneData = {
   property: {
     stem_type: stemTypeList[0].value, // 题干类型
     question_number: 1, // 题号
-    is_enable_description: false, // 描述
+    is_enable_description: 'false', // 描述
     answer_mode: toneTypeList[0].value, // 音调类型
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型

src/views/exercise_questions/data/common.js

@@ -122,8 +122,8 @@ export const selectTypeList = [
 
 // 开关选项
 export const switchOption = [
-  { value: true, label: '开启' },
-  { value: false, label: '关闭' },
+  { value: 'true', label: '开启' },
+  { value: 'false', label: '关闭' },
 ];
 
 // 题号类型

src/views/exercise_questions/data/write.js

@@ -12,13 +12,13 @@ export const writeData = {
   property: {
     stem_type: stemTypeList[0].value, // 题干类型
     question_number: 1, // 题号
-    is_enable_description: false, // 描述
+    is_enable_description: 'false', // 描述
     score: 1, // 分值
     score_type: scoreTypeList[0].value, // 分值类型
     word_num: 50, // 词数
-    is_enable_sample_text: true, // 范文开启
-    is_enable_voice_answer: true, // 语音作答
-    is_enable_upload: true, // 上传附件
+    is_enable_sample_text: 'true', // 范文开启
+    is_enable_voice_answer: 'true', // 语音作答
+    is_enable_upload_accessory: 'true', // 上传附件
   },
   // 其他属性
   other: {

src/views/exercise_questions/preview/ChooseTonePreview.vue

@@ -5,7 +5,7 @@
       <span class="question-number">{{ data.property.question_number }}.</span>
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
-    <div v-if="data.property.is_enable_description" class="description">{{ data.description }}</div>
+    <div v-if="data.property.is_enable_description === 'true'" class="description">{{ data.description }}</div>
 
     <div class="option-list">
       <li v-for="(item, i) in data.option_list" :key="i" :class="['option-item']">
@@ -43,9 +43,11 @@
           :class="[
             'tone',
             data.property.answer_mode === 'select' &&
+            con_preview[i].user_answer[con_preview[i].item_active_index] &&
             con_preview[i].user_answer[con_preview[i].item_active_index].select_tone === value
               ? 'active'
               : data.property.answer_mode === 'label' &&
+                con_preview[i].user_answer[con_preview[i].item_active_index] &&
                 con_preview[i].user_answer[con_preview[i].item_active_index].select_tone === value &&
                 con_preview[i].user_answer[con_preview[i].item_active_index].select_letter === active_letter &&
                 select_item_index === i

src/views/exercise_questions/preview/WritePreview.vue

@@ -6,28 +6,29 @@
       <span v-html="sanitizeHTML(data.stem)"></span>
     </div>
     <div class="article-content" v-html="sanitizeHTML(data.article)"></div>
-    <div v-if="data.property.is_enable_description" class="description">{{ data.description }}</div>
+    <div v-if="data.property.is_enable_description === 'true'" class="description">{{ data.description }}</div>
     <el-input
-      v-model="user_answer.article"
+      v-model="user_answer.text"
       rows="3"
       type="textarea"
       placeholder="请输入内容"
       :maxlength="data.property.word_num"
       show-word-limit
     />
-    <template v-if="data.property.is_enable_voice_answer">
+    <template v-if="data.property.is_enable_voice_answer === 'true'">
       <!-- 语音作答 -->
       <SoundRecordPreview
-        :wav-blob="user_answer.audio_wav"
+        :wav-blob="user_answer.voice_file_id"
         :record-time="user_answer.audio_wav_time"
         @deleteWav="deleteWav"
         @updataWav="updataWav"
       />
     </template>
-    <template v-if="data.property.is_enable_upload">
+    <template v-if="data.property.is_enable_upload_accessory === 'true'">
       <!-- 上传附件 -->
+      <UploadFiles />
     </template>
-    <template v-if="data.property.is_enable_sample_text">
+    <template v-if="data.property.is_enable_sample_text === 'true'">
       <el-divider content-position="center"
         ><span
           :class="['sample-text', show_sample_text ? 'sample-show' : 'sample-hide']"
@@ -43,21 +44,23 @@
 <script>
 import SoundRecordPreview from './components/common/SoundRecordPreview.vue';
 import PreviewMixin from './components/PreviewMixin';
+import UploadFiles from './components/common/UploadFiles.vue';
 
 export default {
   name: 'WritePreview',
   components: {
     SoundRecordPreview,
+    UploadFiles,
   },
   mixins: [PreviewMixin],
   data() {
     return {
       show_sample_text: false,
       user_answer: {
-        article: '', // 用户文章
-        audio_wav: '', // 录音内容
+        text: '', // 用户文章
+        voice_file_id: '', // 录音内容
         audio_wav_time: 0, // 录音时间
-        file_list: [], // 上传文件列表
+        accessory_file_id: [], // 上传文件列表
       },
     };
   },
@@ -67,12 +70,12 @@ export default {
   methods: {
     // 清除录音
     deleteWav() {
-      this.user_answer.audio_wav = '';
+      this.user_answer.voice_file_id = '';
       this.user_answer.audio_wav_time = 0;
     },
     // 更新录音内容和时间
     updataWav(wav, time) {
-      this.user_answer.audio_wav = wav;
+      this.user_answer.voice_file_id = wav;
       this.user_answer.audio_wav_time = time;
     },
   },

src/views/exercise_questions/preview/components/common/UploadFiles.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="upload-wrapper">
+    <el-upload
+      ref="upload"
+      :limit="1"
+      action="no"
+      accept="audio/*"
+      :show-file-list="false"
+      :before-upload="beforeUpload"
+      :http-request="upload"
+    >
+      <div class="upload-audio">
+        <SvgIcon icon-class="upload" />
+        <span>上传音频</span>
+      </div>
+    </el-upload>
+    <div v-show="file_url.length > 0" class="file-wrapper">
+      <div class="file-name">{{ file_name }}</div>
+      <SvgIcon icon-class="delete" class-name="delete pointer" @click="deleteFile" />
+    </div>
+  </div>
+</template>
+
+<script>
+import { fileUpload, GetFileStoreInfo } from '@/api/app';
+
+export default {
+  name: 'UploadFiles',
+  props: {
+    fileId: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      file_id: '',
+      file_url: '',
+      file_name: '',
+    };
+  },
+  watch: {
+    fileId: {
+      handler(val) {
+        if (!val) return;
+        GetFileStoreInfo({ file_id: val }).then(({ file_id, file_url, file_name }) => {
+          this.file_id = file_id;
+          this.file_url = file_url;
+          this.file_name = file_name;
+        });
+      },
+      immediate: true,
+    },
+  },
+  methods: {
+    beforeUpload(file) {
+      if (this.file_id.length > 0) {
+        this.$message.warning('只能上传一个音频文件');
+        return false;
+      }
+      const fileName = file.name;
+      const suffix = fileName.slice(fileName.lastIndexOf('.') + 1, fileName.length).toLowerCase();
+      if (!['mp3', 'wav', 'aac', 'm4a'].includes(suffix)) {
+        this.$message.warning('音频格式不正确');
+        return false;
+      }
+    },
+    upload(file) {
+      fileUpload('Mid', file).then(({ file_info_list }) => {
+        if (file_info_list.length > 0) {
+          const { file_id, file_name, file_url } = file_info_list[0];
+          this.file_id = file_id;
+          this.file_url = file_url;
+          this.file_name = file_name;
+          this.$emit('upload', file_id);
+        }
+      });
+    },
+    deleteFile() {
+      this.$confirm('是否删除当前音频文件？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          this.$emit('deleteFile', this.file_id);
+          this.file_id = '';
+          this.file_url = '';
+          this.file_name = '';
+          this.$refs.upload.clearFiles();
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.upload-wrapper {
+  display: flex;
+  column-gap: 12px;
+  align-items: center;
+  margin-top: 8px;
+
+  .upload-audio {
+    display: flex;
+    column-gap: 12px;
+    align-items: center;
+    width: 233px;
+    padding: 4px 12px;
+    background-color: $fill-color;
+  }
+
+  .file-wrapper {
+    display: flex;
+    column-gap: 12px;
+    align-items: center;
+
+    .file-name {
+      padding: 4px 12px;
+      background-color: $fill-color;
+    }
+  }
+}
+</style>