周报迁移 完成
This commit is contained in:
@@ -11,32 +11,46 @@ export function getEventReport(data) {
|
|||||||
// 生成报告
|
// 生成报告
|
||||||
export function getAreaReport(data) {
|
export function getAreaReport(data) {
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: "/event-boot/report/getAreaReport",
|
url: '/event-boot/report/getAreaReport',
|
||||||
method: "post",
|
method: 'post',
|
||||||
data,
|
data,
|
||||||
responseType: "blob",
|
responseType: 'blob'
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
//查询所有模板
|
//查询所有模板
|
||||||
export function getList(data) {
|
export function getList(data) {
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: "/system-boot/EventTemplate/getList",
|
url: '/system-boot/EventTemplate/getList',
|
||||||
method: "post",
|
method: 'post',
|
||||||
data,
|
data
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
export function selectReleation(data) {
|
export function selectReleation(data) {
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: "/system-boot/EventTemplate/selectReleation",
|
url: '/system-boot/EventTemplate/selectReleation',
|
||||||
method: "post",
|
method: 'post',
|
||||||
params:data
|
params: data
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
export function getLineExport(data) {
|
export function getLineExport(data) {
|
||||||
return createAxios({
|
return createAxios({
|
||||||
url: "/event-boot/report/getLineExport",
|
url: '/event-boot/report/getLineExport',
|
||||||
method: "post",
|
method: 'post',
|
||||||
data: data,
|
data: data,
|
||||||
responseType: 'blob',
|
responseType: 'blob'
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
|
export function getVoltage(data:any) {
|
||||||
|
return createAxios({
|
||||||
|
url: '/event-boot/report/getVoltage',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export function getGeneralSituation(data:any) {
|
||||||
|
return createAxios({
|
||||||
|
url: '/event-boot/report/getGeneralSituation',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -98,6 +98,7 @@ import FieldRender from '@/components/table/fieldRender/index.vue'
|
|||||||
import Column from '@/components/table/column/index.vue'
|
import Column from '@/components/table/column/index.vue'
|
||||||
import { useConfig } from '@/stores/config'
|
import { useConfig } from '@/stores/config'
|
||||||
import type TableStoreClass from '@/utils/tableStore'
|
import type TableStoreClass from '@/utils/tableStore'
|
||||||
|
|
||||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
|
|
||||||
const config = useConfig()
|
const config = useConfig()
|
||||||
@@ -114,7 +115,7 @@ const props = withDefaults(defineProps<Props>(), {
|
|||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
tableStore.table.ref = tableRef.value as VxeTableInstance
|
tableStore.table.ref = tableRef.value as VxeTableInstance
|
||||||
})
|
})
|
||||||
console.log(props)
|
// console.log(props)
|
||||||
const onTableSizeChange = (val: number) => {
|
const onTableSizeChange = (val: number) => {
|
||||||
tableStore.onTableAction('page-size-change', { size: val })
|
tableStore.onTableAction('page-size-change', { size: val })
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -66,7 +66,7 @@ const manufacturer = dictData.getBasicData('Dev_Manufacturers')
|
|||||||
const manufacturerForm = ref<string[]>([])
|
const manufacturerForm = ref<string[]>([])
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
isWebPaging: true,
|
isWebPaging: true,
|
||||||
url: '/device-boot/runManage/getRuntimeData',
|
url: 'Operationmanagement/terminalmanagement',
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
column: [
|
column: [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -63,7 +63,7 @@ import { useDictData } from '@/stores/dictData'
|
|||||||
import Area from '@/components/form/area/index.vue'
|
import Area from '@/components/form/area/index.vue'
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'voltage/sags/operationsManagement/point'
|
name: 'Operationmanagement/accountinformation'
|
||||||
})
|
})
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
const interferenceSource = dictData.getBasicData('Interference_Source')
|
const interferenceSource = dictData.getBasicData('Interference_Source')
|
||||||
|
|||||||
@@ -102,7 +102,7 @@ import * as echarts from 'echarts/core'
|
|||||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'voltage/sags/operationsManagement/statistics'
|
name: 'Operationmanagement/terminalstatistics'
|
||||||
})
|
})
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
const areaStatistics = ref()
|
const areaStatistics = ref()
|
||||||
|
|||||||
@@ -1,11 +1,162 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div>
|
||||||
<div>原因统计 </div>
|
<TableHeader date-picker>
|
||||||
|
<template #operation>
|
||||||
|
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">导出</el-button>
|
||||||
|
</template>
|
||||||
|
</TableHeader>
|
||||||
|
<!-- <Table isGroup ref="tableRef" /> -->
|
||||||
|
<vxe-table height="200" ref="tableRef" auto-resize :data="tableStore.table.data" v-bind="defaultAttribute">
|
||||||
|
<vxe-table-colgroup title="暂态原因统计表">
|
||||||
|
<vxe-table-column field="transientCause" title="暂态原因"></vxe-table-column>
|
||||||
|
<vxe-table-column field="fault" title="短路故障"></vxe-table-column>
|
||||||
|
<vxe-table-column field="excitation" title="变压器激磁"></vxe-table-column>
|
||||||
|
<vxe-table-column field="disturbance" title="电压扰动"></vxe-table-column>
|
||||||
|
<vxe-table-column field="largeInduction" title="大型感应电动机启动"></vxe-table-column>
|
||||||
|
<vxe-table-column field="other" title="其他"></vxe-table-column>
|
||||||
|
</vxe-table-colgroup>
|
||||||
|
</vxe-table>
|
||||||
|
<div :style="{ height: height }">
|
||||||
|
<my-echart :options="options" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang='ts'>
|
|
||||||
import { ref, reactive } from 'vue'
|
|
||||||
</script>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
|
|
||||||
</style>
|
<script setup lang="ts">
|
||||||
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
|
import TableStore from '@/utils/tableStore'
|
||||||
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
|
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||||
|
import { mainHeight } from '@/utils/layout'
|
||||||
|
import { useDictData } from '@/stores/dictData'
|
||||||
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
|
const dictData = useDictData()
|
||||||
|
const tableRef = ref()
|
||||||
|
const options = ref({})
|
||||||
|
const height = mainHeight(340).height
|
||||||
|
const tableStore = new TableStore({
|
||||||
|
url: '/event-boot/report/getReason',
|
||||||
|
publicHeight: 300,
|
||||||
|
showPage: false,
|
||||||
|
method: 'POST',
|
||||||
|
column: [],
|
||||||
|
loadCallback: () => {
|
||||||
|
let arr = [
|
||||||
|
{
|
||||||
|
transientCause: '次数',
|
||||||
|
fault: '',
|
||||||
|
excitation: '',
|
||||||
|
disturbance: '',
|
||||||
|
largeInduction: '',
|
||||||
|
other: ''
|
||||||
|
},
|
||||||
|
{
|
||||||
|
transientCause: '占比(%)',
|
||||||
|
fault: '',
|
||||||
|
excitation: '',
|
||||||
|
disturbance: '',
|
||||||
|
largeInduction: '',
|
||||||
|
other: ''
|
||||||
|
}
|
||||||
|
]
|
||||||
|
let pie: any = []
|
||||||
|
tableStore.table.data.forEach((item: any) => {
|
||||||
|
let obj = { value: item.times, name: item.reason, zb: item.rate - 0 }
|
||||||
|
pie.push(obj)
|
||||||
|
})
|
||||||
|
tableStore.table.data.forEach(item => {
|
||||||
|
if (item.reason == '电压扰动') {
|
||||||
|
arr[0].disturbance = item.times
|
||||||
|
arr[1].disturbance = item.rate
|
||||||
|
} else if (item.reason == '短路故障') {
|
||||||
|
arr[0].fault = item.times
|
||||||
|
arr[1].fault = item.rate
|
||||||
|
} else if (item.reason == '变压器激磁') {
|
||||||
|
arr[0].excitation = item.times
|
||||||
|
arr[1].excitation = item.rate
|
||||||
|
} else if (item.reason == '大型感应电动机启动') {
|
||||||
|
arr[0].largeInduction = item.times
|
||||||
|
arr[1].largeInduction = item.rate
|
||||||
|
} else if (item.reason == '其他') {
|
||||||
|
arr[0].other = item.times
|
||||||
|
arr[1].other = item.rate
|
||||||
|
}
|
||||||
|
})
|
||||||
|
tableStore.table.data = arr
|
||||||
|
options.value = {
|
||||||
|
title: {
|
||||||
|
text: '暂态原因统计',
|
||||||
|
top: '20'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
type: 'scroll',
|
||||||
|
orient: 'vertical',
|
||||||
|
left: 10,
|
||||||
|
top: '5%',
|
||||||
|
tooltip: {
|
||||||
|
show: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
dataZoom: { show: false },
|
||||||
|
tooltip: {
|
||||||
|
formatter: function (params) {
|
||||||
|
return `暂态原因统计: <br/>${params.data.name}:${params.data.value}次 <br/>占比:${params.data.zb}%`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '暂态原因统计',
|
||||||
|
type: 'pie',
|
||||||
|
radius: '60%',
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
emphasis: {
|
||||||
|
label: {
|
||||||
|
show: true,
|
||||||
|
fontSize: '12',
|
||||||
|
formatter: '{b}: {c} (次) 占比:{d}%'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: pie
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
tableStore.table.params.statisticalType = dictData.getBasicData('Statistical_Type', [
|
||||||
|
'Report_Type',
|
||||||
|
'Manufacturer',
|
||||||
|
'Voltage_Level',
|
||||||
|
'Load_Type'
|
||||||
|
])[0]
|
||||||
|
tableStore.table.params.deptIndex = dictData.state.area[0].id
|
||||||
|
tableStore.table.params.monitorFlag = 2
|
||||||
|
tableStore.table.params.powerFlag = 2
|
||||||
|
tableStore.table.params.serverName = 'event-boot'
|
||||||
|
tableStore.table.params.type = 0
|
||||||
|
provide('tableStore', tableStore)
|
||||||
|
nextTick(() => {
|
||||||
|
tableStore.index()
|
||||||
|
})
|
||||||
|
// 导出
|
||||||
|
const exportEvent = () => {
|
||||||
|
tableRef.value.exportData({
|
||||||
|
filename: '暂态原因统计', // 文件名字
|
||||||
|
sheetName: 'Sheet1',
|
||||||
|
type: 'xlsx', //导出文件类型 xlsx 和 csv
|
||||||
|
useStyle: true,
|
||||||
|
data: tableStore.table.data // 数据源 // 过滤那个字段导出
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|||||||
@@ -1,11 +0,0 @@
|
|||||||
<template>
|
|
||||||
|
|
||||||
<div>概况 </div>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
<script setup lang='ts'>
|
|
||||||
import { ref, reactive } from 'vue'
|
|
||||||
</script>
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@@ -0,0 +1,95 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-form :inline="true">
|
||||||
|
<el-form-item label="日期">
|
||||||
|
<DatePicker ref="datePickerRef"></DatePicker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="init">查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<div v-loading="loading" style="display: flex; overflow: hidden" :style="{ height: height }">
|
||||||
|
<vxe-table style="flex: 1" v-bind="defaultAttribute" height="100%" :data="region">
|
||||||
|
<vxe-table-colgroup title="暂态统计(按区域统计)">
|
||||||
|
<vxe-table-column field="name" title="区域"></vxe-table-column>
|
||||||
|
<vxe-table-colgroup title="监测点数量">
|
||||||
|
<vxe-table-column field="onLine" title="在线"></vxe-table-column>
|
||||||
|
<vxe-table-column field="offLine" title="离线"></vxe-table-column>
|
||||||
|
</vxe-table-colgroup>
|
||||||
|
<vxe-table-column field="sagsCount" title="暂降次数"></vxe-table-column>
|
||||||
|
<vxe-table-column field="breakCount" title="中断次数"></vxe-table-column>
|
||||||
|
<vxe-table-column field="upCount" title="暂升次数"></vxe-table-column>
|
||||||
|
</vxe-table-colgroup>
|
||||||
|
</vxe-table>
|
||||||
|
<vxe-table style="flex: 1" class="ml10" v-bind="defaultAttribute" height="100%" :data="voltage">
|
||||||
|
<vxe-table-colgroup title="暂态统计(按电压等级统计)">
|
||||||
|
<vxe-table-column field="name" title="电压等级"></vxe-table-column>
|
||||||
|
<vxe-table-colgroup title="监测点数量">
|
||||||
|
<vxe-table-column field="onLine" title="在线"></vxe-table-column>
|
||||||
|
<vxe-table-column field="offLine" title="离线"></vxe-table-column>
|
||||||
|
</vxe-table-colgroup>
|
||||||
|
<vxe-table-column field="sagsCount" title="暂降次数"></vxe-table-column>
|
||||||
|
<vxe-table-column field="breakCount" title="中断次数"></vxe-table-column>
|
||||||
|
<vxe-table-column field="upCount" title="暂升次数"></vxe-table-column>
|
||||||
|
</vxe-table-colgroup>
|
||||||
|
</vxe-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { useDictData } from '@/stores/dictData'
|
||||||
|
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||||
|
import { ref, reactive, onMounted, } from 'vue'
|
||||||
|
import { getVoltage, getGeneralSituation } from '@/api/event-boot/report'
|
||||||
|
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||||
|
import { mainHeight } from '@/utils/layout'
|
||||||
|
const dictData = useDictData()
|
||||||
|
const datePickerRef = ref()
|
||||||
|
const loading = ref(true)
|
||||||
|
const formData = reactive({
|
||||||
|
deptIndex: dictData.state.area[0].id,
|
||||||
|
monitorFlag: 2,
|
||||||
|
powerFlag: 2,
|
||||||
|
searchBeginTime: '',
|
||||||
|
searchEndTime: '',
|
||||||
|
serverName: 'event-boot'
|
||||||
|
})
|
||||||
|
const height = mainHeight(145).height
|
||||||
|
const region = ref([])
|
||||||
|
const voltage = ref([])
|
||||||
|
const init = () => {
|
||||||
|
loading.value = true
|
||||||
|
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||||
|
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||||
|
|
||||||
|
Promise.all([
|
||||||
|
getGeneralSituation({
|
||||||
|
...formData,
|
||||||
|
statisticalType: dictData.getBasicData('Statistical_Type', [
|
||||||
|
'Report_Type',
|
||||||
|
'Manufacturer',
|
||||||
|
|
||||||
|
'Voltage_Level',
|
||||||
|
'Load_Type'
|
||||||
|
])[0]
|
||||||
|
}),
|
||||||
|
getVoltage({
|
||||||
|
...formData,
|
||||||
|
statisticalType: dictData.getBasicData('Statistical_Type', [
|
||||||
|
'Report_Type',
|
||||||
|
'Power_Network',
|
||||||
|
'Manufacturer',
|
||||||
|
'Load_Type'
|
||||||
|
])[0]
|
||||||
|
})
|
||||||
|
]).then(res => {
|
||||||
|
loading.value = false
|
||||||
|
region.value = res[0].data
|
||||||
|
voltage.value = res[1].data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
init()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
@@ -0,0 +1,269 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-form :inline="true">
|
||||||
|
<el-form-item label="日期">
|
||||||
|
<DatePicker ref="datePickerRef"></DatePicker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="init">查询</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
<div v-loading="loading" :style="{ height: height }">
|
||||||
|
<div style="display: flex">
|
||||||
|
<my-echart class="bars_w" :options="options1" />
|
||||||
|
<my-echart class="bars_w" :options="options2" />
|
||||||
|
</div>
|
||||||
|
<div style="display: flex">
|
||||||
|
<my-echart class="bars_w" :options="options3" />
|
||||||
|
<my-echart class="bars_w" :options="options4" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { useDictData } from '@/stores/dictData'
|
||||||
|
import DatePicker from '@/components/form/datePicker/index.vue'
|
||||||
|
import { ref, reactive, onMounted } from 'vue'
|
||||||
|
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||||
|
import { getVoltage, getGeneralSituation } from '@/api/event-boot/report'
|
||||||
|
import { mainHeight } from '@/utils/layout'
|
||||||
|
const dictData = useDictData()
|
||||||
|
const datePickerRef = ref()
|
||||||
|
const loading = ref(true)
|
||||||
|
const formData = reactive({
|
||||||
|
deptIndex: dictData.state.area[0].id,
|
||||||
|
monitorFlag: 2,
|
||||||
|
powerFlag: 2,
|
||||||
|
searchBeginTime: '',
|
||||||
|
searchEndTime: '',
|
||||||
|
serverName: 'event-boot'
|
||||||
|
})
|
||||||
|
const height = mainHeight(145).height
|
||||||
|
const options1 = ref({})
|
||||||
|
const options2 = ref({})
|
||||||
|
const options3 = ref({})
|
||||||
|
const options4 = ref({})
|
||||||
|
|
||||||
|
const init = () => {
|
||||||
|
loading.value = true
|
||||||
|
formData.searchBeginTime = datePickerRef.value.timeValue[0]
|
||||||
|
formData.searchEndTime = datePickerRef.value.timeValue[1]
|
||||||
|
|
||||||
|
Promise.all([
|
||||||
|
getGeneralSituation({
|
||||||
|
...formData,
|
||||||
|
statisticalType: dictData.getBasicData('Statistical_Type', [
|
||||||
|
'Report_Type',
|
||||||
|
'Manufacturer',
|
||||||
|
|
||||||
|
'Voltage_Level',
|
||||||
|
'Load_Type'
|
||||||
|
])[0]
|
||||||
|
}),
|
||||||
|
getVoltage({
|
||||||
|
...formData,
|
||||||
|
statisticalType: dictData.getBasicData('Statistical_Type', [
|
||||||
|
'Report_Type',
|
||||||
|
'Power_Network',
|
||||||
|
'Manufacturer',
|
||||||
|
'Load_Type'
|
||||||
|
])[0]
|
||||||
|
})
|
||||||
|
]).then(res => {
|
||||||
|
// region.value = res[0].data
|
||||||
|
// voltage.value = res[1].data
|
||||||
|
|
||||||
|
let area = []
|
||||||
|
let onlineData = []
|
||||||
|
let offlineData = []
|
||||||
|
res[0].data.forEach(item => {
|
||||||
|
area.push(item.name)
|
||||||
|
onlineData.push(item.onLine)
|
||||||
|
offlineData.push(item.offLine)
|
||||||
|
})
|
||||||
|
options1.value = {
|
||||||
|
title: {
|
||||||
|
text: '设备运行情况',
|
||||||
|
subtext: '区域统计'
|
||||||
|
},
|
||||||
|
|
||||||
|
legend: {
|
||||||
|
data: ['在线', '离线']
|
||||||
|
},
|
||||||
|
|
||||||
|
xAxis: {
|
||||||
|
name: '(区域)',
|
||||||
|
data: res[0].data.map(item => item.name)
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: '次数' // 给X轴加单位
|
||||||
|
},
|
||||||
|
color: ['#07CCCA', '#FFBF00'],
|
||||||
|
options: {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '在线',
|
||||||
|
type: 'bar',
|
||||||
|
barMaxWidth: 20,
|
||||||
|
stack: 'account',
|
||||||
|
// color: 'green',
|
||||||
|
data: res[0].data.map(item => item.onLine)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '离线',
|
||||||
|
type: 'bar',
|
||||||
|
barMaxWidth: 20,
|
||||||
|
stack: 'account',
|
||||||
|
// color: 'orange',
|
||||||
|
data: res[0].data.map(item => item.offLine)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
options2.value = {
|
||||||
|
title: {
|
||||||
|
text: '设备运行情况',
|
||||||
|
subtext: '电压等级统计'
|
||||||
|
},
|
||||||
|
|
||||||
|
legend: {
|
||||||
|
data: ['在线', '离线']
|
||||||
|
},
|
||||||
|
|
||||||
|
xAxis: {
|
||||||
|
name: '电压\n等级',
|
||||||
|
data: res[1].data.map(item => item.name)
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: '次数' // 给X轴加单位
|
||||||
|
},
|
||||||
|
color: ['#07CCCA', '#FFBF00'],
|
||||||
|
options: {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '在线',
|
||||||
|
type: 'bar',
|
||||||
|
barMaxWidth: 20,
|
||||||
|
stack: 'account',
|
||||||
|
// color: 'green',
|
||||||
|
data: res[1].data.map(item => item.onLine)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '离线',
|
||||||
|
type: 'bar',
|
||||||
|
barMaxWidth: 20,
|
||||||
|
stack: 'account',
|
||||||
|
// color: 'orange',
|
||||||
|
data: res[1].data.map(item => item.offLine)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
options3.value = {
|
||||||
|
title: {
|
||||||
|
text: '暂态事件次数',
|
||||||
|
subtext: '区域统计'
|
||||||
|
},
|
||||||
|
|
||||||
|
legend: {
|
||||||
|
data: ['暂降次数', '中断次数', '暂升次数']
|
||||||
|
},
|
||||||
|
|
||||||
|
xAxis: {
|
||||||
|
name: '(区域)',
|
||||||
|
data: res[0].data.map(item => item.name)
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: '次数' // 给X轴加单位
|
||||||
|
},
|
||||||
|
color: ['#07CCCA', '#FFBF00', '#77DA63'],
|
||||||
|
options: {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '暂降次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[0].data.map(item => item.sagsCount)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '中断次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[0].data.map(item => item.breakCount)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '暂升次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[0].data.map(item => item.upCount)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
options4.value = {
|
||||||
|
title: {
|
||||||
|
text: '暂态事件次数',
|
||||||
|
subtext: '电压等级统计'
|
||||||
|
},
|
||||||
|
|
||||||
|
legend: {
|
||||||
|
data: ['暂降次数', '中断次数', '暂升次数']
|
||||||
|
},
|
||||||
|
color: ['#07CCCA', '#FFBF00', '#77DA63'],
|
||||||
|
xAxis: {
|
||||||
|
name: '电压\n等级',
|
||||||
|
data: res[1].data.map(item => item.name)
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
name: '次数'
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '暂降次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[1].data.map(item => item.sagsCount)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '中断次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[1].data.map(item => item.breakCount)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '暂升次数',
|
||||||
|
type: 'bar',
|
||||||
|
stack: 'account',
|
||||||
|
barWidth: 20,
|
||||||
|
|
||||||
|
data: res[1].data.map(item => item.upCount)
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
loading.value = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
init()
|
||||||
|
})
|
||||||
|
const layout = mainHeight(150) as any
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.bars_w {
|
||||||
|
width: 100%;
|
||||||
|
height: calc(v-bind('layout.height') / 2);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -13,16 +13,19 @@
|
|||||||
import TableHeader from '@/components/table/header/index.vue'
|
import TableHeader from '@/components/table/header/index.vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import Table from '@/components/table/index.vue'
|
import Table from '@/components/table/index.vue'
|
||||||
import { ref, onMounted, provide ,nextTick} from 'vue'
|
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||||
import { useDictData } from '@/stores/dictData'
|
import { useDictData } from '@/stores/dictData'
|
||||||
|
import createAxios from '@/utils/request'
|
||||||
|
import { requestPayload } from '@/utils/request'
|
||||||
interface Props {
|
interface Props {
|
||||||
info: any
|
info: any
|
||||||
}
|
}
|
||||||
const props = withDefaults(defineProps<Props>(), {})
|
const props = withDefaults(defineProps<Props>(), {})
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
|
const tableRef = ref()
|
||||||
const tableStore = new TableStore({
|
const tableStore = new TableStore({
|
||||||
url: props.info.url,
|
url: props.info.url,
|
||||||
publicHeight: 60,
|
publicHeight: 62,
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
column: props.info.column,
|
column: props.info.column,
|
||||||
|
|
||||||
@@ -44,5 +47,29 @@ nextTick(() => {
|
|||||||
tableStore.index()
|
tableStore.index()
|
||||||
})
|
})
|
||||||
// 导出
|
// 导出
|
||||||
const exportEvent = () => {}
|
const exportEvent = () => {
|
||||||
|
let form = JSON.parse(JSON.stringify(tableStore.table.params))
|
||||||
|
form.pageNum = 1
|
||||||
|
form.pageSize = tableStore.table.total
|
||||||
|
createAxios(
|
||||||
|
Object.assign(
|
||||||
|
{
|
||||||
|
url: props.info.url,
|
||||||
|
method: 'post'
|
||||||
|
},
|
||||||
|
requestPayload('POST', form)
|
||||||
|
)
|
||||||
|
).then(res => {
|
||||||
|
tableRef.value.getRef().exportData({
|
||||||
|
filename: props.info.name, // 文件名字
|
||||||
|
sheetName: 'Sheet1',
|
||||||
|
type: 'xlsx', //导出文件类型 xlsx 和 csv
|
||||||
|
useStyle: true,
|
||||||
|
data: res.data.records, // 数据源 // 过滤那个字段导出
|
||||||
|
columnFilterMethod: function (column: any) {
|
||||||
|
return !(column.$columnIndex === 0)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -1,7 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="default-main">
|
<div class="default-main">
|
||||||
<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
|
<el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
|
||||||
<el-tab-pane label="暂态总体概况" name="1"><Overview /></el-tab-pane>
|
<el-tab-pane label="暂态总体概况" name="1">
|
||||||
|
<el-tabs v-model="activeName1" tab-position="left" :style="{ height: height }" type="border-card">
|
||||||
|
<el-tab-pane label="表格" name="1">
|
||||||
|
<OverviewTab v-if="activeName1 == '1'" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="图形" name="2">
|
||||||
|
<OverviewTabEch v-if="activeName1 == '2'" />
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</el-tab-pane>
|
||||||
<el-tab-pane label="暂态原因统计" name="2"><CauseStatistics /></el-tab-pane>
|
<el-tab-pane label="暂态原因统计" name="2"><CauseStatistics /></el-tab-pane>
|
||||||
<el-tab-pane v-for="item in list" :label="item.name" :name="item.id" :key="item.id">
|
<el-tab-pane v-for="item in list" :label="item.name" :name="item.id" :key="item.id">
|
||||||
<Table :info="item"></Table>
|
<Table :info="item"></Table>
|
||||||
@@ -13,14 +22,18 @@
|
|||||||
import { ref, onMounted, provide } from 'vue'
|
import { ref, onMounted, provide } from 'vue'
|
||||||
import TableStore from '@/utils/tableStore'
|
import TableStore from '@/utils/tableStore'
|
||||||
import Table from './components/table.vue'
|
import Table from './components/table.vue'
|
||||||
import Overview from './components/overview.vue'
|
import OverviewTab from './components/overviewTab.vue'
|
||||||
|
import OverviewTabEch from './components/overviewTabEch.vue'
|
||||||
import CauseStatistics from './components/causeStatistics.vue'
|
import CauseStatistics from './components/causeStatistics.vue'
|
||||||
import { useDictData } from '@/stores/dictData'
|
import { useDictData } from '@/stores/dictData'
|
||||||
|
import { mainHeight } from '@/utils/layout'
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'TransientReport/weekly'
|
name: 'TransientReport/weekly'
|
||||||
})
|
})
|
||||||
const dictData = useDictData()
|
const dictData = useDictData()
|
||||||
|
const height = mainHeight(80).height
|
||||||
const activeName = ref('1')
|
const activeName = ref('1')
|
||||||
|
const activeName1 = ref('1')
|
||||||
const list = ref([
|
const list = ref([
|
||||||
{
|
{
|
||||||
name: '暂态严重度统计',
|
name: '暂态严重度统计',
|
||||||
@@ -191,3 +204,12 @@ onMounted(() => {
|
|||||||
|
|
||||||
const handleClick = () => {}
|
const handleClick = () => {}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.el-tabs__content {
|
||||||
|
height: 100%;
|
||||||
|
.el-tab-pane {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user