处理EarthComp代码 新增控制

src/views/earthMap/edit/EarthComp.vue

@@ -5,7 +5,7 @@
 <template>
   <div>
     <div id="earthContainer" ref="earthContainer" style="width: 100%; height: 100%; top: 300px"></div>
-    <div class="earthUI_header">
+    <div class="earthUI_header" v-if="PropsEarthHeaderShow">
       <header>
         <p>{{ earthTitle }}</p>
         <p>{{ realTime }}</p>
@@ -140,6 +140,7 @@
     setClassEl1.className = 'xbsj-checkbox-wrapper xbsj-checkbox-wrapper-checked xbsj-checkbox-default';
     setClassEl2.className = 'xbsj-checkbox xbsj-checkbox-checked';
   }
+}
 
   function setClassNoChecked(setClassEl1, setClassEl2) {
     // node.checkStatus = ''
@@ -202,7 +203,73 @@
       AISInfoDetail,
       AISInfoWindow,
     },
-    props: {},
+    props: {
+    //全部显示
+    all: {
+      type: Boolean,
+      default: false
+    },
+    //头部显示
+    earthHeaderShow: {
+      type: Boolean,
+      default: false
+    },
+    //图层显示
+    sceneTreeShow:{
+      type: Boolean,
+      default: false
+    },
+    //状态栏
+    statusBarShow:{
+      type: Boolean,
+      default: true
+    },
+    //主工具栏
+    mainBar:{
+      type: Boolean,
+      default: false
+    },
+    //监听事件
+    listenMouseHandlerOpen:{
+      type: Boolean,
+      default: false
+    },
+    //监听mitt
+    listenMittHandlerOpen:{
+      type: Boolean,
+      default: false
+    },
+    //地图路线资源
+    createBBHLineOpen:{
+      type: Boolean,
+      default: false
+    },
+    //加载区域
+    getLineInfoShow:{
+      type: Boolean,
+      default: false
+    },
+    //加载站点
+    getCameraInfoShow:{
+      type: Boolean,
+      default: false
+    },
+    //加载微波和雷达
+    getLabelInfoShow:{
+      type: Boolean,
+      default: false
+    },
+    //加载绘图
+    drawInitShow:{
+      type: Boolean,
+      default: false
+    },
+    //加载重点监控区域
+    keyControlInitShow:{
+      type: Boolean,
+      default: false
+    },
+},
   })
   export default class EarthComp extends Vue {
     /**
@@ -470,6 +537,19 @@
       let that = this;
       //使用store存储XbsjEarthUI
       this.store.xbsjEarthUI = XbsjEarthUI;
+    //处理props
+    if(this.all){
+      this.PropsEarthHeaderShow = true
+      this.PropsSceneTreeShow = true
+      this.PropsListenMouseHandlerOpen = true
+      this.PropsListenMittHandlerOpen = true
+      this.PropsCreateBBHLineOpen = true
+      this.PropsGetLineInfoShow = true
+      this.PropsGetCameraInfoShow = true
+      this.PropsGetLabelInfoShow = true
+      this.PropsDrawInitShow = true
+      this.PropsKeyControlInitShow = true
+     }
       XbsjEarthUI.create('earthContainer').then(async (earthUI: any) => {
         // 设置全局变量，可调试
         window.$uia = earthUI;
@@ -575,18 +655,22 @@
           this.cameraPositionChange(this);
         });
 
-        //加载地图实时资源（无人机、车辆、人员、巡逻路线等）
+      //加载地图实时资源（无人机、车辆、人员、巡逻路线等）
-        // this.createRealTimeObj(earthUI)
+      // this.createRealTimeObj(earthUI)
-        //监听鼠标事件
+
+      //监听鼠标事件
+      if (this.PropsListenMouseHandlerOpen)
         this.listenMouseHandler(earthUI);
 
-        //监听mitt
+      //监听mitt
+      if (this.PropsListenMittHandlerOpen)
         this.listenMittHandler(earthUI);
 
-        // 飞入方法
+      // 飞入方法
-        await this.fly();
+      await this.fly();
 
-        //加载地图线路资源
+      //加载地图线路资源
+      if (this.PropsCreateBBHLineOpen)
         await this.createBBHLine(earthUI);
 
         //创建工具栏
@@ -695,6 +779,7 @@
     /* 使用async/await 处理异步方法顺序执行。成功的操作放到try里，失败的放在catch里 */
     async createBBHLine(earthUI = null) {
       console.log('MyScene', this.userStore.userInfo?.sceneId);
+      let labelItems: any = undefined
       let type = 1; //**
 
       let models: any = {
@@ -719,16 +804,25 @@
 
       // 加载区域
       // console.log("加载区域");
-      await this.getLineInfo(models, type);
+      if (this.PropsGetLineInfoShow)
+        await this.getLineInfo(models, type);
+
       // 加载站点
       // console.log("加载站点");
-      await this.getCameraInfo(models, type);
+      if (this.PropsGetCameraInfoShow)
+        await this.getCameraInfo(models, type);
+
       // 加载雷达和微波
       // console.log("加载雷达和微波");
-      const labelItems: any = await this.getLabelInfo(models, type);
+      if (this.PropsGetLabelInfoShow)
-      //加载绘画资源
+        labelItems = await this.getLabelInfo(models, type);
+
+       //加载绘画资源
+    if (this.PropsDrawInitShow)
       await drawInit();
+
       //加载重点监控区域
+    if (this.PropsKeyControlInitShow)
       await keyControlInit();
 
       // 监听树的dom节点变化

src/views/earthMap/edit/ElectronicMap.vue

@@ -1,6 +1,6 @@
 <template>
   <div style="width: 100%; height: 100%">
-    <EarthComp/>
+    <EarthComp  :all="true"/>
   </div>
 </template>