shaogen1995 3 年之前
父节点
当前提交
7a81f75b05
共有 2 个文件被更改,包括 83 次插入9 次删除
  1. 8 4
      web/src/views/gui/component/share.vue
  2. 75 5
      web/src/views/gui/menu.vue

+ 8 - 4
web/src/views/gui/component/share.vue

@@ -6,7 +6,7 @@
         <i class="el-icon-close" @click="$emit('close')"></i>
       </div>
       <div class="myInput">
-        https://lanhuapp.com/web/#/item/project/product?tid=de3e5e3?id=1171_122
+        {{urlHref}}
       </div>
       <div class="btn">
         <el-button
@@ -26,7 +26,9 @@ export default {
   components: {},
   data() {
     //这里存放数据
-    return {};
+    return {
+      urlHref:''
+    };
   },
   //监听属性 类似于data概念
   computed: {},
@@ -36,7 +38,7 @@ export default {
   methods: {
     copy() {
       // 存储传递过来的数据
-      let OrderNumber = "9999999999";
+      let OrderNumber = this.urlHref;
       // 创建一个input 元素
       // createElement() 方法通过指定名称创建一个元素
       let newInput = document.createElement("input");
@@ -61,7 +63,9 @@ export default {
     },
   },
   //生命周期 - 创建完成(可以访问当前this实例)
-  created() {},
+  created() {
+    this.urlHref =window.location.href
+  },
   //生命周期 - 挂载完成(可以访问DOM元素)
   mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前

+ 75 - 5
web/src/views/gui/menu.vue

@@ -28,6 +28,9 @@
             rel="tooltip"
             data-original-title="播放"
           >
+            <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+              {{ Mylangue ? "漫游" : "Explore" }}
+            </div>
             <a>
               <img
                 :title="Mylangue ? '自动漫游' : 'Explore'"
@@ -71,6 +74,10 @@
               rel="tooltip"
               :title="Mylangue ? '场景导览' : 'Auto Explore'"
             >
+              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+                {{ Mylangue ? "场景" : "Auto" }}
+              </div>
+
               <img
                 :title="Mylangue ? '场景导览' : 'Auto Explore'"
                 class="icon icon-inside"
@@ -106,6 +113,9 @@
               rel="tooltip"
               :title="Mylangue ? '顶部俯视' : 'Floor plan'"
             >
+              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+                {{ Mylangue ? "俯视" : "Floor plan" }}
+              </div>
               <img
                 :title="Mylangue ? '顶部俯视' : 'Floor plan'"
                 class="icon icon-inside"
@@ -124,6 +134,9 @@
               id="gui-modes-dollhouse"
               rel="tooltip"
             >
+              <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+                {{ Mylangue ? "三维" : "3D" }}
+              </div>
               <img
                 :title="Mylangue ? '三维模型' : '3D Model'"
                 class="icon icon-inside"
@@ -136,7 +149,12 @@
               />
             </div>
 
-            <div @click="switchBGM" id="myMoMu" data-original-title="音乐"  :musicFlag='bgmPlay?"关":"开"'>
+            <div
+              @click="switchBGM"
+              id="myMoMu"
+              data-original-title="音乐"
+              :musicFlag="bgmPlay ? '关' : '开'"
+            >
               <img
                 class="icon icon-inside"
                 :src="
@@ -166,6 +184,9 @@
                     }.png`)
                   "
                 />
+                <div class="mobileTit" v-if="isMobile" :class="{mobileTitEn:!Mylangue}">
+                  {{ Mylangue ? "展品" : "Collection" }}
+                </div>
               </li>
               <!-- 点赞 -->
               <li
@@ -327,6 +348,7 @@
         <img
           :src="require(`@/assets/imgM/${mobilShow ? 'close' : 'menu'}.png`)"
         />
+        <div class="isMobileBoxTit">{{Mylangue?'功能':'Function'}}</div>
       </div>
       <div v-if="mobilShow" class="show">
         <!-- 语言切换 -->
@@ -334,15 +356,23 @@
           :src="require(`@/assets/img/${Mylangue ? 'cn' : 'en'}.png`)"
           @click="langueCut"
         />
+        <div class="isMobileBoxTit">{{Mylangue?'语言':'Language'}}</div>
         <!-- 分享 -->
         <img src="@/assets/img/share.png" @click="isShare = true" />
+        <div class="isMobileBoxTit">{{Mylangue?'分享':'Share'}}</div>
         <!-- 答题 -->
         <img
           @click="isIssue = true"
           :src="require(`@/assets/img/${isGame ? 'game_active' : 'game'}.png`)"
         />
+        <div class="isMobileBoxTit">{{Mylangue?'游戏':'Game'}}</div>
         <!-- 音乐 -->
-        <div @click="switchBGM" id="myMoMu" data-original-title="音乐" :musicFlag='bgmPlay?"关":"开"'>
+        <div
+          @click="switchBGM"
+          id="myMoMu"
+          data-original-title="音乐"
+          :musicFlag="bgmPlay ? '关' : '开'"
+        >
           <img
             class="icon icon-inside"
             :src="
@@ -351,6 +381,7 @@
               }.png`)
             "
           />
+          <div class="isMobileBoxTit">{{Mylangue?'音乐':'Music'}}</div>
         </div>
       </div>
     </div>
@@ -375,6 +406,14 @@ export default {
   components: { Quality, Share, Browse, Game },
   data() {
     return {
+      mobileTitData: [
+        { name1: "自动漫游", name2: "Explore" },
+        { name1: "场景导览", name2: "Auto Explore" },
+        { name1: "顶部俯视", name2: "Floor plan" },
+        { name1: "三维模型", name2: "3D Model" },
+        { name1: "精品典藏", name2: "Collections" },
+      ],
+      // 移动端的底部文字提示 👆
       mobilShow: false,
       // 移动端的菜单栏切换
       isGuide: true,
@@ -677,20 +716,43 @@ export default {
   .btn-list {
     & > li {
       width: 50px;
-      height: 50px;
       & > img {
         width: 38px;
         height: 38px;
       }
       .like_txt {
-        bottom: -12px;
+        bottom: -13px;
       }
     }
   }
+  // 移动端的底部图标提示
+  .mobileTit {
+    width: 50px;
+    color: #fff;
+    font-size: 14px;
+    position: absolute;
+    bottom: -12px;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 999;
+    text-align: center;
+  }
+  .mobileTitEn{
+    width: 80px;
+    font-size: 12px;
+    transform: translateX(-50%) scale(.8);
+  }
+  #gui-modes-floorplan {
+    position: relative;
+  }
+  #gui-modes-dollhouse {
+    position: relative;
+  }
 }
 
 // 移动端右上角的盒子
 .isMobileBox {
+  text-align: center;
   color: red;
   position: fixed;
   z-index: 999;
@@ -703,7 +765,10 @@ export default {
   .show {
     margin-top: 8px;
     & > img {
+      margin-left: 6px;
       display: block;
+    }
+    .isMobileBoxTit{
       margin-bottom: 8px;
     }
   }
@@ -711,9 +776,14 @@ export default {
     display: block !important;
     width: 38px;
     & > img {
+      margin-left: 6px;
       width: 38px;
-      margin-left: 0px;
     }
   }
+  .isMobileBoxTit{
+    font-size: 12px;
+    color: #fff;
+    width: 50px;
+  }
 }
 </style>