Browse Source

fix: 做题逻辑

lvkun996 2 years ago
parent
commit
28d15f925e

+ 1 - 1
src/api/card.ts

@@ -28,7 +28,7 @@ export const submitlearnPortAns = (params: any, url: string) => {
     url: '',
     baseURL: url,
     method: 'POST',
-    params
+    params,
   })
 }
 

+ 21 - 19
src/components/luojigou-board/luojigou-board.vue

@@ -28,7 +28,6 @@
             <image :src="props.board.ansUrl" alt="" />
           </view>
       </view>
-
     </view>
 
     <view
@@ -71,7 +70,7 @@
       <movable-view
         v-for="item in buttons"
         :key="item.id"
-        :disabled="state.disabled"
+        :disabled="item.disabled"
         :x="item.x"
         :y="item.y"
         damping="100"
@@ -121,6 +120,7 @@ interface Buttons {
   index: number,
   zIndex: number,
   ans: API.Color | null
+  disabled: boolean
 }
 
 interface IProps {
@@ -210,12 +210,12 @@ const getX = (index: number) => index * VSpace + Math.floor(windowWidth / 375 *
 
 // 注意一下四钮 用哪几个颜色的按钮
 let buttons = reactive<Buttons[]>([
-  {id: 0, ans: null, x: getX(0), y: Y * rate, initX: getX(0), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.red, color: 'red' },
-  {id: 1, ans: null, x: getX(1), y: Y * rate, initX: getX(1), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.blue, color: 'blue' },
-  {id: 2, ans: null, x: getX(2), y: Y * rate, initX: getX(2), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.green, color: 'green' },
-  {id: 3, ans: null, x: getX(3), y: Y * rate, initX: getX(3), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.orange, color: 'orange' },
-  {id: 4, ans: null, x: getX(4), y: Y * rate, initX: getX(4), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.yellow, color: "yellow" },
-  {id: 5, ans: null, x: getX(5), y: Y * rate, initX: getX(5), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.purple, color: 'purple' },
+  {id: 0, ans: null, x: getX(0), y: Y * rate,disabled: false, initX: getX(0), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.red, color: 'red' },
+  {id: 1, ans: null, x: getX(1), y: Y * rate,disabled: false, initX: getX(1), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.blue, color: 'blue' },
+  {id: 2, ans: null, x: getX(2), y: Y * rate,disabled: false, initX: getX(2), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.green, color: 'green' },
+  {id: 3, ans: null, x: getX(3), y: Y * rate,disabled: false, initX: getX(3), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.orange, color: 'orange' },
+  {id: 4, ans: null, x: getX(4), y: Y * rate,disabled: false, initX: getX(4), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.yellow, color: "yellow" },
+  {id: 5, ans: null, x: getX(5), y: Y * rate,disabled: false, initX: getX(5), initY: Y * rate,  zIndex: 0, index: -1, url: staticImg.purple, color: 'purple' },
 ])
 
 buttons.splice(props.cardType == 1 ?  buttons.length : buttons.length - 2, buttons.length)
@@ -246,7 +246,7 @@ const touchStart = (item: Buttons) => {
 // 按钮脱手
 const touchend = (ev: TouchEvent, item: Buttons) => {
 
-  if (state.disabled) return
+  if (item.disabled) return
 
   const { x: itemX, y: itemY } = TPos(ev.changedTouches[0].pageX, ev.changedTouches[0].pageY)
 
@@ -262,7 +262,7 @@ const touchend = (ev: TouchEvent, item: Buttons) => {
     
     //  直接点击答案区的按钮,答案区按钮回到初始位置
     if (item.x == targetX && item.y == targetY) {
-      disPatchButtonGoInitPos(item.id)
+      // disPatchButtonGoInitPos(item.id)
     } else {
 
       // 两个按钮都在答案区, 直接进行按钮之间的交换
@@ -271,14 +271,14 @@ const touchend = (ev: TouchEvent, item: Buttons) => {
       if (isHasIndex >= 0) { // 答案区的目标区域存在按钮
      
         if (item.index == -1) { // 答案区的目标区域存在按钮 操作按钮是从待操作区域移过来的 目标按钮回到原位
-          disPatchButtonGoInitPos(isHasIndex)
+          // disPatchButtonGoInitPos(isHasIndex)
         } else {  // 答案区的目标区域存在按钮 操作按钮是和目标按钮互换位置
-          useSchedulerOnce(() => {
-            const oldPos = getButtonPosByIndex(item.index)
-            buttons[isHasIndex].x = oldPos.x
-            buttons[isHasIndex].y = oldPos.y
-            buttons[isHasIndex].index = item.index
-          })
+          // useSchedulerOnce(() => {
+          //   const oldPos = getButtonPosByIndex(item.index)
+          //   buttons[isHasIndex].x = oldPos.x
+          //   buttons[isHasIndex].y = oldPos.y
+          //   buttons[isHasIndex].index = item.index
+          // })
         }
       }
 
@@ -303,8 +303,12 @@ const checkAns = (index: number, itemData: Buttons) => {
   // 移动到了正确位置
   if (targetData[index].ans === itemData.color) {
     itemData.ans = targetData[index].color
+    
     calcQuantityStore.correctQuantity++
+
     AudioController.playCorrect()
+    itemData.disabled = true
+
   } else { // 移动到了錯誤位置
 
     AudioController.playWrong()
@@ -316,8 +320,6 @@ const checkAns = (index: number, itemData: Buttons) => {
 
     rockNode?.classList.add('rock-button-ani')
 
-    state.disabled = true
-
     useSchedulerOnce(() => {
       disPatchButtonGoInitPos(itemData.id)
       

+ 21 - 6
src/components/rive-ani/rive-ani.vue

@@ -94,8 +94,15 @@ const initRive = () => {
 
   const canvas = document.createElement('canvas')
 
-  canvas.width = 375
-  canvas.height = 375
+  const ctx = canvas.getContext('2d');
+
+  // const scale = window.devicePixelRatio;
+  const scale = 1;
+
+  canvas.width = 375 * scale;
+  canvas.height = 375 * scale;
+
+  // ctx!.scale(scale, scale);
 
   canvas.id = 'rive-canvas'
 
@@ -114,7 +121,14 @@ const initRive = () => {
       rive.resizeToCanvas()
       rive.play(AniEnum[state.cointCount! - 1])
       
-      // AudioController.playCoinLight()
+      for (let i = 0; i < state.cointCount!; i++) {
+       
+        useSchedulerOnce( () => {
+          AudioController.playCoinLight()
+        }, 1000 + i * 50)
+
+      }
+    
       
     },
     onStop: () => {
@@ -173,17 +187,18 @@ const goBezier = () => {
 
 }
 
-const start = (starCount: number, cardType: 0 | 1) => {
+const start = async (starCount: number, cardType: 0 | 1) => {
 
   state.comVisable = true
   state.cointCount = starCount
   state.cardType = cardType
 
   if (cardType === 0) {
-    starCount <= 2 ? AudioController.playFail() : AudioController.playPass() 
+    starCount <= 2 ?  AudioController.playFail() :  AudioController.playPass() 
   } else {
-    starCount <= 3 ? AudioController.playFail() : AudioController.playPass() 
+    starCount <= 3 ?  AudioController.playFail() :  AudioController.playPass() 
   }
+
   useSchedulerOnce(initRive)
   
   nextTick(() => useQueryElInfo('#coin-logo', (res) => coinLoginRef.value = res, getCurrentInstance()!, false))

+ 15 - 3
src/controller/AudioController.ts

@@ -6,9 +6,9 @@ export class AudioController {
 
   static wrongUrl = `https://res-game.luojigou.vip/wrong.mp3`
 
-  static correntUrl = 'https://res-game.luojigou.vip/correct.mp3'
+  static correntUrl = 'https://res-game.luojigou.vip/coin-light.mp3' 
 
-  static coinLight = 'https://res-game.luojigou.vip/coin-light.mp3'
+  static coinLight = 'https://res-game.luojigou.vip/correct.mp3'
 
   static pass = 'https://res-game.luojigou.vip/pass.MP3'
 
@@ -20,6 +20,7 @@ export class AudioController {
 
   static playWrong () {
     audioMange.play(AudioController.wrongUrl)
+
   }
 
   static playCoinLight () {
@@ -28,10 +29,21 @@ export class AudioController {
 
   static playPass () {
     audioMange.play(AudioController.pass)
+    return new Promise( (resolve) => {
+      audioMange.onplayend(() => {
+        resolve(true)
+      })
+    })
+   
   }
 
   static playFail () {
-    audioMange.play(AudioController.fail)
+    audioMange.play(AudioController.fail) 
+    return new Promise( (resolve) => {
+      audioMange.onplayend(() => {
+        resolve(true)
+      })
+    })
   }
 
 }

+ 9 - 7
src/pages/GameView/index.vue

@@ -86,10 +86,11 @@ onLoad(query => {
     state.opraMode = state.queryParams.data.opraMode
     options = state.queryParams.data
   } else {
-    // state.queryParams = base64.decode<API.P>(query!.p)
     console.log(query);
-    
-    options = query!
+    state.queryParams = base64.decode<API.P>(query!.p)
+    state.opraMode = state.queryParams.data.opraMode
+    options = state.queryParams.data
+    // options = query!
   }
   console.log(state.queryParams);
   
@@ -133,13 +134,12 @@ const stx = useScheduler(() => {
   navbarState.countdownTotal--
   if (navbarState.countdownTotal <= 0) {
     stx.stop()
-    onSubmitCard()
   }
 }, 1000)
 
 // 控制游戏开始
 const gameStart = () => {
-  navbarState.countdownTotal = 10
+  navbarState.countdownTotal = 60
   stx.start()
   playAudio()
 }
@@ -158,11 +158,12 @@ const onSubmitCard = async () => {
   opraRecordStore.push({
     correctQuantity: calcQuantityStore.correctQuantity,
     totalQuantity: calcQuantityStore.totalQuantity,
+    wrongCount: calcQuantityStore.wrongCount,
     capability: state.card?.cardAble
   })
 
   // 保存做题时间
-  gameCountdownStore.sum(navbarState.countdownTotal - navbarState.countdownTotal)
+  gameCountdownStore.sum(60 - navbarState.countdownTotal)
 
   // 触发游戏结束
   if (navbarState.progress == state.cardIds.length) {
@@ -203,7 +204,7 @@ const gameCompleted = async () => {
       "gameDuration": gameCountdownStore.get(),
       "totalQuantity": opraRecordStore.totalQuantity(),
       "userCardAnswerList": opraRecordStore.get(),
-      "winWisdomCoin": gameCountdownStore.get()
+      "winWisdomCoin":  wisdomCoinStore.itemCoin
     }
   }
 
@@ -265,6 +266,7 @@ onMounted(async () => {
   if (state.mode === 'preview') {
     GetCardDetailById()
   } else {
+
     GetCollectionDetailById()
   }
 })

+ 5 - 2
src/service/index.ts

@@ -10,8 +10,11 @@ interface Params {
   baseURL?: string
 }
 
-const BASEURL = import.meta.env.MODE == 'development' ? 'http://local.luojigou.vip:8888' : 'https://open.test.luojigou.vip'
-
+// const BASEURL = import.meta.env.MODE === 'development' ? 'http://local.luojigou.vip:8888' : 'https://open.api.luojigou.vip'
+const BASEURL = import.meta.env.MODE === 'development' ? 'http://local.luojigou.vip:8888' : 'https://open.test.luojigou.vip'
+//  'https://open.test.luojigou.vip'
+// window.location.href.split('#')[0] + 'zd-api'
+// https://open.test.luojigou.vip
 //  "https://open.api.luojigou.vip"
 
 export const request = async <T>(

+ 1 - 3
src/store/gameTool.ts

@@ -42,7 +42,6 @@ export const useCalcStartStore = defineStore(ConstantStore.STAR, () => {
 
   const _get = () => {
     const r = state.total - state.wrongCount
-    console.log("state.wrongCountP:", state.wrongCount);
     
     return r <= 0 ? 1 : r
   }
@@ -64,14 +63,13 @@ export const useCalcStartStore = defineStore(ConstantStore.STAR, () => {
 export const useCalcQuantityStore = defineStore(ConstantStore.QUANTITY, () => {
 
   const state = reactive({
-    correctQuantity: 0,
+    correctQuantity: 0, 
     totalQuantity: 0,
     wrongCount: 0
   })
 
   const _getStar = () => {
     const r = state.totalQuantity - state.wrongCount
-    console.log("state.wrongCountP:", state.wrongCount);
     return r <= 0 ? 1 : r
   }
 

+ 1 - 4
src/store/opraRecords.ts

@@ -18,10 +18,7 @@ export const useOpraRecordStore = defineStore(ConstantStore.OPRARECORDS, () => {
 
   const _correctQuantityTotal = () => {
 
-    console.log("state.value?.length:", state.value?.length);
-    
-
-    return state.value?.length && state.value?.map( item => item.correctQuantity).reduce( (pre, next) => pre + next )
+    return state.value?.length && state.value?.map( item => item.totalQuantity - item.wrongCount).reduce( (pre, next) => pre + next )
   }
 
   const _totalQuantity = () => state.value?.length && state.value?.map( item => item.totalQuantity).reduce( (pre, next) => pre + next )

+ 1 - 0
src/typing.d.ts

@@ -91,6 +91,7 @@ declare namespace API {
     capability: string,
     correctQuantity: number,
     totalQuantity: number
+    wrongCount: number
   }
 
   interface P {