Merge branch 'master' of http://192.168.124.50:80/wuhongjian/qd-changjing
This commit is contained in:
commit
915176e1df
|
@ -157,7 +157,7 @@ export function MapFun(mapObj) {
|
|||
}
|
||||
} else if (feature.type == 'eventList') {
|
||||
const elementHtml = createEventListDetailsPopNew(feature)
|
||||
L.popup({ className: 'Event-List-Details-pop', offset: [168, 200] }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map)
|
||||
L.popup({ className: 'Event-List-Details-pop', offset: [0, 200] }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map)
|
||||
} else if (feature.type == 'eventTwoList') {
|
||||
const elementHtml = createImportantAreaPopNew(feature)
|
||||
L.popup({ className: 'Event-List-Details-pop', offset: [168, 200] }).setLatLng(feature.latLng).setContent(elementHtml).openOn(map)
|
||||
|
|
|
@ -166,7 +166,7 @@ export default {
|
|||
},
|
||||
],
|
||||
eventListData: [],
|
||||
total:0,
|
||||
total:6,
|
||||
pageSize:6,
|
||||
currentPage:1,
|
||||
|
||||
|
@ -200,7 +200,7 @@ export default {
|
|||
let resdata=res.data.data;
|
||||
this.dateTabs[1].dataNum=resdata.length;
|
||||
// this.eventListData = res.data;
|
||||
this.total = res.count;
|
||||
// this.total = res.data.count;
|
||||
// console.log("执行函数111");
|
||||
//获取参数重新编辑
|
||||
$.ajax({
|
||||
|
|
|
@ -1,9 +1,10 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="title">重点区域列表</div>
|
||||
<div class="title-close" @click="handleClose"><i class="el-icon-close"></i></div>
|
||||
<!-- 工地列表 -->
|
||||
<div class="eventData">
|
||||
<div style="display: flex;justify-content: space-between">
|
||||
<div style="display: flex;">
|
||||
<el-input
|
||||
placeholder="请输入区域名称"
|
||||
prefix-icon="el-icon-search"
|
||||
|
@ -11,14 +12,14 @@
|
|||
v-model="searchValue"
|
||||
>
|
||||
</el-input>
|
||||
<el-select v-model="selectAreaValue" placeholder="全部" @change="fliterSiteByArea">
|
||||
<!-- <el-select v-model="selectAreaValue" placeholder="全部" @change="fliterSiteByArea">
|
||||
<el-option
|
||||
v-for="item in areaOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-select> -->
|
||||
<el-select v-model="selectValue" placeholder="全部" @change="fliterSiteByArea">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
|
@ -163,6 +164,10 @@ import { createImportantAreaPopNew } from '../../../../supermap/createMarkerPopu
|
|||
})
|
||||
},
|
||||
methods: {
|
||||
// 关闭重点区域。
|
||||
handleClose(){
|
||||
this.$emit("closeSiteListMore");
|
||||
},
|
||||
searchSite() {
|
||||
if (!this.searchValue && this.selectValue !== '全部') {
|
||||
selectKeyArea({ type: this.selectValue }).then((res) => {
|
||||
|
@ -223,6 +228,9 @@ import { createImportantAreaPopNew } from '../../../../supermap/createMarkerPopu
|
|||
let lonLat = gcjLL2wgs84LL(item[0], item[1]);
|
||||
areaLatLng.push([lonLat[1],lonLat[0]])
|
||||
})
|
||||
//跳转到响应的位置。
|
||||
let lonLat=arr[0];
|
||||
this.$parent.hiMap.mapObj.map.flyTo({ lat: lonLat[1], lng:lonLat[0] },14);
|
||||
this.$parent.hiMapFun.addAreaToMapNew(areaLatLng,row)
|
||||
}
|
||||
// else {
|
||||
|
@ -254,15 +262,26 @@ import { createImportantAreaPopNew } from '../../../../supermap/createMarkerPopu
|
|||
background: url(../../../../assets/construction/listTopBg.png) no-repeat,
|
||||
url(../../../../assets/construction/siteTag.png) no-repeat 507px 17px;
|
||||
padding: 30px 0 18px 14px;
|
||||
position: relative;
|
||||
.title {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
}
|
||||
.title-close{
|
||||
position: absolute;
|
||||
right:10px;
|
||||
top: 10px;
|
||||
cursor: pointer;
|
||||
.el-icon-close:before {
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
::v-deep .eventData {
|
||||
width: 544px;
|
||||
margin-top: 14px;
|
||||
.el-input {
|
||||
width: 200px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.el-input__inner {
|
||||
border: 1px solid rgba(31,254,253,.9);
|
||||
|
|
|
@ -106,6 +106,7 @@
|
|||
</template>
|
||||
<script>
|
||||
import bus from "@/views/layout/bus";
|
||||
import moment from 'moment'
|
||||
|
||||
import * as echarts from "echarts";
|
||||
export default {
|
||||
|
@ -135,20 +136,39 @@ export default {
|
|||
advice: "",
|
||||
area: "台东商圈",
|
||||
},
|
||||
lastWeek:[], //最近一周。
|
||||
|
||||
};
|
||||
},
|
||||
components: {
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
this.setDataRange();
|
||||
//获取高发区域
|
||||
this.getTop5Area();
|
||||
//获取高发事件
|
||||
this.getTop5EventCharts();
|
||||
//获取相关性分析
|
||||
this.getRelevanceCharts();
|
||||
// this.getRelevanceCharts();
|
||||
},
|
||||
methods: {
|
||||
// 设置daterange 日期
|
||||
// daterange: ['2022-11-18','2022-11-25'],
|
||||
setDataRange(){
|
||||
this.daterange=[];
|
||||
let nowData=moment().format("YYYY-MM-DD");
|
||||
let sevenData=moment().subtract(6, 'days').format('YYYY-MM-DD');
|
||||
this.daterange.push(sevenData);
|
||||
this.daterange.push(nowData);
|
||||
for (let i=6; i>=0; i--){
|
||||
let newData=moment().subtract(i, 'days').format('MM-DD');
|
||||
this.lastWeek.push(newData);
|
||||
// console.log("🚀 ~ file: VideoListRight.vue:168 ~ setDataRange ~ this.lastWeek", this.lastWeek)
|
||||
}
|
||||
//获取相关性分析
|
||||
this.getRelevanceCharts(this.lastWeek);
|
||||
},
|
||||
//选择选中的高发区域
|
||||
chooseSelectArea(item) {
|
||||
this.selectArea = item.areaId;
|
||||
|
@ -287,7 +307,7 @@ export default {
|
|||
eventChart.setOption(option);
|
||||
},
|
||||
//获取相关性分析
|
||||
getRelevanceCharts() {
|
||||
getRelevanceCharts(date) {
|
||||
let eventChart = echarts.init(document.getElementById("relevance-chart"));
|
||||
let option = {
|
||||
backgroundColor: "rgba(32, 33, 36,.7)",
|
||||
|
@ -317,7 +337,7 @@ export default {
|
|||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: ["11/18", "11/19", "11/20", "11/21", "11/22", "11/23", "11/24"],
|
||||
data: date,
|
||||
axisLine: {
|
||||
show: false, // 不显示坐标轴线
|
||||
lineStyle: {
|
||||
|
|
|
@ -66,7 +66,7 @@
|
|||
</div>
|
||||
<!-- 工地列表 -->
|
||||
<div class="siteList" v-if="keyAreasShow">
|
||||
<site-list-more></site-list-more>
|
||||
<site-list-more @closeSiteListMore="closeSiteListMore"></site-list-more>
|
||||
</div>
|
||||
|
||||
<!--视频列表弹出框-->
|
||||
|
@ -166,6 +166,9 @@ import { selectByAreaEvent, selectKeyArea } from "@/api/area";
|
|||
import { gcjLL2wgs84LL } from "@/utils/coordinateSystemTransform";
|
||||
// 时间轴
|
||||
import HorizonTimeLine from "./components/HorizonTimeLine";
|
||||
import {
|
||||
crowflowList,
|
||||
} from "@/api/areaMonitor";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
@ -279,6 +282,10 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
// 关闭重点区域。
|
||||
closeSiteListMore(){
|
||||
this.keyAreasShow=false;
|
||||
},
|
||||
IsShowLideoVisible(val){
|
||||
this.videoVisible=val
|
||||
},
|
||||
|
@ -482,7 +489,7 @@ export default {
|
|||
},
|
||||
|
||||
layerHandleChange(item) {
|
||||
console.log("地图显示等",item);
|
||||
console.log("地图显示等111",item);
|
||||
if (this.changeLayerBtnGroup.indexOf(item) !== -1) {
|
||||
switch (item) {
|
||||
case "AI事件":
|
||||
|
@ -545,6 +552,8 @@ export default {
|
|||
this.hiMapFun.addAreaToMap(areaLatLng);
|
||||
}
|
||||
});
|
||||
// 商业街区热力图上图。
|
||||
this.shoppingMallThermodynamic();
|
||||
} else {
|
||||
const dataEvent = [];
|
||||
res.data.data.forEach((item) => {
|
||||
|
@ -575,6 +584,7 @@ export default {
|
|||
case "窗口单位":
|
||||
if (item === "商业街区") {
|
||||
this.hiMapFun.removerPolygon();
|
||||
this.hiMapFun.removeLayerByLayerName("shoppingMallLayer");
|
||||
}
|
||||
this.hiMapFun.removeLayerByLayerName(item);
|
||||
break;
|
||||
|
@ -612,6 +622,43 @@ export default {
|
|||
createCameraDetailsPop
|
||||
);
|
||||
},
|
||||
// 商业街区热力图上图。
|
||||
async shoppingMallThermodynamic(){
|
||||
// 查询检测预警。
|
||||
const params = {
|
||||
page: 1,
|
||||
size: 500,
|
||||
needAreaData:true,
|
||||
};
|
||||
// console.log("执行函数");
|
||||
let shoppingMallList=await crowflowList(params);
|
||||
let smList=shoppingMallList.data.data;
|
||||
let smListLength=smList.length;
|
||||
let smOnMapData=[];
|
||||
for(let i=0; i<smListLength; i++){
|
||||
if(smList[i].totalAreaData){
|
||||
var jsonData = JSON.parse(smList[i].totalAreaData);//第一种
|
||||
// console.log("smList[i].totalAreaData",jsonData)
|
||||
for(let key in jsonData) {
|
||||
let latlonVal=[];
|
||||
// console.log(jsonData[key]) // foo, bar
|
||||
let keyArr=key.split("_");
|
||||
latlonVal.push(keyArr[1]);
|
||||
latlonVal.push(keyArr[0]);
|
||||
latlonVal.push(jsonData[key]);
|
||||
// console.log("smList[i]xxxx",latlonVal)
|
||||
smOnMapData.push(latlonVal);
|
||||
}
|
||||
}
|
||||
}
|
||||
// console.log("smList[i]xxxx",smOnMapData)
|
||||
this.hiMapFun.removeLayerByLayerName("shoppingMallLayer");
|
||||
this.hiMapFun.thermodynamic(
|
||||
smOnMapData,
|
||||
25,
|
||||
"shoppingMallLayer"
|
||||
);
|
||||
},
|
||||
|
||||
thermodynamic() {
|
||||
let dataNumber = [];
|
||||
|
@ -680,6 +727,7 @@ export default {
|
|||
this.thermodynamicPeopleType = "";
|
||||
},
|
||||
changeThermodynamicPeopleType(value) {
|
||||
console.log("热力图上图数据",this.thermodynamicPeopleAll);
|
||||
this.hiMapFun.removeLayerByLayerName("types");
|
||||
switch (value) {
|
||||
case "all":
|
||||
|
@ -709,7 +757,7 @@ export default {
|
|||
case "clear":
|
||||
this.hiMapFun.removeLayerByLayerName("types");
|
||||
this.hiMapFun.removeLayerByLayerName("thermodynamic");
|
||||
this.thermodynamicPeopleType = "";
|
||||
// this.thermodynamicPeopleType = "";
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
@ -726,6 +774,12 @@ export default {
|
|||
this.hiMapFun.removeLayerByLayerName("景区景点");
|
||||
this.hiMapFun.removeLayerByLayerName("海水浴场");
|
||||
this.hiMapFun.removeLayerByLayerName("窗口单位");
|
||||
this.hiMapFun.removeLayerByLayerName("shoppingMallLayer"); //商业街区热力图
|
||||
//清除地图底部的、地图显示、重点区域、人流热力
|
||||
this.changeLayerBtnGroup=[];
|
||||
this.thermodynamicPeopleType = "";
|
||||
|
||||
|
||||
},
|
||||
//点击是否显示重点区域。
|
||||
handleKeyArea() {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="box">
|
||||
<div class="title"><p>积水点级别分析</p><div class="bottomLine"></div></div>
|
||||
<div class="title"><p>积水点级别分析(水务局)</p><div class="bottomLine"></div></div>
|
||||
<!-- <div class="title"><p>易积水点市区分布</p><div class="bottomLine"></div></div> -->
|
||||
<!-- 工地列表 -->
|
||||
<div class="eventData">
|
||||
|
|
|
@ -511,7 +511,7 @@ export default {
|
|||
position: relative;
|
||||
z-index: 1000;
|
||||
width: 100%;
|
||||
height: 166px;
|
||||
height: 90px;
|
||||
background: url('~@/assets/construction/title.png') no-repeat;
|
||||
text-align: center;
|
||||
.title {
|
||||
|
|
Loading…
Reference in New Issue