将预览题型提出到混入

src/views/exercise_questions/answer/index.vue

@@ -73,48 +73,15 @@ import {
 
 import StartQuestion from './components/StartQuestion.vue';
 import AnswerReport from './components/AnswerReport.vue';
-
-import SelectPreview from '@/views/exercise_questions/preview/SelectPreview.vue';
-import JudgePreview from '@/views/exercise_questions/preview/JudgePreview.vue';
-import MatchingPreview from '@/views/exercise_questions/preview/MatchingPreview.vue';
-import ChinesePreview from '@/views/exercise_questions/preview/ChinesePreview.vue';
-import WritePreview from '../preview/WritePreview.vue';
-import FillPreview from '../preview/FillPreview.vue';
-import ReadAloudPreview from '../preview/ReadAloudPreview.vue';
-import DialoguePreview from '../preview/DialoguePreview.vue';
-import TalkPictruePreview from '../preview/TalkPictruePreview.vue';
-import ChooseTonePreview from '../preview/ChooseTonePreview.vue';
-import RepeatPreview from '../preview/RepeatPreview.vue';
-import ReadPreview from '../preview/ReadPreview.vue';
-import SortPreview from '../preview/SortPreview.vue';
-import ListenSelectPreview from '../preview/ListenSelectPreview.vue';
-import ListenFillPreview from '../preview/ListenFillPreview.vue';
-import ListenJudgePreview from '../preview/ListenJudgePreview.vue';
-import WordCardPreview from '../preview/WordCardPreview.vue';
+import PreviewQuestionTypeMixin from '../data/PreviewQuestionTypeMixin';
 
 export default {
   name: 'AnswerPage',
   components: {
-    SelectPreview,
-    JudgePreview,
-    MatchingPreview,
-    ChinesePreview,
-    WritePreview,
-    FillPreview,
-    ReadAloudPreview,
-    DialoguePreview,
-    TalkPictruePreview,
-    ChooseTonePreview,
-    RepeatPreview,
-    ReadPreview,
-    SortPreview,
-    ListenSelectPreview,
-    ListenFillPreview,
-    ListenJudgePreview,
-    WordCardPreview,
     StartQuestion,
     AnswerReport,
   },
+  mixins: [PreviewQuestionTypeMixin],
   data() {
     const { id, share_record_id } = this.$route.query;
 
@@ -138,27 +105,7 @@ export default {
       answer_time_limit_minute: 30, // 答题时间限制
       time: 1800,
       isSubmit: false,
-      answerComponents: {
-        select: SelectPreview,
-        judge: JudgePreview,
-        matching: MatchingPreview,
-        chinese: ChinesePreview,
-        write: WritePreview,
-        fill: FillPreview,
-        read_aloud: ReadAloudPreview,
-        dialogue: DialoguePreview,
-        talk_picture: TalkPictruePreview,
-        choose_tone: ChooseTonePreview,
-        repeat: RepeatPreview,
-        read: ReadPreview,
-        sort: SortPreview,
-        listen_select: ListenSelectPreview,
-        listen_fill: ListenFillPreview,
-        listen_judge: ListenJudgePreview,
-        word_card: WordCardPreview,
-      },
       curQuestionPage: '', // 当前问题页面
-
       isAnnotations: false, // 是否显示批注
     };
   },
@@ -243,7 +190,7 @@ export default {
           this.curQuestionPage =
             this.questionList.length === 0 || this.curQuestionIndex < 0
               ? ''
-              : this.answerComponents[this.questionList[this.curQuestionIndex].type];
+              : this.previewComponents[this.questionList[this.curQuestionIndex].type];
         })
         .catch(() => {});
     },

src/views/exercise_questions/create/index.vue

@@ -72,50 +72,14 @@ import {
 } from '@/api/exercise';
 
 import CreateMain from './components/create.vue';
