gemercheung 2 years ago
parent
commit
acfb2706fb

+ 11 - 9
packages/qjkankan-view/src/components/Fdkk/index.vue

@@ -133,18 +133,20 @@ const handleMessage = (res) => {
         store.commit("fdkk/setShowToursList", false);
       }
     }
+    //
 
     if (event == "toggleBgmStatus") {
+      console.error("toggleBgmStatus", params);
       // debugger;
-      if (params.status) {
-        if (unref(isHasV4BGM)) {
-          store.dispatch("audio/playBGM", 2);
-        } else {
-          store.dispatch("audio/playBGM", 0);
-        }
-      } else {
-        store.dispatch("audio/pauseBGM");
-      }
+      // if (params.status) {
+      //   if (unref(isHasV4BGM)) {
+      //     store.dispatch("audio/playBGM", 2);
+      //   } else {
+      //     store.dispatch("audio/playBGM", 0);
+      //   }
+      // } else {
+      //   store.dispatch("audio/pauseBGM");
+      // }
     }
 
     if (event == "autoPlayBgm") {

+ 11 - 9
packages/qjkankan-view/src/components/Fdkk/index_dev.vue

@@ -133,18 +133,20 @@ const handleMessage = (res) => {
         store.commit("fdkk/setShowToursList", false);
       }
     }
