diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/pages/ywts/zyhj/hb/alarmPop.vue b/src/pages/ywts/zyhj/hb/alarmPop.vue new file mode 100644 index 0000000..3f4ac5a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/alarmPop.vue @@ -0,0 +1,278 @@ + + + + + diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/pages/ywts/zyhj/hb/alarmPop.vue b/src/pages/ywts/zyhj/hb/alarmPop.vue new file mode 100644 index 0000000..3f4ac5a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/alarmPop.vue @@ -0,0 +1,278 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/casePop.vue b/src/pages/ywts/zyhj/hb/casePop.vue new file mode 100644 index 0000000..0c07a1a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/casePop.vue @@ -0,0 +1,286 @@ + + + + + diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/pages/ywts/zyhj/hb/alarmPop.vue b/src/pages/ywts/zyhj/hb/alarmPop.vue new file mode 100644 index 0000000..3f4ac5a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/alarmPop.vue @@ -0,0 +1,278 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/casePop.vue b/src/pages/ywts/zyhj/hb/casePop.vue new file mode 100644 index 0000000..0c07a1a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/casePop.vue @@ -0,0 +1,286 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/data.js b/src/pages/ywts/zyhj/hb/data.js new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/src/pages/ywts/zyhj/hb/data.js diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/pages/ywts/zyhj/hb/alarmPop.vue b/src/pages/ywts/zyhj/hb/alarmPop.vue new file mode 100644 index 0000000..3f4ac5a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/alarmPop.vue @@ -0,0 +1,278 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/casePop.vue b/src/pages/ywts/zyhj/hb/casePop.vue new file mode 100644 index 0000000..0c07a1a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/casePop.vue @@ -0,0 +1,286 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/data.js b/src/pages/ywts/zyhj/hb/data.js new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/src/pages/ywts/zyhj/hb/data.js diff --git a/src/pages/ywts/zyhj/hb/index.vue b/src/pages/ywts/zyhj/hb/index.vue index 84ae2d5..974bbf1 100644 --- a/src/pages/ywts/zyhj/hb/index.vue +++ b/src/pages/ywts/zyhj/hb/index.vue @@ -3,16 +3,20 @@
- - - - + + + +
+ + + + @@ -24,13 +28,18 @@ import { clearUpMap, clearResetMap, AddLabelPoint } from '@/utils/freedo' import { AddDivPointHighlight, AddLabel } from "../../../../utils/freedo"; import ListPage from "@/components/ListPage"; -import { getOverviewStatistics, getPointList } from '@/api/ywts/zyhj/hb' - +import { getOverviewStatistics, getPointList, getAlarmList, getCaseList } from '@/api/ywts/zyhj/hb' +import pointPop from './ponitPop.vue' +import alarmPop from './alarmPop.vue' +import casePop from './casePop.vue' export default { name: 'Hb', - components: { TimeManager, LayerManagerMix, ListPage, CommonBtn }, + components: { TimeManager, LayerManagerMix, ListPage, CommonBtn, pointPop, alarmPop, casePop }, data() { return { + showPop: false, + showAlarm: false, + showCase: false, isListPage: false, ktSelect: '', isShow: false, @@ -46,7 +55,6 @@ pageSize: 5 }, caseTotal: 0, - showPop: false, caseIcon: { 1: require('@/assets/images/icon/事件/已撤案.png'), 2: require('@/assets/images/icon/事件/指派中.png'), @@ -76,6 +84,7 @@ ylHover: require('@/assets/images/function/园林/园林选中.png'), caseBg: require('@/assets/images/function/物联网/物联事件未选中.png'), caseHover: require('@/assets/images/function/物联网/物联事件选中.png'), + alarmIcon: require('@/assets/images/icon/视频云/坐标.png'), menuTab: [{ name: '监测站点', value: 'device' @@ -89,19 +98,202 @@ }, mounted() { clearResetMap() + this.selectIndex = 'layerBtn' this.fetchData() }, methods: { async btnClick(e) { + clearResetMap() this.selectIndex = e.target.id - console.log(this.selectIndex, 'this.selectIndex') + switch (this.selectIndex) { + case "layerBtn": + this.fetchData() + break + case "alarmBtn": + this.fetchAlarm() + break + case "caseBtn": + this.fetchCase() + break + + } + }, + menuClick(e) { + console.log(e, 'e') }, // 获取概括统计 fetchData() { - getPointList({}).then(res => { + this.menuTab = [ + { + name: '基础设施', + value: 'device' + } + ] + this.menus = { + device: [ + { + type: '1', typename: '大气环境', total: 0, + }, + { + type: '2', typename: '噪声环境', total: 0, + }, + { + type: '3', typename: '污染源', total: 0, + }, + { + type: '4', typename: '工地扬尘', total: 0, + }, + ] + } + // getPointList({}).then(res => { + // console.log(res.data, '概括统计') + // }) + getOverviewStatistics({}).then(res => { console.log(res.data, '概括统计') + this.menus.device = res.data.value.map(item => ({ + typename: item.typename, + type: item.type, + total: item.total, + })) + // 获取点位列表 + getPointList({ pageNo: 1, pageSize: 5 }).then(res => { + this.markerList = [ + { + "name": "大气环境", + "lon": "114.859995", + "location": "江西省赣州市南康区三江乡", + "id": "1676397864375291905", + "lat": "25.802129", + "typename": "1" + }, + { + "name": "噪声环境", + "lon": "114.861027", + "location": "江西省赣州市章贡区潭六路135号靠近逸夫小学", + "id": "1676398916763914241", + "lat": "25.757553", + "typename": "2" + }, + { + "name": "污染源", + "lon": "114.880246", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676414593390350337", + "lat": "25.753119", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.879855", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676414955455254529", + "lat": "25.752771", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.875438", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676418661630349312", + "lat": "25.748733", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.867371", + "location": "江西省赣州市章贡区105国道135号靠近松岭上", + "id": "1676422908220542977", + "lat": "25.750388", + "typename": "1" + }, + { + "name": "工地扬尘", + "lon": "114.878448", + "location": "江西省赣州市章贡区潭东镇生态大道", + "id": "1676434916261236737", + "lat": "25.737305", + "typename": "4" + }, + ] + this.markerListBak = JSON.parse(JSON.stringify(this.markerList)) + this.markerList.forEach((item) => { + AddLabelPoint( + item.id, + `${item.name}`, + undefined, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickMarker) + }) + }) }) - } + }, + // 点击点位 + clickMarker(eventArg) { + const item = eventArg._data.data + this.showPop = true + this.$nextTick(() => { + this.$refs.popRef.initData(item) + }) + }, + // 获取告警 + fetchAlarm() { + console.log('获取告警') + getAlarmList({ pageNo: '1', pageSize: '99' }).then(res => { + console.log(res.data, '告警列表') + res.data.value.forEach((item) => { + AddLabelPoint( + item.id, + `${item.devicetypename}`, + this.alarmIcon, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickAlarmIcon) + }) + }) + }, + // 点击告警点位 + clickAlarmIcon(eventArg) { + const item = eventArg._data.data + this.showAlarm = true + this.$nextTick(() => { + this.$refs.alarmRef.initData(item) + }) + }, + // 获取事件 + fetchCase() { + console.log('获取事件') + getCaseList({ pageNo: '1', pageSize: '99', ...this.time }).then(res => { + console.log(res.data, '事件列表') + res.data.value.forEach((item) => { + console.log(this.caseIcon[item.eventstatus.trim()]) + const icon = this.caseIcon[item.eventstatus.trim()] || '' + AddLabelPoint( + item.id, + `${item.eventypename}`, + icon, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickCase) + }) + }) + }, + // 事件图标点击 + clickCase(eventArg) { + const item = eventArg._data.data + this.showCase = true + this.$nextTick(() => { + this.$refs.caseRef.initData(item) + }) + }, + // 事件时间查询条件 + handleTimeRange(time) { + // this.isListPage = false + if (this.time.startTime !== '') { + this.time = time + clearResetMap() + this.fetchCase() + } else { + this.time = time + } + }, } } diff --git a/src/api/ywts/zyhj/hb.js b/src/api/ywts/zyhj/hb.js index 5e598d1..07625d1 100644 --- a/src/api/ywts/zyhj/hb.js +++ b/src/api/ywts/zyhj/hb.js @@ -8,7 +8,10 @@ return request({ url: 'zhhb-gktj/zhhb/gktj', method: 'post', - data + data, + params: { + ...data, + } }) } // 环保点位列表 @@ -19,3 +22,26 @@ data }) } +// 环保告警列表 +export function getAlarmList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbgjlb', + method: 'post', + // data + params: { + ...data + } + }) +} + +// 环保事件列表 +export function getCaseList(data) { + return request({ + url: 'zhhb-gktj/zhhb/hbsjlbfy', + method: 'post', + // data + params: { + ...data + } + }) +} diff --git a/src/api/ywts/zyhj/yl.js b/src/api/ywts/zyhj/yl.js index 63d7ad2..643e3d4 100644 --- a/src/api/ywts/zyhj/yl.js +++ b/src/api/ywts/zyhj/yl.js @@ -88,6 +88,9 @@ url: 'zhyl-gktjljk/zhyl/sjxq', method: 'post', data, + params: { + ...data, + } }) } // 苗木点位列表 diff --git a/src/pages/ywts/cszl/hw/index.vue b/src/pages/ywts/cszl/hw/index.vue index e773b7d..87e65b1 100644 --- a/src/pages/ywts/cszl/hw/index.vue +++ b/src/pages/ywts/cszl/hw/index.vue @@ -94,6 +94,7 @@ }, mounted() { clearResetMap() + this.selectInde = 'deviceBtn' this.fetchPoint() }, methods: { @@ -263,17 +264,17 @@ // this.caseList = res.data.value || [] // this.caseTotal = this.caseList.length res.data.value.forEach(item => { - AddLabelPoint( - item.id.replaceAll('.', ''), - '', - this.caseIcon[item.status], - [item.lon, item.lat, 0], 'gd-case', item, - this.clickCase) - }) + AddLabelPoint( + item.id.replaceAll('.', ''), + '', + this.caseIcon[item.status], + [item.lon, item.lat, 0], 'gd-case', item, + this.clickCase) + }) }) }, - // 点击事件icon - clickCase(eventArg) { + // 点击事件icon + clickCase(eventArg) { const item = eventArg._data.data // 恢复上一个marker if (this.preCase !== null) { @@ -306,11 +307,11 @@ getCaseInfo(this.caseListQuery).then(res => { console.log(res.data, '事件详情') this.caseList = res.data.value || [] - this.caseTotal = this.caseList.length + this.caseTotal = this.caseList.length }) }, - // 事件换页 - changePage(val) { + // 事件换页 + changePage(val) { if (val && val.page) { this.caseListQuery.pageNo = val.page } diff --git a/src/pages/ywts/zyhj/hb/alarmPop.vue b/src/pages/ywts/zyhj/hb/alarmPop.vue new file mode 100644 index 0000000..3f4ac5a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/alarmPop.vue @@ -0,0 +1,278 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/casePop.vue b/src/pages/ywts/zyhj/hb/casePop.vue new file mode 100644 index 0000000..0c07a1a --- /dev/null +++ b/src/pages/ywts/zyhj/hb/casePop.vue @@ -0,0 +1,286 @@ + + + + + diff --git a/src/pages/ywts/zyhj/hb/data.js b/src/pages/ywts/zyhj/hb/data.js new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/src/pages/ywts/zyhj/hb/data.js diff --git a/src/pages/ywts/zyhj/hb/index.vue b/src/pages/ywts/zyhj/hb/index.vue index 84ae2d5..974bbf1 100644 --- a/src/pages/ywts/zyhj/hb/index.vue +++ b/src/pages/ywts/zyhj/hb/index.vue @@ -3,16 +3,20 @@
- - - - + + + +
+ + + + @@ -24,13 +28,18 @@ import { clearUpMap, clearResetMap, AddLabelPoint } from '@/utils/freedo' import { AddDivPointHighlight, AddLabel } from "../../../../utils/freedo"; import ListPage from "@/components/ListPage"; -import { getOverviewStatistics, getPointList } from '@/api/ywts/zyhj/hb' - +import { getOverviewStatistics, getPointList, getAlarmList, getCaseList } from '@/api/ywts/zyhj/hb' +import pointPop from './ponitPop.vue' +import alarmPop from './alarmPop.vue' +import casePop from './casePop.vue' export default { name: 'Hb', - components: { TimeManager, LayerManagerMix, ListPage, CommonBtn }, + components: { TimeManager, LayerManagerMix, ListPage, CommonBtn, pointPop, alarmPop, casePop }, data() { return { + showPop: false, + showAlarm: false, + showCase: false, isListPage: false, ktSelect: '', isShow: false, @@ -46,7 +55,6 @@ pageSize: 5 }, caseTotal: 0, - showPop: false, caseIcon: { 1: require('@/assets/images/icon/事件/已撤案.png'), 2: require('@/assets/images/icon/事件/指派中.png'), @@ -76,6 +84,7 @@ ylHover: require('@/assets/images/function/园林/园林选中.png'), caseBg: require('@/assets/images/function/物联网/物联事件未选中.png'), caseHover: require('@/assets/images/function/物联网/物联事件选中.png'), + alarmIcon: require('@/assets/images/icon/视频云/坐标.png'), menuTab: [{ name: '监测站点', value: 'device' @@ -89,19 +98,202 @@ }, mounted() { clearResetMap() + this.selectIndex = 'layerBtn' this.fetchData() }, methods: { async btnClick(e) { + clearResetMap() this.selectIndex = e.target.id - console.log(this.selectIndex, 'this.selectIndex') + switch (this.selectIndex) { + case "layerBtn": + this.fetchData() + break + case "alarmBtn": + this.fetchAlarm() + break + case "caseBtn": + this.fetchCase() + break + + } + }, + menuClick(e) { + console.log(e, 'e') }, // 获取概括统计 fetchData() { - getPointList({}).then(res => { + this.menuTab = [ + { + name: '基础设施', + value: 'device' + } + ] + this.menus = { + device: [ + { + type: '1', typename: '大气环境', total: 0, + }, + { + type: '2', typename: '噪声环境', total: 0, + }, + { + type: '3', typename: '污染源', total: 0, + }, + { + type: '4', typename: '工地扬尘', total: 0, + }, + ] + } + // getPointList({}).then(res => { + // console.log(res.data, '概括统计') + // }) + getOverviewStatistics({}).then(res => { console.log(res.data, '概括统计') + this.menus.device = res.data.value.map(item => ({ + typename: item.typename, + type: item.type, + total: item.total, + })) + // 获取点位列表 + getPointList({ pageNo: 1, pageSize: 5 }).then(res => { + this.markerList = [ + { + "name": "大气环境", + "lon": "114.859995", + "location": "江西省赣州市南康区三江乡", + "id": "1676397864375291905", + "lat": "25.802129", + "typename": "1" + }, + { + "name": "噪声环境", + "lon": "114.861027", + "location": "江西省赣州市章贡区潭六路135号靠近逸夫小学", + "id": "1676398916763914241", + "lat": "25.757553", + "typename": "2" + }, + { + "name": "污染源", + "lon": "114.880246", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676414593390350337", + "lat": "25.753119", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.879855", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676414955455254529", + "lat": "25.752771", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.875438", + "location": "江西省赣州市章贡区潭东镇弘腾路毅德城", + "id": "1676418661630349312", + "lat": "25.748733", + "typename": "3" + }, + { + "name": "污染源", + "lon": "114.867371", + "location": "江西省赣州市章贡区105国道135号靠近松岭上", + "id": "1676422908220542977", + "lat": "25.750388", + "typename": "1" + }, + { + "name": "工地扬尘", + "lon": "114.878448", + "location": "江西省赣州市章贡区潭东镇生态大道", + "id": "1676434916261236737", + "lat": "25.737305", + "typename": "4" + }, + ] + this.markerListBak = JSON.parse(JSON.stringify(this.markerList)) + this.markerList.forEach((item) => { + AddLabelPoint( + item.id, + `${item.name}`, + undefined, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickMarker) + }) + }) }) - } + }, + // 点击点位 + clickMarker(eventArg) { + const item = eventArg._data.data + this.showPop = true + this.$nextTick(() => { + this.$refs.popRef.initData(item) + }) + }, + // 获取告警 + fetchAlarm() { + console.log('获取告警') + getAlarmList({ pageNo: '1', pageSize: '99' }).then(res => { + console.log(res.data, '告警列表') + res.data.value.forEach((item) => { + AddLabelPoint( + item.id, + `${item.devicetypename}`, + this.alarmIcon, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickAlarmIcon) + }) + }) + }, + // 点击告警点位 + clickAlarmIcon(eventArg) { + const item = eventArg._data.data + this.showAlarm = true + this.$nextTick(() => { + this.$refs.alarmRef.initData(item) + }) + }, + // 获取事件 + fetchCase() { + console.log('获取事件') + getCaseList({ pageNo: '1', pageSize: '99', ...this.time }).then(res => { + console.log(res.data, '事件列表') + res.data.value.forEach((item) => { + console.log(this.caseIcon[item.eventstatus.trim()]) + const icon = this.caseIcon[item.eventstatus.trim()] || '' + AddLabelPoint( + item.id, + `${item.eventypename}`, + icon, + [item.lon, item.lat, 0], 'yl-dev', item, + this.clickCase) + }) + }) + }, + // 事件图标点击 + clickCase(eventArg) { + const item = eventArg._data.data + this.showCase = true + this.$nextTick(() => { + this.$refs.caseRef.initData(item) + }) + }, + // 事件时间查询条件 + handleTimeRange(time) { + // this.isListPage = false + if (this.time.startTime !== '') { + this.time = time + clearResetMap() + this.fetchCase() + } else { + this.time = time + } + }, } } diff --git a/src/pages/ywts/zyhj/hb/ponitPop.vue b/src/pages/ywts/zyhj/hb/ponitPop.vue new file mode 100644 index 0000000..a4c64ae --- /dev/null +++ b/src/pages/ywts/zyhj/hb/ponitPop.vue @@ -0,0 +1,277 @@ + + + + +