同步现场数据

2024-05-16 14:56:04 +08:00
parent 6c3b776db2
commit 5b9d4aac0f
9 changed files with 208 additions and 68 deletions
--- 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);
--- 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>
--- a/src/views/pqs/harmonicMonitoring/embed/lntegruty/index.vue
+++ 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>
--- a/src/views/pqs/harmonicMonitoring/embed/onlinerate/index.vue
+++ 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>
--- 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="变电站名称" />
--- 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 = [
            {
--- 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;
 }

--- 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 })
--- 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;