周报迁移 完成

This commit is contained in:
GGJ
2024-03-01 13:45:29 +08:00
parent 954cf1b923
commit d7e12dabaa
11 changed files with 613 additions and 45 deletions

View File

@@ -11,32 +11,46 @@ export function getEventReport(data) {
// 生成报告
export function getAreaReport(data) {
return createAxios({
url: "/event-boot/report/getAreaReport",
method: "post",
url: '/event-boot/report/getAreaReport',
method: 'post',
data,
responseType: "blob",
});
responseType: 'blob'
})
}
//查询所有模板
export function getList(data) {
return createAxios({
url: "/system-boot/EventTemplate/getList",
method: "post",
data,
});
url: '/system-boot/EventTemplate/getList',
method: 'post',
data
})
}
export function selectReleation(data) {
return createAxios({
url: "/system-boot/EventTemplate/selectReleation",
method: "post",
url: '/system-boot/EventTemplate/selectReleation',
method: 'post',
params: data
});
})
}
export function getLineExport(data) {
return createAxios({
url: "/event-boot/report/getLineExport",
method: "post",
url: '/event-boot/report/getLineExport',
method: 'post',
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
})
}

View File

@@ -98,6 +98,7 @@ import FieldRender from '@/components/table/fieldRender/index.vue'
import Column from '@/components/table/column/index.vue'
import { useConfig } from '@/stores/config'
import type TableStoreClass from '@/utils/tableStore'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const config = useConfig()
@@ -114,7 +115,7 @@ const props = withDefaults(defineProps<Props>(), {
onMounted(() => {
tableStore.table.ref = tableRef.value as VxeTableInstance
})
console.log(props)
// console.log(props)
const onTableSizeChange = (val: number) => {
tableStore.onTableAction('page-size-change', { size: val })
}

View File

@@ -66,7 +66,7 @@ const manufacturer = dictData.getBasicData('Dev_Manufacturers')
const manufacturerForm = ref<string[]>([])
const tableStore = new TableStore({
isWebPaging: true,
url: '/device-boot/runManage/getRuntimeData',
url: 'Operationmanagement/terminalmanagement',
method: 'POST',
column: [
{

View File

@@ -63,7 +63,7 @@ import { useDictData } from '@/stores/dictData'
import Area from '@/components/form/area/index.vue'
defineOptions({
name: 'voltage/sags/operationsManagement/point'
name: 'Operationmanagement/accountinformation'
})
const dictData = useDictData()
const interferenceSource = dictData.getBasicData('Interference_Source')

View File

@@ -102,7 +102,7 @@ import * as echarts from 'echarts/core'
import { defaultAttribute } from '@/components/table/defaultAttribute'
defineOptions({
name: 'voltage/sags/operationsManagement/statistics'
name: 'Operationmanagement/terminalstatistics'
})
const dictData = useDictData()
const areaStatistics = ref()

View File

@@ -1,11 +1,162 @@
<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>
<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>

View File

@@ -1,11 +0,0 @@
<template>
<div>概况 </div>
</template>
<script setup lang='ts'>
import { ref, reactive } from 'vue'
</script>
<style lang="scss" scoped>
</style>

View File

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

View File

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

View File

@@ -15,14 +15,17 @@ import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import { ref, onMounted, provide, nextTick } from 'vue'
import { useDictData } from '@/stores/dictData'
import createAxios from '@/utils/request'
import { requestPayload } from '@/utils/request'
interface Props {
info: any
}
const props = withDefaults(defineProps<Props>(), {})
const dictData = useDictData()
const tableRef = ref()
const tableStore = new TableStore({
url: props.info.url,
publicHeight: 60,
publicHeight: 62,
method: 'POST',
column: props.info.column,
@@ -44,5 +47,29 @@ nextTick(() => {
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>

View File

@@ -1,7 +1,16 @@
<template>
<div class="default-main">
<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 v-for="item in list" :label="item.name" :name="item.id" :key="item.id">
<Table :info="item"></Table>
@@ -13,14 +22,18 @@
import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
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 { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout'
defineOptions({
name: 'TransientReport/weekly'
})
const dictData = useDictData()
const height = mainHeight(80).height
const activeName = ref('1')
const activeName1 = ref('1')
const list = ref([
{
name: '暂态严重度统计',
@@ -191,3 +204,12 @@ onMounted(() => {
const handleClick = () => {}
</script>
<style lang="scss">
.el-tabs__content {
height: 100%;
.el-tab-pane {
height: 100%;
}
}
</style>