调整云南曲靖问题
This commit is contained in:
Binary file not shown.
|
Before Width: | Height: | Size: 263 KiB After Width: | Height: | Size: 243 KiB |
@@ -1,441 +1,441 @@
|
|||||||
<template>
|
<template>
|
||||||
<div v-loading="loading">
|
<div v-loading="loading">
|
||||||
<div>
|
<div>
|
||||||
<div id="boxi" :style="`height:${vh};overflow: hidden;`">
|
<div id="boxi" :style="`height:${vh};overflow: hidden;`">
|
||||||
<div class="bx" id="wave"></div>
|
<div class="bx" id="wave"></div>
|
||||||
</div>
|
</div>
|
||||||
<el-tabs type="border-card">
|
<el-tabs type="border-card">
|
||||||
<el-tab-pane label="暂态波形上送" :style="'height:' + vhh">
|
<el-tab-pane label="暂态波形上送" :style="'height:' + vhh">
|
||||||
<el-table stripe :data="Data" :height="height" border style="width: 100%"
|
<el-table stripe :data="Data" :height="height" border style="width: 100%"
|
||||||
header-cell-class-name="table_header">
|
header-cell-class-name="table_header">
|
||||||
<el-table-column align="center" prop="number" label="事件段"></el-table-column>
|
<el-table-column align="center" prop="number" label="事件段"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="波形起始点相位(°)">
|
<el-table-column align="center" prop="number" label="波形起始点相位(°)">
|
||||||
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="跳变段电压变化率(V/ms)">
|
<el-table-column align="center" prop="number" label="跳变段电压变化率(V/ms)">
|
||||||
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="相位跳变(°)">
|
<el-table-column align="center" prop="number" label="相位跳变(°)">
|
||||||
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
<el-table-column align="center" prop="number" label="A相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
<el-table-column align="center" prop="number" label="B相"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
<el-table-column align="center" prop="number" label="C相"></el-table-column>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="总分段数目"></el-table-column>
|
<el-table-column align="center" prop="number" label="总分段数目"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="三相电压不平衡度(%)" width="180"></el-table-column>
|
<el-table-column align="center" prop="number" label="三相电压不平衡度(%)" width="180"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="暂降类型"></el-table-column>
|
<el-table-column align="center" prop="number" label="触发类型"></el-table-column>
|
||||||
<el-table-column align="center" prop="number" label="暂降原因"></el-table-column>
|
<el-table-column align="center" prop="number" label="暂降原因"></el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
</el-tabs>
|
</el-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { downloadWaveFile, getMonitorEventAnalyseWave } from '@/api/event-boot/transient'
|
import { downloadWaveFile, getMonitorEventAnalyseWave } from '@/api/event-boot/transient'
|
||||||
import { mainHeight } from '@/utils/layout'
|
import { mainHeight } from '@/utils/layout'
|
||||||
import * as echarts from 'echarts'
|
import * as echarts from 'echarts'
|
||||||
import url from '@/assets/img/point.png'
|
import url from '@/assets/img/point.png'
|
||||||
import $ from 'jquery'
|
import $ from 'jquery'
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
flag: {
|
flag: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
DColor: {
|
DColor: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
boxoList: {
|
boxoList: {
|
||||||
type: [Object, Array]
|
type: [Object, Array]
|
||||||
},
|
},
|
||||||
GJList: {
|
GJList: {
|
||||||
type: [Object, Array]
|
type: [Object, Array]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
loading: true,
|
loading: true,
|
||||||
|
|
||||||
valA: 0,
|
valA: 0,
|
||||||
isOpen: false,
|
isOpen: false,
|
||||||
time: '',
|
time: '',
|
||||||
type: '',
|
type: '',
|
||||||
severity: '',
|
severity: '',
|
||||||
iphasic: '',
|
iphasic: '',
|
||||||
eventValue: '',
|
eventValue: '',
|
||||||
persistTime: '',
|
persistTime: '',
|
||||||
lineName: '',
|
lineName: '',
|
||||||
subName: '',
|
subName: '',
|
||||||
waveDatas: [],
|
waveDatas: [],
|
||||||
|
|
||||||
Data: [],
|
Data: [],
|
||||||
height: null,
|
height: null,
|
||||||
vhh: null,
|
vhh: null,
|
||||||
ptpass: '',
|
ptpass: '',
|
||||||
waveHeight: undefined,
|
waveHeight: undefined,
|
||||||
$wave: undefined,
|
$wave: undefined,
|
||||||
color: '#006565',
|
color: '#006565',
|
||||||
charts: {},
|
charts: {},
|
||||||
arrpoints: [],
|
arrpoints: [],
|
||||||
titles: '',
|
titles: '',
|
||||||
vh: null,
|
vh: null,
|
||||||
vw: null,
|
vw: null,
|
||||||
zoom: ''
|
zoom: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() { },
|
created() { },
|
||||||
watch: {
|
watch: {
|
||||||
value: function (a, b) {
|
value: function (a, b) {
|
||||||
if (a == 2) {
|
if (a == 2) {
|
||||||
// $("#wave1").remove();
|
// $("#wave1").remove();
|
||||||
this.initWaves()
|
this.initWaves()
|
||||||
} else {
|
} else {
|
||||||
$('#wave1').remove()
|
$('#wave1').remove()
|
||||||
this.initWaves()
|
this.initWaves()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.setHeight()
|
this.setHeight()
|
||||||
window.addEventListener('resize', this.setHeight)
|
window.addEventListener('resize', this.setHeight)
|
||||||
this.$wave = $('#wave').eq(0)
|
this.$wave = $('#wave').eq(0)
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.query()
|
this.query()
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
window.removeEventListener('resize', this.setHeight)
|
window.removeEventListener('resize', this.setHeight)
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
setHeight() {
|
setHeight() {
|
||||||
this.zoom = 1 / document.body.style.zoom
|
this.zoom = 1 / document.body.style.zoom
|
||||||
if (this.flag) {
|
if (this.flag) {
|
||||||
// console.log(123);
|
// console.log(123);
|
||||||
this.vh = mainHeight(250).height
|
this.vh = mainHeight(250).height
|
||||||
} else {
|
} else {
|
||||||
// console.log(3333);
|
// console.log(3333);
|
||||||
this.vh = mainHeight(270).height
|
this.vh = mainHeight(270).height
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
query() {
|
query() {
|
||||||
this.loading = true
|
this.loading = true
|
||||||
this.initWave()
|
this.initWave()
|
||||||
},
|
},
|
||||||
|
|
||||||
//开始画图
|
//开始画图
|
||||||
initWave() {
|
initWave() {
|
||||||
//清除之前增加的div
|
//清除之前增加的div
|
||||||
// $("#wave ~ .bx1").remove();
|
// $("#wave ~ .bx1").remove();
|
||||||
$('div.bx1').remove()
|
$('div.bx1').remove()
|
||||||
//设置暂降触发点的位置 一次值与二次值Y轴不同(不是计算出来的)
|
//设置暂降触发点的位置 一次值与二次值Y轴不同(不是计算出来的)
|
||||||
// var height = $(window).height() - 90;
|
// var height = $(window).height() - 90;
|
||||||
var picHeight
|
var picHeight
|
||||||
var show = true
|
var show = true
|
||||||
|
|
||||||
//var v = $("#interval").val();
|
//var v = $("#interval").val();
|
||||||
var isvisible = false
|
var isvisible = false
|
||||||
|
|
||||||
picHeight = this.vh
|
picHeight = this.vh
|
||||||
// this.$wave.css('height', picHeight)
|
// this.$wave.css('height', picHeight)
|
||||||
// this.$wave.css('width', '100%')
|
// this.$wave.css('width', '100%')
|
||||||
$('#wave').css('height', picHeight)
|
$('#wave').css('height', picHeight)
|
||||||
$('#wave').css('width', this.vw)
|
$('#wave').css('width', this.vw)
|
||||||
|
|
||||||
var adata = []
|
var adata = []
|
||||||
var bdata = []
|
var bdata = []
|
||||||
var cdata = []
|
var cdata = []
|
||||||
var max = 0
|
var max = 0
|
||||||
var min = 0
|
var min = 0
|
||||||
//绘制横向第一个波形图
|
//绘制横向第一个波形图
|
||||||
this.GJList.smp_x.forEach((item, ind) => {
|
this.GJList.smp_x.forEach((item, ind) => {
|
||||||
if (this.GJList.smp_a[ind] > max) {
|
if (this.GJList.smp_a[ind] > max) {
|
||||||
max = this.GJList.smp_a[ind]
|
max = this.GJList.smp_a[ind]
|
||||||
} else if (this.GJList.smp_a[ind] < min) {
|
} else if (this.GJList.smp_a[ind] < min) {
|
||||||
min = this.GJList.smp_a[ind]
|
min = this.GJList.smp_a[ind]
|
||||||
}
|
}
|
||||||
if (this.GJList.smp_b[ind] > max) {
|
if (this.GJList.smp_b[ind] > max) {
|
||||||
max = this.GJList.smp_b[ind]
|
max = this.GJList.smp_b[ind]
|
||||||
} else if (this.GJList.smp_b[ind] < min) {
|
} else if (this.GJList.smp_b[ind] < min) {
|
||||||
min = this.GJList.smp_b[ind]
|
min = this.GJList.smp_b[ind]
|
||||||
}
|
}
|
||||||
if (this.GJList.smp_c[ind] > max) {
|
if (this.GJList.smp_c[ind] > max) {
|
||||||
max = this.GJList.smp_c[ind]
|
max = this.GJList.smp_c[ind]
|
||||||
} else if (this.GJList.smp_c[ind] < min) {
|
} else if (this.GJList.smp_c[ind] < min) {
|
||||||
min = this.GJList.smp_c[ind]
|
min = this.GJList.smp_c[ind]
|
||||||
}
|
}
|
||||||
|
|
||||||
adata.push([item, this.GJList.smp_a[ind]])
|
adata.push([item, this.GJList.smp_a[ind]])
|
||||||
bdata.push([item, this.GJList.smp_b[ind]])
|
bdata.push([item, this.GJList.smp_b[ind]])
|
||||||
cdata.push([item, this.GJList.smp_c[ind]])
|
cdata.push([item, this.GJList.smp_c[ind]])
|
||||||
})
|
})
|
||||||
//绘制瞬时波形图
|
//绘制瞬时波形图
|
||||||
// const echarts = require('echarts')
|
// const echarts = require('echarts')
|
||||||
let wave = document.getElementById('wave')
|
let wave = document.getElementById('wave')
|
||||||
let _this = this
|
let _this = this
|
||||||
var myChartes = echarts.init(wave)
|
var myChartes = echarts.init(wave)
|
||||||
let echartsColor = {
|
let echartsColor = {
|
||||||
WordColor: '#000',
|
WordColor: '#000',
|
||||||
thread: '#000000',
|
thread: '#000000',
|
||||||
FigureColor: [
|
FigureColor: [
|
||||||
'#07CCCA ',
|
'#07CCCA ',
|
||||||
'#00BFF5',
|
'#00BFF5',
|
||||||
'#FFBF00',
|
'#FFBF00',
|
||||||
'#77DA63',
|
'#77DA63',
|
||||||
'#D5FF6B',
|
'#D5FF6B',
|
||||||
'#Ff6600',
|
'#Ff6600',
|
||||||
'#FF9100',
|
'#FF9100',
|
||||||
'#5B6E96',
|
'#5B6E96',
|
||||||
'#66FFCC',
|
'#66FFCC',
|
||||||
'#B3B3B3',
|
'#B3B3B3',
|
||||||
'#FF00FF',
|
'#FF00FF',
|
||||||
'#CC00FF',
|
'#CC00FF',
|
||||||
'#FF9999'
|
'#FF9999'
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
var option = {
|
var option = {
|
||||||
tooltip: {
|
tooltip: {
|
||||||
top: '10px',
|
top: '10px',
|
||||||
trigger: 'axis',
|
trigger: 'axis',
|
||||||
borderColor: 'grey',
|
borderColor: 'grey',
|
||||||
backgroundColor: '#fff',
|
backgroundColor: '#fff',
|
||||||
style: {
|
style: {
|
||||||
color: '#000',
|
color: '#000',
|
||||||
fontSize: '15px',
|
fontSize: '15px',
|
||||||
padding: 10
|
padding: 10
|
||||||
},
|
},
|
||||||
formatter: function (params) {
|
formatter: function (params) {
|
||||||
// console.log(params)
|
// console.log(params)
|
||||||
var tips = ''
|
var tips = ''
|
||||||
tips += '时刻:' + params[0].data[0] + '</br/>'
|
tips += '时刻:' + params[0].data[0] + '</br/>'
|
||||||
|
|
||||||
for (var i = 0; i < params.length; i++) {
|
for (var i = 0; i < params.length; i++) {
|
||||||
if (params[i].seriesName != '暂降触发点') {
|
if (params[i].seriesName != '暂降触发点') {
|
||||||
tips += params[i].seriesName + ':' + params[i].value[1] + '<br/>'
|
tips += params[i].seriesName + ':' + params[i].value[1] + '<br/>'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return tips
|
return tips
|
||||||
},
|
},
|
||||||
// axisPointer: {
|
// axisPointer: {
|
||||||
// type: "cross",
|
// type: "cross",
|
||||||
// label: {
|
// label: {
|
||||||
// color: "#fff",
|
// color: "#fff",
|
||||||
// fontSize: 16,
|
// fontSize: 16,
|
||||||
// },
|
// },
|
||||||
// },
|
// },
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
fontStyle: 'normal',
|
fontStyle: 'normal',
|
||||||
opacity: 0.35,
|
opacity: 0.35,
|
||||||
fontSize: 14
|
fontSize: 14
|
||||||
},
|
},
|
||||||
backgroundColor: 'rgba(0,0,0,0.55)',
|
backgroundColor: 'rgba(0,0,0,0.55)',
|
||||||
borderWidth: 0
|
borderWidth: 0
|
||||||
},
|
},
|
||||||
|
|
||||||
title: {
|
title: {
|
||||||
left: 'center',
|
left: 'center',
|
||||||
text: '发生时刻:' + this.boxoList.startTime + ' PT变化:' + this.boxoList.measurementPointName,
|
text: '发生时刻:' + this.boxoList.startTime + ' PT变化:' + this.boxoList.measurementPointName,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: 16,
|
fontSize: 16,
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
left: '5%',
|
left: '5%',
|
||||||
top: '20',
|
top: '20',
|
||||||
verticalAlign: 'top',
|
verticalAlign: 'top',
|
||||||
enabled: true,
|
enabled: true,
|
||||||
itemDistance: 5,
|
itemDistance: 5,
|
||||||
textStyle: {
|
textStyle: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
||||||
rich: {
|
rich: {
|
||||||
a: {
|
a: {
|
||||||
verticalAlign: 'middle'
|
verticalAlign: 'middle'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
padding: [2, 0, 0, 0] //[上、右、下、左]
|
padding: [2, 0, 0, 0] //[上、右、下、左]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
toolbox: {
|
toolbox: {
|
||||||
show: false,
|
show: false,
|
||||||
feature: {
|
feature: {
|
||||||
//restore: {},
|
//restore: {},
|
||||||
saveAsImage: {
|
saveAsImage: {
|
||||||
iconStyle: {
|
iconStyle: {
|
||||||
borderColor: _this.DColor ? '#fff' : echartsColor.WordColor
|
borderColor: _this.DColor ? '#fff' : echartsColor.WordColor
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: '时刻',
|
name: '时刻',
|
||||||
boundaryGap: false,
|
boundaryGap: false,
|
||||||
min: this.GJList.smp_x[0],
|
min: this.GJList.smp_x[0],
|
||||||
max: this.GJList.smp_x[this.GJList.smp_x.length - 1] + 1,
|
max: this.GJList.smp_x[this.GJList.smp_x.length - 1] + 1,
|
||||||
title: {
|
title: {
|
||||||
text: 'ms',
|
text: 'ms',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
fontSize: 12,
|
fontSize: 12,
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
||||||
},
|
},
|
||||||
enabled: true,
|
enabled: true,
|
||||||
align: 'high'
|
align: 'high'
|
||||||
},
|
},
|
||||||
splitLine: {
|
splitLine: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
axisTick: {
|
axisTick: {
|
||||||
alignWithLabel: true
|
alignWithLabel: true
|
||||||
},
|
},
|
||||||
axisLine: {
|
axisLine: {
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.thread
|
color: _this.DColor ? '#fff' : echartsColor.thread
|
||||||
},
|
},
|
||||||
onZero: false //-----------重点
|
onZero: false //-----------重点
|
||||||
},
|
},
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
||||||
formatter: function (value, index) {
|
formatter: function (value, index) {
|
||||||
if (_this.valA != (value - 0).toFixed(0)) {
|
if (_this.valA != (value - 0).toFixed(0)) {
|
||||||
_this.valA = (value - 0).toFixed(0)
|
_this.valA = (value - 0).toFixed(0)
|
||||||
return (value - 0).toFixed(0)
|
return (value - 0).toFixed(0)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//rotate:39
|
//rotate:39
|
||||||
}
|
}
|
||||||
// data: this.syncExtremes,
|
// data: this.syncExtremes,
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
type: 'value',
|
type: 'value',
|
||||||
name: 'kV',
|
name: 'kV',
|
||||||
title: {
|
title: {
|
||||||
align: 'high',
|
align: 'high',
|
||||||
offset: 0,
|
offset: 0,
|
||||||
text: 'kV',
|
text: 'kV',
|
||||||
rotation: 0,
|
rotation: 0,
|
||||||
y: -10
|
y: -10
|
||||||
},
|
},
|
||||||
|
|
||||||
boundaryGap: [0, '100%'],
|
boundaryGap: [0, '100%'],
|
||||||
showLastLabel: true,
|
showLastLabel: true,
|
||||||
max: (max + 10).toFixed(2),
|
max: (max + 10).toFixed(2),
|
||||||
min: (min - 10).toFixed(2),
|
min: (min - 10).toFixed(2),
|
||||||
opposite: false,
|
opposite: false,
|
||||||
nameTextStyle: {
|
nameTextStyle: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
color: _this.DColor ? '#fff' : echartsColor.WordColor
|
||||||
},
|
},
|
||||||
//minInterval: 1,
|
//minInterval: 1,
|
||||||
type: 'value',
|
type: 'value',
|
||||||
axisLine: {
|
axisLine: {
|
||||||
show: true,
|
show: true,
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.thread
|
color: _this.DColor ? '#fff' : echartsColor.thread
|
||||||
},
|
},
|
||||||
onZero: false //-----------重点
|
onZero: false //-----------重点
|
||||||
},
|
},
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
color: _this.DColor ? '#fff' : echartsColor.WordColor,
|
||||||
formatter: function (value, index) {
|
formatter: function (value, index) {
|
||||||
return (value - 0).toFixed(2)
|
return (value - 0).toFixed(2)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
splitLine: {
|
splitLine: {
|
||||||
lineStyle: {
|
lineStyle: {
|
||||||
// 使用深浅的间隔色
|
// 使用深浅的间隔色
|
||||||
color: [_this.DColor ? '#fff' : echartsColor.thread],
|
color: [_this.DColor ? '#fff' : echartsColor.thread],
|
||||||
type: 'dashed',
|
type: 'dashed',
|
||||||
opacity: 0.5
|
opacity: 0.5
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
grid: {
|
grid: {
|
||||||
left: '1%',
|
left: '1%',
|
||||||
right: '40px',
|
right: '40px',
|
||||||
bottom: '40px',
|
bottom: '40px',
|
||||||
top: '55px',
|
top: '55px',
|
||||||
containLabel: true
|
containLabel: true
|
||||||
},
|
},
|
||||||
dataZoom: [
|
dataZoom: [
|
||||||
{
|
{
|
||||||
type: 'inside',
|
type: 'inside',
|
||||||
height: 13,
|
height: 13,
|
||||||
start: 0,
|
start: 0,
|
||||||
bottom: '20px',
|
bottom: '20px',
|
||||||
end: 100
|
end: 100
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
start: 0,
|
start: 0,
|
||||||
height: 13,
|
height: 13,
|
||||||
bottom: '20px',
|
bottom: '20px',
|
||||||
end: 100
|
end: 100
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: 'A相',
|
name: 'A相',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
symbol: 'none',
|
symbol: 'none',
|
||||||
sampling: 'lttb',
|
sampling: 'lttb',
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: '#DAA520'
|
color: '#DAA520'
|
||||||
},
|
},
|
||||||
data: adata
|
data: adata
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'B相',
|
name: 'B相',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
symbol: 'none',
|
symbol: 'none',
|
||||||
sampling: 'lttb',
|
sampling: 'lttb',
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: '#2E8B57'
|
color: '#2E8B57'
|
||||||
},
|
},
|
||||||
data: bdata
|
data: bdata
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'C相',
|
name: 'C相',
|
||||||
type: 'line',
|
type: 'line',
|
||||||
smooth: true,
|
smooth: true,
|
||||||
symbol: 'none',
|
symbol: 'none',
|
||||||
sampling: 'lttb',
|
sampling: 'lttb',
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
color: '#A52a2a'
|
color: '#A52a2a'
|
||||||
},
|
},
|
||||||
data: cdata
|
data: cdata
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '暂降触发点',
|
name: '暂降触发点',
|
||||||
type: 'scatter',
|
type: 'scatter',
|
||||||
symbol: 'image://' + url,
|
symbol: 'image://' + url,
|
||||||
itemStyle: {
|
itemStyle: {
|
||||||
width: 16,
|
width: 16,
|
||||||
height: 16
|
height: 16
|
||||||
},
|
},
|
||||||
data: [[0, min]]
|
data: [[0, min]]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
myChartes.setOption(option)
|
myChartes.setOption(option)
|
||||||
// window.echartsArr.push(myChartes)
|
// window.echartsArr.push(myChartes)
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
myChartes.resize()
|
myChartes.resize()
|
||||||
this.loading = false
|
this.loading = false
|
||||||
}, 400)
|
}, 400)
|
||||||
|
|
||||||
//第一个波形图数据绘制完毕后,绘制后续的波形图
|
//第一个波形图数据绘制完毕后,绘制后续的波形图
|
||||||
|
|
||||||
// let waveDatasTemp = waveDatas.slice(1);
|
// let waveDatasTemp = waveDatas.slice(1);
|
||||||
// waveDatasTemp.reverse();
|
// waveDatasTemp.reverse();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -25,7 +25,7 @@
|
|||||||
{{ Math.floor(row.eventValue * 10000) / 100 }}
|
{{ Math.floor(row.eventValue * 10000) / 100 }}
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="eventType" width="100px" title="暂降类型">
|
<vxe-column field="eventType" width="100px" title="触发类型">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ event.filter(item => item.id == row.eventType)[0]?.name || '/' }}
|
{{ event.filter(item => item.id == row.eventType)[0]?.name || '/' }}
|
||||||
</template>
|
</template>
|
||||||
@@ -79,7 +79,7 @@ const init = async () => {
|
|||||||
// 设置消息接收回调
|
// 设置消息接收回调
|
||||||
mqttClient.onMessage((topic, message) => {
|
mqttClient.onMessage((topic, message) => {
|
||||||
const msg = JSON.parse(message.toString())
|
const msg = JSON.parse(message.toString())
|
||||||
// console.log('🚀 ~ init ~ msg:', msg)
|
console.log('🚀 ~ init ~ msg:', msg)
|
||||||
if (msg.deptList.includes(adminInfo.$state.deptId)) {
|
if (msg.deptList.includes(adminInfo.$state.deptId)) {
|
||||||
drawer.value = true
|
drawer.value = true
|
||||||
isLoading.value = true
|
isLoading.value = true
|
||||||
|
|||||||
@@ -1,49 +1,49 @@
|
|||||||
import { createRouter, createWebHashHistory } from 'vue-router'
|
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||||
import staticRoutes from '@/router/static'
|
import staticRoutes from '@/router/static'
|
||||||
import { useAdminInfo } from '@/stores/adminInfo'
|
import { useAdminInfo } from '@/stores/adminInfo'
|
||||||
import NProgress from 'nprogress'
|
import NProgress from 'nprogress'
|
||||||
import { loading } from '@/utils/loading'
|
import { loading } from '@/utils/loading'
|
||||||
import { ElMessage } from 'element-plus'
|
import { ElMessage } from 'element-plus'
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHashHistory(),
|
history: createWebHashHistory(),
|
||||||
routes: staticRoutes
|
routes: staticRoutes
|
||||||
})
|
})
|
||||||
|
|
||||||
router.beforeEach((to, from, next) => {
|
router.beforeEach((to, from, next) => {
|
||||||
NProgress.configure({ showSpinner: false })
|
NProgress.configure({ showSpinner: false })
|
||||||
NProgress.start()
|
NProgress.start()
|
||||||
if (!window.existLoading) {
|
if (!window.existLoading) {
|
||||||
loading.show()
|
loading.show()
|
||||||
window.existLoading = true
|
window.existLoading = true
|
||||||
}
|
}
|
||||||
if (to.path == '/login' || to.path == '/404') {
|
if (to.path == '/login' || to.path == '/404') {
|
||||||
// 登录或者注册才可以往下进行
|
// 登录或者注册才可以往下进行
|
||||||
next()
|
next()
|
||||||
} else if (to.path == '/admin/center/homePage') {
|
} else if (to.path == '/admin/center/homePage') {
|
||||||
window.open(window.location.origin + '/homePage/#/')
|
window.open(window.location.origin + '/homePage/#/')
|
||||||
} else {
|
} else {
|
||||||
// 获取 token
|
// 获取 token
|
||||||
const adminInfo = useAdminInfo()
|
const adminInfo = useAdminInfo()
|
||||||
const token = adminInfo.getToken()
|
const token = adminInfo.getToken()
|
||||||
// token 不存在
|
// token 不存在
|
||||||
if (token === null || token === '') {
|
if (token === null || token === '') {
|
||||||
ElMessage.error('您还没有登录,请先登录')
|
// ElMessage.error('您还没有登录,请先登录')
|
||||||
next('/login')
|
next('/login')
|
||||||
} else {
|
} else {
|
||||||
next()
|
next()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// next()
|
// next()
|
||||||
})
|
})
|
||||||
|
|
||||||
// 路由加载后
|
// 路由加载后
|
||||||
router.afterEach(() => {
|
router.afterEach(() => {
|
||||||
if (window.existLoading) {
|
if (window.existLoading) {
|
||||||
loading.hide()
|
loading.hide()
|
||||||
}
|
}
|
||||||
NProgress.done()
|
NProgress.done()
|
||||||
})
|
})
|
||||||
|
|
||||||
export default router
|
export default router
|
||||||
|
|||||||
@@ -83,7 +83,7 @@
|
|||||||
v-else
|
v-else
|
||||||
class="box-item"
|
class="box-item"
|
||||||
title="确定重启吗?"
|
title="确定重启吗?"
|
||||||
placement="bottom"
|
placement="left"
|
||||||
@confirm="restart(data)"
|
@confirm="restart(data)"
|
||||||
>
|
>
|
||||||
<template #actions="{ confirm, cancel }">
|
<template #actions="{ confirm, cancel }">
|
||||||
|
|||||||
@@ -131,7 +131,7 @@ const tableStore = new TableStore({
|
|||||||
{ field: 'scale', title: '电压等级', minWidth: '110' },
|
{ field: 'scale', title: '电压等级', minWidth: '110' },
|
||||||
// {
|
// {
|
||||||
// field: 'advanceType',
|
// field: 'advanceType',
|
||||||
// title: '暂降类型',
|
// title: '触发类型',
|
||||||
// minWidth: '90',
|
// minWidth: '90',
|
||||||
// formatter: (row: any) => {
|
// formatter: (row: any) => {
|
||||||
// return row.cellValue || '其他'
|
// return row.cellValue || '其他'
|
||||||
@@ -147,7 +147,7 @@ const tableStore = new TableStore({
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'eventType',
|
field: 'eventType',
|
||||||
title: '暂态统计类型',
|
title: '触发类型',
|
||||||
minWidth: '120',
|
minWidth: '120',
|
||||||
formatter: (row: any) => {
|
formatter: (row: any) => {
|
||||||
return eventList.filter(item => item.id === row.cellValue)[0]?.name
|
return eventList.filter(item => item.id === row.cellValue)[0]?.name
|
||||||
|
|||||||
@@ -109,9 +109,10 @@ const handleNodeClick = (data: any, node: any) => {
|
|||||||
}
|
}
|
||||||
// 上传
|
// 上传
|
||||||
const choose = (files: any) => {
|
const choose = (files: any) => {
|
||||||
const isJPG = files.raw.type === 'image/jpeg'
|
const isJPG = files.raw.type === 'image/jpg'
|
||||||
|
const isJPEG = files.raw.type === 'image/jpeg'
|
||||||
const isPNG = files.raw.type === 'image/png'
|
const isPNG = files.raw.type === 'image/png'
|
||||||
if (!isJPG && !isPNG) {
|
if (!isJPG && !isPNG && !isJPEG) {
|
||||||
ElMessage.warning('上传文件只能是 jpg/png 格式!')
|
ElMessage.warning('上传文件只能是 jpg/png 格式!')
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,153 +1,153 @@
|
|||||||
<!-- 暂态 -->
|
<!-- 暂态 -->
|
||||||
<template>
|
<template>
|
||||||
<el-dialog draggable title="暂态电能质量水平评估统计" v-model="dialogVisible" width="1400px">
|
<el-dialog draggable title="暂态电能质量水平评估统计" v-model="dialogVisible" width="1400px">
|
||||||
<div>
|
<div>
|
||||||
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="360px" :data="tableData">
|
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="360px" :data="tableData">
|
||||||
<vxe-column field="name" title="区域" />
|
<vxe-column field="name" title="区域" />
|
||||||
|
|
||||||
<vxe-column sortable field="sagTimes" title="暂降次数" />
|
<vxe-column sortable field="sagTimes" title="暂降次数" />
|
||||||
<vxe-column sortable field="swellTimes" title="暂升次数" />
|
<vxe-column sortable field="swellTimes" title="暂升次数" />
|
||||||
<vxe-column sortable field="interruptTimes" title="短时中断次数" />
|
<vxe-column sortable field="interruptTimes" title="短时中断次数" />
|
||||||
|
|
||||||
<vxe-colgroup title="暂态严重度占比">
|
<vxe-colgroup title="暂态严重度占比">
|
||||||
<vxe-column sortable field="rate90" title="SARFI-90" />
|
<vxe-column sortable field="rate90" title="SARFI-90" />
|
||||||
<vxe-column sortable field="rate50" title="SARFI-50" />
|
<vxe-column sortable field="rate50" title="SARFI-50" />
|
||||||
<vxe-column sortable field="rate20" title="SARFI-20" />
|
<vxe-column sortable field="rate20" title="SARFI-20" />
|
||||||
</vxe-colgroup>
|
</vxe-colgroup>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top: 10px; display: flex">
|
<div style="margin-top: 10px; display: flex">
|
||||||
<!--
|
<!--
|
||||||
-->
|
-->
|
||||||
<div class="statistics-main">
|
<div class="statistics-main">
|
||||||
<div class="statistics-box">
|
<div class="statistics-box">
|
||||||
<MyEChart style="height: 250px" :options="picEChart" />
|
<MyEChart style="height: 250px" :options="picEChart" />
|
||||||
|
|
||||||
<el-table size="small" height="250px" :data="descentData">
|
<el-table size="small" height="250px" :data="descentData">
|
||||||
<el-table-column prop="name" label="暂降原因" width="80px" align="center" />
|
<el-table-column prop="name" label="暂降原因" width="80px" align="center" />
|
||||||
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="statistics-box">
|
<div class="statistics-box">
|
||||||
<MyEChart style="height: 250px" :options="picEChart1" />
|
<MyEChart style="height: 250px" :options="picEChart1" />
|
||||||
<el-table size="small" height="250px" :data="resembleData">
|
<el-table size="small" height="250px" :data="resembleData">
|
||||||
<el-table-column prop="name" label="暂降类型" width="80px" align="center" />
|
<el-table-column prop="name" label="触发类型" width="80px" align="center" />
|
||||||
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import MyEChart from '@/components/echarts/MyEchart.vue'
|
import MyEChart from '@/components/echarts/MyEchart.vue'
|
||||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
import { getEventReason, getEventDetailByList } from '@/api/device-boot/panorama'
|
import { getEventReason, getEventDetailByList } from '@/api/device-boot/panorama'
|
||||||
|
|
||||||
const dialogVisible: any = ref(false)
|
const dialogVisible: any = ref(false)
|
||||||
|
|
||||||
const tableData: any = ref([])
|
const tableData: any = ref([])
|
||||||
const descentData = ref([])
|
const descentData = ref([])
|
||||||
const resembleData = ref([])
|
const resembleData = ref([])
|
||||||
|
|
||||||
const picEChart = ref({})
|
const picEChart = ref({})
|
||||||
const picEChart1 = ref({})
|
const picEChart1 = ref({})
|
||||||
const open = async (row: any) => {
|
const open = async (row: any) => {
|
||||||
getEventDetailByList({ ...row, deviceInfoParam: row }).then((res: any) => {
|
getEventDetailByList({ ...row, deviceInfoParam: row }).then((res: any) => {
|
||||||
tableData.value = res.data
|
tableData.value = res.data
|
||||||
})
|
})
|
||||||
getEventReason(row).then(res => {
|
getEventReason(row).then(res => {
|
||||||
descentData.value = res.data.reason
|
descentData.value = res.data.reason
|
||||||
resembleData.value = res.data.type
|
resembleData.value = res.data.type
|
||||||
picEChart.value = {
|
picEChart.value = {
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'item'
|
trigger: 'item'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
left: '10px'
|
left: '10px'
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
dataZoom: null,
|
dataZoom: null,
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['60%', '50%'],
|
center: ['60%', '50%'],
|
||||||
radius: '50%',
|
radius: '50%',
|
||||||
label: {
|
label: {
|
||||||
show: false,
|
show: false,
|
||||||
position: 'outside',
|
position: 'outside',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
//数值样式
|
//数值样式
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data: res.data.reason
|
data: res.data.reason
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
picEChart1.value = {
|
picEChart1.value = {
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'item'
|
trigger: 'item'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
left: '10px'
|
left: '10px'
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
dataZoom: null,
|
dataZoom: null,
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['60%', '50%'],
|
center: ['60%', '50%'],
|
||||||
radius: '50%',
|
radius: '50%',
|
||||||
label: {
|
label: {
|
||||||
show: false,
|
show: false,
|
||||||
position: 'outside',
|
position: 'outside',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
//数值样式
|
//数值样式
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data: res.data.type
|
data: res.data.type
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ open })
|
defineExpose({ open })
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.statistics-main {
|
.statistics-main {
|
||||||
// height: 300px;
|
// height: 300px;
|
||||||
display: grid;
|
display: grid;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
grid-template-columns: 1fr 1fr;
|
grid-template-columns: 1fr 1fr;
|
||||||
|
|
||||||
.statistics-box {
|
.statistics-box {
|
||||||
// height: 300px;
|
// height: 300px;
|
||||||
// display: flex;
|
// display: flex;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 2fr 1fr;
|
grid-template-columns: 2fr 1fr;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
:deep(.el-dialog__body) {
|
:deep(.el-dialog__body) {
|
||||||
max-height: none !important;
|
max-height: none !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -53,7 +53,7 @@
|
|||||||
<div class="statistics-box">
|
<div class="statistics-box">
|
||||||
<MyEChart style="height: 250px" :options="picEChart1" />
|
<MyEChart style="height: 250px" :options="picEChart1" />
|
||||||
<el-table size="small" height="250px" :data="resembleData">
|
<el-table size="small" height="250px" :data="resembleData">
|
||||||
<el-table-column prop="name" label="暂降类型" width="80px" align="center" />
|
<el-table-column prop="name" label="触发类型" width="80px" align="center" />
|
||||||
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
<el-table-column prop="value" label="暂降次数" width="80px" align="center" />
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,144 +1,144 @@
|
|||||||
<template>
|
<template>
|
||||||
<span style="color: red; font-size: 12px">注:暂降类型仅统计暂降原因为短路故障事件</span>
|
<span style="color: red; font-size: 12px">注:触发类型仅统计暂降原因为短路故障事件</span>
|
||||||
|
|
||||||
<div class="statistics-main">
|
<div class="statistics-main">
|
||||||
<template v-if="flag">
|
<template v-if="flag">
|
||||||
<div>
|
<div>
|
||||||
<my-echart :options="descent" />
|
<my-echart :options="descent" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<vxe-table height="auto" auto-resize :data="descentData" v-bind="defaultAttribute">
|
<vxe-table height="auto" auto-resize :data="descentData" v-bind="defaultAttribute">
|
||||||
<vxe-column field="name" title="暂降原因"></vxe-column>
|
<vxe-column field="name" title="暂降原因"></vxe-column>
|
||||||
<vxe-column field="value" title="暂降次数"></vxe-column>
|
<vxe-column field="value" title="暂降次数"></vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<my-echart :options="resemble" />
|
<my-echart :options="resemble" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<vxe-table height="auto" auto-resize :data="resembleData" v-bind="defaultAttribute">
|
<vxe-table height="auto" auto-resize :data="resembleData" v-bind="defaultAttribute">
|
||||||
<vxe-column field="name" title="暂降类型"></vxe-column>
|
<vxe-column field="name" title="触发类型"></vxe-column>
|
||||||
<vxe-column field="value" title="暂降次数"></vxe-column>
|
<vxe-column field="value" title="暂降次数"></vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive } from 'vue'
|
import { ref, reactive } from 'vue'
|
||||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
import { mainHeight } from '@/utils/layout'
|
import { mainHeight } from '@/utils/layout'
|
||||||
const descent = ref({})
|
const descent = ref({})
|
||||||
const descentData = ref([])
|
const descentData = ref([])
|
||||||
const resemble = ref({})
|
const resemble = ref({})
|
||||||
const resembleData = ref([])
|
const resembleData = ref([])
|
||||||
const flag = ref(true)
|
const flag = ref(true)
|
||||||
|
|
||||||
const info = (res: any) => {
|
const info = (res: any) => {
|
||||||
flag.value = false
|
flag.value = false
|
||||||
descentData.value = res.reason
|
descentData.value = res.reason
|
||||||
resembleData.value = res.type
|
resembleData.value = res.type
|
||||||
|
|
||||||
descent.value = {
|
descent.value = {
|
||||||
title: {
|
title: {
|
||||||
text: '暂降原因'
|
text: '暂降原因'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
type: 'scroll',
|
type: 'scroll',
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
top:null,
|
top:null,
|
||||||
left: 25,
|
left: 25,
|
||||||
bottom: 40,
|
bottom: 40,
|
||||||
|
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
dataZoom: { show: false },
|
dataZoom: { show: false },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'item',
|
trigger: 'item',
|
||||||
formatter: '{a} <br/>{b} : {c} (次)'
|
formatter: '{a} <br/>{b} : {c} (次)'
|
||||||
},
|
},
|
||||||
options: {
|
options: {
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '暂降原因',
|
name: '暂降原因',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['50%', '50%'],
|
center: ['50%', '50%'],
|
||||||
selectedOffset: 30,
|
selectedOffset: 30,
|
||||||
clockwise: true,
|
clockwise: true,
|
||||||
label: {
|
label: {
|
||||||
show: false,
|
show: false,
|
||||||
position: 'outside',
|
position: 'outside',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
//数值样式
|
//数值样式
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
data: res.reason?.filter((item: any) => item.name != '总计')
|
data: res.reason?.filter((item: any) => item.name != '总计')
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
resemble.value = {
|
resemble.value = {
|
||||||
title: {
|
title: {
|
||||||
text: '暂降类型'
|
text: '触发类型'
|
||||||
},
|
},
|
||||||
legend: {
|
legend: {
|
||||||
type: 'scroll',
|
type: 'scroll',
|
||||||
orient: 'vertical',
|
orient: 'vertical',
|
||||||
top:null,
|
top:null,
|
||||||
left: 25,
|
left: 25,
|
||||||
bottom: 40,
|
bottom: 40,
|
||||||
},
|
},
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'item',
|
trigger: 'item',
|
||||||
formatter: '{a} <br/>{b} : {c} (次)',
|
formatter: '{a} <br/>{b} : {c} (次)',
|
||||||
},
|
},
|
||||||
xAxis: {
|
xAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
show: false
|
show: false
|
||||||
},
|
},
|
||||||
dataZoom: { show: false },
|
dataZoom: { show: false },
|
||||||
options: {
|
options: {
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '暂降类型',
|
name: '触发类型',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['50%', '50%'],
|
center: ['50%', '50%'],
|
||||||
selectedOffset: 30,
|
selectedOffset: 30,
|
||||||
clockwise: true,
|
clockwise: true,
|
||||||
label: {
|
label: {
|
||||||
show: false,
|
show: false,
|
||||||
position: 'outside'
|
position: 'outside'
|
||||||
},
|
},
|
||||||
|
|
||||||
data: res.type?.filter((item: any) => item.name != '总计')
|
data: res.type?.filter((item: any) => item.name != '总计')
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
flag.value = true
|
flag.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({ info })
|
defineExpose({ info })
|
||||||
const layout = mainHeight(175) as any
|
const layout = mainHeight(175) as any
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.statistics-main {
|
.statistics-main {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: v-bind('layout.height');
|
height: v-bind('layout.height');
|
||||||
padding: 0 10px 10px;
|
padding: 0 10px 10px;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr 600px;
|
grid-template-columns: 1fr 600px;
|
||||||
grid-template-rows: 1fr 1fr;
|
grid-template-rows: 1fr 1fr;
|
||||||
grid-gap: 10px;
|
grid-gap: 10px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -85,8 +85,8 @@
|
|||||||
></el-input>
|
></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<!-- <el-form-item label="暂降类型:">
|
<!-- <el-form-item label="触发类型:">
|
||||||
<el-select v-model="tableStore.table.params.eventType" placeholder="请选择暂降类型" clearable multiple
|
<el-select v-model="tableStore.table.params.eventType" placeholder="请选择触发类型" clearable multiple
|
||||||
collapse-tags style="width: 100%">
|
collapse-tags style="width: 100%">
|
||||||
<el-option v-for="item in typeoptions" :key="item.id" :label="item.name"
|
<el-option v-for="item in typeoptions" :key="item.id" :label="item.name"
|
||||||
:value="item.id"></el-option>
|
:value="item.id"></el-option>
|
||||||
@@ -251,7 +251,7 @@ const tableStore = new TableStore({
|
|||||||
return triggeroptions.filter(item => item.id == row.eventType)[0]?.name
|
return triggeroptions.filter(item => item.id == row.eventType)[0]?.name
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// { field: 'advanceType', title: '暂降类型', minWidth: '100', },
|
// { field: 'advanceType', title: '触发类型', minWidth: '100', },
|
||||||
{ field: 'advanceReason', title: '暂态原因', minWidth: '100' },
|
{ field: 'advanceReason', title: '暂态原因', minWidth: '100' },
|
||||||
{
|
{
|
||||||
field: 'depth',
|
field: 'depth',
|
||||||
|
|||||||
@@ -56,7 +56,7 @@
|
|||||||
<vxe-table-column field="duration" title="持续时间(s)" align="center" width="120"></vxe-table-column>
|
<vxe-table-column field="duration" title="持续时间(s)" align="center" width="120"></vxe-table-column>
|
||||||
<vxe-table-column
|
<vxe-table-column
|
||||||
field="advanceType"
|
field="advanceType"
|
||||||
title="暂降类型"
|
title="触发类型"
|
||||||
align="center"
|
align="center"
|
||||||
width="120"
|
width="120"
|
||||||
:formatter="formFilter"
|
:formatter="formFilter"
|
||||||
|
|||||||
@@ -39,7 +39,7 @@
|
|||||||
</template>
|
</template>
|
||||||
</vxe-table-column>
|
</vxe-table-column>
|
||||||
<vxe-table-column field="duration" title="持续时间(s)" align="center" width="120"></vxe-table-column>
|
<vxe-table-column field="duration" title="持续时间(s)" align="center" width="120"></vxe-table-column>
|
||||||
<vxe-table-column field="advanceType" title="暂降类型" align="center" width="120"
|
<vxe-table-column field="advanceType" title="触发类型" align="center" width="120"
|
||||||
:formatter="formFilter"></vxe-table-column>
|
:formatter="formFilter"></vxe-table-column>
|
||||||
<vxe-table-column field="advanceReason" title="暂降原因" align="center" width="120"
|
<vxe-table-column field="advanceReason" title="暂降原因" align="center" width="120"
|
||||||
:formatter="formFilter"></vxe-table-column>
|
:formatter="formFilter"></vxe-table-column>
|
||||||
|
|||||||
@@ -249,7 +249,7 @@ const initThird = () => {
|
|||||||
backgroundColor: '#fff', //背景色,
|
backgroundColor: '#fff', //背景色,
|
||||||
animation: false,
|
animation: false,
|
||||||
title: {
|
title: {
|
||||||
text: '暂降类型',
|
text: '触发类型',
|
||||||
x: 'center'
|
x: 'center'
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -277,7 +277,7 @@ const initThird = () => {
|
|||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
name: '暂降类型',
|
name: '触发类型',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
radius: '65%',
|
radius: '65%',
|
||||||
center: ['50%', '60%'],
|
center: ['50%', '60%'],
|
||||||
|
|||||||
@@ -61,7 +61,7 @@ const tableStore = new TableStore({
|
|||||||
{ title: '网络参数', field: 'ip', width: '120px' },
|
{ title: '网络参数', field: 'ip', width: '120px' },
|
||||||
{ title: '电压等级(kV)', field: 'voltageScale', width: '120' },
|
{ title: '电压等级(kV)', field: 'voltageScale', width: '120' },
|
||||||
{ title: '暂降发生时刻', field: 'startTime', width: '200' },
|
{ title: '暂降发生时刻', field: 'startTime', width: '200' },
|
||||||
// { title: '暂降类型', field: 'advanceType', minWidth: '130' },
|
// { title: '触发类型', field: 'advanceType', minWidth: '130' },
|
||||||
{ title: '暂降原因', field: 'advanceReason', minWidth: '130' },
|
{ title: '暂降原因', field: 'advanceReason', minWidth: '130' },
|
||||||
{
|
{
|
||||||
title: '触发类型',
|
title: '触发类型',
|
||||||
|
|||||||
@@ -109,7 +109,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">暂降类型</div>
|
<div class="divBox">触发类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
placeholder="请输入监测点名称"
|
placeholder="请输入监测点名称"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="暂降类型">
|
<el-form-item label="触发类型">
|
||||||
<el-select v-model.trim="tableStore.table.params.dicData" placeholder="请选择" clearable>
|
<el-select v-model.trim="tableStore.table.params.dicData" placeholder="请选择" clearable>
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in triggerType"
|
v-for="item in triggerType"
|
||||||
@@ -79,7 +79,7 @@ const tableStore: any = new TableStore({
|
|||||||
{ field: 'objName', title: '监测对象', minWidth: '170' },
|
{ field: 'objName', title: '监测对象', minWidth: '170' },
|
||||||
// {
|
// {
|
||||||
// field: 'advanceType',
|
// field: 'advanceType',
|
||||||
// title: '暂降类型',
|
// title: '触发类型',
|
||||||
// minWidth: '90',
|
// minWidth: '90',
|
||||||
// formatter: (row: any) => {
|
// formatter: (row: any) => {
|
||||||
// return row.cellValue || '其他'
|
// return row.cellValue || '其他'
|
||||||
@@ -95,7 +95,7 @@ const tableStore: any = new TableStore({
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'eventType',
|
field: 'eventType',
|
||||||
title: '暂态统计类型',
|
title: '触发类型',
|
||||||
minWidth: '120',
|
minWidth: '120',
|
||||||
formatter: (row: any) => {
|
formatter: (row: any) => {
|
||||||
return triggerType.filter(item => item.id === row.cellValue)[0]?.name
|
return triggerType.filter(item => item.id === row.cellValue)[0]?.name
|
||||||
|
|||||||
@@ -1,45 +1,45 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog draggable width="1100px" v-model="dialogVisible" title="暂降事件列表">
|
<el-dialog draggable width="1100px" v-model="dialogVisible" title="暂降事件列表">
|
||||||
<div style="height: 40vh">
|
<div style="height: 40vh">
|
||||||
<vxe-table v-loading="loading" height="auto" auto-resize :data="tableData" v-bind="defaultAttribute">
|
<vxe-table v-loading="loading" height="auto" auto-resize :data="tableData" v-bind="defaultAttribute">
|
||||||
<vxe-column type="seq" title="序号" width="80px"></vxe-column>
|
<vxe-column type="seq" title="序号" width="80px"></vxe-column>
|
||||||
<vxe-column field="startTime" title="发生时间" width="180"></vxe-column>
|
<vxe-column field="startTime" title="发生时间" width="180"></vxe-column>
|
||||||
<vxe-column field="duration" title="持续时间(s)" width="100"></vxe-column>
|
<vxe-column field="duration" title="持续时间(s)" width="100"></vxe-column>
|
||||||
<vxe-column field="gdName" title="供电公司" min-width="150"></vxe-column>
|
<vxe-column field="gdName" title="供电公司" min-width="150"></vxe-column>
|
||||||
<vxe-column field="subName" title="变电站" min-width="150"></vxe-column>
|
<vxe-column field="subName" title="变电站" min-width="150"></vxe-column>
|
||||||
<vxe-column field="lineName" title="监测点" min-width="150"></vxe-column>
|
<vxe-column field="lineName" title="监测点" min-width="150"></vxe-column>
|
||||||
<vxe-column field="advanceType" title="暂降类型" width="100">
|
<vxe-column field="advanceType" title="触发类型" width="100">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ type.find(item => item.id === row.advanceType)?.name }}
|
{{ type.find(item => item.id === row.advanceType)?.name }}
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
<vxe-column field="featureAmplitude" title="暂降(骤升)幅值(%)" width="150">
|
<vxe-column field="featureAmplitude" title="暂降(骤升)幅值(%)" width="150">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
{{ (row.featureAmplitude * 100).toFixed(2) }}
|
{{ (row.featureAmplitude * 100).toFixed(2) }}
|
||||||
</template>
|
</template>
|
||||||
</vxe-column>
|
</vxe-column>
|
||||||
</vxe-table>
|
</vxe-table>
|
||||||
</div>
|
</div>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, inject } from 'vue'
|
import { ref, inject } from 'vue'
|
||||||
|
|
||||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
import { getNoDealEventsByLineId } from '@/api/event-boot/areaInfo'
|
import { getNoDealEventsByLineId } from '@/api/event-boot/areaInfo'
|
||||||
import { useDictData } from '@/stores/dictData'
|
import { useDictData } from '@/stores/dictData'
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
const type = dictData.getBasicData('Event_Type')
|
const type = dictData.getBasicData('Event_Type')
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
const tableData = ref([])
|
const tableData = ref([])
|
||||||
const loading = ref(true)
|
const loading = ref(true)
|
||||||
const open = (params: any) => {
|
const open = (params: any) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true
|
||||||
loading.value = true
|
loading.value = true
|
||||||
getNoDealEventsByLineId(params).then(res => {
|
getNoDealEventsByLineId(params).then(res => {
|
||||||
tableData.value = res.data
|
tableData.value = res.data
|
||||||
loading.value = false
|
loading.value = false
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
defineExpose({ open })
|
defineExpose({ open })
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -117,7 +117,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">暂降类型</div>
|
<div class="divBox">触发类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" class="mTop">
|
<el-col :span="12" class="mTop">
|
||||||
|
|||||||
@@ -122,7 +122,7 @@
|
|||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<div class="grid-content">
|
<div class="grid-content">
|
||||||
<div class="divBox">暂降类型</div>
|
<div class="divBox">触发类型</div>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
|
|||||||
@@ -107,7 +107,7 @@ const list = ref([
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ field: 'duration', title: '持续时间(s)', width: '120' },
|
{ field: 'duration', title: '持续时间(s)', width: '120' },
|
||||||
{ field: 'advanceType', title: '暂降类型(机器判断)', width: '150' }
|
{ field: 'advanceType', title: '触发类型(机器判断)', width: '150' }
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
Reference in New Issue
Block a user