feat: .

hot/src/views/Home.vue

@@ -407,22 +407,27 @@ export default {
         transform: translateX(566px);
         .close-btn {
           background: url(../assets/images/pc/tab-close.png) no-repeat;
+          background-size: 100% 100%;
         }
       }
       .close-btn {
-        width: 69px;
-        height: 156px;
+        // width: 69px;
+        // height: 156px;
+        // left: -64px;
+        // font-size: 20px;
+        width: 50px;
+        height: 113px;
         background: url(../assets/images/pc/tab.png) no-repeat;
         background-size: 100% 100%;
         position: absolute;
         top: 130px;
-        left: -64px;
+        left: -46px;
         writing-mode: vertical-rl; /* 文字从上到下，从右到左排列 */
         display: flex;
         align-items: center;
         justify-content: center;
         color: #bbab92;
-        font-size: 20px;
+        font-size: 18px;
         cursor: pointer;
       }
       .flooTxtBox {
@@ -490,21 +495,45 @@ export default {
 // 移动端
 @media screen and (max-width: 1000px) {
   .home {
+    background: linear-gradient(180deg, #0e0d0a 0%, #2c2a24 100%);
     #myAudio {
       width: 90vw;
       max-width: 500px;
     }
     .main {
-      width: 90%;
-      height: 94%;
+      width: 100%;
+      height: 100%;
       padding: 0;
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
-
+      .flooTabBox {
+        width: 100%;
+        // bottom: 20px;
+        justify-content: center;
+        flex-direction: row;
+        top: 75px;
+        left: 0;
+        padding: 0 20px;
+        .tabRow {
+          cursor: default;
+          margin: 0 6px;
+          // padding: 0 10px;
+          height: 28px;
+          width: 80px;
+          font-size: 12px;
+          & > img {
+            width: 12px;
+          }
+        }
+      }
       .mainCon {
         border-radius: 8px 8px 0 0;
+        height: 235px;
+        top: 128px;
+        left: 0;
+        transform: none;
         .audioIcon {
           cursor: default;
           right: auto;
@@ -515,20 +544,6 @@ export default {
             width: 30px;
           }
         }
-        .flooTabBox {
-          width: 100%;
-          bottom: 20px;
-          justify-content: center;
-          .tabRow {
-            cursor: default;
-            margin: 0 6px;
-            padding: 0 10px;
-            height: 32px;
-            & > img {
-              width: 16px;
-            }
-          }
-        }
 
         .contenBox {
           .videoBox {
@@ -552,31 +567,58 @@ export default {
           }
         }
         .awccJJ {
-          left: 0;
-          width: 28px;
-          height: 57px;
+          left: 5px;
+          width: 36px;
+          height: 36px;
           cursor: default;
-          background-image: url("../assets/images/pc/icon-left.png");
+          background-image: url("../assets/images/mobile/icon_left.png");
         }
         .rightJJ {
           left: auto;
-          right: 0;
-          background-image: url("../assets/images/pc/icon-right.png");
+          right: 5px;
+          background-image: url("../assets/images/mobile/icon_right.png");
         }
       }
       .flooTxt {
+        width: 100%;
         margin-top: 0;
         padding: 20px 15px 15px;
         height: 200px;
-        background-color: #fff;
+        // background-color: #fff;
         border-radius: 0 0 8px 8px;
+        height: 325px;
+        bottom: 0;
+        left: 0;
+        top: auto;
+        background-image: url("../assets/images/mobile/bg2.png");
+        transform: none;
+
+        .pic,
+        .close-btn {
+          display: none;
+        }
         .flooTxtBox {
+          .line {
+            display: none;
+          }
           .myTitle {
             font-size: 18px;
+            position: fixed;
+            top: 34px;
+            left: 50%;
+            transform: translateX(-50%);
+            width: 70%;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            text-align: center;
           }
           .myTxt {
             font-size: 14px;
             line-height: 22px;
+            padding: 0 34px 10px;
+            width: 100%;
+            height: calc(325px - 64px) !important;
           }
         }
       }

scene/public/static/css/main.css

@@ -2835,7 +2835,7 @@ html {
   width: 100%;
   height: 100%;
   position: absolute;
-  background-image: url("../images/bg.jpg");
+  /* background-image: url("../images/bg.jpg"); */
   background-size: auto 100%;
   background-position: center;
 }
@@ -3849,7 +3849,7 @@ a.tag-link {
   z-index: 50;
   border-radius: 10px;
   left: 0px;
-  bottom: 30px;
+  bottom: 22px;
 }
 
 .pinBottom.left .icon {
@@ -4106,12 +4106,12 @@ a.tag-link {
 }
 
 .gui-floor-icon {
-  width: 44px;
-  height: 44px;
+  width: 72px;
+  height: 72px;
   background: url("../images/icon_floor_2.png") left top no-repeat;
   background-size: 100% 100%;
 }
-.gui-floor-icon.inside{
+.gui-floor-icon.inside {
   background: url("../images/icon_floor_1.png") left top no-repeat;
   background-size: 100% 100%;
 }
@@ -4124,10 +4124,11 @@ a.tag-link {
   display: none;
   width: 86px;
   position: absolute;
-  bottom: 50px;
+  top: -89px;
   transition: all 0.3s;
   z-index: 100;
-  left: -19px;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
 #drawer,
@@ -4402,7 +4403,7 @@ a.tag-link {
 }
 
 #gui .pinBottom.open {
-  bottom: 170px;
+  bottom: 160px;
 }
 
 #gui .pinBottom.open.noScroll {
@@ -7607,7 +7608,7 @@ a.hasHover.tag-link:hover {
     } */
   .pinBottom.right,
   .pinBottom.left {
-    bottom: 5px;
+    bottom: 35px;
   }
   .pinBottom.left {
     left: 5px;
@@ -7891,3 +7892,20 @@ a.hasHover.tag-link:hover {
   margin-left: -0.875px;
   margin-top: -0.875px;
 }
+
+@media screen and (max-width: 1000px) {
+  .gui-floor {
+    position: fixed;
+    left: 50%;
+    transform: translateX(-50%);
+    bottom: 50px;
+    transition: bottom .5s;
+  }
+  .pinBottom.open .gui-floor{
+    bottom: 123px;
+  }
+  .gui-floor .gui-floor-icon {
+    width: 40px;
+    height: 40px;
+  }
+}

scene/src/assets/style/myBase.css

@@ -44,6 +44,11 @@
 #thumb-container .active > img {
   border: 1.5px solid rgba(255, 225, 168, 1);
 }
+.frame .slidee {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
 .frame .slidee li img {
   /* border: 1.5px solid transparent; */
   /* margin-left: -1.5px; */
@@ -165,7 +170,13 @@
     font-size: 12px;
   }
   #closepop {
-    top: 4px;
-    right: 4px;
+    /* top: 4px;
+    right: 4px; */
+    top: 31px;
+    left: 17px;
+    width: 36px;
+    height: 36px;
+    background: url(../image/icon_left.png)no-repeat;
+    background-size: 100% 100%;
   }
 }

scene/src/components/welcome/index.vue

@@ -43,8 +43,8 @@ export default {
   .home-bg {
     width: 100%;
     height: 100%;
-    background-image: url("../../assets/image/home/bg.png");
-    background-size: 100% 100%;
+    background: url("../../assets/image/home/bg.png") no-repeat;
+    background-size: cover;
   }
 
   .btn {
@@ -75,8 +75,8 @@ export default {
   .mobileBg {
     width: 100%;
     height: 100%;
-    background-image: url("../../assets/img/mobileBg.jpg");
-    background-size: 100% 100%;
+    background: url("../../assets/img/mobileBg.jpg") no-repeat;
+    background-size: cover;
   }
 
   // 移动端

scene/src/views/gui/components/hotList.vue

@@ -1,5 +1,7 @@
 <template>
-  <div class="hotList" v-click-outside="handleClickOutside">
+  <!-- <div class="hotList" v-click-outside="handleClickOutside"> -->
+  <div class="hotList">
+    <div class="close-btn" @click="handleClickOutside"></div>
     <div class="title">
       <!-- <div class="titleLL">热点列表</div> -->
       <!-- <div class="titleRR" @click="$emit('close')">
@@ -86,6 +88,18 @@ export default {
   height: 100vh;
   background: url(../../../assets/image/list-bg.png) no-repeat;
   background-size: 100% 100%;
+  .close-btn {
+    width: 36px;
+    height: 36px;
+    top: 50%;
+    left: 0;
+    transform: translateY(-50%);
+    background: url(../../../assets/image/icon_right.png) no-repeat;
+    background-size: 100% 100%;
+    position: absolute;
+    z-index: 100;
+    cursor: pointer;
+  }
   .title {
     height: 318px;
     width: 100%;
@@ -157,6 +171,7 @@ export default {
       width: calc(100% - 10px);
       color: rgba(255, 255, 255, 0.8);
       font-size: 16px;
+      text-align: right;
       & > span {
         // border-top: 1px solid #f0e2c0;
         padding: 10px 0;
@@ -189,10 +204,33 @@ export default {
 @media screen and (max-width: 1000px) {
   .hotList {
     max-width: 500px;
-    width: 94%;
-    height: 90%;
-    padding: 30px 10px 30px 30px;
+    width: 73%;
+    height: 100%;
+    padding: 30px 0 30px 30px;
+
+    top: 0;
+    right: 0;
+    // width: 434px;
+    // height: 100vh;
+    background: url(../../../assets/image/mobile/list.png) no-repeat;
+    background-size: 100% 100%;
+    z-index: 100;
     .title {
+      height: 236px;
+      .pic-one {
+        width: 202px;
+        height: 162px;
+        background: url(../../../assets/image/mobile/img_01.png) no-repeat;
+        background-size: 100% 100%;
+      }
+      .pic-two {
+        background: url(../../../assets/image/mobile/img_title.png) no-repeat;
+        background-size: 100% 100%;
+        width: 117px;
+        height: 183px;
+        left: -85px;
+        top: 34px;
+      }
       .titleLL {
         font-size: 18px;
       }
@@ -202,11 +240,25 @@ export default {
         top: 5px;
       }
     }
+    .search-box {
+      width: 180px;
+      right: 30px;
+      input {
+        width: 159px;
+      }
+    }
     .main {
       margin-top: 10px;
+      padding: 10px 15px 0 33px;
+      height: calc(100% - 266px);
+      .txtNone{
+      font-size: 14px;
+      }
       .txt {
         font-size: 14px;
+
         & > span {
+          font-size: 14px;
           &:hover {
             color: #fff;
           }

scene/src/views/gui/menu.vue

@@ -4,10 +4,10 @@
       <div id="view-controllers"></div>
     </div>
     <div class="pinBottom left">
-      <div v-if="isMobile" id="myClickBox" style="">
+      <!-- <div v-if="isMobile" id="myClickBox" style="">
         <div id="go" />
         <div id="back" />
-      </div>
+      </div> -->
 
       <div>
         <div class="viewContainer">
@@ -18,14 +18,14 @@
           </div>
           <div id="play" class="ui-icon" rel="tooltip" data-original-title="播放">
             <!-- 鼠标移入的显示 -->
-            <div class="hoverTit">自动导览</div>
+            <div class="hoverTit">自动漫游</div>
             <a>
               <img :src="require('@/assets/image/icon/tour-play.png')" width="24" height="24" />
             </a>
           </div>
           <div id="pause" class="ui-icon" style="display: none">
             <!-- 鼠标移入的显示 -->
-            <div class="hoverTit">自动导览</div>
+            <div class="hoverTit">自动漫游</div>
 
             <a>
               <img rel="tooltip" title="" :src="require('@/assets/image/icon/tour-pause.png')" width="24" height="24" data-original-title="暂停" />
@@ -39,30 +39,30 @@
           <div id="gui-modes-map" class="ui-icon double active">
             <div data-original-title="导览" @click="isGuide = !isGuide" id="pullTab" rel="tooltip" title="场景导览">
               <!-- 鼠标移入的显示 -->
-              <div class="hoverTit">导览列表</div>
+              <div class="hoverTit">重点展位</div>
 
               <img title="" class="icon icon-inside" :src="require(`@/assets/image/icon/icon_point${!isGuide ? '_active' : '_normal'}.png`)" />
             </div>
 
             <!-- 热点列表 -->
-            <div v-show="!hideTools" id="myHotList" @click="openInd = 1">
+            <div v-show="!hideTools" id="myHotList" @click="openTags">
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit">热点列表</div>
               <img :src="require(`@/assets/image/icon/icon_detail${openInd == 1 ? '_active' : '_normal'}.png`)" alt="" />
             </div>
             <div title="迷你漫游" data-original-title="迷你模型" id="gui-modes-dollhouse" rel="tooltip">
               <!-- 鼠标移入的显示 -->
-              <div class="hoverTit">三维视觉</div>
+              <div class="hoverTit">三维模型</div>
               <img class="icon icon-inside" :src="require('@/assets/image/icon/icon_dollhouse_normal.png')" />
               <img class="icon icon-inside active" :src="require('@/assets/image/icon/icon_dollhouse_active.png')" />
             </div>
             <div data-original-title="俯视图" id="gui-modes-floorplan" rel="tooltip" title="顶部俯视">
               <!-- 鼠标移入的显示 -->
-              <div class="hoverTit">平面视觉</div>
+              <div class="hoverTit">俯视平面</div>
               <img class="icon icon-inside" :src="require('@/assets/image/icon/icon_floor_normal.png')" />
               <img class="active icon icon-inside active" :src="require('@/assets/image/icon/icon_floor_active.png')" />
             </div>
-            <div @click="onFullScreen" rel="tooltip" title="顶部俯视" id="gui-modes-floorplan" data-original-title="俯视图">
+            <div @click="onFullScreen" v-if="!isMobile" rel="tooltip" title="顶部俯视" id="gui-modes-floorplan" data-original-title="俯视图">
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit" v-if="!isFullscreen">全屏</div>
               <div class="hoverTit" v-else>退出全屏</div>
@@ -170,6 +170,13 @@ export default {
     });
   },
   methods: {
+    openTags() {
+      if (this.openInd) {
+        this.openInd = 0;
+      } else {
+        this.openInd = 1;
+      }
+    },
     onFullScreen() {
       let element = document.documentElement;
       if (this.isFullscreen) {
@@ -294,8 +301,8 @@ export default {
 }
 
 // 右侧菜单栏
-@wh: 44px;
-@margin: 0px;
+@wh: 72px;
+@margin: 21px;
 #play,
 #pause {
   margin-right: @margin;
@@ -400,17 +407,20 @@ export default {
     pointer-events: auto;
   }
 }
-
+.viewContainer {
+  padding: 10px 20px 0 34px;
+}
 // 移动端
 @media screen and (max-width: 1000px) {
   .hoverTit {
     opacity: 0 !important;
   }
   .viewContainer {
+    padding: 10px 20px 10px 10px;
     & > div {
       img {
-        width: 33px !important;
-        height: 33px !important;
+        width: 40px !important;
+        height: 40px !important;
       }
     }
   }
@@ -431,10 +441,15 @@ export default {
           width: 50px !important;
           text-align: right;
           margin-right: 0;
-          margin-bottom: 10px;
+          // margin-bottom: 10px;
           & > div {
-            display: flex;
-            justify-content: flex-end;
+            // display: flex;
+            // justify-content: flex-end;
+          }
+          .container{
+            right: auto;
+            left: 50% !important;
+            top: -68px;
           }
           img {
             width: 33px;