From b47614a94f749c01451313a8f87b6b45ff4d2bd2 Mon Sep 17 00:00:00 2001 From: yangxiaojiang <851673013@qq.com> Date: Fri, 29 Jul 2022 17:09:40 +0800 Subject: [PATCH] update --- src/supermap/advance-init.js | 10 ++ .../pages/area/components/ComplaintEvent.vue | 35 +++- src/views/pages/area/components/SiteList.vue | 21 ++- src/views/pages/area/components/VideoList.vue | 57 ++++-- src/views/pages/area/index.vue | 170 ++++++++++++++++-- 5 files changed, 254 insertions(+), 39 deletions(-) diff --git a/src/supermap/advance-init.js b/src/supermap/advance-init.js index 0d80405..257eb11 100644 --- a/src/supermap/advance-init.js +++ b/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, } } diff --git a/src/views/pages/area/components/ComplaintEvent.vue b/src/views/pages/area/components/ComplaintEvent.vue index dee213d..beff71b 100644 --- a/src/views/pages/area/components/ComplaintEvent.vue +++ b/src/views/pages/area/components/ComplaintEvent.vue @@ -7,7 +7,7 @@
-
今日事件 36
+
今日事件 {{todayListNum}}
@@ -60,7 +60,7 @@
-
+
{{item.eventNewName||''}} {{item.captureTime||''}} @@ -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" + ); + } }, }; @@ -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 { diff --git a/src/views/pages/area/components/SiteList.vue b/src/views/pages/area/components/SiteList.vue index 047b4d5..3854ac5 100644 --- a/src/views/pages/area/components/SiteList.vue +++ b/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() { diff --git a/src/views/pages/area/components/VideoList.vue b/src/views/pages/area/components/VideoList.vue index 087b26d..f25c77e 100644 --- a/src/views/pages/area/components/VideoList.vue +++ b/src/views/pages/area/components/VideoList.vue @@ -14,7 +14,7 @@
-
+
-
+
.el-tree-node__content { + background-color: rgba(27,255,255,.2); + color: #fff; + } + } } } diff --git a/src/views/pages/area/index.vue b/src/views/pages/area/index.vue index 63561a9..0ca3ba1 100644 --- a/src/views/pages/area/index.vue +++ b/src/views/pages/area/index.vue @@ -71,9 +71,14 @@
人流热力
- + + + 全市 + 本地 + 外地 +
@@ -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 {createCameraDetailsPop} from '@/supermap/createMarkerPopup'; +import { createSiteListPop,createCameraDetailsPop,createEventListDetailsPop } from "@/supermap/createMarkerPopup"; +import { listPassengerFlow, selectByTime, } from "@/api/civilizedCity.js"; export default { data() { @@ -100,10 +105,16 @@ export default { state: "", constructionSiteData: [], - changeLayerBtnList: ['AI事件','视频监控','工地','道路'], + changeLayerBtnList: ['AI事件','视频监控'], changeLayerBtnListArea: ['公园广场','商业街区','景区景点','海水浴场','窗口单位'], changeLayerBtnListHot: ['全市','本市','外地',], changeLayerBtnGroup: [], + + thermodynamicPeopleType: '', + thermodynamicPeopleAll: [], + thermodynamicPeopleLocal: [], + thermodynamicPeopleNoLocal: [], + }; }, @@ -160,7 +171,15 @@ 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) { if (queryString.length > 0) { @@ -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; + } + } + } + } } } }