修复练习的bug,红字正在做

src/hooks/exam/driverExam.ts

@@ -4,8 +4,6 @@ import moment from 'moment';
 import audio from "@/utils/audio";
 import { useStore } from "vuex";
 export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoRes>, config = {
-  autoNext: false,
-  autoRead: false,
   countDown: true,
   autoAnswer: true
 }) => {
@@ -539,6 +537,7 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
 
   }
   const playIssueAudio = () => {
+    audio.stopAudio()
     audio.playAudio(list.value[listIndex.value].issuemp3)
   }
   const getProblemTypeName = (type: number) => {
@@ -761,6 +760,9 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
       }
 
     }
+    if(store.state.sysConfig.autoRead){
+      playIssueAudio()
+    }
 
     //提示
   });

src/utils/audio.ts

@@ -2,16 +2,37 @@
 
 
 import { Howl, Howler } from 'howler';
-export default {
-    playAudio: (src: string | string[]) => {
-        const audio = new Howl({
+interface globalAudioType {
+    id: number,
+    audio: Howl | undefined
+    playAudio(src: string | string[]): number
+    stopAudio(): void
+
+
+}
+const globalAudio: globalAudioType = {
+    id: 0,
+    audio: undefined,
+    playAudio: function (src: string | string[]) {
+        this.audio?.stop()
+        this.audio = new Howl({
             src: src,
-            html5:true
+            html5: true
         });
-        audio.play()
+        this.id = this.audio.play()
+        // this.audio.once('end',(soundId=>{
+        //     this.audio?.unload()
+
+        // }))
+        return this.id
+
+
+    },
+    stopAudio: function () {
+        this.audio?.stop(this.id)
         return
 
 
     }
-
-}
+}
+export default globalAudio

src/views/home/components/leftTab/index.vue

@@ -6,23 +6,15 @@
           <div
             v-for="(item, index) in tabList"
             :class="{
-              'overflow-hidden': !item.isOpen,
-              'left-item_select': item.isSelect,
+              'overflow-y-visible': tabValue[0] == index,
+              'left-item_select': tabValue[0] == index,
             }"
             :key="index"
             class="left-item"
           >
             <div class="w-full h-full pl25 relative">
               <img class="" :src="item.icon" />
-              <div
-                @click="
-                  () => {
-                    item.isOpen = !item.isOpen;
-                    item.isSelect = !item.isSelect;
-                  }
-                "
-                class="title"
-              >
+              <div @click="selectParent(item, index)" class="title">
                 {{ item.text }}
               </div>
               <img
@@ -42,8 +34,8 @@
                 :key="_index"
                 v-for="(_item, _index) in item.children"
                 class="left-item-open cursor-pointer"
-                @click="selectChildren(item.children, _index)"
-                :class="{ 'left-item-open_select': _item.isSelect }"
+                @click="selectChildren(_item, _index)"
+                :class="{ 'left-item-open_select': tabValue[1] == _index }"
               >
                 {{ _item.text }}
                 <!-- xx -->
@@ -72,8 +64,6 @@ import { defineComponent, reactive, toRefs } from "vue";
 import sysIcon from "@/assets/img/home/sys_icon.png";
 import xcIcon from "@/assets/img/home/xc_icon.png";
 import mtcIcon from "@/assets/img/home/mtc_icon.png";
-import bottomArrow from "@/assets/img/home/bottom_arrow.png";
-import topArrow from "@/assets/img/home/bottom_arrow.png";
 export default defineComponent({
   setup() {
     const state = reactive({
@@ -92,18 +82,30 @@ export default defineComponent({
           isSelect: false,
           children: [
             {
-              text: "1.练习技巧",
+              text: "练习技巧",
               isSelect: false,
-              path: "/home/practiseSelect?subject=1",
+              path: "/home/practiseSelect",
+              query: {
+                subject: 1,
+                liceBus: "1",
+                liceTruck: "1",
+                liceCar: "1",
+              },
             },
             // {
             //   text: "2.套餐技巧",
             //   isSelect: false,
             // },
             {
-              text: "3.模拟考试",
+              text: "模拟考试",
               isSelect: false,
               path: "/examInstructions",
+              query: {
+                subject: 1,
+                liceBus: "1",
+                liceTruck: "1",
+                liceCar: "1",
+              },
             },
           ],
           isOpen: false,
@@ -114,18 +116,30 @@ export default defineComponent({
           icon: xcIcon,
           children: [
             {
-              text: "1.练习技巧",
+              text: "练习技巧",
               isSelect: false,
-              path: "/home/practiseSelect?subject=4",
+              path: "/home/practiseSelect",
+              query: {
+                subject: 4,
+                liceBus: "1",
+                liceTruck: "1",
+                liceCar: "1",
+              },
             },
             // {
             //   text: "2.套餐技巧",
             //   isSelect: false,
             // },
             {
-              text: "3.模拟考试",
+              text: "模拟考试",
               isSelect: false,
               path: "/examInstructions",
+              query: {
+                subject: 4,
+                liceBus: "1",
+                liceTruck: "1",
+                liceCar: "1",
+              },
             },
           ],
           isOpen: false,
@@ -137,16 +151,55 @@ export default defineComponent({
           icon: mtcIcon,
           children: [
             {
-              text: "1.练习技巧",
+              text: "练习技巧",
+              path: "/home/practiseSelect",
               isSelect: false,
+              query: {
+                subject: 1,
+                liceMoto: "1",
+              },
             },
             // {
             //   text: "2.套餐技巧",
             //   isSelect: false,
             // },
             {
-              text: "3.模拟考试",
+              text: "模拟考试",
               isSelect: false,
+              path: "/examInstructions",
+              query: {
+                subject: 1,
+                liceMoto: "1",
+              },
+            },
+          ],
+          isOpen: false,
+          isSelect: false,
+          path: "",
+        },
+        {
+          text: "摩托车科目四",
+          icon: mtcIcon,
+          children: [
+            {
+              text: "练习技巧",
+              path: "/home/practiseSelect",
+              isSelect: false,
+              query: {
+                subject: 4,
+              },
+            },
+            // {
+            //   text: "2.套餐技巧",
+            //   isSelect: false,
+            // },
+            {
+              text: "模拟考试",
+              isSelect: false,
+              path: "/examInstructions",
+              query: {
+                subject: 4,
+              },
             },
           ],
           isOpen: false,
@@ -154,30 +207,58 @@ export default defineComponent({
           path: "",
         },
       ],
+      tabValue: [-1, -1],
     });
     return {
       ...toRefs(state),
     };
   },
   methods: {
+    selectParent(
+      item: {
+        text: string;
+        isSelect: boolean;
+        isOpen: boolean;
+        path: string;
+      },
+      selectIndex: number
+    ) {
+      this.tabValue[0] == -1
+        ? (this.tabValue[0] = selectIndex)
+        : (this.tabValue[0] = -1);
+      this.tabValue[1] = -1;
+      item.isSelect = !item.isSelect;
+      item.isOpen = !item.isOpen;
+      if (item.path) {
+        this.$router.push(item);
+      }
+    },
     selectChildren(
       item: {
         text: string;
         isSelect: boolean;
-        path?: undefined;
-      }[],
+        isOpen: boolean;
+        path: string;
+      },
       selectIndex: number
     ) {
-      item.forEach((_item) => {
-        _item.isSelect = false;
-      });
-      item[selectIndex].isSelect = true;
+      this.tabValue[1] == -1
+        ? (this.tabValue[1] = selectIndex)
+        : (this.tabValue[1] = -1);
+      item.isSelect = !item.isSelect;
+      item.isOpen = !item.isOpen;
+      if (item.path) {
+        this.$router.push(item);
+      }
     },
   },
 });
 </script>
 
 <style lang="scss" scoped>
+.overflow-y-visible {
+  overflow-y: visible !important;
+}
 .bg-component-pink {
   background: #fffdf2;
 }
@@ -205,9 +286,10 @@ export default defineComponent({
     width: 256px;
     line-height: 60px;
     height: 60px;
-
+    overflow-y: hidden;
     display: inline-block;
     text-align: left;
+
     // display: flex;
     // justify-content: flex-start;
     // align-content: center;

src/views/studySkill/index.vue

@@ -72,33 +72,41 @@
             </div>
           </div>
           <div v-if="list[listIndex].questionType === 1" class="flex mt15">
-            <div
+            <button
               @click="setUserAnswerAndRes(item)"
               v-for="(item, index) in list[listIndex].optsArr"
               :key="index"
               class="w57 lh46 bottom-button mr15"
             >
               {{ item }}
-            </div>
+            </button>
           </div>
           <div v-if="list[listIndex].questionType !== 1" class="flex mt15">
-            <div
+            <button
               @click="setUserAnswerAndRes(item)"
               v-for="(item, index) in list[listIndex].optsArr"
               :key="index"
               class="w57 lh46 bottom-button mr15"
             >
               {{ switchIndexBySelect(index) }}
-            </div>
+            </button>
           </div>
         </div>
       </div>
       <div class="w-full pt30">
         <div class="w1200 flex justify-between mr-auto ml-auto">
-          <div @click="preProblem()" class="w120 lh46 bottom-button lh46">
+          <div
+            @click="preProblem()"
+            @keydown.up="preProblem()"
+            class="w120 lh46 bottom-button lh46"
+          >
             上一题
           </div>
-          <div @click="nextProblem()" class="w120 lh46 bottom-button lh46">
+          <div
+            @click="nextProblem()"
+            @keydown.down="nextProblem()"
+            class="w120 lh46 bottom-button lh46"
+          >
             下一题
           </div>
           <div
@@ -157,7 +165,7 @@
           <div class=""><span class="text-black font16">正确率100%</span></div>
           <div class="">
             <span class="text-black font16"
-              >进度{{ ((trueNum + falseNum) * 100) / list.length }}%</span
+              >进度{{ fixedNumber(((trueNum + falseNum) * 100) / list.length,2) }}%</span
             >
           </div>
           <div class="flex items-center content-center">
@@ -212,6 +220,9 @@ export default defineComponent({
     const changeSysConfig = (event: any) => {
       store.commit("SET_SYSCONFIG", sysConfig.value);
     };
+    const fixedNumber = (decimal: number, digit: number) => {
+      return decimal.toFixed(digit);
+    };
     return {
       sysConfig,
       alertVisible: ref(false),
@@ -226,11 +237,11 @@ export default defineComponent({
         {
           autoAnswer: false,
           countDown: false,
-          autoNext: false,
-          autoRead: false,
+   
         }
       ),
       changeSysConfig,
+      fixedNumber,
     };
   },
   components: {
@@ -300,6 +311,11 @@ input[type="checkbox"]:checked:after {
   border: 1px solid #f9de5b;
   cursor: pointer;
 }
+.bottom-button:focus {
+  background: #f9de5b;
+  border: 1px solid #f9de5b;
+  outline: none;
+}
 .bottom-button:hover {
   background: #fff7cc;
 }