修改练习题编辑和答题问题

package-lock.json

@@ -1445,9 +1445,9 @@
       }
     },
     "@eslint/js": {
-      "version": "8.53.0",
-      "resolved": "https://registry.npmmirror.com/@eslint/js/-/js-8.53.0.tgz",
-      "integrity": "sha512-Kn7K8dx/5U6+cT1yEhpX1w4PCSg0M+XyRILPgvwcEBjerFWCwQj5sbr3/VmxqV0JGHCBCzyd6LxypEuehypY1w==",
+      "version": "8.54.0",
+      "resolved": "https://registry.npmmirror.com/@eslint/js/-/js-8.54.0.tgz",
+      "integrity": "sha512-ut5V+D+fOoWPgGGNj83GGjnntO39xDy6DWxO0wb7Jp3DcMX0TfIqdzHF85VTQkerdyGmuuMD9AKAo5KiNlf/AQ==",
       "dev": true
     },
     "@gar/promisify": {
@@ -1815,9 +1815,9 @@
       "dev": true
     },
     "@rushstack/eslint-patch": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmmirror.com/@rushstack/eslint-patch/-/eslint-patch-1.5.1.tgz",
-      "integrity": "sha512-6i/8UoL0P5y4leBIGzvkZdS85RDMG9y1ihZzmTZQ5LdHUYmZ7pKFoj8X0236s3lusPs1Fa5HTQUpwI+UfTcmeA==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmmirror.com/@rushstack/eslint-patch/-/eslint-patch-1.6.0.tgz",
+      "integrity": "sha512-2/U3GXA6YiPYQDLGwtGlnNgKYBSwCFIHf8Y9LUY5VATHdtbLlU0Y1R3QoBnT0aB4qv/BEiVVsj7LJXoQCgJ2vA==",
       "dev": true
     },
     "@sideway/address": {
@@ -3145,9 +3145,9 @@
       }
     },
     "axios": {
-      "version": "1.6.1",
-      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.6.1.tgz",
-      "integrity": "sha512-vfBmhDpKafglh0EldBEbVuoe7DyAavGSLWhuSm5ZSEKQnHhBf0xAAwybbNH1IkrJNGnS/VG4I5yxig1pCEXE4g==",
+      "version": "1.6.2",
+      "resolved": "https://registry.npmmirror.com/axios/-/axios-1.6.2.tgz",
+      "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
       "requires": {
         "follow-redirects": "^1.15.0",
         "form-data": "^4.0.0",
@@ -4038,9 +4038,9 @@
       }
     },
     "core-js": {
-      "version": "3.33.2",
-      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.33.2.tgz",
-      "integrity": "sha512-XeBzWI6QL3nJQiHmdzbAOiMYqjrb7hwU7A39Qhvd/POSa/t9E1AeZyEZx3fNvp/vtM8zXwhoL0FsiS0hD0pruQ=="
+      "version": "3.33.3",
+      "resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.33.3.tgz",
+      "integrity": "sha512-lo0kOocUlLKmm6kv/FswQL8zbkH7mVsLJ/FULClOhv8WRVmKLVcs6XPNQAzstfeJTCHMyButEwG+z1kHxHoDZw=="
     },
     "core-js-compat": {
       "version": "3.33.0",
@@ -4933,15 +4933,15 @@
       "dev": true
     },
     "eslint": {
-      "version": "8.53.0",
-      "resolved": "https://registry.npmmirror.com/eslint/-/eslint-8.53.0.tgz",
-      "integrity": "sha512-N4VuiPjXDUa4xVeV/GC/RV3hQW9Nw+Y463lkWaKKXKYMvmRiRDAtfpuPFLN+E1/6ZhyR8J2ig+eVREnYgUsiag==",
+      "version": "8.54.0",
+      "resolved": "https://registry.npmmirror.com/eslint/-/eslint-8.54.0.tgz",
+      "integrity": "sha512-NY0DfAkM8BIZDVl6PgSa1ttZbx3xHgJzSNJKYcQglem6CppHyMhRIQkBVSSMaSRnLhig3jsDbEzOjwCVt4AmmA==",
       "dev": true,
       "requires": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
         "@eslint/eslintrc": "^2.1.3",
-        "@eslint/js": "8.53.0",
+        "@eslint/js": "8.54.0",
         "@humanwhocodes/config-array": "^0.11.13",
         "@humanwhocodes/module-importer": "^1.0.1",
         "@nodelib/fs.walk": "^1.2.8",
@@ -10466,9 +10466,9 @@
       "dev": true
     },
     "stylelint-config-recess-order": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmmirror.com/stylelint-config-recess-order/-/stylelint-config-recess-order-4.3.0.tgz",
