diff --git a/src/style/page-tech-compat.scss b/src/style/page-tech-compat.scss index 1e5a8e1..64bbe1e 100644 --- a/src/style/page-tech-compat.scss +++ b/src/style/page-tech-compat.scss @@ -125,6 +125,7 @@ border-color: rgba(0, 212, 255, 0.56) !important; background: rgba(5, 16, 32, 0.92) !important; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28), 0 0 16px rgba(0, 212, 255, 0.16) !important; + cursor: pointer; } .device-grid, diff --git a/src/view/masterStation/project/index.vue b/src/view/masterStation/project/index.vue index 9908ead..40c5264 100644 --- a/src/view/masterStation/project/index.vue +++ b/src/view/masterStation/project/index.vue @@ -188,7 +188,9 @@ import * as serve from '@/api/masterStation/project' import * as equipmentServe from '@/api/masterStation/equipment' import { useProjectStore } from '@/pinia/modules/project' + import { useRouterStore } from '@/pinia/modules/router' import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue' + import { useRouter } from 'vue-router' import { FullScreen, Monitor, Connection, Bell, OfficeBuilding, Location } from '@element-plus/icons-vue' import { ElMessage } from 'element-plus' import { use } from 'echarts/core' @@ -210,6 +212,9 @@ }) const projectStore = useProjectStore() + const router = useRouter() + const routerStore = useRouterStore() + const EQUIPMENT_ROUTE_PATH = 'masterStation/equipment' const MAP_ZOOM = 13 const MAP_ZOOM_OUT = 9 const MAP_STEP_DURATION = 350 @@ -460,7 +465,7 @@ const createProjectMarkerContent = (name) => { return ` -
+
📍
${name}
@@ -469,6 +474,25 @@ ` } + const goToEquipmentOverview = () => { + const equipmentRoute = Object.values(routerStore.routeMap).find( + (route) => route.path === EQUIPMENT_ROUTE_PATH || route.path?.endsWith(`/${EQUIPMENT_ROUTE_PATH}`) + ) + + if (equipmentRoute?.name) { + router.push({ name: equipmentRoute.name }) + return + } + + router.push({ path: `/layout/${EQUIPMENT_ROUTE_PATH}` }) + } + + const bindProjectMarkerClick = () => { + if (!projectMarker) return + projectMarker.off('click', goToEquipmentOverview) + projectMarker.on('click', goToEquipmentOverview) + } + const hideProjectMarker = () => { if (!projectMarker || !mapInstance.value) return mapInstance.value.remove(projectMarker) @@ -486,6 +510,7 @@ offset: new AMap.Pixel(-10, -30), zIndex: 10 }) + bindProjectMarkerClick() mapInstance.value.add(projectMarker) return } @@ -552,6 +577,7 @@ mapResizeObserver?.disconnect() mapResizeObserver = null if (projectMarker) { + projectMarker.off('click', goToEquipmentOverview) mapInstance.value?.remove(projectMarker) projectMarker = null } @@ -1088,6 +1114,7 @@ padding: 4px 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); white-space: nowrap; + cursor: pointer; } .map-device-icon {