From 04dae190af26730e8e0dcfb7cb4ec066400422f3 Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期一, 14 八月 2023 16:43:25 +0800
Subject: [PATCH] 生产环境加载高德地图显示空白修改

---
 src/components/Screen/bottom.vue |  349 ++++++++++++++++++++++++++++++++++++++++++++++++----------
 1 files changed, 288 insertions(+), 61 deletions(-)

diff --git a/src/components/Screen/bottom.vue b/src/components/Screen/bottom.vue
index 28de408..a9327a1 100644
--- a/src/components/Screen/bottom.vue
+++ b/src/components/Screen/bottom.vue
@@ -3,33 +3,80 @@
     <div class="bottom1">
       <div class="bottom11"></div>
       <div class="bottom12">
-        <div :class="currMenu == item.menuName ? 'active' : ''" v-for="item in menuList" :key="item.menuName"
-          class="bottombtn" @click="handleMenuClick(item)">
-          <el-popover popper-class="popover" placement="top" width="100" trigger="click">
+        <div
+          :class="currMenu == item.menuName ? 'active' : ''"
+          v-for="item in menuList"
+          :key="item.menuName"
+          class="bottombtn"
+          @click="handleMenuClick(item)"
+        >
+          <el-popover
+            popper-class="popover"
+            placement="top"
+            width="100"
+            trigger="click"
+          >
             <!-- 鍐呭 -->
             <span slot="reference">{{ item.menuName }}</span>
             <div class="popover-content">
               <div class="popover-content__header">椤圭洰淇℃伅</div>
 
               <div class="popover-content__search">
-                <el-input size="mini" placeholder="璇疯緭鍏ュ唴瀹�" v-model="searchName" @change="handleSearchChange(item)">
-                  <el-button slot="append" icon="el-icon-search"></el-button>
+                <el-input
+                  size="mini"
+                  placeholder="璇疯緭鍏ュ唴瀹�"
+                  v-model="searchName"
+                  @change="handleSearchChange(item)"
+                >
+                  <el-button
+                    slot="append"
+                    icon="el-icon-search"
+                  ></el-button>
                 </el-input>
               </div>
               <div class="popover-content__list">
-                <div class="popover-content__list__item" v-for="(child, i) in currMenuList" :key="child.id + i"
-                  :class="currProject == child.name ? 'active' : ''" @click="handlePopoverClick(child)"
-                  :title="child.name">
+                <div
+                  class="popover-content__list__item"
+                  v-for="(child, i) in currMenuList"
+                  :key="child.id + i"
+                  :class="currProject == child.name ? 'active' : ''"
+                  @click="handlePopoverClick(child)"
+                  :title="child.name"
+                >
                   {{ child.name.slice(0, 8) }}
                 </div>
               </div>
             </div>
           </el-popover>
         </div>
+
+        <div
+          class="bottombtn"
+          :class="showTree ? 'active' : ''"
+          @click="handleTree"
+        >
+          鍥惧眰绠$悊
+        </div>
       </div>
       <div class="bottom13">
-        <img :src="yxImg" @click="ChangeBaseLayer('yx')"  title="褰卞儚鍥�" />
-        <img :src="xrImg" @click="ChangeBaseLayer('xr')"  title="鏅曟覆鍥�"/>
+        <div
+          class="bottom13-wrapper"
+          :class="isExpand ? 'expend' : 'fold'"
+          @mouseover="handleMouseOver"
+          @mouseout="handleMouseOut"
+        >
+          <div
+            v-for="item in yxList"
+            yxList
+            :class="item.name == currYX && isExpand ? [item.key, 'active'] : item.key"
+            @click="ChangeBaseLayer(item.name)"
+            :title="item.name"
+          ></div>
+
+          <!-- <transition name="slide-fade">
+            <p v-if="show">hello</p>
+          </transition> -->
+        </div>
       </div>
     </div>
     <div class="bottom2">
@@ -44,6 +91,7 @@
   countProjectTour,
   countProjectDisplay,
   countProjectLocation,
+  selectProjectFileList,
 } from "@/api/screen.js"
 import { wktToGeoJSON } from "@terraformer/wkt"
 
