Ver Fonte

Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

maxiaoxiao há 9 meses atrás
pai
commit
a05d8bd2c0
1 ficheiros alterados com 136 adições e 163 exclusões
  1. 136 163
      src/views/map3d.vue

+ 136 - 163
src/views/map3d.vue

@@ -4,7 +4,10 @@
     <div class="header">
     <div class="header">
       <div class="timeline">
       <div class="timeline">
         <div class="timeline-item" v-html="formattedText"></div>
         <div class="timeline-item" v-html="formattedText"></div>
-        <div class="timeline-item timeline-item-time" v-html="formattedTime"></div>
+        <div
+          class="timeline-item timeline-item-time"
+          v-html="formattedTime"
+        ></div>
       </div>
       </div>
       <div class="menuClass" id="menuClass">
       <div class="menuClass" id="menuClass">
         <!-- <div
         <!-- <div
@@ -15,44 +18,87 @@
         >
         >
           {{ item.title }}
           {{ item.title }}
         </div> -->
         </div> -->
-        <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleMenuSelect"
-          background-color="rgba(4,16,36,0)" text-color="white" active-text-color="white">
+        <el-menu
+          :default-active="activeIndex"
+          class="el-menu-demo"
+          mode="horizontal"
+          @select="handleMenuSelect"
+          background-color="rgba(4,16,36,0)"
+          text-color="white"
+          active-text-color="white"
+        >
           <template v-for="(item, index) in menu_left">
           <template v-for="(item, index) in menu_left">
             <el-menu-item v-if="!item.children" :index="item.path">{{
             <el-menu-item v-if="!item.children" :index="item.path">{{
               item.title
               item.title
             }}</el-menu-item>
             }}</el-menu-item>
-            <el-submenu :index="index" v-if="item.children && item.children.length > 0">
+            <el-submenu
+              :index="index"
+              v-if="item.children && item.children.length > 0"
+            >
               <template slot="title">{{ item.title }}</template>
               <template slot="title">{{ item.title }}</template>
 
 
               <template v-for="(subitem, subindex) in item.children">
               <template v-for="(subitem, subindex) in item.children">
-                <el-menu-item v-if="!subitem.children" popper-class="el-menu-item-popper" :index="subitem.path">{{
-                  subitem.title }}</el-menu-item>
-                <el-submenu :index="index + '-' + subindex" v-if="subitem.children && subitem.children.length > 0">
+                <el-menu-item
+                  v-if="!subitem.children"
+                  popper-class="el-menu-item-popper"
+                  :index="subitem.path"
+                  >{{ subitem.title }}</el-menu-item
+                >
+                <el-submenu
+                  :index="index + '-' + subindex"
+                  v-if="subitem.children && subitem.children.length > 0"
+                >
                   <template slot="title">{{ subitem.title }}</template>
                   <template slot="title">{{ subitem.title }}</template>
-                  <el-menu-item :index="submenu.path" v-for="(submenu, sunindex) in subitem.children" :key="sunindex">{{
-                    submenu.title }}</el-menu-item>
+                  <el-menu-item
+                    :index="submenu.path"
+                    v-for="(submenu, sunindex) in subitem.children"
+                    :key="sunindex"
+                    >{{ submenu.title }}</el-menu-item
+                  >
                 </el-submenu>
                 </el-submenu>
               </template>
               </template>
             </el-submenu>
             </el-submenu>
           </template>
           </template>
         </el-menu>
         </el-menu>
 
 
-        <el-menu :default-active="activeIndex" class="el-menu-demo1" mode="horizontal" @select="handleMenuSelect1"
-          background-color="rgb(4,16,36,0)" text-color="white" active-text-color="white">
+        <el-menu
+          :default-active="activeIndex"
+          class="el-menu-demo1"
+          mode="horizontal"
+          @select="handleMenuSelect1"
+          background-color="rgb(4,16,36,0)"
+          text-color="white"
+          active-text-color="white"
+        >
           <template v-for="(item, index) in menu_right">
           <template v-for="(item, index) in menu_right">
             <el-menu-item v-if="!item.children" :index="item.path">{{
             <el-menu-item v-if="!item.children" :index="item.path">{{
               item.title
               item.title
             }}</el-menu-item>
             }}</el-menu-item>
