修改楼层打开逻辑和本地化端的按钮间距样式

H5场景/public/index.html

@@ -56,6 +56,7 @@
 
     <script src="<%= VUE_APP_STATIC_DIR %>/js/Tween.js"></script>
     <script src="<%= VUE_APP_STATIC_DIR %>/js/manage_new.js" defer></script>
+    <script src="<%= VUE_APP_STATIC_DIR %>/js/flexible.js" defer></script>
     <!-- <script src="<%= VUE_APP_STATIC_DIR %>/js/overlay.js"></script> -->
     <script src="<%= VUE_APP_STATIC_DIR %>/js/Hot_new.js" defer></script>  
     <script src="<%= VUE_APP_STATIC_DIR %>/js/main_2020_show_new.js" defer></script>

H5场景/public/static/css/main.css

@@ -3929,17 +3929,7 @@ a.tag-link {
     align-items: center;
     cursor: pointer;
 }
-@media only screen and (min-width: 1000px) and (max-width: 2000px) {
-    #gui-modes-map>div[rel] {
-        width: 200px;
-    }
-}
 
-@media only screen and (min-width: 2000px) {
-    #gui-modes-map>div[rel] {
-        width: 400px;
-    }
-}
 
 
 /* #gui-modes-map>div[rel]:hover,
@@ -4351,21 +4341,13 @@ a.tag-link {
     cursor: pointer;
 }
 
-@media only screen and (min-width: 1000px) and (max-width: 2000px) {
+@media only screen and (min-width: 1000px) {
     #play,
     #pause {
-        width: 200px;
-        margin-left: 70px;
-        padding-left: 80px;
+      /* width: 200px; */
+      /* margin-left: 5vw; */
     }
