diff --git a/src/views/pqs/qualityInspeection/panorama/components/details/stand.vue b/src/views/pqs/qualityInspeection/panorama/components/details/stand.vue
index 55ab1316..c67bb340 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/details/stand.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/details/stand.vue
@@ -132,7 +132,7 @@ const contaminateC = () => {
a5++
}
}
- console.log('🚀 ~ getPollutionAlarmData ~ a1 / data.length:', a1 / data.length)
+ // console.log('🚀 ~ getPollutionAlarmData ~ a1 / data.length:', a1 / data.length)
let list = [
{
diff --git a/src/views/pqs/qualityInspeection/panorama/components/map.vue b/src/views/pqs/qualityInspeection/panorama/components/map.vue
index a4415409..94fcbc63 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/map.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/map.vue
@@ -63,9 +63,10 @@ function initMap(styleurl: any) {
localIdeographFontFamily: 'Microsoft YoHei'
})
map.value.on('load', () => {
+ addLayer()
+
nextTick(() => {
// 添加图层
- addLayer()
Query()
})
@@ -223,7 +224,7 @@ const addLayer = () => {
}
})
map.value.addLayer({
- id: 'spotName-ZY',
+ id: 'spotName',
type: 'symbol',
minzoom: 10,
source: {
@@ -238,7 +239,7 @@ const addLayer = () => {
'text-field': '{name}',
'icon-ignore-placement': true,
- 'text-ignore-placement': false,
+ 'text-ignore-placement': true,
'text-size': 12,
'text-max-width': 8,
'text-offset': [0, 2],
@@ -252,6 +253,7 @@ const addLayer = () => {
})
}
)
+
map.value.loadImage(
new URL('@/assets/txzdwzj.png', import.meta.url).href, // 图片地址
(error: any, image: any) => {
@@ -290,13 +292,21 @@ const addLayer = () => {
// 'text-halo-width': 1.33333
// }
})
+ }
+ )
+ map.value.loadImage(
+ new URL('@/assets/point.png', import.meta.url).href, // 图片地址
+ (error: any, image: any) => {
+ if (error) throw error
+
+ //添加图片到map,第一个参数为图片设置id
+ map.value.addImage('poi3', image)
map.value.addLayer({
- id: 'spotName-TY',
+ id: 'spotImg-GJ',
type: 'symbol',
minzoom: 8,
source: {
type: 'geojson',
-
data: {
type: 'FeatureCollection',
features: []
@@ -304,20 +314,13 @@ const addLayer = () => {
},
layout: {
// 为图层设置引用的图片ID
- // 'icon-image': 'poi2',
- // 'icon-size': 0.7,
- 'text-field': '{name}',
+ 'icon-image': 'poi3',
+ 'icon-size': 0.6,
'icon-ignore-placement': true,
- 'text-ignore-placement': false,
- 'text-size': 12,
- 'text-max-width': 8,
- 'text-offset': [0, 2],
- 'text-font': ['Microsoft YaHei Regular']
+ 'icon-allow-overlap': true
},
- paint: {
- 'text-color': '#ccc',
- // 'text-halo-color': '#FFFFFF',
- 'text-halo-width': 1.33333
+ Paint: {
+ 'icon-opacity': 10
}
})
}
@@ -325,7 +328,7 @@ const addLayer = () => {
// 添加地图弹框
map.value.on('click', (e: any) => {
const features = map.value.queryRenderedFeatures(e.point, {
- layers: ['spotImg-ZY', 'spotImg-TY']
+ layers: ['spotImg-ZY', 'spotImg-TY', 'spotImg-GJ']
})
if (features.length > 0) {
@@ -383,7 +386,9 @@ const addLayer = () => {
})
}
//添加多个监测点
-const addMarkers = async (row?: any) => {
+const addMarkers = async (row?: any, key?: any) => {
+ console.log('🚀 ~ addMarkers ~ key:', key)
+ if (map.value == null) return
let params = {
deptIndex: deptIndex.value,
monitorFlag: 2,
@@ -426,14 +431,25 @@ const addMarkers = async (row?: any) => {
list: val
}
}
+ if (key == 0) {
+ switch (val.type) {
+ case 0:
+ tempFeatureZ.push(tempFeature)
- switch (val.comFlag) {
- case 0:
- tempFeatureT.push(tempFeature)
- break
- case 1:
- tempFeatureZ.push(tempFeature)
- break
+ break
+ case 1:
+ tempFeatureT.push(tempFeature)
+ break
+ }
+ } else {
+ switch (val.comFlag) {
+ case 0:
+ tempFeatureT.push(tempFeature)
+ break
+ case 1:
+ tempFeatureZ.push(tempFeature)
+ break
+ }
}
})
})
@@ -442,17 +458,33 @@ const addMarkers = async (row?: any) => {
type: 'FeatureCollection',
features: tempFeatureZ
})
- map.value.getSource('spotName-ZY').setData({
+
+ map.value.setLayerZoomRange('spotImg-GJ', key != undefined ? 0 : 8)
+ map.value.setLayerZoomRange('spotImg-TY', key != undefined ? 0 : 8)
+ map.value.setLayerZoomRange('spotImg-ZY', key != undefined ? 0 : 8)
+ if (key == 0) {
+ map.value.getSource('spotImg-GJ').setData({
+ type: 'FeatureCollection',
+ features: tempFeatureT
+ })
+ map.value.getSource('spotImg-TY').setData({
+ type: 'FeatureCollection',
+ features: []
+ })
+ } else {
+ map.value.getSource('spotImg-GJ').setData({
+ type: 'FeatureCollection',
+ features: []
+ })
+ map.value.getSource('spotImg-TY').setData({
+ type: 'FeatureCollection',
+ features: tempFeatureT
+ })
+ }
+
+ map.value.getSource('spotName').setData({
type: 'FeatureCollection',
- features: tempFeatureZ
- })
- map.value.getSource('spotImg-TY').setData({
- type: 'FeatureCollection',
- features: tempFeatureT
- })
- map.value.getSource('spotName-TY').setData({
- type: 'FeatureCollection',
- features: tempFeatureT
+ features: [...tempFeatureT, ...tempFeatureZ]
})
}
@@ -521,7 +553,7 @@ const height = mainHeight(20)
:deep(.query-box-wrap) {
position: absolute;
top: 10px;
- left: calc(50% - 295px);
+ left: calc(50% - 345px);
.query-box {
border-radius: 8px 0 0 8px;
}
@@ -530,7 +562,7 @@ const height = mainHeight(20)
position: absolute;
top: 10px;
border-radius: 0 8px 8px 0;
- left: calc(50% + 35px);
+ left: calc(50% - 15px);
z-index: 0 !important;
}
diff --git a/src/views/pqs/qualityInspeection/panorama/components/mapL.vue b/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
index a44c72e8..52204711 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/mapL.vue
@@ -22,7 +22,7 @@
{{ item.titleT[0] }}:
{{ item.list[4].numOne }}
@@ -32,7 +32,7 @@
{{ item.titleT[1] }}:
{{ item.list[4].numTwo }}
@@ -46,11 +46,11 @@
500kV
-
+
{{ item.titleT[0] }}:
{{ item.list[0].numOne }}
-
+
{{ item.titleT[1] }}:
{{ item.list[0].numTwo }}
@@ -62,11 +62,11 @@
220kV
-
+
{{ item.titleT[0] }}:
{{ item.list[1].numOne }}
-
+
{{ item.titleT[1] }}:
{{ item.list[1].numTwo }}
@@ -78,11 +78,11 @@
110kV
-
+
{{ item.titleT[0] }}:
{{ item.list[2].numOne }}
-
+
{{ item.titleT[1] }}:
{{ item.list[2].numTwo }}
@@ -91,14 +91,14 @@
- 350kV
+ 35kV
-
+
{{ item.titleT[0] }}:
{{ item.list[3].numOne }}
-
+
{{ item.titleT[1] }}:
{{ item.list[3].numTwo }}
@@ -298,19 +298,21 @@ const info = (row: any) => {
list.value[2].list = data[0].data.map((item: any) => {
return {
numOne: item.num,
- numTwo: item.onLineNum
+ numTwo: item.onLineNum,
+ numOneList: item.numList,
+ numTwoList: item.onLineNumList
}
})
})
}
// 点击
-const LookMap = (row: object, num: number) => {
- console.log('🚀 ~ LookMap ~ row:', row)
+const LookMap = (coutList: object, alarmList: object, key?: any) => {
+ // console.log('🚀 ~ LookMap ~ row:', row)
let form = {
- coutList: num == 0 ? row : [],
- alarmList: num == 1 ? row : []
+ coutList: coutList,
+ alarmList: alarmList
}
- emit('LookMap', form)
+ emit('LookMap', form, key)
}
onMounted(() => {})
defineExpose({ info, show })
diff --git a/src/views/pqs/qualityInspeection/panorama/index.vue b/src/views/pqs/qualityInspeection/panorama/index.vue
index 8fd9de8e..46057da0 100644
--- a/src/views/pqs/qualityInspeection/panorama/index.vue
+++ b/src/views/pqs/qualityInspeection/panorama/index.vue
@@ -17,9 +17,11 @@
-
+
+
+
+
+
@@ -115,8 +117,8 @@ const infoShow = (e: boolean) => {
cityMapRRef.value.show = e
}
// 地图控制图层
-const LookMap = (row: any) => {
- // mapRef.value.addMarkers({ ...row, type: 1 })
+const LookMap = (row: any, key?: any) => {
+ // mapRef.value.addMarkers({ ...row, type: 1 }, key)
}
const info = () => {
form.value.startTime = datePickerRef.value.timeValue[0]
@@ -137,6 +139,15 @@ const info = () => {
cityMapLRef.value.info(form.value)
}
}
+// 重置
+const reset = () => {
+ form.value = {
+ name: '',
+ orgNo: dictData.state.area[0].id,
+ isUpToGrid: 0
+ }
+ changeValue({ data: dictData.state.area[0] })
+}
onMounted(() => {
// info()
changeValue({ data: dictData.state.area[0] })
@@ -148,7 +159,7 @@ onMounted(() => {
:deep(.mapBox) {
position: absolute;
top: 10px;
- left: calc(50% + 95px);
+ left: calc(50% + 45px);
z-index: 1;
.el-select {
@@ -159,6 +170,18 @@ onMounted(() => {
border-radius: 8px;
}
}
+ .Icon {
+ height: 46px;
+ width: 46px;
+ background-color: #fff;
+ border-radius: 8px;
+ text-align: center;
+ line-height: 50px;
+ cursor: pointer;
+ .fa-refresh {
+ color: var(--el-color-primary) !important;
+ }
+ }
.el-input__wrapper {
height: 46px;
border-radius: 8px;