-            <el-submenu class="right-submenu" :index="index" v-if="item.children && item.children.length > 0">
+            <el-submenu
+              class="right-submenu"
+              :index="index"
+              v-if="item.children && item.children.length > 0"
+            >
               <template slot="title">{{ item.title }}</template>
               <template slot="title">{{ item.title }}</template>
 
 
               <template v-for="(subitem, subindex) in item.children">
               <template v-for="(subitem, subindex) in item.children">
-                <el-menu-item v-if="!subitem.children" popper-class="el-menu-item-popper" :index="subitem.path">{{
-                  subitem.title }}</el-menu-item>
-                <el-submenu :index="index + '-' + subindex" v-if="subitem.children && subitem.children.length > 0">
+                <el-menu-item
+                  v-if="!subitem.children"
+                  popper-class="el-menu-item-popper2"
+                  :index="subitem.path"
+                  >{{ subitem.title }}</el-menu-item
+                >
+                <el-submenu
+                  :index="index + '-' + subindex"
+                  v-if="subitem.children && subitem.children.length > 0"
+                >
                   <template slot="title">{{ subitem.title }}</template>
                   <template slot="title">{{ subitem.title }}</template>
-                  <el-menu-item :index="submenu.path" v-for="(submenu, sunindex) in subitem.children" :key="sunindex">{{
-                    submenu.title }}</el-menu-item>
+                  <el-menu-item
+                    :index="submenu.path"
+                    v-for="(submenu, sunindex) in subitem.children"
+                    :key="sunindex"
+                    >{{ submenu.title }}</el-menu-item
+                  >
                 </el-submenu>
                 </el-submenu>
               </template>
               </template>
             </el-submenu>
             </el-submenu>
@@ -74,8 +120,15 @@
       <div class="user">
       <div class="user">
         <span>admin</span>
         <span>admin</span>
         <el-tooltip class="item" effect="dark" content="退出" placement="top">
         <el-tooltip class="item" effect="dark" content="退出" placement="top">
-          <i style="width: 24px;height: 24px;background-image: url('/static/images/overview/icon_LogOut.png'); cursor: pointer;"
-            @click="exit"></i>
+          <i
+            style="
+              width: 24px;
+              height: 24px;
+              background-image: url('/static/images/overview/icon_LogOut.png');
+              cursor: pointer;
+            "
+            @click="exit"
+          ></i>
         </el-tooltip>
         </el-tooltip>
       </div>
       </div>
     </div>
     </div>
@@ -93,20 +146,24 @@
     <div class="masking_bottom"></div>
     <div class="masking_bottom"></div>
     <div class="masking_right"></div>
     <div class="masking_right"></div>
     <div class="masking_right"></div> -->
     <div class="masking_right"></div> -->
-    <el-drawer :visible.sync="drawer" :with-header="false" :append-to-body="true" :show-close="false">
+    <el-drawer
+      :visible.sync="drawer"
+      :with-header="false"
+      :append-to-body="true"
+      :show-close="false"
+    >
       <!-- <iframe :src="aiModel" style="width: 100%; height: 100%; position: absolute"></iframe> -->
       <!-- <iframe :src="aiModel" style="width: 100%; height: 100%; position: absolute"></iframe> -->
-      <aiModel @close="drawer=false"></aiModel>
+      <aiModel @close="drawer = false"></aiModel>
     </el-drawer>
     </el-drawer>
-
   </div>
   </div>
 </template>
 </template>
 
 
 <script>
 <script>
 import { getRouters } from "@/api/menu";
 import { getRouters } from "@/api/menu";
