开始开发练习模块

package-lock.json

@@ -2271,6 +2271,27 @@
         "whatwg-fetch": "^3.6.2"
       },
       "dependencies": {
+        "@vue/vue-loader-v15": {
+          "version": "npm:vue-loader@15.10.1",
+          "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.10.1.tgz",
+          "integrity": "sha512-SaPHK1A01VrNthlix6h1hq4uJu7S/z0kdLUb6klubo738NeQoLbS6V9/d8Pv19tU0XdQKju3D1HSKuI8wJ5wMA==",
+          "dev": true,
+          "requires": {
+            "@vue/component-compiler-utils": "^3.1.0",
+            "hash-sum": "^1.0.2",
+            "loader-utils": "^1.1.0",
+            "vue-hot-reload-api": "^2.3.0",
+            "vue-style-loader": "^4.1.0"
+          },
+          "dependencies": {
+            "hash-sum": {
+              "version": "1.0.2",
+              "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
+              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+              "dev": true
+            }
+          }
+        },
         "autoprefixer": {
           "version": "10.4.14",
           "resolved": "https://registry.npmmirror.com/autoprefixer/-/autoprefixer-10.4.14.tgz",
@@ -2285,6 +2306,26 @@
             "postcss-value-parser": "^4.2.0"
           }
         },
+        "json5": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmmirror.com/json5/-/json5-1.0.2.tgz",
+          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
+          "dev": true,
+          "requires": {
+            "minimist": "^1.2.0"
+          }
+        },
+        "loader-utils": {
+          "version": "1.4.2",
+          "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-1.4.2.tgz",
+          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^1.0.1"
+          }
+        },
         "postcss": {
           "version": "8.4.23",
           "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.23.tgz",
@@ -2575,47 +2616,6 @@
       "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.2.47.tgz",
       "integrity": "sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ=="
     },
-    "@vue/vue-loader-v15": {
-      "version": "npm:vue-loader@15.10.1",
-      "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.10.1.tgz",
-      "integrity": "sha512-SaPHK1A01VrNthlix6h1hq4uJu7S/z0kdLUb6klubo738NeQoLbS6V9/d8Pv19tU0XdQKju3D1HSKuI8wJ5wMA==",
-      "dev": true,
-      "requires": {
-        "@vue/component-compiler-utils": "^3.1.0",
-        "hash-sum": "^1.0.2",
-        "loader-utils": "^1.1.0",
-        "vue-hot-reload-api": "^2.3.0",
-        "vue-style-loader": "^4.1.0"
-      },
-      "dependencies": {
-        "hash-sum": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
-          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
-          "dev": true
-        },
-        "json5": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmmirror.com/json5/-/json5-1.0.2.tgz",
-          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-          "dev": true,
-          "requires": {
-            "minimist": "^1.2.0"
-          }
-        },
-        "loader-utils": {
-          "version": "1.4.2",
-          "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-1.4.2.tgz",
-          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
-          "dev": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^1.0.1"
-          }
-        }
-      }
-    },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
       "resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
@@ -6766,6 +6766,11 @@
       "integrity": "sha512-A/78XjoX2EmNvppVWEhM2oGk3x4lLxnkEA4jTbaK97QKSDjkIoOsKQlfylt/d3kKKi596Qy3NP5XrXJ6fZIC9Q==",
       "dev": true
     },
+    "moment": {
+      "version": "2.29.4",
+      "resolved": "https://registry.npmmirror.com/moment/-/moment-2.29.4.tgz",
+      "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
+    },
     "mrmime": {
       "version": "1.0.1",
       "resolved": "https://registry.npmmirror.com/mrmime/-/mrmime-1.0.1.tgz",

package.json

@@ -13,6 +13,7 @@
     "ant-design-vue": "^4.0.0-beta.2",
     "axios": "^1.4.0",
     "core-js": "^3.8.3",
+    "moment": "^2.29.4",
     "vue": "^3.2.13",
     "vue-router": "^4.0.3",
     "vuex": "^4.0.0"

src/api/index.ts

@@ -1,9 +1,11 @@
-import request  from "./request";
+
 import login from './login/login'
 import open from './open/open'
+import question from './question/question'
 const api  = {
     login,
-    open
+    open,
+    question
     
 
 

src/api/open/open.ts

@@ -10,5 +10,16 @@ export default {
             method: 'get'
 
         })
+    },
+    questionInfoSelectTestK14QuestionInfoList(params:{
+        subject:number,
+        gs:string
+    }):Promise<openApi.selectFreeQuestionInfoRes>{
+        return request({
+            params,
+            url: "/open-api/question/info/selectTestK14QuestionInfoList",
+            method: 'get'
+        })
     }