@@ -52,7 +100,7 @@
     return {
       YXState: true,
       XRState: true,
-      yunxuanLayer: null,//鍏ㄧ悆鐪╂檿鍥�
+      yunxuanLayer: null, //鍏ㄧ悆鐪╂檿鍥�
       yxImg: require("../../assets/img/Screen/yximg.png"),
       xrImg: require("../../assets/img/Screen/bdimg.png"),
       currMenu: "涓撻灞曠ず",
@@ -139,12 +187,31 @@
           ],
         },
       ],
+      showTree: false,
+      currYX: "褰卞儚鍥�",
+      yxList: [
+        {
+          name: "褰卞儚鍥�",
+          key: "yingxiang",
+        },
+        {
+          name: "娉ㄨ鍥�",
+          key: "zhuji",
+        },
+        {
+          name: "鏅曟覆鍥�",
+          key: "yunxuan",
+        },
+      ],
+      isExpand: false
     }
   },
   computed: {
     currMenuList() {
+
       const menu = this.menuList.find(item => item.menuName == this.currMenu)
       const filterChildren = []
+
       const value = this.searchName
       menu.children.forEach(item => {
         if (item.name && item.name.includes(value)) {
@@ -159,52 +226,90 @@
     this.getCountProjectTour()
   },
   methods: {
-    ChangeBaseLayer(parm) {
-      if (parm == 'yx') {
-        if (this.YXState) {
-          //this.yxImg = require("../../assets/img/Screen/bdimg.png")
-          //鍔犺浇鐧惧害褰卞儚
-          Viewer.imageryLayers._layers[1].show = true
-          Viewer.imageryLayers._layers[2].show = false
-          Viewer.imageryLayers._layers[3].show = false
-        } else {
-          //this.yxImg = require("../../assets/img/Screen/yximg.png")
-          Viewer.imageryLayers._layers[1].show = false
-          Viewer.imageryLayers._layers[2].show = true
-          Viewer.imageryLayers._layers[3].show = true
-        }
-        this.YXState = !this.YXState
+    ChangeBaseLayer(name) {
+      this.currYX = name
+
+      if (is_production) {
+        Viewer.imageryLayers._layers[2].show = false
+        Viewer.imageryLayers._layers[1].show = false
+      } else {
+        Viewer.imageryLayers._layers[1].show = false
+
       }
 
-      if (parm == 'xr') {
-        if (yunxuanLayer == null) {
-          var urls = "https://tiles3.geovisearth.com/base/v1/ter"
-          // 鏄熷浘鍦扮悆鍦板舰鏅曟覆
-          yunxuanLayer = sgworld.Creator.createUrlTemplateImageryProvider(
-            "鏄熷浘鍦扮悆鍦板舰鏅曟覆",
-            {
-              url:
-                urls +
-                "/{z}/{x}/{y}?format=webp&token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
-            },
-            "0",
-            undefined,
-            true,
-            ""
-          )
-        }
-        if (this.XRState) {
-          yunxuanLayer.item.show = true;
-        } else {
-          yunxuanLayer.item.show = false;
-        }
-        this.XRState = !this.XRState;
+      if (yunxuanLayer) {
+        Viewer.imageryLayers.remove(yunxuanLayer);
+        yunxuanLayer = null
       }
 
+      switch (name) {
+        case "鏅曟覆鍥�":
+          if (yunxuanLayer == null) {
+            // var urls = "https://tiles3.geovisearth.com/base/v1/ter"
+            // // 鏄熷浘鍦扮悆鍦板舰鏅曟覆
+            // yunxuanLayer = sgworld.Creator.createUrlTemplateImageryProvider(
+            //   "鏄熷浘鍦扮悆鍦板舰鏅曟覆",
+            //   {
+            //     url:
+            //       urls +
+            //       "/{z}/{x}/{y}?format=webp&token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
+            //   },
+            //   "0",
+            //   undefined,
+            //   true,
+            //   ""
+            // )
+            var urls = "http://t0.tianditu.com/ter_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=ter&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk=";
+            var tokne = "94a34772eb88317fcbf8428e10448561"
+            if (is_production) {
+              var baseUrl_yx = window.sceneConfig.baseUrl_yx;
+              if (baseUrl_yx.indexOf('{host}') > -1) {
+                baseUrl_yx = baseUrl_yx.replace("{host}", iisHost)
+              }
+
+              yunxuanLayer = Viewer.imageryLayers.addImageryProvider(
+                new Cesium.UrlTemplateImageryProvider({
+                  url: baseUrl_yx,
+                  maximumLevel: 22,
+                })
+              );
+            } else {
+              yunxuanLayer = Viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
+                url: urls + tokne,
+                layer: "tdtImgLayer",
+                style: "default",
+                format: "image/jpeg",
+                tileMatrixSetID: "GoogleMapsCompatible",
+              }))
+            }
 
 
+            Viewer.imageryLayers.lowerToBottom(yunxuanLayer);//灏嗗浘灞傜Щ鍒版渶搴曞眰
+            Viewer.imageryLayers.raise(yunxuanLayer);//灏嗗浘灞備笂绉讳竴灞�
+          }
+
+
+
+          break
+        case "褰卞儚鍥�":
+
+          if (is_production) {
+            Viewer.imageryLayers._layers[1].show = true
+          }
+          break
+        case "娉ㄨ鍥�":
+          if (is_production) {
+            Viewer.imageryLayers._layers[2].show = true
+          } else {
+            Viewer.imageryLayers._layers[1].show = true
+          }
+          break
+        default:
+          break
+      }
     },
     handleMenuClick(menu) {
+
       this.currMenu = menu.menuName
     },
     handlePopoverClick(child) {
@@ -215,11 +320,16 @@
           this.showPathLine(child)
           break
         case "椤圭洰灞曠ず":
+          this.$bus.$emit("changeProjectLayer", child.id)
           this.DisplayCurrentProject(child)
+          this.changeProject(child)
+          this.$bus.$emit("changeProjectCode", child.id)
           break
         case "涓撻灞曠ず":
+          this.$bus.$emit("changeProjectLayer", child.id)
           this.changeProject(child)
           break
+
         default:
           break
       }
@@ -227,6 +337,9 @@
 
     //宸ョ▼宸¤
     async showPathLine(params) {
+
+      this.$bus.$emit("closeLeftAndRightMenu", true)
+
       const line = wktToGeoJSON(params.wkt)
       const position = line.coordinates[0]
       const result = []
@@ -235,7 +348,7 @@
         pos.push(1000)
         result.push(...pos)
       })
-      // console.log("line", position)
+
 
       window.sgworld.Creator.getFlyData(result, data => {
         data.showPoint = false
@@ -247,6 +360,7 @@
         window.PathAnimationData = {
           flyData: data,
         }
+        var that = this
         window.PathAnimationData.winIndex = layer.open({
           type: 2,
           title: "宸ョ▼宸¤",
@@ -257,6 +371,7 @@
           content: SmartEarthRootUrl + "Workers/path/ProjectPath.html",
           end: function () {
             PathAnimationData.fly && PathAnimationData.fly.exit()
+            that.$bus.$emit("closeLeftAndRightMenu", false)
           },
         })
       })
@@ -264,8 +379,6 @@
 
     //椤圭洰灞曠ず
     DisplayCurrentProject(params) {
-      
-
       //鎵撳紑鎴栬�呭姞杞藉浘灞�
 
       //椋炲埌鎸囧畾浣嶇疆
@@ -295,23 +408,36 @@
     },
     handleSearchChange(currMenu) { },
     async getCountProjectDisplay() {
-      const res = await countProjectLocation()
+      // const res = await countProjectLocation()
+      // if (res.code === 200) {
+      //   const menu = this.menuList.find(item => item.menuName == "椤圭洰灞曠ず")
+      //   menu.children = res.result.map(item => {
+      //     return {
+      //       name: item.projname,
+      //       id: item.projname,
+      //       wkt: item.wkt,
+      //     }
+      //   })
+      // }
+      const res = await selectProjectFileList()
       if (res.code === 200) {
         const menu = this.menuList.find(item => item.menuName == "椤圭洰灞曠ず")
         menu.children = res.result.map(item => {
           return {
-            name: item.projname,
-            id: item.projname,
+            name: item.name,
+            id: item.code,
             wkt: item.wkt,
           }
         })
-
       }
+      selectProjectFileList
     },
     async getCountProjectTour() {
       const res = await countProjectTour()
       if (res.code === 200) {
+
         const menu = this.menuList.find(item => item.menuName == "宸ョ▼宸¤")
+
         menu.children = res.result.map(item => {
           return {
             name: item.projname,
@@ -319,12 +445,46 @@
             wkt: item.wkt,
           }
         })
-
       }
     },
     //涓撻灞曠ず
     changeProject(params) {
-      this.$bus.$emit('changeProject', params.name)
+      this.$bus.$emit("changeProject", params.name)
+      var lon, lat, height;
+      if (params.name.indexOf("鍏ㄥ浗") != -1) {
+        height = 20000000;
+        lon = 110;
+        lat = 32;
+        window.viewer.camera.flyTo({
+          destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height),
+          orientation: {
+            heading: Cesium.Math.toRadians(0),
+            pitch: Cesium.Math.toRadians(-90),
+          },
+        })
+      } else if (params.name.indexOf("鍏ㄧ悆") != -1) {
+        lon = 85;
+        lat = 25;
+        height = 30000000;
+        window.viewer.camera.flyTo({
+          destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height),
+          orientation: {
+            heading: Cesium.Math.toRadians(0),
+            pitch: Cesium.Math.toRadians(-90),
+          },
+        })
+      }
+
+    },
+    handleTree(params) {
+      this.showTree = !this.showTree
+      this.$bus.$emit("changeTree", this.showTree)
+    },
+    handleMouseOver() {
+      this.isExpand = true
+    },
+    handleMouseOut() {
+      this.isExpand = false
     }
   },
 }
