update

src/supermap/advance-init.js

@@ -1989,6 +1989,15 @@ export function MapFun(mapObj) {
     polyline.addTo(map)
     polylineArr.push(polyline)
   }
+
+  const _addAreaToMap = function (latLng) {
+    // console.log(latLng)
+    // debugger
+    const polygon = L.polygon(latLng, { color: 'red' })
+    // map.fitBounds(polyline.getBounds())
+    polygon.addTo(map)
+    PolygonArr.push(polygon)
+  }
   return {
     // 按图层配置名称删除
     removeLayerByLayerName: _removeLayerByLayerName,
@@ -2063,5 +2072,6 @@ export function MapFun(mapObj) {
     thermodynamic: _thermodynamic,
     addPathToMap: _addPathToMap,
     addPointTestOnMap: _addPointTestOnMap,
+    addAreaToMap:_addAreaToMap,
   }
 }

src/views/pages/area/components/ComplaintEvent.vue

@@ -7,7 +7,7 @@
       <div class="toady-list-content">
         <div class="toady-list-rotate"></div>
         <div class="toady-list-icon"></div>
-        <div class="toady-list-num">今日事件<span> 36 </span>件</div>
+        <div class="toady-list-num">今日事件<span> {{todayListNum}} </span>件</div>
       </div>
     </div>
     <div class="tab-box">
@@ -60,7 +60,7 @@
         </el-dropdown-menu>
       </el-dropdown>
       <div class="event-list" :style="{ 'margin-top': (tabsActiveName == '走航监测'? '60px' :'12px')}">
-        <div class="event-details" v-for="item in eventListData" :key="item.index">
+        <div class="event-details" v-for="item in eventListData" :key="item.index" @click="openDetailsDialog(item)">
           <div class="event-details-title">
             <span>{{item.eventNewName||''}}</span>
             <span>{{item.captureTime||''}}</span>
@@ -102,6 +102,7 @@ import bus from "@/views/layout/bus";
 import {
   selectEvent,
   selectByName,
+  selectByTime,
 } from "@/api/civilizedCity";
 export default {
   data() {
@@ -123,6 +124,8 @@ export default {
       roadData:[],
       listTypeSelect: "全部",
       EventBtns: ["全部","占道经营","渣土车发现","违章停车","环境卫生","沿街晾晒","渣土车未密闭","道路积水事件",],
+
+      todayListNum:0,
     };
   },
   components: {
@@ -150,6 +153,12 @@ export default {
         this.eventListData = res.data.data.events
         this.pageCount = res.data.data.page
     });
+
+    selectByTime().then((res)=>{
+      if(res.data.data){
+        this.todayListNum = res.data.data.length
+      }
+    })
   },
   methods: {
     tabHandleClick(item) {
@@ -213,6 +222,24 @@ export default {
         })
       }
     },
+
+    openDetailsDialog(data) {
+      this.$parent.hiMapFun.removeLayerByLayerName('EventListDetail')
+      const EventListDetail = [
+        {
+          latLng: { lat: data.latitude, lng: data.longitude },
+          data: data,
+          type: "eventList",
+        },
+      ];
+      this.$parent.hiMap.mapObj.map.flyTo({ lat: data.latitude, lng: data.longitude });
+      this.$parent.hiMapFun.openPopupVideoSurveillance(EventListDetail[0]);
+      this.$parent.hiMapFun.addResourceOnMapWithoutSuperMapCluster(
+        EventListDetail,
+        "poi-event.png",
+        "EventListDetail"
+      );
+    }
   },
 };
 </script>
