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-03 14:50:26 +08:00
parent 6e6717d23c
commit 956c235e82
4 changed files with 111 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/echarts/MyEchartMap.vue
View File

@@ -29,9 +29,8 @@ const GetEchar = async (name: string) => {
let chartDom = document.getElementById('chartMap')
myCharts.value?.dispose()
myCharts.value = echarts.init(chartDom)
if (name != '中国') {
showCircle.value = true
}
name == '中国' ? (showCircle.value = false) : (showCircle.value = true)
echarts.registerMap(name, await fetchConfig(name)) //注册可用的地图
let option = {
title: {
@@ -127,7 +126,7 @@ const GetEchar = async (name: string) => {
shadowOffsetY: 0,
borderWidth: 0
}
},
}
// regions: [
// {
// name: '南海诸岛',
@@ -161,11 +160,9 @@ const GetEchar = async (name: string) => {
}
const MapReturn = (name: string) => {
let area = dictData.state.area[0].children
let area = dictData.state.area?.[0]?.children ?? []
let list = {}
let flag = true
for (let i = 0; i < area.length; i++) {
if (area[i].name == name) {
console.log(11111)

29
src/views/Event-boot/Region/distribution.vue
View File

@@ -33,10 +33,12 @@
</el-col>
<el-col :span="12">
<my-echart class="tall" :options="echartList" />
<el-table class="tall" stripe :data="distributionData" border>
<el-table-column
prop="qy"
:label="
<div class="tall">
<vxe-table height="auto" auto-resize :data="distributionData" v-bind="defaultAttribute">
>
<vxe-column
field="qy"
:title="
titleA == '电压等级'
? '电压等级'
: titleA == '终端厂家'
@@ -47,13 +49,13 @@
? '区域'
: ''
"
align="center"
show-overflow-tooltip
></el-table-column>
<el-table-column prop="jcd" label="监测点数(个数)" align="center"></el-table-column>
<el-table-column prop="zc" label="通讯正常(个数)" sortable align="center"></el-table-column>
<el-table-column prop="zd" label="通讯中断(个数)" sortable align="center"></el-table-column>
</el-table>
></vxe-column>
<vxe-column field="jcd" title="监测点数(个数)"></vxe-column>
<vxe-column field="zc" title="通讯正常(个数)" sortable></vxe-column>
<vxe-column field="zd" title="通讯中断(个数)" sortable></vxe-column>
</vxe-table>
</div>
</el-col>
</el-row>
</div>
@@ -63,6 +65,7 @@
import Area from '@/components/form/area/index.vue'
import { getAreaLineDetail } from '@/api/Region'
import { useDictData } from '@/stores/dictData'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import MyEchartMap from '@/components/echarts/MyEchartMap.vue'
import MyEchart from '@/components/echarts/MyEchart.vue'
import { ref, reactive, onMounted, provide } from 'vue'
@@ -247,7 +250,7 @@ const histogram = (res: any) => {
: '' // 给X轴加单位
},
tooltip: {
formatter: function (params) {
formatter: function (params: any) {
// console.log(params);
var tips = ''
for (var i = 0; i < params.length; i++) {
@@ -269,7 +272,7 @@ const histogram = (res: any) => {
: titleA.value == '电网拓扑'
? '(区域)'
: '', // 给X轴加单位
data: distributionData.value.map(item => item.qy)
data: distributionData.value.map((item: any) => item.qy)
},
yAxis: {
name: '监测点数（个）' // 给X轴加单位
@@ -279,7 +282,7 @@ const histogram = (res: any) => {
{
// name: '暂降次数',
type: 'bar',
data: distributionData.value.map(item => item.jcd),
data: distributionData.value.map((item: any) => item.jcd),
barMaxWidth: 30,
itemStyle: {
normal: {

76
src/views/dashboard/components/Tableabove.vue
View File

@@ -5,59 +5,51 @@
</span>
<el-tabs tab-position="left" class="demo-tabs" style="margin-top: 10px">
<el-tab-pane label="区域">
<el-table :data="areaData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<template v-for="item in tableHeaderAera">
<el-table-column
align="center"
:prop="item.prop"
:label="item.label"
<div class="default-main">
<vxe-table :data="areaData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column
v-for="item in tableHeaderAera"
:field="item.prop"
:title="item.label"
:min-width="item.width"
:sortable="item.sortable"
></el-table-column>
</template>
</el-table>
:formatter="formatter"
></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
<el-tab-pane label="电压等级">
<el-table :data="levelData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<template v-for="item in tableHeaderLevel">
<el-table-column
align="center"
:prop="item.prop"
:label="item.label"
<div class="default-main">
<vxe-table :data="levelData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column
v-for="item in tableHeaderLevel"
:field="item.prop"
:title="item.label"
:min-width="item.width"
:sortable="item.sortable"
></el-table-column>
</template>
</el-table>
></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
<el-tab-pane label="月份">
<el-table :data="shareData" border height="calc(100vh - 220px)" stripe style="width: 100%">
<el-table-column
prop="month"
label="月份"
align="center"
min-width="120px"
sortable
></el-table-column>
<el-table-column prop="notAssociated" align="center" label="电压暂降次数" sortable>
<!-- <template slot-scope="scope">
<span v-if="scope.row.month != '总计'">
{{ scope.row.linked + scope.row.notAssociated }}
</span>
<span v-else>{{ scope.row.notAssociated }}</span>
</template> -->
</el-table-column>
</el-table>
<div class="default-main">
<vxe-table :data="shareData" v-bind="defaultAttribute" height="auto" auto-resize>
<vxe-column field="month" title="月份" min-width="120px" sortable></vxe-column>
<vxe-column field="notAssociated" title="电压暂降次数" sortable></vxe-column>
</vxe-table>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, defineExpose } from 'vue'
const tableData = ref<any[]>([])
import { ref, reactive, defineExpose, computed } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const areaData = ref<any[]>([])
const levelData = ref<any[]>([])
const shareData = ref<any[]>([])
const tableHeaderAera = ref<any[]>([
{ prop: 'areaName', label: '区域名称', width: '120px' },
{ prop: 'monitoringPoints', label: '监测点数', sortable: true },
@@ -104,10 +96,20 @@ const info = (list: any) => {
...list.monthlyStatistics.monthCalculation
]
}
const formatter = (row: any) => {
if (row.column.field == 'areaName') {
return (row.cellValue = row.cellValue.replace('\n', ''))
} else {
return row.cellValue
}
}
defineExpose({ info })
</script>
<style lang="scss" scoped>
::v-deep(.el-tabs--left) {
height: calc(100vh - 220px);
}
.default-main {
height: calc(100vh - 220px);
}
</style>

54
src/views/voltage/sags/operationsManagement/statistics.vue
View File

@@ -120,31 +120,11 @@ const tableStore = new TableStore({
text: '区域'
},
xAxis: {
type: 'category',
data: tableStore.table.data.area.areaInfo.map(
(item: any) => item.areaName + `(${item.numberOfTerminals})`
)
},
yAxis: {
type: 'value'
},
options: {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
formatter: function (params) {
var tips = ''
tips += params[0].name + '</br/>'
@@ -158,10 +138,14 @@ const tableStore = new TableStore({
return tips
}
},
yAxis: { name: '%' },
options: {
series: [
{
stack: 'one',
name: '投运',
barMaxWidth: 30,
barMinHeight: 5,
data: tableStore.table.data.area.areaInfo.map((item: any) => item.normalRate),
itemStyle: {
normal: {
@@ -189,6 +173,8 @@ const tableStore = new TableStore({
{
name: '热备用',
stack: 'one',
barMaxWidth: 30,
barMinHeight: 5,
data: tableStore.table.data.area.areaInfo.map((item: any) => item.shutdownRate),
type: 'bar',
itemStyle: {
@@ -216,6 +202,8 @@ const tableStore = new TableStore({
{
name: '在线率',
stack: 'two',
barMaxWidth: 30,
barMinHeight: 5,
data: tableStore.table.data.area.areaInfo.map((item: any) => item.onlineRate),
itemStyle: {
normal: {
@@ -265,31 +253,14 @@ const tableStore = new TableStore({
text: '终端厂家'
},
xAxis: {
type: 'category',
data: tableStore.table.data.factory.areaInfo.map(
(item: any) => item.areaName + `(${item.numberOfTerminals})`
)
},
yAxis: {
type: 'value'
name: '%'
},
options: {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
formatter: function (params: any) {
var tips = ''
tips += params[0].name + '</br/>'
@@ -303,9 +274,12 @@ const tableStore = new TableStore({
return tips
}
},
options: {
series: [
{
stack: 'one',
barMaxWidth: 30,
barMinHeight: 5,
name: '投运',
data: tableStore.table.data.factory.areaInfo.map((item: any) => item.normalRate),
itemStyle: {
@@ -334,6 +308,8 @@ const tableStore = new TableStore({
{
name: '热备用',
stack: 'one',
barMaxWidth: 30,
barMinHeight: 5,
data: tableStore.table.data.factory.areaInfo.map((item: any) => item.shutdownRate),
type: 'bar',
itemStyle: {
@@ -361,6 +337,8 @@ const tableStore = new TableStore({
{
name: '在线率',
stack: 'two',
barMaxWidth: 30,
barMinHeight: 5,
data: tableStore.table.data.factory.areaInfo.map((item: any) => item.onlineRate),
itemStyle: {
normal: {