修改角色管理页面
This commit is contained in:
@@ -144,7 +144,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'frequencyBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'frequencyDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -173,7 +181,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'voltageBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'voltageDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -200,9 +216,18 @@ const tableStore = new TableStore({
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
field: 'harmonicVoltageBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'harmonicVoltageDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -231,7 +256,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'harmonicCurrentBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'harmonicCurrentDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -260,7 +293,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'threePhaseVoltageBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'threePhaseVoltageDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -289,7 +330,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'flickerBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'flickerDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -318,7 +367,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'negativeBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'negativeDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
@@ -347,7 +404,15 @@ const tableStore = new TableStore({
|
||||
},
|
||||
{
|
||||
field: 'interHarmonicBiLi',
|
||||
title: '超标占比(%)',
|
||||
title: '累计占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'interHarmonicDayAvgBiLi',
|
||||
title: '日均占比(%)',
|
||||
minWidth: '100px',
|
||||
formatter: (row: any) => {
|
||||
return row.cellValue == -1 ? '/' : row.cellValue
|
||||
|
||||
108
src/views/pqs/harmonicMonitoring/reportForms/region/index.vue
Normal file
108
src/views/pqs/harmonicMonitoring/reportForms/region/index.vue
Normal file
@@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<div class="default-main" :style="height">
|
||||
<splitpanes style="height: 100%" class="default-theme" id="navigation-splitpanes">
|
||||
<pane :size="size">
|
||||
<PointTree
|
||||
:default-expand-all="false"
|
||||
@node-click="handleNodeClick"
|
||||
@init="handleNodeClick"
|
||||
></PointTree>
|
||||
</pane>
|
||||
<pane style="background: #fff" :style="height">
|
||||
<TableHeader ref="TableHeaderRef" datePicker :show-search="false">
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">生成</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div class="box">
|
||||
<div id="luckysheet">
|
||||
<img
|
||||
width="100%"
|
||||
:style="`height: calc(${tableStore.table.height} + 40px)`"
|
||||
src="@/assets/img/region.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</pane>
|
||||
</splitpanes>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, provide } from 'vue'
|
||||
import 'splitpanes/dist/splitpanes.css'
|
||||
import { Splitpanes, Pane } from 'splitpanes'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import PointTree from '@/components/tree/pqs/areaTree.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { areaHarmonicReport } from '@/api/process-boot/reportForms'
|
||||
import { genFileId, ElMessage, ElNotification } from 'element-plus'
|
||||
import type { UploadProps, UploadUserFile } from 'element-plus'
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
defineOptions({
|
||||
name: 'harmonic-boot/region/word'
|
||||
})
|
||||
const height = mainHeight(20)
|
||||
const size = ref(19)
|
||||
const dictData = useDictData()
|
||||
const TableHeaderRef = ref()
|
||||
const dotList: any = ref({})
|
||||
const Template: any = ref({})
|
||||
|
||||
const tableStore = new TableStore({
|
||||
url: '',
|
||||
method: 'POST',
|
||||
column: [],
|
||||
beforeSearchFun: () => {},
|
||||
loadCallback: () => {}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
onMounted(() => {
|
||||
const dom = document.getElementById('navigation-splitpanes')
|
||||
|
||||
if (dom) {
|
||||
size.value = Math.round((180 / dom.offsetHeight) * 120)
|
||||
}
|
||||
})
|
||||
|
||||
const handleNodeClick = (data: any, node: any) => {
|
||||
dotList.value = data
|
||||
}
|
||||
|
||||
// 生成
|
||||
const exportEvent = () => {
|
||||
ElMessage('生成报告中...')
|
||||
areaHarmonicReport({
|
||||
deptId: dotList.value.id,
|
||||
areaReportFlag: 1,
|
||||
startTime: TableHeaderRef.value.datePickerRef.timeValue[0],
|
||||
endTime: TableHeaderRef.value.datePickerRef.timeValue[1]
|
||||
}).then((res: any) => {
|
||||
let blob = new Blob([res], {
|
||||
type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8'
|
||||
})
|
||||
|
||||
// createObjectURL(blob); //创建下载的链接
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
link.download = dotList.value.name + '区域稳态报告' + dayjs().format('YYYYMMDD') // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.splitpanes.default-theme .splitpanes__pane {
|
||||
background: #eaeef1;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -72,7 +72,7 @@ import { mainHeight } from '@/utils/layout'
|
||||
import { exportModel } from '@/api/process-boot/reportForms'
|
||||
import { genFileId, ElMessage, ElNotification } from 'element-plus'
|
||||
import type { UploadProps, UploadUserFile } from 'element-plus'
|
||||
|
||||
import dayjs from 'dayjs'
|
||||
defineOptions({
|
||||
// name: 'harmonic-boot/report/word'
|
||||
})
|
||||
@@ -152,7 +152,7 @@ const exportEvent = () => {
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
link.download = dotList.value.name // 设置下载的文件名
|
||||
link.download = dotList.value.name+ dayjs().format('YYYYMMDD') // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link)
|
||||
|
||||
@@ -73,7 +73,6 @@ import Outcome from './outcome.vue'
|
||||
import { exportResult, downloadAssessTemplate, assessResult, userGetInfo } from '@/api/advance-boot/assess'
|
||||
import { Loading } from '@element-plus/icons-vue'
|
||||
import AssessTemplate from './assessTemplate.vue'
|
||||
import { fa, tr } from 'element-plus/es/locale'
|
||||
|
||||
defineOptions({
|
||||
// name: 'harmonic-boot/report/word'
|
||||
|
||||
@@ -140,6 +140,7 @@ import { mainHeight } from '@/utils/layout'
|
||||
import { getLineExport, getList, selectReleation } from '@/api/event-boot/report'
|
||||
import { useMonitoringPoint } from '@/stores/monitoringPoint'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import dayjs from 'dayjs'
|
||||
defineOptions({
|
||||
name: 'TransientReport/monitoringpointReport'
|
||||
})
|
||||
@@ -257,7 +258,7 @@ const exportEvent = () => {
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
link.download = '监测点报告' // 设置下载的文件名
|
||||
link.download = dotList.value.name+'监测点报告'+ dayjs().format('YYYYMMDD') // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link)
|
||||
|
||||
@@ -1,298 +1,333 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<TableHeader ref="TableHeaderRef" date-picker area :show-search="false">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="报告类型">
|
||||
<el-select v-model="tableStore.table.params.waveType" placeholder="请选择" clearable>
|
||||
<el-option
|
||||
v-for="item in waveTypeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label=" 模板策略">
|
||||
<el-select v-model="value" placeholder="请选择" @change="changeFn" clearable>
|
||||
<el-option
|
||||
v-for="item in templatePolicy"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</template>
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">生成报告</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div class="box" :style="`height: calc(${tableStore.table.height} + 45px)`">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">监测网分布</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.monitorDistributeChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降事件统计</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventCountTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventCountChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降密度</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.densityTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.densityChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降事件点</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.itic">ITIC</el-checkbox>
|
||||
<el-checkbox v-model="formInline.f47">F47</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">概率分布</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.sagAmplitude">暂降幅值</el-checkbox>
|
||||
<el-checkbox v-model="formInline.duration">持续时间</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">事件关联统计</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventRelevanceCountTable">表格</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降原因</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventReasonTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventReasonChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降类型</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventTypeTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventTypeChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降热力图</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.thermodynamicChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="tsx">
|
||||
import { ref, onMounted, provide, reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { getAreaReport, getList, selectReleation } from '@/api/event-boot/report'
|
||||
import { ElMessage } from 'element-plus'
|
||||
defineOptions({
|
||||
name: 'TransientReport/regionalreports'
|
||||
})
|
||||
const dictData = useDictData()
|
||||
const waveTypeList = ref([
|
||||
{
|
||||
value: 0,
|
||||
label: '暂态'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
label: '暂降'
|
||||
}
|
||||
])
|
||||
const templatePolicy: any = ref([])
|
||||
const value = ref<string>('')
|
||||
const tableStore = new TableStore({
|
||||
url: '',
|
||||
method: 'post',
|
||||
column: []
|
||||
})
|
||||
const formInline: any = ref({
|
||||
monitorDistributeChart: false,
|
||||
eventCountTable: false,
|
||||
eventCountChart: false,
|
||||
densityTable: false,
|
||||
densityChart: false,
|
||||
itic: false,
|
||||
f47: false,
|
||||
sagAmplitude: false,
|
||||
duration: false,
|
||||
eventRelevanceCountTable: false,
|
||||
eventReasonTable: false,
|
||||
eventReasonChart: false,
|
||||
eventTypeTable: false,
|
||||
eventTypeChart: false,
|
||||
thermodynamicChart: false
|
||||
})
|
||||
tableStore.table.params.waveType = 0
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
onMounted(() => {
|
||||
// tableStore.index()
|
||||
})
|
||||
const TableHeaderRef = ref()
|
||||
getList({
|
||||
pageNum: 1,
|
||||
pageSize: 100,
|
||||
type: 1
|
||||
}).then(res => {
|
||||
templatePolicy.value = res.data.records
|
||||
// 默认选中第一个
|
||||
if (res.data.records && res.data.records.length > 0) {
|
||||
value.value = res.data.records[0].id
|
||||
// 触发 change 事件,加载对应的配置
|
||||
changeFn(res.data.records[0].id)
|
||||
}
|
||||
})
|
||||
// 模板策略变化
|
||||
const changeFn = (val: any) => {
|
||||
formInline.value = {
|
||||
monitorDistributeChart: false,
|
||||
eventCountTable: false,
|
||||
eventCountChart: false,
|
||||
densityTable: false,
|
||||
densityChart: false,
|
||||
itic: false,
|
||||
f47: false,
|
||||
sagAmplitude: false,
|
||||
duration: false,
|
||||
eventRelevanceCountTable: false,
|
||||
eventReasonTable: false,
|
||||
eventReasonChart: false,
|
||||
eventTypeTable: false,
|
||||
eventTypeChart: false,
|
||||
thermodynamicChart: false
|
||||
}
|
||||
let data = {
|
||||
id: val
|
||||
}
|
||||
|
||||
selectReleation(data).then(res => {
|
||||
res.data.forEach((item: any) => {
|
||||
for (let k in formInline.value) {
|
||||
if (item.name == k) {
|
||||
formInline.value[k] = true
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
const exportEvent = () => {
|
||||
formInline.value.statisticalType = dictData.getBasicData('Statistical_Type', [
|
||||
'Report_Type',
|
||||
'Manufacturer',
|
||||
'Voltage_Level',
|
||||
'Load_Type'
|
||||
])[0]
|
||||
formInline.value.monitorFlag = 2
|
||||
formInline.value.powerFlag = 2
|
||||
formInline.value.searchBeginTime = TableHeaderRef.value.datePickerRef.timeValue[0]
|
||||
formInline.value.searchEndTime = TableHeaderRef.value.datePickerRef.timeValue[1]
|
||||
formInline.value.deptIndex = tableStore.table.params.deptIndex
|
||||
formInline.value.monitorFlag = 2
|
||||
formInline.value.powerFlag = 2
|
||||
formInline.value.waveType = tableStore.table.params.waveType
|
||||
formInline.value.interval = tableStore.table.params.timeFlag
|
||||
ElMessage('生成报告中,请稍等!')
|
||||
getAreaReport(formInline.value).then((res: any) => {
|
||||
let blob = new Blob([res], {
|
||||
type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8'
|
||||
})
|
||||
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
// link.download = "电压暂降事件分析报告"; // 设置下载的文件名
|
||||
link.download = '区域报告' // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-select-dropdown__item.selected {
|
||||
font-weight: normal;
|
||||
}
|
||||
.grid-content {
|
||||
text-align: center;
|
||||
}
|
||||
.divBox {
|
||||
width: 250px;
|
||||
height: 31px;
|
||||
margin: auto;
|
||||
line-height: 32px;
|
||||
border: 1px solid #c9c9c9;
|
||||
&:hover {
|
||||
border: 1px solid #002255;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
overflow-y: auto;
|
||||
|
||||
border: 1px solid var(--el-border-color);
|
||||
}
|
||||
.el-divider--horizontal {
|
||||
margin: 10px 0;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<div class="default-main" :style="height">
|
||||
<splitpanes style="height: 100%" class="default-theme" id="navigation-splitpanes">
|
||||
<pane :size="size">
|
||||
<PointTree
|
||||
:default-expand-all="false"
|
||||
@node-click="handleNodeClick"
|
||||
@init="handleNodeClick"
|
||||
></PointTree>
|
||||
</pane>
|
||||
<pane style="background: #fff" :style="height">
|
||||
<TableHeader ref="TableHeaderRef" date-picker :show-search="false">
|
||||
<template v-slot:select>
|
||||
<el-form-item label="报告类型">
|
||||
<el-select v-model="tableStore.table.params.waveType" placeholder="请选择" clearable>
|
||||
<el-option
|
||||
v-for="item in waveTypeList"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label=" 模板策略">
|
||||
<el-select v-model="value" placeholder="请选择" @change="changeFn" clearable>
|
||||
<el-option
|
||||
v-for="item in templatePolicy"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
</template>
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Download" type="primary" @click="exportEvent">生成报告</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<div class="box" :style="`height: calc(${tableStore.table.height} + 45px)`">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">监测网分布</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.monitorDistributeChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降事件统计</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventCountTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventCountChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降密度</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.densityTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.densityChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降事件点</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.itic">ITIC</el-checkbox>
|
||||
<el-checkbox v-model="formInline.f47">F47</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">概率分布</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.sagAmplitude">暂降幅值</el-checkbox>
|
||||
<el-checkbox v-model="formInline.duration">持续时间</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">事件关联统计</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventRelevanceCountTable">表格</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降原因</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventReasonTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventReasonChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降类型</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.eventTypeTable">表格</el-checkbox>
|
||||
<el-checkbox v-model="formInline.eventTypeChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-content">
|
||||
<div class="divBox">暂降热力图</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-checkbox v-model="formInline.thermodynamicChart">图形</el-checkbox>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-divider></el-divider>
|
||||
</div>
|
||||
</pane>
|
||||
</splitpanes>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="tsx">
|
||||
import { ref, onMounted, provide, reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import 'splitpanes/dist/splitpanes.css'
|
||||
import { Splitpanes, Pane } from 'splitpanes'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { getAreaReport, getList, selectReleation } from '@/api/event-boot/report'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import PointTree from '@/components/tree/pqs/areaTree.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import dayjs from 'dayjs'
|
||||
defineOptions({
|
||||
name: 'TransientReport/regionalreports'
|
||||
})
|
||||
const height = mainHeight(20)
|
||||
const size = ref(19)
|
||||
const dotList:any = ref({})
|
||||
const dictData = useDictData()
|
||||
const waveTypeList = ref([
|
||||
{
|
||||
value: 0,
|
||||
label: '暂态'
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
label: '暂降'
|
||||
}
|
||||
])
|
||||
|
||||
const templatePolicy: any = ref([])
|
||||
const value = ref<string>('')
|
||||
const tableStore = new TableStore({
|
||||
url: '',
|
||||
method: 'post',
|
||||
column: []
|
||||
})
|
||||
const formInline: any = ref({
|
||||
monitorDistributeChart: false,
|
||||
eventCountTable: false,
|
||||
eventCountChart: false,
|
||||
densityTable: false,
|
||||
densityChart: false,
|
||||
itic: false,
|
||||
f47: false,
|
||||
sagAmplitude: false,
|
||||
duration: false,
|
||||
eventRelevanceCountTable: false,
|
||||
eventReasonTable: false,
|
||||
eventReasonChart: false,
|
||||
eventTypeTable: false,
|
||||
eventTypeChart: false,
|
||||
thermodynamicChart: false
|
||||
})
|
||||
tableStore.table.params.waveType = 0
|
||||
provide('tableStore', tableStore)
|
||||
|
||||
onMounted(() => {
|
||||
const dom = document.getElementById('navigation-splitpanes')
|
||||
|
||||
if (dom) {
|
||||
size.value = Math.round((180 / dom.offsetHeight) * 120)
|
||||
}
|
||||
// tableStore.index()
|
||||
})
|
||||
const handleNodeClick = (data: any, node: any) => {
|
||||
dotList.value = data
|
||||
}
|
||||
const TableHeaderRef = ref()
|
||||
getList({
|
||||
pageNum: 1,
|
||||
pageSize: 100,
|
||||
type: 1
|
||||
}).then(res => {
|
||||
templatePolicy.value = res.data.records
|
||||
// 默认选中第一个
|
||||
if (res.data.records && res.data.records.length > 0) {
|
||||
value.value = res.data.records[0].id
|
||||
// 触发 change 事件,加载对应的配置
|
||||
changeFn(res.data.records[0].id)
|
||||
}
|
||||
})
|
||||
// 模板策略变化
|
||||
const changeFn = (val: any) => {
|
||||
formInline.value = {
|
||||
monitorDistributeChart: false,
|
||||
eventCountTable: false,
|
||||
eventCountChart: false,
|
||||
densityTable: false,
|
||||
densityChart: false,
|
||||
itic: false,
|
||||
f47: false,
|
||||
sagAmplitude: false,
|
||||
duration: false,
|
||||
eventRelevanceCountTable: false,
|
||||
eventReasonTable: false,
|
||||
eventReasonChart: false,
|
||||
eventTypeTable: false,
|
||||
eventTypeChart: false,
|
||||
thermodynamicChart: false
|
||||
}
|
||||
let data = {
|
||||
id: val
|
||||
}
|
||||
|
||||
selectReleation(data).then(res => {
|
||||
res.data.forEach((item: any) => {
|
||||
for (let k in formInline.value) {
|
||||
if (item.name == k) {
|
||||
formInline.value[k] = true
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
const exportEvent = () => {
|
||||
formInline.value.statisticalType = dictData.getBasicData('Statistical_Type', [
|
||||
'Report_Type',
|
||||
'Manufacturer',
|
||||
'Voltage_Level',
|
||||
'Load_Type'
|
||||
])[0]
|
||||
formInline.value.monitorFlag = 2
|
||||
formInline.value.powerFlag = 2
|
||||
formInline.value.searchBeginTime = TableHeaderRef.value.datePickerRef.timeValue[0]
|
||||
formInline.value.searchEndTime = TableHeaderRef.value.datePickerRef.timeValue[1]
|
||||
formInline.value.deptIndex = dotList.value.id
|
||||
formInline.value.monitorFlag = 2
|
||||
formInline.value.powerFlag = 2
|
||||
formInline.value.waveType = tableStore.table.params.waveType
|
||||
formInline.value.interval = tableStore.table.params.timeFlag
|
||||
ElMessage('生成报告中,请稍等!')
|
||||
getAreaReport(formInline.value).then((res: any) => {
|
||||
let blob = new Blob([res], {
|
||||
type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=UTF-8'
|
||||
})
|
||||
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a') // 创建a标签
|
||||
link.href = url
|
||||
// link.download = "电压暂降事件分析报告"; // 设置下载的文件名
|
||||
link.download = dotList.value.name +'区域报告' + dayjs().format('YYYYMMDD') // 设置下载的文件名
|
||||
document.body.appendChild(link)
|
||||
link.click() //执行下载
|
||||
document.body.removeChild(link)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-select-dropdown__item.selected {
|
||||
font-weight: normal;
|
||||
}
|
||||
.grid-content {
|
||||
text-align: center;
|
||||
}
|
||||
.divBox {
|
||||
width: 250px;
|
||||
height: 31px;
|
||||
margin: auto;
|
||||
line-height: 32px;
|
||||
border: 1px solid #c9c9c9;
|
||||
&:hover {
|
||||
border: 1px solid #002255;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
overflow-y: auto;
|
||||
|
||||
border: 1px solid var(--el-border-color);
|
||||
}
|
||||
.el-divider--horizontal {
|
||||
margin: 10px 0;
|
||||
}
|
||||
.splitpanes.default-theme .splitpanes__pane {
|
||||
background: #eaeef1;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user