完善厨房音效特性

view/peko/activity/act-kitchen/css/index.css

@@ -44,8 +44,8 @@ html {
   width: 0.8rem;
   height: 0.8rem;
   position: absolute;
-  right: 0.1rem;
+  right: 0.55rem;
-  top: 2.0rem;
+  top: 1.8rem;
 }
 
 .header .record_icon {

view/peko/activity/act-kitchen/css/index.scss

@@ -47,8 +47,9 @@ html {
         width: px2rem(60);
         height: px2rem(60);
         position: absolute;
-        right: 0.1rem;
+        right: 0.55rem;
-        top: 2.0rem;
+        // top: 2.0rem;
+        top: 1.8rem;
     }
 
     .record_icon {

view/peko/activity/act-kitchen/index.html

@@ -315,15 +315,15 @@
 
     <!-- 投入音效 -->
     <audio style="display: none;" id="draw">
-        <source src="https://img.tukuppt.com/newpreview_music/09/00/67/5c8941a76fd1b53174.mp3" type="audio/mp3">
+        <source src="./images/draw.mp3" type="audio/mp3">
     </audio>
     <!-- 开奖中音效 -->
     <audio style="display: none;" id="lotteryMusic">
-        <source src="https://img.tukuppt.com/newpreview_music/09/00/67/5c8941a43051468781.mp3" type="audio/mp3">
+        <source src="./images/lotteryMusic.mp3" type="audio/mp3">
     </audio>
     <!--  背景音效   -->
     <audio style="display: none;" id="backgroundMusic" autoplay loop>
-        <source src="https://img.tukuppt.com/newpreview_music/08/99/14/5c88e514c9bd380408.mp3" type="audio/mp3">
+        <source src="./images/backgroundMusic.mp3" type="audio/mp3">
     </audio>
 </body>
 

view/peko/activity/act-kitchen/js/index.js

@@ -41,12 +41,27 @@ let page = 1
 let pageSizeLack = true;
 var audioIf = true;
 var backgroundMusic = document.getElementById('backgroundMusic');
+backgroundMusic.volume = 0.5;
 var lotteryMusic = document.getElementById('lotteryMusic');
+var drawBut = document.getElementById("draw");
 $(function () {
     getInfoFromClient()
     setTimeout(function () {
         getNewestAct();
     }, 100)
+    let startPlayPromise = backgroundMusic.play();
+    if (startPlayPromise !== undefined) {
+        startPlayPromise.catch(error => {
+            if (error.name === "NotAllowedError") {
+                // 弹窗引导用户与页面做交互，只需要一个简单的按钮即可
+                // 记得在按钮上绑定一个带有play()方法的回调函数，以element-plus的组件为例
+                audioIf = false;
+                $('.muciek').attr('src', './images/jin.png');
+                toastMsg('检测到您的设备因权限问题，无法播放音乐，请在右上角打开音乐')
+            }
+        }).then(() => {
+        });
+    }
 })
 // 獲取用戶相關信息
 function getUserInfo () {
@@ -112,7 +127,9 @@ function getNewestAct () {
                             backgroundMusic.pause();
                             lotteryMusic.currentTime = 0;
                             lotteryMusic.volume = 100 / 100;
-                            lotteryMusic.play();
+                            if (audioIf) {
+                                lotteryMusic.play();
+                            }
 
                             console.log("第二階段");
                             countupTimes = Math.floor(((showResultStageStartTime - drawStageStartTime) - (userComeinTime - drawStageStartTime)) / 1000 + 1);
@@ -315,10 +332,11 @@ function draw (itemId, tais) {
 $('.box .box_in .sBox').click(function () {
     var id = $(this).attr('id');
     // $(this).children('.qp').show();
-    var drawBut = document.getElementById("draw");
     drawBut.pause();
     drawBut.currentTime = 0; // 将当前时间设置为0，可选
-    drawBut.play();
+    if (audioIf) {
+        drawBut.play();
+    }
 
     draw(id, $(this));
 })
@@ -516,12 +534,14 @@ $('.muciek').click(function () {
     if (audioIf) {
         $(this).attr('src', './images/bo.png')
         backgroundMusic.play();
+        lotteryMusic.volume = 0;
+        lotteryMusic.play();
     } else {
         $(this).attr('src', './images/jin.png')
         backgroundMusic.pause();
+        lotteryMusic.pause();
     }
 })
-
 //返回页面 重新请求接口
 // var hiddenProperty = 'hidden' in document ? 'hidden' :
 //     'webkitHidden' in document ? 'webkitHidden' :