修改

zhsq_qk-system/src/main/resources/mapper/system/QkEmergencyRescueTeamMapper.xml

@@ -224,7 +224,7 @@
                area,
                township,
                village,
-               phone,
+               qk.phone,
                effect,
                longitude,
                latitude,

zhsq_qk-ui/src/api/system/aqyj.js

@@ -0,0 +1,40 @@
+import request from '@/utils/request'
+
+// 可视化查询抢险救援队列表
+export function selectQkEmergencyRescueTeamAllList() {
+  return request({
+    url: '/system/team/selectQkEmergencyRescueTeamAllList',
+    method: 'get',
+  })
+}
+
+// 可视化查询应急避难所列表
+export function selectQkEmergencyShelterAllList() {
+  return request({
+    url: '/system/shelter/selectQkEmergencyShelterAllList',
+    method: 'get',
+  })
+}
+
+// 可视化查询防汛抗旱物资储备列表
+export function selectQkRescueSuppliesAllList() {
+  return request({
+    url: '/system/supplies/selectQkRescueSuppliesAllList',
+    method: 'get',
+  })
+}
+// 可视化根据deptId查询抢险救援队列表
+export function selectQkEmergencyRescueTeamByDeptId(id) {
+  return request({
+    url: '/system/team/selectQkEmergencyRescueTeamByDeptId/' + id,
+    method: 'get'
+  })
+}
+
+// 可视化根据deptId查询防汛抗旱物资储备列表
+export function selectQkRescueSuppliesByDeptId(id) {
+  return request({
+    url: '/system/supplies/selectQkRescueSuppliesByDeptId/' + id,
+    method: 'get'
+  })
+}

zhsq_qk-ui/src/views/fusion/aqyj.vue

@@ -21,52 +21,44 @@
     <div class="left_con sprh-left">
       <div class="top_txt">
         <b>汽开区</b>
-<!--        <span>小雨</span>-->
-<!--        <span>9~16℃</span>-->
+        <!--        <span>小雨</span>-->
+        <!--        <span>9~16℃</span>-->
       </div>
       <!-- 设备tab开始-->
       <div class="facility_tab facility_tab2">
 
-          <div class="qkq_tdzy">
-            <div class="qkq_tit ">应急场所</div>
-         <div class="scrollbar" style="height: 300px;">
-           <ul id="accordion" class="accordion yjcs">
-             <!-- li上加on类名是点击选中后效果 -->
-            <li class="on">
-              <div class="link">为进一步规范和加强应急避难场所规...</div>
-            </li>
-            <li>
-              <div class="link">应急避难场所按建筑与场地空间类别...</div>
-            </li>
-            <li>
-              <div class="link">应急避难场所的规划、建设、使用与...</div>
-            </li>
-            <li>
-              <div class="link">应急避难场所建设、管护和使用所需...</div>
-            </li>
-           </ul>
-         </div>
+        <div class="qkq_tdzy">
+          <div class="qkq_tit ">应急场所</div>
+          <div class="scrollbar" style="height: 300px;">
+            <ul id="accordion" class="accordion yjcs">
+              <!-- li上加on类名是点击选中后效果 -->
+              <li v-for="(item, index) in shelter" :class="{ on: item.id == shelterCurrent }" :key="index"
+                  @click="onShelterlick(item)">
+                <div class="link">{{ item.name }} - {{ item.address }}</div>
+              </li>
+            </ul>
+          </div>
 
         </div>
-		  <div class="qkq_tdzy">
-		    <div class="qkq_tit">城市内涝点</div>
-		 <div class="scrollbar" style="height: 300px;">
-		   <ul id="accordion" class="accordion csnld">
-		    <li class="on">
-		      <div class="link">易涝隐患区域加快整治。</div>
-		    </li>
-		    <li>
-		      <div class="link">行洪排涝能力不断提升。</div>
-		    </li>
-		    <li>
-		      <div class="link">设施运维管理持续完善。</div>
-		    </li>
-		    <li>
-		      <div class="link">海绵城市建设稳步推进。</div>
-		    </li>
-		   </ul>
-		 </div>
-		  </div>
+        <div class="qkq_tdzy">
+          <div class="qkq_tit">城市内涝点</div>
+          <div class="scrollbar" style="height: 300px;">
+            <ul id="accordion" class="accordion csnld">
+              <li class="on">
+                <div class="link">易涝隐患区域加快整治。</div>
+              </li>
+              <li>
+                <div class="link">行洪排涝能力不断提升。</div>
+              </li>
+              <li>
+                <div class="link">设施运维管理持续完善。</div>
+              </li>
+              <li>
+                <div class="link">海绵城市建设稳步推进。</div>
+              </li>
+            </ul>
+          </div>
+        </div>
 
       </div>
       <!-- 设备tab结束-->