-      "integrity": "sha512-EWVtxZ8oq4/meTrRNUDrS5TqMz6TX72JjKDwVQq0JJDXE+P/o7UuFw3wWV/0O9yvJfh/da6nJY71ZUn/wSfB4g==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmmirror.com/stylelint-config-recess-order/-/stylelint-config-recess-order-4.4.0.tgz",
+      "integrity": "sha512-Q99kvZyIM/aoPEV4dRDkzD3fZLzH0LXi+pawCf1r700uUeF/PHQ5PZXjwFUuGrWhOzd1N+cuVm+OUGsY2fRN5A==",
       "dev": true,
       "requires": {
         "stylelint-order": "6.x"
@@ -10980,15 +10980,16 @@
       "dev": true
     },
     "svgo": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmmirror.com/svgo/-/svgo-3.0.3.tgz",
-      "integrity": "sha512-X4UZvLhOglD5Xrp834HzGHf8RKUW0Ahigg/08yRO1no9t2NxffOkMiQ0WmaMIbaGlVTlSst2zWANsdhz5ybXgA==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmmirror.com/svgo/-/svgo-3.0.4.tgz",
+      "integrity": "sha512-T+Xul3JwuJ6VGXKo/p2ndqx1ibxNKnLTvRc1ZTWKCfyKS/GgNjRZcYsK84fxTsy/izr91g/Rwx6fGnVgaFSI5g==",
       "dev": true,
       "requires": {
         "@trysound/sax": "0.2.0",
         "commander": "^7.2.0",
         "css-select": "^5.1.0",
         "css-tree": "^2.2.1",
+        "css-what": "^6.1.0",
         "csso": "5.0.5",
         "picocolors": "^1.0.0"
       },
