up

web/public/static/css/main.css

@@ -4034,7 +4034,7 @@ a.hasHover:hover, a:active {
     float: left;
     display: flex;
     justify-content: center;
-    background-color: rgba(255, 246, 210, 0.8);
+    background-color: rgba(255, 246, 210, 1);
     position: relative;
 }
 

web/public/static/js/Hot.js

@@ -1621,24 +1621,26 @@ window.initHot = function(model){
     
     
     
-    // Hot.createHotList = function() {
-    //     var docFragment = document.createDocumentFragment();
-    //     var hots = hotGroup.children.filter(hot=>hot.info.actionType.openHot);
-    //     hots = hots.sort((a,b)=>{return a.order - b.order});
-    //     hots.forEach((hot)=>{
-    //         var li = document.createElement('li');
-    //         var span = document.createElement('span');
-    //         span.innerHTML = hot.info.title || '热点';
-    //         // console.log(span.innerHTML);
-    //         li.hot = hot;   // 列表每一项对应一个热点
-    //         li.appendChild(span);
-    //         docFragment.appendChild(li);
+    Hot.createHotList = function() {
+        var docFragment = document.createDocumentFragment();
+        var hots = hotGroup.children.filter(hot=>hot.info.actionType.openHot);
+        hots = hots.sort((a,b)=>{return a.order - b.order});
+        window.myHotList= hots
+        console.log(123,window.myHotList);
+        hots.forEach((hot)=>{
+            var li = document.createElement('li');
+            var span = document.createElement('span');
+            span.innerHTML = hot.info.title || '热点';
+            // console.log(span.innerHTML);
+            li.hot = hot;   // 列表每一项对应一个热点
+            li.appendChild(span);
+            docFragment.appendChild(li);
              
-    //     })  
-    //     var ul = document.querySelector('#hotListContent ul');
-    //     ul && ul.appendChild(docFragment);
+        })  
+        var ul = document.querySelector('#hotListContent ul');
+        ul && ul.appendChild(docFragment);
          
-    // }
+    }
             
 
 }

web/public/static/js/main_2020_show.js

