From 27a2d08bbdeec0cef108d171fb314e4ada9be861 Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期四, 16 十一月 2023 10:46:52 +0800
Subject: [PATCH] 信息弹框
---
src/components/menu/tools/special.vue | 159 ++++++++++++++++++++--------------------------------
1 files changed, 61 insertions(+), 98 deletions(-)
diff --git a/src/components/menu/tools/special.vue b/src/components/menu/tools/special.vue
index 2977cfe..f82c78e 100644
--- a/src/components/menu/tools/special.vue
+++ b/src/components/menu/tools/special.vue
@@ -2,52 +2,28 @@
<div class="special" id="special">
<div class="specialTools">
<div class="specialTool" @click="tdglHandle">
- <el-tooltip
- class="item"
- effect="dark"
- content="鍦熷湴绠＄悊"
- placement="top-start"
- popper-class="item_tooltip"
- >
+ <el-tooltip class="item" effect="dark" content="鍦熷湴绠＄悊" placement="top-start" popper-class="item_tooltip">
<el-button>
<img src="@/assets/img/left/ztfx/tdgl.png" />
</el-button>
</el-tooltip>
</div>
<div class="specialTool" @click="stdsj">
- <el-tooltip
- class="item"
- effect="dark"
- content="瑙嗗浘澶ф暟鎹钩鍙�"
- placement="top-start"
- popper-class="item_tooltip"
- >
+ <el-tooltip class="item" effect="dark" content="瑙嗗浘澶ф暟鎹钩鍙�" placement="top-start" popper-class="item_tooltip">
<el-button>
<img src="@/assets/img/left/ztfx/dashuju.png" />
</el-button>
</el-tooltip>
</div>
<div class="specialTool" @click="spjkHandle">
- <el-tooltip
- class="item"
- effect="dark"
- content="瑙嗛鐩戞帶"
- placement="top-start"
- popper-class="item_tooltip"
- >
+ <el-tooltip class="item" effect="dark" content="瑙嗛鐩戞帶" placement="top-start" popper-class="item_tooltip">
<el-button>
<img src="@/assets/img/left/ztfx/spjk.png" />
</el-button>
</el-tooltip>
</div>
<div class="specialTool" @click="jjHandle">
- <el-tooltip
- class="item"
- effect="dark"
- content="琛楁櫙"
- placement="top-start"
- popper-class="item_tooltip"
- >
+ <el-tooltip class="item" effect="dark" content="琛楁櫙" placement="top-start" popper-class="item_tooltip">
<el-button>
<img src="@/assets/img/left/ztfx/jiejing.png" />
</el-button>
@@ -55,26 +31,12 @@
</div>
<div class="specialTool" @click="qytj">
- <el-tooltip
- class="item"
- effect="dark"
- content="鏁版嵁姹囪仛"
- placement="top-start"
- popper-class="item_tooltip"
- >
- <el-button> <img src="@/assets/img/left/ztfx/yqfk.png" /> </el-button
- ></el-tooltip>
+ <el-tooltip class="item" effect="dark" content="鏁版嵁姹囪仛" placement="top-start" popper-class="item_tooltip">
+ <el-button> <img src="@/assets/img/left/ztfx/yqfk.png" /> </el-button></el-tooltip>
</div>
- <div class="specialTool" @click="kuangxuan()">
- <el-tooltip
- class="item"
- effect="dark"
- content="鑼冨洿鏌ヨ"
- placement="top-start"
- popper-class="item_tooltip"
- >
- <el-button> <img src="@/assets/img/left/ztfx/sjxq.png" /> </el-button
- ></el-tooltip>
+ <div class="specialTool" @click="rangeQuery()">
+ <el-tooltip class="item" effect="dark" content="鑼冨洿鏌ヨ" placement="top-start" popper-class="item_tooltip">
+ <el-button> <img src="@/assets/img/left/ztfx/sjxq.png" /> </el-button></el-tooltip>
</div>
<!-- <div class="specialTool" @click="guanxian(openGX)">
<el-tooltip
@@ -121,10 +83,12 @@
width: 111%;
margin-left: -15px;
}
+
.el-button:focus,
.el-button:hover {
background: transparent;
}
+
.special {
position: absolute;
left: 65px;
@@ -135,9 +99,11 @@
background-color: rgba(14, 50, 143, 0.5);
width: 350px;
}
+
.specialTools {
margin-left: 20px;
}
+
.specialTool {
border: 1px solid #999;
border-radius: 5px;
@@ -146,9 +112,11 @@
height: 40px;
margin: 5px;
}
+
.specialTool img {
margin: 4px;
}
+
.specialTools::-webkit-scrollbar {
/*婊氬姩鏉℃暣浣撴牱寮�*/
width: 5px;
@@ -173,6 +141,7 @@
border-radius: 0;
background: rgba(218, 218, 218, 0.1);
}
+
.specialTool:hover {
background: rgba(0, 168, 255, 0.16);
}
@@ -180,9 +149,11 @@
.tool-title {
margin: 1px 10px;
}
+
.tool-title label {
vertical-align: top;
}
+
.special label {
margin-left: 10px;
font-size: 17px;
@@ -191,6 +162,7 @@
/* color: #3d3d3d; */
color: white;
}
+
.el-button {
padding: 0 !important;
font-size: 24px;
@@ -199,14 +171,17 @@
display: block;
background: rgba(0, 0, 0, 0);
}
+
.el-button label {
font-size: 14px;
}
+
.closeTool {
position: absolute;
bottom: 0;
left: 0;
}
+
.active {
background: rgba(0, 168, 255, 0.16);
}
@@ -343,7 +318,7 @@
...mapState(["viewer1Show", "yqfk", "cesiumInit"]),
...mapState(["viewer1Show", "yqfk", "qyEchartsShow"]),
},
- mounted() {},
+ mounted() { },
watch: {
cesiumInit: {
handler(newVal, oldVal) {
@@ -418,7 +393,7 @@
sgworld.drawObj &&
(sgworld.drawObj.drawHandler &&
sgworld.drawObj.drawHandler.destroy(),
- sgworld.drawObj.end && sgworld.drawObj.end());
+ sgworld.drawObj.end && sgworld.drawObj.end());
let props = pick.id.properties;
let screenHeight =
@@ -474,7 +449,7 @@
yqfkHandle() {
this.setYqfk(!this.yqfk);
},
- kuangxuan() {
+ rangeQuery() {
Bus.$emit("showRangeBox", true);
},
tdglHandle() {
@@ -497,7 +472,7 @@
{},
"0",
true,
- function () {}
+ function () { }
);
window.panoramaHandler = new Cesium.ScreenSpaceEventHandler(
Viewer.scene.canvas
@@ -523,7 +498,7 @@
} else {
try {
window.panoramaLayer.deleteObject();
- } catch (e) {}
+ } catch (e) { }
window.panoramaHandler.destroy();
window.panoramaHandler = undefined;
}
@@ -575,15 +550,17 @@
let obj = {};
let lng;
let lat;
+ let isCamera = false;
if (nPickFeature.id.tag) {
let properties = nPickFeature.id.properties;
let propertyNames = nPickFeature.id.properties.propertyNames;
if (propertyNames.indexOf("鐩戞帶鍚�") !== -1) {
+ isCamera = true;
obj["JK鍚嶇О"] = properties["JK鍚嶇О"]._value;
- obj["JK绫诲瀷"] = properties["JK绫诲瀷"]._value;
- obj["鍔熻兘"] = properties["鍔熻兘"]._value;
- obj["鎵�鍦ㄥ尯"] = properties["鎵�鍦ㄥ尯"]._value;
- obj["JK缂栧彿"] = properties["JK缂栧彿"]._value;
+ // obj["JK绫诲瀷"] = properties["JK绫诲瀷"]._value;
+ // obj["鍔熻兘"] = properties["鍔熻兘"]._value;
+ // obj["鎵�鍦ㄥ尯"] = properties["鎵�鍦ㄥ尯"]._value;
+ // obj["JK缂栧彿"] = properties["JK缂栧彿"]._value;
obj["JK鍐呯爜"] = properties["JK鍐呯爜"]._value;
} else {
propertyNames.forEach((item) => {
@@ -602,32 +579,31 @@
lng = nPickFeature.id.positions[0];
lat = nPickFeature.id.positions[1];
}
+ if (!isCamera) {
+ tooltipHTML = "";
+ // console.log(obj);
- tooltipHTML = "";
- // console.log(obj);
+ for (let i in obj) {
+ let value = obj[i];
+ value && (tooltipHTML += `<p>${i}锛�${value || "鏃�"}</p>`);
+ }
- for (let i in obj) {
- let value = obj[i];
- value && (tooltipHTML += `<p>${i}锛�${value || "鏃�"}</p>`);
- }
+ if (tooltip) {
+ tooltip.show(false);
+ tooltip = null;
+ }
+ tooltip = sgworld.Core.CreateResultTooltip(window.Viewer, {
+ color: "black",
+ addY: -40,
+ far: 200000,
+ closeBtn: true,
+ close: () => {
+ this.resetImg();
+ this.resetBorder();
+ },
+ });
- if (tooltip) {
- tooltip.show(false);
- tooltip = null;
- }
-
- tooltip = sgworld.Core.CreateResultTooltip(window.Viewer, {
- color: "black",
- addY: -40,
- far: 200000,
- closeBtn: true,
- close: () => {
- this.resetImg();
- this.resetBorder();
- },
- });
-
- let description = `<div style='background:
+ let description = `<div style='background:
rgba(14, 50, 143, 0.6);
border: 1px solid #205fbc;
border-radius: 5px;
@@ -636,11 +612,11 @@
box-shadow: 0px 1px 10px 0px rgba(3, 10, 26, 0.38);
'>${tooltipHTML}</div>`;
- tooltip.showAt(
- Cesium.Cartesian3.fromDegrees(lng, lat, 0),
- description
- );
-
+ tooltip.showAt(
+ Cesium.Cartesian3.fromDegrees(lng, lat, 0),
+ description
+ );
+ }
//鍏抽棴鍦板潡淇℃伅寮圭獥
Bus.$emit("closeLandInfoPop", true);
layuiLayer.close(SmartEarthPopupData.layerProp);
@@ -807,20 +783,7 @@
});
});
},
- spjkHandle() {
- if (window.sxtkGeojson) {
- window.sxtkGeojson.deleteObject();
- window.sxtkGeojson = null;
- window.sxthandler.destroy();
- //鍏抽棴寮圭獥
- Bus.$emit("closeRightPop", true);
- layuiLayer.close(SmartEarthPopupData.layerProp);
- return;
- } else {
- Bus.$emit("showSPJK");
- // this.spjkLoad();
- }
- },
+
handleCommand(command) {
switch (command) {
case "qytj":
--
Gitblit v1.9.3