调整云南曲靖问题

This commit is contained in:
guanj
2026-01-16 14:03:40 +08:00
parent 0b76347853
commit a19952b771
21 changed files with 856 additions and 855 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 263 KiB

After

Width:  |  Height:  |  Size: 243 KiB

View File

@@ -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>

View File

@@ -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

View File

@@ -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

View File

@@ -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 }">

View File

@@ -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

View File

@@ -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
} }

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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',

View File

@@ -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"

View File

@@ -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>

View File

@@ -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%'],

View File

@@ -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: '触发类型',

View File

@@ -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">

View File

@@ -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

View File

@@ -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>

View File

@@ -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">

View File

@@ -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">

View File

@@ -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' }
] ]
}, },
{ {