| | |
| | | v-show="checkMenuFlag == 'l1'" |
| | | style="position: relative; display: flex" |
| | | > |
| | | <layer-manage @setCloseLayer="setCloseLayer"> </layer-manage> |
| | | |
| | | </div> |
| | | <div v-show="checkMenuFlag == 'l2'"> |
| | | <plotting> </plotting> |
| | | <div |
| | | style="position: relative; display: flex" |
| | | v-show="store.state.setLayerManager" |
| | | > |
| | | <layer-manage @setCloseLayer="setCloseLayer"></layer-manage> |
| | | </div> |
| | | |
| | | <div |
| | | style="position: relative; display: flex" |
| | | v-show="checkMenuFlag == 'l2'" |
| | | > |
| | | <plotting @setCloseplotting="setCloseplotting"> </plotting> |
| | | </div> |
| | | <div v-show="checkMenuFlag == 'l5'"> |
| | | <baseMapSwitching> </baseMapSwitching> |
| | |
| | | > |
| | | <double-layer></double-layer> |
| | | </div> |
| | | |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | |
| | | reactive, |
| | | defineProps, |
| | | defineEmits, |
| | | nextTick, |
| | | } from "vue"; |
| | | import { Operation } from "@element-plus/icons-vue"; |
| | | import menuData from "@/assets/js/Map/menuData"; |
| | |
| | | store.state.doubleMenu = true; |
| | | store.state.doubleMap = false; |
| | | }; |
| | | const setShowMapChange = (res) => { |
| | | switch (res.id) { |
| | | case "15": |
| | | break; |
| | | default: |
| | | break; |
| | | } |
| | | // store.state.isShowMap = res; |
| | | }; |
| | | const setMenuClick = (res) => { |
| | | if (res.id == "l6") { |
| | | // fullScreen.value = !fullScreen.value; |
| | |
| | | if (res.id == "l3") { |
| | | thematicMapState.value = false; |
| | | thematicMapBtnState.value = false; |
| | | } else { |
| | | } else if (res.id != "11") { |
| | | thematicMapState.value = true; |
| | | thematicMapBtnState.value = true; |
| | | } |
| | |
| | | checkMenuFlag.value = res.id; |
| | | menuTool.leftTools(res); |
| | | } |
| | | if (res.id == "l1") { |
| | | store.state.setLayerManager = !store.state.setLayerManager; |
| | | } else { |
| | | store.state.setLayerManager = false; |
| | | } |
| | | }; |
| | | const setCloseLayer = (res) => { |
| | | store.state.setLayerManager = false; |
| | | }; |
| | | const setCloseplotting = (res) => { |
| | | checkMenuFlag.value = null; |
| | | }; |
| | | // 切换浏览器全屏 |
| | |
| | | if (!isFullScreen()) { |
| | | if (!fullScreen.value) { |
| | | fullScreen.value = !fullScreen.value; |
| | | console.log(fullScreen.value); |
| | | } |
| | | } |
| | | }); |
| | |
| | | position: absolute; |
| | | top: 27px; |
| | | left: 0px; |
| | | z-index: 40; |
| | | .logo_box { |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | } |
| | | .menus_box { |
| | | background: rgba(1, 10, 28, 0.68); |
| | | |
| | | left: 7px; |
| | | position: absolute; |
| | | top: 105px; |
| | | top: 83px; |
| | | width: 71px; |
| | | height: 850px; |
| | | |
| | | height: 680px; |
| | | z-index: 40; |
| | | box-sizing: border-box; |
| | | .imgBox { |
| | | width: 100%; |
| | | display: flex; |
| | |
| | | padding: 10px; |
| | | } |
| | | .menu_Image_box { |
| | | height: 778px; |
| | | box-sizing: border-box; |
| | | height: 100%; |
| | | width: 100%; |
| | | padding: 36px 0px; |
| | | padding-top: 36px; |
| | | background: url("../assets/img/矩形 1.png") no-repeat; |
| | | background-size: 100% 100%; |
| | | } |
| | | .content_box { |
| | | position: absolute; |
| | | top: 135px; |
| | | left: 100px; |
| | | // top: 135px; |
| | | top: 110px; |
| | | left: 80px; |
| | | display: flex; |
| | | } |
| | | .fullScreen_btn { |