From 61c3846cd8213fe3a7a5580c653936b4cbf0e3ef Mon Sep 17 00:00:00 2001
From: Jin Lei <jinlei_182@163.com>
Date: 星期三, 15 十一月 2023 18:37:08 +0800
Subject: [PATCH] [细节调整] 1.拆分主菜单，修改切换逻辑 2.按钮移动效果添加
---
src/components/right/right-bottom.vue | 138 ++++++++++++++++++++++-----------------------
1 files changed, 68 insertions(+), 70 deletions(-)
diff --git a/src/components/right/right-bottom.vue b/src/components/right/right-bottom.vue
index 64abb08..a11df08 100644
--- a/src/components/right/right-bottom.vue
+++ b/src/components/right/right-bottom.vue
@@ -1,7 +1,7 @@
<template>
<div class="rightBottom trigger" id="rightBottom">
<div class="mapTools">
- <!-- <div class="mapTool">
+ <div class="mapTool">
<el-tooltip
class="item"
effect="dark"
@@ -10,38 +10,10 @@
popper-class="item_tooltip"
>
<div class="legend-bg" @click="maskingOut">
- <img class="legendImg" src="@/assets/img/new/mengban.png" />
+ <img class="legendImg" src="@/assets/img/new/mengbanbai.png" />
</div>
</el-tooltip>
- </div> -->
- <!-- <div class="mapTool">
- <el-tooltip
- class="item"
- effect="dark"
- content="鐩告満鍙傛暟"
- placement="left"
- popper-class="item_tooltip"
- >
- <div class="legend-bg" @click="getcamera">
- <img class="legendImg" src="@/assets/img/new/mengban.png" />
- </div>
- </el-tooltip>
- </div> -->
-
- <!-- <div class="mapTool">
- <el-tooltip
- class="item"
- effect="dark"
- content="瓒呭浘"
- placement="left"
- popper-class="item_tooltip"
- >
- <div class="legend-bg" @click="S3M()">
- <img class="legendImg" src="@/assets/img/new/mengban.png" />
- </div>
- </el-tooltip>
- </div> -->
-
+ </div>
<div class="mapTool">
<el-tooltip
class="item"
@@ -55,7 +27,7 @@
</div>
</el-tooltip>
</div>
- <div class="mapTool">
+ <!-- <div class="mapTool">
<el-tooltip
class="item"
effect="dark"
@@ -67,7 +39,7 @@
<img class="dwImg" src="@/assets/img/new/location.png" />
</div>
</el-tooltip>
- </div>
+ </div> -->
<div class="mapTool">
<el-tooltip
class="item"
@@ -94,7 +66,7 @@
</div>
</el-tooltip>
</div>
- <div class="mapTool" v-if="isActive">
+ <!-- <div class="mapTool" v-if="isActive">
<el-tooltip
class="item"
effect="dark"
@@ -119,7 +91,7 @@
<img class="qpImg" src="@/assets/img/new/tuichuquanping.png" />
</div>
</el-tooltip>
- </div>
+ </div> -->
<div class="mapTool">
<el-tooltip
class="item"
@@ -146,6 +118,32 @@
</div>
</el-tooltip>
</div>
+ <!-- <div class="mapTool">
+ <el-tooltip
+ class="item"
+ effect="dark"
+ content="鍦烘櫙蹇収"
+ placement="left"
+ popper-class="item_tooltip"
+ >
+ <div class="legend-bg" @click="screenShot">
+ <img class="legendImg" src="@/assets/img/new/mengban.png" />
+ </div>
+ </el-tooltip>
+ </div> -->
+ <!-- <div class="mapTool">
+ <el-tooltip
+ class="item"
+ effect="dark"
+ content="鐩告満鍙傛暟"
+ placement="left"
+ popper-class="item_tooltip"
+ >
+ <div class="legend-bg" @click="getcamera">
+ <img class="legendImg" src="@/assets/img/new/mengban.png" />
+ </div>
+ </el-tooltip>
+ </div> -->
<!-- <div class="mapTool">
<el-tooltip class="item" effect="dark" content="浜屼笁缁村垏鎹�" placement="left">
<el-button class="tool-23mode" @click="_23mode">
@@ -198,25 +196,21 @@
.trigger {
pointer-events: all;
}
-.mapTools {
- /* margin-bottom: 58px; */
-}
+
.mapTool {
margin: 2px 0;
+}
+.legend-bg:hover {
+ background-image: url("~@/assets/img/new/leftCircle-y.png");
}
.legend-bg {
background-image: url("~@/assets/img/new/leftCircle.png");
background-size: 100%;
background-color: transparent;
- width: 54.5px;
- height: 54.5px;
+ width: 35px;
+ height: 35px;
position: relative;
-}
-.legend-bg:hover {
- background-color: rgba(16, 145, 250, 0.4);
- border-radius: 50%;
cursor: pointer;
- pointer-events: all;
}
.tcqp {
background-color: rgba(0, 138, 252, 0.6);
@@ -225,8 +219,8 @@
/*
.mapTool .el-button {
padding: 0 !important;
- width: 54.5px;
- height: 54.5px;
+ width: 30px;
+ height: 30px;
border: unset;
float: unset;
display: block;
@@ -240,7 +234,7 @@
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
- width: 28px;
+ width: 20px;
}
.button-group-vertical {
@@ -384,28 +378,32 @@
},
maskingOut() {
- // if (!window.maskinglayer) {
- // window.maskinglayer = sgworld.Creator.createImageryProvider(
- // "钂欑増",
- // "wms",
- // {
- // url: "http://10.10.4.116:8070/gisserver/wmsserver/WaiWeiMengBan",
- // layers: "",
- // parameters: {
- // format: "image/png",
- // transparent: true,
- // alpha: 1,
- // },
- // },
- // "0",
- // 15, //zindex
- // true,
- // ""
- // );
- // } else {
- // window.maskinglayer.deleteObject();
- // window.maskinglayer = null;
- // }
+ if (!window.maskinglayer) {
+ window.maskinglayer = sgworld.Creator.createImageryProvider(
+ "钂欑増",
+ "wms",
+ {
+ url: "http://10.10.4.121:8070/gisserver/wmsserver/WaiWeiMengBan",
+ layers: "",
+ parameters: {
+ format: "image/png",
+ transparent: true,
+ alpha: 1,
+ },
+ },
+ "0",
+ 15, //zindex
+ true,
+ ""
+ );
+ } else {
+ window.maskinglayer.deleteObject();
+ window.maskinglayer = null;
+ }
+ },
+ screenShot() {
+ sgworld.tools.browse();
+ sgworld.Analysis.createScreenshot();
},
S3M() {
var promise = Viewer.scene.open(
--
Gitblit v1.9.3