Quellcode durchsuchen

Merge branch 'master' of http://192.168.0.115:3000/chenzhiguang/FD_Pano

任一存 vor 3 Jahren
Ursprung
Commit
2c0c1e7448
3 geänderte Dateien mit 86 neuen und 140 gelöschten Zeilen
  1. 21 22
      src/framework/show/list.vue
  2. 4 4
      src/framework/showMobile/index.vue
  3. 61 114
      src/framework/showMobile/list.vue

+ 21 - 22
src/framework/show/list.vue

@@ -300,8 +300,8 @@ export default {
     background: rgba(0, 0, 0, 0.3);
     border-radius: 18px;
     border: 1px solid rgba(255, 255, 255, 0.2);
-    margin-top: 10px;
     pointer-events: auto;
+    margin-top: 18px;
     height: 38px;
     line-height: 38px;
     color: #fff;
@@ -327,7 +327,6 @@ export default {
       background: rgba(0, 0, 0, 0.5);
       border-radius: 4px;
       padding: 0 20px;
-
     }
 
     .clip-scroller{
@@ -345,15 +344,15 @@ export default {
     }
 
     .pp-tap {
-      padding: 0 0 16px;
+      padding: 8px 0 18px;
       > li {
-        max-width: 84px;
+        width: 84px;
         margin: 0 10px;
 
       }
     }
     .tap {
-      padding: 20px 0 16px;
+      padding: 10px 0 0;
 
       > li {
         position: relative;
@@ -363,26 +362,26 @@ export default {
           padding: 0;
         }
 
-        &.active {
-          @size:5px;
-          &::before {
-            content: "";
-            display: inline-block;
-            width: 0;
-            height: 0;
-            border-left:  @size * 1.5 solid transparent;
-            border-right:  @size * 1.5 solid transparent;
-            border-top:  @size*2 solid rgba(0, 0, 0, 0.5);
-            position: absolute;
-            top: -20px;
-            left: 50%;
-            transform: translateX(-50%);
-          }
-        }
+        // &.active {
+        //   @size:5px;
+        //   &::before {
+        //     content: "";
+        //     display: inline-block;
+        //     width: 0;
+        //     height: 0;
+        //     border-left:  @size * 1.5 solid transparent;
+        //     border-right:  @size * 1.5 solid transparent;
+        //     border-top:  @size*2 solid rgba(0, 0, 0, 0.5);
+        //     position: absolute;
+        //     top: -20px;
+        //     left: 50%;
+        //     transform: translateX(-50%);
+        //   }
+        // }
       }
     }
     .pic-list {
-      padding: 12px 0;
+      padding: 10px 0;
       > li {
         cursor: pointer;
         width: 72px;

+ 4 - 4
src/framework/showMobile/index.vue

@@ -4,7 +4,7 @@
       <v-ifr
         v-if="activeItem.type == '4dkk'"
         :key="activeItem.sceneCode"
-        :url="`/embed.html?from=mingyuan&m=${activeItem.sceneCode}&lang=zh`"
+        :url="`https://test.4dkankan.com/embed.html?from=mingyuan&m=${activeItem.sceneCode}&lang=zh`"
       />
       <div v-show="activeItem.type != '4dkk'" id="pano"></div>
       
@@ -539,8 +539,8 @@ export default {
   }
   .aside {
     position: fixed;
-    left: 10px;
-    bottom: 4px;
+    left: 15px;
+    bottom: 34px;
     display: flex;
     > li {
       margin: 0 0 5px 5px;
@@ -548,7 +548,7 @@ export default {
         width: 36px;
         height: 36px;
         display: inline-block;
-        background: rgba(0, 0, 0, 0.3);
+        background: rgba(0, 0, 0, 0.5);
         border: 1px solid rgba(255, 255, 255, 0.2);
         opacity: 1;
         border-radius: 18px;

+ 61 - 114
src/framework/showMobile/list.vue

@@ -3,7 +3,7 @@
      <div class="l-con" :class="showList?'active':''"  v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)">
       <div class="pic-con">
 
-        <div ref="sw" v-swiper:mySwiper="swiperOptions"  v-if="scenes.length>0">
+        <div class="clip-scroller" ref="sw" v-swiper:mySwiper="swiperOptions"  v-if="scenes.length>0">
           <ul class="pic-list swiper-wrapper">
             <li class="swiper-slide" @click="handleVR(item,i)" v-for="(item,i) in scenes" :key="i">
               <div :class="{active:selected.sceneCode==item.sceneCode}">
@@ -15,9 +15,9 @@
           </ul>
         </div>
 
-        <div ref="sw1"  v-swiper:mySwipera="swiperOptions" v-if="childTab.length > 1">
+        <div ref="sw1" class="clip-scroller" v-swiper:mySwipera="swiperOptions" v-if="childTab.length > 1">
           
-        <ul class="tap swiper-wrapper"  >
+        <ul class="tap pp-tap swiper-wrapper"  >
           <li class="swiper-slide" @click="handleTabtow(item,i)" v-for="(item,i) in childTab" :key="i">
               <rollName :offset="30" :mgin="20" :active="item.id == tabtowActive.id" class="btn pic-rect" :class="{active:item.id == tabtowActive.id}" :myref="'ww'+item.id" :name="item.name"/>
           </li>
@@ -33,36 +33,17 @@
         </ul>
       </div>
     </div>
-    <div v-if="selected.type=='4dkk' && (isShowDL || (currentActive!='2d'&& currentActive!='3d' && mapvisit == 0))" class="menu">
-      <div class="menucon" :class="{shouqi:shouqi}">
-        <ul>
-          <li @click="handleDL" v-if="isShowDL">
-            <i class="iconfont" :class="isDaolan?'iconshow_suspension':'iconshow_playback'"></i>
-            <span title="导览" >导览</span>
-          </li>
-          {{mapvisit}}
-          <template v-if="currentActive!='2d'&& currentActive!='3d' && mapvisit == 0">
-            <li v-for="(item,i) in menu" @click="handleMenu(item)" :key="i">
-              <i class="iconfont" :class="currentActive==item.id?item.active:item.icon"></i>
-              <span :title="item.name" >{{item.name}}</span>
-              <!-- <i style="font-size:10px; margin-left:6px" v-if="item.id == 'daolan'" class="iconfont iconshow_drop-down"></i> -->
-            </li>
-          </template>
-        </ul>
-        <i @click="shouqi = !shouqi" class="iconfont iconshow_function_collect"></i>
 
-      </div>
 
-      <div class="scenedl">
-        <i class="iconfont"  @click="showList=!showList" :class="showList?'iconnav_scene_down':'iconnav_scene_up'"></i>
-      </div>
+    <div v-if="selected.type=='4dkk' && isShowDL" class="menu">
+        <div  @click="handleDL" v-if="isShowDL">
+            <i class="iconfont" :class="isDaolan?'iconshow_suspension':'iconshow_playback'"></i>
+        </div>
     </div>
 
-    <template  v-else>
-      <div class="btn dl" :class="{deepbg:showList}" v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)" @click="showList = !showList">
-        <i class="iconfont " :class="showList?'iconnav_scene_down':'iconnav_scene_up'"></i>场景导航
-      </div>
-    </template>
+    <div class="btn dl" :class="{deepbg:showList}" v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)" @click="showList = !showList">
+      <i class="iconfont " :class="showList?'iconnav_scene_down':'iconnav_scene_up'"></i>场景导航
+    </div>
 
   
   </div>
@@ -270,9 +251,9 @@ export default {
     selected:{
       handler:function (newVal) {
         this.handleVR(newVal)
-        if (newVal.type == '4dkk') {
-          this.showList = false
-        }
+        // if (newVal.type == '4dkk') {
+        //   this.showList = false
+        // }
       }
     }
   }
@@ -338,16 +319,21 @@ export default {
 
 .list{
   position: fixed;
-  bottom: 10px;
+  bottom: 44px;
   left: 0;
   text-align: right;
   width: 100%;
+
+  .clip-scroller{
+    padding: 0 15px;
+  }
+
   .dl{
     background: rgba(0, 0, 0, 0.3);
     border-radius: 18px;
     border: 1px solid rgba(255, 255, 255, 0.2);
-    margin-top: 10px;
-    margin-right: 10px;
+    margin-top: 18px;
+    margin-right: 15px;
     padding: 0 10px;
     height: 36px;
     line-height: 36px;
@@ -368,68 +354,26 @@ export default {
     background: rgba(0, 0, 0, 0.5);
   }
   .menu{
-    margin: 10px 0 12px;
-    .menucon{
-      float: left;
-      display: flex;
-      border: 1px solid rgba(255, 255, 255, 0.10196078431372549);
-      border-radius: 0px 24px 24px 0px;
-      background: rgba(0, 0, 0, 0.3);
-      padding-right: 30px;
-      position: relative;
-      transition: all 0.3s ease;
-      >ul{
-        display: flex;
-        overflow: hidden;
-        >li{
-            color: #fff;
-            margin: 0;
-            height: 46px;
-            line-height: 46px;
-            padding: 0 5px;
-            background: none;
-            >span{
-              display: inline-block;
-              margin-left: 6px;
-            }
-            
-          }
-      }
-      >i{
-          font-size: 10px;
+      position: fixed;
+      left: 15px;
+      bottom: 40px;
+      >div{
+        width: 36px;
+        height: 36px;
+        display: inline-block;
+        background: rgba(0, 0, 0, 0.5);
+        border: 1px solid rgba(255, 255, 255, 0.2);
+        opacity: 1;
+        border-radius: 18px;
+        position: relative;
+        cursor: pointer;
+        >i{
           position: absolute;
-          right: 14px;
           top: 50%;
-          transform: translateY(-50%);
+          left: 50%;
+          transform: translate(-50%, -50%);
         }
-    }
-
-    .shouqi{
-      >ul{
-        max-width: 0;
-        width: 0;
       }
-      >i{
-        transform: translateY(-50%) rotate(180deg);
-      }
-    }
-    .scenedl{
-      width: 48px;
-      height: 48px;
-      background: rgba(0, 0, 0, 0.3);
-      border: 1px solid rgba(255, 255, 255, 0.1);
-      display: inline-block;
-      border-radius: 50%;
-      position: relative;
-      margin-right: 10px;
-      >i{
-        top: 50%;
-        left: 50%;
-        position: absolute;
-        transform: translate(-50%,-50%);
-        font-size: 18px;
-      }
-    }
   }
   .l-con{
     width: 100%;
@@ -438,9 +382,6 @@ export default {
     overflow: hidden;
     .pic-con{
       background: rgba(0, 0, 0, 0.5);
-      border-radius: 4px;
-      padding: 0 10px;
-
     }
     ul{
       align-items: center;
@@ -452,38 +393,44 @@ export default {
       }
     }
     .tap{
-      padding: 12px 0;
+      padding: 12px 0 0;
       &::-webkit-scrollbar{
         display: none;
       }
        > li {
+         font-size: 0;
         position: relative;
         width: 88px;
 
         .btn{
+          font-size: 14px;
           width: 100%;
           padding: 0;
         }
-        &.active {
-          @size:8px;
-          &::before {
-            content: "";
-            display: inline-block;
-            width: 0;
-            height: 0;
-            border-left:  @size * 1.5 solid transparent;
-            border-right:  @size * 1.5 solid transparent;
-            border-top:  @size*2 solid rgba(0, 0, 0, 0.5);
-            position: absolute;
-            top: -18px;
-            left: 50%;
-            transform: translateX(-50%);
-          }
-        }
+        // &.active {
+        //   @size:8px;
+        //   &::before {
+        //     content: "";
+        //     display: inline-block;
+        //     width: 0;
+        //     height: 0;
+        //     border-left:  @size * 1.5 solid transparent;
+        //     border-right:  @size * 1.5 solid transparent;
+        //     border-top:  @size*2 solid rgba(0, 0, 0, 0.5);
+        //     position: absolute;
+        //     top: -18px;
+        //     left: 50%;
+        //     transform: translateX(-50%);
+        //   }
+        // }
       }
     }
+
+    .pp-tap{
+      padding: 8px 0 18px;
+    }
     .pic-list{
-      padding: 12px 0;
+      padding: 10px 0;
       &::-webkit-scrollbar {
         display: none;
       }