Web/admin-sjzx
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

在线监测点修改

Browse Source
This commit is contained in:
仲么了
2024-02-26 10:43:33 +08:00
parent 7b23931743
commit d815548a50
11 changed files with 624 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

341
src/views/pms/voltageSags/monitoringPoint/online/eventStatistics/ITICquxianfenxi/index.vue
View File

@@ -1,10 +1,345 @@
<template>
<div class='default-main'>
<div style='display: flex;flex-direction: column;height: 100%'>
<el-form :inline='true'>
<el-form-item label='时间间隔'>
<DatePicker ref='datePickerRef'></DatePicker>
</el-form-item>
<el-form-item>
<el-button type='primary' @click='init'>查询</el-button>
</el-form-item>
</el-form>
<el-descriptions
class='mt2'
direction='vertical'
:column='4'
border
>
<el-descriptions-item align='center' label='名称'>{{ data.name }}</el-descriptions-item>
<el-descriptions-item align='center' label='事件总数'>{{ data.gs }}</el-descriptions-item>
<el-descriptions-item align='center' label='可容忍'>{{ data.krr }}</el-descriptions-item>
<el-descriptions-item align='center' label='不可容忍'> {{ data.bkrr }}</el-descriptions-item>
</el-descriptions>
<div style='flex: 1;' class='mt10'>
<my-echart :options='options' />
</div>
</div>
</template>
<script setup lang='ts'>
import { ref } from 'vue'
import { onMounted, reactive, ref } from 'vue'
import DatePicker from '@/components/form/datePicker/index.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { useMonitoringPoint } from '@/views/pms/voltageSags/monitoringPoint/online/store'
import { getPlot } from '@/api/event-boot/monitor'
const datePickerRef = ref()
const monitoringPoint = useMonitoringPoint()
const formData = reactive({
lineIndex: monitoringPoint.state.lineId,
startTime: '',
endTime: ''
})
const data = reactive({
name: '事件个数',
gs: 0,
krr: 0,
bkrr: 0
})
const options = ref({})
const init = () => {
formData.startTime = datePickerRef.value.timeValue[0]
formData.endTime = datePickerRef.value.timeValue[1]
getPlot(formData).then(
(res: any) => {
const gongData = gongfunction(res.data.voltageToleranceCurveDataList)
data.gs = res.data.voltageToleranceCurveDataList.length
data.krr = gongData.pointI.length
data.bkrr = gongData.pointIun.length
console.log(gongData)
options.value = {
// backgroundColor: "#f9f9f9", //地图背景色深蓝
title: {
text: `ITIC曲线(总统计:${gongData.pointI.length + gongData.pointIun.length}个,可容忍:${gongData.pointI.length}个,不可容忍:${gongData.pointIun.length}个)`
},
legend: {
data: ['上限', '下限', '可容忍事件', '不可容忍事件'],
x: 'left'
},
tooltip: {
trigger: 'item',
show: true,
axisPointer: {
type: 'shadow',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0,
formatter: function(a:any) {
var relVal = ''
relVal =
'<font style=\'color:' +
'\'>发生时间:' +
a.value[2] +
'</font><br/>'
relVal +=
'<font style=\'color:' +
'\'>持续时间:' +
a.value[0] +
's</font><br/>'
relVal +=
'<font style=\'color:' +
'\'>特征幅值:' +
a.value[1].toFixed(2) +
'%</font>'
return relVal
}
},
xAxis: [
{
type: 'log',
min: 0.001,
max: 1000,
splitLine: {
show: false
},
name: 's'
}
],
yAxis: [
{
type: 'value',
splitNumber: 10,
minInterval: 3,
name: '%',
}
],
options: {
dataZoom:null,
series: [
{
name: '上限',
type: 'line',
data: [
[0.001, 200],
[0.003, 140],
[0.003, 120],
[0.5, 120],
[0.5, 110],
[10, 110],
[1000, 110]
],
showSymbol: false,
tooltips: {
show: false
}
},
{
name: '下限',
type: 'line',
data: [
[0.02, 0],
[0.02, 70],
[0.5, 70],
[0.5, 80],
[10, 80],
[10, 90],
[1000, 90]
],
showSymbol: false,
tooltips: {
show: false
}
},
{
name: '可容忍事件',
type: 'scatter',
symbol: 'circle',
data: gongData.pointI
},
{
name: '不可容忍事件',
type: 'scatter',
symbol: 'circle',
data: gongData.pointIun
}
]
}
}
}
)
}
function gongfunction(arr: any) {
let standI = 0
let unstandI = 0
let standF = 0
let unstandF = 0
let total = 0
let pointIun = []
let pointI = []
let pointF = []
let pointFun = []
total = arr.length
if (total == 0) {
} else {
for (let i = 0; i < arr.length; i++) {
let point = []
let xx = arr[i].persistTime
let yy = arr[i].eventValue
let time = arr[i].time
let eventId = arr[i].eventId
// let index =arr[i].eventDetailIndex;
point = [xx, yy, time, eventId]
if (xx <= 0.003) {
let line = 0
line = 250 - 30000 * xx
if (yy > line) {
unstandI++
pointIun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
} else {
standI++
pointI.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
}
} else if (xx <= 0.02) {
if (yy > 120) {
unstandI++
pointIun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
} else {
standI++
pointI.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
}
} else if (xx <= 0.5) {
if (yy > 120 || yy < 70) {
unstandI++
pointIun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
} else {
standI++
pointI.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
}
} else if (xx <= 10) {
if (yy > 110 || yy < 80) {
unstandI++
pointIun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
} else {
standI++
pointI.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
}
} else {
if (yy > 110 || yy < 90) {
unstandI++
pointIun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
} else {
standI++
pointI.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
}
}
if (xx < 0.05) {
standF++
pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
} else if (xx < 0.2) {
if (yy > 50) {
standF++
pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
} else {
unstandF++
pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
}
} else if (xx < 0.5) {
if (yy > 70) {
standF++
pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
} else {
unstandF++
pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
}
} else {
if (yy > 80) {
standF++
pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } }
})
} else {
unstandF++
pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } }
})
}
}
}
}
return {
standI,
unstandI,
pointI,
pointIun,
standF,
unstandF,
pointF,
pointFun
}
}
onMounted(() => {
init()
})
</script>
<style></style>

