From 5b9d4aac0f94ca2933450730e7d9ebe68e387d08 Mon Sep 17 00:00:00 2001
From: GGJ <357021191@qq.com>
Date: Thu, 16 May 2024 14:56:04 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=8C=E6=AD=A5=E7=8E=B0=E5=9C=BA=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/styles/element.scss                       |   4 +
 .../embed/liabiiyty/inex.vue                  |  11 +-
 .../embed/lntegruty/index.vue                 |  39 +++++++
 .../embed/onlinerate/index.vue                |  39 +++++++
 .../panorama/components/city/statistics.vue   |   2 +-
 .../panorama/components/details/stand.vue     |   2 +-
 .../panorama/components/map.vue               | 108 ++++++++++++------
 .../panorama/components/mapL.vue              |  36 +++---
 .../pqs/qualityInspeection/panorama/index.vue |  35 +++++-
 9 files changed, 208 insertions(+), 68 deletions(-)
 create mode 100644 src/views/pqs/harmonicMonitoring/embed/lntegruty/index.vue
 create mode 100644 src/views/pqs/harmonicMonitoring/embed/onlinerate/index.vue

diff --git a/src/styles/element.scss b/src/styles/element.scss
index ed25b0f2..aabfe998 100644
--- a/src/styles/element.scss
+++ b/src/styles/element.scss
@@ -31,6 +31,10 @@
 }
 .el-dialog {
     padding: 0px !important;
+    // .el-dialog__body{
+    //     max-height: 60vh;
+    //     overflow-y: auto;
+    // }
 }
 .el-dialog__header {
     background: var(--el-color-primary);
diff --git a/src/views/pqs/harmonicMonitoring/embed/liabiiyty/inex.vue b/src/views/pqs/harmonicMonitoring/embed/liabiiyty/inex.vue
index f27d7fb6..fb0fc8ca 100644
--- a/src/views/pqs/harmonicMonitoring/embed/liabiiyty/inex.vue
+++ b/src/views/pqs/harmonicMonitoring/embed/liabiiyty/inex.vue
@@ -22,15 +22,16 @@ const num = ref(0)
 const loading = ref(true)
 // console.log("🚀 ~ num:", window.location.origin)
 const iframeRef: any = ref(null)
-const iframeSrc = 'http://www.jibei1.com:8088/#/harmonic-boot/detailedAnalysis/responsibilityqr'
+// const iframeSrc = 'http://www.jibei1.com:8088/#/harmonic-boot/detailedAnalysis/responsibilityqr'
+const iframeSrc = window.location.origin + '/jbv2/#/harmonic-boot/detailedAnalysis/responsibilityqr'
 
 onMounted(() => {
     iframeRef.value.onload = () => {
         iframeRef.value.contentWindow.postMessage({ info: window.localStorage.getItem('adminInfo') }, '*')
-        setTimeout(() => {
-            num.value++
-            loading.value = false
-        }, 0)
+        // setTimeout(() => {
+        //     num.value++
+        loading.value = false
+        // }, 0)
     }
 })
 </script>
diff --git a/src/views/pqs/harmonicMonitoring/embed/lntegruty/index.vue b/src/views/pqs/harmonicMonitoring/embed/lntegruty/index.vue
new file mode 100644
index 00000000..d0ef070b
--- /dev/null
+++ b/src/views/pqs/harmonicMonitoring/embed/lntegruty/index.vue
@@ -0,0 +1,39 @@
+<template>
+    <!-- 完整性 -->
+    <div class="default-main" :style="height" v-loading="loading">
+        <iframe
+            :key="num"
+            :src="iframeSrc"
+            id="frame1"
+            ref="iframeRef"
+            frameborder="0"
+            style="width: 100%; height: 100%; border: 0px solid"
+        />
+    </div> 
+</template>
+<script setup lang="ts">
+import { onMounted, ref, nextTick } from 'vue'
+import { mainHeight } from '@/utils/layout'
+defineOptions({
+    name: 'harmonic-boot/detailedAnalysis/responsibility'
+})
+const height = mainHeight(20)
+
+const num = ref(0)
+const loading = ref(true)
+// console.log("🚀 ~ num:", window.location.origin)
+const iframeRef: any = ref(null)
+// const iframeSrc = 'http://www.jibei1.com:8088/#/harmonic-boot/detailedAnalysis/responsibilityqr'
+const iframeSrc = window.location.origin + '/jbv2/#/harmonic-boot/harmonic/getIntegrityDataqr'
+
+onMounted(() => {
+    iframeRef.value.onload = () => {
+        iframeRef.value.contentWindow.postMessage({ info: window.localStorage.getItem('adminInfo') }, '*')
+        // setTimeout(() => {
+        //     num.value++
+        loading.value = false
+        // }, 0)
+    }
+})
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/views/pqs/harmonicMonitoring/embed/onlinerate/index.vue b/src/views/pqs/harmonicMonitoring/embed/onlinerate/index.vue
new file mode 100644
index 00000000..7dcfffb2
--- /dev/null
+++ b/src/views/pqs/harmonicMonitoring/embed/onlinerate/index.vue
@@ -0,0 +1,39 @@
+<template>
+    <!-- 在线率 -->
+    <div class="default-main" :style="height" v-loading="loading">
+        <iframe
+            :key="num"
+            :src="iframeSrc"
+            id="frame1"
+            ref="iframeRef"
+            frameborder="0"
+            style="width: 100%; height: 100%; border: 0px solid"
+        />
+    </div> 
+</template>
+<script setup lang="ts">
+import { onMounted, ref, nextTick } from 'vue'
+import { mainHeight } from '@/utils/layout'
+defineOptions({
+    name: 'harmonic-boot/detailedAnalysis/responsibility'
+})
+const height = mainHeight(20)
+
+const num = ref(0)
+const loading = ref(true)
+// console.log("🚀 ~ num:", window.location.origin)
+const iframeRef: any = ref(null)
+// const iframeSrc = 'http://www.jibei1.com:8088/#/harmonic-boot/detailedAnalysis/responsibilityqr'
+const iframeSrc = window.location.origin + '/jbv2/#/harmonic-boot/area/OnlineRateqr'
+
+onMounted(() => {
+    iframeRef.value.onload = () => {
+        iframeRef.value.contentWindow.postMessage({ info: window.localStorage.getItem('adminInfo') }, '*')
+        // setTimeout(() => {
+        //     num.value++
+        loading.value = false
+        // }, 0)
+    }
+})
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/views/pqs/qualityInspeection/panorama/components/city/statistics.vue b/src/views/pqs/qualityInspeection/panorama/components/city/statistics.vue
index 36a73ec4..055fefd8 100644
--- a/src/views/pqs/qualityInspeection/panorama/components/city/statistics.vue
+++ b/src/views/pqs/qualityInspeection/panorama/components/city/statistics.vue
@@ -1,6 +1,6 @@
 <template>
     <!-- 综合评估详情 -->
-    <el-dialog draggable title="指标合格率统计统计" v-model="dialogVisible" width="1400px">
+    <el-dialog draggable title="指标合格率统计" v-model="dialogVisible" width="1400px">
         <div>
             <vxe-table v-bind="defaultAttribute" ref="vxeRef" height="600px" :data="tableData">
                 <vxe-column field="substationName" title="变电站名称" />
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] }}：
                                 <span
                                     :style="`color: ${item.color[0]}; cursor: pointer;`"
