wuhongjian
/
qd-changjing
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update

This commit is contained in:
yangxiaojiang 2022-07-29 17:09:40 +08:00
parent 2de58910b3
commit b47614a94f
5 changed files with 254 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/supermap/advance-init.js
View File

@ -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,
}
}

35
src/views/pages/area/components/ComplaintEvent.vue
View File

@ -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 {

21
src/views/pages/area/components/SiteList.vue
View File

@ -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() {

57
src/views/pages/area/components/VideoList.vue
View File

@ -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){
// const cameraTree = [{
// latLng: { lat: data.gpsY, lng: data.gpsX },
// data: data,
// type:'cameraTree'
// }]
// this.hiMapFun.removeLayerByLayerName("cameraTree");
// this.hiMapFun.openPopupVideoSurveillance(cameraTree[0])
// const arr = [0,0.0,'','0','0.0']
// if(arr.indexOf(data.gpsX) == -1){
// this.hiMapFun.addResourceOnMapWithoutSuperMapCluster(cameraTree,"poi-red.png", "cameraTree");
// this.hiMap.mapObj.map.flyTo({ lat: data.gpsY, lng: data.gpsX });
// }
// }
if(data.channelCode){
const cameraTree = [{
latLng: { lat: data.gpsY, lng: data.gpsX },
data: data,
type:'cameraTree'
}]
this.$parent.hiMapFun.removeLayerByLayerName("cameraTree");
this.$parent.hiMapFun.openPopupVideoSurveillance(cameraTree[0])
const arr = [0,0.0,'','0','0.0']
if(arr.indexOf(data.gpsX) == -1){
this.$parent.hiMapFun.addResourceOnMapWithoutSuperMapCluster(cameraTree,"poi-red.png", "cameraTree");
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>

170
src/views/pages/area/index.vue
View File

@ -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 {createCameraDetailsPop} from '@/supermap/createMarkerPopup';
import { createSiteListPop,createCameraDetailsPop,createEventListDetailsPop } 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,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;
}
}
}
}
}
}
}