From 88ecb47aa7ce189f27d2fbfd3a00bd7234ae3b49 Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Fri, 07 Apr 2023 20:48:13 +0800
Subject: [PATCH] 首页显示与隐藏按钮完善
---
src/components/map/index.vue | 42 +++++++++++++++++++++++++++++++++---------
1 files changed, 33 insertions(+), 9 deletions(-)
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 6da7925..641a88f 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -10,20 +10,24 @@
-->
<template>
<div class="viewer-box" id="viewer-container">
- <slot ref="mainContent" name="mainContent"></slot>
- <slot name="showButton"></slot>
+ <slot ref="mainContent" name="mainContent"></slot>
+ <slot name="showButton"></slot>
<div class="over-look-btn">
<el-tooltip content="一键俯视" placement="top" effect="dark">
- <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
- </el-tooltip>
+ <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
+ </el-tooltip>
</div>
<!-- 全屏控制按钮 -->
<div class="screen-full-btn">
- <el-tooltip v-if="isFullscreen" content="缩放" placement="top" effect="dark">
- <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
- </el-tooltip>
- <el-tooltip v-if="!isFullscreen" content="全屏" placement="top" effect="dark">
- <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
+ <!-- <el-tooltip v-if="isFullscreen" content="缩放" placement="top" effect="dark">
+ <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
+ </el-tooltip> -->
+
+ <!-- <el-tooltip v-if="!isFullscreen" content="全屏" placement="top" effect="dark">
+ <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
+ </el-tooltip> -->
+ <el-tooltip content="显示/隐藏" placement="top" effect="dark">
+ <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="switchShowHomeContent"></i>
</el-tooltip>
</div>
<!-- 切换矢量图按钮 -->
@@ -733,6 +737,26 @@
}
},
+ // 切换首页显示隐藏
+ switchShowHomeContent () {
+ this.$store.commit('SET_ISSHOWHOMECONTENT', !this.$store.state.popupParams.isShowHomeContent)
+
+ if (this.$store.state.popupParams.isShowHomeContent) {
+ if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
+ document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
+ document.querySelector('.screen-full-btn').classList.add('homebottom')
+ document.querySelector('.over-look-btn').classList.add('homebottom')
+ document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
+ } else {
+ if (!document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
+ document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom')
+ document.querySelector('.screen-full-btn').classList.remove('homebottom')
+ document.querySelector('.over-look-btn').classList.remove('homebottom')
+ document.querySelector('.image-switch-icon-btn').classList.remove('iconbottom')
+ }
+
+ },
+
/**
* 在图层中添加实体(点)
* @param {*} item 图标
--
Gitblit v1.9.3