From dc3dfdd4b6d9634f49a2ef4e501dc0f9885f6fbe Mon Sep 17 00:00:00 2001
From: quanyawei <401863037@qq.com>
Date: Thu, 12 Oct 2023 13:26:50 +0800
Subject: [PATCH] Merge branch 'feature_1.0'
---
src/components/Wind/Map.vue | 451 +++++++++++++++++++++++++++++---------------------------
1 files changed, 232 insertions(+), 219 deletions(-)
diff --git a/src/components/Wind/Map.vue b/src/components/Wind/Map.vue
index 6e7ac77..1f75648 100644
--- a/src/components/Wind/Map.vue
+++ b/src/components/Wind/Map.vue
@@ -13,8 +13,7 @@
class="left"
:class="{ click: changeColor === index }"
@click="change(index)"
- >{{ item }}</span
- >
+ >{{ item }}</span>
<!-- <span class="middle" @click="toggleWindState()">{{ windStateText }}</span> -->
<span class="right">{{ times }}���</span>
<span class="dropDown">
@@ -23,170 +22,170 @@
:src="require('@/assets/images/regionalOverview/realTimeImg.png')"
alt=""
@click="turnState"
- />
+ >
<span class="text_Time">{{ dateFormat }}</span>
- <img class="drop-icon" :src="turnImg" alt="" @click="turnState" />
+ <img class="drop-icon" :src="turnImg" alt="" @click="turnState">
</span>
</div>
<div class="topDate" style="height: 60px">
- <div class="jdt" id="eventPro">
+ <div id="eventPro" class="jdt">
<div class="mouseDiv">
- <span class="inText"></span>
- <div class="sjDiv"></div>
+ <span class="inText" />
+ <div class="sjDiv" />
</div>
<div class="mouseDiv2">
- <span class="inText2"></span>
- <div class="sjDiv2"></div>
+ <span class="inText2" />
+ <div class="sjDiv2" />
</div>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
- <li></li>
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
+ <li />
</div>
<div class="timeDiv" style="position: relative">
<ul id="timeUl">
- <li style="width: 0.83%"></li>
- <li></li>
- <li></li>
+ <li style="width: 0.83%" />
+ <li />
+ <li />
<li>03</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>06</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>09</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>12</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>15</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>18</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>21</li>
- <li></li>
- <li></li>
- <li></li>
+ <li />
+ <li />
+ <li />
<!-- -->
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>03</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>06</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>09</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>12</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>15</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>18</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>21</li>
- <li></li>
- <li></li>
- <li></li>
+ <li />
+ <li />
+ <li />
<!-- -->
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>03</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>06</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>09</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>12</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>15</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>18</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>21</li>
- <li></li>
- <li></li>
+ <li />
+ <li />
<li>00</li>
</ul>
<div
@@ -197,7 +196,7 @@
"
class="dayDiv"
>
- <p class="p1"></p>
+ <p class="p1" />
<p style="position: relative">
<span
class="borderLine"
@@ -208,8 +207,8 @@
height: 47px;
bottom: 0;
"
- ></span>
- <span class="p2"></span>
+ />
+ <span class="p2" />
<span
class="borderLine"
style="
@@ -219,9 +218,9 @@
height: 47px;
bottom: 0;
"
- ></span>
+ />
</p>
- <p class="p3"></p>
+ <p class="p3" />
</div>
</div>
</div>
@@ -264,9 +263,10 @@
:value="item.value"
/>
</el-select>
- <el-button type="primary" @click="alertData(PageSize, currentPage)"
- >������</el-button
- >
+ <el-button
+ type="primary"
+ @click="alertData(PageSize, currentPage)"
+ >������</el-button>
</div>
</div>
<el-table
@@ -314,9 +314,10 @@
@current-change="handleCurrentChange"
/>
<div slot="footer" class="dialog-footer">
- <el-button size="mini" @click="alarmTableVisible = false"
- >��� ���</el-button
- >
+ <el-button
+ size="mini"
+ @click="alarmTableVisible = false"
+ >��� ���</el-button>
</div>
</el-dialog>
</div>
@@ -339,7 +340,7 @@
weidu: Number,
jingdu: Number,
monitorPointId: Number,
- monitorPointIds: Array,
+ monitorPointIds: Array
},
data() {
return {
@@ -388,70 +389,70 @@
factorOptions: [
{
label: '������������',
- value: 'all',
+ value: 'all'
},
{
label: 'PM10',
- value: 'PM10',
+ value: 'PM10'
},
{
label: 'PM2.5',
- value: 'PM2.5',
+ value: 'PM2.5'
},
{
label: 'SO2',
- value: 'SO2',
+ value: 'SO2'
},
{
label: 'NO2',
- value: 'NO2',
+ value: 'NO2'
},
{
label: 'CO',
- value: 'CO',
+ value: 'CO'
},
{
label: 'O3',
- value: 'O3',
- },
+ value: 'O3'
+ }
],
alertOptions: [
{
label: '������������������',
- value: 'all',
+ value: 'all'
},
{
label: '������',
- value: 'overrun',
+ value: 'overrun'
},
{
label: '���������',
- value: 'sudden',
+ value: 'sudden'
},
{
label: '������������������100%',
- value: 'state100',
+ value: 'state100'
},
{
label: '������������������150%',
- value: 'state150',
+ value: 'state150'
},
{
label: '������������������250%',
- value: 'state250',
+ value: 'state250'
},
{
label: '������������������100%',
- value: 'city100',
+ value: 'city100'
},
{
label: '������������������150%',
- value: 'city150',
+ value: 'city150'
},
{
label: '������������������250%',
- value: 'city250',
- },
+ value: 'city250'
+ }
],
currentDate: '',
turnImg: require('@/assets/images/regionalOverview/dropDown.png'),
@@ -462,11 +463,11 @@
chooseTime: false,
dateInfo: '', // ���������������
timeInfo: '', // ���������������
- nyr: '', // ������������������
+ nyr: '' // ������������������
}
},
computed: {
- ...mapGetters(['regionCode']),
+ ...mapGetters(['regionCode'])
},
watch: {
dateValue(n, o) {
@@ -475,11 +476,17 @@
},
regionCode(newCode, oldCode) {
this.timerKey = newCode // ������������code���������������������������
- },
+ }
},
mounted() {
this.currentHour()
- this.$Bus.$on('alarmTableVisible', (res) => (this.alarmTableVisible = res))
+ this.$Bus.$on(
+ 'alarmTableVisible',
+ (res) => (
+ (this.alarmTableVisible = res),
+ this.alertData(this.PageSize, this.currentPage)
+ )
+ )
// ���������������������
this.initMap()
@@ -491,12 +498,12 @@
this.jingduNew = newLL[1]
this.weiduNew = newLL[0]
// ���������������������
- this.windData()
- this.change(0)
+ // this.windData()
+ // this.change(0)
this.getParamsData()
this.windDir()
this.newDate()
- this.alertData(this.PageSize, this.currentPage)
+ // this.alertData(this.PageSize, this.currentPage)
},
beforeDestroy() {
if (this.timer) {
@@ -676,7 +683,7 @@
}
// ������������������������
for (let i = 0; i < lis.length; i++) {
- lis[i].onmouseenter = function () {
+ lis[i].onmouseenter = function() {
// console.log('mouseenter', i)
// mouseDiv.style.left = (1.36986 * (i - 1) + 0.68493) + '%'
mouseDiv.style.transform = 'translateX(-50%)'
@@ -687,13 +694,13 @@
inText.innerHTML = times + ':00'
// console.log(mouseDiv)
}
- lis[i].onmouseleave = function () {
+ lis[i].onmouseleave = function() {
mouseDiv.style.display = 'none'
// console.log('������������', i)
}
}
for (let i = 0; i < timeLis.length; i++) {
- timeLis[i].onmouseenter = function () {
+ timeLis[i].onmouseenter = function() {
// console.log('mouseenter', i)
// mouseDiv.style.left = (1.36986 * (i - 2) + 0.68493) + '%'
mouseDiv.style.left = 1.36986 * i + '%'
@@ -704,7 +711,7 @@
inText.innerHTML = times + ':00'
// console.log(mouseDiv)
}
- timeLis[i].onmouseleave = function () {
+ timeLis[i].onmouseleave = function() {
mouseDiv.style.display = 'none'
// console.log('������������', i)
}
@@ -989,7 +996,7 @@
deviceMaker() {
// ������������������
if (this.map) {
- this.map.eachLayer(function (layer) {
+ this.map.eachLayer(function(layer) {
// ���������������������������
if (
!layer._container &&
@@ -1009,8 +1016,8 @@
organizationId: this.$store.state.orgId,
regionCode: this.$store.state.regionCode,
chooseTime: this.chooseTime,
- time: this.nyr,
- },
+ time: this.nyr
+ }
}).then((data) => {
// console.log('���������������������')
console.log(data, 'tata')
@@ -1334,23 +1341,24 @@
iconUrl: require('@/assets/icon/ico' + colorNum + '.png'),
// iconUrl: require('@/assets/icon/ico2.png'),
iconSize: [60, 60],
- iconAnchor: [13, 21],
- className: 'my-device',
+ iconAnchor: [30, 48],
+ className: 'my-device'
})
// ���������������������
L.marker([lat, lng], {
- icon: blueIcon,
+ icon: blueIcon
}).addTo(group)
// console.log(JSON.parse(this.keys[i]))
var myIcon = L.divIcon({
html: this.keys[i],
className: 'my-div-icon',
- iconSize: 30,
+ iconSize: [60, 60],
+ iconAnchor: [40, 40]
})
var marker = L.marker([lat, lng], { icon: myIcon }).addTo(group)
// ������������������������������������mouseover���������������
var _this = this
- marker.on('mouseover', function (e) {
+ marker.on('mouseover', function(e) {
this.noneData = false
// $.getJSON('http://47.99.64.149:8080/historyFiveMinutely/queryPopDataByMac', { 'mac': keyData[i].mac, chooseTime: this.chooseTime, time: this.nyr }, (res) => {
// var data = JSON.stringify(res.data).replace(/,/g, `<br>`).replace(/{|}|"/g, '')
@@ -1364,8 +1372,8 @@
params: {
mac: keyData[i].mac,
chooseTime: _this.chooseTime,
- time: _this.nyr,
- },
+ time: _this.nyr
+ }
})
.then((res) => {
if (res.message == '���������������������') {
@@ -1400,7 +1408,7 @@
})
})
// ������������������������������������
- marker.on('mouseout', function (e) {
+ marker.on('mouseout', function(e) {
this.noneData = false
this.bindPopup().closePopup()
})
@@ -1418,8 +1426,8 @@
method: 'get',
params: {
regionCode: 130900,
- sensorCode: 'a34002',
- },
+ sensorCode: 'a34002'
+ }
})
.then((res) => {
// console.log('���������������')
@@ -1434,19 +1442,19 @@
// iconUrl:require('@/assets/images/tl_PM10.png'),
iconSize: [55, 55],
iconAnchor: [13, 21],
- className: 'my-device',
+ className: 'my-device'
})
// ���������������������
L.marker([glat, glng], {
- icon: gIcon,
+ icon: gIcon
}).addTo(group)
var myIcon = L.divIcon({
html: gkData[i].data,
className: 'my-div-icon-g',
- iconSize: 30,
+ iconSize: 30
})
L.marker([glat, glng], {
- icon: myIcon,
+ icon: myIcon
}).addTo(group)
}
})
@@ -1478,7 +1486,7 @@
// const that = this
// ������������������
if (this.map) {
- this.map.eachLayer(function (layer) {
+ this.map.eachLayer(function(layer) {
// ���������������������������
if (
!layer._container &&
@@ -1515,7 +1523,7 @@
this.getParamsData()
setTimeout(() => {
$.getJSON(
- 'http://47.99.64.149:8080/screen_api_v2/screen/windAndDeviceDataByArea',
+ 'http://47.99.64.149:8080/api/screen_api_v2/screen/windAndDeviceDataByArea',
{ monitorPointId: this.$store.state.monitorPointId },
(data) => {
// ������������������
@@ -1532,14 +1540,14 @@
}
)
}, 1000)
- if (this.windState === 1) {
- // this.ws.close()
- this.initData()
- // console.log('���������������')
- } else if (this.windState === 2) {
- this.windDir()
- // console.log('���������������')
- }
+ // if (this.windState === 1) {
+ // console.log('getRegionApiRequest')
+ // this.initData()
+ // console.log('���������������')
+ // } else if (this.windState === 2) {
+ // this.windDir()
+ // console.log('���������������')
+ // }
// ������������������
// this.deviceMaker()
// this.getParamsData()
@@ -1574,14 +1582,14 @@
}
// console.log(this.chooseTimeInfo, 'this.chooseTimeInfo ')
// clearInterval(this.timer)
- if (this.windState === 1) {
- // this.ws.close()
- this.initData()
- // console.log('���������������')
- } else if (this.windState === 2) {
- this.windDir()
- // console.log('���������������')
- }
+ // if (this.windState === 1) {
+ // this.ws.close()
+ // this.initData()
+ // console.log('���������������')
+ // } else if (this.windState === 2) {
+ // this.windDir()
+ // console.log('���������������')
+ // }
setTimeout(() => {
this.change(this.changeColor)
this.times = 300
@@ -1601,7 +1609,7 @@
zoom: 14,
zoomControl: false, // ������������
attributionControl: false, // ���������������logol
- crs: L.CRS.EPSG3857, // ���������������������EPSG3857���������������������EPSG3395������������������������ EPSG4326 WGS84
+ crs: L.CRS.EPSG3857 // ���������������������EPSG3857���������������������EPSG3395������������������������ EPSG4326 WGS84
})
// ������������������
L.tileLayer(
@@ -1664,7 +1672,7 @@
// console.log(this.monitorPointId)
// ������������������
if (this.map) {
- this.map.eachLayer(function (layer) {
+ this.map.eachLayer(function(layer) {
// ���������������������������
if (
!layer._container &&
@@ -1690,8 +1698,8 @@
params: {
monitorPointIds: this.monitorPointIds.toString(),
chooseTime: this.chooseTime,
- time: this.nyr,
- },
+ time: this.nyr
+ }
})
.then((res) => {
// console.log('���������������')
@@ -1716,7 +1724,7 @@
// velocityType: 'Global Wind',
velocityType: 'GBR Wind',
displayPosition: 'bottomleft',
- displayEmptyString: 'No wind data',
+ displayEmptyString: 'No wind data'
},
data: res.data[0], // ������ ���������������
// data: data2,
@@ -1736,8 +1744,8 @@
'#345B1B',
'#186303',
'#175103',
- '#053F03',
- ],
+ '#053F03'
+ ]
// colorScale: ['#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03', '#053F03']
})
velocityLayer.addTo(this.map) // ���������������
@@ -1763,8 +1771,8 @@
startTime: this.dateValue[0],
endTime: this.dateValue[1],
index: this.factorValue,
- alarmType: this.alartValue,
- },
+ alarmType: this.alartValue
+ }
}).then((res) => {
// console.log('������������')
// console.log(res)
@@ -1825,8 +1833,8 @@
},
closeAlarmTableVisible() {
this.$store.state.alarmTableVisible = false
- },
- },
+ }
+ }
}
</script>
@@ -2117,4 +2125,9 @@
background-color: #ff0000 !important;
color: #790000 !important;
}
+.leaflet-marker-icon.leaflet-interactive {
+ pointer-events: auto;
+ margin-left: -45px;
+ margin-top: -40px;
+}
</style>
--
Gitblit v1.8.0