+    //
 
     if (event == "toggleBgmStatus") {
+      console.error("toggleBgmStatus", params);
       // debugger;
-      if (params.status) {
-        if (unref(isHasV4BGM)) {
-          store.dispatch("audio/playBGM", 2);
-        } else {
-          store.dispatch("audio/playBGM", 0);
-        }
-      } else {
-        store.dispatch("audio/pauseBGM");
-      }
+      // if (params.status) {
+      //   if (unref(isHasV4BGM)) {
+      //     store.dispatch("audio/playBGM", 2);
+      //   } else {
+      //     store.dispatch("audio/playBGM", 0);
+      //   }
+      // } else {
+      //   store.dispatch("audio/pauseBGM");
+      // }
     }
 
     if (event == "autoPlayBgm") {

+ 3 - 3
packages/qjkankan-view/src/components/Fdkk/v3fdkkmobile/iframe.vue

@@ -64,9 +64,9 @@ export default {
 
           if (e.data.params.type == "playMusic") {
             this.bgmstatus = e.data.params.data.status;
-
-            debugger;
-            this.store.commit('fdkk/setV3BGMStatus', e.data.params.data.status)
+            this.store.dispatch('audio/initV3BGM',this.bgmstatus);
+            console.log('initV3BGM',this.bgmstatus)
+            // this.store.commit('fdkk/setV3BGMStatus', e.data.params.data.status)
           }
 
           if (e.data.params.type == "mode") {

+ 55 - 20
packages/qjkankan-view/src/components/UIGather/mobile/control.fdkk.vue

@@ -14,8 +14,7 @@
       (customTelephone && customTelephone.isShow) ||
       metadata.description ||
       isHasNormalBGM ||
-      fdkkBGM ||
-      v3IsBgm
+      fdkkBGM
     "
   >
     <li
@@ -104,8 +103,7 @@
           (customTelephone && customTelephone.isShow) ||
           metadata.description ||
           (((metadata.backgroundMusic && metadata.backgroundMusic.id) ||
-            fdkkBGM ||
-            v3IsBgm) &&
+            fdkkBGM) &&
             fdkkmetadata &&
             (fdkkmetadata.controls.showPanorama ||
               fdkkmetadata.controls.showFloorplan ||
@@ -131,8 +129,18 @@
       <img :src="require(`@/assets/images/icon/text@2x.png`)" alt="" />
     </li>
 
-    <li @click="onIsBGM" v-if="isHasNormalBGM || isHasV4BGM">
+    <li @click="onIsBGM" v-if="isHasNormalBGM || isHasV4BGM || isHasV3BGM">
       <img
+        v-if="isHasV3BGM"
+        :src="
+          require(`@/assets/images/icon/${
+            isPlayV3BGM ? 'music@2x.png' : 'music_disabled@2x.png'
+          }`)
+        "
+        alt=""
+      />
+      <img
+        v-else
         :src="
           require(`@/assets/images/icon/${
             (isPlayNormalBGM || isPlayV4BGM) && isCurrentPlaying
@@ -185,8 +193,8 @@ const fdkkCurrentVersion = computed(
 );
 const fdkkBGM = computed(() => store.getters["fdkk/fdkkBGM"]);
 
-const v3IsBgm = computed(() => store.getters["fdkk/v3IsBgm"]);
-const v3BGMStatus = computed(() => store.getters["fdkk/v3BGMStatus"]);
+// const v3IsBgm = computed(() => store.getters["fdkk/v3IsBgm"]);
+// const v3BGMStatus = computed(() => store.getters["fdkk/v3BGMStatus"]);
 
 const customTelephone = computed(() => store.getters["scene/customTelephone"]);
 
@@ -225,22 +233,49 @@ const onLink = () => {
 };
 
 const onIsBGM = () => {
-  if (v3IsBgm.value) {
-    document.querySelector("#showifr") &&
-      document.querySelector("#showifr").contentWindow.postMessage(
-        {
-          source: "mingyuan",
-          event: "settings",
-          params: {
-            playMusic: !v3BGMStatus.value,
-          },
-        },
-        "*"
-      );
+  console.log("fdkk----onIsBGM");
+
+  if (unref(isHasV3BGM)) {
+    const v3playToggle = !unref(isPlayV3BGM);
+    console.log("v3playToggle", v3playToggle);
+    toggleV3BGM(v3playToggle);
+    return;
+  }
+
+  if (unref(isHasV4BGM)) {
+    if (!unref(isCurrentPlaying)) {
+      store.dispatch("audio/playBGM", 2);
+    } else {
+      store.dispatch("audio/pauseBGM");
+    }
   } else {
-    // showMusicPlaying.value ? musicPlayer.pause() : musicPlayer.play()
+    if (!unref(isCurrentPlaying)) {
+      store.dispatch("audio/playBGM", 0);
+    } else {
+      store.dispatch("audio/pauseBGM");
+    }
+  }
+};
+
+/**
+ * 只有v3利用Iframe postMessage
+ */
+const toggleV3BGM = (status) => {
+  const target = document.querySelector("#showifr");
+  if (target) {
+    target.contentWindow.postMessage(
+      {
+        source: "mingyuan",
+        event: "settings",
+        params: {
+          playMusic: status,
+        },
+      },
+      "*"
+    );
   }
 };
+window.toggleV3BGM = toggleV3BGM;
 
 const openTours = () => {
   if (isShowScenesList.value) {

+ 18 - 6
packages/qjkankan-view/src/store/modules/audio.js

@@ -25,6 +25,8 @@ export default {
                 type: 1,
                 order: 9,
                 repeat: false,
+                isExist: false,
+                isPlayIng: false,
             }, // v3背景音乐
             v4BGM: {
                 url: "",
@@ -46,7 +48,7 @@ export default {
     getters: {
         bgmList: (state) => [state.normalBGM, state.v3BGM, state.v4BGM, state.explanationBGM],
         currentAudio: (_, getters) => {
-            const arr = Array.from(getters.bgmList).filter(i => i.url).sort((a, b) => b.order - a.order)
+            const arr = Array.from(getters.bgmList).filter(i => i.url && i.type !== 1).sort((a, b) => b.order - a.order)
             return arr.length > 0 ? arr[0] : false;
         },
 
@@ -55,7 +57,7 @@ export default {
             return state.normalBGM.url.length > 0
         },
         isHasV3BGM: (state) => {
-            return state.v4BGM.url.length > 0
+            return state.v3BGM.isExist
         },
         isHasV4BGM: (state) => {
             return state.v4BGM.url.length > 0
@@ -66,8 +68,8 @@ export default {
         isPlayNormalBGM: (_, getters) => {
             return getters.currentAudio.type === 0
         },
-        isPlayV3BGM: (_, getters) => {
-            return getters.currentAudio.type === 1
+        isPlayV3BGM: (state) => {
+            return state.v3BGM.isPlayIng
         },
         isPlayV4BGM: (_, getters) => {
             return getters.currentAudio.type === 2
@@ -86,6 +88,12 @@ export default {
             state.explanationBGM.isAuto = payload.isAuto
             state.explanationBGM.repeat = payload.repeat
         },
+        setV3BGM(state, payload) {
+            state.v3BGM.isPlayIng = payload
+            if (payload) {
+                state.v3BGM.isExist = payload
+            }
+        },
         setV4BGM(state, payload) {
             state.v4BGM.url = payload.url
             state.v4BGM.isAuto = payload.isAuto
@@ -108,9 +116,9 @@ export default {
             commit('setExplanationBGM', { url, repeat, isAuto });
         },
 
-        initV3BGM({ commit }, { url, repeat, isAuto }) {
+        initV3BGM({ commit }, status) {
             // V3音乐
-            commit('setV3BGM', { url, repeat, isAuto });
+            commit('setV3BGM', status);
         },
         initV4BGM({ commit }, url) {
             // v4音乐
@@ -156,6 +164,10 @@ export default {
             const { currentPlayer } = useAudio();
             currentPlayer.value.pause();
         },
+        ResumeBGM() {
+            const { currentPlayer } = useAudio();
+            currentPlayer.value.play();
+        },
         updatePlayerStatus({ commit }, status) {
             commit('setPlayStatus', status)
         }