-}
-
-@media only screen and (min-width: 2000px){
-    #play,
-    #pause {
-        width: 400px;
-    }
-}
+  }
 
 .tourSpinner {
     border-radius: 45px;
@@ -7754,10 +7736,11 @@ a.hasHover.tag-link:hover {
 
 
 @media screen and (orientation: landscape) {
-
     .viewContainer,
     #gui-modes-map {
-        display: block !important;
+        /* display: block !important; */
+        display: flex;
+        align-items: center;
     }
 
     .viewContainer {

H5场景/public/static/js/Hot_new.js

@@ -1761,6 +1761,7 @@ 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.hotData=true
         // console.log('12399999999999999999', window.myHotList);
         hots.forEach((hot)=>{
             var li = document.createElement('li');

H5场景/public/static/js/flexible.js

@@ -0,0 +1,43 @@
+(function flexible(window, document) {
+  var docEl = document.documentElement;
+  var dpr = window.devicePixelRatio || 1;
+
+  // adjust body font size
+  function setBodyFontSize() {
+    if (document.body) {
+      document.body.style.fontSize = 12 * dpr + "px";
+    } else {
+      document.addEventListener("DOMContentLoaded", setBodyFontSize);
+    }
+  }
+  setBodyFontSize();
+
+  // set 1rem = viewWidth / 10
+  function setRemUnit() {
+    var rem = docEl.clientWidth / 24;
+    docEl.style.fontSize = rem + "px";
+  }
+
+  setRemUnit();
+
+  // reset rem unit on page resize
+  window.addEventListener("resize", setRemUnit);
+  window.addEventListener("pageshow", function (e) {
+    if (e.persisted) {
+      setRemUnit();
+    }
+  });
+
+  // detect 0.5px supports
+  if (dpr >= 2) {
+    var fakeBody = document.createElement("body");
+    var testElement = document.createElement("div");
+    testElement.style.border = ".5px solid transparent";
+    fakeBody.appendChild(testElement);
+    docEl.appendChild(fakeBody);
+    if (testElement.offsetHeight === 1) {
+      docEl.classList.add("hairlines");
+    }
+    docEl.removeChild(fakeBody);
+  }
+})(window, document);

H5场景/src/views/gui/compomemt/floorSelect.vue

@@ -40,7 +40,7 @@ export default {
   watch: {},
   methods: {
     skipUrl(url) {
-      window.location.href = window.location.href.replace(this.urlNum, url);
+      window.location.replace(window.location.href.replace(this.urlNum, url))
       setTimeout(() => {
         location.reload(true);
       }, 200);

H5场景/src/views/gui/menu.vue

@@ -40,7 +40,8 @@
         <div class="viewContainer">
           <div class="viewXian">
             <!-- 线段 -->
-            <img src="../../assets/img/xian.png" alt="" />
+            <img v-if="screenWidth > 1000" src="../../assets/img/xian.png" alt="" />
+            <img v-else src="../../assets/img/xianDian.png" alt="" />
             <!-- 收起按钮 -->
             <div class="viewShowIcon" @click="viewShow = false">
               <img :src="require(`@/assets/img/hide.png`)" />
@@ -52,19 +53,21 @@
               <img rel="tooltip" title="" :src="require('@/assets/images/play.png')" data-original-title="播放" />
             </a>
           </div>
-          <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放">
+          <img class="dianBox" :style="{ marginLeft: '5vw' }" src="../../assets/img/dian.png" alt="">
+          <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放"
+            :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
             <!-- icon文字 -->
-            <div class="iconTxt" :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '' }">{{
-              screenWidth < 1000 ? '自动导览' : '〚自动导览〛' }}</div>
+            <div class="iconTxt">
+              {{
+                screenWidth < 1000 ? '自动导览' : '〚自动导览〛' }}</div>
                 <a>
                   <img :src="require('@/assets/images/icon/play.png')" />
                 </a>
             </div>
-            <div id="pause" class="ui-icon" style="display: none">
+            <div id="pause" class="ui-icon" style="display: none"
+              :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
               <!-- icon文字 -->
-              <div class="iconTxt iconTxtAc"
-                :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '' }">{{ screenWidth < 1000
-                  ? '自动导览' : '〚自动导览〛' }}</div>
+              <div class="iconTxt iconTxtAc" :style="{}">{{ screenWidth < 1000 ? '自动导览' : '〚自动导览〛' }}</div>
                   <a>
                     <img rel="tooltip" title="" :src="require('@/assets/images/icon/pause.png')"
                       data-original-title="暂停" />
@@ -75,22 +78,23 @@
                   <i rel="tooltip" title="" class="icon icon-dpad-right" data-original-title="下一个"></i>
                 </a>
               </div>
+              <img class="dianBox" src="../../assets/img/dian.png" alt="">
               <div id="gui-modes-map" class="ui-icon double active">
                 <div data-original-title="导览" @click="isGuide = !isGuide" id="pullTab" rel="tooltip" title="场景导览"
-                  :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '100px' : '' }">
+                  :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                   <!-- icon文字 -->
-                  <div class="iconTxt" :class="{ iconTxtAc: !isGuide }"
-                    :style="{ marginLeft: screenWidth > 1000 && screenWidth < 2000 ? '50px' : '' }">
+                  <div class="iconTxt" :class="{ iconTxtAc: !isGuide }" :style="{}">
                     {{ screenWidth < 1000 ? '导览列表' : '〚导览列表〛' }} </div>
                       <img title="" class="icon icon-inside" :src="require(`@/assets/images/icon/auto${!isGuide ? '_active' : ''
                         }.png`)
                         " />
                   </div>
+                  <img class="dianBox" src="../../assets/img/dian.png" alt="" >
                   <!-- 热点列表 -->
-                  <div class="hotListBox" @click="meanInd = true"
-                    :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '' : '', paddingLeft: screenWidth > 2000 ? '150px' : '' }">
-                    <div class="iconTxt"
-                      :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '' : '', marginLeft: screenWidth > 2000 ? '75px' : '' }">
+                  <div class="hotListBox" @click="meanInd = true" 
+                    :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
+
+                    <div class="iconTxt" :style="{}">
                       {{ screenWidth < 1000 ? '热点列表' : '〚热点列表〛' }}</div>
                         <div class="hotListSon">
                           <img :src="require(`@/assets/images/icon/${meanInd ? 'hotAc' : 'hot'
@@ -103,35 +107,37 @@
                       <img class="icon icon-inside" :src="require('@/assets/images/icon/inside.png')" />
                       <img class="icon icon-inside active" :src="require('@/assets/images/icon/inside_active.png')" />
                     </div>
+                    <img class="dianBox" src="../../assets/img/dian.png" alt="">
                     <div title="迷你漫游" data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip"
-                      :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', paddingLeft: screenWidth > 2000 ? '300px' : '' }">
+                      :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                       <!-- icon文字 -->
-                      <div class="iconTxt"
-                        :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', marginLeft: screenWidth > 2000 ? '150px' : '' }">
+                      <div class="iconTxt" :style="{}">
                         {{ screenWidth < 1000 ? '迷你模型' : '〚迷你模型〛' }}</div>
                           <img class="icon icon-inside" :src="require('@/assets/images/icon/dollhouse.png')" />
                           <img class="icon icon-inside active"
                             :src="require('@/assets/images/icon/dollhouse_active.png')" />
                       </div>
+                      <img class="dianBox" src="../../assets/img/dian.png" alt="">
                       <div data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="顶部俯视"
-                        :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '40px' : '', paddingLeft: screenWidth > 2000 ? '250px' : '' }">
+                        :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                         <!-- icon文字 -->
-                        <div class="iconTxt"
-                          :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '40px' : '', marginLeft: screenWidth > 2000 ? '125px' : '' }">
+                        <div class="iconTxt" :style="{}">
                           {{ screenWidth < 1000 ? '俯瞰视图' : '〚俯瞰视图〛' }}</div>
                             <img class="icon icon-inside" :src="require('@/assets/images/icon/floor.png')" />
                             <img class="active icon icon-inside active"
                               :src="require('@/assets/images/icon/floor_active.png')" />
                         </div>