55
src/views/pms/voltageSags/monitoringPoint/online/eventStatistics/index.vue
View File

@@ -1,20 +1,49 @@
<template>
<div class='default-main'>
<el-tabs v-model='activeName' type='border-card' class='demo-tabs'>
<el-tab-pane label='导航' name='1'>
</el-tab-pane>
<el-tab-pane label='事件统计' name='2'>
</el-tab-pane>
<el-tab-pane label='事件分析' name='3'>
</el-tab-pane>
<el-tab-pane label='运行情况' name='4'>
</el-tab-pane>
</el-tabs>
</div>
<el-tabs v-model='activeName' type='border-card' class='event-statistics' tab-position='left' :style='height'>
<el-tab-pane label='ITIC曲线分析' name='1' >
<ITICquxianfenxi />
</el-tab-pane>
<el-tab-pane label='SEMI F47 分析' name='2' >
<SEMIF47fenxi />
</el-tab-pane>
<el-tab-pane label='电压暂降表及密度' name='3' >
<Dianyazanjiangbiaojimidu />
</el-tab-pane>
<el-tab-pane label='暂降分布统计' name='4' >
<Zanjiangfenbutongji />
</el-tab-pane>
<el-tab-pane label='暂降幅值概率分布' name='5' >
<Zanjiangfuzhigailvfenbu />
</el-tab-pane>
<el-tab-pane label='持续时间概率分布' name='6' >
<Chixushijiangailvfenbu />
</el-tab-pane>
</el-tabs>
</template>
<script setup lang='ts'>
import { ref } from 'vue'
import { mainHeight } from '@/utils/layout'
import ITICquxianfenxi from './ITICquxianfenxi/index.vue'
import SEMIF47fenxi from './SEMIF47fenxi/index.vue'
import Dianyazanjiangbiaojimidu from './dianyazanjiangbiaojimidu/index.vue'
import Zanjiangfenbutongji from './zanjiangfenbutongji/index.vue'
import Zanjiangfuzhigailvfenbu from './zanjiangfuzhigailvfenbu/index.vue'
import Chixushijiangailvfenbu from './chixushijiangailvfenbu/index.vue'
const activeName = ref('1')
const height = mainHeight(84)
</script>
<style></style>
<style lang='scss'>
.event-statistics {
.el-tabs__header.is-left{
margin-right: 0;
}
.el-tabs__content{
height: 100%;
.el-tab-pane{
height: 100%;
}
}
}
</style>

