Browse Source

甲方离线版-增加单独热点页面

shaogen1995 8 months ago
parent
commit
1ec0a9e0ad

+ 4 - 4
SWKK/public/index.html

@@ -14,12 +14,12 @@
   <title>雨花台烈士纪念馆</title>
 
   <!-- 线上开发加上 -->
-  <script src="//4dkk.4dage.com/v4/sdk/4.2.0/kankan-sdk-deps.js"></script>
-  <script src="//4dkk.4dage.com/v4/sdk/4.2.0/kankan-sdk.js"></script>
+  <!-- <script src="//4dkk.4dage.com/v4/sdk/4.2.0/kankan-sdk-deps.js"></script>
+  <script src="//4dkk.4dage.com/v4/sdk/4.2.0/kankan-sdk.js"></script> -->
 
   <!-- 本地化加上 -->
-  <!-- <script src="./sdk/kankan-sdk-deps.js"></script>
-  <script src="./sdk/kankan-sdk.js"></script> -->
+  <script src="./sdk/kankan-sdk-deps.js"></script>
+  <script src="./sdk/kankan-sdk.js"></script>
 
   <script src="./jquery-2.1.1.min.js"></script>
 

+ 9 - 5
SWKK/src/components/Hot.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="Hot" :class="{ active: show }" @click.stop="">
-    <div class="close" @click="$emit('hotClose')">
+    <div class="close" @click="$emit('hotClose')" v-if="!isOne">
       <img src="../assets/img/hotClose.png" alt="" />
     </div>
 
@@ -47,7 +47,7 @@
                   <video
                     v-if="item.media && item.media.video[0]"
                     controls
-                    :src="`https://4dkk.4dage.com/scene_edit_data/${KKNum}/user/${item.media.video[0].src}`"
+                    :src="`scene_view_data/${KKNum}/user/${item.media.video[0].src}`"
                   ></video>
                 </div>
               </div>
@@ -63,7 +63,7 @@
               <div class="ifrBox">
                 <iframe
                   v-if="item.media && item.media.link[0]"
-                  :src="item.media.link[0].src"
+                  :src="item.media.link[0].src.replace('https://4dscene.4dage.com/culturalrelics','')"
                   frameborder="0"
                 ></iframe>
               </div>
@@ -79,7 +79,7 @@
               <Audio
                 :Aid="item.media.audio[0].src"
                 v-if="item.media && item.media.audio[0] && audioIndex === index"
-                :audioSrc="`https://4dkk.4dage.com/scene_edit_data/${KKNum}/user/${item.media.audio[0].src}`"
+                :audioSrc="`scene_view_data/${KKNum}/user/${item.media.audio[0].src}`"
               />
             </template>
           </div>
@@ -192,6 +192,10 @@ export default {
       type: Object,
       default: () => {},
     },
+    isOne:{
+      type:Boolean,
+      default:false
+    }
   },
   name: "Hot",
   components: { Audio },
@@ -295,7 +299,7 @@ export default {
     info: {
       handler(val) {
         // 通过id获取配置化信息
-        // console.log("------------------------", this.hotIdOrName);
+        // console.log("------------------------", this.hotIdOrName,val);
         const myinfo = hotDataRes.find((v) => v.hotId === this.hotIdOrName.id);
         this.info = val;
         let obj = {

+ 6 - 0
SWKK/src/router/index.js

@@ -9,9 +9,15 @@ const routes = [
     name: 'Home',
     component: () => import('../views/Home.vue')
   },
+  {
+    path: '/HotPage/:key/:id',
+    name: 'HotPage',
+    component: () => import('../views/HotPage.vue')
+  },
 
 ]
 
+
 const router = new VueRouter({
   routes
 })

+ 4 - 4
SWKK/src/views/Home.vue

@@ -248,9 +248,9 @@ export default {
       dom: ".box",
       num,
       // 本地化加上
-      // deploy:'local',
-      // resource:'',
-      // server:''
+      deploy:'local',
+      resource:'',
+      server:''
     });
     kankan.use("MinMap", {
       theme: {
@@ -354,7 +354,7 @@ export default {
     // 全部热点数据
     kankan.store.on("tags", (tags) => {
       this.$refs.RbottomRef.getHotListToFather(tags.tags);
-      this.baseHotData = tags.tags.reverse();
+      this.baseHotData = tags.tags.reverse();      
     });
 
     // 热点

+ 110 - 0
SWKK/src/views/HotPage.vue

@@ -0,0 +1,110 @@
+<template>
+  <div class="HotPage">
+    <Hot
+      v-if="sonInfo"
+      :info="sonInfo"
+      :hotIdOrName="hotIdOrName"
+      :isOne="true"
+      @hotClose="()=>{}"
+    />
+  </div>
+</template>
+
+<script>
+import Hot from "../components/Hot.vue";
+export default {
+  components: {Hot},
+  data() {
+    return {
+      sonInfo: null,
+      hotIdOrName: null,
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    // 热点数据处理得到单个数据
+    hotListFu(data) {
+      // console.log(123,data.length);
+      
+      // data.forEach(v=>{
+        
+      //   console.log(`id:${v.panoId},title:${v.title}`);
+      // })
+      
+     let info =data.find(v=>v.panoId===this.$route.params.id)
+     this.openHotFu(info,data)
+    },
+
+    // 封装点击热点的函数
+    openHotFu(data,arr) {
+      let temp = [];
+
+      // 如果是多个热点合并
+      if (data.title.split("&")[1]) {
+        arr.forEach((v) => {
+          if (v.title.split("&")[1] === data.title.split("&")[1]) {
+            temp.push(v);
+            if (v.media && v.media.image && v.media.image.length > 1) {
+              v.media.image.forEach((p, pI) => {
+                if (pI !== 0) temp.push({ ...v, media: { image: [p] } });
+              });
+            }
+          }
+        });
+        let obj = {
+          image: [],
+          audio: [],
+          link: [],
+          video: [],
+        };
+        temp.forEach((v) => {
+          if (obj[v.type]) obj[v.type].push(v);
+        });
+        for (const k in obj) {
+          if (k === "audio") {
+            obj[k].reverse();
+          }
+        }
+
+        this.hotIdOrName = {
+          id: data.sid,
+          name: data.title.split("&")[0],
+        };
+        this.sonInfo = obj;
+      } else {
+        this.hotIdOrName = {
+          id: data.sid,
+          name: data.title,
+        };
+        // 单个热点
+        this.sonInfo = { [data.type]: [data] };
+      }
+    },
+  },
+  created() {
+    let lId = this.$route.params.key;
+    window.KKNum = lId==='1'?'KJ-aigSkgvRWR':'KJ-ufjLwlSXba';
+    const url = `http://yhtjyk.travel-yuhuatai.com:9888/YHT/Swkk/scene_view_data/${
+      lId === "1" ? "KJ-aigSkgvRWR" : "KJ-ufjLwlSXba"
+    }/user/hot.json`;
+    fetch(url)
+      .then((response) => response.json()) // 将响应转换为 JSON
+      .then((data) => this.hotListFu(data)); // 处理数据
+  },
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
+};
+</script>
+<style lang="less" scoped>
+.HotPage{
+  width: 100%;
+  height: 100%;
+}
+</style>