-                                    @click="LookMap(item.list[4].numOneList, 0)"
+                                    @click="LookMap(item.list[4].numOneList, item.list[4].numTwoList, i)"
                                 >
                                     {{ item.list[4].numOne }}
                                 </span>
@@ -32,7 +32,7 @@
                                 {{ item.titleT[1] }}：
                                 <span
                                     :style="`color: ${item.color[1]}; cursor: pointer;`"
-                                    @click="LookMap(item.list[4].numTwoList, 1)"
+                                    @click="LookMap([], item.list[4].numTwoList, i)"
                                 >
                                     {{ item.list[4].numTwo }}
                                 </span>
@@ -46,11 +46,11 @@
                                 <span class="vol">500kV</span>
                             </div>
                             <div class="num">
-                                <div @click="LookMap(item.list[0].numOneList, 0)">
+                                <div @click="LookMap(item.list[0].numOneList, item.list[0].numTwoList, i)">
                                     {{ item.titleT[0] }}:
                                     <span :style="`color: ${item.color[0]}`">{{ item.list[0].numOne }}</span>
                                 </div>
-                                <div @click="LookMap(item.list[0].numTwoList, 1)">
+                                <div @click="LookMap([], item.list[0].numTwoList, i)">
                                     {{ item.titleT[1] }}:
                                     <span :style="`color: ${item.color[1]}`">{{ item.list[0].numTwo }}</span>
                                 </div>
