From 1dee40ea46601f2ee5d10aa0190625ebf03bdc4e Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 02 Dec 2024 17:02:19 +0800
Subject: [PATCH] 1
---
src/pages/map/components/mainMenu.vue | 120 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 120 insertions(+), 0 deletions(-)
diff --git a/src/pages/map/components/mainMenu.vue b/src/pages/map/components/mainMenu.vue
new file mode 100644
index 0000000..fad7483
--- /dev/null
+++ b/src/pages/map/components/mainMenu.vue
@@ -0,0 +1,120 @@
+<template>
+ <div class="page-mode">
+ <div @mouseenter="item.childrenFlag = true" :class="{ active: currentUrl.indexOf(item.path) != -1 }"
+ @mouseleave="item.childrenFlag = false" @click="goToPath(item)" v-for="(item, index) in menuList" :key="index">
+ {{ item.menuName }}
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { ref, reactive, watch } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import { Search } from '@element-plus/icons-vue'
+import { getTime } from '@/utils/getTime.js'
+import { useRouterStore } from 'store/router'
+const store = useRouterStore()
+let router = useRouter()
+let currentUrl = ref('statistics')
+
+const menuList = ref(
+ [
+ {
+ menuName: '园区概况',
+ path: '/layout/map/survey'
+ },
+ {
+ menuName: '风险源',
+ path: '/layout/map/rs'
+ },
+ {
+ menuName: '应急空间',
+ path: '/layout/map/space'
+ },
+ {
+ menuName: '应急物资',
+ path: '/layout/single/supplies'
+ },
+ {
+ menuName: '三级防控',
+ path: '/layout/map/pac'
+ },
+ {
+ menuName: '救援队伍',
+ path: '/layout/single/rt'
+ },
+ {
+ menuName: '突发事件模拟',
+ path: '/layout/map/pd'
+ },
+ {
+ menuName: '作战图',
+ path: '/layout/single/ochart'
+ },
+ ]
+)
+
+const goToPath = (params) => {
+ if (params.children && params.children.length > 0) return
+
+ if (params.path) {
+ if (router.currentRoute.value.path == params.path) return
+ router.push({
+ path: params.path
+ })
+ } else {
+ params.childrenFlag = !params.childrenFlag
+ }
+}
+
+watch(
+ () => router.currentRoute.value,
+ (newValue, oldValue) => {
+
+ currentUrl.value = newValue.path
+
+ },
+ { immediate: true }
+)
+
+const userName = ref('管理员')
+</script>
+
+<style lang="scss" scoped>
+.page-mode {
+ position: absolute;
+ top: auto;
+ bottom: 55px;
+ left: 50%;
+ z-index: 99;
+ transform: translateX(-50%);
+ display: flex;
+ pointer-events: auto;
+
+ &>div {
+ background-image: url(/images/mode-tab.png);
+ background-size: cover;
+ width: 136px;
+ height: 50px;
+ font-size: 16px;
+ text-align: center;
+ font-weight: bold;
+ color: #BFD3E5;
+ line-height: 32px;
+ padding-top: 12px;
+ margin-right: -20px;
+ font-style: italic;
+ cursor: pointer;
+ box-sizing: border-box;
+
+ &:last-child {
+ margin-right: 0px;
+ }
+
+ &.active {
+ color: #F6FCFF;
+ background-image: url(/images/mode-tab-ac.png);
+ }
+ }
+}
+</style>
--
Gitblit v1.9.3