更新热点图标 和热点列表

scene-离线版/package-lock.json

@@ -3394,6 +3394,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmmirror.com/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "node_modules/bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -6693,6 +6704,14 @@
         "webpack": "^4.0.0"
       }
     },
+    "node_modules/file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
     "node_modules/filesize": {
       "version": "3.6.1",
       "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
@@ -9483,6 +9502,14 @@
         "thenify-all": "^1.0.0"
       }
     },
+    "node_modules/nan": {
+      "version": "2.24.0",
+      "resolved": "https://registry.npmmirror.com/nan/-/nan-2.24.0.tgz",
+      "integrity": "sha512-Vpf9qnVW1RaDkoNKFUvfxqAbtI8ncb8OJlqZ9wwpXzWPEsvsB1nvdUi6oYrHIkQ1Y/tMDnr1h4nczS0VB9Xykg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
     "node_modules/nanomatch": {
       "version": "1.2.13",
       "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",
@@ -19890,6 +19917,16 @@
       "dev": true,
       "optional": true
     },
+    "bindings": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmmirror.com/bindings/-/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "file-uri-to-path": "1.0.0"
+      }
+    },
     "bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -22668,6 +22705,13 @@
         "schema-utils": "^2.5.0"
       }
     },
+    "file-uri-to-path": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
+      "dev": true,
+      "optional": true
+    },
     "filesize": {
       "version": "3.6.1",
       "resolved": "https://registry.npmjs.org/filesize/-/filesize-3.6.1.tgz",
@@ -24943,6 +24987,13 @@
         "thenify-all": "^1.0.0"
       }
     },