@@ -356,16 +516,83 @@
       align-items: center;
       justify-content: space-around;
     }
-
     .bottom13 {
+      display: flex;
+      flex-direction: row-reverse;
+    }
+    -webkit-transition-property: width;
+    .expend {
+      transition-property: width;
+      -webkit-transition-duration: 0.5s;
+      transition-duration: 0.5s;
+      width: 320px !important;
+    }
+    .fold {
+      -webkit-transition-property: width;
+      transition-property: width;
+      -webkit-transition-duration: 0.5s;
+      transition-duration: 0.5s;
+      width: 100px !important;
+    }
+    .bottom13-wrapper {
+      height: 80px;
+      width: 100px;
+      -webkit-transition-property: width;
+      transition-property: width;
+      -webkit-transition-duration: 0.5s;
+      transition-duration: 0.5s;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: flex-end;
+      position: relative;
+      overflow: hidden;
+      &:hover {
+        .zhuji {
+          right: 100px;
+        }
+        .yunxuan {
+          right: 200px;
+        }
+      }
 
+      .yingxiang,
+      .zhuji,
+      .yunxuan {
+        margin-right: 10px;
+        width: 92px;
+        height: 61px;
+        background: url(~@/assets/img/Screen/yximg.png);
+        background-size: 100% 100%;
+        background-position: 0 0;
+        position: absolute;
+        z-index: 3;
+        right: 0;
+        -webkit-transition-property: right;
+        transition-property: right;
+        -webkit-transition-duration: 0.5s;
+        transition-duration: 0.5s;
+      }
+      .zhuji {
+        z-index: 2;
+        background-position: 0px -61px;
+        right: 5px;
+        background: url(~@/assets/img/Screen/bdimg.png);
+        background-size: 100% 100%;
+      }
+      .yunxuan {
+        z-index: 1;
+        background-position: 0 -122px;
+        right: 10px;
+        background: url(~@/assets/img/Screen/geovisearth-ter.png);
+        background-size: 100% 100%;
+      }
+      .active {
+        border: 1px solid #409eff;
+      }
       img {
         cursor: pointer;
-        margin-right: 30px;
+        margin-right: 10px;
         width: 92px;
         height: 61px;
       }
@@ -377,7 +604,7 @@
       background: url(~@/assets/img/Screen/centerbtn.png);
       background-size: 100% 100%;
       background-repeat: no-repeat;
-      font-size: 1rem;
+      font-size: 16px;
       display: flex;
       align-items: center;
       justify-content: center;

--
Gitblit v1.9.3