@@ -415,7 +442,7 @@ export default {
       // margin-top: 12px;
       // margin-top: 30px;
       width: 100%;
-      height: 625px;
+      height: 670px;
       position: relative;
 
       .event-details {
@@ -423,7 +450,7 @@ export default {
         margin-top: 16px;
         // margin-top: 18px;
         width: 100%;
-        max-height: 130px;
+        height: 140px;
         padding-right: 8px;
         background: linear-gradient(90deg, #173759 0, #133150 100%);
         .event-details-title {

src/views/pages/area/components/SiteList.vue

@@ -55,6 +55,8 @@ import {
   selectKeyAreaList,
   selectByAreaName,
 } from "@/api/area";
+import { gcjLL2wgs84LL } from "@/utils/coordinateSystemTransform";
+
 
 export default {
   data() {
@@ -88,7 +90,7 @@ export default {
           label: '窗口单位'
         }, 
       ],
-      selectValue: '公园广场'
+      selectValue: '公园广场',
     };
   },
   mounted() {
@@ -96,10 +98,6 @@ export default {
       console.log(res.data.data)
       this.siteData = res.data.data
     })
-    selectByAreaName({areaName:"李村商圈"}).then((res) => {
-      console.log(res.data.data)
-    })
-  
   },
   methods: {
     
@@ -125,7 +123,18 @@ export default {
     },
     // 行点击
     analyse(row) {
-      bus.$emit("openCauseAnalysis", row);
+      // bus.$emit("openCauseAnalysis", row);
+      this.$parent.hiMapFun.removerPolygon()
+      selectByAreaName({areaName:row.areaName}).then((res) => {
+        if(res.data.data){
+          let areaLatLng = []
+          res.data.data.forEach((item) => {
+            let lonLat = gcjLL2wgs84LL(item.longitude, item.latitude);
+            areaLatLng.push([lonLat[1],lonLat[0]])
+          })
+          this.$parent.hiMapFun.addAreaToMap(areaLatLng)
+        }
+      })
     },
     // 关闭基本信息窗口
     informationClose() {

src/views/pages/area/components/VideoList.vue

@@ -14,7 +14,7 @@
       </div>
     </div>
 
-    <div v-if="tabsActiveName == '视频标签'" class="label-content">
+    <div v-show="tabsActiveName == '视频标签'" class="label-content">
       <el-input
         placeholder="请输入关键词"
         prefix-icon="el-icon-search"
@@ -34,7 +34,7 @@
       </el-checkbox-group>
     </div>
 
-    <div v-if="tabsActiveName == '视频列表'" class="label-content">
+    <div v-show="tabsActiveName == '视频列表'" class="label-content">
       <el-input
         placeholder="请输入关键词"
         suffix-icon="el-icon-search"
@@ -224,20 +224,20 @@ export default {
     },
     treeCameraClick(data) {
       console.log(data)
-      // if(data.channelCode){
+      if(data.channelCode){
-      //   const cameraTree = [{
+        const cameraTree = [{
-      //     latLng: { lat: data.gpsY, lng: data.gpsX },
+          latLng: { lat: data.gpsY, lng: data.gpsX },
-      //     data: data,
+          data: data,
-      //     type:'cameraTree'
+          type:'cameraTree'
-      //   }]
+        }]
-      //   this.hiMapFun.removeLayerByLayerName("cameraTree");
+        this.$parent.hiMapFun.removeLayerByLayerName("cameraTree");
-      //   this.hiMapFun.openPopupVideoSurveillance(cameraTree[0])
+        this.$parent.hiMapFun.openPopupVideoSurveillance(cameraTree[0])
-      //   const arr = [0,0.0,'','0','0.0']
+        const arr = [0,0.0,'','0','0.0']
-      //   if(arr.indexOf(data.gpsX) == -1){
+        if(arr.indexOf(data.gpsX) == -1){
-      //     this.hiMapFun.addResourceOnMapWithoutSuperMapCluster(cameraTree,"poi-red.png", "cameraTree");
+          this.$parent.hiMapFun.addResourceOnMapWithoutSuperMapCluster(cameraTree,"poi-red.png", "cameraTree");
-      //     this.hiMap.mapObj.map.flyTo({ lat: data.gpsY, lng: data.gpsX });
+          this.$parent.hiMap.mapObj.map.flyTo({ lat: data.gpsY, lng: data.gpsX });
-      //   }
+        }
-      // }
+      }
     },
     filterNode(value, data) {
       if (value == "2") return true;
@@ -346,6 +346,31 @@ export default {
         background: linear-gradient(0deg, #1577d3 0%, #1251ab 100%);
       }
     }
+
+    .el-tree {
+      width: 366px;
+      height: 300px;
+      overflow-y: auto;
+      margin-top: 10px;
+      background: transparent;
+      color: #fff;
+
+      &::-webkit-scrollbar {
+      width: 8px;
+      background-color: #10335e;
+      }
+      &::-webkit-scrollbar-thumb {
+        background-color: #446dac !important;
+      }
+
+      .el-tree-node__content:hover {
+        background: rgba(27,255,255,.2);
+      }
+      .el-tree-node:focus > .el-tree-node__content {
+        background-color: rgba(27,255,255,.2);
+        color: #fff;
+      }
+    }
   }
 }
 </style>

src/views/pages/area/index.vue

@@ -71,9 +71,14 @@
         </div>
         <div class="title">人流热力</div>
         <div class="change-btn-box">
-          <el-checkbox-group v-model="changeLayerBtnGroup">
+          <!-- <el-checkbox-group v-model="changeLayerBtnGroup">
             <el-checkbox v-for="item in changeLayerBtnListHot" :key="item.index" :label="item" @change="layerHandleChange(item)"></el-checkbox>
-          </el-checkbox-group>
+          </el-checkbox-group> -->
+          <el-radio-group v-model="thermodynamicPeopleType" @change="changeThermodynamicPeopleType">
+            <el-radio label="all">全市</el-radio>
+            <el-radio label="local">本地</el-radio>
+            <el-radio label="noLocal">外地</el-radio>
+          </el-radio-group>
         </div>
       </div>
     </div>
@@ -89,8 +94,8 @@ import complaintEvent from "./components/ComplaintEvent";
 import VideoList from "./components/VideoList";
 import SiteList from "./components/SiteList";
 import { selectByJdWd } from "@/api/construction/index";
-import { createSiteListPop } from "@/supermap/createMarkerPopup";
+import { createSiteListPop,createCameraDetailsPop,createEventListDetailsPop } from "@/supermap/createMarkerPopup";
-import {createCameraDetailsPop} from '@/supermap/createMarkerPopup';
+import { listPassengerFlow, selectByTime, } from "@/api/civilizedCity.js";
 
 export default {
   data() {
@@ -100,11 +105,17 @@ export default {
 
       state: "",
       constructionSiteData: [],
-      changeLayerBtnList: ['AI事件','视频监控','工地','道路'],
+      changeLayerBtnList: ['AI事件','视频监控'],
       changeLayerBtnListArea: ['公园广场','商业街区','景区景点','海水浴场','窗口单位'],
       changeLayerBtnListHot: ['全市','本市','外地',],
       changeLayerBtnGroup: [],
 
+      thermodynamicPeopleType: '',
+      thermodynamicPeopleAll: [],
+      thermodynamicPeopleLocal: [],
+      thermodynamicPeopleNoLocal: [],
+
+    
     };
   },
   components: {
@@ -160,6 +171,14 @@ export default {
     bus.$on("CameraSingleDataOnMap",(labelName,data) => {
       this.addResourceTomap(labelName,data);
     })
+
+    this.thermodynamic()
+
+    selectByTime().then((res)=>{
+      if(res.data.data){
+        this.todayListNum = res.data.data.length
+      }
+    })
    },
   methods: {
     querySearchAsync(queryString, cb) {
@@ -268,12 +287,23 @@ export default {
             this.roadOnMap(this.$refs.complaintEventRef.roadData);
             break;
           case "AI事件":
+            this.hiMapFun.removeLayerByLayerName('EventListDetail')
+            selectByTime().then((res) => {
+              const dataEvent = [];
+              res.data.data.forEach((item) => {
+                dataEvent.push(
+                  {
+                    latLng: { lat: item.latitude, lng: item.longitude },
+                    data: item,
+                    type: "eventList",
+                  }
+                )
+              })
+              this.hiMapFun.addResourceOnMapWithoutSuperMapCluster(dataEvent, "poi-event.png", "EventListDetail", createEventListDetailsPop)
+            })
             break;
           case "视频监控":
             this.addResourceTomap('全部',this.$refs.videoListRef.cameraAllData)
-            break;
-          case "工地":
-
             break;
           default:
             break;
@@ -284,12 +314,10 @@ export default {
             this.hiMapFun.removerPolyline();
             break;
           case "AI事件":
+            this.hiMapFun.removeLayerByLayerName('EventListDetail')
             break;
           case "视频监控":
             this.hiMapFun.removeLayerByLayerName('全部')
-            break;
-          case "工地":
-
             break;
           default:
             break;
@@ -312,6 +340,80 @@ export default {
       });
       this.hiMapFun.addResourceOnMapWithoutSuperMapCluster(dataEvent, "videoSurveillance.png", type, createCameraDetailsPop)
     },
+
+    thermodynamic() {
+      let dataNumber = [];
+      let dataNumberLocal = [];
+      let dataNumberNoLocal = [];
+      listPassengerFlow().then((res) => {
+          const data = res.data;
+          // 最大值
+          for (let num = 0; num < data.length; num++) {
+            dataNumber.push(data[num].allNums);
+            dataNumberLocal.push(data[num].localNums);
+            dataNumberNoLocal.push(data[num].nonlocalNums);
+          }
+          let max = Math.max.apply(null, dataNumber);
+          let maxLocal = Math.max.apply(null, dataNumberLocal);
+          let maxNoLocal = Math.max.apply(null, dataNumberNoLocal);
+          data.forEach((item) => {
+            const arr = [0, 0.0, "", "0", "0.0"];
+            if (arr.indexOf(item.latitude) == -1 && arr.indexOf(item.longitude) == -1) {
+              //全部
+              if(item.allNums !== '0'){
+                let allNums = Number((item.allNums / max).toFixed(1))
+                if(allNums > 0.1){
+                  this.thermodynamicPeopleAll.push([
+                    Number(item.latitude),
+                    Number(item.longitude),
+                    allNums
+                  ]);
+                }
+              }
+              //本地
+              if(item.localNums !== '0'){
+                let localNums =  Number((item.localNums / maxLocal).toFixed(1))
+                if(localNums > 0.1){
+                  this.thermodynamicPeopleLocal.push([
+                    Number(item.latitude),
+                    Number(item.longitude),
+                    localNums
+                  ]);
+                }
+              }
+              //外地
+              if(item.nonlocalNums !== '0'){
+                let nonlocalNums  = Number((item.nonlocalNums / maxNoLocal).toFixed(1))
+                if(nonlocalNums > 0.1){
+                  this.thermodynamicPeopleNoLocal.push([
+                    Number(item.latitude),
+                    Number(item.longitude),
+                    nonlocalNums
+                  ]);
+                }
+              }
+            }
+          });
+        });
+    },
+
+    changeThermodynamicPeopleType(value) {
+      switch (value) {
+        case 'all':
+          this.hiMapFun.removeLayerByLayerName("thermodynamic");
+          this.hiMapFun.thermodynamic(this.thermodynamicPeopleAll, 25, "thermodynamic");
+          break;
+        case 'local':
+          this.hiMapFun.removeLayerByLayerName("thermodynamic");
+          this.hiMapFun.thermodynamic(this.thermodynamicPeopleLocal, 25, "thermodynamic");
+          break;
+        case 'noLocal':
+          this.hiMapFun.removeLayerByLayerName("thermodynamic");
+          this.hiMapFun.thermodynamic(this.thermodynamicPeopleNoLocal, 25, "thermodynamic");
+          break;
+        
+      }
+    },
   },
   beforeDestroy() {},
 };
@@ -412,7 +514,7 @@ export default {
     z-index: 1000;
     left: 10px;
     top: 90px;
-    height:908px;
+    height:980px;
     width: 478px;
     background: rgba($color: #05213b, $alpha: .85)
   }
@@ -517,6 +619,48 @@ export default {
           }
         }
       }
+
+      ::v-deep .el-radio-group {
+        background: transparent;
+        .el-radio__inner {
+          border-radius: unset;
+          border: 1px solid #1ffefd;
+          background: transparent;
+          &::after {
+            border-radius: unset;
+            background: transparent;
+          }
+        }
+        .el-radio__label {
+          color: #fff;
+        }
+        .el-radio.is-checked {
+          .el-radio__label {
+            color: #1ffefd;
+          }
+
+          .el-radio__inner {
+            border-radius: unset;
+            &::after {
+              content: "";
+              box-sizing: content-box;
+              border-radius: unset;
+              position: absolute;
+              height: 7px;
+              width: 3px;
+              left: 4px;
+              top: 1px;
+              border: 1px solid #1ffefd;
+              transform: rotate(45deg) scaleY(1);
+              transform-origin: center;
+              border-left: 0;
+              border-top: 0;
+              background: transparent;
+              transition: transform .15s ease-in .05s,-webkit-transform .15s ease-in .05s;
+            }
+          }
+        }
+      }
     }
   }
 }