-}
+}
+    

src/api/open/type.d.ts

@@ -53,6 +53,7 @@ export declare namespace openApi {
             updateTime: string
 
         }[]
+        total:number
 
     }
 }

src/api/question/question.ts

@@ -1,20 +1,35 @@
 import request from "../request"
+import { questionApi } from "./type"
 
 export default {
-    questionInfoSelectSxQuestionInfo(params: {
-        excellIssueName: string
-        excellSort:number
-        liceBus?:'1'|'2'
-        liceCar?:'1'|'2'
-        liceMoto?:'1'|'2'
-        liceTruck:'1'|'2'
-        subject:number
-    }):Promise<any> {
+    questionInfoSelectFlQuestionInfo(params: {
+        excellIssueName?: string
+        excellSort?: number
+        liceBus?: '1' | '2'
+        liceCar?: '1' | '2'
+        liceMoto?: '1' | '2'
+        liceTruck?: '1' | '2'
+        subject: number
+    }): Promise<questionApi.selectSxQuestionInfo> {
         return request({
             params,
-            url: "/student/question/info/selectSxQuestionInfo",
+            url: "/pc/question/info/selectFlQuestionInfo",
             method: 'get'
 
         })
+    },
+    questionInfoQlist(params:{
+        classIssueName?:string
+        classIssue?:string
+        issueValue?:string
+        subject:number
+        pageNum?:number
+        pageSize?:number
+    }):Promise<questionApi.selectTestK14QuestionInfoList>{
+        return request({
+            params,
+            url: "/pc/question/info/qlist",
+            method: 'get'
+        })
     }
 }

src/api/question/type.d.ts

@@ -5,12 +5,62 @@ interface Res {
 }
 export declare namespace questionApi {
     interface selectSxQuestionInfo extends Res {
-        data:{
-            createTime?:string
-            updateTime?:string
-            sequeIssue?:string
-            sequeIssueName:string
+        data: {
+            createTime?: string
+            updateTime?: string
+            classIssue?: string
+            classIssueName: string
         }[]
-      
-}
+
+    }
+    interface selectTestK14QuestionInfoList extends Res {
+        rows: {
+            isError?: boolean
+            isComplete?: boolean
+            userAnswer: string | string[]
+            optsArr: string[]
+            answer: string
+            answerkeyword: string
+            answermp3: string
+            chapterId: number
+            classIssue: string
+            classIssueName: string
+            classSort: number
+            createTime: string
+            diffDegree: number
+            excellIssue: string
+            excellIssueName: string
+            excellSort: number
+            explainGif: string
+            explainJq: string
+            explainJs: string
+            explainMp3: string
+            explainjsmp3: string
+            id: number
+            idYdt: number
+            image: string
+            imageYdt: string
+            isNew: number
+            issue: string
+            issuemp3: string
+            liceBus: string
+            liceCar: string
+            liceMoto: null
+            liceTruck: string
+            number: number
+            opts: string
+            placeIssue: null
+            placeIssueName: null
+            placeSort: null
+            questionType: number
+            sequeIssue: string
+            sequeIssueName: string
+            sequeSort: number
+            skillkeyword: string
+            subject: number
+            titlekeyword: string
+            updateTime: string
+
+        }[]
+    }
 }

src/hooks/exam/driverExam.ts

@@ -1,9 +1,13 @@
-import { computed, onMounted, reactive, ref, watch } from "vue";
+import { computed, onMounted, reactive, ref, watch,onBeforeUnmount } from "vue";
 import { openApi } from "@/api/open/type";
+import moment from 'moment';
+
 export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoRes>, config = {
-  watch: true
+  watch: true,
+  countDown: true
 }) => {
-
+  let timerId = 0
+  let examMillSeconds = 45 * 60 * 1000
   const falseNum = ref(0)
   const trueNum = ref(0)
   const list = ref<openApi.selectFreeQuestionInfoRes["rows"]>([{
@@ -521,6 +525,7 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
     optsArr: ["√", "×"],
   }])
   const listIndex = ref(0)
+  const countDown = ref('00:45:00')
   const getProblemTypeName = (type: number) => {
     let name = "";
     switch (type) {
@@ -654,7 +659,7 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
       //提示
       if (
         list.value[oldVal].isError &&
-        list.value[oldVal].questionType === 3 &&
+        list.value[oldVal].questionType !== 1 &&
         list.value[oldVal].isComplete
       ) {
 
@@ -663,7 +668,7 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
         );
       } else if (
         list.value[oldVal].isError &&
-        list.value[oldVal].questionType !== 3 &&
+        list.value[oldVal].questionType === 1 &&
         list.value[oldVal].isComplete
       ) {
         alert("正确答案：" + list.value[oldVal].answer);
@@ -671,13 +676,13 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
       //提示
     });
   }