@@ -62,11 +62,11 @@
                                 <span class="vol">220kV</span>
                             </div>
                             <div class="num">
-                                <div @click="LookMap(item.list[1].numOneList, 0)">
+                                <div @click="LookMap(item.list[1].numOneList, item.list[1].numTwoList, i)">
                                     {{ item.titleT[0] }}:
                                     <span :style="`color: ${item.color[0]}`">{{ item.list[1].numOne }}</span>
                                 </div>
-                                <div @click="LookMap(item.list[1].numTwoList, 1)">
+                                <div @click="LookMap([], item.list[1].numTwoList, i)">
                                     {{ item.titleT[1] }}:
                                     <span :style="`color: ${item.color[1]}`">{{ item.list[1].numTwo }}</span>
                                 </div>
@@ -78,11 +78,11 @@
                                 <span class="vol">110kV</span>
                             </div>
                             <div class="num">
-                                <div @click="LookMap(item.list[2].numOneList, 0)">
+                                <div @click="LookMap(item.list[2].numOneList, item.list[2].numTwoList, i)">
                                     {{ item.titleT[0] }}:
                                     <span :style="`color: ${item.color[0]}`">{{ item.list[2].numOne }}</span>
                                 </div>
-                                <div @click="LookMap(item.list[2].numTwoList, 1)">
+                                <div @click="LookMap([], item.list[2].numTwoList, i)">
                                     {{ item.titleT[1] }}:
                                     <span :style="`color: ${item.color[1]}`">{{ item.list[2].numTwo }}</span>
                                 </div>
@@ -91,14 +91,14 @@
                         <div class="card-Box">
                             <div>
                                 <span class="line"></span>
-                                <span class="vol">350kV</span>
+                                <span class="vol">35kV</span>
                             </div>
                             <div class="num">
-                                <div @click="LookMap(item.list[3].numOneList, 0)">
+                                <div @click="LookMap(item.list[3].numOneList, item.list[3].numTwoList, i)">
                                     {{ item.titleT[0] }}:
                                     <span :style="`color: ${item.color[0]}`">{{ item.list[3].numOne }}</span>
                                 </div>
-                                <div @click="LookMap(item.list[3].numTwoList, 1)">
+                                <div @click="LookMap([], item.list[3].numTwoList, i)">
                                     {{ item.titleT[1] }}:
                                     <span :style="`color: ${item.color[1]}`">{{ item.list[3].numTwo }}</span>
                                 </div>
@@ -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 @@
                         <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
                     </el-select>
                 </el-form-item>
-                <!-- <el-form-item>
-                    <el-button icon="el-icon-Refresh" @click="reset"></el-button>
-                </el-form-item> -->
+                <el-form-item>
+                    <div class="Icon">
+                        <Icon name="fa fa-refresh" @click="reset" />
+                    </div>
+                </el-form-item>
             </el-form>
         </div>
 
@@ -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;