From a19b20afeacf84c1c743c76b5018bcfbddac2270 Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Fri, 15 Nov 2024 09:10:12 +0800
Subject: [PATCH] fix: 国控站
---
src/components/Wind/Map.vue | 187 +++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 167 insertions(+), 20 deletions(-)
diff --git a/src/components/Wind/Map.vue b/src/components/Wind/Map.vue
index c2dc060..e0c8fcb 100644
--- a/src/components/Wind/Map.vue
+++ b/src/components/Wind/Map.vue
@@ -854,14 +854,13 @@
}
}).then(data => {
this.markDeviceSite(data)
+ this.stateControlStation()// ���������������������
})
},
// ���������������
markDeviceSite (data) {
var keyData = data.data.devices
this.keyData = data.data.devices
- // ���������������������
- // this.stateControlStation()
var groupIcon = L.layerGroup().addTo(this.map)
var groupText = L.layerGroup().addTo(this.map)
this.keys = []
@@ -1448,6 +1447,10 @@
data = JSON.parse(keyName.a99054 || 0).toFixed(3)
switch (true) {
case data < 0: {
+ bgColorList.tvoccolorbg = '#999999'
+ break
+ }
+ case data === '-': {
bgColorList.tvoccolorbg = '#999999'
break
}
@@ -2208,17 +2211,14 @@
stateControlStation () {
// this.$axios.get('monitorPoint/queryStateControlStation', {
this.$request({
- url: '/govMonitorPoint/queryStateControlStation',
- method: 'get',
- params: {
- regionCode: 130900,
- sensorCode: 'a34002'
- }
+ url: '/govMonitorPoint/getGovMonitorPoints',
+ method: 'get'
})
.then(res => {
- // console.log('���������������')
- // console.log(res)
+ console.log('���������������')
+ console.log(res)
var gkData = res.data
+ let _this = this
var group = L.layerGroup().addTo(this.map)
for (let i = 0; i < gkData.length; i++) {
var glat = gkData[i].latitude
@@ -2226,28 +2226,175 @@
var gIcon = L.icon({
iconUrl: require('@/assets/icon/gk.png'),
// iconUrl:require('@/assets/images/tl_PM10.png'),
- iconSize: [55, 55],
- iconAnchor: [13, 21],
+ iconSize: [60, 60],
+ iconAnchor: [30, 48],
className: 'my-device'
})
// ���������������������
- L.marker([glat, glng], {
+ let marker = L.marker([glat, glng], {
icon: gIcon
}).addTo(group)
- var myIcon = L.divIcon({
- html: gkData[i].data,
- className: 'my-div-icon-g',
- iconSize: 30
+ marker.inforData = gkData[i]
+ marker.on('click', function (e) {
+ console.log('Marker clicked!', e.target)
+ _this.handleguoClick(gkData[i], e.target)
})
- L.marker([glat, glng], {
- icon: myIcon
- }).addTo(group)
+ // var myIcon = L.divIcon({
+ // html: gkData[i].data,
+ // className: 'my-div-icon-g',
+ // iconSize: 30
+ // })
+ // L.marker([glat, glng], {
+ // icon: myIcon
+ // }).addTo(group)
}
})
.catch(err => {
console.log(err)
})
},
+ handleguoClick (data, marker) {
+ this.clickmac = ''
+ this.childerItem = {}
+ this.farterItem = {}
+ this.indexsLaber = 0
+ this.clickmac = marker.inforData.guid
+ this.childerItem = marker.inforData
+ console.log('this.defaultData', this.defaultData)
+ this.defaultData.forEach(item => {
+ if (item.devices) {
+ item.devices.forEach((dev, index) => {
+ if (dev.mac === marker.inforData.mac) {
+ this.farterItem = item
+ this.indexsLaber = index
+ }
+ })
+ }
+ })
+ this.$request({
+ url: '/historyFiveMinutely/historyAqi',
+ method: 'get',
+ params: {
+ guid: data.guid,
+ }
+ })
+ .then(res => {
+ if (res.message === '���������������������') {
+ var datafalse = '������������'
+ marker.bindPopup(datafalse).openPopup()
+ return
+ }
+ this.childerItem.name = marker.inforData.name
+ let colorliststyleBgColor = this.styleBgColor(res.data[0])
+ console.log('colorliststyleBgColor', colorliststyleBgColor)
+ let deviceDetails = _.cloneDeep(res.data[0])
+ deviceDetails.name = marker.inforData.name
+ deviceDetails.a99054 = '-'
+ // eslint-disable-next-line no-unused-vars
+ for (let key in deviceDetails) {
+ if (deviceDetails[key] === null) {
+ deviceDetails[key] = '-'
+ }
+ }
+ console.log('deviceDetails', deviceDetails)
+ let htmlClassName = 'mypopupNoWind'
+ let html = ` <div data-reactroot="" class="marker_maptip">
+ <div class="marker_title_1nQ">
+ <span >������������</span>
+ </div>
+ <div class="marker_firstline_2WH">
+ <div class="marker_citypart_keg">
+ <div class="marker_name_small_1VU">${deviceDetails.name}</div>
+ <div class="marker_time_w5m">${deviceDetails.dataTime}</div>
+ </div>
+ <div class="marker_indexpart_2UI">
+ <div
+ class="marker_indexname_3TP"
+ style="color: black;background:${colorliststyleBgColor.tvoccolorbg}"
+ >
+ TVOC
+ </div>
+ <div class="marker_indexvalue_1O7">
+ ${deviceDetails.a99054}
+ </div>
+ </div>
+ </div>
+ <div class="marker_secondline_2Om">
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black;background:${colorliststyleBgColor.pm25colorbg} "
+ >
+ PM2.5
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a34004))}
+ </div>
+ </div>
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black;background:${colorliststyleBgColor.pm10colorbg}"
+ >
+ PM10
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a34002))}
+ </div>
+ </div>
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black;background:${colorliststyleBgColor.so2colorbg}"
+ >
+ SO2
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a21026))}
+ </div>
+ </div>
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black;background:${colorliststyleBgColor.no210colorbg}"
+ >
+ NO2
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a21004))}
+ </div>
+ </div>
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black;background:${colorliststyleBgColor.cocolorbg}"
+ >
+ CO
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a21005))}
+ </div>
+ </div>
+ <div class="marker_item_2Kk">
+ <div
+ class="marker_itemname_Wq5"
+ style="color: black; background:${colorliststyleBgColor.o3colorbg}"
+ >
+ O3
+ </div>
+ <div class="marker_itemvalue_1l1">
+ ${this.handleCutZero(String(deviceDetails.a05024))}
+ </div>
+ </div>
+ </div>
+ </div>`
+
+ marker.bindPopup(html, { className: htmlClassName }).openPopup()
+ })
+ .catch(err => {
+ console.log(err)
+ })
+ },
// ������������������������
toggleWindState () {
if (this.ws) {
--
Gitblit v1.8.0