点击热点打开小游戏

hot/src/views/data.js

@@ -3284,7 +3284,8 @@ Copper Coffin in Dabona, Xiangyun`,
       // 中文版------工作风采
       {
             suf: '.png',
-            id: 'n5Tsx416758',
+            // id: 'n5Tsx416758',
+            id:'it1p2q967468',
             title: [
                   '党员先锋',
                   '党员先锋',

web/public/static/css/main.css

@@ -3349,7 +3349,7 @@ a.hasHover:hover, a:active {
     bottom: 0px;
     width: 100%;
     transition: all .5s;
-    z-index: 4;
+    z-index: 102;
     position: absolute;
 }
 

web/public/static/js/Hot.js

@@ -1177,6 +1177,12 @@ window.initHot = function (model) {
             var popup = document.getElementById("popup");
 
             if (openHot) {
+                let tempp ='e7hJg962934,2qk4QTi116699'
+                if(tempp.includes(this.info.sid)){
+                    window.player.emit('openGame',this.info.sid)
+                    return
+                }
+
                 g_currentHot = this,
                     popup.style.display = "block",
                     popup.classList.add("wait");

web/src/pages/Home.vue

@@ -179,6 +179,16 @@ export default {
             hotspot: this.hotspots[data],
           });
         });
+
+        window.player.on('openGame',(data)=>{
+          if(data==='e7hJg962934'){
+            //打开开心消消乐游戏
+          this.$refs.vMenuRef.gameShowFu('Remove');
+          }else if(data==='2qk4QTi116699') {
+            // 打开趣味答题游戏
+          this.$refs.vMenuRef.gameShowFu('Issue');
+          }
+        })
         //控制页面初始旋转一下，让小地图正确显示
         let rotate = window.player.cameraControls.controls.panorama.rotationAcc;
         rotate.x = 0.001;

web/src/views/gui/component/game.vue

@@ -30,7 +30,12 @@ export default {
     };
   },
   computed: {},
-  methods: {},
+  methods: {
+    // 封装一个方法，让父组件调用，打开对应的游戏
+    gameOpenFu(val){
+      this.change=val
+    }
+  },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）

web/src/views/gui/menu.vue

@@ -28,7 +28,11 @@
             rel="tooltip"
             data-original-title="播放"
           >
-            <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+            <div
+              class="mobileTit"
+              v-if="isMobile"
+              :class="{ mobileTitEn: !Mylangue }"
+            >
               {{ Mylangue ? "漫游" : "Explore" }}
             </div>
             <a>
@@ -74,7 +78,11 @@
               rel="tooltip"
               :title="Mylangue ? '场景导览' : 'Auto Explore'"
             >
-              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+              <div
+                class="mobileTit"
+                v-if="isMobile"
+                :class="{ mobileTitEn: !Mylangue }"
+              >
                 {{ Mylangue ? "场景" : "Auto" }}
               </div>
 
@@ -113,7 +121,11 @@
               rel="tooltip"
               :title="Mylangue ? '顶部俯视' : 'Floor plan'"
             >
-              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+              <div
+                class="mobileTit"
+                v-if="isMobile"
+                :class="{ mobileTitEn: !Mylangue }"
+              >
                 {{ Mylangue ? "俯视" : "Floor plan" }}
               </div>
               <img
@@ -134,7 +146,11 @@
               id="gui-modes-dollhouse"
               rel="tooltip"
             >
-              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+              <div
+                class="mobileTit"
+                v-if="isMobile"
+                :class="{ mobileTitEn: !Mylangue }"
+              >
                 {{ Mylangue ? "三维" : "3D" }}
               </div>
               <img
@@ -184,7 +200,11 @@
                     }.png`)
                   "
                 />
-                <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+                <div
+                  class="mobileTit"
+                  v-if="isMobile"
+                  :class="{ mobileTitEn: !Mylangue }"
+                >
                   {{ Mylangue ? "展品" : "Collection" }}
                 </div>
               </li>
@@ -348,7 +368,7 @@
         <img
           :src="require(`@/assets/imgM/${mobilShow ? 'close' : 'menu'}.png`)"
         />
-        <div class="isMobileBoxTit">{{Mylangue?'功能':'Function'}}</div>
+        <div class="isMobileBoxTit">{{ Mylangue ? "功能" : "Function" }}</div>
       </div>
       <div v-if="mobilShow" class="show">
         <!-- 语言切换 -->
@@ -356,16 +376,16 @@
           :src="require(`@/assets/img/${Mylangue ? 'cn' : 'en'}.png`)"
           @click="langueCut"
         />
-        <div class="isMobileBoxTit">{{Mylangue?'语言':'Language'}}</div>
+        <div class="isMobileBoxTit">{{ Mylangue ? "语言" : "Language" }}</div>
         <!-- 分享 -->
         <img src="@/assets/img/share.png" @click="isShare = true" />
-        <div class="isMobileBoxTit">{{Mylangue?'分享':'Share'}}</div>
+        <div class="isMobileBoxTit">{{ Mylangue ? "分享" : "Share" }}</div>
         <!-- 答题 -->
         <img
           @click="isIssue = true"
           :src="require(`@/assets/img/${isGame ? 'game_active' : 'game'}.png`)"
         />
-        <div class="isMobileBoxTit">{{Mylangue?'游戏':'Game'}}</div>
+        <div class="isMobileBoxTit">{{ Mylangue ? "游戏" : "Game" }}</div>
         <!-- 音乐 -->
         <div
           @click="switchBGM"
@@ -381,7 +401,7 @@
               }.png`)
             "
           />
-          <div class="isMobileBoxTit">{{Mylangue?'音乐':'Music'}}</div>
+          <div class="isMobileBoxTit">{{ Mylangue ? "音乐" : "Music" }}</div>
         </div>
       </div>
     </div>
@@ -393,7 +413,7 @@
     <!-- 顶部的名字还有浏览人数 -->
     <Browse />
     <!-- 游戏 -->
-    <Game v-if="isIssue" @close="isIssue = false" />
+    <Game v-if="isIssue" @close="isIssue = false" ref="gameCon" />
   </div>
 </template>
 
@@ -443,6 +463,15 @@ export default {
     this.getlikeCon("detail/");
   },
   methods: {
+    gameShowFu(val) {
+      this.isIssue = true;
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.$refs.gameCon.gameOpenFu(val);
+        }, 100);
+      });
+    },
+    // 打开游戏----热点触发，让父组件调用
     mobilShowHide() {
       this.mobilShow = false;
     },
@@ -737,10 +766,10 @@ export default {
     z-index: 999;
     text-align: center;
   }
-  .mobileTitEn{
+  .mobileTitEn {
     width: 80px;
     font-size: 12px;
-    transform: translateX(-50%) scale(.8);
+    transform: translateX(-50%) scale(0.8);
   }
   #gui-modes-floorplan {
     position: relative;
@@ -768,7 +797,7 @@ export default {
       margin-left: 6px;
       display: block;
     }
-    .isMobileBoxTit{
+    .isMobileBoxTit {
       margin-bottom: 8px;
     }
   }
@@ -780,7 +809,7 @@ export default {
       width: 38px;
     }
   }
-  .isMobileBoxTit{
+  .isMobileBoxTit {
     font-size: 12px;
     color: #fff;
     width: 50px;