-  const getCorrectRate = ()=>{
-    if(trueNum.value+falseNum.value){
-      Math.round((trueNum.value)/(trueNum.value+falseNum.value) * 100) / 100
+  const getCorrectRate = () => {
+    if (trueNum.value + falseNum.value) {
+      Math.round((trueNum.value) / (trueNum.value + falseNum.value) * 100) / 100
       return
 
     }
-    else{
+    else {
       return 0
     }
 
@@ -695,13 +700,25 @@ export const useDriverExam = (requestFn: Promise<openApi.selectFreeQuestionInfoR
       });
       list.value = res.rows;
     })
+    timerId = window.setInterval(() => {
+      examMillSeconds = examMillSeconds - 1000
+      countDown.value = moment(examMillSeconds).format('00:mm:ss')
+    }, 1000)
+
+
+
+  })
+  onBeforeUnmount(()=>{
+    window.clearInterval(timerId)
 
   })
+  
   return {
     falseNum,
     trueNum,
     list,
     listIndex,
+    countDown,
     setUserAnswer,
     getProblemTypeName,
     getCorrectRate,

src/views/driverExam/index.vue

@@ -124,7 +124,7 @@
           <div class="font-bold flex">
             <div class="inline-block">
               <div>剩余时间</div>
-              <div class="pl20">39:00</div>
+              <div class="pl20">{{countDown}}</div>
             </div>
 
             <div
@@ -213,8 +213,9 @@ export default defineComponent({
     return {
       alertVisible: ref(false),
       dialogVisible: ref(false),
-      ...useDriverExam(api.open.questionInfoSelectFreeQuestionInfo({
-        subject:4
+      ...useDriverExam(api.open.questionInfoSelectTestK14QuestionInfoList({
+        subject:1,
+        gs:'xc'
       }))
     };
   },

src/views/home/practiseSelect/index.vue

@@ -2,64 +2,100 @@
 
 <template>
   <div class="content">
-    <div class="h885 bg-white pl50 pt30">
+    <div class="h885 overflow-scroll bg-white pl50 pt30">
       <div class="flex items-center">
         <div class="vertical-line mr10"></div>
         <span class="font20 font-bold mr15">技巧练习</span>
-        <div class="lh34 select-border round4 pr15 pl15">试听</div>
+        <div class="lh34 select-border1 round4 pr15 pl15">试听</div>
       </div>
       <div class="">
-        <div class="flex justify-between">
+        <div class="flex justify-between flex-wrap w-11/12">
           <div
             v-for="(item, index) in list"
             :key="index"
             class="flex radius4 pt15"
           >
-            <div class="lh34 w140 text-left font18">{{ index + 1 }}. 技巧</div>
+            <div class="lh34 w185 text-left font18">
+              {{ index + 1 }}. {{ item.classIssueName }}
+            </div>
             <div class="flex">
-              <div class="w64 lh34 mr15 round4 overflow-hidden select-border">
+              <div
+                class="w64 lh34 mr15 round4 overflow-hidden select-border3 bg-gray-100 text-gray-500 cursor-not-allowed"
+              >
                 视频
               </div>
-              <div class="w64 lh34 mr15 round4 overflow-hidden select-border">
-                练习
-              </div>
-              <div class="w64 lh34 mr15 round4 overflow-hidden select-border">
+              <router-link :to="'/studySkill?subject=1&classIssue='+(item.classIssue||'')">
+                <div
+                  class="w64 lh34 mr15 round4 overflow-hidden select-border2"
+                >
+                  练习
+                </div>
+              </router-link>
+              <div class="w64 lh34 mr15 round4 overflow-hidden select-border2">
                 回顾
               </div>
             </div>
           </div>
         </div>
       </div>
-      <div class="flex items-center pt30">
+      <div class="flex items-center pt30 pb30">
         <div class="vertical-line mr10"></div>
         <span class="font20 font-bold mr15">全部错误题回顾</span>
-        <div class="lh34 round4 pr15 pl15 select-border mr15">错误回顾</div>
-        <div class="lh34 round4 pr15 pl15 select-border">清空全部错题</div>
+        <div class="lh34 round4 pr15 pl15 select-border1 mr15">错误回顾</div>
+        <div class="lh34 round4 pr15 pl15 select-border1">清空全部错题</div>
       </div>
     </div>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from "vue";
+import { defineComponent, ref } from "vue";
+import api from "@/api";
 export default defineComponent({
   setup() {
+    let list = ref<
+      {
+        createTime?: string;
+        updateTime?: string;
+        classIssue?: string;
+        classIssueName: string;
+      }[]
+    >([]);
+    api.question
+      .questionInfoSelectFlQuestionInfo({
+        subject: 1
+      })
+      .then((res) => {
+        list.value = res.data;
+      });
+
     return {
-      list: [{}, {}, {}],
+      list: list,
     };
   },
 });
 </script>
 
 <style lang="scss" scoped>
-.select-border {
+.select-border1 {
   border: 1px solid #f9de5b;
 }
-.select-border:hover {
+.select-border2 {
+  border: 1px solid #f9de5b;
+}
+.select-border3 {
+  border: 1px solid #d8d8d8;
+}
+.select-border1:hover {
   border: 1px solid #f9de5b;
   background-color: #f9de5b;
   cursor: pointer;
 }
+.select-border2:hover {
+  border: 1px solid #f9de5b;
+  background-color: rgba(255, 247, 204, 1);
+  cursor: pointer;
+}
 .radius4 {
   border-radius: 4px;
 }

src/views/studySkill/index.vue

@@ -58,7 +58,7 @@
             <div class="pr2 pl2">题</div>
           </div>
 
-          <div>共 <span class="font-semibold">48</span> 题</div>
+          <div>共 <span class="font-semibold">{{list.length}}</span> 题</div>
           <div class="align-baseline">
             <input class="" type="checkbox" />
             <span>答对自动跳转到下一题</span>
@@ -86,22 +86,28 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "vue";
+import { defineComponent, ref, } from "vue";
 import api from "@/api";
 import { openApi } from "@/api/open/type";
+import { useRoute } from "vue-router";
 export default defineComponent({
   setup() {
     let list = ref<openApi.selectFreeQuestionInfoRes["rows"]>([]);
-    api.open
-      .questionInfoSelectFreeQuestionInfo({
-        subject: 4,
+    let route = useRoute()
+    api.question
+      .questionInfoQlist({
+        subject: Number(route.query.subject),
+        classIssue:'1040',
       })
       .then((res) => {
+        res.rows.shift()
         list.value=res.rows
         console.log(res);
       });
 
-    return {};
+    return {
+      list
+    };
   },
 });
 </script>