地图加载

src/views/c-cpns/Map.vue

@@ -14,6 +14,12 @@ import {AddSingleLayer, invokeParams, MapClickByType, SetBackground} from "@/uni
 let bridge;
 export default {
   name: "Map",
+  props: {
+    serviceNos: {
+      type: Array,
+      required: true
+    }
+  },
   setup(){
     onMounted(()=>{
       myBridge.bridgeContent =  bridge = new CityGis.Bridge({
@@ -23,44 +29,27 @@ export default {
         onReady: function () {
 
         }
-
       })
       debugger
       console.log("地图创建完成")
+      watch(() => props.serviceNos, (newServiceNos) => {
+        loadServices(newServiceNos);
+      }, { immediate: true });
 
-      let hmxmxxServiceNo =  "D9999990320240701";
-      let wdbServiceNo =  "D9999990520240701";
-      let ydbServiceNo =  "D9999990620240701";
-
-      // 调用 AddSingleLayer 方法
-      AddSingleLayer({
-        id: 0,
-        title: "dynamic",
-        visible: true,
-        wkid:1,
-        // url:"https://cimweb.zjw.sh.cegn.cn:2008/MapServiceProxy/"+hmxmxxToken,
-        url:"https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/"+hmxmxxServiceNo,
-        type: "动态地图"
-      });
-      AddSingleLayer({
-        id: 0,
-        title: "dynamic",
-        visible: true,
-        wkid:1,
-        url:"https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/"+wdbServiceNo,
-        type: "动态地图"
-      });
-      AddSingleLayer({
-        id: 0,
-        title: "dynamic",
-        visible: true,
-        wkid:1,
-        url:"https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/"+ydbServiceNo,
-        type: "动态地图"
-      });
-      // 调用 MapClickByType 方法
-      MapClickByType(true);
-    })
+      function loadServices(serviceNos) {
+        serviceNos.forEach(serviceNo => {
+          AddSingleLayer({
+            id: 0,
+            title: "dynamic",
+            visible: true,
+            wkid: 1,
+            url: `https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/${serviceNo}`,
+            type: "动态地图"
+          });
+        });
+        MapClickByType(true);
+      }
+    });
   }
 }
 </script>

src/views/c-views/visualizationPart/houseBuilding/HouseBuilding.vue

@@ -1,29 +1,28 @@
 <template>
-	<div id="houseBuilding">
+  <div id="houseBuilding">
     <VisualizationHeader />
-<!--    <ServiceTree />-->
-<!--    <TreeMenu />-->
-    <Map />
-	</div>
+    <Map :serviceNos="$route.query.serviceNos" />
+  </div>
 </template>
 
 <script>
-	import HouseBuildingLeft from "@/views/c-views/visualizationPart/houseBuilding/HouseBuildingLeft/HouseBuildingLeft.vue";
-	import HouseBuildingRight from "@/views/c-views/visualizationPart/houseBuilding/HouseBuildingRight/HouseBuildingRight.vue";
-  import Map from "@/views/c-cpns/Map.vue";
-  import TreeMenu from "@/views/c-cpns/TreeMenu.vue";
-  import VisualizationHeader from "@/views/c-cpns/VisualizationHeader.vue";
-  import ServiceTree from "@/views/c-cpns/ServiceTree.vue";
-	export default {
-		name: "HouseBuilding",
-		components: {ServiceTree, VisualizationHeader, HouseBuildingLeft, HouseBuildingRight,TreeMenu,Map}
-	}
+import HouseBuildingLeft from "@/views/c-views/visualizationPart/houseBuilding/HouseBuildingLeft/HouseBuildingLeft.vue";
+import HouseBuildingRight from "@/views/c-views/visualizationPart/houseBuilding/HouseBuildingRight/HouseBuildingRight.vue";
+import Map from "@/views/c-cpns/Map.vue";
+import TreeMenu from "@/views/c-cpns/TreeMenu.vue";
+import VisualizationHeader from "@/views/c-cpns/VisualizationHeader.vue";
+import ServiceTree from "@/views/c-cpns/ServiceTree.vue";
+
+export default {
+  name: "HouseBuilding",
+  components: {ServiceTree, VisualizationHeader, HouseBuildingLeft, HouseBuildingRight, TreeMenu, Map}
+}
 </script>
 
 <style scoped lang="scss">
-	#houseBuilding {
-		position: absolute;
-		width: 100%;
-		z-index: 2;
-	}
+#houseBuilding {
+  position: absolute;
+  width: 100%;
+  z-index: 2;
+}
 </style>

src/views/c-views/visualizationPart/mainPage/mainPageTop/MainPageTop.vue

@@ -6,11 +6,11 @@
           <img src="../../../../../assets/imgs/上海.png" alt="上海天际线"/>
         </div>
         <div  class="sidebar" >
-          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '规划计划' })" class="sidebar-1 button-with-arrow">规划计划</button>
-          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '项目管理' })" class="sidebar-2 button-with-arrow">项目管理</button>
-          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '设备设施监测' })" class="sidebar-3 button-with-arrow">设备设施监测</button>
-          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '成效评估' })" class="sidebar-4 button-with-arrow">成效评估</button>
-          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '知识库' })" class="sidebar-5 button-with-arrow">知识库</button>
+          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '规划计划', serviceNos: ['D9999990320240701', 'D9999990520240701'] })" class="sidebar-1 button-with-arrow">规划计划</button>
+          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '项目管理', serviceNos: ['D9999990520240701'] })" class="sidebar-2 button-with-arrow">项目管理</button>
+          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '设备设施监测', serviceNos: ['D9999990620240701'] })" class="sidebar-3 button-with-arrow">设备设施监测</button>
+          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '成效评估', serviceNos: ['D9999990320240701'] })" class="sidebar-4 button-with-arrow">成效评估</button>
+          <button @click="goToPage('/visualizationHome/houseBuilding', { category: '知识库', serviceNos: ['D9999990620240701'] })" class="sidebar-5 button-with-arrow">知识库</button>
         </div>
       </div>
     </div>