482 lines
16 KiB
Vue
482 lines
16 KiB
Vue
<template>
|
|
<div class="flex" style="margin: 15px 0">
|
|
<span style="width: 100px; margin-top: 3px">电压等级:</span>
|
|
<el-checkbox
|
|
:indeterminate="isIndeterminate"
|
|
v-model="checkAll"
|
|
@change="handleCheckAllChange"
|
|
style="margin-right: 28px"
|
|
>
|
|
全选
|
|
</el-checkbox>
|
|
<el-checkbox-group
|
|
v-model="checkedVoltage"
|
|
@change="handleCheckedVoltageChange"
|
|
style="height: 72px; overflow-y: auto"
|
|
>
|
|
<el-checkbox v-for="(item, index) in grade" :label="item" :key="index">{{ item.name }}</el-checkbox>
|
|
</el-checkbox-group>
|
|
</div>
|
|
<div class="flex" style="margin: 15px 0">
|
|
<span style="width: 100px; margin-top: 3px">干扰源类型:</span>
|
|
<el-checkbox
|
|
:indeterminate="isIndeterminate1"
|
|
v-model="checkAll1"
|
|
@change="handleCheckAllChange1"
|
|
style="margin-right: 28px"
|
|
>
|
|
全选
|
|
</el-checkbox>
|
|
<el-checkbox-group
|
|
v-model="checkedSource"
|
|
@change="handleCheckedSourceChange"
|
|
style="height: 72px; overflow-y: auto"
|
|
>
|
|
<el-checkbox v-for="(item, index) in type" :label="item" :key="index">{{ item.name }}</el-checkbox>
|
|
</el-checkbox-group>
|
|
</div>
|
|
<div class="flex" style="margin: 15px 0">
|
|
<span style="width: 100px; line-height: 32px">兼容曲线:</span>
|
|
<el-radio-group v-model="radio" @change="radioChange">
|
|
<el-radio label="ITIC">ITIC</el-radio>
|
|
<el-radio label="F47">F47</el-radio>
|
|
</el-radio-group>
|
|
</div>
|
|
<my-echart class="bars_w" :options="echartList" />
|
|
|
|
<vxe-table class="dw" :data="TableData" height="50px" v-bind="defaultAttribute">
|
|
<vxe-column field="name" title="名称" width="100px"></vxe-column>
|
|
<vxe-column field="totalEvents" title="事件总数" width="100px"></vxe-column>
|
|
<vxe-column field="tolerable" title="可容忍" width="100px"></vxe-column>
|
|
<vxe-column field="Intolerable" title="不可容忍" width="100px"></vxe-column>
|
|
</vxe-table>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { useDictData } from '@/stores/dictData'
|
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
|
import { mainHeight } from '@/utils/layout'
|
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
|
import { ref, reactive } from 'vue'
|
|
const dictData = useDictData()
|
|
const isIndeterminate = ref(false)
|
|
const isIndeterminate1 = ref(false)
|
|
const checkAll = ref(true)
|
|
const checkAll1 = ref(true)
|
|
const radio = ref('ITIC')
|
|
const echartList = ref({})
|
|
const ITIC = ref({})
|
|
const F47 = ref({})
|
|
const pointI: any = ref([])
|
|
const pointIun: any = ref([])
|
|
const pointF: any = ref([])
|
|
const pointFun: any = ref([])
|
|
const datalist: any = ref([])
|
|
const TableData = ref([
|
|
{
|
|
name: '事件个数',
|
|
totalEvents: '',
|
|
tolerable: '',
|
|
Intolerable: ''
|
|
}
|
|
])
|
|
const checkedVoltage: any = ref(ref(dictData.getBasicData('Dev_Voltage_Stand')))
|
|
const checkedSource: any = ref(dictData.getBasicData('Interference_Source'))
|
|
const grade = ref(dictData.getBasicData('Dev_Voltage_Stand'))
|
|
const type = ref(dictData.getBasicData('Interference_Source'))
|
|
// 电压等级多选
|
|
const handleCheckedVoltageChange = (val: any) => {
|
|
const checkedCount = val.length
|
|
checkAll.value = checkedCount === grade.value.length
|
|
isIndeterminate.value = checkedCount > 0 && checkedCount < grade.value.length
|
|
}
|
|
const handleCheckAllChange = (val: any) => {
|
|
checkedVoltage.value = val ? grade.value : []
|
|
isIndeterminate.value = false
|
|
}
|
|
// 干扰源类型多选
|
|
const handleCheckAllChange1 = (val: any) => {
|
|
checkedSource.value = val ? type.value : []
|
|
isIndeterminate.value = false
|
|
}
|
|
const handleCheckedSourceChange = (val: any) => {
|
|
const checkedCount = val.length
|
|
checkAll1.value = checkedCount === type.value.length
|
|
isIndeterminate1.value = checkedCount > 0 && checkedCount < type.value.length
|
|
}
|
|
|
|
const info = async (list: any) => {
|
|
datalist.value = []
|
|
list.forEach((item: any) => {
|
|
if (item.eventValue < 2 && item.eventValue > 0) {
|
|
datalist.value.push(item)
|
|
}
|
|
})
|
|
await gongfunction()
|
|
ITIC.value = {
|
|
title: {
|
|
text: 'ITIC曲线'
|
|
},
|
|
tooltip: {
|
|
formatter: function (a: any) {
|
|
if (a[0].value[4] == undefined) {
|
|
return
|
|
}
|
|
|
|
let relVal = ''
|
|
relVal = "<font style='color:" + "'>供电公司:" + ' ' + ' ' + a[0].value[3] + '</font><br/>'
|
|
relVal += "<font style='color:" + "'>变电站:" + ' ' + ' ' + a[0].value[4] + '</font><br/>'
|
|
relVal += "<font style='color:" + "'>发生时刻:" + ' ' + ' ' + a[0].value[2] + '</font><br/>'
|
|
relVal +=
|
|
"<font style='color:" +
|
|
"'>持续时间:" +
|
|
' ' +
|
|
' ' +
|
|
a[0].value[0].toFixed(3) +
|
|
's</font><br/>'
|
|
relVal +=
|
|
"<font style='color:" + "'>特征幅值:" + ' ' + ' ' + a[0].value[1].toFixed(3) + '%</font>'
|
|
return relVal
|
|
}
|
|
},
|
|
legend: {
|
|
data: ['上限', '下限', '可容忍事件', '不可容忍事件'],
|
|
// selectedMode: false,
|
|
left: '10px'
|
|
},
|
|
color: ['#FF8C00', '#00BFFF', 'green', 'red'],
|
|
xAxis: {
|
|
type: 'log',
|
|
min: '0.001',
|
|
max: '1000',
|
|
name: 's',
|
|
splitLine: { show: false }
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
splitNumber: 10,
|
|
minInterval: 3,
|
|
name: '%'
|
|
},
|
|
dataZoom: {
|
|
type: null,
|
|
show: false
|
|
},
|
|
options: {
|
|
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: pointI.value
|
|
},
|
|
{
|
|
name: '不可容忍事件',
|
|
type: 'scatter',
|
|
symbol: 'circle',
|
|
data: pointIun.value
|
|
}
|
|
]
|
|
}
|
|
}
|
|
F47.value = {
|
|
title: {
|
|
text: 'F47曲线'
|
|
},
|
|
tooltip: {
|
|
formatter: function (a: any) {
|
|
if (a[0].value[4] == undefined) {
|
|
return
|
|
}
|
|
|
|
let relVal = ''
|
|
relVal = "<font style='color:" + "'>供电公司:" + ' ' + ' ' + a[0].value[3] + '</font><br/>'
|
|
relVal += "<font style='color:" + "'>变电站:" + ' ' + ' ' + a[0].value[4] + '</font><br/>'
|
|
relVal += "<font style='color:" + "'>发生时刻:" + ' ' + ' ' + a[0].value[2] + '</font><br/>'
|
|
relVal +=
|
|
"<font style='color:" +
|
|
"'>持续时间:" +
|
|
' ' +
|
|
' ' +
|
|
a[0].value[0].toFixed(3) +
|
|
's</font><br/>'
|
|
relVal +=
|
|
"<font style='color:" + "'>特征幅值:" + ' ' + ' ' + a[0].value[1].toFixed(3) + '%</font>'
|
|
return relVal
|
|
}
|
|
},
|
|
legend: {
|
|
data: ['分割线', '可容忍事件', '不可容忍事件'],
|
|
// selectedMode: false,
|
|
left: '10px'
|
|
},
|
|
color: ['yellow', 'green', 'red'],
|
|
xAxis: {
|
|
type: 'log',
|
|
min: '0.001',
|
|
max: '1000',
|
|
name: 's',
|
|
splitLine: { show: false }
|
|
},
|
|
yAxis: {
|
|
type: 'value',
|
|
splitNumber: 10,
|
|
minInterval: 3,
|
|
name: '%'
|
|
},
|
|
dataZoom: {
|
|
type: null,
|
|
show: false
|
|
},
|
|
options: {
|
|
series: [
|
|
{
|
|
name: '分割线',
|
|
type: 'line',
|
|
data: [
|
|
[0.05, 0],
|
|
[0.05, 50],
|
|
[0.2, 50],
|
|
[0.2, 70],
|
|
[0.5, 70],
|
|
[0.5, 80],
|
|
[10, 80],
|
|
[1000, 80]
|
|
],
|
|
showSymbol: false,
|
|
tooltips: {
|
|
show: false
|
|
}
|
|
},
|
|
{
|
|
name: '可容忍事件',
|
|
type: 'scatter',
|
|
symbol: 'circle',
|
|
data: pointF.value
|
|
},
|
|
{
|
|
name: '不可容忍事件',
|
|
type: 'scatter',
|
|
symbol: 'circle',
|
|
data: pointFun.value
|
|
}
|
|
]
|
|
}
|
|
}
|
|
radioChange(radio.value)
|
|
}
|
|
const radioChange = (e: any) => {
|
|
if (e == 'ITIC') {
|
|
echartList.value = ITIC.value
|
|
TableData.value[0].totalEvents = pointI.value.length + pointIun.value.length
|
|
TableData.value[0].tolerable = pointI.value.length
|
|
TableData.value[0].Intolerable = pointIun.value.length
|
|
} else if (e == 'F47') {
|
|
echartList.value = F47.value
|
|
TableData.value[0].totalEvents = pointF.value.length + pointFun.value.length
|
|
TableData.value[0].tolerable = pointF.value.length
|
|
TableData.value[0].Intolerable = pointFun.value.length
|
|
}
|
|
}
|
|
|
|
const gongfunction = () => {
|
|
var standI = 0
|
|
var unstandI = 0
|
|
var standF = 0
|
|
var unstandF = 0
|
|
pointI.value = []
|
|
pointIun.value = []
|
|
pointF.value = []
|
|
pointFun.value = []
|
|
var total = 0
|
|
total = datalist.value.length
|
|
if (total == 0) {
|
|
} else {
|
|
for (var i = 0; i < datalist.value.length; i++) {
|
|
var point = []
|
|
var xx = datalist.value[i].persistTime
|
|
var yy = datalist.value[i].eventValue * 100
|
|
var time = datalist.value[i].time.replace('T', ' ')
|
|
var company = datalist.value[i].gdName
|
|
var substation = datalist.value[i].subName
|
|
var index = datalist.value[i].lineId
|
|
var eventId = datalist.value[i].eventId
|
|
point = [xx, yy, time, company, substation, index, eventId]
|
|
|
|
if (xx <= 0.003) {
|
|
var line = 0
|
|
line = 230 - 30000 * xx
|
|
if (yy > line) {
|
|
unstandI++
|
|
pointIun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
} else {
|
|
standI++
|
|
pointI.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
}
|
|
} else if (xx <= 0.02) {
|
|
if (yy > 120) {
|
|
unstandI++
|
|
pointIun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
} else {
|
|
standI++
|
|
pointI.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
}
|
|
} else if (xx <= 0.5) {
|
|
if (yy > 120 || yy < 70) {
|
|
unstandI++
|
|
pointIun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
} else {
|
|
standI++
|
|
pointI.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
}
|
|
} else if (xx <= 10) {
|
|
if (yy > 110 || yy < 80) {
|
|
unstandI++
|
|
pointIun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
} else {
|
|
standI++
|
|
pointI.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
}
|
|
} else {
|
|
if (yy > 110 || yy < 90) {
|
|
unstandI++
|
|
pointIun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
} else {
|
|
standI++
|
|
pointI.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
}
|
|
}
|
|
|
|
if (xx < 0.05) {
|
|
standF++
|
|
pointF.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
} else if (xx < 0.2) {
|
|
if (yy > 50) {
|
|
standF++
|
|
pointF.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
} else {
|
|
unstandF++
|
|
pointFun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
}
|
|
} else if (xx < 0.5) {
|
|
if (yy > 70) {
|
|
standF++
|
|
pointF.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
} else {
|
|
unstandF++
|
|
pointFun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
}
|
|
} else {
|
|
if (yy > 80) {
|
|
standF++
|
|
pointF.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'green' } }
|
|
})
|
|
} else {
|
|
unstandF++
|
|
pointFun.value.push({
|
|
value: point,
|
|
itemStyle: { normal: { color: 'red' } }
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
defineExpose({ checkedVoltage, checkedSource, info })
|
|
const layout = mainHeight(390) as any
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.flex {
|
|
display: flex;
|
|
}
|
|
.bars_w {
|
|
height: calc(v-bind('layout.height'));
|
|
}
|
|
.dw {
|
|
position: absolute;
|
|
top: 210px;
|
|
right: 70px;
|
|
}
|
|
</style>
|