联调数据清洗页面 绘制终端运行评价页面
This commit is contained in:
@@ -20,9 +20,108 @@
|
||||
</template>
|
||||
|
||||
<template v-slot:operation>
|
||||
<el-button type="primary" class="ml10" @click="toggle" :icon="leftVisible ? 'el-icon-Hide' : 'el-icon-View'">
|
||||
<el-button
|
||||
type="primary"
|
||||
class="ml10"
|
||||
@click="toggle"
|
||||
:icon="leftVisible ? 'el-icon-Hide' : 'el-icon-View'"
|
||||
>
|
||||
{{ leftVisible ? '隐藏' : '显示' }}
|
||||
</el-button>
|
||||
|
||||
<el-tooltip placement="left-start">
|
||||
<InfoFilled style="height: 20px" class="ml10" />
|
||||
<!-- <el-button circle icon="el-icon-InfoFilled" /> -->
|
||||
<template #content>
|
||||
<div style="font-size: 16px " class="mt10 mb10">
|
||||
<div>终端在线率</div>
|
||||
<div class="em1">定义:终端在指定时间段内处于在线状态的时间比例。</div>
|
||||
<div class="em1">计算方法:在线率=终端在线时间/总监测时间×100%</div>
|
||||
<div class="em1">评价标准:</div>
|
||||
<div class="em2">
|
||||
<span style="color: #00b07d">优秀</span>
|
||||
在线率 ≥ 95%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #2b7fd3">良好</span>
|
||||
90% ≤ 在线率 < 95
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #ffcc33">一般</span>
|
||||
80% ≤ 在线率 < 90%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #97017e">较差</span>
|
||||
在线率 < 80%
|
||||
</div>
|
||||
|
||||
<div class="mt10">数据完整性</div>
|
||||
<div class="em1">定义:终端上传数据的完整性和连续性</div>
|
||||
<div class="em1">计算方法:数据完整性=实际上传数据量/预期上传数据量×100%</div>
|
||||
<div class="em1">评价标准:</div>
|
||||
<div class="em2">
|
||||
<span style="color: #00b07d">优秀</span>
|
||||
完整性 ≥ 98%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #2b7fd3">良好</span>
|
||||
95% ≤ 完整性 < 98%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #ffcc33">一般</span>
|
||||
90% ≤ 完整性 < 95%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #97017e">较差</span>
|
||||
完整性 < 90%
|
||||
</div>
|
||||
|
||||
<div class="mt10">数据合格率</div>
|
||||
<div class="em1">定义:终端上传数据的合格率(以谐波电压为代表)。</div>
|
||||
<div class="em1">计算方法:合格率=合格数据量/总数据量×100%</div>
|
||||
<div class="em1">评价标准:</div>
|
||||
<div class="em2">
|
||||
<span style="color: #00b07d">优秀</span>
|
||||
完整性 ≥ 98%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #2b7fd3">良好</span>
|
||||
95% ≤ 完整性 < 98%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #ffcc33">一般</span>
|
||||
90% ≤ 完整性 < 95%
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #97017e">较差</span>
|
||||
完整性 < 90%
|
||||
</div>
|
||||
<div class="mt10">综合评价方法</div>
|
||||
<div class="em1">权重分配:根据各维度的重要性,分配不同的权重。例如:</div>
|
||||
<div class="em2">终端在线率:20%</div>
|
||||
<div class="em2">数据完整性:50%</div>
|
||||
<div class="em2">数据合格率:30%</div>
|
||||
<div class="em1">综合评分:综合评分=∑(单项评分x权重)</div>
|
||||
<div class="em1">评价等级:</div>
|
||||
<div class="em2">
|
||||
<span style="color: #00b07d">优秀</span>
|
||||
综合评分 ≥ 90
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #2b7fd3">良好</span>
|
||||
80 ≤ 综合评分 < 90
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #ffcc33">一般</span>
|
||||
70 ≤ 综合评分 < 80
|
||||
</div>
|
||||
<div class="em2">
|
||||
<span style="color: #97017e">较差</span>
|
||||
综合评分 < 70
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Map />
|
||||
@@ -30,6 +129,7 @@
|
||||
<transition name="slide-left">
|
||||
<div class="left" :style="height" v-if="leftVisible">
|
||||
<BorderBox13
|
||||
style="height: 200px"
|
||||
:color="[color[0], color[0]]"
|
||||
class="box"
|
||||
:backgroundColor="`${color[0]}24`"
|
||||
@@ -39,10 +139,12 @@
|
||||
<span class="iconfont icon-zhongduantongji-xian"></span>
|
||||
终端统计
|
||||
</div>
|
||||
<statistics />
|
||||
</BorderBox13>
|
||||
<BorderBox13
|
||||
:color="[color[0], color[0]]"
|
||||
class="box"
|
||||
style="flex: 1"
|
||||
:backgroundColor="`${color[0]}24`"
|
||||
title="终端运行评价"
|
||||
>
|
||||
@@ -50,8 +152,10 @@
|
||||
<span class="iconfont icon-daipingjia"></span>
|
||||
终端运行评价
|
||||
</div>
|
||||
<run />
|
||||
</BorderBox13>
|
||||
<BorderBox13
|
||||
:style="height3"
|
||||
:color="[color[0], color[0]]"
|
||||
class="box"
|
||||
:backgroundColor="`${color[0]}24`"
|
||||
@@ -61,6 +165,7 @@
|
||||
<span class="iconfont icon-a-qushi1"></span>
|
||||
最近一周终端评价趋势
|
||||
</div>
|
||||
<week />
|
||||
</BorderBox13>
|
||||
</div>
|
||||
</transition>
|
||||
@@ -77,18 +182,23 @@
|
||||
<span class="iconfont icon-a-ziyuan118"></span>
|
||||
区域终端运行评价
|
||||
</div>
|
||||
<region />
|
||||
</BorderBox13>
|
||||
<BorderBox13
|
||||
:color="[color[0], color[0]]"
|
||||
class="box"
|
||||
:backgroundColor="`${color[0]}24`"
|
||||
title="终端运行评价详情"
|
||||
>
|
||||
<div class="title">
|
||||
<span class="iconfont icon-yunhangxiangqing"></span>
|
||||
终端运行评价详情
|
||||
</div>
|
||||
</BorderBox13>
|
||||
<div :style="height3">
|
||||
<BorderBox13
|
||||
style="height: 100%"
|
||||
:color="[color[0], color[0]]"
|
||||
class="box"
|
||||
:backgroundColor="`${color[0]}24`"
|
||||
title="终端运行评价详情"
|
||||
>
|
||||
<div class="title">
|
||||
<span class="iconfont icon-yunhangxiangqing"></span>
|
||||
终端运行评价详情
|
||||
</div>
|
||||
<terminalOperation />
|
||||
</BorderBox13>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
@@ -104,6 +214,8 @@
|
||||
<span class="iconfont icon-yichangxiangqing-xian"></span>
|
||||
异常终端详情
|
||||
</div>
|
||||
<terminalDetails />
|
||||
<table />
|
||||
</BorderBox13>
|
||||
</div>
|
||||
</transition>
|
||||
@@ -118,6 +230,13 @@ import { mainHeight } from '@/utils/layout'
|
||||
import Map from './components/map.vue'
|
||||
import { BorderBox13 } from '@kjgl77/datav-vue3'
|
||||
import { useConfig } from '@/stores/config'
|
||||
import terminalOperation from './components/terminalOperation.vue'
|
||||
import region from './components/region.vue'
|
||||
import { InfoFilled } from '@element-plus/icons-vue'
|
||||
import week from './components/week.vue'
|
||||
import terminalDetails from './components/terminalDetails.vue'
|
||||
import statistics from './components/statistics.vue'
|
||||
import run from './components/run.vue'
|
||||
const config = useConfig()
|
||||
const color = config.layout.elementUiPrimary
|
||||
const dictData = useDictData()
|
||||
@@ -257,4 +376,12 @@ onMounted(() => {
|
||||
transform: translateY(100%);
|
||||
opacity: 0;
|
||||
}
|
||||
.em1 {
|
||||
margin-top: 5px;
|
||||
text-indent: 1em;
|
||||
}
|
||||
.em2 {
|
||||
margin-top: 5px;
|
||||
text-indent: 2em;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user