修改显示

src/views/unit-test/model/unit-audio/index.tsx

@@ -1,5 +1,5 @@
 import { Icon } from 'vant'
-import { defineComponent, onUnmounted, reactive } from 'vue'
+import { defineComponent, onUnmounted, reactive, watch } from 'vue'
 import styles from './index.module.less'
 import { Howl } from 'howler'
 import iconAudio from './images/icon-audio.png'
@@ -21,7 +21,7 @@ export default defineComponent({
     })
     // https://github.com/Tonejs/Tone.js/issues/784 部分ios上可能存在问题
     const htick: any = new Howl({
-      src: props.src,
+      src: props.src + '?t=' + +new Date(),
       format: ['mp3']
       // sprite: {
       //   blast: [0, 3000],
@@ -31,15 +31,15 @@ export default defineComponent({
     })
     console.log(htick)
 
-    htick.on('load', (val) => {
+    htick.on('load', (val: any) => {
       console.log('111')
       console.log(htick.duration())
       state.duration = Math.ceil(htick.duration())
     })
     // 播放结束
-    htick.on('end', () => {
-      console.log('1')
-    })
+    // htick.on('end', () => {
+    //   console.log('1')
+    // })
 
     eventUnit.on('unitAudioStop', () => {
       htick.stop()

src/views/unit-test/unit-detail/index.tsx

@@ -226,10 +226,36 @@ export default defineComponent({
             resizeSwipeItemHeight()
           }}
         >
-          {state.questionList.map(
-            (item: any, index: number) =>
-              item.questionTypeCode === QuestionType.CHECKBOX && (
-                <SwipeItem>
+          {state.questionList.map((item: any, index: number) => (
+            // item.questionTypeCode === QuestionType.CHECKBOX && (
+            //   <SwipeItem>
+            //     <ChoiceQuestion
+            //       v-model:value={item.userAnswer}
+            //       index={index + 1}
+            //       data={item}
+            //       readOnly
+            //       type="checkbox"
+            //       showRate={item.showRate}
+            //       showAnalysis={item.showAnalysis}
+            //       analysis={item.analysis}
+            //     />
+            //   </SwipeItem>
+            // )
+            <SwipeItem>
+              <div class="swipe-item-question">
+                {item.questionTypeCode === QuestionType.RADIO && (
+                  <ChoiceQuestion
+                    v-model:value={item.userAnswer}
+                    index={index + 1}
+                    data={item}
+                    readOnly
+                    type="radio"
+                    showRate={item.showRate}
+                    showAnalysis={item.showAnalysis}
+                    analysis={item.analysis}
+                  />
+                )}
+                {item.questionTypeCode === QuestionType.CHECKBOX && (
                   <ChoiceQuestion
                     v-model:value={item.userAnswer}
                     index={index + 1}
@@ -240,71 +266,44 @@ export default defineComponent({
                     showAnalysis={item.showAnalysis}
                     analysis={item.analysis}
                   />
-                </SwipeItem>
-              )
-            // <SwipeItem>
-            //   <div class="swipe-item-question">
-            //     {item.questionTypeCode === QuestionType.RADIO && (
-            //       <ChoiceQuestion
-            //         v-model:value={item.userAnswer}
-            //         index={index + 1}
-            //         data={item}
-            //         readOnly
-            //         type="radio"
-            //         showRate={item.showRate}
-            //         showAnalysis={item.showAnalysis}
-            //         analysis={item.analysis}
-            //       />
-            //     )}
-            //     {item.questionTypeCode === QuestionType.CHECKBOX && (
-            //       <ChoiceQuestion
-            //         v-model:value={item.userAnswer}
-            //         index={index + 1}
-            //         data={item}
-            //         readOnly
-            //         type="checkbox"
-            //         showRate={item.showRate}
-            //         showAnalysis={item.showAnalysis}
-            //         analysis={item.analysis}
-            //       />
-            //     )}
-            //     {item.questionTypeCode === QuestionType.SORT && (
-            //       <DragQuestion
-            //         readOnly
-            //         v-model:value={item.userAnswer}
-            //         data={item}
-            //         index={index + 1}
-            //         showRate={item.showRate}
-            //         showAnalysis={item.showAnalysis}
-            //         analysis={item.analysis}
-            //       />
-            //     )}
-            //     {item.questionTypeCode === QuestionType.LINK && (
-            //       <KeepLookQuestion
-            //         readOnly
-            //         v-model:value={item.userAnswer}
-            //         data={item}
-            //         index={index + 1}
-            //         showRate={item.showRate}
-            //         showAnalysis={item.showAnalysis}
-            //         analysis={item.analysis}
-            //       />
-            //     )}
-            //     {item.questionTypeCode === QuestionType.PLAY && (
-            //       <PlayQuestion
-            //         readOnly
-            //         v-model:value={item.userAnswer}
-            //         data={item}
-            //         index={index + 1}
-            //         unitId={state.id as any}
-            //         showRate={item.showRate}
-            //         showAnalysis={item.showAnalysis}
-            //         analysis={item.analysis}
-            //       />
-            //     )}
-            //   </div>
-            // </SwipeItem>
-          )}
+                )}
+                {item.questionTypeCode === QuestionType.SORT && (
+                  <DragQuestion
+                    readOnly
+                    v-model:value={item.userAnswer}
+                    data={item}
+                    index={index + 1}
+                    showRate={item.showRate}
+                    showAnalysis={item.showAnalysis}
+                    analysis={item.analysis}
+                  />
+                )}
+                {item.questionTypeCode === QuestionType.LINK && (
+                  <KeepLookQuestion
+                    readOnly
+                    v-model:value={item.userAnswer}
+                    data={item}
+                    index={index + 1}
+                    showRate={item.showRate}
+                    showAnalysis={item.showAnalysis}
+                    analysis={item.analysis}
+                  />
+                )}
+                {item.questionTypeCode === QuestionType.PLAY && (
+                  <PlayQuestion
+                    readOnly
+                    v-model:value={item.userAnswer}
+                    data={item}
+                    index={index + 1}
+                    unitId={state.id as any}
+                    showRate={item.showRate}
+                    showAnalysis={item.showAnalysis}
+                    analysis={item.analysis}
+                  />
+                )}
+              </div>
+            </SwipeItem>
+          ))}
         </Swipe>
 
         <OSticky position="bottom" background="white">