@@ -11277,9 +11278,9 @@
       "dev": true
     },
     "tinymce": {
-      "version": "5.10.8",
-      "resolved": "https://registry.npmmirror.com/tinymce/-/tinymce-5.10.8.tgz",
-      "integrity": "sha512-iyoo3VGMAJhLMDdblAefKvYgBRk9kQi58GTwAmoieqsyggGsKZWlQl/YY6nTILFHUCA1FhYu0HdmM5YYjs17UQ=="
+      "version": "5.10.9",
+      "resolved": "https://registry.npmmirror.com/tinymce/-/tinymce-5.10.9.tgz",
+      "integrity": "sha512-5bkrors87X9LhYX2xq8GgPHrIgJYHl87YNs+kBcjQ5I3CiUgzo/vFcGvT3MZQ9QHsEeYMhYO6a5CLGGffR8hMg=="
     },
     "titleize": {
       "version": "3.0.0",

package.json

@@ -10,8 +10,8 @@
   },
   "dependencies": {
     "@tinymce/tinymce-vue": "^3.2.8",
-    "axios": "^1.6.1",
-    "core-js": "^3.33.2",
+    "axios": "^1.6.2",
+    "core-js": "^3.33.3",
     "dompurify": "^3.0.6",
     "element-ui": "^2.15.14",
     "hanzi-writer": "^3.6.0",
@@ -19,7 +19,7 @@
     "js-cookie": "^3.0.5",
     "md5": "^2.3.0",
     "nprogress": "^0.2.0",
-    "tinymce": "^5.10.8",
+    "tinymce": "^5.10.9",
     "vue": "^2.6.14",
     "vue-i18n": "^8.28.2",
     "vue-router": "^3.6.5",
@@ -29,7 +29,7 @@
   "devDependencies": {
     "@babel/core": "^7.23.3",
     "@babel/eslint-parser": "^7.23.3",
-    "@rushstack/eslint-patch": "^1.5.1",
+    "@rushstack/eslint-patch": "^1.6.0",
     "@vue/cli-plugin-babel": "~5.0.8",
     "@vue/cli-plugin-eslint": "~5.0.8",
     "@vue/cli-service": "~5.0.8",
@@ -37,7 +37,7 @@
     "@vue/preload-webpack-plugin": "^2.0.0",
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "compression-webpack-plugin": "^6.1.1",
-    "eslint": "^8.53.0",
+    "eslint": "^8.54.0",
     "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-vue": "^9.18.1",
     "patch-package": "^8.0.0",
@@ -46,14 +46,14 @@
     "sass": "^1.69.5",
     "sass-loader": "^13.3.2",
     "stylelint": "^15.11.0",
-    "stylelint-config-recess-order": "^4.3.0",
+    "stylelint-config-recess-order": "^4.4.0",
     "stylelint-config-recommended-scss": "^13.1.0",
     "stylelint-config-recommended-vue": "^1.5.0",
     "stylelint-config-standard-scss": "^11.1.0",
     "stylelint-declaration-block-no-ignored-properties": "^2.7.0",
     "stylelint-webpack-plugin": "^4.1.1",
     "svg-sprite-loader": "^6.0.11",
-    "svgo": "^3.0.3",
+    "svgo": "^3.0.4",
     "vue-template-compiler": "^2.6.14"
   },
   "engines": {

src/views/exercise_questions/answer/answer.js

@@ -0,0 +1,12 @@
+// 主观题列表
+export const subjectiveQuestionList = [
+  'write',
+  'repeat',
+  'chinese',
+  'talk_picture',
+  'read_aloud',
+  'word_card',
+  'answer_question',
+  'replace_answer',
+  'essay_question',
+];

src/views/exercise_questions/answer/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="answer">
     <header class="header">
-      <div class="back round" @click="$router.push('/personal_question')">
+      <div class="back round" @click="goBack">
         <i class="el-icon-arrow-left"></i>
         <span>返回</span>
       </div>
@@ -16,7 +16,9 @@
 
     <main class="main">
       <StartQuestion
-        v-if="curQuestionIndex === -1"
+        v-if="
+          curQuestionIndex === -1 && !(user_answer_record_info.is_exist_answer_record === 'true' && answer_mode === 2)
+        "
         :question-length="questionList.length"
         :answer-time-limit-minute="answer_time_limit_minute"
         @startAnswer="startAnswer"
@@ -39,7 +41,11 @@
       <div v-show="isAnnotations" class="annotations"><i class="el-icon-plus"></i>批注</div>
 
       <div>
-        <template v-if="curQuestionIndex === -1">
+        <template
+          v-if="
+            curQuestionIndex === -1 && !(user_answer_record_info.is_exist_answer_record === 'true' && answer_mode === 2)
+          "
+        >
           <el-button type="primary" round @click="startAnswer">开始答题</el-button>
         </template>
 
@@ -70,6 +76,7 @@ import {
   SubmitAnswer,
   GetQuestionInfo_AnswerRecord,
 } from '@/api/exercise';
+import { subjectiveQuestionList } from './answer';
 
 import StartQuestion from './components/StartQuestion.vue';
 import AnswerReport from './components/AnswerReport.vue';
@@ -105,6 +112,7 @@ export default {
       answer_time_limit_minute: 30, // 答题时间限制
       time: 1800,
       isSubmit: false,
+      isView: false, // 练习模式下是否查看
       curQuestionPage: '', // 当前问题页面
       isAnnotations: false, // 是否显示批注
     };
@@ -130,10 +138,18 @@ export default {
 
       if (this.share_record_id) {
         GetShareRecordInfo({ share_record_id: this.share_record_id }).then(
-          ({ user_answer_record_info, share_record: { exercise_id } }) => {
+          ({ user_answer_record_info, share_record: { exercise_id, answer_mode, answer_time_limit_minute } }) => {
             this.user_answer_record_info = user_answer_record_info;
             this.exercise_id = exercise_id;
             this.getExerciseQuestionIndexList();
+            this.answer_time_limit_minute = answer_time_limit_minute;
+            this.time = answer_time_limit_minute * 60;
+            // 如果是考试模式，且已经存在答题记录，则直接显示答题报告
+            if (this.user_answer_record_info.is_exist_answer_record === 'true' && answer_mode === 2) {
+              this.answer_record_id = this.user_answer_record_info.answer_record_id;
+              this.answer_mode = answer_mode;
+              this.isSubmit = true;
+            }
           },
         );
       }
@@ -146,6 +162,14 @@ export default {
         }));
       });
     },