+                        <img class="dianBox" src="../../assets/img/dian.png" alt="">
                         <div title="打开音乐" data-original-title="打开音乐" id="volumeBid" rel="tooltip"
-                          :style="{ paddingLeft: screenWidth > 2000 ? '380px' : '' }" @click="switchBGM2(!isMusic)">
+                          :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }"
+                          @click="switchBGM2(!isMusic)">
                           <!-- icon文字 -->
-                          <div class="iconTxt" :class="isMusic ? 'iconTxtAc' : ''"
-                            :style="{ marginLeft: screenWidth > 2000 ? '40px !important' : '' }">{{
-                              isMusic ? '〚关闭音乐〛' : '〚打开音乐〛' }}</div>
+                          <div class="iconTxt" :class="isMusic ? 'iconTxtAc' : ''" :style="{}">{{
+                            isMusic ? '〚关闭音乐〛' : '〚打开音乐〛' }}</div>
                           <img v-if="isMusic" src="../../assets/img/openM.png" title="打开音乐" />
                           <img v-if="!isMusic" src="../../assets/img/closeM.png" alt="" title="关闭音乐" />
                         </div>
+                        <img class="dianBox" src="../../assets/img/dian.png" alt="">
                         <div data-original-title="VR" id="vr" rel="tooltip" title="" style="display: none">
                           <img class="icon icon-inside" :src="require('@/assets/images/VR.png')" />
                         </div>
@@ -204,7 +210,8 @@ export default {
       isMusic: false,
       screenWidth: null,
       dialogWidth: 0,
-      timer: false
+      timer: false,
+      showHotList: true
     };
   },
   watch: {
@@ -228,7 +235,7 @@ export default {
       if (val) {
         dom.style.transform = "translateX(0px)";
       } else {
-        dom.style.transform = "translateX(-500px)";
+        dom.style.transform = "translateX(-100vw)";
       }
     },
     smMapShow(val) {
@@ -248,7 +255,6 @@ export default {
       })()
     }
     if (this.screenWidth > 1000) {
-      console.log('走')
       setTimeout(() => {
         this.timer = true
       }, 3000)
@@ -256,6 +262,23 @@ export default {
         this.timer = false
       }, 5200)
     }