@@ -79,60 +71,46 @@
         <!--        <span>星期六</span>-->
         <!--        <b>11:16:58</b>-->
       </div>
-    <div class="facility_tab facility_tab2">
+      <div class="facility_tab facility_tab2">
+
+        <div class="qkq_tdzy">
+          <div class="qkq_tit ">抢险救援队</div>
+          <div class="scrollbar" style="height: 300px;">
+            <ul id="accordion" class="accordion nlsb">
+              <!-- li上加on类名是点击选中后效果 -->
+              <li v-for="(item, index) in team" :class="{ on: item.id == teamCurrent }" :key="index"
+                  @click="onTeamlick(item)">
+                <div class="link">{{ item.dept }}</div>
+              </li>
+            </ul>
+          </div>
 
+        </div>
         <div class="qkq_tdzy">
-          <div class="qkq_tit ">内涝设备</div>
-       <div class="scrollbar" style="height: 300px;">
-         <ul id="accordion" class="accordion nlsb">
-           <!-- li上加on类名是点击选中后效果 -->
-           <li class="on">
-             <div class="link">传感器设备是城市内涝积水监测预警...</div>
-           </li>
-		   <li>
-		     <div class="link">数据采集设备负责将传感器设备采集...</div>
-		   </li>
-		   <li>
-		     <div class="link">通信设备是城市内涝积水监测预警系...</div>
-		   </li>
-		   <li>
-		     <div class="link">显示设备是城市内涝积水监测预警系...</div>
-		   </li>
-         </ul>
-       </div>
+          <div class="qkq_tit">防汛物资</div>
+          <div class="scrollbar" style="height: 300px;">
+            <ul id="accordion" class="accordion yjcssb">
+              <li v-for="(item, index) in supplies" :class="{ on: item.id == suppliesCurrent }" :key="index"
+                  @click="onSuppliesclick(item)">
+                <div class="link">{{ item.dept }}</div>
+              </li>
+            </ul>
+          </div>
+        </div>
 
       </div>
-    		  <div class="qkq_tdzy">
-    		    <div class="qkq_tit">应急场所设备</div>
-    		 <div class="scrollbar" style="height: 300px;">
-    		   <ul id="accordion" class="accordion yjcssb">
-    		    <li class="on">
-    		      <div class="link">急救箱：包括绷带、消毒棉、止血带...</div>
-    		    </li>
-    		    <li>
-    		      <div class="link">停火器：能够有效灭火且易于携带的...</div>
-    		    </li>
-    		    <li>
-    		      <div class="link">照明设备：包括手电筒、充电式LED...</div>
-    		    </li>
-    		    <li>
-    		      <div class="link"> 呼吸器：用于呼吸困难、有毒气体...</div>
-    		    </li>
-    		   </ul>
-    		 </div>
-    		  </div>
-
-    </div>
 
     </div>
     <!--右侧结束-->
-	<!-- 多选按钮  开始 -->
-	<form class="qkq_dx">
-	  <label><input type="checkbox"/>应急场所</label>
-	  <label><input type="checkbox"/>内涝点</label>
-	  <label><input type="checkbox"/>摄像头</label>
-	</form>
-	<!-- 多选按钮  结束 -->
+    <!-- 多选按钮  开始 -->
+    <form class="qkq_dx">
+      <label><input checked type="checkbox" name="ckbx" id="sxt" @click="handleClick"/>摄像头</label>
+      <label><input type="checkbox" name="ckbx" id="yjcs" @click="handleClick"/>应急场所</label>
+      <label><input type="checkbox" name="ckbx" id="nld" @click="handleClick"/>城市内涝点</label>
+      <label><input type="checkbox" name="ckbx" id="jyd" @click="handleClick"/>抢险救援队</label>
+      <label><input type="checkbox" name="ckbx" id="fxwz" @click="handleClick"/>防汛物资</label>
+    </form>
+    <!-- 多选按钮  结束 -->
 
     <!-- 点位图例 开始
     <div class="dwtl">
