项目级预览

src/views/groupPage/baseMap/components/ProjectMap.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="ProjectMap" ref="mapDiv" v-if="show"></div>
+  <div class="ProjectMap" ref="mapDiv" v-if="show" :style="bgImg"></div>
 </template>
 
 <script>
@@ -12,16 +12,30 @@ export default {
   },
   data() {
     return {
-      baselayer: []
+      baselayer: [],
+      bgUrl: require('@/views/groupPage/images/工程全景.png')
+    }
+  },
+  computed: {
+    bgImg() {
+      return `background-image: url(${this.bgUrl});`
+    },
+    bgName() {
+      return this.$store.state.bigScreen.currentActive
     }
   },
   watch: {
     show(val) {
       if (val) {
         this.$nextTick(() => {
-          this.addToMap()
+          // this.addToMap()
         })
       }
+    },
+    bgName(val) {
+      if (val === '工程全景') this.bgUrl = require('@/views/groupPage/images/工程全景.png')
+      if (val === '统计分析') this.bgUrl = require('@/views/groupPage/images/统计分析.png')
+      if (val === '决策支持') this.bgUrl = require('@/views/groupPage/images/决策支持.png')
     }
   },
   mounted() {},
@@ -197,6 +211,7 @@ export default {
   width: 100%;
   height: 100%;
   position: relative;
-  background: #000;
+  // background: #000;
+  background-size: 100% 100%;
 }
 </style>

src/views/groupPage/header/header.vue

@@ -72,7 +72,12 @@ export default {
     return {
       title: null, //标题
       subtitle: null, //副标题
-      menuList: [], //菜单栏配置
+      menuList: [
+        { name: '工程全景', label: '工程全景' },
+        // { name: '智慧预警', label: '智慧预警' },
+        { name: '统计分析', label: '统计分析' },
+        { name: '决策支持', label: '决策支持' }
+      ], //菜单栏配置
       currentActive: '', //当前激活模块版块
       currentProjectActive: '', //当前项目级激活功能模块
       specificTime: null, //系统当前时间
@@ -120,6 +125,7 @@ export default {
   },
   mounted() {
     // this.getUserActiveModule()
+    this.currentProjectActive = this.menuList[0].label
     this.title = this.config.title
     this.subtitle = this.config.subtitle
     this.showCurrentTime()
@@ -143,7 +149,7 @@ export default {
     currentProjectActive: {
       handler(n, o) {
         this.activeModule(n)
-        // this.$store.state.bigScreen.currentActive = n
+        this.$store.state.bigScreen.currentActive = n
       }
       // immediate:true
     }