@@ -8884,10 +8884,10 @@ window.Modernizr = function(n, e, t) {
             } */
         }
         function u(e, t) {
+            if(window.myKeyBlank) return
             if (t) {
                 var i = "keydown" === t.type
                   , n = t.which === f.SPACE || C.tourIsPlaying;
-                  
                 i && n || e || (O = !0),
                 C.atEndOfTour() && d(),
                 !C.tourIsPlaying && C.tourInProgress && (_.removeClass("fadeIn"),
@@ -17537,7 +17537,7 @@ window.Modernizr = function(n, e, t) {
                             })
                         } 
                         this.createHotItem( ); 
-                        // Hot.createHotList();
+                        Hot.createHotList();
                         Hot.startLoad()  
                          
                         

web/src/views/gui/compomemt/antique.vue

@@ -191,6 +191,8 @@ export default {
     // 获取服务器前缀地址
     this.baseURL = axios.defaults.baseURL;
     this.goodList(this.formData);
+    // 设置一个全局变量控制空格建的监听
+    window.myKeyBlank =true
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {},
@@ -198,7 +200,9 @@ export default {
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前
   updated() {}, //生命周期 - 更新之后
-  beforeDestroy() {}, //生命周期 - 销毁之前
+  beforeDestroy() {
+    window.myKeyBlank =false
+  }, //生命周期 - 销毁之前
   destroyed() {}, //生命周期 - 销毁完成
   activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
 };

web/src/views/gui/compomemt/hotspot.vue

@@ -1,15 +1,17 @@
 <template>
   <div class="hotspot" :class="{ full: smBtn }">
-    <!-- 毛玻璃 -->
-    <div class="meanPageMBL"></div>
-
+    <div class="top">热点列表</div>
     <div class="main">
-      <h3>热点列表</h3>
-      <div class="code">
-        <img src="@/assets/img/code.png" alt="" />
-        <p>保存二维码，或点击复制链接</p>
+      <div class="txt">
+        <span
+          :class="{ active: hotInd === index }"
+          @click="openHot(item, index)"
+          :title="item.info.title ? item.info.title : '热点'"
+          v-for="(item, index) in data"
+          :key="index"
+          >{{ item.info.title ? item.info.title : "热点" }}</span
+        >
       </div>
-      <div class="btnn" @click="copyPcTxt">复制分享链接</div>
       <!-- 关闭按钮 -->
       <div class="close" @click="$emit('close')"></div>
     </div>
@@ -28,7 +30,10 @@ export default {
   components: {},
   data() {
     //这里存放数据
-    return {};
+    return {
+      data: [],
+      hotInd: null,
+    };
   },
   //监听属性 类似于data概念
   computed: {},
@@ -36,34 +41,15 @@ export default {
   watch: {},
   //方法集合
   methods: {
-    //点击复制链接
-    copyPcTxt() {
-      // 存储传递过来的数据
-      let OrderNumber = "9999999999";
-      // 创建一个input 元素
-      // createElement() 方法通过指定名称创建一个元素
-      let newInput = document.createElement("input");
-      // 讲存储的数据赋值给input的value值
-      newInput.value = OrderNumber;
-      // appendChild() 方法向节点添加最后一个子节点。
-      document.body.appendChild(newInput);
-      // 选中input元素中的文本
-      // select() 方法用于选择该元素中的文本。
-      newInput.select();
-      // 执行浏览器复制命令
-      //  execCommand方法是执行一个对当前文档，当前选择或者给出范围的命令
-      document.execCommand("Copy");
-      // 清空输入框
-      newInput.remove();
-      // 下面是element的弹窗 不需要的自行删除就好
-      this.$message({
-        message: "复制成功",
-        type: "success",
-      });
+    openHot(e, index) {
+      e && e.examine(window.player, true);
+      this.hotInd = index;
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
-  created() {},
+  created() {
+    this.data = window.myHotList;
+  },
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前
@@ -77,84 +63,68 @@ export default {
 </script>
 <style lang='less' scoped>
 .hotspot {
-  transition: width 0.3s;
-  color: #fff6d2;
+  width: 340px;
+  height: 100%;
   position: fixed;
   top: 0;
-  left: 0;
+  right: 0;
+  transition: all 0.3s;
+  transform: translateX(-200px);
   z-index: 998;
-  width: calc(100% - 200px);
-  height: 100%;
-  // m毛玻璃
-  .meanPageMBL {
-    position: absolute;
-    left: 0;
-    top: 0;
+  .top {
     width: 100%;
-    height: 100%;
-    background: rgba(161, 101, 59, 0.8);
-    backdrop-filter: blur(4px);
-    z-index: -1;
+    height: 100px;
+    line-height: 100px;
+    background-color: #cc946d;
+    color: #fff6d2;
+    font-size: 16px;
+    text-align: center;
+    align-items: center;
   }
   .main {
-    border-radius: 10px;
-    padding-top: 50px;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    width: 400px;
-    height: 550px;
-    background-image: linear-gradient(
-      rgba(204, 148, 109, 0.8),
-      rgba(119, 73, 38, 0.8)
-    );
-    & > h3 {
-      font-size: 30px;
-      text-align: center;
-    }
-    .code {
-      padding-top: 15px;
-      background-color: #fff6d2;
-      border-radius: 5px;
-      width: 260px;
-      height: 300px;
-      margin: 30px auto;
-      text-align: center;
-      & > img {
-        width: 240px;
+    width: 100%;
+    height: calc(100% - 100px);
+    background-color: rgba(255, 246, 210, 1);
+    .txt {
+      padding: 20px;
+      height: 90%;
+      overflow-y: auto;
+      color: #7e522f;
+      font-size: 16px;
+      & > span {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        margin-top: 20px;
+        cursor: pointer;
+        display: block;
+        width: 100%;
+        text-align: center;
       }
-      & > p {
-        color: #774926;
-        margin-top: 15px;
-        font-size: 12px;
+      :hover {
+        color: #d4a781;
       }
     }
-    .btnn {
-      cursor: pointer;
-      margin: 0 auto;
-      width: 260px;
-      height: 60px;
-      border-radius: 30px;
-      border: 2px solid #fff6d2;
-      font-size: 20px;
-      color: #fff6d2;
-      text-align: center;
-      line-height: 56px;
+    .active {
+      color: #d4a781;
+      pointer-events: none;
+    }
+    .txt::-webkit-scrollbar-thumb {
+      outline: 2px solid #cc946d;
+    }
+    .txt::-webkit-scrollbar {
+      width: 4px;
     }
     .close {
       cursor: pointer;
-      position: absolute;
-      right: -18px;
-      top: -18px;
-      width: 44px;
-      height: 44px;
-      background: url("../../../assets/img/close.png");
-      background-size: 100% 100%;
+      width: 100%;
+      height: 10%;
+      background: url("../../../assets/img/close.png") no-repeat center center;
+      background-size: 44px 44px;
     }
   }
 }
 .full {
-  width: 100%;
+  transform: translateX(0);
 }
 </style>

web/src/views/gui/guide.vue

@@ -31,7 +31,7 @@ export default {
 </script>
 <style lang="less" scoped>
 #status {
-  background-color: rgba(255, 246, 210, 0.8);
+  background-color: rgba(255, 246, 210, 1);
   color: #774926;
 }
 #progressBar {
@@ -40,7 +40,7 @@ export default {
   height: 100%;
   display: flex;
   align-items: center;
-  background-color: rgba(255, 246, 210, 0.8);
+  background-color: rgba(255, 246, 210, 1);
 }
 #playHead {
   background-color: transparent;

web/src/views/gui/hotspotlist.vue

@@ -11,7 +11,7 @@
           </ul>
       </div>
       <div id="hotListBottom">
-          <img id="hotListClose" src="images/hotListClose.png" alt="">
+          <img id="hotListClose" src="@/assets/img/close.png" alt="">
       </div>
   </div>
 </template>

web/src/views/gui/menu.vue

@@ -152,12 +152,11 @@
                 :src="require('@/assets/images/VR.png')"
               />
             </div>
-            <!-- <div
+            <div
               data-original-title="热点列表"
               id="hotList"
               rel="tooltip"
               title=""
-              style="display: none"
             >
               <img
                 class="icon icon-inside"
@@ -169,7 +168,7 @@
                 :src="require('@/assets/images/hotlist.png')"
                 
               />
-            </div> -->
+            </div>
             <div
               data-original-title="消除外壳"
               id="gui-remove-face"
@@ -320,7 +319,7 @@ export default {
       smBtn: false,
       meanInd: null,
       rightList: [
-        { id: 1, name: "地图导航", img: "navigation" },
+        { id: 1, name: "展厅列表", img: "navigation" },
         { id: 2, name: "精品文物", img: "antique" },
         { id: 3, name: "热点列表", img: "hotspot" },
       ],
@@ -356,6 +355,9 @@ export default {
 </script>
 
 <style lang="less" scoped>
+#hotList{
+  display: none !important;
+}
 ::-webkit-scrollbar {
   width: 5px; /*高宽分别对应横竖滚动条的尺寸*/
 }