谐波监测点
This commit is contained in:
仲么了
@@ -0,0 +1,352 @@
|
||||
<template>
|
||||
<div style='display: flex;flex-direction: column;height: 100%' v-loading='loading'>
|
||||
<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 { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getPlot } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const loading = ref(true)
|
||||
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 = () => {
|
||||
loading.value = true
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
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}个)`
|
||||
text: `ITIC曲线`
|
||||
},
|
||||
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
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
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>
|
||||
@@ -0,0 +1,338 @@
|
||||
<template>
|
||||
<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 { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getPlot } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const loading = ref(true)
|
||||
const formData = reactive({
|
||||
lineIndex: monitoringPoint.state.lineId,
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
})
|
||||
const data = reactive({
|
||||
name: '事件个数',
|
||||
gs: 0,
|
||||
krr: 0,
|
||||
bkrr: 0
|
||||
})
|
||||
const options = ref({})
|
||||
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
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: `SEMI F47曲线`
|
||||
},
|
||||
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',
|
||||
max: function(value: any) {
|
||||
return value.max + 20
|
||||
},
|
||||
splitNumber: 10,
|
||||
minInterval: 0.1,
|
||||
name: '%'
|
||||
}
|
||||
],
|
||||
options: {
|
||||
dataZoom: null,
|
||||
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: gongData.pointI
|
||||
},
|
||||
{
|
||||
name: '不可容忍事件',
|
||||
type: 'scatter',
|
||||
symbol: 'circle',
|
||||
data: gongData.pointIun
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
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>
|
||||
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<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>
|
||||
<div style='flex: 1;' class='mt10'>
|
||||
<my-echart :options='options' />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const loading = ref(true)
|
||||
const formData = reactive({
|
||||
lineIndex: monitoringPoint.state.lineId,
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
})
|
||||
const options = ref({})
|
||||
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
formData.startTime = datePickerRef.value.timeValue[0]
|
||||
formData.endTime = datePickerRef.value.timeValue[1]
|
||||
getProbabilityDistribution(formData).then(
|
||||
(res: any) => {
|
||||
let data = res.data
|
||||
let sisttime = data.sisttime
|
||||
let persisttime = data.persisttime
|
||||
options.value = {
|
||||
backgroundColor: '#fff', //背景色,
|
||||
title: {
|
||||
text: '持续时间的概率分布函数',
|
||||
x: 'center'
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
left: 10,
|
||||
data: ['概率分布', '占比'],
|
||||
|
||||
textStyle: {
|
||||
rich: {
|
||||
a: {
|
||||
verticalAlign: 'middle'
|
||||
}
|
||||
},
|
||||
|
||||
padding: [2, 0, 0, 0] //[上、右、下、左]
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
//提示框组件
|
||||
trigger: 'axis',
|
||||
|
||||
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
|
||||
},
|
||||
calculable: true,
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
name: '暂降幅值',
|
||||
nameGap: 10,
|
||||
nameTextStyle: {
|
||||
fontSize: 12
|
||||
},
|
||||
data: ['0.01', '0.1', '0.25', '0.5', '1', '3', '20', '60', '180']
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '概率分布',
|
||||
nameTextStyle: {
|
||||
fontSize: 15
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
},
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
// 使用深浅的间隔色
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '占比',
|
||||
|
||||
nameTextStyle: {
|
||||
fontSize: 15
|
||||
},
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '概率分布',
|
||||
type: 'line',
|
||||
data: sisttime,
|
||||
itemStyle: {
|
||||
normal: { show: true }
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '占比',
|
||||
type: 'bar',
|
||||
data: persisttime,
|
||||
barWidth: 30,
|
||||
itemStyle: {
|
||||
normal: { show: true }
|
||||
}
|
||||
}
|
||||
],
|
||||
options: {
|
||||
dataZoom: null
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
|
||||
</script>
|
||||
<style></style>
|
||||
@@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div v-loading='loading' class='dianyazanjiangbaojimidu'>
|
||||
<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>
|
||||
<div class='mt10 dianyazanjiang'>
|
||||
<div class='first'>
|
||||
<div class='mb10'>DISDIP表格(国际发配电联盟UNIPEDE)</div>
|
||||
<div style='flex: 1;overflow: hidden'>
|
||||
<vxe-table v-bind='defaultAttribute' height='100%' size='mini' :data='firstData'>
|
||||
<vxe-colgroup title='剩余电压' field='name' width='80px'></vxe-colgroup>
|
||||
<vxe-colgroup title='持续事件'>
|
||||
<vxe-column field='twentyMs' title='20ms'></vxe-column>
|
||||
<vxe-column field='oneHundredMs' title='100ms'></vxe-column>
|
||||
<vxe-column field='fiveHundredMs' title='500ms'></vxe-column>
|
||||
<vxe-column field='oneS' title='1s'></vxe-column>
|
||||
<vxe-column field='threeS' title='2s'></vxe-column>
|
||||
<vxe-column field='twentyS' title='20s'></vxe-column>
|
||||
<vxe-column field='sixtyS' title='60s'></vxe-column>
|
||||
<vxe-column field='oneEightyS' title='180s'></vxe-column>
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</div>
|
||||
<div class='second'>
|
||||
<div class='mb10'>EC61000-4-11(用电终端的电压暂降抗度)</div>
|
||||
<div style='flex: 1;overflow: hidden'>
|
||||
<vxe-table v-bind='defaultAttribute' height='100%' size='mini' :data='secondData'>
|
||||
<vxe-colgroup title='剩余电压' field='name' width='80px'></vxe-colgroup>
|
||||
<vxe-colgroup title='持续事件'>
|
||||
<vxe-column field='tenTwentyMs' title='10-20ms'></vxe-column>
|
||||
<vxe-column field='twentyOneHundredMs' title='20-100ms'></vxe-column>
|
||||
<vxe-column field='zeroPiontOneTwoS' title='0.1-0.2s'></vxe-column>
|
||||
<vxe-column field='zeroPiontFive1S' title='0.2-0.5s'></vxe-column>
|
||||
<vxe-column field='zeroPiontTwoFiveS' title='0.5-1s'></vxe-column>
|
||||
<vxe-column field='role' title='>1s'></vxe-column>
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</div>
|
||||
<div class='third'>
|
||||
<div class='mb10'>IEC61000-2-8(公共用电暂降测量统计)</div>
|
||||
<div style='flex: 1;overflow: hidden'>
|
||||
<vxe-table v-bind='defaultAttribute' height='100%' size='mini' :data='thirdData'>
|
||||
<vxe-colgroup title='剩余电压' field='name' width='120px'></vxe-colgroup>
|
||||
<vxe-colgroup title='持续事件'>
|
||||
<vxe-column field='q' title='0.01-0.1s' align='center'></vxe-column>
|
||||
<vxe-column field='w' title='0.1-0.25s' align='center'></vxe-column>
|
||||
<vxe-column field='e' title='0.25-0.5s' align='center'></vxe-column>
|
||||
<vxe-column field='r' title='0.5-1s' align='center'></vxe-column>
|
||||
<vxe-column field='t' title='1-3s' align='center'></vxe-column>
|
||||
<vxe-column field='y' title='3-20s' align='center'></vxe-column>
|
||||
<vxe-column field='u' title='20-60s' align='center'></vxe-column>
|
||||
<vxe-column field='i' title='60-180s' align='center'></vxe-column>
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</div>
|
||||
<div class='charts' id='charts'>
|
||||
<MyEchart :options='options' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { eventDisdip, getCoords, IEC28, IEC411 } from '@/api/event-boot/monitor'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const loading = ref(true)
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const formData = reactive({
|
||||
lineIndex: monitoringPoint.state.lineId,
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
})
|
||||
const options = ref({})
|
||||
const firstData = ref([])
|
||||
const secondData = ref([])
|
||||
const thirdData = ref([])
|
||||
const chartsData = ref([])
|
||||
|
||||
const init = () => {
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
formData.startTime = datePickerRef.value.timeValue[0]
|
||||
formData.endTime = datePickerRef.value.timeValue[1]
|
||||
loading.value = true
|
||||
Promise.all([eventDisdip(formData), IEC411(formData), IEC28(formData), getCoords(formData)]).then(res => {
|
||||
firstData.value = res[0].data
|
||||
secondData.value = res[1].data
|
||||
thirdData.value = res[2].data
|
||||
chartsData.value = res[3].data
|
||||
options.value = {
|
||||
options: {
|
||||
xAxis: null,
|
||||
yAxis: null,
|
||||
dataZoom: null,
|
||||
backgroundColor: '#fff',
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
title: {
|
||||
text: '暂降密度图',
|
||||
x: 'center'
|
||||
},
|
||||
toolbox: {
|
||||
show: true,
|
||||
feature: {
|
||||
// dataView: { show: true },
|
||||
// dataZoom: { show: true },
|
||||
//restore: { show: true },
|
||||
// saveAsImage: { show: true },
|
||||
myFull: {
|
||||
show: true,
|
||||
title: '全屏查看',
|
||||
icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614,593.479,423.062,591.891,421.146,591.891L421.146,591.891zM421.146,591.891',
|
||||
onclick: () => {
|
||||
let element = document.getElementById('charts') as HTMLElement
|
||||
// 全屏，如果已经全屏，则退出全屏
|
||||
if (document.fullscreenElement) {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen()
|
||||
}
|
||||
} else {
|
||||
if (element.requestFullscreen) {
|
||||
element.requestFullscreen()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
visualMap: {
|
||||
max: 20,
|
||||
show: false,
|
||||
inRange: {
|
||||
color: ['#313695', '#00BB00', '#ff8000', '#a50026']
|
||||
}
|
||||
},
|
||||
xAxis3D: {
|
||||
type: 'category',
|
||||
name: '剩余电压(%)',
|
||||
data: ['0-10', '10-20', '20-30', '30-40', '40-50', '50-60', '60-70', '70-80', '80-90', '90-100'],
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#111'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#111'
|
||||
}
|
||||
},
|
||||
yAxis3D: {
|
||||
type: 'category',
|
||||
name: '持续时间(cyc)',
|
||||
data: ['1cyc', '2cyc', '3cyc', '4cyc', '5cyc', '6~10cyc', '10~20cyc', '20~30cyc', '30~60cyc'],
|
||||
nameTextStyle: {
|
||||
color: '#111'
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#111'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#111'
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
// 使用深浅的间隔色
|
||||
color: ['#111'],
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
},
|
||||
zAxis3D: {
|
||||
type: 'value',
|
||||
splitNumber: 10,
|
||||
minInterval: 10,
|
||||
name: '次数'
|
||||
},
|
||||
grid3D: {
|
||||
viewControl: {
|
||||
projection: 'perspective',
|
||||
distance: 250
|
||||
},
|
||||
boxWidth: 200,
|
||||
boxDepth: 80,
|
||||
light: {
|
||||
main: {
|
||||
intensity: 1.2
|
||||
},
|
||||
ambient: {
|
||||
intensity: 0.3
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'bar3D',
|
||||
data: chartsData.value.map(function(item: any) {
|
||||
return {
|
||||
value: [item['x'], item['y'], item['z']]
|
||||
}
|
||||
}),
|
||||
shading: 'realistic',
|
||||
label: {
|
||||
show: false,
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
borderWidth: 1
|
||||
}
|
||||
},
|
||||
|
||||
itemStyle: {
|
||||
opacity: 1
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
textStyle: {
|
||||
fontSize: 20,
|
||||
color: '#900'
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#900'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.dianyazanjiangbaojimidu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
overflow: scroll;
|
||||
|
||||
.dianyazanjiang {
|
||||
flex: 1;
|
||||
min-width: 1200px;
|
||||
min-height: 800px;
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
'first charts'
|
||||
'second charts'
|
||||
'third third '
|
||||
'third third ';
|
||||
grid-template-rows: 1fr 1fr 1fr 1fr;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
|
||||
.first {
|
||||
grid-area: first;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.second {
|
||||
grid-area: second;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.third {
|
||||
grid-area: third;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.charts {
|
||||
grid-area: charts;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<el-tabs v-model='activeName' type='border-card' class='event-statistics' tab-position='left' :style='height'>
|
||||
<el-tab-pane lazy label='ITIC曲线分析' name='1'>
|
||||
<ITICquxianfenxi />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy label='SEMI F47 分析' name='2'>
|
||||
<SEMIF47fenxi />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy label='电压暂降表及密度' name='3'>
|
||||
<Dianyazanjiangbiaojimidu />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy label='暂降分布统计' name='4'>
|
||||
<Zanjiangfenbutongji />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy label='暂降幅值概率分布' name='5'>
|
||||
<Zanjiangfuzhigailvfenbu />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy 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 lang='scss'>
|
||||
.event-statistics {
|
||||
.el-tabs__header.is-left {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
height: 100%;
|
||||
|
||||
.el-tab-pane {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,325 @@
|
||||
<template>
|
||||
<div style='display: flex;flex-direction: column;height: 100%' v-loading='loading'>
|
||||
<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>
|
||||
<div style='flex: 1;' class='mt10 zanjiangfenbutongji'>
|
||||
<my-echart :options='firstOptions' style='flex: 1;height: 100%' />
|
||||
<div style='width: 712px;height: 100%;display: flex;flex-direction: column'>
|
||||
<my-echart :options='secondOptions' style='flex: 1' />
|
||||
<my-echart :options='thirdOptions' style='flex: 1' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getReasonTypeTime, getStatistic } from '@/api/event-boot/monitor'
|
||||
import { color } from '@/components/echarts/color'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const loading = ref(true)
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const formData = reactive({
|
||||
lineIndex: monitoringPoint.state.lineId,
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
flag: 1
|
||||
})
|
||||
const firstOptions = ref<any>({})
|
||||
const secondOptions = ref<any>({})
|
||||
const thirdOptions = ref<any>({})
|
||||
const firstData = ref<any>([])
|
||||
const secondData = ref<any>([])
|
||||
const thirdData = ref<any>([])
|
||||
|
||||
|
||||
const init = () => {
|
||||
|
||||
loading.value = true
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
formData.startTime = datePickerRef.value.timeValue[0]
|
||||
formData.endTime = datePickerRef.value.timeValue[1]
|
||||
formData.flag = datePickerRef.value.interval
|
||||
Promise.all([getReasonTypeTime(formData), getStatistic(formData)]).then(res => {
|
||||
firstData.value = res[0].data
|
||||
secondData.value = res[1].data.reason
|
||||
thirdData.value = res[1].data.types
|
||||
initFirst()
|
||||
initSecond()
|
||||
initThird()
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const initFirst = () => {
|
||||
let months = new Array()
|
||||
let handle = new Array()
|
||||
for (let i = 0; i < firstData.value.length; i++) {
|
||||
if ((firstData.value[i].month == '01') || (i == 0)) {
|
||||
if (formData.flag == 0) {
|
||||
months[i] = firstData.value[i].month
|
||||
} else {
|
||||
months[i] = firstData.value[i].month + '-' + firstData.value[i].day
|
||||
}
|
||||
} else {
|
||||
if (formData.flag == 0) {
|
||||
months[i] = firstData.value[i].month
|
||||
} else {
|
||||
months[i] = firstData.value[i].month + '-' + firstData.value[i].day
|
||||
}
|
||||
}
|
||||
handle[i] = firstData.value[i].times
|
||||
}
|
||||
|
||||
firstOptions.value = {
|
||||
backgroundColor: '#fff', //背景色,
|
||||
title: {
|
||||
text:
|
||||
formData.flag == 3
|
||||
? '月份统计'
|
||||
: formData.flag == 2
|
||||
? '季度统计'
|
||||
: formData.flag == 1
|
||||
? '年份统计'
|
||||
: '',
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
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)',
|
||||
formatter: function(params: any) {
|
||||
let tips = ''
|
||||
tips += '<font>时间:' + params[0].name + '</font><br/>'
|
||||
tips += '<font>暂降次数:' + params[0].data + '</font>'
|
||||
return tips
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
data: ['暂降次数'],
|
||||
x: 'right'
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: months,
|
||||
name: '时间'
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '次',
|
||||
minInterval: 1
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '暂降次数',
|
||||
type: 'bar',
|
||||
barMinHeight: 10,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: function(params: any) {
|
||||
if (params.data == 0) {
|
||||
return '#ccc'
|
||||
} else {
|
||||
return color[0]
|
||||
}
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
label: { show: true, position: 'top' }
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data: handle
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
const initSecond = () => {
|
||||
let reaArray = []
|
||||
let valueArray = []
|
||||
secondData.value.reverse()
|
||||
for (let i = 0; i < secondData.value.length; i++) {
|
||||
reaArray.push(secondData.value[i].reason)
|
||||
valueArray.push({
|
||||
name: secondData.value[i].reason,
|
||||
value: secondData.value[i].times
|
||||
})
|
||||
}
|
||||
secondOptions.value = {
|
||||
backgroundColor: '#fff', //背景色,
|
||||
animation: false,
|
||||
title: {
|
||||
text: '暂降原因',
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
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)',
|
||||
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
left: 'left',
|
||||
data: reaArray
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '暂降原因',
|
||||
type: 'pie',
|
||||
radius: '70%',
|
||||
center: ['50%', '53%'],
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
},
|
||||
emphasis: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
lableLine: {
|
||||
normal: {
|
||||
show: false
|
||||
},
|
||||
emphasis: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
data: valueArray,
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
const initThird = () => {
|
||||
let typeArray = []
|
||||
let valueArray = []
|
||||
for (let i = 0; i < thirdData.value.length; i++) {
|
||||
typeArray.push(thirdData.value[i].type)
|
||||
valueArray.push({
|
||||
name: thirdData.value[i].type,
|
||||
value: thirdData.value[i].times
|
||||
}
|
||||
)
|
||||
}
|
||||
thirdOptions.value = {
|
||||
backgroundColor: '#fff', //背景色,
|
||||
animation: false,
|
||||
title: {
|
||||
text: '暂降类型',
|
||||
x: 'center'
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
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)',
|
||||
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
orient: 'vertical',
|
||||
left: 'left',
|
||||
data: typeArray
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '暂降类型',
|
||||
type: 'pie',
|
||||
radius: '70%',
|
||||
center: ['50%', '60%'],
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
},
|
||||
emphasis: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
lableLine: {
|
||||
normal: {
|
||||
show: false
|
||||
},
|
||||
emphasis: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
data: valueArray,
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.zanjiangfenbutongji {
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<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>
|
||||
<div style='flex: 1;' class='mt10'>
|
||||
<my-echart :options='options' />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const loading = ref(true)
|
||||
const formData = reactive({
|
||||
lineIndex: monitoringPoint.state.lineId,
|
||||
startTime: '',
|
||||
endTime: ''
|
||||
})
|
||||
const options = ref({})
|
||||
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.lineIndex = monitoringPoint.state.lineId
|
||||
formData.startTime = datePickerRef.value.timeValue[0]
|
||||
formData.endTime = datePickerRef.value.timeValue[1]
|
||||
getProbabilityDistribution(formData).then(
|
||||
(res: any) => {
|
||||
let data = res.data
|
||||
let eventValue = data.eventvalue
|
||||
let pereventValue = data.pereventvalue
|
||||
options.value = {
|
||||
backgroundColor: '#fff', //背景色,
|
||||
title: {
|
||||
text: '暂降幅值的概率分布函数',
|
||||
x: 'center'
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
left: 10,
|
||||
data: ['概率分布', '占比'],
|
||||
|
||||
textStyle: {
|
||||
rich: {
|
||||
a: {
|
||||
verticalAlign: 'middle'
|
||||
}
|
||||
},
|
||||
|
||||
padding: [2, 0, 0, 0] //[上、右、下、左]
|
||||
}
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
//提示框组件
|
||||
trigger: 'axis',
|
||||
|
||||
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
|
||||
},
|
||||
calculable: true,
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
name: '暂降幅值',
|
||||
nameGap: 10,
|
||||
nameTextStyle: {
|
||||
fontSize: 12
|
||||
},
|
||||
data: [
|
||||
'0',
|
||||
'10%',
|
||||
'20%',
|
||||
'30%',
|
||||
'40%',
|
||||
'50%',
|
||||
'60%',
|
||||
'70%',
|
||||
'80%',
|
||||
'90%',
|
||||
'100%'
|
||||
]
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: '概率分布',
|
||||
nameTextStyle: {
|
||||
fontSize: 15
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: '{value}%'
|
||||
},
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
// 使用深浅的间隔色
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '占比',
|
||||
|
||||
nameTextStyle: {
|
||||
fontSize: 15
|
||||
},
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '占比',
|
||||
type: 'bar',
|
||||
data: pereventValue,
|
||||
barWidth: 30,
|
||||
itemStyle: {
|
||||
normal: { show: true }
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '概率分布',
|
||||
type: 'line',
|
||||
data: eventValue,
|
||||
itemStyle: {
|
||||
normal: { show: true }
|
||||
}
|
||||
}
|
||||
],
|
||||
options: {
|
||||
dataZoom: null
|
||||
}
|
||||
}
|
||||
nextTick(() => {
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
|
||||
</script>
|
||||
<style></style>
|
||||
@@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 表头 -->
|
||||
<TableHeader date-picker>
|
||||
<template v-slot:operation>
|
||||
<el-button :icon='Download' type='primary' @click='download'>波形下载</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<!-- 表格 -->
|
||||
<Table ref='tableRef' :checkboxConfig='checkboxConfig' />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { Download } from '@element-plus/icons-vue'
|
||||
import { ref, onMounted, provide, reactive } from 'vue'
|
||||
import { ElMessageBox, ElMessage } from 'element-plus'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { checkUser } from '@/api/user-boot/user'
|
||||
import { VxeTablePropTypes } from 'vxe-table'
|
||||
import { downloadWaveFile, getMonitorEventAnalyseWave } from '@/api/event-boot/transient'
|
||||
|
||||
const dictData = useDictData()
|
||||
const eventTypeOptions = dictData.getBasicData('Event_Statis')
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const tableStore = new TableStore({
|
||||
publicHeight: 60,
|
||||
url: '/event-boot/monitor/getMonitorEventAnalyseQuery',
|
||||
method: 'POST',
|
||||
column: [
|
||||
{ width: '60', type: 'checkbox' },
|
||||
{ title: '序号', type: 'seq', width: '60' },
|
||||
{ title: '变电站名称', field: 'subName', minWidth: '130' },
|
||||
{ title: '监测点名称', field: 'lineName', minWidth: '130' },
|
||||
{ title: '网络参数', field: 'ip', minWidth: '130' },
|
||||
{ title: '电压等级(kV)', field: 'voltageScale', width: '100' },
|
||||
{ title: '暂降发生时刻', field: 'startTime', width: '200' },
|
||||
{ title: '暂降类型', field: 'advanceType', minWidth: '130' },
|
||||
{ title: '暂降原因', field: 'advanceReason', minWidth: '130' },
|
||||
{ title: '触发类型', field: 'eventTypeName', minWidth: '80' },
|
||||
{ title: '暂降(骤升)幅值(%)', field: 'featureAmplitude', minWidth: '80' },
|
||||
{ title: '持续时间(s)', field: 'duration', minWidth: '80' },
|
||||
{ title: '严重度', field: 'severity', minWidth: '80' },
|
||||
{
|
||||
title: '操作',
|
||||
width: '180',
|
||||
render: 'buttons',
|
||||
fixed: 'right',
|
||||
buttons: [
|
||||
{
|
||||
name: 'edit',
|
||||
title: '波形查看',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Lock',
|
||||
render: 'basicButton',
|
||||
disabled: row => {
|
||||
return row.fileFlag === 0
|
||||
},
|
||||
click: row => {
|
||||
getMonitorEventAnalyseWave({
|
||||
id: row.eventId,
|
||||
systemType: 0,
|
||||
type: 0
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
ElMessage.error('暂无可下载的波形文件!')
|
||||
})
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
beforeSearchFun: () => {
|
||||
tableStore.table.params.lineId = monitoringPoint.state.lineId
|
||||
console.log('beforeSearchFun')
|
||||
},
|
||||
loadCallback: () => {
|
||||
tableStore.table.data.forEach((item: any) => {
|
||||
item.eventTypeName = eventTypeOptions.find(item2 => item2.id === item.eventType)?.name
|
||||
item.featureAmplitude = (item.featureAmplitude * 100).toFixed(0)
|
||||
})
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
tableStore.table.params.searchState = 0
|
||||
onMounted(() => {
|
||||
// 加载数据
|
||||
tableStore.index()
|
||||
})
|
||||
const checkboxConfig = reactive<VxeTablePropTypes.CheckboxConfig<any>>({
|
||||
checkMethod: ({ row }) => {
|
||||
return row.fileFlag === 1
|
||||
}
|
||||
})
|
||||
const download = () => {
|
||||
if (!tableStore.table.selection.length) {
|
||||
ElMessage.warning('请选择数据')
|
||||
return
|
||||
}
|
||||
downloadWaveFile({
|
||||
lineId: tableStore.table.selection.map((item: any) => item.eventId)
|
||||
}).then((res: any) => {
|
||||
if (res.type == 'application/json') {
|
||||
ElMessage.warning('暂无可下载的波形文件!')
|
||||
return
|
||||
}
|
||||
ElMessage.success('下载中。。。!')
|
||||
let blob = new Blob([res], { type: 'application/zip' }) // console.log(blob) // var href = window.URL.createObjectURL(blob); //创建下载的链接
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
link.download = '波形分析下载' // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link) //释放标签
|
||||
})
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<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' lazy>
|
||||
<Navigation @changeTab='changeTab' />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='稳态综合评估' name='2' lazy v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='稳态指标合格率' name='3' lazy v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='稳态数据分析' name='4' lazy :style='height' v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='谐波频普' name='5' lazy :style='height' v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='告警数据统计' name='6' lazy :style='height' v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='监测点运行状态' name='7' lazy :style='height' v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label='实时数据' name='7' lazy :style='height' v-if='!isReload'>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class='monitoring-point'>当前位置：{{ monitoringPoint.state.lineName }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { defineOptions, nextTick, ref, watch } from 'vue'
|
||||
import Navigation from './navigation/index.vue'
|
||||
import EventStatistics from './eventStatistics/index.vue'
|
||||
import EventStudy from './eventStudy/index.vue'
|
||||
import RunningCondition from './runningCondition/index.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import router from '@/router'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/monitor/online'
|
||||
})
|
||||
const isReload = ref(false)
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const height = mainHeight(82)
|
||||
const activeName = ref('1')
|
||||
watch(
|
||||
() => router.currentRoute.value.query.lineId,
|
||||
(newLineId, oldLineId) => {
|
||||
if (!newLineId) return
|
||||
// 在这里处理 lineId 的变化
|
||||
monitoringPoint.setValue('lineId', router.currentRoute.value.query.lineId)
|
||||
monitoringPoint.setValue('lineName', router.currentRoute.value.query.lineName)
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
watch(() => monitoringPoint.state.lineId, () => {
|
||||
// 刷新页面
|
||||
isReload.value = true
|
||||
nextTick(() => {
|
||||
isReload.value = false
|
||||
})
|
||||
})
|
||||
const changeTab = (e: string) => {
|
||||
activeName.value = e
|
||||
}
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.monitoring-point {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,43 @@
|
||||
<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?[monitoringPoint.state.lineId]:[]'
|
||||
:current-node-key='monitoringPoint.state.lineId'
|
||||
@node-click='handleNodeClick'
|
||||
@init='handleNodeClick'
|
||||
></PointTree>
|
||||
</pane>
|
||||
<pane>
|
||||
<Map v-bind='$attrs'></Map>
|
||||
</pane>
|
||||
</splitpanes>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { onMounted, ref } from 'vue'
|
||||
import 'splitpanes/dist/splitpanes.css'
|
||||
import { Splitpanes, Pane } from 'splitpanes'
|
||||
import PointTree from '@/components/tree/pms/pointTree.vue'
|
||||
import Map from './map.vue'
|
||||
import Tree from '@/components/tree/index.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const size = ref(0)
|
||||
onMounted(() => {
|
||||
const dom = document.getElementById('navigation-splitpanes')
|
||||
if (dom) {
|
||||
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 {
|
||||
background: #eaeef1;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,320 @@
|
||||
<template>
|
||||
<div style='position: relative; height: 100%' v-loading='loading'>
|
||||
<div style='display: none'>
|
||||
<DatePicker ref='datePickerRef'></DatePicker>
|
||||
</div>
|
||||
<div class='iconBox'>
|
||||
<div class='div'>
|
||||
<img src='@/assets/jcd.png' alt='' />
|
||||
<span>变电站</span>
|
||||
</div>
|
||||
<div class='div'>
|
||||
<img src='@/assets/rby.png' alt='' />
|
||||
<span>热备用</span>
|
||||
</div>
|
||||
<div class='div'>
|
||||
<img src='@/assets/ty.png' alt='' />
|
||||
<span>停运</span>
|
||||
</div>
|
||||
<div class='div'>投运</div>
|
||||
<div class='div' style='padding-left: 10px'>
|
||||
<span>通讯正常</span>
|
||||
</div>
|
||||
<div class='div' style='padding-left: 20px'>
|
||||
<img src='@/assets/txzcyzj.gif' alt='' />
|
||||
<span>有暂降</span>
|
||||
</div>
|
||||
<div class='div' style='padding-left: 20px'>
|
||||
<img src='@/assets/txzcwzj.png' alt='' />
|
||||
<span>无暂降</span>
|
||||
</div>
|
||||
<div class='div' style='padding-left: 10px'>
|
||||
<span>通讯异常</span>
|
||||
</div>
|
||||
<div class='div' style='padding-left: 20px'>
|
||||
<img src='@/assets/txycyzj.gif' alt='' />
|
||||
<span>有暂降</span>
|
||||
</div>
|
||||
<div class='div' style='padding-left: 20px'>
|
||||
<img src='@/assets/txzdwzj.png' alt='' />
|
||||
<span>无暂降</span>
|
||||
</div>
|
||||
</div>
|
||||
<baidu-map
|
||||
class='bm-view'
|
||||
:zoom='zoom'
|
||||
:map-click='false'
|
||||
:scroll-wheel-zoom='true'
|
||||
:center='center'
|
||||
@ready='handler'
|
||||
@zoomend='syncCenterAndZoom'
|
||||
>
|
||||
<bm-map-type
|
||||
:map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
|
||||
anchor='BMAP_ANCHOR_TOP_RIGHT'
|
||||
></bm-map-type>
|
||||
<!-- 线-->
|
||||
<bm-polyline :path='path' v-for='(path, index) in polyline' :key='index'></bm-polyline>
|
||||
<!-- 变电站-->
|
||||
<template v-if='zoom > 12'>
|
||||
<bm-marker
|
||||
:position='path'
|
||||
v-for='path in siteList'
|
||||
:key='path.subId'
|
||||
:icon='path.icon'
|
||||
@click='markerClick(path)'
|
||||
></bm-marker>
|
||||
</template>
|
||||
<!-- 点 -->
|
||||
<BmlMarkerClusterer>
|
||||
<bm-marker
|
||||
:position='path'
|
||||
v-for='path in areaLineInfo'
|
||||
:key='path.lineId'
|
||||
:icon='path.icon'
|
||||
@click='markerClick(path)'
|
||||
></bm-marker>
|
||||
</BmlMarkerClusterer>
|
||||
<bm-marker :position='infoWindowPoint' :icon="{ url: '1', size: { width: 0, height: 0 } }">
|
||||
<bm-info-window :show='infoWindowPoint.show' @close='infoWindowPoint.show = false'>
|
||||
<el-descriptions :title='infoWindowPoint.lineName' :column='1' v-if='infoWindowPoint.lineId'>
|
||||
<el-descriptions-item label='供电公司'>{{ infoWindowPoint.gdName }}</el-descriptions-item>
|
||||
<el-descriptions-item label='变电站'>{{ infoWindowPoint.subName }}</el-descriptions-item>
|
||||
<el-descriptions-item label='母线'>{{ infoWindowPoint.voltageName }}</el-descriptions-item>
|
||||
<el-descriptions-item label='网络参数'>
|
||||
{{ infoWindowPoint.ip }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label='PT变化'>{{ infoWindowPoint.pt2 }}</el-descriptions-item>
|
||||
<el-descriptions-item label='CT变化'>{{ infoWindowPoint.ct2 }}</el-descriptions-item>
|
||||
<el-descriptions-item label='生产厂家'>
|
||||
{{ infoWindowPoint.manufacturer }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label='终端状态'>
|
||||
{{
|
||||
infoWindowPoint.runFlag == 0 ? '投运' : infoWindowPoint.runFlag == 1 ? '热备用' : '停运'
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label='通讯状态'>
|
||||
{{ infoWindowPoint.comFlag == 0 ? '中断' : '正常' }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<div
|
||||
class='btn-warp'>
|
||||
<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-button type='primary' size='small' @click='changeTab("5")'>谐波频普</el-button>
|
||||
<el-button type='primary' size='small' @click='changeTab("6")'>告警数据统计</el-button>
|
||||
<el-button type='primary' size='small' @click='changeTab("7")'>监测点运行状态
|
||||
</el-button>
|
||||
<el-button type='primary' size='small' @click='changeTab("8")'>实时数据</el-button>
|
||||
</div>
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
<el-descriptions
|
||||
:title='infoWindowPoint.subName'
|
||||
:column='1'
|
||||
v-else-if='infoWindowPoint.subId'
|
||||
style='padding-top: 10px'
|
||||
></el-descriptions>
|
||||
</bm-info-window>
|
||||
</bm-marker>
|
||||
</baidu-map>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
import { BmlMarkerClusterer } from 'vue-baidu-map-3x'
|
||||
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 '@/stores/monitoringPoint'
|
||||
|
||||
const emit = defineEmits(['changeTab'])
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const adminInfo = useAdminInfo()
|
||||
const datePickerRef = ref()
|
||||
const zoom = ref(11)
|
||||
const loading = ref(true)
|
||||
const params = ref({
|
||||
deptIndex: '',
|
||||
monitorFlag: 2,
|
||||
powerFlag: 2,
|
||||
searchBeginTime: '',
|
||||
searchEndTime: '',
|
||||
serverName: 'event-boot',
|
||||
statisticalType: {}
|
||||
})
|
||||
const center = ref({
|
||||
lng: 0,
|
||||
lat: 0
|
||||
})
|
||||
const infoWindowPoint = ref<anyObj>({
|
||||
lng: 0,
|
||||
lat: 0,
|
||||
show: false
|
||||
})
|
||||
const areaLineInfo = ref<any>([])
|
||||
const siteList = ref<any>([])
|
||||
const polyline = ref<any>([])
|
||||
const lineId = ref('')
|
||||
const handler = async ({ BMap, map }: any) => {
|
||||
params.value.deptIndex = adminInfo.$state.deptId
|
||||
params.value.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
params.value.searchEndTime = datePickerRef.value.timeValue[1]
|
||||
let { data } = await getAreaLineInfo(params.value)
|
||||
let r = 0.0035
|
||||
data.forEach((item: any) => {
|
||||
// 变电站图标
|
||||
item.icon = {
|
||||
url: new URL('@/assets/jcd.png', import.meta.url).href,
|
||||
size: {
|
||||
width: 40,
|
||||
height: 40
|
||||
}
|
||||
}
|
||||
if (item.children.length > 10 && item.children.length < 100) {
|
||||
r = 0.0055
|
||||
} else if (item.children.length >= 100) {
|
||||
r = 0.01055
|
||||
}
|
||||
item.children.forEach((val: any, i: number) => {
|
||||
val.lng = item.lng + r * Math.cos((2 * Math.PI * i) / item.children.length)
|
||||
val.lat = item.lat + r * Math.sin((2 * Math.PI * i) / item.children.length)
|
||||
// 监测点图标
|
||||
val.icon = {
|
||||
url: '',
|
||||
size: {
|
||||
width: 40,
|
||||
height: 40
|
||||
}
|
||||
}
|
||||
switch (val.runFlag) {
|
||||
case 0:
|
||||
// 投运
|
||||
if (val.comFlag == 0) {
|
||||
// 异常
|
||||
if (val.noDealCount > 0) {
|
||||
// 异常有暂降
|
||||
val.icon.url = new URL('@/assets/txycyzj.gif', import.meta.url).href
|
||||
} else if (val.noDealCount == 0) {
|
||||
// 异常无暂降
|
||||
val.icon.url = new URL('@/assets/txzdwzj.png', import.meta.url).href
|
||||
}
|
||||
} else if (val.comFlag == 1) {
|
||||
// 正常
|
||||
if (val.noDealCount > 0) {
|
||||
// 正常有暂降
|
||||
val.icon.url = new URL('@/assets/txzcyzj.gif', import.meta.url).href
|
||||
} else if (val.noDealCount == 0) {
|
||||
// 正常无暂降
|
||||
val.icon.url = new URL('@/assets/txzcwzj.png', import.meta.url).href
|
||||
}
|
||||
}
|
||||
break
|
||||
case 1:
|
||||
val.icon.url = new URL('@/assets/rby.png', import.meta.url).href
|
||||
break
|
||||
case 2:
|
||||
val.icon.url = new URL('@/assets/ty.png', import.meta.url).href
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
polyline.value.push([
|
||||
{
|
||||
lng: item.lng,
|
||||
lat: item.lat
|
||||
},
|
||||
{
|
||||
lng: val.lng,
|
||||
lat: val.lat
|
||||
}
|
||||
])
|
||||
})
|
||||
|
||||
areaLineInfo.value.push(...item.children)
|
||||
})
|
||||
siteList.value = data
|
||||
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
|
||||
}, 1500)
|
||||
}
|
||||
|
||||
const syncCenterAndZoom = (e: any) => {
|
||||
zoom.value = e.target.getZoom()
|
||||
}
|
||||
const markerClick = (e: any) => {
|
||||
infoWindowPoint.value = e
|
||||
infoWindowPoint.value.show = true
|
||||
}
|
||||
const changeTab = (e: string) => {
|
||||
emit('changeTab', e)
|
||||
}
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.bm-view {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.btn-warp {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
|
||||
.el-button {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.selectBox {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 165px;
|
||||
z-index: 2000;
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.iconBox {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
z-index: 2000;
|
||||
width: 150px;
|
||||
height: 260px;
|
||||
padding: 10px;
|
||||
background: rgba(255, 255, 255, 0.75) !important;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
|
||||
font-size: 12px;
|
||||
|
||||
.div {
|
||||
display: flex;
|
||||
margin-bottom: 5px;
|
||||
|
||||
img {
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,329 @@
|
||||
<template>
|
||||
<div v-loading='loading' class='running-condition'>
|
||||
<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>
|
||||
<div style='flex: 1;' class='mt10 zanjiangfenbutongji'>
|
||||
<div
|
||||
style='position: absolute; right: 10px; top: 10px; z-index: 2;display: flex;align-items: center;font-size: 12px'>
|
||||
<el-tag style='width: 20px;height: 12px' :style='{background: gradeColor[2]}'></el-tag>
|
||||
<span class='ml2' :style='{color: gradeColor[2]}'> {{ 'X<60%' }} </span>
|
||||
<el-tag class='ml10' style='width: 20px;height: 12px' :style='{background: gradeColor[1]}'></el-tag>
|
||||
<span class='ml2' :style='{color: gradeColor[1]}'>{{ '60%≤X<90%' }} </span>
|
||||
<el-tag class='ml10' style='width: 20px;height: 12px' :style='{background: gradeColor[0]}'></el-tag>
|
||||
<span class='ml2' :style='{color: gradeColor[0]}'> {{ 'X≥90 %' }}</span>
|
||||
</div>
|
||||
<my-echart :options='secondOptions' style='flex: 1;height: 100%' />
|
||||
<my-echart :options='firstOptions' style='flex: 1;height: 100%' />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { nextTick, onMounted, reactive, ref, watch } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getComFlagInfoData, getRunOnlineRateData } from '@/api/device-boot/communicate'
|
||||
import { gradeColor } from '@/components/echarts/color'
|
||||
|
||||
const datePickerRef = ref()
|
||||
const loading = ref(true)
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const formData = reactive({
|
||||
id: '',
|
||||
searchBeginTime: '',
|
||||
searchEndTime: '',
|
||||
timeFlag: 1
|
||||
})
|
||||
const firstOptions = ref<any>({})
|
||||
const secondOptions = ref<any>({})
|
||||
const firstData = ref<any>([])
|
||||
const secondData = ref<any>([])
|
||||
|
||||
const init = () => {
|
||||
loading.value = true
|
||||
formData.id = monitoringPoint.state.lineId
|
||||
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||
formData.timeFlag = datePickerRef.value.interval
|
||||
Promise.all([getRunOnlineRateData(formData), getComFlagInfoData(formData)]).then(res => {
|
||||
firstData.value = res[0].data
|
||||
secondData.value = res[1].data
|
||||
initFirst()
|
||||
initSecond()
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
const initFirst = () => {
|
||||
let months = new Array()
|
||||
let handle = new Array()
|
||||
let year = firstData.value[0].year
|
||||
|
||||
for (let i = 0; i < firstData.value.length; i++) {
|
||||
if (formData.timeFlag == 0) {
|
||||
months[i] = firstData.value[i].month
|
||||
months[0] = firstData.value[i].month + '\n' + '(' + year + ')'
|
||||
} else {
|
||||
months[i] = firstData.value[i].month + '-' + firstData.value[i].day
|
||||
months[0] = firstData.value[i].month + '-' + firstData.value[i].day + '\n' + '(' + year + ')'
|
||||
}
|
||||
handle.push(firstData.value[i].onlineRate)
|
||||
}
|
||||
firstOptions.value = {
|
||||
title: {
|
||||
text: '在线率统计',
|
||||
x: 'center',
|
||||
textStyle: {
|
||||
fontWeight: 'normal'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
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)',
|
||||
formatter: function(params: any) {
|
||||
let tips = ''
|
||||
tips += '时间:' + year + '-' + params[0].name + '</br/>'
|
||||
for (let i = 0; i < params.length; i++) {
|
||||
if (params[i].value == 3.14159) {
|
||||
tips += '在线率' + ':暂无数据<br/>'
|
||||
} else {
|
||||
tips += '在线率' + ':' + params[i].value + '%<br/>'
|
||||
}
|
||||
}
|
||||
return tips
|
||||
}
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: months,
|
||||
name: '时间',
|
||||
nameTextStyle: {
|
||||
verticalAlign: 'top', //标题位置
|
||||
padding: [-5, 0, 0, -10]
|
||||
},
|
||||
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
axisLine: {
|
||||
show: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
min: 0,
|
||||
max: 100,
|
||||
type: 'value',
|
||||
name: '%',
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
// 使用深浅的间隔色
|
||||
type: 'dashed',
|
||||
opacity: 0.5
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: handle,
|
||||
itemStyle: {
|
||||
color: (params: any) => {
|
||||
if (params.value == 3.14159) {
|
||||
return '#ccc'
|
||||
} else {
|
||||
if (params.value < 60) {
|
||||
return gradeColor[2]
|
||||
} else if (params.value < 90) {
|
||||
return gradeColor[1]
|
||||
} else {
|
||||
return gradeColor[0]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
markLine: {
|
||||
silent: false,
|
||||
symbol: 'circle',
|
||||
data: [
|
||||
{
|
||||
yAxis: 100,
|
||||
lineStyle: {
|
||||
color: gradeColor[0]
|
||||
},
|
||||
label: {
|
||||
position: 'end',
|
||||
formatter: '100%'
|
||||
}
|
||||
},
|
||||
{
|
||||
yAxis: 90,
|
||||
lineStyle: {
|
||||
color: gradeColor[1]
|
||||
},
|
||||
label: {
|
||||
position: 'end',
|
||||
formatter: '90%'
|
||||
}
|
||||
},
|
||||
{
|
||||
yAxis: 60,
|
||||
lineStyle: {
|
||||
color: gradeColor[2]
|
||||
},
|
||||
label: {
|
||||
position: 'end',
|
||||
formatter: '60%'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
const initSecond = () => {
|
||||
let list = secondData.value.type
|
||||
let items = secondData.value.updateTime
|
||||
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
if (i != 0) {
|
||||
i
|
||||
items[i] = items[i].slice(11)
|
||||
} else if (i == 0) {
|
||||
let date = items[i].slice(11)
|
||||
let t = items[i].slice(0, 10)
|
||||
items[i] = '(' + date + ')' + '\n' + t
|
||||
}
|
||||
}
|
||||
secondOptions.value = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
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)',
|
||||
formatter: function(params: any) {
|
||||
let res = '时间: ' + params[0].name + '<br/>运行状态：'
|
||||
let texts = ''
|
||||
if (params[0].value === 2 || params[0].value === '2') {
|
||||
texts = '退出'
|
||||
} else if (params[0].value === 0 || params[0].value === '0') {
|
||||
texts = '中断'
|
||||
} else if (params[0].value === 1 || params[0].value === '1') {
|
||||
texts = '正常'
|
||||
}
|
||||
res = res + texts
|
||||
return res
|
||||
}
|
||||
},
|
||||
dataZoom: [
|
||||
{
|
||||
type: 'inside',
|
||||
height: 13,
|
||||
start: 0,
|
||||
end: 100,
|
||||
bottom: '25px'
|
||||
},
|
||||
|
||||
{ height: 13, start: 0, bottom: '25px', end: 100 }
|
||||
],
|
||||
|
||||
xAxis: {
|
||||
name: '时间',
|
||||
type: 'category',
|
||||
data: items,
|
||||
boundaryGap: false
|
||||
|
||||
},
|
||||
yAxis: {
|
||||
name: '状态',
|
||||
type: 'value',
|
||||
axisLine: {
|
||||
show: true
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: 'blue'
|
||||
},
|
||||
// 这里重新定义就可以
|
||||
formatter: function(value: number) {
|
||||
let texts = []
|
||||
if (value === 2) {
|
||||
texts.push('退出')
|
||||
} else if (value === 0) {
|
||||
texts.push('中断')
|
||||
} else if (value === 1) {
|
||||
texts.push('正常')
|
||||
}
|
||||
return texts
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '运行状态',
|
||||
type: 'line',
|
||||
step: 'end',
|
||||
data: list
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
init()
|
||||
})
|
||||
|
||||
</script>
|
||||
<style lang='scss'>
|
||||
.running-condition {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 14px;
|
||||
border: 1px solid var(--el-border-color);
|
||||
|
||||
.zanjiangfenbutongji {
|
||||
position: relative;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -28,7 +28,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getPlot } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
|
||||
@@ -28,7 +28,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getPlot } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { eventDisdip, getCoords, IEC28, IEC411 } from '@/api/event-boot/monitor'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getReasonTypeTime, getStatistic } from '@/api/event-boot/monitor'
|
||||
import { color } from '@/components/echarts/color'
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
import { nextTick, onMounted, reactive, ref } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getProbabilityDistribution } from '@/api/event-boot/monitor'
|
||||
|
||||
const datePickerRef = ref()
|
||||
|
||||
@@ -18,7 +18,7 @@ import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { checkUser } from '@/api/user-boot/user'
|
||||
import { VxeTablePropTypes } from 'vxe-table'
|
||||
|
||||
@@ -25,7 +25,7 @@ import EventStudy from './eventStudy/index.vue'
|
||||
import RunningCondition from './runningCondition/index.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import router from '@/router'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
defineOptions({
|
||||
name: 'Descentsystem/monitoringpoint'
|
||||
|
||||
@@ -20,7 +20,7 @@ import { Splitpanes, Pane } from 'splitpanes'
|
||||
import PointTree from '@/components/tree/pms/pointTree.vue'
|
||||
import Map from './map.vue'
|
||||
import Tree from '@/components/tree/index.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
const size = ref(0)
|
||||
|
||||
@@ -121,7 +121,7 @@ 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/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
|
||||
const emit = defineEmits(['changeTab'])
|
||||
const monitoringPoint = useMonitoringPoint()
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
import { nextTick, onMounted, reactive, ref, watch } from 'vue'
|
||||
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { useMonitoringPoint } from '@/views/pqs/voltageSags/monitoringPoint/online/store'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { getComFlagInfoData, getRunOnlineRateData } from '@/api/device-boot/communicate'
|
||||
import { gradeColor } from '@/components/echarts/color'
|
||||
|
||||
|
||||
Reference in New Issue
Block a user