|
|
@@ -22,11 +22,11 @@
|
|
|
<Jsmsdialog ref="Jsmsdialog"></Jsmsdialog>
|
|
|
<!--<div class="yj-topnav-div" title="地图信息"><i class="iconfont yj-icon-centerdata-t-firecontrol-other-linkage-force"></i></div>-->
|
|
|
<div class="yj-topnav">
|
|
|
- <el-checkbox-group v-model="checkList">
|
|
|
- <el-checkbox label="避难场所"></el-checkbox>
|
|
|
- <el-checkbox label="救援物资库"></el-checkbox>
|
|
|
- <el-checkbox label="救援队伍"></el-checkbox>
|
|
|
- <el-checkbox label="视联网"></el-checkbox>
|
|
|
+ <el-checkbox-group v-model="checkList" @change="eventPoints_byType(checkList)">
|
|
|
+ <el-checkbox label="shelter">避难场所</el-checkbox>
|
|
|
+ <el-checkbox label="rescueSupplies">救援物资库</el-checkbox>
|
|
|
+ <el-checkbox label="rescueTeam">救援队伍</el-checkbox>
|
|
|
+ <el-checkbox label="camera">视联网</el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
<a><i class="iconfont yj-icon-nav"></i>普查结果</a>
|
|
|
<a><i class="iconfont yj-icon-zhiban"></i>值班信息</a>
|
|
|
@@ -48,7 +48,7 @@
|
|
|
data() {
|
|
|
return {
|
|
|
mapToolShowBH:false,
|
|
|
- checkList: ['']
|
|
|
+ checkList: []
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
|
@@ -164,10 +164,460 @@
|
|
|
// })
|
|
|
}
|
|
|
setTimeout(() => {
|
|
|
+ // this.$refs.supermap.setMarkers(markersList);
|
|
|
this.$refs.supermap.setMarkersByType(markersList, type);
|
|
|
}, 3000)
|
|
|
},
|
|
|
|
|
|
+ //避难场所 落点
|
|
|
+ eventPoints_byType(checkList){
|
|
|
+ console.log("checkList=",checkList)
|
|
|
+ this.$refs.supermap.clearM(true);
|
|
|
+ for (let i = 0; i < checkList.length; i++) {
|
|
|
+ let type = checkList[i];
|
|
|
+ if(type == "shelter"){
|
|
|
+ this.eventPoints_shelter(type);
|
|
|
+ }else if(type == "rescueSupplies"){
|
|
|
+ this.eventPoints_rescueSupplies(type);
|
|
|
+ }else if(type == "rescueTeam"){
|
|
|
+ this.eventPoints_rescueTeam(type);
|
|
|
+ }else if(type == "camera"){
|
|
|
+ this.eventPoints_camera(type);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //避难场所 落点
|
|
|
+ eventPoints_shelter(type){
|
|
|
+ console.log(666)
|
|
|
+ let pointList = [];
|
|
|
+ pointList.push({
|
|
|
+ name:"白石村避难所",
|
|
|
+ contacts:"张洁玲",
|
|
|
+ phone:"13500805931",
|
|
|
+ longitude:129.416,
|
|
|
+ latitude:42.918
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"延河路避难所",
|
|
|
+ contacts:"王建军",
|
|
|
+ phone:"13664407655",
|
|
|
+ longitude:129.47,
|
|
|
+ latitude:42.898
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"兴安村避难所",
|
|
|
+ contacts:"蔡雨虹",
|
|
|
+ phone:"15754320117",
|
|
|
+ longitude:129.506,
|
|
|
+ latitude:42.945
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"小白石村避难所",
|
|
|
+ contacts:"吕国琴",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.436,
|
|
|
+ latitude:42.939
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"上东沟避难所",
|
|
|
+ contacts:"吴明月",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.406,
|
|
|
+ latitude:42.945
|
|
|
+ });
|
|
|
+
|
|
|
+ var markersList = []
|
|
|
+ for (let i = 0; i < pointList.length; i++) {
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: 'marker',
|
|
|
+ bindPopupHtml: '',
|
|
|
+ click: '',
|
|
|
+ parameter: pointList[i],
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: true
|
|
|
+ }
|
|
|
+ markersMap.icon = 'sj-icon-map-' + type.replaceAll("_", "-");
|
|
|
+ markersMap.lng = pointList[i].longitude;
|
|
|
+ markersMap.lat = pointList[i].latitude;
|
|
|
+ markersMap.bindPopupHtml = '<div class="map-tip">' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>资源名称：' + pointList[i].name + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>经纬度：' + pointList[i].longitude +','+ pointList[i].latitude + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>联系人：' + (pointList[i].contacts ? pointList[i].contacts : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>电话：' + (pointList[i].phone ? pointList[i].phone : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '</div>'
|
|
|
+ markersList.push(markersMap)
|
|
|
+ // let icon = new window.L.Icon({
|
|
|
+ // iconUrl: iconList[markersList[i].icon],
|
|
|
+ // iconSize: [48, 48],
|
|
|
+ // iconAnchor: [24, 40],
|
|
|
+ // popupAnchor: [-3, -40],
|
|
|
+ // shadowSize: [41, 41]
|
|
|
+ // })
|
|
|
+ // let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
|
|
|
+ // icon: markersMap.icon
|
|
|
+ // })
|
|
|
+ // markerClick.on('click', function() {
|
|
|
+ // let clickName = markersList[i].click
|
|
|
+ // this.$emit(clickName, markersList[i].parameter)
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ // this.$refs.supermap.clearM(false);
|
|
|
+ this.$refs.supermap.setMarkers(markersList);
|
|
|
+ // this.$refs.supermap.setMarkersByType(markersList, type);
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+
|
|
|
+ //救援物资库 落点
|
|
|
+ eventPoints_rescueSupplies(type){
|
|
|
+ console.log(777)
|
|
|
+ let pointList = [];
|
|
|
+ pointList.push({
|
|
|
+ name:"白石村救援物资库",
|
|
|
+ contacts:"张洁玲",
|
|
|
+ phone:"13500805931",
|
|
|
+ longitude:129.406,
|
|
|
+ latitude:42.898
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"延河路救援物资库",
|
|
|
+ contacts:"王建军",
|
|
|
+ phone:"13664407655",
|
|
|
+ longitude:129.45,
|
|
|
+ latitude:42.878
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"兴安村救援物资库",
|
|
|
+ contacts:"蔡雨虹",
|
|
|
+ phone:"15754320117",
|
|
|
+ longitude:129.486,
|
|
|
+ latitude:42.925
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"小白石村救援物资库",
|
|
|
+ contacts:"吕国琴",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.416,
|
|
|
+ latitude:42.919
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"上东沟救援物资库",
|
|
|
+ contacts:"吴明月",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.386,
|
|
|
+ latitude:42.925
|
|
|
+ });
|
|
|
+
|
|
|
+ var markersList = []
|
|
|
+ for (let i = 0; i < pointList.length; i++) {
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: 'marker',
|
|
|
+ bindPopupHtml: '',
|
|
|
+ click: 'abc',
|
|
|
+ parameter: pointList[i],
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: true
|
|
|
+ }
|
|
|
+ markersMap.icon = 'sj-icon-map-' + type.replaceAll("_", "-");
|
|
|
+ markersMap.lng = pointList[i].longitude;
|
|
|
+ markersMap.lat = pointList[i].latitude;
|
|
|
+ markersMap.bindPopupHtml = '<div class="map-tip">' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>资源名称：' + pointList[i].name + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>经纬度：' + pointList[i].longitude +','+ pointList[i].latitude + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>联系人：' + (pointList[i].contacts ? pointList[i].contacts : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>电话：' + (pointList[i].phone ? pointList[i].phone : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '</div>'
|
|
|
+ markersList.push(markersMap)
|
|
|
+ // let icon = new window.L.Icon({
|
|
|
+ // iconUrl: iconList[markersList[i].icon],
|
|
|
+ // iconSize: [48, 48],
|
|
|
+ // iconAnchor: [24, 40],
|
|
|
+ // popupAnchor: [-3, -40],
|
|
|
+ // shadowSize: [41, 41]
|
|
|
+ // })
|
|
|
+ // let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
|
|
|
+ // icon: markersMap.icon
|
|
|
+ // })
|
|
|
+ // markerClick.on('click', function() {
|
|
|
+ // let clickName = markersList[i].click
|
|
|
+ // this.$emit(clickName, markersList[i].parameter)
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ // this.$refs.supermap.clearM(false);
|
|
|
+ this.$refs.supermap.setMarkers(markersList);
|
|
|
+ // this.$refs.supermap.setMarkersByType(markersList, type);
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+
|
|
|
+ //救援队伍 落点
|
|
|
+ eventPoints_rescueTeam(type){
|
|
|
+ console.log(888)
|
|
|
+ let pointList = [];
|
|
|
+ pointList.push({
|
|
|
+ name:"白石村救援队伍",
|
|
|
+ contacts:"张洁玲",
|
|
|
+ phone:"13500805931",
|
|
|
+ longitude:129.426,
|
|
|
+ latitude:42.898
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"延河路救援队伍",
|
|
|
+ contacts:"王建军",
|
|
|
+ phone:"13664407655",
|
|
|
+ longitude:129.47,
|
|
|
+ latitude:42.878
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"兴安村救援队伍",
|
|
|
+ contacts:"蔡雨虹",
|
|
|
+ phone:"15754320117",
|
|
|
+ longitude:129.506,
|
|
|
+ latitude:42.925
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"小白石村救援队伍",
|
|
|
+ contacts:"吕国琴",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.436,
|
|
|
+ latitude:42.919
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"上东沟救援队伍",
|
|
|
+ contacts:"吴明月",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.406,
|
|
|
+ latitude:42.925
|
|
|
+ });
|
|
|
+
|
|
|
+ var markersList = []
|
|
|
+ for (let i = 0; i < pointList.length; i++) {
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: 'marker',
|
|
|
+ bindPopupHtml: '',
|
|
|
+ click: 'abc',
|
|
|
+ parameter: pointList[i],
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: true
|
|
|
+ }
|
|
|
+ markersMap.icon = 'sj-icon-map-' + type.replaceAll("_", "-");
|
|
|
+ markersMap.lng = pointList[i].longitude;
|
|
|
+ markersMap.lat = pointList[i].latitude;
|
|
|
+ markersMap.bindPopupHtml = '<div class="map-tip">' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>资源名称：' + pointList[i].name + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>经纬度：' + pointList[i].longitude +','+ pointList[i].latitude + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>联系人：' + (pointList[i].contacts ? pointList[i].contacts : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>电话：' + (pointList[i].phone ? pointList[i].phone : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '</div>'
|
|
|
+ markersList.push(markersMap)
|
|
|
+ // let icon = new window.L.Icon({
|
|
|
+ // iconUrl: iconList[markersList[i].icon],
|
|
|
+ // iconSize: [48, 48],
|
|
|
+ // iconAnchor: [24, 40],
|
|
|
+ // popupAnchor: [-3, -40],
|
|
|
+ // shadowSize: [41, 41]
|
|
|
+ // })
|
|
|
+ // let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
|
|
|
+ // icon: markersMap.icon
|
|
|
+ // })
|
|
|
+ // markerClick.on('click', function() {
|
|
|
+ // let clickName = markersList[i].click
|
|
|
+ // this.$emit(clickName, markersList[i].parameter)
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ // this.$refs.supermap.clearM(false);
|
|
|
+ this.$refs.supermap.setMarkers(markersList);
|
|
|
+ // this.$refs.supermap.setMarkersByType(markersList, type);
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+
|
|
|
+ //视联网 落点
|
|
|
+ eventPoints_camera(type){
|
|
|
+ console.log(999)
|
|
|
+ let pointList = [];
|
|
|
+ pointList.push({
|
|
|
+ name:"白石村摄像头",
|
|
|
+ contacts:"张洁玲",
|
|
|
+ phone:"13500805931",
|
|
|
+ longitude:129.406,
|
|
|
+ latitude:42.918
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"延河路摄像头",
|
|
|
+ contacts:"王建军",
|
|
|
+ phone:"13664407655",
|
|
|
+ longitude:129.45,
|
|
|
+ latitude:42.898
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"兴安村摄像头",
|
|
|
+ contacts:"蔡雨虹",
|
|
|
+ phone:"15754320117",
|
|
|
+ longitude:129.486,
|
|
|
+ latitude:42.945
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"小白石村摄像头",
|
|
|
+ contacts:"吕国琴",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.416,
|
|
|
+ latitude:42.939
|
|
|
+ });
|
|
|
+ pointList.push({
|
|
|
+ name:"上东沟摄像头",
|
|
|
+ contacts:"吴明月",
|
|
|
+ phone:"15044076332",
|
|
|
+ longitude:129.386,
|
|
|
+ latitude:42.945
|
|
|
+ });
|
|
|
+
|
|
|
+ var markersList = []
|
|
|
+ for (let i = 0; i < pointList.length; i++) {
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: 'marker',
|
|
|
+ bindPopupHtml: '',
|
|
|
+ click: 'abc',
|
|
|
+ parameter: pointList[i],
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: true
|
|
|
+ }
|
|
|
+ markersMap.icon = 'sj-icon-map-' + type.replaceAll("_", "-");
|
|
|
+ markersMap.lng = pointList[i].longitude;
|
|
|
+ markersMap.lat = pointList[i].latitude;
|
|
|
+ markersMap.bindPopupHtml = '<div class="map-tip">' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>资源名称：' + pointList[i].name + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>经纬度：' + pointList[i].longitude +','+ pointList[i].latitude + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>联系人：' + (pointList[i].contacts ? pointList[i].contacts : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>电话：' + (pointList[i].phone ? pointList[i].phone : "") + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '</div>'
|
|
|
+ markersList.push(markersMap)
|
|
|
+ // let icon = new window.L.Icon({
|
|
|
+ // iconUrl: iconList[markersList[i].icon],
|
|
|
+ // iconSize: [48, 48],
|
|
|
+ // iconAnchor: [24, 40],
|
|
|
+ // popupAnchor: [-3, -40],
|
|
|
+ // shadowSize: [41, 41]
|
|
|
+ // })
|
|
|
+ // let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
|
|
|
+ // icon: markersMap.icon
|
|
|
+ // })
|
|
|
+ // markerClick.on('click', function() {
|
|
|
+ // let clickName = markersList[i].click
|
|
|
+ // this.$emit(clickName, markersList[i].parameter)
|
|
|
+ // })
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ // this.$refs.supermap.clearM(false);
|
|
|
+ this.$refs.supermap.setMarkers(markersList);
|
|
|
+ // this.$refs.supermap.setMarkersByType(markersList, type);
|
|
|
+ }, 500)
|
|
|
+ },
|
|
|
+
|
|
|
|
|
|
/** 预览按钮操作 */
|
|
|
preview(cameraParam) {
|
wangzhe