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

修改文件夹位置

Browse Source
This commit is contained in:
GGJ
2024-01-22 20:24:50 +08:00
parent 4f285a61e5
commit f2384c86cd
16 changed files with 777 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

293
src/views/pms/Event-boot/Region/components/echart.vue Normal file
View File

@@ -0,0 +1,293 @@
<template>
<div>
<my-echart class="bars_w" :options="areaStatistics" />
<div class="separate">
<my-echart class="bars_w" :options="voltageStatistics" />
<my-echart class="bars_w" :options="monthlyStatistics" />
</div>
</div>
</template>
<script setup lang="ts">
import MyEchart from '@/components/echarts/MyEchart.vue'
import { reactive, ref, defineExpose } from 'vue'
import { mainHeight } from '@/utils/layout'
let areaStatistics = ref({})
let voltageStatistics = ref({})
let monthlyStatistics = ref({})
const Processing = (list: any) => {
// 区域
let echartsndArr: string[] = []
let echartsArr: string[] = []
list.areaCalculation.forEach((item: any) => {
echartsndArr.push(item.areaName)
if (item.frequency == 0) {
item.frequency = 1.1
} else if (item.frequency == 1) {
item.frequency = 1.3
}
echartsArr.push(item.frequency)
})
areaStatistics.value = {
title: {
text: '区域'
},
tooltip: {
formatter: function (params: any) {
let html = '区域：' + params[0].name
params.forEach((item: any) => {
if (item.value == 1.1) {
html += `<br/>${item.seriesName}: ${0}次`
} else if (item.value == 1.3) {
html += `<br/>${item.seriesName}: ${1}次`
} else {
html += `<br/>${item.seriesName}: ${item.value}次`
}
})
return html
}
},
legend: {
data: ['暂降次数']
},
xAxis: {
name: '区域', // 给X轴加单位
data: echartsndArr
},
yAxis: {
name: '次数' // 给X轴加单位
},
options: {
series: [
{
barMinHeight: 5,
barMaxWidth: 30,
itemStyle: {
normal: {
//这里是颜色
color: function (params: any) {
if (params.data == 1.1) {
return '#B3B3B3'
} else {
return '#07CCCA '
}
}
}
},
name: '暂降次数',
type: 'bar',
data: echartsArr
}
]
}
}
}
// 电压等级
const Grade = (list: any) => {
let echartsndArr: string[] = []
let echartsArr: string[] = []
list.voltageLevelCalculation.forEach((item: any) => {
echartsndArr.push(item.voltageLevel)
if (item.frequency == 0) {
item.frequency = 1.1
} else if (item.frequency == 1) {
item.frequency = 1.3
}
echartsArr.push(item.frequency)
})
voltageStatistics.value = {
title: {
text: '电压等级'
},
tooltip: {
formatter: function (params: any) {
let html = '电压等级：' + params[0].name
params.forEach((item: any) => {
if (item.value == 1.1) {
html += `<br/>${item.seriesName}: ${0}次`
} else if (item.value == 1.3) {
html += `<br/>${item.seriesName}: ${1}次`
} else {
html += `<br/>${item.seriesName}: ${item.value}次`
}
})
return html
}
},
legend: {
data: ['暂降次数']
},
xAxis: {
name: '电压等级',
data: echartsndArr
},
yAxis: {
name: '次数' // 给X轴加单位
},
options: {
series: [
{
barMaxWidth: 30,
barMinHeight: 5,
itemStyle: {
normal: {
//这里是颜色
color: function (params: any) {
if (params.data == 1.1) {
return '#B3B3B3'
} else {
return '#07CCCA '
}
}
}
// color: echartsColor.FigureColor[0],
},
name: '暂降次数',
type: 'bar',
data: echartsArr
}
]
}
}
}
//时间
const Relation = (list: any, interval: number) => {
let echartsndArr: string[] = []
let echartsArr: string[] = []
let echartswArr: string[] = []
list.monthCalculation.forEach((item: any, i: number) => {
if (i != 0) {
item.month = item.month.slice(5)
} else if (i == 0) {
let date = item.month.slice(5)
// let t = item.month.slice(0, 4);
// item.month = date + "\n" + "(" + t + ")";
item.month = date
}
echartsndArr.push(item.month)
// if (item.linked == 0 || item.notAssociated == 0) {
// item.linked = 3.14159;
// item.notAssociated = 3.14159;
// }
if (item.linked == 0) {
item.linked = 1.1
} else if (item.linked == 1) {
item.linked = 1.3
}
echartsArr.push(item.linked)
if (item.notAssociated == 0) {
item.notAssociated = 1.1
} else if (item.notAssociated == 1) {
item.notAssociated = 1.3
}
echartswArr.push(item.notAssociated)
})
monthlyStatistics.value = {
title: {
text: '时间'
},
tooltip: {
formatter: function (params: any) {
let html = '时间：' + params[0].name
params.forEach((item: any) => {
if (item.value == 1.1) {
html += `<br/>${item.seriesName}: ${0}次`
} else if (item.value == 1.3) {
html += `<br/>${item.seriesName}: ${1}次`
} else {
html += `<br/>${item.seriesName}: ${item.value}次`
}
})
return html
}
},
legend: {
data: ['未关联暂降次数', '已关联处理事件']
},
color: ['#07CCCA', '#Ff6600'],
xAxis: {
name: '月份', // 给X轴加单位
data: echartsndArr
},
yAxis: {
name: '次数' // 给X轴加单位
},
options: {
series: [
{
name: '未关联暂降次数',
type: 'bar',
barMaxWidth: 30,
barMinHeight: 5,
data: echartswArr,
itemStyle: {
normal: {
label: {
// show: true, //数字开启显示
textStyle: {
//数值样式
color: '#fff',
fontSize: 14,
fontWeight: 600
}
},
color: function (params: any) {
if (params.data == 1.1) {
return '#B3B3B3'
} else {
return '#07CCCA '
}
}
}
}
},
{
name: '已关联处理事件',
type: 'bar',
barMaxWidth: 30,
data: echartsArr,
itemStyle: {
normal: {
label: {
// show: true, //数字开启显示
textStyle: {
//数值样式
color: '#fff',
fontSize: 14,
fontWeight: 600
}
},
color: function (params: any) {
if (params.data == 1.1) {
return '#B3B3B3'
} else {
return '#Ff6600'
}
}
}
}
}
]
}
}
}
// Processing()
defineExpose({ Processing, Grade, Relation })
const layout = mainHeight(150) as any
</script>
<style lang="scss" scoped>
.bars_w {
width: 100%;
height: calc(v-bind('layout.height') / 2);
}
.separate {
display: flex;
}
</style>