+    goBack() {
+      if (this.isView) {
+        this.isSubmit = true;
+        this.isView = false;
+        return;
+      }
+      this.$router.push('/personal_question');
+    },
     // 倒计时
     countDown() {
       this.countDownTimer = setInterval(() => {
@@ -161,10 +185,8 @@ export default {
         return;
       }
       StartAnswer({ exercise_id: this.exercise_id, share_record_id: this.share_record_id }).then(
-        ({ answer_time_limit_minute, answer_mode, answer_record_id }) => {
+        ({ answer_mode, answer_record_id }) => {
           this.answer_record_id = answer_record_id;
-          this.answer_time_limit_minute = answer_time_limit_minute;
-          this.time = answer_time_limit_minute * 60;
           this.countDown();
           this.answer_mode = answer_mode;
           this.curQuestionIndex = 0;
@@ -172,14 +194,6 @@ export default {
         },
       );
     },
-    preQuestion() {
-      if (this.curQuestionIndex === 0) return;
-      this.curQuestionIndex -= 1;
-    },
-    nextQuestion() {
-      if (this.curQuestionIndex === this.questionList.length - 1) return;
-      this.curQuestionIndex += 1;
-    },
     // 获取题目信息
     getQuestionInfo() {
       GetQuestionInfo({ question_id: this.questionList[this.curQuestionIndex].id })
@@ -194,6 +208,14 @@ export default {
         })
         .catch(() => {});
     },
+    preQuestion() {
+      if (this.curQuestionIndex === 0) return;
+      this.curQuestionIndex -= 1;
+    },
+    nextQuestion() {
+      if (this.curQuestionIndex === this.questionList.length - 1) return;
+      this.curQuestionIndex += 1;
+    },
     /**
      * 填写答案
      * @param {'pre' | 'next'} type 上一题/下一题
@@ -205,7 +227,11 @@ export default {
         this.curQuestionIndex = type === 'pre' ? this.curQuestionIndex - 1 : this.curQuestionIndex + 1;
         return;
       }
-      if (this.questionList[this.curQuestionIndex].isFill) {
+      // 如果是主观题或已填写，直接跳转
+      if (
+        this.questionList[this.curQuestionIndex].isFill ||
+        subjectiveQuestionList.includes(this.currentQuestion.type)
+      ) {
         if (type === 'pre') return this.preQuestion();
         if (type === 'next') return this.nextQuestion();
       }
@@ -219,6 +245,7 @@ export default {
         this.questionList[this.curQuestionIndex].isFill = true;
         // if (type === 'pre') return this.preQuestion();
         // if (type === 'next') return this.nextQuestion();
+        // 显示答案
         this.$refs.exercise[0].showAnswer(
           this.answer_mode === 1,
           this.user_answer_record_info.correct_answer_show_mode === 1,
@@ -236,7 +263,7 @@ export default {
         this.$refs.exercise[0].showAnswer(
           this.answer_mode === 1,
           this.user_answer_record_info.correct_answer_show_mode === 1,
-          JSON.parse(content),
+          JSON.parse(content || '{}'),
         );
       });
     },
@@ -246,21 +273,25 @@ export default {
 
       // 如果已经填写过答案，直接提交
       if (this.questionList[this.curQuestionIndex].isFill) {
-        SubmitAnswer({ answer_record_id: this.answer_record_id }).then(() => {
-          this.isSubmit = true;
-        });
+        SubmitAnswer({ answer_record_id: this.answer_record_id })
+          .then(() => {
+            this.isSubmit = true;
+          })
+          .catch(() => {});
         return;
       }
 
       this.fillQuestionAnswer('next').then(() => {
-        SubmitAnswer({ answer_record_id: this.answer_record_id }).then(() => {
-          this.isSubmit = true;
-        });
+        SubmitAnswer({ answer_record_id: this.answer_record_id })
+          .then(() => {
+            this.isSubmit = true;
+          })
+          .catch(() => {});
       });
     },
     selectQuestion(i) {
-      console.log(i);
       this.isSubmit = false;
+      this.isView = true;
       this.curQuestionIndex = i;
     },
   },

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

@@ -159,6 +159,10 @@ export default {
         this.saveQuestion();
       }, 30000);
     },
+    // 清除保存时间
+    clearSaveDate() {
+      clearInterval(this.timer);
+    },
     /**
      * 选择练习
      * @param {Number} i 练习索引

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

@@ -26,12 +26,12 @@
       <div class="content">
         <label class="title-little">题目：</label>
         <ul>
-          <li v-for="(item, i) in data.option_list" :key="i" class="content-item" v-loading="item.loadings">
+          <li v-for="(item, i) in data.option_list" :key="i" v-loading="item.loadings" class="content-item">
             <span
-              class="question-number"
-              @dblclick="changeOptionType(data)"
               v-if="data.property.learn_type === 'dictation'"
+              class="question-number"
               title="双击切换序号类型"
+              @dblclick="changeOptionType(data)"
             >
               {{ computedQuestionNumber(i, data.option_number_show_mode) }}
             </span>
@@ -55,8 +55,8 @@
               @deleteFile="deleteFiles"
             />
             <div v-else-if="data.other.audio_generation_method === 'auto'" class="auto-matically">
-              <AudioPlay :file-id="item.audio_file_id" theme-color="gray" v-if="item.audio_file_id" />
-              <span class="auto-btn" @click="handleMatically(item)" v-loading="item.loading">{{
+              <AudioPlay v-if="item.audio_file_id" :file-id="item.audio_file_id" theme-color="gray" />
+              <span v-loading="item.loading" class="auto-btn" @click="handleMatically(item)">{{
                 item.audio_file_id ? '已生成' : '自动生成'
               }}</span>
             </div>
@@ -145,7 +145,7 @@
             {{ label }}
           </el-radio>
         </el-form-item>
-        <el-form-item label="田字格数" v-if="data.property.learn_type !== 'dictation'">
+        <el-form-item v-if="data.property.learn_type !== 'dictation'" label="田字格数">
           <el-input
             v-model="data.property.tian_number"
             type="number"

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

@@ -27,7 +27,7 @@
         <label class="title-little">字词：</label>
         <ul>
           <li v-for="(item, i) in data.option_list" :key="i" class="content-word-card">
-            <div class="item-left" v-if="item.picture_file_id">
+            <div v-if="item.picture_file_id" class="item-left">
               <el-image
                 style="width: 72px; height: 72px"
                 :src="pic_list[item.picture_file_id]"
@@ -38,14 +38,8 @@
                 <i class="el-icon-delete"></i>删除
               </el-button>
             </div>
-            <UploadDrag
-              v-else
-              @fileUploadSuccess="fileUploadSuccess"
-              :itemIndex="i"
-              :limit="1"
-              ref="uploadDrag"
-            ></UploadDrag>
-            <div class="word-card-item" v-loading="item.loadings">
+            <UploadDrag v-else ref="uploadDrag" :item-index="i" :limit="1" @fileUploadSuccess="fileUploadSuccess" />
+            <div v-loading="item.loadings" class="word-card-item">
               <div class="word-card">
                 <el-input v-model="item.content" :placeholder="'输入汉字或词汇'" @blur="handleChineseStrokes(item)" />
                 <el-input v-model="item.pinyin" :placeholder="'拼音间用空格隔开'" />
@@ -59,13 +53,13 @@
                   @deleteFile="deleteFiles"
                 />
                 <div v-else-if="data.other.audio_generation_method === 'auto'" class="auto-matically">
-                  <AudioPlay :file-id="item.audio_file_id" theme-color="gray" v-if="item.audio_file_id" />
-                  <span class="auto-btn" @click="handleMatically(item)" v-loading="item.loading">{{
+                  <AudioPlay v-if="item.audio_file_id" :file-id="item.audio_file_id" theme-color="gray" />
+                  <span v-loading="item.loading" class="auto-btn" @click="handleMatically(item)">{{
                     item.audio_file_id ? '已生成' : '自动生成'
                   }}</span>
                 </div>
                 <SoundRecord v-else :wav-blob.sync="item.audio_file_id" />
-                <span class="rate-box"><el-rate v-model="item.rate"></el-rate></span>
+                <span class="rate-box"><el-rate v-model="item.rate" /></span>
                 <el-input v-model="item.definition" placeholder="输入释义" type="textarea" :rows="1" />
               </div>
               <SvgIcon
@@ -76,8 +70,8 @@
             </div>
 
             <div class="example-sentence-box">
-              <div class="example-sentence" v-for="(items, indexs) in item.example_sentence" :key="indexs">
-                <span class="question-number" @dblclick="changeOptionType(data)" title="双击切换序号类型">
+              <div v-for="(items, indexs) in item.example_sentence" :key="indexs" class="example-sentence">
+                <span class="question-number" title="双击切换序号类型" @dblclick="changeOptionType(data)">
                   {{ computedQuestionNumber(indexs, data.option_number_show_mode) }}
                 </span>
                 <el-input v-model="item.example_sentence[indexs]" placeholder="输入例句" />
@@ -164,8 +158,7 @@
 import QuestionMixin from '../common/QuestionMixin.js';
 import UploadAudio from '../common/UploadAudio.vue';
 import SoundRecord from '../common/SoundRecord.vue';
-import { GetStaticResources } from '@/api/app';
-import { GetFileStoreInfo } from '@/api/app';
+import { GetStaticResources, GetFileStoreInfo } from '@/api/app';
 import { changeOptionType, handleInputNumber } from '@/views/exercise_questions/data/common';
 import UploadDrag from '../common/UploadDrag.vue';
 

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

@@ -17,7 +17,7 @@
       <div class="content">
         <label class="title-little">阅读材料：</label>
         <RichText v-model="data.article" placeholder="输入阅读材料" />
-        <label class="title-little" v-if="isEnable(data.property.is_enable_description)">题目要求：</label>
+        <label v-if="isEnable(data.property.is_enable_description)" class="title-little">题目要求：</label>
         <RichText
           v-if="isEnable(data.property.is_enable_description)"
           v-model="data.description"
@@ -85,7 +85,7 @@
           />
         </el-form-item>
         <el-form-item label="字数">
-          <el-input-number :min="1" :step="10" v-model="data.property.word_num" class="word-num-input" :precision="0" />
+          <el-input-number v-model="data.property.word_num" :min="1" :step="10" class="word-num-input" :precision="0" />
         </el-form-item>
         <el-form-item label="范文">
           <el-radio

src/views/exercise_questions/create/index.vue

@@ -195,6 +195,7 @@ export default {
       if (this.index_list.length === 0) return;
       GetQuestionInfo({ question_id: this.index_list[this.curIndex].id })
         .then(({ question }) => {
+          this.$refs.createMain.resetSaveDate();
           if (!question.content) return;
 
           this.$nextTick(() => {
@@ -230,9 +231,9 @@ export default {
      */
     selectExerciseItem(index, data) {
       if (index < 0 || index > this.index_list.length - 1) return;
-      this.curIndex = index;
-      this.$refs.createMain.resetSaveDate();
+      this.$refs.createMain.clearSaveDate();
       this.$refs.createMain.saveQuestion(data);
+      this.curIndex = index;
     },
     // 设置
     setUp() {

src/views/exercise_questions/preview/ReplaceAnswerPreview.vue

@@ -13,12 +13,12 @@
             <el-option v-for="items in item" :key="items.content" :label="items.content" :value="items.content">
             </el-option>
           </el-select> -->
-          <span class="select-item selsec-active">{{ active_content[i] }}</span>
-          <ul @scroll="handleScroll($event, i)" class="replace-ul" :ref="'ui' + i">
+          <span class="select-item select-active">{{ active_content[i] }}</span>
+          <ul :ref="'ui' + i" class="replace-ul" @scroll="handleScroll($event, i)">
             <li
-              :class="[answer.answer_list[0].select_mark[i] === items.mark ? 'active' : '']"
               v-for="(items, indexs) in item"
               :key="indexs"
+              :class="[answer.answer_list[0].select_mark[i] === items.mark ? 'active' : '']"
               @click="handleClickItem(i, indexs)"
             >
               {{ items.content }}
@@ -98,8 +98,8 @@ export default {
       this.$forceUpdate();
     },
     handleClickItem(i, indexs) {
-      console.log(this.$refs['ui' + i][0].scrollTop);
-      this.$refs['ui' + i][0].scrollTop = indexs * 48;
+      console.log(this.$refs[`ui${i}`][0].scrollTop);
+      this.$refs[`ui${i}`][0].scrollTop = indexs * 48;
       this.active_content[i] = this.option_list[i][indexs].content;
       this.answer.answer_list[0].select_mark[i] = this.option_list[i][indexs].mark;
       this.$forceUpdate();
@@ -137,7 +137,7 @@ export default {
       background-color: rgba(239, 239, 239, 100%);
     }
 
-    .selsec-active {
+    .select-active {
       position: absolute;
       top: 50%;
       left: 0;

src/views/exercise_questions/preview/TalkPictruePreview.vue

@@ -7,7 +7,7 @@
     </div>
     <div v-if="isEnable(data.property.is_enable_description)" class="description">{{ data.description }}</div>
     <div class="content">
-      <div class="content-item" v-for="(item, index) in data.option_list" :key="index">
+      <div v-for="(item, index) in data.option_list" :key="index" class="content-item">
         <el-image
           v-if="pic_list[item.picture_file_id]"
           style="width: 370px; height: 238px"
@@ -17,7 +17,7 @@
         <h3 class="pic-title" v-html="sanitizeHTML(item.picture_title)"></h3>
         <p class="pic-info" v-html="sanitizeHTML(item.picture_info)"></p>
         <!-- 语音作答 -->
-        <div class="sound-box" v-if="isEnable(data.property.is_enable_voice_answer)">
+        <div v-if="isEnable(data.property.is_enable_voice_answer)" class="sound-box">
           <SoundRecordPreview :wav-blob.sync="answer_list[index].audio_file_id" type="small" />
         </div>
 

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

@@ -1,4 +1,3 @@
-<!--  -->
 <template>
   <div class="practice practiceSingleNPC">
     <i class="el-icon-close close-icon" @click="changePraShow()"></i>