修改 电网一张图bug 技术监督新增 重新发起页面绘制
This commit is contained in:
@@ -4,32 +4,143 @@
|
||||
<div>
|
||||
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="300px" :data="tableData">
|
||||
<vxe-column field="deptName" title="地市" />
|
||||
<vxe-column field="assessData" title="综合评估得分" :formatter="formatter" />
|
||||
<vxe-column field="qualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-column field="assessLevel" title="综合评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.assessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.assessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.assessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.assessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="qualifyData" title="指标合格率(%)" />
|
||||
|
||||
<vxe-colgroup title="电压偏差">
|
||||
<vxe-column field="vdevAssessData" title="评估得分" :formatter="formatter" />
|
||||
<vxe-column field="vdevQualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-column field="vdevAssessLevel" title="评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.vdevAssessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.vdevAssessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.vdevAssessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.vdevAssessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="vdevQualifyData" title="指标合格率(%)" />
|
||||
</vxe-colgroup>
|
||||
<vxe-colgroup title="频率偏差">
|
||||
<vxe-column field="freqAssessData" title="评估得分" :formatter="formatter" />
|
||||
<vxe-column field="freqQualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-column field="freqAssessLevel" title="评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.freqAssessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.freqAssessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.freqAssessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.freqAssessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="freqQualifyData" title="指标合格率(%)" />
|
||||
</vxe-colgroup>
|
||||
<vxe-colgroup title="电压总谐波畸变率" >
|
||||
<vxe-column field="harmAssessData" title="评估得分" :formatter="formatter" />
|
||||
<vxe-column field="harmQualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-colgroup title="电压总谐波畸变率">
|
||||
<vxe-column field="harmAssessLevel" title="评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.harmAssessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.harmAssessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.harmAssessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.harmAssessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="harmQualifyData" title="指标合格率(%)" />
|
||||
</vxe-colgroup>
|
||||
<vxe-colgroup title="电压闪变">
|
||||
<vxe-column field="flickerAssessData" title="评估得分" :formatter="formatter" />
|
||||
<vxe-column field="flickerQualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-column field="flickerAssessLevel" title="评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.flickerAssessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.flickerAssessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.flickerAssessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.flickerAssessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="flickerQualifyData" title="指标合格率(%)" />
|
||||
</vxe-colgroup>
|
||||
<vxe-colgroup title="三相电压不平衡度">
|
||||
<vxe-column field="unbalanceAssessData" title="评估得分" :formatter="formatter" />
|
||||
<vxe-column field="unbalanceQualifyData" title="指标合格率(%)" :formatter="formatter" />
|
||||
<vxe-column field="unbalanceAssessLevel" title="评估结论">
|
||||
<template #default="scope">
|
||||
<span
|
||||
class="conclusion"
|
||||
:class="
|
||||
scope.row.unbalanceAssessLevel == '特质'
|
||||
? 'background1'
|
||||
: scope.row.unbalanceAssessLevel == '较差'
|
||||
? 'background2'
|
||||
: scope.row.unbalanceAssessLevel == '极差'
|
||||
? 'background3'
|
||||
: ''
|
||||
"
|
||||
>
|
||||
{{ scope.row.unbalanceAssessLevel }}
|
||||
</span>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="unbalanceQualifyData" title="指标合格率(%)" />
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
</div>
|
||||
<div style="height: 300px; margin-top: 10px">
|
||||
<div style="height: 300px; margin-top: 10px; position: relative" v-loading="loading">
|
||||
<el-select
|
||||
v-model="time"
|
||||
size="small"
|
||||
style="width: 50px; position: absolute; top: 20px; right: 20px; z-index: 1"
|
||||
@change="analysis"
|
||||
>
|
||||
<el-option label="年" value="1" />
|
||||
<el-option label="月" value="3" />
|
||||
</el-select>
|
||||
<MyEChart style="height: 300px" :options="picEChart" />
|
||||
</div>
|
||||
</el-dialog>
|
||||
@@ -40,7 +151,9 @@ import MyEChart from '@/components/echarts/MyEchart.vue'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import { getAssessDetail, getAssessTrend } from '@/api/device-boot/panorama'
|
||||
const dialogVisible: any = ref(false)
|
||||
|
||||
const rowList: any = ref({})
|
||||
const time = ref('1')
|
||||
const loading = ref(false)
|
||||
const tableData: any = ref([])
|
||||
|
||||
const picEChart = ref()
|
||||
@@ -48,7 +161,14 @@ const open = async (row: any) => {
|
||||
getAssessDetail(row).then(res => {
|
||||
tableData.value = res.data
|
||||
})
|
||||
getAssessTrend(row).then(res => {
|
||||
rowList.value = row
|
||||
analysis(1)
|
||||
dialogVisible.value = true
|
||||
}
|
||||
const analysis = (e: any) => {
|
||||
loading.value = true
|
||||
let time = rowList.value.searchBeginTime.slice(0, 4) + `-01-01`
|
||||
getAssessTrend({ ...rowList.value, searchBeginTime: time, type: e }).then(res => {
|
||||
picEChart.value = {
|
||||
title: {
|
||||
text: '各地市综合评估趋势对比'
|
||||
@@ -57,9 +177,11 @@ const open = async (row: any) => {
|
||||
name: '时间',
|
||||
data: res.data[0].children.map((item: any) => item.dataTime)
|
||||
},
|
||||
|
||||
grid: {
|
||||
bottom: '10px'
|
||||
},
|
||||
|
||||
yAxis: {
|
||||
name: ''
|
||||
},
|
||||
@@ -85,16 +207,8 @@ const open = async (row: any) => {
|
||||
data: item
|
||||
})
|
||||
})
|
||||
loading.value = false
|
||||
})
|
||||
|
||||
dialogVisible.value = true
|
||||
}
|
||||
const formatter = (row: any) => {
|
||||
if (row.cellValue == 3.14159) {
|
||||
return '/'
|
||||
} else {
|
||||
return row.cellValue
|
||||
}
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
@@ -103,4 +217,27 @@ defineExpose({ open })
|
||||
:deep(.el-dialog__body) {
|
||||
max-height: none !important;
|
||||
}
|
||||
.conclusion {
|
||||
display: inline-block;
|
||||
padding: 0 10px;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
|
||||
border-radius: 4px;
|
||||
}
|
||||
.background1 {
|
||||
background-color: #339966;
|
||||
color: #fff;
|
||||
}
|
||||
.background2 {
|
||||
background-color: #97017e;
|
||||
color: #fff;
|
||||
}
|
||||
.background3 {
|
||||
background-color: #cc0000;
|
||||
color: #fff;
|
||||
}
|
||||
:deep(.el-select) {
|
||||
min-width: 80px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user