-import aiModel from "./aiModel/index.vue"
+import aiModel from "./aiModel/index.vue";
 export default {
 export default {
   name: "app",
   name: "app",
-  components: {aiModel},
+  components: { aiModel },
   data() {
   data() {
     return {
     return {
       menu_left: [],
       menu_left: [],
@@ -117,7 +174,7 @@ export default {
       formattedTime: "",
       formattedTime: "",
       activeMenuId: 0,
       activeMenuId: 0,
       drawer: false,
       drawer: false,
-      aiModel: window.aiModel
+      aiModel: window.aiModel,
     };
     };
   },
   },
   created() {
   created() {
@@ -139,24 +196,20 @@ export default {
     handleMenuSelect(item) {
     handleMenuSelect(item) {
       this.$router.push({ path: item });
       this.$router.push({ path: item });
 
 
-
-
       // 菜单切换的时候取消左或者右高亮菜单
       // 菜单切换的时候取消左或者右高亮菜单
-      // var lis = document.querySelectorAll('.el-menu-demo1 li');
+      var lis = document.querySelectorAll('.el-menu-demo1 li');
       // console.log(lis, "lis");
       // console.log(lis, "lis");
 
 
-      // lis.forEach(function (li) {
-      //   li.classList.remove('is-active');
-      // });
+      lis.forEach(function (li) {
+        li.classList.remove('is-active');
+      });
     },
     },
     handleMenuSelect1(item) {
     handleMenuSelect1(item) {
-
-
       this.$router.push({ path: item });
       this.$router.push({ path: item });
-      // var lis = document.querySelectorAll('.el-menu-demo li');
-      // lis.forEach(function (li) {
-      //   li.classList.remove('is-active');
-      // });
+      var lis = document.querySelectorAll('.el-menu-demo li');
+      lis.forEach(function (li) {
+        li.classList.remove('is-active');
+      });
     },
     },
     updateTime() {
     updateTime() {
       let s = new Date().toLocaleString().split(" ");
       let s = new Date().toLocaleString().split(" ");
@@ -175,9 +228,7 @@ export default {
       this.$router.push({ path: item.path });
       this.$router.push({ path: item.path });
     },
     },
     GetRouters() {
     GetRouters() {
- 
       getRouters().then((res) => {
       getRouters().then((res) => {
-
         this.menu_left = res.data[0].children.slice(0, 3);
         this.menu_left = res.data[0].children.slice(0, 3);
         this.menu_right = res.data[0].children.slice(3, 5);
         this.menu_right = res.data[0].children.slice(3, 5);
 
 
@@ -277,9 +328,11 @@ export default {
   height: 70px;
   height: 70px;
   position: absolute;
   position: absolute;
   z-index: 100;
   z-index: 100;
-  background: linear-gradient(to bottom,
-      rgba(6, 37, 66, 1),
-      rgba(26, 28, 53, 0));
+  background: linear-gradient(
+    to bottom,
+    rgba(6, 37, 66, 1),
+    rgba(26, 28, 53, 0)
+  );
 }
 }
 
 
 .header {
 .header {
@@ -316,7 +369,6 @@ export default {
   //   background: -webkit-linear-gradient(right, RGBA(8, 40, 60, 1), RGBA(11, 32, 61, 1));
   //   background: -webkit-linear-gradient(right, RGBA(8, 40, 60, 1), RGBA(11, 32, 61, 1));
 
 
   // }
   // }
-
 }
 }
 
 
 .masking_left {
 .masking_left {
@@ -324,11 +376,9 @@ export default {
   height: 100%;
   height: 100%;
   background: no-repeat;
   background: no-repeat;
   background-image: url("/static/images/overview/masking_left.png");
   background-image: url("/static/images/overview/masking_left.png");
-
 }
 }
 
 
 .masking_bottom {
 .masking_bottom {
-
   width: 100%;
   width: 100%;
   height: 140px;
   height: 140px;
   background: no-repeat;
   background: no-repeat;
@@ -357,7 +407,11 @@ export default {
   line-height: 60px;
   line-height: 60px;
   font-size: 25px;
   font-size: 25px;
   // color: white;
   // color: white;
-  background: linear-gradient(180deg, rgba(212, 250, 255, 1) 10%, rgba(54, 215, 215, 1) 100%);
+  background: linear-gradient(
+    180deg,
+    rgba(212, 250, 255, 1) 10%,
+    rgba(54, 215, 215, 1) 100%
+  );
   -webkit-background-clip: text;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   -webkit-text-fill-color: transparent;
   font-family: auto;
   font-family: auto;
@@ -408,7 +462,6 @@ export default {
   text-align: center;
   text-align: center;
   font-weight: bold;
   font-weight: bold;
 }
 }
-
 .el-menu-demo {
 .el-menu-demo {
   border: none !important;
   border: none !important;
   height: -2vh;
   height: -2vh;
@@ -421,57 +474,44 @@ export default {
   font-weight: 700;
   font-weight: 700;
   margin-left: 4vw;
   margin-left: 4vw;
 
 
-  .el-menu--horizontal>.el-menu-item.is-active,
+  .el-menu--horizontal > .el-menu-item.is-active,
   .el-menu-item.is-active,
   .el-menu-item.is-active,
   .el-submenu.is-active {
   .el-submenu.is-active {
     background-image: url("/static/images/overview/left_mune_button_click.png");
     background-image: url("/static/images/overview/left_mune_button_click.png");
     background-size: 100% 100%;
     background-size: 100% 100%;
   }
   }
-
 }
 }
-
+.el-submenu,
+.is-opend {
+  background-image: url("/static/images/overview/left_mune_button.png");
+  background-size: 100% 100%;
+  height: 34px;
+  line-height: 34px !important;
+  margin: 0;
+  border: none;
+  color: white;
+  width: 120px;
+  margin-right: -1rem;
+}
 .el-menu-demo1 {
 .el-menu-demo1 {
   border: none !important;
   border: none !important;
-  height: 5%;
+  height: -2vh;
   background-color: transparent;
   background-color: transparent;
+  background-color: rgba(4, 16, 36, 0) !important;
+  font-weight: 700;
+  margin-left: 4vw;
+  height: 5%;
   position: fixed;
   position: fixed;
   right: 14.5vw;
   right: 14.5vw;
   top: 1.1rem;
   top: 1.1rem;
-  background-color: rgba(4, 16, 36, 0) !important;
-  font-weight: 700;
 
 
-  .el-menu-item {
-    background-image: url("/static/images/overview/right_mune_button.png");
+  .el-menu--horizontal > .el-menu-item.is-active,
+  .el-menu-item.is-active,
+  .el-submenu.is-active {
+    background-image: url("/static/images/overview/right_mune_button_click.png");
     background-size: 100% 100%;
     background-size: 100% 100%;
-    float: left;
-    height: 34px;
-    line-height: 34px !important;
-    margin: 0;
-    border: none;
-    color: white;
-    width: 120px;
-    // margin-right: -1.2rem;
-    margin-right: -0.8vw;
   }
   }
-
-  // .el-menu-item:hover {
-  //   font-weight: bold;
-  //   color: white !important;
-  //   background-image: url("/static/images/overview/right_mune_button_click.png");
-
-  // }
-
-  // // 暂时隐藏
-
-  // .el-menu--horizontal>.el-menu-item.is-active,
-  // .el-menu-item.is-active,
-  // .el-submenu.is-active {
-  //   background-image: url("/static/images/overview/right_mune_button_click.png");
-  //   background-size: 100% 100%;
-  // }
-
 }
 }
-
 .el-menu-item {
 .el-menu-item {
   background-image: url("/static/images/overview/left_mune_button.png");
   background-image: url("/static/images/overview/left_mune_button.png");
   background-size: 100% 100%;
   background-size: 100% 100%;
@@ -483,27 +523,26 @@ export default {
   color: white;
   color: white;
   width: 120px;
   width: 120px;
   margin-right: -1vw;
   margin-right: -1vw;
+  text-align: center;
 }
 }
-
 .el-menu-item:hover {
 .el-menu-item:hover {
+  background-color: transparent !important;
   font-weight: bold;
   font-weight: bold;
   color: white !important;
   color: white !important;
   background-image: url("/static/images/overview/left_mune_button_click.png");
   background-image: url("/static/images/overview/left_mune_button_click.png");
-
-}
-
-.el-submenu,
-.is-opend {
-  background-image: url("/static/images/overview/left_mune_button.png");
-  background-size: 100% 100%;
-  height: 34px;
-  line-height: 34px !important;
-  margin: 0;
-  border: none;
-  color: white;
-  width: 120px;
-  margin-right: -1rem;
 }
 }
+// .right-submenu,
+// .is-opend {
+//   background-image: url("/static/images/overview/right_mune_button.png");
+//   background-size: 100% 100%;
+//   height: 34px;
+//   line-height: 34px !important;
+//   margin: 0;
+//   border: none;
+//   color: white;
+//   width: 120px;
+//   margin-right: -1rem;
+// }
 .right-submenu,
 .right-submenu,
 .is-opend {
 .is-opend {
   background-image: url("/static/images/overview/right_mune_button.png");
   background-image: url("/static/images/overview/right_mune_button.png");
@@ -516,67 +555,6 @@ export default {
   width: 120px;
   width: 120px;
   margin-right: -1rem;
   margin-right: -1rem;
 }
 }
-
-// .right-submenu{
-//   /deep/.el-menu-item {
-//     background-image: url("/static/images/overview/right_mune_button.png") !important;
-//   background-size: 100% 100%;
-//   float: left;
-//   height: 37px;
-//   line-height: 43px !important;
-//   margin: 0;
-//   border: none;
-//   color: white;
-//   width: 120px;
-//   margin-right: -1vw;
-// }
-// }
-
-// .right-submenu,.el-menu-item:hover {
-//   font-weight: bold;
-//   color: white !important;
-//   background-image: url("/static/images/overview/right_mune_button_click.png");
-
-// }
-
-.el-menu--popup .el-submenu {
-  width: 100% !important;
-
-  margin-top: 10px;
-
-}
-
-.el-menu--popup li {
-  margin-top: 10px;
-
-}
-
-.el-submenu:hover {
-  font-weight: bold;
-  color: white !important;
-}
-
-
-.el-menu--horizontal>.el-submenu.is-active .el-submenu__title {
-  border: none !important;
-  color: white !important;
-}
-
-.el-submenu__title {
-  height: 39px !important;
-  line-height: 43px !important;
-  border: none !important;
-  color: white !important;
-}
-
-/deep/ .el-menu-item.is-active,
-/deep/.el-submenu.is-active,
-/deep/ .el-submenu.is-active,
-/deep/.el-submenu__title {
-  border: none;
-  color: white;
-}
-
 /deep/ .el-menu-item,
 /deep/ .el-menu-item,
 /deep/ .el-submenu__title,
 /deep/ .el-submenu__title,
 /deep/ .is-opened {
 /deep/ .is-opened {
@@ -588,14 +566,9 @@ export default {
   text-align: center !important;
   text-align: center !important;
 }
 }
 
 
-/deep/ .el-submenu__icon-arrow {
-  position: absolute;
-  right: 50px;
-}
 </style>
 </style>
 <style>
 <style>
 .el-menu--popup {
 .el-menu--popup {
   box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0) !important;
   box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0) !important;
-
 }
 }
 </style>
 </style>