update

packages/qjkankan-view/src/components/Fdkk/index.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="fdkkcon">
     <template v-if="fdkkCurrentVersion == 'v3'">
+      
       <iframe
         allowfullscreen="true"
         allow="autoplay"
@@ -22,7 +23,7 @@
         :url="
           otherLink
             ? otherLink
-            : `/embed.html?from=mingyuan&m=${
+            : `https://test.4dkankan.com/embed.html?from=mingyuan&m=${
                 embeM || currentScene.sceneCode
               }&lang=${lang}&scene-link=1&rnd=${rnd}`
         "
@@ -52,13 +53,11 @@
 import { ref, watch, computed, onUnmounted, onMounted, nextTick } from "vue";
 import { useStore } from "vuex";
 import browser from "@/utils/browser";
-// import { useMusicPlayer } from '@/utils/sound'
+
 import v3mobile from "./v3fdkkmobile/iframe.vue";
 import { getApp } from "@/app";
 import config from "@/utils/config";
 
-// const musicPlayer = useMusicPlayer()
-
 const store = useStore();
 const isMobile = computed(() => browser.isMobile());
 
@@ -111,10 +110,8 @@ const handleMessage = (res) => {
     //场景本身的背景音乐 (同时可判断场景已经加载完成)
     if (event == "fdkkBgmLink") {
       // store.commit('fdkk/setFdkkBGM', params.music)
-      if (params.music) {
-        store.dispatch("audio/initV4BGM", params.music);
-      }
-
+      console.log("fdkkBgmLink", params.music);
+      store.dispatch("audio/initV4BGM", params.music);
       // loading完毕
       getApp().Scene.emit("ready");
     }

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

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

packages/qjkankan-view/src/components/Pano/index.vue

@@ -90,38 +90,17 @@ watch(
           // v3
           if (data.data.isUpgrade === 0) {
             store.dispatch("audio/pauseBGM");
-            // if (!browser.isMobile()) {
-            //   // musicPlayer.pause();
-            // } else {
             let flag =
               data.data.bgMusic &&
               data.data.bgMusic != "0" &&
               data.data.bgMusic != "noMusic";
 
             store.commit("fdkk/setV3FdkkBGM", flag);
-            if (unref(isHasNormalBGM) && !flag) {
+            if (!unref(isHasNormalBGM) && !flag) {
               store.dispatch("audio/pauseBGM");
             }
-            // store.dispatch("audio/setV3BGM", flag);
-            // 该v3场景有背景音乐
-            // if (flag) {
-            //   musicPlayer.pause();
-            // }
-            // console.log(data.data.bgMusic && data.data.bgMusic != '0' && data.data.bgMusic != 'noMusic','==========');
-            // }
           }
         }
-
-        // else{
-        //   useMusicPlayer.player.watchPlay(true)
-        // }
-
-        //上一个场景如果是四维看看场景且当前场景是v4
-        // if (oldVal.type == '4dkk' && data.data.isUpgrade !== 0) {
-        //   store.commit('fdkk/setFdkkBGM', '')
-        //   musicPlayer.pause()
-        //   useMusicPlayer.player.watchPlay(true)
-        // }
       });
     }
   },
@@ -183,8 +162,6 @@ useApp().then((app) => {
             hotspot.hotspotType == "video"
           ) {
             store.commit("functions/setPauseFrom", currentPlaying.value);
-            // musicPlayer.pause();
-            // soundPlayer.pause();
           }
         }
       }

packages/qjkankan-view/src/components/UIGather/control/text.vue

@@ -14,17 +14,7 @@
 </template>
 
 <script setup>
-import {
-  reactive,
-  defineEmits,
-  onBeforeMount,
-  onMounted,
-  ref,
-  watchEffect,
-  computed,
-  watch,
-  nextTick,
-} from "vue";
+import { computed } from "vue";
 import { useStore } from "vuex";
 const store = useStore();
 

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

@@ -13,7 +13,7 @@
       (customLink && customLink.isShow) ||
       (customTelephone && customTelephone.isShow) ||
       metadata.description ||
-      (metadata.backgroundMusic && metadata.backgroundMusic.id) ||
+      isHasNormalBGM ||
       fdkkBGM ||
       v3IsBgm
     "
@@ -131,29 +131,13 @@
       <img :src="require(`@/assets/images/icon/text@2x.png`)" alt="" />
     </li>
 
-    <!-- 背景音乐 -->
-    <li
-      @click="onIsBGM"
-      v-if="
-        (metadata.backgroundMusic && metadata.backgroundMusic.id) ||
-        fdkkBGM ||
-        v3IsBgm
-      "
-    >
-      <img
-        v-if="v3IsBgm"
-        :src="
-          require(`@/assets/images/icon/${
-            v3BGMStatus ? 'music@2x.png' : 'music_disabled@2x.png'
-          }`)
-        "
-        alt=""
-      />
+    <li @click="onIsBGM" v-if="isHasNormalBGM || isHasV4BGM">
       <img
-        v-else
         :src="
           require(`@/assets/images/icon/${
-            showMusicPlaying ? 'music@2x.png' : 'music_disabled@2x.png'
+            (isPlayNormalBGM || isPlayV4BGM) && isCurrentPlaying
+              ? 'music@2x.png'
+              : 'music_disabled@2x.png'
           }`)
         "
         alt=""
@@ -169,19 +153,11 @@
 </template>
 
 <script setup>
-import { computed } from "vue";
+import { computed, unref, ref } from "vue";
 import introduce from "./control/text";
 import telephone from "./control/telephone";
 import clink from "./control/link";
 import { useStore } from "vuex";
-// import { useMusicPlayer } from '@/utils/sound'
-
-// //背景音乐
-// const musicPlayer = useMusicPlayer()
-
-// const showMusicPlaying = ref(musicPlayer.isPlay)
-
-// alert(showMusicPlaying.value)
 
 const store = useStore();
 const toursList = computed(() => store.getters["fdkk/toursList"]);
@@ -201,8 +177,7 @@ const showTours = computed(() => store.getters["fdkk/isShowToursList"]);
 
 // const currentScene = computed(() => store.getters["scene/currentScene"]);
 const metadata = computed(() => store.getters["scene/metadata"]);
-// const scenes = computed(() => store.getters["scene/list"]);
-// const secondaryList = computed(() => store.getters["scene/secondaryList"]);
+
 const fdkkmetadata = computed(() => store.getters["fdkk/metadata"]);
 
 const fdkkCurrentVersion = computed(
@@ -221,6 +196,21 @@ const showIntroduce = computed(() => store.getters["functions/showIntroduce"]);
 const showTelephone = computed(() => store.getters["functions/showTelephone"]);
 const showLink = computed(() => store.getters["functions/showLink"]);
 
+//BMG音乐
+const isHasNormalBGM = computed(() => store.getters["audio/isHasNormalBGM"]);
+const isCurrentPlaying = computed(
+  () => store.getters["audio/isCurrentPlaying"]
+);
+const isHasV3BGM = computed(() => store.getters["audio/isHasV3BGM"]);
+const isHasV4BGM = computed(() => store.getters["audio/isHasV4BGM"]);
+const isHasExplanationBGM = computed(
+  () => store.getters["audio/isHasExplanationBGM"]
+);
+//BMG playing音乐
+const isPlayNormalBGM = computed(() => store.getters["audio/isPlayNormalBGM"]);
+const isPlayV3BGM = computed(() => store.getters["audio/isPlayV3BGM"]);
+const isPlayV4BGM = computed(() => store.getters["audio/isPlayV4BGM"]);
+
 const onIntroduce = () => {
   store.commit("functions/setShowIntroduce", true);
 };

packages/qjkankan-view/src/components/UIGather/mobile/control.pano.vue

@@ -18,14 +18,13 @@
     </li>
 
     <!-- 背景音乐 -->
-    <li
-      @click="onIsBGM"
-      v-if="metadata.backgroundMusic && metadata.backgroundMusic.id"
-    >
+    <li @click="onIsBGM" v-if="isHasNormalBGM">
       <img
         :src="
           require(`@/assets/images/icon/${
-            showMusicPlaying ? 'music@2x.png' : 'music_disabled@2x.png'
+            isPlayNormalBGM && isCurrentPlaying
+              ? 'music@2x.png'
+              : 'music_disabled@2x.png'
           }`)
         "
         alt=""
@@ -33,14 +32,11 @@
     </li>
 
     <!-- 解说音频 -->
-    <li
-      @click="onIsCommentary"
-      v-if="currentScene.explanation && currentScene.explanation.audioUrl"
-    >
+    <li @click="onIsCommentary" v-if="isHasExplanationBGM">
       <img
         :src="
           require(`@/assets/images/icon/${
-            showCommentaryPlaying
+            isPlayExplanationBGM && isCurrentPlaying
               ? 'commentary@2x.png'
               : 'commentary_disabled@2x.png'
           }`)
@@ -84,13 +80,6 @@ import { useApp } from "@/app";
 import introduce from "./control/text";
 import telephone from "./control/telephone";
 import clink from "./control/link";
-// import { useMusicPlayer, useSoundPlayer } from "@/utils/sound";
-
-//背景音乐
-// const musicPlayer = useMusicPlayer();
-
-// //解说音乐
-// const soundPlayer = useSoundPlayer();
 
 const store = useStore();
 
@@ -114,6 +103,24 @@ const showIntroduce = computed(() => store.getters["functions/showIntroduce"]);
 const showTelephone = computed(() => store.getters["functions/showTelephone"]);
 const showLink = computed(() => store.getters["functions/showLink"]);
 
+//BMG音乐
+const isHasNormalBGM = computed(() => store.getters["audio/isHasNormalBGM"]);
+const isCurrentPlaying = computed(
+  () => store.getters["audio/isCurrentPlaying"]
+);
+const isHasV3BGM = computed(() => store.getters["audio/isHasV3BGM"]);
+const isHasV4BGM = computed(() => store.getters["audio/isHasV4BGM"]);
+const isHasExplanationBGM = computed(
+  () => store.getters["audio/isHasExplanationBGM"]
+);
+//BMG playing音乐
+const isPlayNormalBGM = computed(() => store.getters["audio/isPlayNormalBGM"]);
+const isPlayV3BGM = computed(() => store.getters["audio/isPlayV3BGM"]);
+const isPlayV4BGM = computed(() => store.getters["audio/isPlayV4BGM"]);
+const isPlayExplanationBGM = computed(
+  () => store.getters["audio/isPlayExplanationBGM"]
+);
+
 const isFullscreen = ref(false);
 
 const onIntroduce = () => {
@@ -130,15 +137,30 @@ const onLink = () => {
   }
 };
 const onIsBGM = () => {
-  // showMusicPlaying.value ? musicPlayer.pause() : musicPlayer.play();
+  if (!unref(isPlayNormalBGM)) {
+    store.dispatch("audio/playBGM", 0);
+  } else {
+    if (unref(isCurrentPlaying)) {
+      store.dispatch("audio/pauseBGM");
+    } else {
+      store.dispatch("audio/playBGM", 0);
+    }
+  }
 };
-
 const onIsAutoRotate = (data) => {
   store.commit("functions/setAutoRotate", !isAutoRotate.value);
 };
 
-const onIsCommentary = (data) => {
-  showCommentaryPlaying.value ? soundPlayer.pause() : soundPlayer.play();
+const onIsCommentary = () => {
+  if (!unref(isPlayExplanationBGM)) {
+    store.dispatch("audio/playBGM", 3);
+  } else {
+    if (unref(isCurrentPlaying)) {
+      store.dispatch("audio/pauseBGM");
+    } else {
+      store.dispatch("audio/playBGM", 3);
+    }
+  }
 };
 
 const onVR = (data) => {
@@ -190,18 +212,6 @@ onMounted(() => {
     });
   });
 });
-
-// musicPlayer.on("play", () => {
-//   showMusicPlaying.value = true;
-//   soundPlayer.pause();
-// });
-// musicPlayer.on("pause", () => (showMusicPlaying.value = false));
-
-// soundPlayer.on("play", () => {
-//   showCommentaryPlaying.value = true;
-//   musicPlayer.pause();
-// });
-// soundPlayer.on("pause", () => (showCommentaryPlaying.value = false));
 </script>
 
 <style lang="scss" scoped>

packages/qjkankan-view/src/components/UIGather/mobile/control.vue

@@ -18,81 +18,11 @@ import {
   unref,
 } from "vue";
 import { useStore } from "vuex";
-// import { useMusicPlayer, useSoundPlayer } from "@/utils/sound";
 
-//背景音乐
-// const musicPlayer = useMusicPlayer();
-
-//解说音乐
-// const soundPlayer = useSoundPlayer();
 
 const store = useStore();
 const currentScene = computed(() => store.getters["scene/currentScene"]);
-// const metadata = computed(() => store.getters["scene/metadata"]);
-// const isDoneforCover = computed(() => store.getters["scene/isDoneforCover"]);
-// const isShowCover = computed(
-//   () => metadata.value.coverInfo?.isShowCover || false
-// );
-
-// const setExplanation = (from) => {
-//   if (
-//     "explanation" in currentScene.value &&
-//     "audioUrl" in currentScene.value.explanation
-//   ) {
-//     console.log("设置解说", from);
-//     let { audioUrl, openByDefault, repeat } = currentScene.value.explanation;
-//     // showCommentaryPlaying.value = false;
-//     store.commit("functions/setCommentaryUrl", {
-//       src: audioUrl,
-//       loop: repeat,
-//       openByDefault: openByDefault,
-//     });
-//     useSoundPlayer.player.isLock = false;
-//     useSoundPlayer.player.watchPlay();
-//   }
-// };
-// const stopExplanation = (from) => {
-//   console.log("stop解说", from);
-//   useSoundPlayer.player.isLock = true;
-//   soundPlayer.paused();
-// };
-// const resumeExplanation = () => {
-//   console.log("resume解说");
-//   useSoundPlayer.player.isLock = false;
-//   useSoundPlayer.player.watchPlay();
-// };
-// const resetExplanation = (from) => {
-//   console.log("清空解说", from);
-//   store.commit("functions/setCommentaryUrl", "");
-//   useSoundPlayer.player.isLock = true;
-//   soundPlayer.paused();
-// };
-// watch([isShowCover, isDoneforCover], (val) => {
-//   if (unref(val[0]) && unref(val[1])) {
-//     resumeExplanation(2);
-//   }
-//   if (unref(val[0]) && !unref(val[1])) {
-//     stopExplanation(2);
-//   }
-// });
-
-// watchEffect(() => {
-//   if (currentScene.value.explanation) {
-//     let { audioUrl } = currentScene.value.explanation;
 
-//     if (audioUrl) {
-//       //解说有变，初始化按钮状态
-//       setExplanation(1);
-//       if (unref(isShowCover)) {
-//         stopExplanation(1);
-//       }
-//     } else {
-//       resetExplanation(1);
-//     }
-//   } else {
-//     resetExplanation(2);
-//   }
-// });
 </script>
 
 <style lang="scss" scoped>

packages/qjkankan-view/src/components/UIGather/mobile/control/text.vue

@@ -72,6 +72,8 @@ const close = () => {
       max-height: calc(100vh - 60px);
       overflow-y: auto;
       line-height: 24px;
+      word-wrap: break-word;
+      white-space: normal;
     }
   }
 

packages/qjkankan-view/src/components/assembly/MobileTags/metas/metas-article.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="articlecon">
-    <div class="txtbody" v-html="currentTag.articleInfo.html"></div>
+    <div class="txtbody xxx" v-html="currentTag.articleInfo.html"></div>
   </div>
 </template>
 
@@ -35,6 +35,7 @@ const currentTag = computed(() => store.getters["tags/currentTag"]);
     padding: 20px;
     margin-bottom: 80px;
     line-height: 1.5;
+    word-wrap: break-word;
     :deep(p) {
       line-height: 24px;
     }

packages/qjkankan-view/src/pages/show.vue

@@ -112,7 +112,6 @@ onMounted(async () => {
     // 所有audio入口
 
     const currentSceneData = firstScene || data.scenes[0];
-    // debugger;
     store.dispatch("audio/initNormalBGM", data.backgroundMusic.ossPath);
     store.commit("scene/setCurrentScene", currentSceneData);
 

packages/qjkankan-view/src/pages/showMobile.vue

@@ -37,7 +37,7 @@ import config from "@/utils/config";
 import browser from "@/utils/browser";
 import { useApp } from "@/app";
 import { useWxShared } from "@/hooks/useWxshared";
-
+import { useAudio } from "@/hooks/useAudio";
 import { useI18n, getLocale } from "@/i18n";
 const { t } = useI18n({ useScope: "global" });
 
@@ -46,7 +46,6 @@ initWxShare();
 
 const coverInfo = ref({});
 
-
 const store = useStore();
 const show = ref(false);
 const workEnable = ref(true);
@@ -114,7 +113,12 @@ onMounted(async () => {
       );
     }
 
-    store.commit("scene/setCurrentScene", firstScene || data.scenes[0]);
+    // 所有audio入口
+
+    const currentSceneData = firstScene || data.scenes[0];
+    // debugger;
+    store.dispatch("audio/initNormalBGM", data.backgroundMusic.ossPath);
+    store.commit("scene/setCurrentScene", currentSceneData);
 
     // 过滤空分组
     let ttt = data.catalogRoot.filter((item) => {
@@ -187,56 +191,63 @@ onMounted(async () => {
       },
       passQueryParameters: true,
     });
-    coverInfo.value = data.coverInfo || {};
-    app.Scene.lock();
-    //如果不需要开场封面就直接渲染
-    if (!coverInfo.value?.isShowCover) {
-      app.render();
-    }
-
-    if (isHavePano) {
-      app.Scene.on("sceneReady", () => {
-        if (app.krpanoDom) {
-          let defaultMask = `%SWFPATH%/skin/masking_${lang}.png`;
+    if (app) {
+      coverInfo.value = data.coverInfo || {};
+      app.Scene.lock();
+      //如果不需要开场封面就直接渲染
+      if (!coverInfo.value?.isShowCover) {
+        app.render();
+      }
 
-          if (earthMask.value) {
-            app.krpanoDom.set(`hotspot[nadirlogo].url`, defaultMask);
-            app.krpanoDom.set(
-              `hotspot[nadirlogo].visible`,
-              Boolean(earthMask.value.isShow)
-            );
+      if (isHavePano) {
+        app.Scene.on("sceneReady", () => {
+          if (app.krpanoDom) {
+            let defaultMask = `%SWFPATH%/skin/masking_${lang}.png`;
+
+            if (earthMask.value) {
+              app.krpanoDom.set(`hotspot[nadirlogo].url`, defaultMask);
+              app.krpanoDom.set(
+                `hotspot[nadirlogo].visible`,
+                Boolean(earthMask.value.isShow)
+              );
+
+              if (earthMask.value.icon) {
+                app.krpanoDom.set(
+                  `hotspot[nadirlogo].url`,
+                  earthMask.value.icon
+                );
+              }
+            }
 
-            if (earthMask.value.icon) {
-              app.krpanoDom.set(`hotspot[nadirlogo].url`, earthMask.value.icon);
+            if (skyMask.value) {
+              app.krpanoDom.set(`hotspot[peaklogo].url`, defaultMask);
+              app.krpanoDom.set(
+                `hotspot[peaklogo].visible`,
+                Boolean(skyMask.value.isShow)
+              );
+              if (skyMask.value.icon) {
+                app.krpanoDom.set(`hotspot[peaklogo].url`, skyMask.value.icon);
+              }
             }
-          }
 
-          if (skyMask.value) {
-            app.krpanoDom.set(`hotspot[peaklogo].url`, defaultMask);
             app.krpanoDom.set(
-              `hotspot[peaklogo].visible`,
-              Boolean(skyMask.value.isShow)
+              `layer[webvr_exitbutton].html`,
+              t("common.exit_vr")
             );
-            if (skyMask.value.icon) {
-              app.krpanoDom.set(`hotspot[peaklogo].url`, skyMask.value.icon);
-            }
           }
 
-          app.krpanoDom.set(
-            `layer[webvr_exitbutton].html`,
-            t("common.exit_vr")
-          );
-        }
-
-        let hotspots = [];
-        if (currentScene.value.someData) {
-          hotspots =
-            typeof currentScene.value.someData == "string"
-              ? JSON.parse(currentScene.value.someData).hotspots
-              : currentScene.value.someData.hotspots;
-        }
-        app.Tags.initHotspot(hotspots, false);
-      });
+          let hotspots = [];
+          if (currentScene.value.someData) {
+            hotspots =
+              typeof currentScene.value.someData == "string"
+                ? JSON.parse(currentScene.value.someData).hotspots
+                : currentScene.value.someData.hotspots;
+          }
+          app.Tags.initHotspot(hotspots, false);
+        });
+      }
+      const { initDefaultAudio } = useAudio();
+      initDefaultAudio();
     }
   });
 });