From eea0af2e6491549ef5b1b0044189a9c055b28f75 Mon Sep 17 00:00:00 2001
From: TreeWish <1131093754@qq.com>
Date: 星期一, 27 二月 2023 19:19:16 +0800
Subject: [PATCH] 合并项目展示介绍等基础信息
---
src/components/Screen/bottom.vue | 115 +++++++++++++++++++++++++++++++++++----------------------
1 files changed, 70 insertions(+), 45 deletions(-)
diff --git a/src/components/Screen/bottom.vue b/src/components/Screen/bottom.vue
index bcf1037..f937682 100644
--- a/src/components/Screen/bottom.vue
+++ b/src/components/Screen/bottom.vue
@@ -3,43 +3,23 @@
<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-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>
@@ -48,7 +28,8 @@
</div>
</div>
<div class="bottom13">
- <img :src="yxImg" @click="ChangeBaseLayer" />
+ <img :src="yxImg" @click="ChangeBaseLayer('yx')" title="褰卞儚鍥�" />
+ <img :src="xrImg" @click="ChangeBaseLayer('xr')" title="鏅曟覆鍥�"/>
</div>
</div>
<div class="bottom2">
@@ -57,6 +38,7 @@
</div>
</template>
<script>
+let yunxuanLayer = null
import PipeLine from "@/assets/json/pipeline.json"
import {
countProjectTour,
@@ -69,7 +51,10 @@
data() {
return {
YXState: true,
+ XRState: true,
+ yunxuanLayer: null,//鍏ㄧ悆鐪╂檿鍥�
yxImg: require("../../assets/img/Screen/yximg.png"),
+ xrImg: require("../../assets/img/Screen/bdimg.png"),
currMenu: "涓撻灞曠ず",
currProject: "",
searchName: "",
@@ -174,20 +159,50 @@
this.getCountProjectTour()
},
methods: {
- ChangeBaseLayer() {
- 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
+ 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
}
- this.YXState = !this.YXState
+
+ 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;
+ }
+
+
+
},
handleMenuClick(menu) {
this.currMenu = menu.menuName
@@ -250,7 +265,7 @@
//椤圭洰灞曠ず
DisplayCurrentProject(params) {
- console.log(params)
+
//鎵撳紑鎴栬�呭姞杞藉浘灞�
@@ -279,7 +294,7 @@
return menu.children
// return menu.children.filter(item => item.name.indexOf(searchName) > -1)
},
- handleSearchChange(currMenu) {},
+ handleSearchChange(currMenu) { },
async getCountProjectDisplay() {
const res = await countProjectLocation()
if (res.code === 200) {
@@ -291,7 +306,7 @@
wkt: item.wkt,
}
})
-
+
}
},
async getCountProjectTour() {
@@ -305,7 +320,7 @@
wkt: item.wkt,
}
})
-
+
}
},
//涓撻灞曠ず
@@ -370,6 +385,7 @@
color: #fff;
font-weight: 600;
cursor: pointer;
+
&.active {
background: url(~@/assets/img/Screen/centerbtnc.png);
background-size: 100% 100%;
@@ -390,6 +406,7 @@
}
}
}
+
.popover {
display: flex;
justify-content: center;
@@ -398,9 +415,11 @@
background: url(~@/assets/img/Screen/centerTooltipBg.png);
background-size: 100% 100%;
border: none;
+
.popper__arrow {
display: none;
}
+
.popover-content {
&__header {
display: flex;
@@ -411,6 +430,7 @@
height: 30px;
font-size: 18px;
color: #fff;
+
&::before,
&::after {
margin: 0 5px;
@@ -422,15 +442,18 @@
height: 8px;
}
}
+
&__search {
margin-top: 8px;
width: 145px;
text-align: center;
+
.el-input {
width: 125px;
height: 21px;
background: rgba(0, 48, 111, 0.2);
border: 0.25px solid #2a80a9;
+
&__inner {
background: rgba(0, 48, 111, 0.2);
border-radius: inherit;
@@ -438,6 +461,7 @@
padding: 0 5px;
color: #fff;
}
+
.el-input-group__append {
width: 32px;
border: none;
@@ -480,6 +504,7 @@
}
}
}
+
::-webkit-scrollbar {
width: 2px;
height: 2px;
--
Gitblit v1.9.3