31
src/views/pms/voltageSags/monitoringPoint/online/index.vue
View File

@@ -1,19 +1,20 @@
<template>
<div class='default-main'>
<div class='default-main' style='position: relative'>
<el-tabs v-model='activeName' type='border-card' class='demo-tabs'>
<el-tab-pane label='导航' name='1' :style='height'>
<Navigation />
<Navigation @changeTab='changeTab' />
</el-tab-pane>
<el-tab-pane label='事件统计' name='2'>
<el-tab-pane label='事件统计' name='2' >
<EventStatistics />
</el-tab-pane>
<el-tab-pane label='事件分析' name='3'>
<el-tab-pane label='事件分析' name='3' >
<EventStudy />
</el-tab-pane>
<el-tab-pane label='运行情况' name='4'>
<el-tab-pane label='运行情况' name='4' >
<RunningCondition />
</el-tab-pane>
</el-tabs>
<div class='monitoring-point'>当前位置：{{ monitoringPoint.state.lineName }}</div>
</div>
</template>
<script setup lang='ts'>
@@ -31,14 +32,28 @@ defineOptions({
})
const monitoringPoint = useMonitoringPoint()
const height = mainHeight(82)
const activeName = ref('1')
const activeName = ref('2')
watch(
() => router.currentRoute.value.query.lineId,
(newLineId, oldLineId) => {
if (!newLineId) return
// 在这里处理 lineId 的变化
monitoringPoint.setValue('lineId', newLineId)
monitoringPoint.setValue('lineId', router.currentRoute.value.query.lineId)
monitoringPoint.setValue('lineName', router.currentRoute.value.query.lineName)
},
{ immediate: true }
)
const changeTab = (e: string) => {
activeName.value = e
}
</script>
<style></style>
<style lang='scss'>
.monitoring-point {
position: absolute;
top: 12px;
right: 10px;
font-size: 12px;
font-weight: 700;
color: var(--el-color-primary);
}
</style>

19
src/views/pms/voltageSags/monitoringPoint/online/navigation/index.vue
View File

