Merge branch 'master' of http://git.ycjcjy.com/honghe/roundabout

src/components/BgMusic.vue

@@ -13,7 +13,7 @@ export default {
     return {
       show: false,
       playing: false,
-      url: `${origin}${pathname}bg.mp3`
+      url: `${origin}${pathname}music/bg.mp3`
     }
   },
   mounted() {

src/components/MusicOnce.vue

@@ -0,0 +1,31 @@
+<template>
+  <audio class="mp3-once" :src="src" ref="audioRef"></audio>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  src: String,
+})
+
+const audioRef = ref()
+
+defineExpose({
+  play: () => {
+    audioRef.value.currentTime = 0
+    audioRef.value.play()
+  },
+  pause: () => audioRef.value.pause(),
+})
+
+</script>
+
+<style lang="less" scoped>
+.mp3-once {
+  display: block;
+  max-height: 1px;
+  max-width: 1px;
+  position: absolute;
+}
+</style>

src/main.js

@@ -4,6 +4,7 @@ import router from './router'
 import BackPage from './components/BackPage.vue'
 import GrassGIF from './components/GrassGIF.vue'
 import { Login, redirect } from './utils/initial'
+import MusicOnce from './components/MusicOnce.vue'
 
 // 创建 App实例
 const app = createApp(App)
@@ -24,6 +25,7 @@ app.use(router)
 app.mount('#app')
 app.component('BackPage', BackPage)
 app.component('GrassGIF', GrassGIF)
+app.component('MusicOnce', MusicOnce)
 
 // createApp(App).mount('#app')
 

src/pages/game/index.vue

@@ -1,6 +1,9 @@
 <template>
-  <div ref="el"></div>
-  <FireWorkListVue :center="center" :raduis="raduis" ref="firesRef" />
+  <div ref="el" />
+  <FireWorkListVue ref="firesRef" :center="center" :raduis="raduis" />
+  <MusicOnce ref="bingoRef" :src="bingoMusic" />
+  <MusicOnce ref="failRef" :src="failMusic" />
+  <MusicOnce ref="successRef" :src="successMusic" />
 </template>
 
 <script setup>
@@ -23,6 +26,22 @@ const destroyRef = ref()
 const firesRef = ref()
 const router = useRouter()
 const raduis = ref(150)
+const path = window.location.origin + window.location.pathname
+const bingoMusic = `${path}/music/bingo.mp3`
+const failMusic = `${path}/music/fail.mp3`
+const successMusic = `${path}/music/bingo.mp3`
+
+// // 修复一个 two-js bug ，当页面返回的时候, 不能正常渲染
+// // 所以这边判断如果第二次进入页面就强制刷新
+// const loadSign = localStorage.getItem('loadSign');
+// if (loadSign) {
+//   localStorage.removeItem('loadSign');
+//   window.location.href = window.location.href;
+// }
+
+const bingoRef = ref()
+const failRef = ref()
+const successRef = ref()
 
 const center = {
   x: document.body.offsetWidth / 2,
@@ -34,7 +53,7 @@ const gameInit = () => {
     el: el.value,
     center,
     onError: () => {
-      alert('oo ~')
+      failRef.value.play()
       const t = setTimeout(() => {
         localStorage.setItem('loadSign', '1')
         router.push('/OverPage?type=lose')
@@ -42,22 +61,29 @@ const gameInit = () => {
       }, 1000)
     },
     onSuccess: () => {
-      gameOver().then((e) => {
-        firesRef.value.toggle()
-        // alert('你真牛逼')
-        const t = setTimeout(() => {
-          localStorage.setItem('loadSign', '1')
-          router.push('/OverPage?type=win')
-          clearTimeout(t)
-        }, 2000)
-      })
+      successRef.value.play()
+      firesRef.value.toggle()
+      // alert('你真牛逼')
+      const t = setTimeout(() => {
+        localStorage.setItem('loadSign', '1')
+        router.push('/OverPage?type=win')
+        clearTimeout(t)
+      }, 2000)
     },
-    onBingo: () => {}
+    onBingo: () => {
+      bingoRef.value.play()
+    }
   })
 
   raduis.value = destroyRef.value.raduis
 }
 
+onMounted(() => {
+  gameInit()
+})
+
+raduis.value = destroyRef.value.raduis
+
 onMounted(() => {
   gameStart()
   gameInit()

src/utils/initial.js

@@ -35,7 +35,7 @@ function initSDK (url) {
 export function share (opt) {
   const { origin, pathname, search } = window.location
   // const defaultLink = origin + pathname
-  const defaultImg = `${origin}${pathname}images/share.png`
+  const defaultImg = `${origin}${pathname}img/share.jpg`
 
   const link = origin + pathname + search // window.location.href
   const imgUrl = opt.imgUrl || defaultImg