@@ -190,6 +168,11 @@ import "@/assets/images/qkq_body.css";
 import "@/assets/images/qkq_index.css";
 import "@/assets/images/qkq_sprh.css";
 import {getCameraList} from "@/api/system/camera";
+import {
+  selectQkEmergencyRescueTeamAllList,
+  selectQkEmergencyShelterAllList,
+  selectQkRescueSuppliesAllList,
+} from "@/api/system/aqyj";
 import supermap from "@/views/supermap/supermap";
 
 
@@ -202,7 +185,13 @@ export default {
     return {
       dropdownVisible: false,
       cameras: [],
+      team: [],
+      shelter: [],
+      supplies: [],
       sltProps: null,
+      teamCurrent: null,
+      shelterCurrent: null,
+      suppliesCurrent: null,
       currentTime: '',
       btnOne: true,
       btnTwo: false
@@ -212,6 +201,9 @@ export default {
   created() {
   },
   mounted() {
+    this.selectQkEmergencyRescueTeamAllList();
+    this.selectQkEmergencyShelterAllList();
+    this.selectQkRescueSuppliesAllList();
     this.resourceDistribution();
     this.deviceOnline();
     this.deviceOffline();
@@ -224,30 +216,101 @@ export default {
   },
 
   methods: {
+    handleClick() {
+      this.$refs.supermap.clearM()
+      let markType = [];
+      $('input[name="ckbx"]:checked').each(function () {
+        markType.push($(this).attr("id"))
+      });
+      this.$refs.supermap.init(markType)
+    },
+    onTeamlick(val) {
+      let markType = [];
+      this.suppliesCurrent = null;
+      this.shelterCurrent = null;
+      if (val.id == this.teamCurrent) {
+        this.teamCurrent = null;
+      } else {
+        this.teamCurrent = val.id;
+      }
+      this.$refs.supermap.init(markType.push("jyd"))
+      this.$refs.supermap.dropLocation(val.latitude, val.longitude);
+    },
+    onSuppliesclick(val) {
+      let markType = [];
+      this.teamCurrent = null;
+      this.shelterCurrent = null;
+      if (val.id == this.suppliesCurrent) {
+        this.suppliesCurrent = null;
+      } else {
+        this.suppliesCurrent = val.id;
+      }
+      this.$refs.supermap.init(markType.push("fxwz"))
+      this.$refs.supermap.dropLocation(val.latitude, val.longitude);
+    },
+    onShelterlick(val) {
+      let markType = [];
+      this.teamCurrent = null;
+      this.suppliesCurrent = null;
+      if (val.id == this.shelterCurrent) {
+        this.shelterCurrent = null;
+      } else {
+        this.shelterCurrent = val.id;
+      }
+      this.$refs.supermap.init(markType.push("yjcs"))
+      this.$refs.supermap.dropLocation(val.latitude, val.longitude);
+    },
+    //可视化查询抢险救援队列表
+    selectQkEmergencyRescueTeamAllList() {
+      selectQkEmergencyRescueTeamAllList().then(response => {
+        this.team = response.data;
+      })
+    }
+    ,
+    //可视化查询应急避难所列表
+    selectQkEmergencyShelterAllList() {
+      selectQkEmergencyShelterAllList().then(response => {
+        this.shelter = response.data;
+      })
+    }
+    ,
+    //可视化查询防汛抗旱物资储备列表
+    selectQkRescueSuppliesAllList() {
+      selectQkRescueSuppliesAllList().then(response => {
+        this.supplies = response.data;
+      })
+    }
+    ,
     sltHandle() {
       this.btnOne = true
       this.btnTwo = false
       this.$refs.supermap.getSupermap(null, null, null, "slt", null, null)
-    },
+    }
+    ,
     yxtHandle() {
       this.btnTwo = true
       this.btnOne = false
       this.$refs.supermap.getSupermap(null, null, null, "yxt", null, null)
-    },
+    }
+    ,
     handleNavigation(route) {
       this.$router.push({path: route});
-    },
+    }
+    ,
     homePage(route) {
       this.$router.push({path: route});
-    },
+    }
+    ,
     cameraList() {
       getCameraList().then(response => {
         this.cameras = response.data;
       })
-    },
+    }
+    ,
     toggleDropdown(event) {
       this.dropdownVisible = !this.dropdownVisible;
-    },
+    }
+    ,
 
     resourceDistribution() {
       //资源分布
@@ -378,7 +441,8 @@ export default {
       if (option) {
         myChart.setOption(option);
       }
-    },
+    }
+    ,
 
     deviceOnline() {
       //在线设备
@@ -412,7 +476,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -435,7 +499,7 @@ export default {
             name: "ring5", //紫点
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.42;
@@ -461,7 +525,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -485,7 +549,7 @@ export default {
             name: "ring5", // 蓝色
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.42;
@@ -510,7 +574,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -535,7 +599,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -558,7 +622,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.47;
@@ -582,7 +646,7 @@ export default {
             name: "ring5", //绿点
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.47;
@@ -723,21 +787,24 @@ export default {
           y: y1
         }
       }
+
       function draw() {
         angle = angle + 3
         myChart.setOption(option, true)
         //window.requestAnimationFrame(draw);
       }
+
       if (timerId) {
         clearInterval(timerId);
       }
-      timerId = setInterval(function() {
+      timerId = setInterval(function () {
         //用setInterval做动画感觉有问题
         draw()
       }, 100);
 
       myChart.setOption(option);
-    },
+    }
+    ,
 
     deviceOffline() {
       // 视频融合--离线设备
@@ -772,7 +839,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -795,7 +862,7 @@ export default {
             name: "ring5", //紫点
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.42;
@@ -821,7 +888,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -845,7 +912,7 @@ export default {
             name: "ring5", // 蓝色
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.42;
@@ -870,7 +937,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -895,7 +962,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               return {
                 type: 'arc',
                 shape: {
@@ -918,7 +985,7 @@ export default {
             name: "ring5",
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.47;
@@ -942,7 +1009,7 @@ export default {
             name: "ring5", //绿点
             type: 'custom',
             coordinateSystem: "none",
-            renderItem: function(params, api) {
+            renderItem: function (params, api) {
               let x0 = api.getWidth() / 2;
               let y0 = api.getHeight() / 2;
               let r = Math.min(api.getWidth(), api.getHeight()) * 0.47;
@@ -1083,21 +1150,24 @@ export default {
           y: y1
         }
       }
+
       function draw() {
         angle = angle + 3
         myChart.setOption(option, true)
         //window.requestAnimationFrame(draw);
       }
+
       if (timerId) {
         clearInterval(timerId);
       }
-      timerId = setInterval(function() {
+      timerId = setInterval(function () {
         //用setInterval做动画感觉有问题
         draw()
       }, 100);
 
       myChart.setOption(option);
-    },
+    }
+    ,
 
     getCurrentTime() {
       const now = new Date();
@@ -1117,7 +1187,8 @@ export default {
       const formattedSecond = second < 10 ? `0${second}` : second;
 
       this.currentTime = `${year}年${formattedMonth}月${formattedDate}日 ${weekDays[day]} ${formattedHour}:${formattedMinute}:${formattedSecond}`;
-    },
+    }
+    ,
 
     regionTop() {
       //摄像头统计
@@ -1141,7 +1212,7 @@ export default {
           },
           top: '0%',
           left: 'bottom',
-		  bottm:'-10%'
+          bottm: '-10%'
         },
         tooltip: {
           trigger: 'axis',
@@ -1256,7 +1327,8 @@ export default {
       if (option) {
         myChart.setOption(option);
       }
-    },
+    }
+    ,
   }
 };
 

zhsq_qk-ui/src/views/supermap/supermap.vue

@@ -1,14 +1,55 @@
 <template>
-  <div id="qksupermap" ref="map" style="height: 100%;width: 100%"></div>
+  <div>
+    <div id="qksupermap" ref="map" style="height: 100%;width: 100%"></div>
+    <div>
+      <el-dialog title="防汛物资" :visible.sync="suppliesOpen" width="700px" append-to-body>
+        <el-table :data="suppliesData" height="350">
+          <el-table-column width="60" label="序号" align="center" type="index"/>
+          <el-table-column label="品种" align="center" prop="varieties"/>
+          <el-table-column label="价值（万元）" align="center" prop="cost"/>
+          <el-table-column label="备注" align="center" prop="remarks"/>
+        </el-table>
+      </el-dialog>
+    </div>
+    <div>
+      <el-dialog title="抢险救援队" :visible.sync="teamOpen" width="1200px" append-to-body>
+        <el-table :data="teamData" height="350">
+          <el-table-column width="60" label="序号" align="center" type="index"/>
+          <el-table-column label="姓名" align="center" prop="name"/>
+          <el-table-column label="组织归属" align="center" prop="dept"/>
+          <el-table-column label="职务" align="center" prop="post"/>
+          <el-table-column label="单位" align="center" prop="company"/>
+          <el-table-column label="防汛抗旱" align="center" prop="effect"/>
+          <el-table-column label="救援队" align="center" prop="emergencyRescue"/>
+          <el-table-column label="所属城市" align="center" prop="city"/>
+          <el-table-column label="所属区县" align="center" prop="area"/>
+          <el-table-column label="所属乡镇" align="center" prop="township"/>
+          <el-table-column label="所属村" align="center" prop="village"/>
+          <el-table-column label="手机号" align="center" prop="phone"/>
+        </el-table>
+      </el-dialog>
+    </div>
+  </div>
 </template>
 
 <script>
 import {iconList, selectSuperMap, listForMark, getIcon} from '@/api/components/supermap.js';
+import {
+  selectQkEmergencyRescueTeamAllList,
+  selectQkEmergencyShelterAllList,
+  selectQkRescueSuppliesAllList,
+  selectQkRescueSuppliesByDeptId,
+  selectQkEmergencyRescueTeamByDeptId
+} from "@/api/system/aqyj";
 
 export default {
   name: "sookaSuperMap",
   data() {
     return {
+      suppliesOpen: false,
+      suppliesData: [],
+      teamOpen: false,
+      teamData: [],
       isAdmin: false,
       isJieDao: false,
       mapId: "qksupermap",
@@ -40,6 +81,7 @@ export default {
       map_qikaiYingXiangLunKuo: "",
       //选择用到的
       resultData: [],
+      resultLayer: [],
       // 街道
       jieDao: null,
       // 社区
@@ -52,6 +94,8 @@ export default {
       rfhSj: null,
       // 年份
       year: null,
+      //事件落点类型
+      markType: ['sxt'],
       //事件详情页是否显示
       eventDetailVisible: null,
       // 路由参数
@@ -60,6 +104,7 @@ export default {
       closeChoseBuilding: null,
       lockReconnect: false,
       userId: null,
+      layerGroup: null // 地图标点图标
     }
   },
   mounted() {
@@ -94,7 +139,7 @@ export default {
       selectSuperMap().then(response => {
         this.centerpointLat = response.data.superMapIServerQiKaiQuMapCenterPoint.split(",")[0];
         this.centerpointLon = response.data.superMapIServerQiKaiQuMapCenterPoint.split(",")[1];
-        // this.datasetName="通榆县委";
+        // this.datasetName="汽开区";
         // this.datasourceName="building";
         this.iServerMap = response.data.superMapIServer;
         this.layerId = response.data.layerId;
@@ -145,10 +190,7 @@ export default {
      * 事件落点
      */
     initSjd: async function () {
-      this.init({
-        deptId: null,
-        year: this.year
-      }, this.map);
+      this.init(this.markType, this.map);
     },
 
     /**
@@ -157,7 +199,12 @@ export default {
     initZxd: async function () {
       this.initMap();
     },
-
+    /**
+     * 落点定位
+     */
+    dropLocation: function (lat, lng) {
+      this.map.flyTo([lat, lng], 19, {duration: 5})
+    },
     /**
      * 加载地图
      */
@@ -174,139 +221,41 @@ export default {
         layers: this.layers,
         attributionControl: false,
         logoControl: false,
-      }).on({"dblclick": this.callbackFunction});
-      // this.editableLayers = new window.L.FeatureGroup().addTo(this.map);
-      // let options = {
-      //   position: 'topleft',
-      //   draw: {
-      //     polyline: null,
-      //     polygon: {},
-      //     circlemarker: null,
-      //     circle: null,
-      //     rectangle: {},
-      //     marker: null,
-      //     remove: false
-      //   }
-      // };
-      // let drawControl = new window.L.Control.Draw(options);
-      // this.map.addControl(drawControl);
-      // this.map.on(window.L.Draw.Event.CREATED, function (e) {
-      //
-      //   let type = e.layerType;
-      //   let layer = e.layer;
-      //
-      //   // _that.editableLayers.clearLayers();
-      //   // _that.editableLayers.addLayer(layer);
-      //
-      //   switch (type) {
-      //     case 'polygon':
-      //     case 'rectangle':
-      //       _that.kuangXuan(layer._latlngs);
-      //       break;
-      //   }
-      // });
-      this.initSjd();
-    },
-    callbackFunction: function (e) {
-      let that = this;
-      let lat = e.latlng.lat;
-      let lng = e.latlng.lng;
-      let polygon = window.L.circle([lat, lng], {radius: 10});//根据获取的坐标生成面，面直径为10，根据实际业务变动范围大小
-      let geometryParam = new SuperMap.GetFeaturesByGeometryParameters({
-        //如果涉及到需要加载多个数据源及数据集，格式为datasetNames: ["building:东风创业","building:东风创业","building:东风创业"],如区指挥中心或街道指挥中心登录，则需加载多个数据源和数据集
-        datasetNames: [that.datasourceName + ":" + that.datasetName],//["building:东风新立"]加载数据源和数据集
-        geometry: polygon,//加载坐标
-        spatialQueryMode: "INTERSECT"
-      });
-      window.L.supermap
-        .featureService(that.dataUrl)
-        .getFeaturesByGeometry(geometryParam, function (serviceResult) {
-          console.log(serviceResult);
-
-          if (!serviceResult.result) {
-            return;
-          }
-
-          if (serviceResult.result.features.features.length === 0) {
-            return;
-          }
-          let icon = new window.L.Icon({
-            iconUrl: iconList['yy'],
-            iconAnchor: [50, 50],
-            iconSize: [37, 64],
-            popupAnchor: [-33, -47],
-            shadowSize: [41, 41],
-          })
-          if (that.marker) {
-            that.marker.setLatLng(e.latlng);
-          } else {
-            that.marker = window.L.marker(e.latlng, {
-              icon: icon
-            }).addTo(that.map);
-          }
-          window.L.geoJSON(serviceResult.result.features.features, {
-            onEachFeature: function (feature, layer) {
-              that.marker.bindPopup("数据集名称：" + feature.properties.NAME + ', 建筑物标识：' + feature.properties.SMID).openPopup(that.marker.getLatLng());
-              // that.showLatLng(feature.properties.SMID,feature.properties.NAME);
-              that.$emit('supermapShuangji', feature.properties.SMID, feature.properties.NAME);
-            }
-          });
-        });
-    },
-    kuangXuan(arr) {
-      const polygon = window.L.polygon([arr]);
-      this.getBuildingList(polygon);
-    },
-    getBuildingList(geometry) {
-      let that = this;
-      this.resultData = [];
-      if (this.datasource_datasetNames == null || this.datasource_datasetNames == "" || this.datasource_datasetNames == "undefined") {
-        this.$modal.alertWarning("未获取到建筑物，请重新选取！");
-        return;
-      }
-      const geometryParam = new SuperMap.GetFeaturesByGeometryParameters({
-        //如果涉及到需要加载多个数据源及数据集，格式为datasetNames: ["building:东风创业","building:东风创业","building:东风创业"],如区指挥中心或街道指挥中心登录，则需加载多个数据源和数据集
-        /*datasetNames: [datasourceName + ":" + datasetName],//["building:东风新立"]加载数据源和数据集*/
-        datasetNames: this.datasource_datasetNames,//["building:东风创业"],//
-        geometry: geometry,
-        toIndex: -1,
-        spatialQueryMode: "INTERSECT"
       });
-
-      window.L.supermap
-        .featureService(this.dataUrl)
-        .getFeaturesByGeometry(geometryParam, function (serviceResult) {
-          console.log(serviceResult);
-          if (!serviceResult.result) {
-            return;
-          }
-          if (serviceResult.result.features.features.length === 0) {
-            return;
-          }
-          let smids = '';
-          let names = '';
-          L.geoJSON(serviceResult.result.features.features, {
-            onEachFeature: function (feature, layer) {
-              smids += feature.properties.SMID + ",";
-              names += feature.properties.NAME + ",";
-            }
-          });
-          that.$emit('rfhMultiBefore', smids, names);
-        });
+      this.initSjd();
     },
     //事件落点相关方法
     init: function (options) {
+      console.log("options", options)
+      for (let i = 0; i < options.length; i++) {
+        if (options[i] == 'sxt') {
+          this.selectCameraList()
+        } else if (options[i] == 'yjcs') {
+          this.selectQkEmergencyShelterAllList()
+        } else if (options[i] == 'jyd') {
+          this.selectQkEmergencyRescueTeamAllList()
+        } else if (options[i] == 'fxwz') {
+          this.selectQkRescueSuppliesAllList()
+        }
+      }
+    },
+    /**
+     * 清理地图标点
+     */
+    clearM: function () {
+      let _that = this
+      _that.resultLayer.clearLayers()
+    },
+    //查询摄像头落点列表
+    selectCameraList() {
       listForMark().then(response => {
-        // let res = response;
-        // for (let i = 0; i < res.data.length; i++) {
-        this.addMark(response);
-        // }
+        this.addCameraMark(response);
       });
     },
-    addMark: function (options) {
+    addCameraMark: function (options) {
       //创建聚散图层并添加layers
       let marker = [];
-      let resultLayer = L.markerClusterGroup({
+      this.resultLayer = L.markerClusterGroup({
         showCoverageOnHover: false,
         zoomToBoundsOnClick: true,
         animateAddingMarkers: true,
@@ -328,7 +277,7 @@ export default {
           icon: myIcon
         });
         marker.bindPopup(markpoint);
-        resultLayer.addLayer(marker);
+        this.resultLayer.addLayer(marker);
         /**鼠标悬停打开popup**/
         marker.on('mouseover', function () {
           let html = "";
@@ -342,39 +291,150 @@ export default {
           this.closePopup();
         });
       })
+      this.resultLayer.addTo(this.map)
+    },
+
+    //查询抢险救援队落点列表
+    selectQkEmergencyRescueTeamAllList() {
+      selectQkEmergencyRescueTeamAllList().then(response => {
+        this.addTeamMark(response);
+      })
+    },
+    addTeamMark: function (options) {
+      //创建聚散图层并添加layers
+      let that = this;
+      let marker = [];
+      that.resultLayer = L.markerClusterGroup({
+        showCoverageOnHover: false,
+        zoomToBoundsOnClick: true,
+        animateAddingMarkers: true,
+        spiderfyOnMaxZoom: true
+      });
+      options.data.forEach(e => {
+        var lat = e.latitude;
+        var lon = e.longitude;
+        var myIcon = L.icon({
+          iconUrl: require('@/assets/images/cameraType/yjdw.png'),
+          iconAnchor: [50, 50],
+          iconSize: [37, 64],
+          popupAnchor: [-33, -47],
+          shadowSize: [41, 41],
+        });
+        marker = L.marker([lat, lon], {
+          icon: myIcon
+        });
+        that.resultLayer.addLayer(marker);
+        /**鼠标悬停打开popup**/
+        marker.on('click', function () {
+          that.suppliesOpen = false
+          that.selectQkEmergencyRescueTeamByDeptId(e.deptId)
+        });
+
+      })
+      that.resultLayer.addTo(that.map)
+    },
+    selectQkEmergencyRescueTeamByDeptId(deptId) {
+      selectQkEmergencyRescueTeamByDeptId(deptId).then(res => {
+        this.teamData = res.data;
+        this.teamOpen = true
 
-      // marker = L.marker(
-      //   [options.latitude,options.longitude]
-      //   ,{
-      //     icon: L.icon({
-      //       iconUrl: getIcon(options.buildType),
-      //       iconAnchor: [50, 50],
-      //       iconSize: [37, 64],
-      //       popupAnchor: [-33, -47],
-      //       shadowSize: [41, 41],
-      //     })
-      //   }
-      //   );
-      // /**鼠标悬停打开popup**/
-      // marker.on('mouseover', function () {
-      //   let html = "";
-      //   html += "<p class='v-p-color'>摄像头名称：" + val.cameraName + "</p>";
-      //   html += "<p class='v-p-color'>摄像头类型：" + val.buildTypeName + "</p>";
-      //   html += "<p class='v-p-color'>所属派出所：" + val.policeName + "</p>";
-      //   this.bindPopup(html).openPopup(this.getLatLng());
-      // });
-      // // /**鼠标移开关闭popup**/
-      // marker.on('mouseout', function () {
-      //   this.closePopup();
-      // });
-      // marker.on('click', function () {
-      //   getEventDetail(options.eventId).then(response => {
-      //     that.$emit('child-event', response);
-      //   });
-      // });
-      // marker.addTo(this.map);
+      })
+    },
+    //查询应急避难所落点列表
+    selectQkEmergencyShelterAllList() {
+      selectQkEmergencyShelterAllList().then(response => {
+        this.addShelterMark(response)
+      })
+    },
+    addShelterMark: function (options) {
+      //创建聚散图层并添加layers
+      let marker = [];
+      this.resultLayer = L.markerClusterGroup({
+        showCoverageOnHover: false,
+        zoomToBoundsOnClick: true,
+        animateAddingMarkers: true,
+        spiderfyOnMaxZoom: true
+      });
+      options.data.forEach(e => {
+        var lat = e.latitude;
+        var lon = e.longitude;
+        var markpoint = e.markpoint;
+        var myIcon = L.icon({
+          iconUrl: require('@/assets/images/cameraType/bncs.png'),
+          iconAnchor: [50, 50],
+          iconSize: [37, 64],
+          popupAnchor: [-33, -47],
+          shadowSize: [41, 41],
+        });
+        marker = L.marker([lat, lon], {
+          icon: myIcon
+        });
+        marker.bindPopup(markpoint);
+        this.resultLayer.addLayer(marker);
+        /**鼠标悬停打开popup**/
+        marker.on('click', function () {
+          let html = "";
+          html += "<p class='v-p-color'>避难场所名称：" + e.name + "</p>";
+          html += "<p class='v-p-color'>类型：" + e.type + "</p>";
+          html += "<p class='v-p-color'>地址：" + e.address + "</p>";
+          html += "<p class='v-p-color'>避难场所范围：" + e.range + "</p>";
+          html += "<p class='v-p-color'>避难场所现状描述：" + e.state + "</p>";
+          html += "<p class='v-p-color'>占地面积（m²）：" + e.area + "</p>";
+          html += "<p class='v-p-color'>可转移安置人数（万人)：" + e.transferPerson + "</p>";
+          html += "<p class='v-p-color'>建设内容：" + e.constructionContent + "</p>";
+          this.bindPopup(html).openPopup(this.getLatLng());
+        });
+        // /**鼠标移开关闭popup**/
+        marker.on('dblclick', function () {
+          this.closePopup();
+        });
+      })
+      this.resultLayer.addTo(this.map)
+    },
 
-      resultLayer.addTo(this.map)
+    //查询防汛抗旱物资储备落点列表
+    selectQkRescueSuppliesAllList() {
+      selectQkRescueSuppliesAllList().then(response => {
+        this.addSuppliesMark(response);
+      })
+    },
+    addSuppliesMark: function (options) {
+      let that = this
+      //创建聚散图层并添加layers
+      let marker = [];
+      that.resultLayer = L.markerClusterGroup({
+        showCoverageOnHover: false,
+        zoomToBoundsOnClick: true,
+        animateAddingMarkers: true,
+        spiderfyOnMaxZoom: true
+      });
+      options.data.forEach(e => {
+        var lat = e.latitude;
+        var lon = e.longitude;
+        var myIcon = L.icon({
+          iconUrl: require('@/assets/images/cameraType/khwz.png'),
+          iconAnchor: [50, 50],
+          iconSize: [37, 64],
+          popupAnchor: [-33, -47],
+          shadowSize: [41, 41],
+        });
+        marker = L.marker([lat, lon], {
+          icon: myIcon
+        });
+        that.resultLayer.addLayer(marker);
+        /**鼠标悬停打开popup**/
+        marker.on('click', function () {
+          that.teamOpen = false
+          that.selectQkRescueSuppliesByDeptId(e.deptId)
+        });
+      })
+      that.resultLayer.addTo(that.map)
+    },
+    selectQkRescueSuppliesByDeptId(deptId) {
+      selectQkRescueSuppliesByDeptId(deptId).then(res => {
+        this.suppliesData = res.data;
+        this.suppliesOpen = true
+      })
     },
   }
 }
@@ -386,6 +446,15 @@ export default {
   z-index: 0;
 }
 
+th {
+  width: 100px; /* 设置宽度 */
+  color: white; /* 设置字体颜色为白色 */
+}
+
+td {
+  color: white; /* 设置字体颜色为白色 */
+}
+
 /*地图DOM*/
 #qksupermap {
   width: 100%;