+
+    let timeA = -1
+
+    timeA = window.setInterval(() => {
+      if (window.hotData) {
+        clearInterval(timeA)
+      }
+      console.log('是否显示', window.hotData, window.myHotList, window.myHotList.length)
+      if (window.hotData && window.myHotList && window.myHotList.length) {
+        // 显示列表
+        this.showHotList = true
+        // this.showHotList = false
+      } else {
+        this.showHotList = false
+        // this.showHotList = true
+      }
+    }, 500);
   },
   methods: {
     goBack() {
@@ -301,15 +324,9 @@ export default {
 
 <style lang="less" scoped>
 // 隐藏原本的楼层选择
-<<<<<<< HEAD
-.gui-floor {
-  display: none !important;
-}
-=======
 // .gui-floor{
 //   display: none !important;
 // }
->>>>>>> f468469ef5990cd123ca81a9344aa30f41158681
 
 
 #hotList {
@@ -363,13 +380,13 @@ export default {
     height: @wh;
 
     @media screen and (min-width: 1000px) and (max-width: 2000px) {
-      width: 60px !important;
-      height: 60px !important;
+      width: 60px;
+      height: 60px;
     }
 
     @media screen and (min-width: 2000px) {
-      width: 80px !important;
-      height: 80px !important;
+      width: 80px;
+      height: 80px;
     }
 
   }
@@ -508,6 +525,17 @@ export default {
     color: #0a93cd;
   }
 
+  .dianBox {
+    width: 1.5vw !important;
+    z-index: 1000;
+
+    // position: absolute;
+    // margin-left: -10px;
+    @media screen and (max-width: 1000px) {
+      display: none;
+    }
+  }
+
   // .active{
   //   .iconTxt{
   //     color: #13709e;
@@ -667,28 +695,21 @@ export default {
   }
 
   .backBtn {
-    cursor: pointer;
-    position: fixed;
-    z-index: 99;
-    top: 36px;
-    left: 10px;
-    opacity: 1;
-    pointer-events: auto;
     display: flex;
     align-items: center;
+    position: fixed;
+    top: 1.0625rem;
+    left: 1rem;
+    font-size: .3125rem;
+    font-family: Source Han Serif CN-Bold;
+    font-weight: 700;
+    color: #fffae9;
+    text-shadow: 0 0 0.1875rem #9f7b46;
+    z-index: 1000;
 
     img {
-      width: 70px;
-      height: 70px;
-    }
-
-    span {
-      color: #FFFAE9;
-      font-family: 'Source Han Serif CN-Bold';
-      font-size: 2.5em;
-      text-shadow: 0px 0px 30px #9F7B46;
-      -webkit-background-clip: text;
-      // -webkit-text-fill-color: transparent;
+      margin-right: 0.075rem;
+      width: 0.625rem;
     }
 
   }
@@ -722,7 +743,7 @@ export default {
   }
 
   .viewShowAc {
-    transform: translateX(-500px);
+    transform: translateX(-100vw);
 
     @media screen and (min-width:1000px) {
       transform: translateX(-100vw);

H5场景本地化/public/index.html

@@ -27,7 +27,8 @@
             number = number.substring(0, number.indexOf("#"));
         } 
     </script>
-
+    <script src="<%= VUE_APP_STATIC_DIR %>/js/Hot_new.js" ></script>  
+    <script src="<%= VUE_APP_STATIC_DIR %>/js/manage_new.js" defer></script>
     <script class="build keep">
         if (window.performance) {
             window.navigationStart = window.performance.timing.navigationStart;
@@ -54,15 +55,21 @@
     <script src="<%= VUE_APP_STATIC_DIR %>/js/lib/jquery-2.1.1.min.js" class="build keep"></script>
     <script src="<%= VUE_APP_STATIC_DIR %>/js/lib/player-0.0.12.min.js" class="build keep"></script>
 
-
+    
     <script src="<%= VUE_APP_STATIC_DIR %>/js/Tween.js"></script>
-    <script src="<%= VUE_APP_STATIC_DIR %>/js/manage_new.js" defer></script>
+    <script src="<%= VUE_APP_STATIC_DIR %>/js/flexible.js" ></script>
     <!-- <script src="<%= VUE_APP_STATIC_DIR %>/js/overlay.js"></script> -->
-    <script src="<%= VUE_APP_STATIC_DIR %>/js/Hot_new.js" defer></script>  
-    <script src="<%= VUE_APP_STATIC_DIR %>/js/main_2020_show_new.js" defer></script>
     <script src="<%= VUE_APP_STATIC_DIR %>/js/lib/OBJLoader.js"></script>
     <!-- <script src="<%= VUE_APP_STATIC_DIR %>/js/CAD/bundle.js"></script> -->
     <script src="<%= VUE_APP_STATIC_DIR %>/js/loadCAD.js" defer></script>
+    <script>
+        window.onload = function(){
+            const script = document.createElement('script')
+            script.type = 'text/javascript'
+            script.src = '<%= VUE_APP_STATIC_DIR %>/js/main_2020_show_new.js'
+            document.body.appendChild(script)
+        }
+    </script>
 </body>
 
 </html>

H5场景本地化/public/static/css/main.css

@@ -4396,21 +4396,14 @@ a.tag-link {
   cursor: pointer;
 }
 
-@media only screen and (min-width: 1000px) and (max-width: 2000px) {
+@media only screen and (min-width: 1000px) {
   #play,
   #pause {
-    width: 200px;
-    margin-left: 70px;
-    padding-left: 80px;
+    /* width: 200px; */
+    /* margin-left: 5vw; */
   }
 }
 
-@media only screen and (min-width: 2000px) {
-  #play,
-  #pause {
-    width: 200px;
-  }
-}
 
 .tourSpinner {
   border-radius: 45px;
@@ -7832,7 +7825,9 @@ a.hasHover.tag-link:hover {
 @media screen and (orientation: landscape) {
   .viewContainer,
   #gui-modes-map {
-    display: block !important;
+    /* display: block !important; */
+    display: flex;
+    align-items: center;
   }
 
   .viewContainer {

H5场景本地化/public/static/js/Hot_new.js

@@ -1771,7 +1771,6 @@ window.initHot = function(model){
             li.hot = hot;   // 列表每一项对应一个热点
             li.appendChild(span);
             docFragment.appendChild(li);
-             
         }) 
         setTimeout(()=>{        
             var ul = document.querySelector('#hotListContent ul');

H5场景本地化/src/views/gui/compomemt/floorSelect.vue

@@ -40,7 +40,7 @@ export default {
   watch: {},
   methods: {
     skipUrl(url) {
-      window.location.href = window.location.href.replace(this.urlNum, url);
+      window.location.replace(window.location.href.replace(this.urlNum, url))
       setTimeout(() => {
         location.reload(true);
       }, 200);

H5场景本地化/src/views/gui/menu.vue

@@ -41,7 +41,8 @@
         <div class="viewContainer">
           <div class="viewXian">
             <!-- 线段 -->
-            <img src="../../assets/img/xian.png" alt="" />
+            <img v-if="screenWidth > 1000" src="../../assets/img/xian.png" alt="" />
+            <img v-else src="../../assets/img/xianDian.png" alt="" />
             <!-- 收起按钮 -->
             <div class="viewShowIcon" @click="viewShow = false">
               <img :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 48) + 'px' : '30px' }"
@@ -54,11 +55,11 @@
               <img rel="tooltip" title="" :src="require('@/assets/images/play.png')" data-original-title="播放" />
             </a>
           </div>
-          <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放"
-            :style="{ marginTop: screenWidth < 1000 ? '-5px' : '' }">
+          <img class="dianBox" src="../../assets/img/dian.png" alt="" :style="{marginLeft: '5vw'}">
+          <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放" 
+            :style="{ marginTop: screenWidth < 1000 ? '-5px' : '', width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
             <!-- icon文字 -->
-            <div class="iconTxt"
-              :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', bottom: screenWidth < 1000 ? '-14px' : '-18px' }">
+            <div class="iconTxt" :style="{ paddingBottom: screenWidth < 790 ? '4px' : '' }">
               {{
                 screenWidth < 1000 ? '自动导览' : '〚自动导览〛' }}</div>
                 <a>
@@ -68,10 +69,9 @@
                 </a>
             </div>
             <div id="pause" class="ui-icon" style="display: none"
-              :style="{ marginTop: screenWidth < 1000 ? '-5px' : '' }">
+              :style="{ marginTop: screenWidth < 1000 ? '-5px' : '', width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
               <!-- icon文字 -->
-              <div class="iconTxt iconTxtAc"
-                :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', bottom: screenWidth < 1000 ? '-14px' : '-18px' }">
+              <div class="iconTxt iconTxtAc" :style="{}">
                 {{ screenWidth < 1000 ? '自动导览' : '〚自动导览〛' }}</div>
                   <a>
                     <img class="imgLimit"
@@ -85,11 +85,11 @@
                 </a>
               </div>
               <div id="gui-modes-map" class="ui-icon double active">
+                <img class="dianBox" src="../../assets/img/dian.png" alt="">
                 <div data-original-title="导览" @click="isGuide = !isGuide" id="pullTab" rel="tooltip" title="场景导览"
-                  :style="{ paddingLeft: screenWidth > 1000 && screenWidth < 2000 ? '100px' : '', }">
+                  :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                   <!-- icon文字 -->
-                  <div class="iconTxt" :class="{ iconTxtAc: !isGuide }"
-                    :style="{ marginLeft: screenWidth > 1000 && screenWidth < 2000 ? '50px' : '' }">
+                  <div class="iconTxt" :class="{ iconTxtAc: !isGuide }" :style="{}">
                     {{ screenWidth < 1000 ? '导览列表' : '〚导览列表〛' }} </div>
                       <img
                         :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
@@ -97,13 +97,14 @@
                           }.png`)
                           " />
                   </div>
-
+                  <img class="dianBox" src="../../assets/img/dian.png" alt="" v-if="showHotList">
                   <!-- 热点列表 -->
-                  <div class="hotListBox" @click="meanInd = true"
-                    :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '' : '', paddingLeft: screenWidth > 2000 ? '' : '' }">
-                    <div class="iconTxt" v-show="showHotList" :style="{ bottom: screenWidth < 1000 ? '-14px' : '-18px' }">
+                  <div class="hotListBox" @click="meanInd = true" v-if="showHotList"
+                    :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
+                    <div class="iconTxt"
+                      :style="{ bottom: screenWidth < 1000 ? '-14px' : '-18px', width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                       {{ screenWidth < 1000 ? '热点列表' : '〚热点列表〛' }}</div>
-                        <div class="hotListSon" v-show="showHotList">
+                        <div class="hotListSon" >
                           <img class="imgLimit"
                             :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
                             :src="require(`@/assets/images/icon/${meanInd ? 'hotAc' : 'hot'
@@ -111,8 +112,8 @@
                               " />
                         </div>
                     </div>
-
-                    <div data-original-title="全景漫游" id="gui-modes-inside" rel="tooltip">
+                    <div data-original-title="全景漫游" id="gui-modes-inside" rel="tooltip"
+                      :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                       <img
                         :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
                         class="icon icon-inside imgLimit" :src="require('@/assets/images/icon/inside.png')" />
@@ -121,11 +122,11 @@
                         class="icon icon-inside active imgLimit"
                         :src="require('@/assets/images/icon/inside_active.png')" />
                     </div>
+                    <img class="dianBox" src="../../assets/img/dian.png" alt="">
                     <div title="迷你漫游" data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip"
-                      :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', paddingLeft: screenWidth > 2000 ? '' : '' }">
+                      :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                       <!-- icon文字 -->
-                      <div class="iconTxt"
-                        :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '80px' : '', marginLeft: screenWidth > 2000 ? '' : '' }">
+                      <div class="iconTxt" :style="{}">
                         {{ screenWidth < 1000 ? '迷你模型' : '〚迷你模型〛' }}</div>
                           <img
                             :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
@@ -134,11 +135,11 @@
                             :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
                             class="icon icon-inside active" :src="require('@/assets/images/icon/dollhouse_active.png')" />
                       </div>
+                      <img class="dianBox" src="../../assets/img/dian.png" alt="">
                       <div data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="顶部俯视"
-                        :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '40px' : '', paddingLeft: screenWidth > 2000 ? '' : '' }">
+                        :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }">
                         <!-- icon文字 -->
-                        <div class="iconTxt"
-                          :style="{ paddingRight: screenWidth > 1000 && screenWidth < 2000 ? '40px' : '', marginLeft: screenWidth > 2000 ? '' : '' }">
+                        <div class="iconTxt" :style="{}">
                           {{ screenWidth < 1000 ? '俯瞰视图' : '〚俯瞰视图〛' }}</div>
                             <img
                               :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
@@ -148,13 +149,13 @@
                               class="active icon icon-inside active"
                               :src="require('@/assets/images/icon/floor_active.png')" />
                         </div>
+                        <img class="dianBox" src="../../assets/img/dian.png" alt="">
                         <div title="打开音乐" data-original-title="打开音乐" id="volumeBid" rel="tooltip"
-                          :style="{ paddingLeft: screenWidth > 2000 ? '80px !important' : '' }"
+                          :style="{ width: screenWidth > 1700 ? parseInt(screenWidth / 10) + 'px' : screenWidth < 790 ? '60px' : '10vw' }"
                           @click="switchBGM2(!isMusic)">
                           <!-- icon文字 -->
-                          <div class="iconTxt" :class="isMusic ? 'iconTxtAc' : ''"
-                            :style="{ marginLeft: screenWidth > 2000 ? '40px !important' : '' }">{{
-                              isMusic ? '〚关闭音乐〛' : '〚打开音乐〛' }}</div>
+                          <div class="iconTxt" :class="isMusic ? 'iconTxtAc' : ''" :style="{}">{{
+                            isMusic ? '〚关闭音乐〛' : '〚打开音乐〛' }}</div>
                           <img
                             :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
                             v-if="isMusic" src="../../assets/img/openM.png" title="打开音乐" />
@@ -162,6 +163,7 @@
                             :style="{ width: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px', height: screenWidth > 1000 ? parseInt(screenWidth / 32) + 'px' : '40px' }"
                             v-if="!isMusic" src="../../assets/img/closeM.png" alt="" title="关闭音乐" />
                         </div>
+                        <img class="dianBox" src="../../assets/img/dian.png" alt="">
                         <div data-original-title="VR" id="vr" rel="tooltip" title="" style="display: none">
                           <img class="icon icon-inside" :src="require('@/assets/images/VR.png')" />
                         </div>
@@ -291,26 +293,27 @@ export default {
         if (window.hotData) {
           clearInterval(timeA)
         }
+        console.log('是否显示',window.hotData, window.myHotList, window.myHotList.length)
         if (window.hotData && window.myHotList && window.myHotList.length) {
           // 显示列表
           this.showHotList = true
+          // this.showHotList = false
         } else {
           this.showHotList = false
+          // this.showHotList = true
         }
       }, 500);
     }
   },
   methods: {
     goBack() {
-      window.parent.postMessage({ command: "back" }, "*");
-      // console.log(window.history)
-      // // 如果有上一页，则传递信息
-      // if (window.history.length === 1) {
-      //   window.close()
-      // } else {
-      //   // 跨域传递信息
-      //   window.parent.postMessage({ command: "back" }, "*");
-      // }
+      // 如果有上一页，则传递信息
+      if (window.history.length === 1) {
+        window.close()
+      } else {
+        // 跨域传递信息
+        window.parent.postMessage({ command: "back" }, "*");
+      }
     },
     switchBGM(flag) {
       if (flag) {
@@ -541,6 +544,16 @@ export default {
     color: #0a93cd;
   }
 
+  .dianBox {
+    width: 1.5vw !important;
+    z-index: 1000;
+    // position: absolute;
+    // margin-left: -10px;
+    @media screen and (max-width: 1000px) {
+      display: none;
+    }
+  }
+
   // .active{
   //   .iconTxt{
   //     color: #13709e;
@@ -568,12 +581,12 @@ export default {
 
     @media screen and (min-width: 1000px) and (max-width: 1700px) {
       height: auto;
-      width: 250px;
+      width: 10vw;
     }
 
     @media screen and (min-width: 1700px) {
       height: auto;
-      width: 300px;
+      width: 200px;
     }
 
 
@@ -704,30 +717,22 @@ export default {
   }
 
   .backBtn {
-    cursor: pointer;
-    position: fixed;
-    z-index: 99;
-    top: 36px;
-    left: 10px;
-    opacity: 1;
-    pointer-events: auto;
     display: flex;
     align-items: center;
+    position: fixed;
+    top: 1.0625rem;
+    left: 1rem;
+    font-size: .3125rem;
+    font-family: Source Han Serif CN-Bold;
+    font-weight: 700;
+    color: #fffae9;
+    text-shadow: 0 0 0.1875rem #9f7b46;
+    z-index: 1000;
 
     img {
-      width: 70px;
-      height: 70px;
-    }
-
-    span {
-      color: #FFFAE9;
-      font-family: 'Source Han Serif CN-Bold';
-      font-size: 2.5em;
-      text-shadow: 0px 0px 30px #9F7B46;
-      -webkit-background-clip: text;
-      // -webkit-text-fill-color: transparent;
+      margin-right: 0.075rem;
+      width: 0.625rem;
     }
-
   }
 
   .myViewShowBox {