修复背景音乐和导览音乐冲突

web/public/static/js/main_2020_show.js

@@ -4752,6 +4752,11 @@ window.Modernizr = function(n, e, t) {
                 var musicInfo = this.model.heroLocations[this.destinationItem[0]].musicInfo
                 if(musicInfo && musicInfo.music){
                     let src = musicInfo.music.includes(g_Prefix.slice(-10)) ? musicInfo.music :  g_Prefix + musicInfo.music;
+
+                    console.log('自动导览有音乐，暂停背景音乐');
+                    document.querySelector('#openMusic').style.display='block'
+                    document.querySelector('#closeMusic').style.display='none'
+            
                     let audioObj = SoundManager.list.find(e=>e.name == 'tour')
                     let audioSrc1 = common.getFileNameFromUrl(audioObj.src);  
                     let audioSrc2 = common.getFileNameFromUrl(src)

web/src/pages/Home.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="parent-body" @click="musicPlay" @touchstart="musicPlay">
+  <!-- @click="musicPlay" @touchstart="musicPlay" -->
+  <div class="parent-body">
     <!-- 热点 -->
     <!-- <hot/> -->
     <!-- 热点弹出框 -->

web/src/views/gui/menu.vue

@@ -253,12 +253,21 @@
           />
         </div>
         <!-- 音乐 -->
-        <div id="volume" @click="switchBGM" class="ui-icon bgandshare wide">
+        <div id="volume" class="ui-icon bgandshare wide">
           <div>
             <img
-              :src="
-                require(`@/assets/img/${bgmPlay ? 'musicAc' : 'music'}.png`)
-              "
+              id="openMusic"
+              @click="switchBGM(true)"
+              src="../../assets/img/musicAc.png"
+              alt=""
+              title="打开音乐"
+            />
+            <img
+              id="closeMusic"
+              @click="switchBGM(false)"
+              src="../../assets/img/music.png"
+              alt=""
+              title="关闭音乐"
             />
           </div>
         </div>
@@ -314,7 +323,6 @@ export default {
   data() {
     return {
       isGuide: true,
-      bgmPlay: false,
       // 右侧菜单数据
       smBtn: false,
       meanInd: null,
@@ -341,20 +349,25 @@ export default {
   computed: {},
   mounted() {},
   methods: {
-    switchBGM() {
-      if (this.bgmPlay) {
+    switchBGM(flag) {
+      if (flag) {
         window.manage.switchBgmState(true);
-        this.bgmPlay = false;
+        document.querySelector('#openMusic').style.display='none'
+        document.querySelector('#closeMusic').style.display='block'
       } else {
         window.manage.switchBgmState(false);
-        this.bgmPlay = true;
-      }
+        document.querySelector('#openMusic').style.display='block'
+        document.querySelector('#closeMusic').style.display='none'
+        }
     },
   },
 };
 </script>
 
 <style lang="less" scoped>
+#closeMusic{
+  display: none;
+}
 #hotList {
   display: none !important;
 }
@@ -475,7 +488,7 @@ export default {
         font-size: 18px;
         color: #fff6d2;
       }
-      .acTxt{
+      .acTxt {
         color: #cc946d;
       }
     }

webM/public/static/js/main_2020_show.js

@@ -4752,6 +4752,12 @@ window.Modernizr = function(n, e, t) {
                 var musicInfo = this.model.heroLocations[this.destinationItem[0]].musicInfo
                 if(musicInfo && musicInfo.music){
                     let src = musicInfo.music.includes(g_Prefix.slice(-10)) ? musicInfo.music :  g_Prefix + musicInfo.music;
+                    
+                    console.log('自动导览有音乐，暂停背景音乐');
+                    document.querySelector('#openMusic').style.display='block'
+                    document.querySelector('#closeMusic').style.display='none'
+            
+
                     let audioObj = SoundManager.list.find(e=>e.name == 'tour')
                     let audioSrc1 = common.getFileNameFromUrl(audioObj.src);  
                     let audioSrc2 = common.getFileNameFromUrl(src)

webM/src/pages/Home.vue

@@ -14,7 +14,8 @@
     <div id="gui-thumb"></div>
 
     <!-- 主容器 -->
-    <div id="player" @touchstart="musicPlay"></div>
+     <!-- @touchstart="musicPlay" -->
+    <div id="player"></div>
     <div id="gui-parent">
       <!-- 进度条加载 -->
       <gui-loading />
@@ -125,8 +126,8 @@ export default {
 
   methods: {
     musicOne(){
-      this.musicFlag ++;
-      this.musicPlay()
+      // this.musicFlag ++;
+      // this.musicPlay()
     },
     musicPlay() {
       if(this.musicFlag>5) return

webM/src/views/gui/menu.vue

@@ -280,16 +280,22 @@
               <span class="shareTxt">分享页面</span>
             </div>
             <!-- 音乐 -->
-            <div id="volume" @click="switchBGM" class="ui-icon bgandshare wide">
-              <div>
+            <div id="volume" class="ui-icon bgandshare wide">
+              <div id="openMusic">
                 <img
-                  :src="
-                    require(`@/assets/img/${bgmPlay ? 'musicAc' : 'music'}.png`)
-                  "
+                  @click="switchBGM(true)"
+                  src="../../assets/img/musicAc.png"
+                  alt=""
                 />
-                <span class="musicTxt">{{
-                  bgmPlay ? "打开音乐" : "关闭音乐"
-                }}</span>
+                <span class="musicTxt">打开音乐</span>
+              </div>
+              <div id="closeMusic">
+                <img
+                  @click="switchBGM(false)"
+                  src="../../assets/img/music.png"
+                  alt=""
+                />
+                <span class="musicTxt">关闭音乐</span>
               </div>
             </div>
           </div>
@@ -316,7 +322,6 @@ export default {
   data() {
     return {
       isGuide: true,
-      bgmPlay: false,
       // 底部菜单的展开和收起
       packDo: false,
       // 顶部菜单的展开和收起
@@ -347,13 +352,15 @@ export default {
       this.topMean = !this.topMean;
       this.$emit("musicOne");
     },
-    switchBGM() {
-      if (this.bgmPlay) {
+    switchBGM(flag) {
+      if (flag) {
         window.manage.switchBgmState(true);
-        this.bgmPlay = false;
+        document.querySelector("#openMusic").style.display = "none";
+        document.querySelector("#closeMusic").style.display = "block";
       } else {
         window.manage.switchBgmState(false);
-        this.bgmPlay = true;
+        document.querySelector("#openMusic").style.display = "block";
+        document.querySelector("#closeMusic").style.display = "none";
       }
     },
   },
@@ -398,7 +405,7 @@ export default {
     width: 80%;
     height: calc(100% - 50px);
     &::after {
-      opacity: .3;
+      opacity: 0.3;
       content: "";
       position: absolute;
       top: 0;
@@ -421,8 +428,8 @@ export default {
     }
     .row {
       position: relative;
-      color: #FFF6D2;
-      border-bottom: 1px solid #FFF6D2;
+      color: #fff6d2;
+      border-bottom: 1px solid #fff6d2;
       height: 80px;
       line-height: 80px;
       font-size: 20px;
@@ -437,7 +444,7 @@ export default {
     }
     .active {
       pointer-events: none;
-      color: #CC946D;
+      color: #cc946d;
     }
     .bottom {
       display: flex;