@@ -1,16 +1,20 @@
<template>
<splitpanes style='height: 100%;' class='default-theme' id='navigation-splitpanes'>
<pane :size='size'>
<PointTree :default-expand-all='false' :default-expanded-keys='[monitoringPoint.state.lineId]'
:current-node-key='monitoringPoint.state.lineId'></PointTree>
<PointTree :default-expand-all='false'
:default-expanded-keys='monitoringPoint.state.lineId?[monitoringPoint.state.lineId]:[]'
:current-node-key='monitoringPoint.state.lineId'
@node-click='handleNodeClick'
@init='handleNodeClick'
></PointTree>
</pane>
<pane>
<Map></Map>
<Map v-bind='$attrs'></Map>
</pane>
</splitpanes>
</template>
<script setup lang='ts'>
import { defineOptions, onMounted, ref } from 'vue'
import { onMounted, ref } from 'vue'
import 'splitpanes/dist/splitpanes.css'
import { Splitpanes, Pane } from 'splitpanes'
import PointTree from '@/components/tree/pms/pointTree.vue'
@@ -23,9 +27,14 @@ const size = ref(0)
onMounted(() => {
const dom = document.getElementById('navigation-splitpanes')
if (dom) {
size.value = parseInt(240 / dom.offsetHeight * 100)
size.value = Math.round(240 / dom.offsetHeight * 100)
}
})
const handleNodeClick = (data: any, node: any) => {
if (data.level === 6) {
monitoringPoint.setValue('lineId', data.id)
}
}
</script>
<style lang='scss'>
.splitpanes.default-theme .splitpanes__pane {

44
src/views/pms/voltageSags/monitoringPoint/online/navigation/map.vue
View File

@@ -91,21 +91,16 @@
</el-descriptions-item>
<el-descriptions-item label='终端状态'>
{{
infoWindowPoint.runFlag == 0
? '投运'
: infoWindowPoint.runFlag == 1
? '热备用'
: '停运'
infoWindowPoint.runFlag == 0 ? '投运' : infoWindowPoint.runFlag == 1 ? '热备用' : '停运'
}}
</el-descriptions-item>
<el-descriptions-item label='通讯状态'>
{{ infoWindowPoint.comFlag == 0 ? '中断' : '正常' }}
</el-descriptions-item>
<el-descriptions-item>
<el-button type='primary' size='small'>查看监测点</el-button>
<el-button type='primary' size='small' @click='lookEvent'>
未处理事件({{ infoWindowPoint.noDealCount }})
</el-button>
<el-button type='primary' size='small' @click='changeTab("2")'>事件统计</el-button>
<el-button type='primary' size='small' @click='changeTab("3")'>事件分析</el-button>
<el-button type='primary' size='small' @click='changeTab("4")'>运行情况</el-button>
</el-descriptions-item>
</el-descriptions>
<el-descriptions
@@ -122,17 +117,18 @@
<script setup lang='ts'>
import { BmlMarkerClusterer } from 'vue-baidu-map-3x'
import { ref } from 'vue'
import { nextTick, ref, watch } from 'vue'
import { getAreaLineInfo } from '@/api/event-boot/areaInfo'
import DatePicker from '@/components/form/datePicker/index.vue'
import { useAdminInfo } from '@/stores/adminInfo'
import { useMonitoringPoint } from '@/views/pms/voltageSags/monitoringPoint/online/store'
const emit = defineEmits(['changeTab'])
const monitoringPoint = useMonitoringPoint()
const adminInfo = useAdminInfo()
const datePickerRef = ref()
const zoom = ref(11)
const loading = ref(true)
const popupEvent = ref()
const params = ref({
deptIndex: '',
monitorFlag: 2,
@@ -233,10 +229,18 @@ const handler = async ({ BMap, map }: any) => {
areaLineInfo.value.push(...item.children)
})
siteList.value = data
center.value.lng = areaLineInfo.value[0].lng
center.value.lat = areaLineInfo.value[0].lat
infoWindowPoint.value = areaLineInfo.value[0]
infoWindowPoint.value.show = true
watch(
() => monitoringPoint.state.lineId,
(newLineId, oldLineId) => {
let value = areaLineInfo.value.find((item: any) => item.lineId == newLineId)
center.value.lng = value.lng
center.value.lat = value.lat
infoWindowPoint.value = value
infoWindowPoint.value.show = true
monitoringPoint.setValue('lineName', value.manufacturer + '>' + value.gdName + '>' + value.subName + '>' + value.lineName)
},
{ immediate: true }
)
zoom.value = 15
setTimeout(() => {
loading.value = false
@@ -250,12 +254,8 @@ const markerClick = (e: any) => {
infoWindowPoint.value = e
infoWindowPoint.value.show = true
}
const lookEvent = (e: any) => {
popupEvent.value.open({
id: infoWindowPoint.value.lineId,
searchBeginTime: datePickerRef.value.timeValue[0],
searchEndTime: datePickerRef.value.timeValue[1]
})
const changeTab = (e: string) => {
emit('changeTab', e)
}
</script>
<style lang='scss' scoped>

7
src/views/pms/voltageSags/monitoringPoint/online/store.ts
View File

@@ -3,17 +3,22 @@ import { defineStore } from 'pinia'
interface MonitoringPoint {
lineId: string
lineName: string
}
export const useMonitoringPoint = defineStore(
'monitoringPoint',
() => {
const state: MonitoringPoint = reactive({
lineId: ''
lineId: '',
lineName: '',
})
const setValue = (key: keyof MonitoringPoint, val: any) => {
state[key] = val
}
return { state, setValue }
},
{
persist: true
}
)

7
src/views/pms/voltageSags/overview/index.vue
View File

@@ -297,10 +297,13 @@ const lookEvent = (e: any) => {
})
}
const lookPoint = () => {
router.push({
console.log(infoWindowPoint.value)
router.replace({
name: 'Descentsystem/monitoringpoint',
query: {
lineId: infoWindowPoint.value.lineId
lineId: infoWindowPoint.value.lineId,
lineName: infoWindowPoint.value.manufacturer + '>' + infoWindowPoint.value.gdName + '>' + infoWindowPoint.value.subName + '>' + infoWindowPoint.value.lineName
}
})
}