提交
This commit is contained in:
@@ -11,10 +11,10 @@ const chartRef = ref<HTMLDivElement>()
|
||||
const props = defineProps(['options'])
|
||||
let chart: echarts.ECharts | any = null
|
||||
const resizeHandler = () => {
|
||||
chart.getZr().painter.getViewportRoot().style.display = "none";
|
||||
chart.getZr().painter.getViewportRoot().style.display = 'none'
|
||||
requestAnimationFrame(() => {
|
||||
chart.resize()
|
||||
chart.getZr().painter.getViewportRoot().style.display = "";
|
||||
chart.getZr().painter.getViewportRoot().style.display = ''
|
||||
})
|
||||
}
|
||||
const initChart = () => {
|
||||
@@ -28,7 +28,7 @@ const initChart = () => {
|
||||
color: '#000',
|
||||
fontSize: 18
|
||||
},
|
||||
...props.options.title
|
||||
...(props.options.title || null)
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
@@ -116,7 +116,7 @@ const initChart = () => {
|
||||
opacity: 0.5
|
||||
}
|
||||
},
|
||||
...(props.options.yAxis || null),
|
||||
...(props.options.yAxis || null)
|
||||
}
|
||||
],
|
||||
dataZoom: [
|
||||
@@ -125,13 +125,15 @@ const initChart = () => {
|
||||
height: 13,
|
||||
start: 0,
|
||||
bottom: '20px',
|
||||
end: 100
|
||||
end: 100,
|
||||
...(props.options.dataZoom || null)
|
||||
},
|
||||
{
|
||||
start: 0,
|
||||
height: 13,
|
||||
bottom: '20px',
|
||||
end: 100
|
||||
end: 100,
|
||||
...(props.options.dataZoom|| null)
|
||||
}
|
||||
],
|
||||
color: [
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<component :is='config.layout.layoutMode'></component>
|
||||
<component :is="config.layout.layoutMode"></component>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
<script setup lang="ts">
|
||||
import { reactive } from 'vue'
|
||||
import { useConfig } from '@/stores/config'
|
||||
import { useNavTabs } from '@/stores/navTabs'
|
||||
@@ -58,226 +58,240 @@ const init = async () => {
|
||||
* 后台初始化请求，获取站点配置，动态路由等信息
|
||||
*/
|
||||
getRouteMenu().then((res: any) => {
|
||||
// const arr = [
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 0,
|
||||
// type: 'menu',
|
||||
// title: '控制台',
|
||||
// name: 'dashboard',
|
||||
// path: 'dashboard',
|
||||
// icon: 'fa fa-dashboard',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/dashboard/index.vue',
|
||||
// keepalive: 'dashboard',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// },
|
||||
// {
|
||||
// id: 3,
|
||||
// pid: 0,
|
||||
// type: 'menu',
|
||||
// title: '审计管理',
|
||||
// name: 'test',
|
||||
// path: 'test',
|
||||
// icon: 'el-icon-List',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/dashboard/test.vue',
|
||||
// keepalive: 'test',
|
||||
// extend: 'none',
|
||||
// children: [
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '审计列表',
|
||||
// name: 'comptroller/list',
|
||||
// path: 'comptroller/list',
|
||||
// icon: 'el-icon-List',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/comptroller/list.vue',
|
||||
// keepalive: 'auth/role',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// id: 3,
|
||||
// pid: 0,
|
||||
// type: 'menu_dir',
|
||||
// title: '电压暂降',
|
||||
// name: 'voltage/sags',
|
||||
// path: 'voltage/sags',
|
||||
// icon: 'el-icon-BellFilled',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// extend: 'none',
|
||||
// children: [
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu_dir',
|
||||
// title: '运行管理',
|
||||
// name: 'voltage/sags/operationsManagement',
|
||||
// path: 'voltage/sags/operationsManagement',
|
||||
// icon: 'fa-solid fa-bars-progress',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// extend: 'none',
|
||||
// children: [
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '终端运行管理',
|
||||
// name: 'voltage/sags/operationsManagement/index',
|
||||
// path: 'voltage/sags/operationsManagement/index',
|
||||
// icon: 'fa-solid fa-recycle',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/voltage/sags/operationsManagement/index.vue',
|
||||
// keepalive: 'voltage/sags/operationsManagement/index',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// },
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '终端运行统计',
|
||||
// name: 'voltage/sags/operationsManagement/statistics',
|
||||
// path: 'voltage/sags/operationsManagement/statistics',
|
||||
// icon: 'fa-solid fa-chart-column',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/voltage/sags/operationsManagement/statistics.vue',
|
||||
// keepalive: 'voltage/sags/operationsManagement/statistics',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// },
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '监测点台账信息',
|
||||
// name: 'voltage/sags/operationsManagement/point',
|
||||
// path: 'voltage/sags/operationsManagement/point',
|
||||
// icon: 'fa-brands fa-square-pinterest',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/voltage/sags/operationsManagement/point.vue',
|
||||
// keepalive: 'voltage/sags/operationsManagement/point',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// id: 2,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '区域',
|
||||
// name: 'Event-boot/Region/distribution',
|
||||
// path: 'Event-boot/Region/distribution',
|
||||
// icon: 'el-icon-Management',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/Event-boot/Region/distribution.vue',
|
||||
// keepalive: 'Event-boot/Region/distribution',
|
||||
// extend: 'none',
|
||||
// children: [
|
||||
// {
|
||||
// id: 2,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '区域概览',
|
||||
// name: 'Region/overview',
|
||||
// path: 'Region/overview',
|
||||
// icon: 'el-icon-Promotion',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/dashboard/index.vue',
|
||||
// keepalive: 'Region/overview',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// },
|
||||
// {
|
||||
// id: 1,
|
||||
// pid: 3,
|
||||
// type: 'menu',
|
||||
// title: '监测网分布',
|
||||
// name: 'Region/distribution',
|
||||
// path: 'Region/distribution',
|
||||
// icon: 'el-icon-Share',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/Event-boot/Region/distribution.vue',
|
||||
// keepalive: 'Region/distribution',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// id: 2,
|
||||
// pid: 0,
|
||||
// type: 'menu_dir',
|
||||
// title: '权限管理',
|
||||
// name: 'auth',
|
||||
// path: 'auth',
|
||||
// icon: 'fa-solid fa-layer-group',
|
||||
// menu_type: null,
|
||||
// url: '',
|
||||
// component: '',
|
||||
// keepalive: 0,
|
||||
// extend: 'none',
|
||||
// children: [
|
||||
// {
|
||||
// id: 3,
|
||||
// pid: 2,
|
||||
// type: 'menu',
|
||||
// title: '角色管理',
|
||||
// name: 'auth/role',
|
||||
// path: 'auth/role',
|
||||
// icon: 'el-icon-Avatar',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/auth/role/index.vue',
|
||||
// keepalive: 'auth/role',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// },
|
||||
// {
|
||||
// id: 13,
|
||||
// pid: 2,
|
||||
// type: 'menu',
|
||||
// title: '菜单规则管理',
|
||||
// name: 'auth/menu',
|
||||
// path: 'auth/menu',
|
||||
// icon: 'el-icon-Menu',
|
||||
// menu_type: 'tab',
|
||||
// url: '',
|
||||
// component: '/src/views/auth/menu/index.vue',
|
||||
// keepalive: 'auth/menu',
|
||||
// extend: 'none',
|
||||
// children: []
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
// ]
|
||||
const arr = [
|
||||
{
|
||||
id: 1,
|
||||
pid: 0,
|
||||
type: 'menu',
|
||||
title: '控制台',
|
||||
name: 'dashboard',
|
||||
path: 'dashboard',
|
||||
icon: 'fa fa-dashboard',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/Event-boot/Region/overview.vue',
|
||||
keepalive: 'dashboard',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
pid: 0,
|
||||
type: 'menu',
|
||||
title: '审计管理',
|
||||
name: 'test',
|
||||
path: 'test',
|
||||
icon: 'el-icon-List',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/dashboard/test.vue',
|
||||
keepalive: 'test',
|
||||
extend: 'none',
|
||||
children: [
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '审计列表',
|
||||
name: 'comptroller/list',
|
||||
path: 'comptroller/list',
|
||||
icon: 'el-icon-List',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/comptroller/list.vue',
|
||||
keepalive: 'auth/role',
|
||||
extend: 'none',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
pid: 0,
|
||||
type: 'menu_dir',
|
||||
title: '电压暂降',
|
||||
name: 'voltage/sags',
|
||||
path: 'voltage/sags',
|
||||
icon: 'el-icon-BellFilled',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
extend: 'none',
|
||||
children: [
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu_dir',
|
||||
title: '运行管理',
|
||||
name: 'voltage/sags/operationsManagement',
|
||||
path: 'voltage/sags/operationsManagement',
|
||||
icon: 'fa-solid fa-bars-progress',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
extend: 'none',
|
||||
children: [
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '终端运行管理',
|
||||
name: 'voltage/sags/operationsManagement/index',
|
||||
path: 'voltage/sags/operationsManagement/index',
|
||||
icon: 'fa-solid fa-recycle',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/voltage/sags/operationsManagement/index.vue',
|
||||
keepalive: 'voltage/sags/operationsManagement/index',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '终端运行统计',
|
||||
name: 'voltage/sags/operationsManagement/statistics',
|
||||
path: 'voltage/sags/operationsManagement/statistics',
|
||||
icon: 'fa-solid fa-chart-column',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/voltage/sags/operationsManagement/statistics.vue',
|
||||
keepalive: 'voltage/sags/operationsManagement/statistics',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '监测点台账信息',
|
||||
name: 'voltage/sags/operationsManagement/point',
|
||||
path: 'voltage/sags/operationsManagement/point',
|
||||
icon: 'fa-brands fa-square-pinterest',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/voltage/sags/operationsManagement/point.vue',
|
||||
keepalive: 'voltage/sags/operationsManagement/point',
|
||||
extend: 'none',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '区域',
|
||||
name: 'Event-boot/Region/distribution',
|
||||
path: 'Event-boot/Region/distribution',
|
||||
icon: 'el-icon-Management',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/Event-boot/Region/distribution.vue',
|
||||
keepalive: 'Event-boot/Region/distribution',
|
||||
extend: 'none',
|
||||
children: [
|
||||
{
|
||||
id: 2,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '区域概览',
|
||||
name: 'Region/overview',
|
||||
path: 'Region/overview',
|
||||
icon: 'el-icon-Promotion',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/Event-boot/Region/overview.vue',
|
||||
keepalive: 'Region/overview',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '区域统计',
|
||||
name: 'Region/statistics',
|
||||
path: 'Region/statistics',
|
||||
icon: 'el-icon-Promotion',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/Event-boot/Region/statistics.vue',
|
||||
keepalive: 'Region/statistics',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
pid: 3,
|
||||
type: 'menu',
|
||||
title: '监测网分布',
|
||||
name: 'Region/distribution',
|
||||
path: 'Region/distribution',
|
||||
icon: 'el-icon-Share',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/Event-boot/Region/distribution.vue',
|
||||
keepalive: 'Region/distribution',
|
||||
extend: 'none',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
pid: 0,
|
||||
type: 'menu_dir',
|
||||
title: '权限管理',
|
||||
name: 'auth',
|
||||
path: 'auth',
|
||||
icon: 'fa-solid fa-layer-group',
|
||||
menu_type: null,
|
||||
url: '',
|
||||
component: '',
|
||||
keepalive: 0,
|
||||
extend: 'none',
|
||||
children: [
|
||||
{
|
||||
id: 3,
|
||||
pid: 2,
|
||||
type: 'menu',
|
||||
title: '角色管理',
|
||||
name: 'auth/role',
|
||||
path: 'auth/role',
|
||||
icon: 'el-icon-Avatar',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/auth/role/index.vue',
|
||||
keepalive: 'auth/role',
|
||||
extend: 'none',
|
||||
children: []
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
pid: 2,
|
||||
type: 'menu',
|
||||
title: '菜单规则管理',
|
||||
name: 'auth/menu',
|
||||
path: 'auth/menu',
|
||||
icon: 'el-icon-Menu',
|
||||
menu_type: 'tab',
|
||||
url: '',
|
||||
component: '/src/views/auth/menu/index.vue',
|
||||
keepalive: 'auth/menu',
|
||||
extend: 'none',
|
||||
children: []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
const handlerMenu = (data: any) => {
|
||||
data.forEach((item: any) => {
|
||||
|
||||
item.path = item.routePath
|
||||
item.name = item.title
|
||||
item.component = item.routeName || '/src/views/dashboard/index.vue'
|
||||
item.component = item.routeName || '/src/views/Event-boot/Region/overview.vue'
|
||||
item.type = item.children && item.children.length > 0 ? 'menu_dir' : 'menu'
|
||||
item.menu_type = item.children && item.children.length > 0 ? null : 'tab'
|
||||
if (item.children) {
|
||||
@@ -287,8 +301,8 @@ const init = async () => {
|
||||
}
|
||||
handlerMenu(res.data)
|
||||
// handleAdminRoute(arr)
|
||||
handleAdminRoute(res.data)
|
||||
// handleAdminRoute([...arr, ...res.data])
|
||||
// handleAdminRoute(res.data)
|
||||
handleAdminRoute([...arr, ...res.data])
|
||||
|
||||
// 预跳转到上次路径
|
||||
if (route.params.to) {
|
||||
|
||||
144
src/views/Event-boot/Region/components/TypeStatistics.vue
Normal file
144
src/views/Event-boot/Region/components/TypeStatistics.vue
Normal file
@@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<span style="color: red; font-size: 12px">注:暂降类型仅统计暂降原因为短路故障事件</span>
|
||||
|
||||
<div class="statistics-main">
|
||||
<template v-if="flag">
|
||||
<div>
|
||||
<my-echart :options="descent" />
|
||||
</div>
|
||||
<div>
|
||||
<vxe-table height="auto" auto-resize :data="descentData" v-bind="defaultAttribute">
|
||||
<vxe-column field="name" title="暂降原因"></vxe-column>
|
||||
<vxe-column field="value" title="暂降次数"></vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
<div>
|
||||
<my-echart :options="resemble" />
|
||||
</div>
|
||||
<div>
|
||||
<vxe-table height="auto" auto-resize :data="resembleData" v-bind="defaultAttribute">
|
||||
<vxe-column field="name" title="暂降原因"></vxe-column>
|
||||
<vxe-column field="value" title="暂降次数"></vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
const descent = ref({})
|
||||
const descentData = ref([])
|
||||
const resemble = ref({})
|
||||
const resembleData = ref([])
|
||||
const flag = ref(true)
|
||||
|
||||
const info = (res: any) => {
|
||||
flag.value = false
|
||||
descentData.value = res.reason
|
||||
resembleData.value = res.type
|
||||
|
||||
descent.value = {
|
||||
title: {
|
||||
text: '暂降原因'
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
orient: 'vertical',
|
||||
left: 10,
|
||||
top: '5%',
|
||||
tooltip: {
|
||||
show: true
|
||||
}
|
||||
},
|
||||
xAxis: {
|
||||
show: false
|
||||
},
|
||||
yAxis: {
|
||||
show: false
|
||||
},
|
||||
dataZoom: { show: false },
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b} : {c} (次)'
|
||||
},
|
||||
options: {
|
||||
series: [
|
||||
{
|
||||
name: '暂降原因',
|
||||
type: 'pie',
|
||||
center: ['50%', '50%'],
|
||||
selectedOffset: 30,
|
||||
clockwise: true,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'outside',
|
||||
textStyle: {
|
||||
//数值样式
|
||||
}
|
||||
},
|
||||
|
||||
data: res.reason?.filter((item: any) => item.name != '总计')
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
resemble.value = {
|
||||
title: {
|
||||
text: '暂降类型'
|
||||
},
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
orient: 'vertical',
|
||||
left: 10,
|
||||
top: '5%'
|
||||
},
|
||||
tooltip: {
|
||||
formatter: '{a} <br/>{b} : {c} (次)',
|
||||
confine: true
|
||||
},
|
||||
xAxis: {
|
||||
show: false
|
||||
},
|
||||
yAxis: {
|
||||
show: false
|
||||
},
|
||||
dataZoom: { show: false },
|
||||
options: {
|
||||
series: [
|
||||
{
|
||||
name: '暂降类型',
|
||||
type: 'pie',
|
||||
center: ['50%', '50%'],
|
||||
selectedOffset: 30,
|
||||
clockwise: true,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'outside'
|
||||
},
|
||||
|
||||
data: res.type?.filter((item: any) => item.name != '总计')
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
flag.value = true
|
||||
}
|
||||
|
||||
defineExpose({ info })
|
||||
const layout = mainHeight(170) as any
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.statistics-main {
|
||||
box-sizing: border-box;
|
||||
height: v-bind('layout.height');
|
||||
padding: 0 10px 10px;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 600px;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
grid-gap: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -35,7 +35,6 @@ const Processing = (list: any) => {
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
// console.log(params);
|
||||
let html = '区域：' + params[0].name
|
||||
params.forEach((item: any) => {
|
||||
if (item.value == 1.1) {
|
||||
@@ -105,7 +104,6 @@ const Grade = (list: any) => {
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function (params: any) {
|
||||
// console.log(params);
|
||||
let html = '电压等级：' + params[0].name
|
||||
params.forEach((item: any) => {
|
||||
if (item.value == 1.1) {
|
||||
@@ -139,7 +137,6 @@ const Grade = (list: any) => {
|
||||
normal: {
|
||||
//这里是颜色
|
||||
color: function (params: any) {
|
||||
// console.log(params,'1111111111111111111111');
|
||||
if (params.data == 1.1) {
|
||||
return '#B3B3B3'
|
||||
} else {
|
||||
@@ -241,7 +238,6 @@ const Relation = (list: any, interval: number) => {
|
||||
}
|
||||
},
|
||||
color: function (params: any) {
|
||||
// console.log(params,'1111111111111111111111');
|
||||
if (params.data == 1.1) {
|
||||
return '#B3B3B3'
|
||||
} else {
|
||||
72
src/views/Event-boot/Region/overview.vue
Normal file
72
src/views/Event-boot/Region/overview.vue
Normal file
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader date-picker>
|
||||
<template v-slot:select>
|
||||
<el-form-item label="区域">
|
||||
<Area v-model="tableStore.table.params.deptIndex" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<el-tabs v-model="activeName" type="border-card" v-loading="tableStore.table.loading">
|
||||
<el-tab-pane label="图形" name="1">
|
||||
<Echart :list="list" ref="echarts" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="表格" name="2"><Tableabove ref="table" /></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import Area from '@/components/form/area/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import Echart from './components/echart.vue'
|
||||
import Tableabove from './components/Tableabove.vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { onMounted, reactive, ref, provide } from 'vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
defineOptions({
|
||||
name: 'Region/overview'
|
||||
})
|
||||
const activeName = ref('1')
|
||||
const list = ref([])
|
||||
const echarts = ref()
|
||||
const Picker = ref()
|
||||
const table = ref()
|
||||
const dictData = useDictData()
|
||||
|
||||
const tableStore = new TableStore({
|
||||
url: '/event-boot/areaStatistics/getAreaCalculation',
|
||||
method: 'POST',
|
||||
column: [],
|
||||
loadCallback: () => {
|
||||
list.value = tableStore.table.data
|
||||
echarts.value.Processing(tableStore.table.data.areaStatistics)
|
||||
echarts.value.Grade(tableStore.table.data.voltageStatistics)
|
||||
echarts.value.Relation(tableStore.table.data.monthlyStatistics)
|
||||
table.value.info(tableStore.table.data)
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||
tableStore.table.params.statisticalType = dictData.getBasicData('Statistical_Type', ['Load_Type'])[3]
|
||||
tableStore.table.params.monitorFlag = 2
|
||||
tableStore.table.params.powerFlag = 2
|
||||
tableStore.table.params.serverName = 'event-boot'
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
const layout = mainHeight(123) as any
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bars_w {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
::v-deep(.el-tabs__content) {
|
||||
height: v-bind('layout.height');
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
76
src/views/Event-boot/Region/statistics.vue
Normal file
76
src/views/Event-boot/Region/statistics.vue
Normal file
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader date-picker>
|
||||
<template v-slot:select>
|
||||
<el-form-item label="区域">
|
||||
<Area v-model="tableStore.table.params.deptIndex" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick" v-loading="tableStore.table.loading">
|
||||
<el-tab-pane label="暂降原因及类型统计" name="1">
|
||||
<TypeStatistics ref="Statistics" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="电压容忍度曲线兼容性统计" name="2"></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import Area from '@/components/form/area/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { onMounted, reactive, ref, provide } from 'vue'
|
||||
import TypeStatistics from './components/TypeStatistics.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
defineOptions({
|
||||
name: 'Region/overview'
|
||||
})
|
||||
const activeName = ref('1')
|
||||
const Statistics = ref()
|
||||
const flag = ref(true)
|
||||
const dictData = useDictData()
|
||||
|
||||
const tableStore = new TableStore({
|
||||
url: '/event-boot/areaAnalysis/getEventReason',
|
||||
method: 'POST',
|
||||
column: [],
|
||||
loadCallback: () => {
|
||||
if (activeName.value == '1') {
|
||||
Statistics.value.info(tableStore.table.data)
|
||||
} else {
|
||||
}
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||
tableStore.table.params.statisticalType = dictData.getBasicData('Statistical_Type', ['Load_Type'])[3]
|
||||
tableStore.table.params.monitorFlag = 2
|
||||
tableStore.table.params.powerFlag = 2
|
||||
tableStore.table.params.serverName = 'event-boot'
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
const handleClick = async () => {
|
||||
if (activeName.value == '1') {
|
||||
tableStore.url = '/event-boot/areaAnalysis/getEventReason'
|
||||
} else {
|
||||
tableStore.url = '/event-boot/areaAnalysis/getVoltageToleranceCurve'
|
||||
}
|
||||
await tableStore.onTableAction('search', {})
|
||||
}
|
||||
const layout = mainHeight(123) as any
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bars_w {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
}
|
||||
::v-deep(.el-tabs__content) {
|
||||
height: v-bind('layout.height');
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user