-import SelectPreview from '@/views/exercise_questions/preview/SelectPreview.vue';
-import JudgePreview from '@/views/exercise_questions/preview/JudgePreview.vue';
-import MatchingPreview from '@/views/exercise_questions/preview/MatchingPreview.vue';
-import ChinesePreview from '@/views/exercise_questions/preview/ChinesePreview.vue';
-import WritePreview from '../preview/WritePreview.vue';
-import FillPreview from '../preview/FillPreview.vue';
-import ReadAloudPreview from '../preview/ReadAloudPreview.vue';
-import DialoguePreview from '../preview/DialoguePreview.vue';
-import TalkPictruePreview from '../preview/TalkPictruePreview.vue';
-import ChooseTonePreview from '../preview/ChooseTonePreview.vue';
-import RepeatPreview from '../preview/RepeatPreview.vue';
-import ReadPreview from '../preview/ReadPreview.vue';
-import SortPreview from '../preview/SortPreview.vue';
-import ListenSelectPreview from '../preview/ListenSelectPreview.vue';
-import ListenFillPreview from '../preview/ListenFillPreview.vue';
-import ListenJudgePreview from '../preview/ListenJudgePreview.vue';
-import WordCardPreview from '../preview/WordCardPreview.vue';
-import AnswerQuestionPreview from '../preview/AnswerQuestionPreview.vue';
-import WritePictruePreview from '../preview/WritePictruePreview.vue';
+import PreviewQuestionTypeMixin from '../data/PreviewQuestionTypeMixin';
 
 export default {
   name: 'CreateExercise',
   components: {
     CreateMain,
-    SelectPreview,
-    JudgePreview,
-    MatchingPreview,
-    ChinesePreview,
-    WritePreview,
-    FillPreview,
-    ReadAloudPreview,
-    DialoguePreview,
-    TalkPictruePreview,
-    ChooseTonePreview,
-    RepeatPreview,
-    ReadPreview,
-    SortPreview,
-    ListenSelectPreview,
-    ListenFillPreview,
-    ListenJudgePreview,
-    WordCardPreview,
-    AnswerQuestionPreview,
-    WritePictruePreview,
   },
+  mixins: [PreviewQuestionTypeMixin],
   provide() {
     return {
       isSetUp: () => this.isSetUp,
@@ -137,27 +101,6 @@ export default {
       isSetUp: false, // 设置
       preview: false, // 预览显示
       previewData: {}, // 预览数据
-      previewComponents: {
-        select: SelectPreview,
-        judge: JudgePreview,
-        matching: MatchingPreview,
-        chinese: ChinesePreview,
-        write: WritePreview,
-        fill: FillPreview,
-        read_aloud: ReadAloudPreview,
-        dialogue: DialoguePreview,
-        talk_picture: TalkPictruePreview,
-        choose_tone: ChooseTonePreview,
-        repeat: RepeatPreview,
-        read: ReadPreview,
-        sort: SortPreview,
-        listen_select: ListenSelectPreview,
-        listen_fill: ListenFillPreview,
-        listen_judge: ListenJudgePreview,
-        word_card: WordCardPreview,
-        answer_question: AnswerQuestionPreview,
-        write_picture: WritePictruePreview,
-      },
     };
   },
   computed: {

src/views/exercise_questions/data/PreviewQuestionTypeMixin.js

@@ -0,0 +1,70 @@
+import SelectPreview from '@/views/exercise_questions/preview/SelectPreview.vue';
+import JudgePreview from '@/views/exercise_questions/preview/JudgePreview.vue';
+import MatchingPreview from '@/views/exercise_questions/preview/MatchingPreview.vue';
+import ChinesePreview from '@/views/exercise_questions/preview/ChinesePreview.vue';
+import WritePreview from '../preview/WritePreview.vue';
+import FillPreview from '../preview/FillPreview.vue';
+import ReadAloudPreview from '../preview/ReadAloudPreview.vue';
+import DialoguePreview from '../preview/DialoguePreview.vue';
+import TalkPictruePreview from '../preview/TalkPictruePreview.vue';
+import ChooseTonePreview from '../preview/ChooseTonePreview.vue';
+import RepeatPreview from '../preview/RepeatPreview.vue';
+import ReadPreview from '../preview/ReadPreview.vue';
+import SortPreview from '../preview/SortPreview.vue';
+import ListenSelectPreview from '../preview/ListenSelectPreview.vue';
+import ListenFillPreview from '../preview/ListenFillPreview.vue';
+import ListenJudgePreview from '../preview/ListenJudgePreview.vue';
+import WordCardPreview from '../preview/WordCardPreview.vue';
+import AnswerQuestionPreview from '../preview/AnswerQuestionPreview.vue';
+import WritePictruePreview from '../preview/WritePictruePreview.vue';
+
+const PreviewQuestionTypeMixin = {
+  components: {
+    SelectPreview,
+    JudgePreview,
+    MatchingPreview,
+    ChinesePreview,
+    WritePreview,
+    FillPreview,
+    ReadAloudPreview,
+    DialoguePreview,
+    TalkPictruePreview,
+    ChooseTonePreview,
+    RepeatPreview,
+    ReadPreview,
+    SortPreview,
+    ListenSelectPreview,
+    ListenFillPreview,
+    ListenJudgePreview,
+    WordCardPreview,
+    AnswerQuestionPreview,
+    WritePictruePreview,
+  },
+  data() {
+    return {
+      previewComponents: {
+        select: SelectPreview,
+        judge: JudgePreview,
+        matching: MatchingPreview,
+        chinese: ChinesePreview,
+        write: WritePreview,
+        fill: FillPreview,
+        read_aloud: ReadAloudPreview,
+        dialogue: DialoguePreview,
+        talk_picture: TalkPictruePreview,
+        choose_tone: ChooseTonePreview,
+        repeat: RepeatPreview,
+        read: ReadPreview,
+        sort: SortPreview,
+        listen_select: ListenSelectPreview,
+        listen_fill: ListenFillPreview,
+        listen_judge: ListenJudgePreview,
+        word_card: WordCardPreview,
+        answer_question: AnswerQuestionPreview,
+        write_picture: WritePictruePreview,
+      },
+    };
+  },
+};
+
+export default PreviewQuestionTypeMixin;

src/views/exercise_questions/data/common.js

@@ -222,6 +222,7 @@ export function addTone(number, con) {
 
 /**
  * 输入框输入小于0的返回0 且为整数
+ * @param {number|string} number
  */
 export function handleInputNumber(number) {
   const number_int = Number(number);

src/views/exercise_questions/preview/WritePictruePreview.vue

@@ -72,13 +72,12 @@
 <script>
 import PreviewMixin from './components/PreviewMixin';
 import { GetFileStoreInfo } from '@/api/app';
-import SoundRecordPreview from './components/common/SoundRecordPreview.vue';
+
 import UploadFiles from './components/common/UploadFiles.vue';
 
 export default {
   name: 'TalkPictruePreview',
   components: {
-    SoundRecordPreview,
     UploadFiles,
   },
   mixins: [PreviewMixin],

src/views/exercise_questions/preview/components/PreviewMixin.js

@@ -18,8 +18,8 @@ const PreviewMixin = {
     return {
       isEnable,
       answer: { answer_list: [] }, // 答案
-      isJudgingRightWrong: false,
-      isShowRightAnswer: false,
+      isJudgingRightWrong: false, // 是否判断对错
+      isShowRightAnswer: false, // 是否显示正确答案
     };
   },
   watch: {
@@ -41,9 +41,9 @@ const PreviewMixin = {
     },
     /**
      * 显示答案
-     * @param {Object} userAnswer 用户答案
      * @param {Boolean} isJudgingRightWrong 是否判断对错
      * @param {Boolean} isShowRightAnswer 是否显示正确答案
+     * @param {Object} userAnswer 用户答案
      */
     showAnswer(isJudgingRightWrong, isShowRightAnswer, userAnswer) {
       this.isJudgingRightWrong = isJudgingRightWrong;