+    "nan": {
+      "version": "2.24.0",
+      "resolved": "https://registry.npmmirror.com/nan/-/nan-2.24.0.tgz",
+      "integrity": "sha512-Vpf9qnVW1RaDkoNKFUvfxqAbtI8ncb8OJlqZ9wwpXzWPEsvsB1nvdUi6oYrHIkQ1Y/tMDnr1h4nczS0VB9Xykg==",
+      "dev": true,
+      "optional": true
+    },
     "nanomatch": {
       "version": "1.2.13",
       "resolved": "https://registry.npmjs.org/nanomatch/-/nanomatch-1.2.13.tgz",

scene-离线版/public/static/js/Hot.js

@@ -1272,7 +1272,7 @@ window.initHot = function(model){
             var popup = document.getElementById("popup");
             
             if (openHot) {
-                alert('openHot')
+                // alert('openHot')
 
                 g_currentHot = this,
                 popup.style.display = "block",
@@ -1771,7 +1771,8 @@ window.initHot = function(model){
         var hots = hotGroup.children.filter(hot=>hot.info.actionType.openHot);
         hots = hots.sort((a,b)=>{return a.order - b.order});
 
-        window.myHotList = hots
+        window.myHotListFu(hots)
+        
 
         hots.forEach((hot)=>{
             var li = document.createElement('li');

scene-离线版/src/views/gui/components/hotList.vue

@@ -1,10 +1,17 @@
 <template>
   <div class="hotList">
-    <div class="title">
-      <div class="titleLL">热点列表</div>
-      <div class="titleRR" @click="$emit('close')">
-        <img src="../../../assets/img/close.png" alt="" />
-      </div>
+    <div class="titleRR" @click="$emit('close')">
+      <img src="../../../assets/img/hotOpen.png" alt="" />
+    </div>
+
+    <div class="title" @keyup="keyupFu">
+      <input  @focus="KeyBlank(true)" @blur="KeyBlank(false)" v-model="value" placeholder="请输入关键词..." />
+      <img
+        class="titleSearch"
+        src="../../../assets/img/hotSearch.png"
+        alt=""
+        @click="searchFu"
+      />
     </div>
     <div class="main">
       <div class="txtNone" v-if="data.length === 0">暂无热点</div>
@@ -14,7 +21,7 @@
           @click="openHot(item, index)"
           v-for="(item, index) in data"
           :key="index"
-          >{{ item.info.title ? item.info.title : "热点" }}</span
+          >{{ item.info.title || "热点" }}</span
         >
       </div>
     </div>
@@ -26,8 +33,10 @@ export default {
   components: {},
   data() {
     return {
+      dataAll: [],
       data: [],
       hotInd: null,
+      value: "",
     };
   },
   computed: {},
@@ -41,9 +50,27 @@ export default {
         this.hotInd = index;
       }, 200);
     },
+    searchFu() {
+      if (this.value)
+        this.data = this.dataAll.filter((v) =>
+          v.info.title.includes(this.value)
+        );
+      else this.data = [...this.dataAll];
+    },
+    keyupFu(e){
+      if(e.key==='Enter') this.searchFu()
+      
+    },
+    KeyBlank(flag){      
+      window.myKeyBlank=flag
+    }
+
   },
   created() {
-    this.data = window.myHotList || [];
+    window.myHotListFu = (data) => {
+      this.dataAll = [...data];
+      this.data = [...data];
+    };
   },
   mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前
@@ -55,68 +82,104 @@ export default {
   activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
 };
 </script>
-<style lang='less' scoped>
+<style lang="less" scoped>
 .hotList {
-  position: absolute;
-  width: 940px;
-  height: 640px;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  background-image: url("../../../assets/img/open/bg-list.png");
-  background-size: 100% 100%;
-  padding: 60px 80px;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  right: 0;
+  &::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 15px;
+    z-index: 1;
+    width: 1px;
+    height: 100%;
+    background-image: url("../../../assets/img/line.png");
+  }
+  .titleRR {
+    position: absolute;
+    z-index: 2;
+    top: 50%;
+
+    left: -25px;
+    cursor: pointer;
+    img {
+      width: 50px;
+    }
+  }
   .title {
-    height: 60px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    .titleLL {
-      font-size: 24px;
-      color: #d6b970;
+    position: relative;
+    height: 40px;
+    input {
+      height: 40px;
+      width: 100%;
+      color: #fff;
+      background-color: transparent;
+      border: none;
+      border-bottom: 1px solid rgba(255, 255, 255, 0.4);
     }
-    .titleRR {
+    input::-webkit-input-placeholder {
+      /* WebKit browsers */
+      color: rgba(255, 255, 255, 0.4) !important;
+    }
+
+    input:-moz-placeholder {
+      /* Mozilla Firefox 4 to 18 */
+      color: rgba(255, 255, 255, 0.4) !important;
+    }
+
+    input::-moz-placeholder {
+      /* Mozilla Firefox 19+ */
+      color: rgba(255, 255, 255, 0.4) !important;
+    }
+
+    input:-ms-input-placeholder {
+      /* Internet Explorer 10+ */
+      color: rgba(255, 255, 255, 0.4) !important;
+    }
+    .titleSearch {
       cursor: pointer;
+      position: absolute;
+      right: 0;
+      top: 5px;
+      height: 30px;
     }
   }
   .main {
-    margin-top: 20px;
-    width: calc(100% - 14px);
-    height: calc(100% - 100px);
+    margin-top: 40px;
+    width: 100%;
+    height: calc(100% - 80px);
     overflow-y: auto;
     .txtNone {
       height: 100%;
-      color: #d6b970;
-      font-size: 20px;
+      color: #fff;
+      font-size: 18px;
       display: flex;
       align-items: center;
       justify-content: center;
     }
     .txt {
       width: calc(100% - 10px);
-      color: #fff;
+      color: rgba(255, 255, 255, 0.6);
       font-size: 16px;
       & > span {
-        border-top: 1px solid #f0e2c0;
         padding: 15px 0;
         cursor: pointer;
         display: block;
         width: 100%;
-        &:last-child {
-          margin-bottom: 60px;
-          border-bottom: 1px solid #f0e2c0;
-        }
+
         &:hover {
-          color: #FFE794;
+          color: #ffe794;
         }
       }
-      .active {
-        color: #d6b970;
-      }
+      // .active {
+      //   color: #ffe794;;
+      // }
     }
     &::-webkit-scrollbar-thumb {
       outline: 2px solid #d6b970;
-     
     }
     &::-webkit-scrollbar {
       width: 2px;
@@ -127,32 +190,30 @@ export default {
   .hotList {
     max-width: 500px;
     width: 94%;
-    height: 90%;
+    height: 100%;
     padding: 30px 10px 30px 30px;
-    .title {
-      .titleLL {
-        font-size: 18px;
-      }
-      .titleRR {
-        position: absolute;
-        right: -5px;
-        top: 5px;
-      }
-    }
+
     .main {
       margin-top: 10px;
       .txt {
         font-size: 14px;
         & > span {
           &:hover {
-            color: #fff;
+           color: rgba(255, 255, 255, 0.6);
           }
         }
-        .active {
-          color: #d6b970 !important;
-        }
+      
+      }
+    }
+    .titleRR {
+      top: auto;
+      left: 50%;
+      transform: translateX(-50%) rotate(-90deg);
+      bottom: 12px;
+      img {
+        width: 36px;
       }
     }
   }
 }
-</style>
+</style>

scene-离线版/src/views/gui/menu.vue

@@ -1,28 +1,55 @@
 <template>
   <div class="pinBottom-container" @touchstart.stop @keydown.stop>
-    <img style="width: 20px; height: 20px; position: fixed; top: 5%; left: 3%;" v-show="isShowBack" @click="back()"
-      src="@/assets/images/back.png" alt="">
+    <img
+      style="width: 20px; height: 20px; position: fixed; top: 5%; left: 3%"
+      v-show="isShowBack"
+      @click="back()"
+      src="@/assets/images/back.png"
+      alt=""
+    />
     <div class="pinBottom center">
       <div id="view-controllers"></div>
     </div>
     <!-- <img @click="toHomeFu()" class="back-icon" src="@/assets/images/icon/back-icon.png" alt=""> -->
     <div class="pinBottom left">
       <div>
-        <div class="viewContainer" :class="{ 'isIOS': isIOS && isGuideOpen && isMobile }"
-          :style="{ marginLeft: isMobile && isGuideOpen ? '20px' : '' }">
-          <div id="previous" class="previous desktop-only ui-icon" style="display: none">
+        <div
+          class="viewContainer"
+          :class="{ isIOS: isIOS && isGuideOpen && isMobile }"
+          :style="{ marginLeft: isMobile && isGuideOpen ? '20px' : '' }"
+        >
+          <div
+            id="previous"
+            class="previous desktop-only ui-icon"
+            style="display: none"
+          >
             <a>
-              <img rel="tooltip" title="" :src="require('@/assets/images/play.png')" width="24" height="24"
-                data-original-title="播放" />
+              <img
+                rel="tooltip"
+                title=""
+                :src="require('@/assets/images/play.png')"
+                width="24"
+                height="24"
+                data-original-title="播放"
+              />
             </a>
           </div>
-          <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放">
+          <div
+            id="play"
+            class="ui-icon"
+            rel="tooltip"
+            data-original-title="播放"
+          >
             <!-- 鼠标移入的显示 -->
             <!-- <div class="hoverTit">自动导览</div> -->
 
             <a>
-              <img :class="{ 'isGuideIcon': isGuideOpen }" :src="require('@/assets/images/icon/play.png')" width="24"
-                height="24" />
+              <img
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/play.png')"
+                width="24"
+                height="24"
+              />
             </a>
           </div>
           <div id="pause" class="ui-icon" style="display: none">
@@ -33,77 +60,163 @@
               <img src="@/assets/images/icon/guide-line3.png" alt="">
             </div> -->
             <a>
-              <img :class="{ 'isGuideIcon': isGuideOpen }" rel="tooltip" title=""
-                :src="require('@/assets/images/icon/pause.png')" width="24" height="24" data-original-title="暂停" />
+              <img
+                :class="{ isGuideIcon: isGuideOpen }"
+                rel="tooltip"
+                title=""
+                :src="require('@/assets/images/icon/pause.png')"
+                width="24"
+                height="24"
+                data-original-title="暂停"
+              />
             </a>
           </div>
-          <div id="next" class="next desktop-only ui-icon wide" style="display: none">
+          <div
+            id="next"
+            class="next desktop-only ui-icon wide"
+            style="display: none"
+          >
             <a>
-              <i rel="tooltip" title="" class="icon icon-dpad-right" data-original-title="下一个"></i>
+              <i
+                rel="tooltip"
+                title=""
+                class="icon icon-dpad-right"
+                data-original-title="下一个"
+              ></i>
             </a>
           </div>
           <div id="gui-modes-map" class="ui-icon double active">
-            <div data-original-title="导览" @click="isGuide = !isGuide" id="pullTab" rel="tooltip" title="场景导览">
+            <div
+              data-original-title="导览"
+              @click="isGuide = !isGuide"
+              id="pullTab"
+              rel="tooltip"
+              title="场景导览"
+            >
               <!-- 鼠标移入的显示 -->
               <!-- <div class="hoverTit">导览列表</div> -->
 
-              <img title="" :class="{ 'isGuideIcon': isGuideOpen }" class="icon icon-inside" :src="require(`@/assets/images/icon/auto${!isGuide ? '_active' : ''
-                }.png`)
-                " />
+              <img
+                title=""
+                :class="{ isGuideIcon: isGuideOpen }"
+                class="icon icon-inside"
+                :src="
+                  require(`@/assets/images/icon/auto${
+                    !isGuide ? '_active' : ''
+                  }.png`)
+                "
+              />
             </div>
 
-            <div data-original-title="全景漫游" id="gui-modes-inside" rel="tooltip">
+            <div
+              data-original-title="全景漫游"
+              id="gui-modes-inside"
+              rel="tooltip"
+            >
               <!-- 鼠标移入的显示 -->
               <!-- <div class="hoverTit">全景漫游</div> -->
               <div class="hoverTit" v-if="isGuideOpen && guideStep == 2">
                 <div>点击地面坐标，</div>
                 <div>自主漫游</div>
-                <img src="@/assets/images/icon/guide-line1.png" alt="">
+                <img src="@/assets/images/icon/guide-line1.png" alt="" />
               </div>
 
-              <img class="icon icon-inside" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/inside.png')" />
-              <img class="icon icon-inside active" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/inside_active.png')" />
+              <img
+                class="icon icon-inside"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/inside.png')"
+              />
+              <img
+                class="icon icon-inside active"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/inside_active.png')"
+              />
             </div>
-            <div v-if="!isNoView3D" title="迷你漫游" data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip">
+            <div
+              v-if="!isNoView3D"
+              title="迷你漫游"
+              data-original-title="迷你模型"
+              id="gui-modes-dollhouse"
+              rel="tooltip"
+            >
               <!-- 鼠标移入的显示 -->
               <!-- <div class="hoverTit">三维视觉</div> -->
 
               <div class="hoverTit" v-if="isGuideOpen && guideStep == 2">
                 <div>查看平面地图</div>
-                <img src="@/assets/images/icon/guide-line2.png" alt="">
+                <img src="@/assets/images/icon/guide-line2.png" alt="" />
               </div>
 
-              <img class="icon icon-inside" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/dollhouse.png')" />
-              <img class="icon icon-inside active" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/dollhouse_active.png')" />
+              <img
+                class="icon icon-inside"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/dollhouse.png')"
+              />
+              <img
+                class="icon icon-inside active"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/dollhouse_active.png')"
+              />
             </div>
-            <div v-if="!isNoView3D" data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="顶部俯视">
+            <div
+              v-if="!isNoView3D"
+              data-original-title="俯视图"
+              id="gui-modes-floorplan"
+              rel="tooltip"
+              title="顶部俯视"
+            >
               <div class="hoverTit" v-if="isGuideOpen && guideStep == 2">
                 <div>查看三维模型</div>
-                <img src="@/assets/images/icon/guide-line3.png" alt="">
+                <img src="@/assets/images/icon/guide-line3.png" alt="" />
               </div>
 
-              <img class="icon icon-inside" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/floor.png')" />
-              <img class="active icon icon-inside active" :class="{ 'isGuideIcon': isGuideOpen }"
-                :src="require('@/assets/images/icon/floor_active.png')" />
+              <img
+                class="icon icon-inside"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/floor.png')"
+              />
+              <img
+                class="active icon icon-inside active"
+                :class="{ isGuideIcon: isGuideOpen }"
+                :src="require('@/assets/images/icon/floor_active.png')"
+              />
             </div>
 
             <!-- 热点列表 -->
-            <!-- <div id="myHotList" @click="openInd = 1">
-              <div class="hoverTit">热点列表</div>
-              <img src="../../assets/img/hot.png" alt="" />
-            </div> -->
+            <div id="myHotList" @click="openInd = openInd ? 0 : 1">
+              <img
+                :src="
+                  require(`../../assets/img/hot${
+                    openInd === 1 ? 'Ac' : ''
+                  }.png`)
+                "
+                alt=""
+              />
+            </div>
 
-            <div data-original-title="VR" id="vr" rel="tooltip" title="" v-if="isVR && isMobile">
-              <img class="icon icon-inside" :src="require('../../assets/img/openVR.png')" />
+            <div
+              data-original-title="VR"
+              id="vr"
+              rel="tooltip"
+              title=""
+              v-if="isVR && isMobile"
+            >
+              <img
+                class="icon icon-inside"
+                :src="require('../../assets/img/openVR.png')"
+              />
             </div>
-            <div data-original-title="消除外壳" id="gui-remove-face" rel="tooltip" title=""
-              style="display: none; float: left">
-              <img class="icon icon-inside" :src="require('@/assets/images/face.jpg')" />
+            <div
+              data-original-title="消除外壳"
+              id="gui-remove-face"
+              rel="tooltip"
+              title=""
+              style="display: none; float: left"
+            >
+              <img
+                class="icon icon-inside"
+                :src="require('@/assets/images/face.jpg')"
+              />
             </div>
           </div>
         </div>
@@ -131,21 +244,21 @@
 
       <div class="stepBox1" v-if="guideStep === 1">
         <div class="box-item">
-          <img src="@/assets/img/img_click.png" alt="">
+          <img src="@/assets/img/img_click.png" alt="" />
           <div class="tips">
             <div class="title">行走</div>
             <div>点击任意方向可移动</div>
           </div>
         </div>
         <div class="box-item">
-          <img src="@/assets/img/img_scale.png" alt="">
+          <img src="@/assets/img/img_scale.png" alt="" />
           <div class="tips">
             <div class="title">旋转视角</div>
             <div>左右滑动屏幕</div>
           </div>
         </div>
         <div class="box-item">
-          <img src="@/assets/img/img_rotate.png" alt="">
+          <img src="@/assets/img/img_rotate.png" alt="" />
           <div class="tips">
             <div class="title">缩放</div>
             <div>双支滑动放大或缩小视图</div>
@@ -153,16 +266,19 @@
         </div>
       </div>
 
-      <div class="begin-btn" :class="{ 'nextStep': guideStep === 1 }"
-        @click="guideStep == 1 ? guideStep = 2 : isGuideOpen = false">
-        {{ guideStep === 1 ? '下一步' : '我知道了' }}
+      <div
+        class="begin-btn"
+        :class="{ nextStep: guideStep === 1 }"
+        @click="guideStep == 1 ? (guideStep = 2) : (isGuideOpen = false)"
+      >
+        {{ guideStep === 1 ? "下一步" : "我知道了" }}
       </div>
     </div>
 
     <div class="pinBottom right hideTarget">
       <div class="rightViewContainer clearfix">
         <div class="gui-floor">
-          <div class="gui-floor-title" style="opacity: 0;"></div>
+          <div class="gui-floor-title" style="opacity: 0"></div>
           <div class="gui-floor-icon">
             <span class="gui-floor-number"></span>
           </div>
@@ -204,23 +320,40 @@
 
           <div class="hoverTit" v-if="isGuideOpen && guideStep == 2">
             <div>音乐控制</div>
-            <img src="@/assets/images/icon/guide-line2.png" alt="">
+            <img src="@/assets/images/icon/guide-line2.png" alt="" />
           </div>
           <div>
-            <img :class="{ 'isGuideIcon': isGuideOpen }" id="openMusic" style="display: block" @click="switchBGM(true)"
-              src="../../assets/img/musicAc.png" alt="" />
-            <img id="closeMusic" style="display: none" @click="switchBGM(false)" src="../../assets/img/music.png"
-              alt="" />
+            <img
+              :class="{ isGuideIcon: isGuideOpen }"
+              id="openMusic"
+              style="display: block"
+              @click="switchBGM(true)"
+              src="../../assets/img/musicAc.png"
+              alt=""
+            />
+            <img
+              id="closeMusic"
+              style="display: none"
+              @click="switchBGM(false)"
+              src="../../assets/img/music.png"
+              alt=""
+            />
           </div>
         </div>
         <!-- 分享 -->
         <div class="toHomeBox" @click="share">
-          <div class="hoverTit guildPortrait" v-if="isGuideOpen && guideStep == 2">
+          <div
+            class="hoverTit guildPortrait"
+            v-if="isGuideOpen && guideStep == 2"
+          >
             <!-- :style="{ transform: `translateX(${isMobile ? '7px' : '-18%'})` }" -->
             <div>分享链接</div>
-            <img src="@/assets/images/icon/guide-line3.png" alt="">
+            <img src="@/assets/images/icon/guide-line3.png" alt="" />
           </div>
-          <img :class="{ 'isGuideIcon': isGuideOpen }" src="../../assets/img/share.png" />
+          <img
+            :class="{ isGuideIcon: isGuideOpen }"
+            src="../../assets/img/share.png"
+          />
         </div>
 
         <!-- 全屏 -->
@@ -234,9 +367,8 @@
 
     <div class="openBox" :class="{ openBoxAc: openInd }">
       <HotList v-show="openInd === 1" @close="openInd = 0" />
-      <Share v-show="openInd === 2" @close="openInd = 0" :openInd="openInd" />
     </div>
-
+    <!-- <Share v-show="openInd === 2" @close="openInd = 0" :openInd="openInd" /> -->
   </div>
 </template>
 
@@ -260,106 +392,107 @@ export default {
       isVR: false,
       // 不显示平面地图和三维模型
       // noViewList: ['TEST', 'KJ-NDyJKVNPO3j', 'KJ-YDu2r2dJkfK'],\
-      noViewList: ['wxcs_KJ-1IATd6Z14lP',
-        'wxcs_KJ-Rah5tRGGjBv',
-        'wxcs_KJ-LHvQ48wObiW',
-        'wxcs_KJ-An7bcHxMuZo',
-        'wxcs_KJ-uZurNAdafbY',
-        'wxcs_KJ-vXD4Lj6Knrj',
-        'wxcs_KJ-YBFNavBDEbx',
-        'wxcs_KJ-bjbq0fzOgi8',
-        'wxcs_KJ-bUaobLJnHLB',
-        'wxcs_KJ-FYQxjFwjs62',
-        'wxcs_KJ-nwCHnK3xmVA',
-        'wxcs_KJ-UKRIWLCWmbJ',
-        'wxcs_KJ-JEq06S7C31J',
-        'wxcs_KJ-OczYpmfRK94',
-        'wxcs_KJ-fDwMlkfk4UX',
-        'wxcs_KJ-9bKgJcIsMp5',
-        'wxcs_KJ-hYHaS4HwonK',
-        'wxcs_KJ-bpD5c7dSXek',
-        'wxcs_KJ-nBibTy1Tqme',
-        'wxcs_KJ-m6uwpHgyA6w',
-        'wxcs_KJ-Ns8Bn1vXI62',
-        'wxcs_KJ-jrX96dFi92M',
-        'wxcs_KJ-FuYnmbPn3ln',
-        'wxcs_KJ-40VskS0cukq',
-        'wxcs_KJ-YWRuXRPHYID',
-        'wxcs_KJ-JKU4OsPJylP',
-        'wxcs_KJ-6BNX8rl9j9J',
-        'wxcs_KJ-XcvoI3XWjzq',
-        'wxcs_KJ-FouPJyWiUI3',
-        'wxcs_KJ-zYhSd6N3Quc',
-        'wxcs_KJ-9fzJbMJ9HpI',
-        'wxcs_KJ-6Mt266QDrsS',
-        'wxcs_KJ-7NS4c6U8ZEO',
-        'wxcs_KJ-xIJTS5zJm9U',
-        'wxcs_KJ-bv1afmPfEnE',
-        'wxcs_KJ-nsS0NcVJiQm',
-        'wxcs_KJ-au14e3FyUmg',
-        'wxcs_KJ-oNccbQG3LB1',
-        'wxcs_KJ-Pl7dvxgtdrU',
-        'wxcs_KJ-AZBNgWmUGQR',
-        'wxcs_KJ-t2CTRQQTG31',
-        'wxcs_KJ-RU4XJ9Rd4wP',
-        'wxcs_KJ-W6uL1BfuAu5',
-        'wxcs_KJ-UfIVj5bX0pL',
-        'wxcs_KJ-OqWFX97vD8R',
-        'wxcs_KJ-rzYtOvdexf7',
-        'wxcs_KJ-fWsvD44G3Ua',
-        'wxcs_KJ-7sFMcyhV66n',
-        'wxcs_KJ-nYSFBmQrsnY',
-        'wxcs_KJ-mQ1n7f8sqSj',
-        'wxcs_KJ-smbDrA2vl5k',
-        'wxcs_KJ-1XH9jOizT3x',
-        'wxcs_KJ-Esm1srzLbIC',
-        'wxcs_KJ-gmAOcUTA9PF',
-        'wxcs_KJ-7sFMcyhV66n',
-        'wxcs_KJ-ZRxsWmFGggB',
-        'wxcs_KJ-MMxypimgsGd',
-        'wxcs_KJ-zcCPGg3uasr',
-        'wxcs_KJ-tMNTUbOKTir',
-        'wxcs_KJ-nBZrQqWDl1f',
-        'wxcs_KJ-jH5A025iNF8',
-        'wxcs_KJ-U8LeyMx3RgX',
-        'wxcs_KJ-X7nszXALyE5',
-        'wxcs_KJ-b6FTSbV6FGB',
-        'wxcs_KJ-Nsammr3ypfZ',
-        'wxcs_KJ-pa1StMOOteR',
-        'wxcs_KJ-bPaVypiRu1A',
-        'wxcs_KJ-g0aJAaCSISM',
-        'wxcs_KJ-4opI0IVeXwU',
-        'wxcs_KJ-prHRWZV9Efm',
-        'wxcs_KJ-gELQnvN3FZD',
-        'wxcs_KJ-OBwjUqpBrbm',
-        'wxcs_KJ-d4Dwy5a49eD',
-        'wxcs_KJ-OA9Y4ikirs0',
-        'wxcs_KJ-waBDYGUMUX1',
-        'wxcs_KJ-PYC3vStPL62',
-        'wxcs_KJ-YcfNCgCGx98',
-        'wxcs_KJ-UXACA0qMNxv',
-        'wxcs_KJ-HCZYYg1Qnr4',
-        'wxcs_KJ-uccOVElEG8F',
-        'wxcs_KJ-4k8ehu8m1Uj',
-        'wxcs_KJ-rQqSHe29IiE',
-        'wxcs_KJ-Puca8hi4uqh',
-        'wxcs_KJ-vYAcuz8eQ5Y',
-        'wxcs_KJ-R0JbiGqjfqk',
-        'wxcs_KJ-jAaBysEJYs0',
-        'wxcs_KJ-hFUHefKn8bo',
-        'wxcs_KJ-3lUATyheh1O',
-        'wxcs_KJ-DABJzxWObR6',
-        'wxcs_KJ-S7Pj3Res4eK',
-        'wxcs_KJ-tALo6eEfD1v',
-        'wxcs_KJ-q54NDKwElrM',
-        'wxcs_KJ-uWKz6H6FdZl',
-        'wxcs_KJ-Xowj4YZVFZ0',
-        'wxcs_KJ-zCrlZp7vU87',
-        'wxcs_KJ-JDBtKslAXV9',
-        'wxcs_KJ-270ZticXPSa',
-        'wxcs_KJ-eIs3GyKzQUG',
-        'wxcs_KJ-BcLrU8oFkyc',
-        'wxcs_KJ-mkSsKMv1wsc'
+      noViewList: [
+        "wxcs_KJ-1IATd6Z14lP",
+        "wxcs_KJ-Rah5tRGGjBv",
+        "wxcs_KJ-LHvQ48wObiW",
+        "wxcs_KJ-An7bcHxMuZo",
+        "wxcs_KJ-uZurNAdafbY",
+        "wxcs_KJ-vXD4Lj6Knrj",
+        "wxcs_KJ-YBFNavBDEbx",
+        "wxcs_KJ-bjbq0fzOgi8",
+        "wxcs_KJ-bUaobLJnHLB",
+        "wxcs_KJ-FYQxjFwjs62",
+        "wxcs_KJ-nwCHnK3xmVA",
+        "wxcs_KJ-UKRIWLCWmbJ",
+        "wxcs_KJ-JEq06S7C31J",
+        "wxcs_KJ-OczYpmfRK94",
+        "wxcs_KJ-fDwMlkfk4UX",
+        "wxcs_KJ-9bKgJcIsMp5",
+        "wxcs_KJ-hYHaS4HwonK",
+        "wxcs_KJ-bpD5c7dSXek",
+        "wxcs_KJ-nBibTy1Tqme",
+        "wxcs_KJ-m6uwpHgyA6w",
+        "wxcs_KJ-Ns8Bn1vXI62",
+        "wxcs_KJ-jrX96dFi92M",
+        "wxcs_KJ-FuYnmbPn3ln",
+        "wxcs_KJ-40VskS0cukq",
+        "wxcs_KJ-YWRuXRPHYID",
+        "wxcs_KJ-JKU4OsPJylP",
+        "wxcs_KJ-6BNX8rl9j9J",
+        "wxcs_KJ-XcvoI3XWjzq",
+        "wxcs_KJ-FouPJyWiUI3",
+        "wxcs_KJ-zYhSd6N3Quc",
+        "wxcs_KJ-9fzJbMJ9HpI",
+        "wxcs_KJ-6Mt266QDrsS",
+        "wxcs_KJ-7NS4c6U8ZEO",
+        "wxcs_KJ-xIJTS5zJm9U",
+        "wxcs_KJ-bv1afmPfEnE",
+        "wxcs_KJ-nsS0NcVJiQm",
+        "wxcs_KJ-au14e3FyUmg",
+        "wxcs_KJ-oNccbQG3LB1",
+        "wxcs_KJ-Pl7dvxgtdrU",
+        "wxcs_KJ-AZBNgWmUGQR",
+        "wxcs_KJ-t2CTRQQTG31",
+        "wxcs_KJ-RU4XJ9Rd4wP",
+        "wxcs_KJ-W6uL1BfuAu5",
+        "wxcs_KJ-UfIVj5bX0pL",
+        "wxcs_KJ-OqWFX97vD8R",
+        "wxcs_KJ-rzYtOvdexf7",
+        "wxcs_KJ-fWsvD44G3Ua",
+        "wxcs_KJ-7sFMcyhV66n",
+        "wxcs_KJ-nYSFBmQrsnY",
+        "wxcs_KJ-mQ1n7f8sqSj",
+        "wxcs_KJ-smbDrA2vl5k",
+        "wxcs_KJ-1XH9jOizT3x",
+        "wxcs_KJ-Esm1srzLbIC",
+        "wxcs_KJ-gmAOcUTA9PF",
+        "wxcs_KJ-7sFMcyhV66n",
+        "wxcs_KJ-ZRxsWmFGggB",
+        "wxcs_KJ-MMxypimgsGd",
+        "wxcs_KJ-zcCPGg3uasr",
+        "wxcs_KJ-tMNTUbOKTir",
+        "wxcs_KJ-nBZrQqWDl1f",
+        "wxcs_KJ-jH5A025iNF8",
+        "wxcs_KJ-U8LeyMx3RgX",
+        "wxcs_KJ-X7nszXALyE5",
+        "wxcs_KJ-b6FTSbV6FGB",
+        "wxcs_KJ-Nsammr3ypfZ",
+        "wxcs_KJ-pa1StMOOteR",
+        "wxcs_KJ-bPaVypiRu1A",
+        "wxcs_KJ-g0aJAaCSISM",
+        "wxcs_KJ-4opI0IVeXwU",
+        "wxcs_KJ-prHRWZV9Efm",
+        "wxcs_KJ-gELQnvN3FZD",
+        "wxcs_KJ-OBwjUqpBrbm",
+        "wxcs_KJ-d4Dwy5a49eD",
+        "wxcs_KJ-OA9Y4ikirs0",
+        "wxcs_KJ-waBDYGUMUX1",
+        "wxcs_KJ-PYC3vStPL62",
+        "wxcs_KJ-YcfNCgCGx98",
+        "wxcs_KJ-UXACA0qMNxv",
+        "wxcs_KJ-HCZYYg1Qnr4",
+        "wxcs_KJ-uccOVElEG8F",
+        "wxcs_KJ-4k8ehu8m1Uj",
+        "wxcs_KJ-rQqSHe29IiE",
+        "wxcs_KJ-Puca8hi4uqh",
+        "wxcs_KJ-vYAcuz8eQ5Y",
+        "wxcs_KJ-R0JbiGqjfqk",
+        "wxcs_KJ-jAaBysEJYs0",
+        "wxcs_KJ-hFUHefKn8bo",
+        "wxcs_KJ-3lUATyheh1O",
+        "wxcs_KJ-DABJzxWObR6",
+        "wxcs_KJ-S7Pj3Res4eK",
+        "wxcs_KJ-tALo6eEfD1v",
+        "wxcs_KJ-q54NDKwElrM",
+        "wxcs_KJ-uWKz6H6FdZl",
+        "wxcs_KJ-Xowj4YZVFZ0",
+        "wxcs_KJ-zCrlZp7vU87",
+        "wxcs_KJ-JDBtKslAXV9",
+        "wxcs_KJ-270ZticXPSa",
+        "wxcs_KJ-eIs3GyKzQUG",
+        "wxcs_KJ-BcLrU8oFkyc",
+        "wxcs_KJ-mkSsKMv1wsc",
       ],
       isNoView3D: false,
       guideStep: null,
@@ -377,39 +510,42 @@ export default {
     }, 100);
 
     setTimeout(() => {
-      console.log('是否显示回退按钮', window.location.href.includes('showBack=1'), this.isShowBack)
-      if (window.location.href.includes('showBack=1')) {
-        this.isShowBack = true
+      console.log(
+        "是否显示回退按钮",
+        window.location.href.includes("showBack=1"),
+        this.isShowBack
+      );
+      if (window.location.href.includes("showBack=1")) {
+        this.isShowBack = true;
       }
-    }, 300)
-
-    if (localStorage.getItem('isGuided') == 'true') {
-      this.isGuideOpen = false
-      this.guideStep = null
+    }, 300);
 
+    if (localStorage.getItem("isGuided") == "true") {
+      this.isGuideOpen = false;
+      this.guideStep = null;
     } else {
-      this.isGuideOpen = true
-      this.guideStep = 1
-      localStorage.setItem('isGuided', 'true')
+      this.isGuideOpen = true;
+      this.guideStep = 1;
+      localStorage.setItem("isGuided", "true");
     }
 
     // 判断是否是ios
-    this.isIOS = this.isIOSFu()
-    this.getUrlParams()
+    this.isIOS = this.isIOSFu();
+    this.getUrlParams();
   },
   methods: {
     getUrlParams() {
       const url = window.location.href;
-      const urlParams = new URLSearchParams(url.split('?')[1]);
+      const urlParams = new URLSearchParams(url.split("?")[1]);
       const paramsObject = {};
       for (const [key, value] of urlParams.entries()) {
         paramsObject[key] = value;
       }
 
-        // console.log('参数',paramsObject['m'].replace('#/',''))
+      // console.log('参数',paramsObject['m'].replace('#/',''))
 
-      if (this.noViewList.includes(paramsObject['m'].replace('#/',''))) {
-        this.isNoView3D = true
+      if (this.noViewList.includes(paramsObject["m"].replace("#/", ""))) {
+        this.isNoView3D = true;
       }
       // if (this.noViewList.includes(paramsObject['m'])) {
       //   this.isNoView3D = true
@@ -420,7 +556,7 @@ export default {
       return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
     },
     navigateBackFromWechatMiniProgram() {
-      if (typeof wx !== 'undefined' && typeof wx.miniProgram != undefined) {
+      if (typeof wx !== "undefined" && typeof wx.miniProgram != undefined) {
         wx.miniProgram.navigateBack({
           delta: 1, // 返回上一级页面，delta默认为1，表示返回上一页
         });
@@ -441,7 +577,6 @@ export default {
       if (document.execCommand("copy")) {
         document.execCommand("copy");
         alert("链接已复制");
-
       }
       document.body.removeChild(input);
     },
@@ -493,13 +628,11 @@ export default {
       // this.switchBGM(false);
       // this.$emit("toHome");
       if (window.parent) {
-        window.parent.window.toHome()
+        window.parent.window.toHome();
       }
     },
   },
-  created() {
-
-  }
+  created() {},
 };
 </script>
 
@@ -517,8 +650,6 @@ export default {
   outline: none;
 }
 
-
-
 @media screen and (orientation: portrait) {
   .guildPortrait {
     // flex-direction: row !important;
@@ -584,7 +715,7 @@ export default {
   font-size: 18px;
   white-space: nowrap;
   z-index: 70;
-  color: #FFE794;
+  color: #ffe794;
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -592,7 +723,6 @@ export default {
 
   // z-index: 999999999999999999;
 
-
   div {
     text-align: center;
     // transform: translateX(-17%);
@@ -604,7 +734,6 @@ export default {
   }
 
   flex-direction: column;
-
 }
 
 .isGuideIcon {
@@ -632,7 +761,6 @@ export default {
     //  height: 130px;
     margin: 10px auto;
   }
-
 }
 
 // #play:hover {
@@ -666,7 +794,6 @@ export default {
   //   width: 70px;
   // }
 
-
   // &:hover {
   //   .hoverTit {
   //     opacity: 1;
@@ -694,10 +821,10 @@ export default {
 }
 
 #gui-modes-map {
-  >div {
+  > div {
     margin-right: @margin;
 
-    >img {
+    > img {
       width: @wh;
       height: @wh;
       display: block !important;
@@ -709,7 +836,7 @@ export default {
   }
 
   .active {
-    >img {
+    > img {
       display: none !important;
     }
 
@@ -746,7 +873,7 @@ export default {
   background: none !important;
 
   // margin-right: 20px!important;
-  >div {
+  > div {
     width: 100%;
     cursor: pointer;
 
@@ -771,8 +898,6 @@ export default {
   //     opacity: 1;
   //   }
   // }
-
-
 }
 
 .guildPortrait {
@@ -797,16 +922,18 @@ export default {
     position: fixed;
     z-index: 9999;
     top: 0;
-    left: 0;
-    width: 100%;
+    right: -500px;
+    width: 450px;
     height: 100%;
-    // background-color: rgba(255, 255, 255, 0.6);
-    backdrop-filter: blur(10px);
+    background-color: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(8px);
+    padding: 50px 40px;
   }
 
   .openBoxAc {
     opacity: 1;
     pointer-events: auto;
+    right: 0;
   }
 
   .black-bg {
@@ -823,7 +950,7 @@ export default {
     left: 0;
     background: rgba(0, 0, 0, 0.7);
     z-index: 49;
-    color: #FFE794;
+    color: #ffe794;
 
     .guide-item {
       position: absolute;
@@ -843,7 +970,6 @@ export default {
     }
 
     .roam {
-
       // left: -20px;
       img {
         transform: translateX(85%);
@@ -855,7 +981,7 @@ export default {
     }
 
     .module {
-      left: 155px
+      left: 155px;
     }
 
     .share {
@@ -870,7 +996,7 @@ export default {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      color: #FFE794;
+      color: #ffe794;
 
       .box-item {
         display: flex;
@@ -892,9 +1018,7 @@ export default {
             font-weight: bold;
           }
         }
-
       }
-
     }
 
     .begin-btn {
@@ -913,7 +1037,6 @@ export default {
       letter-spacing: 5px;
       cursor: pointer;
     }
-
   }
 }
 
@@ -937,13 +1060,12 @@ export default {
       width: 25px !important;
       height: auto !important;
     }
-
   }
 
   .viewContainer {
     // margin-left: 20px !important;
 
-    &>div {
+    & > div {
       img {
         width: 48px;
         height: 48px;
@@ -962,8 +1084,6 @@ export default {
       top: 200px;
       right: 10px;
 
-
-
       .rightViewContainer {
         flex-direction: column;
 
@@ -974,22 +1094,21 @@ export default {
           .container {
             display: none;
             bottom: 0;
-            transform: translate(-70%, 60%)
+            transform: translate(-70%, 60%);
           }
         }
 
-        &>div,
+        & > div,
         #volume {
           width: 60px;
           text-align: right;
           margin-right: 0;
           margin-bottom: 10px;
 
-          &>div {
+          & > div {
             display: flex;
             // justify-content: flex-end;
             justify-content: center;
-
           }
 
           img {
@@ -998,8 +1117,16 @@ export default {
           }
         }
       }
+    }
+    .openBox {
+      top: -600px;
+      right: 0;
+      width: 100%;
+      padding: 0;
+    }
 
-
+    .openBoxAc {
+      top: 0;
     }
   }
 
@@ -1079,8 +1206,6 @@ export default {
 
   // }
 
-
-
   .hideTarget {
     top: auto !important;
   }
@@ -1090,7 +1215,6 @@ export default {
       // color: green;
 
       .guide-item {
-
         font-size: 1em;
 
         img {
@@ -1103,7 +1227,6 @@ export default {
       }
 
       .roam {
-
         // left: -20px;
         img {
           transform: translateX(80%);
@@ -1115,7 +1238,7 @@ export default {
       }
 
       .module {
-        left: 155px
+        left: 155px;
       }
 
       .share {
@@ -1143,7 +1266,6 @@ export default {
               font-size: 1.3em !important;
               white-space: nowrap !important;
             }
-
           }
         }
       }
@@ -1164,7 +1286,6 @@ export default {
         // cursor: pointer;
         padding: 10px 20px;
       }
-
     }
   }
 
@@ -1175,7 +1296,5 @@ export default {
   .isIOS {
     margin-left: 50px !important;
   }
-
-
 }
 </style>