修改 终端运行评价

This commit is contained in:
GGJ
2025-05-21 10:12:46 +08:00
parent 2ef0f92743
commit 12f5d105fe
12 changed files with 364 additions and 135 deletions

View File

@@ -57,7 +57,7 @@ const open = async (data: any) => {
} }
const query = () => { const query = () => {
val.value += 1 val.value += 1
if (val.value == 6) { if (val.value == 7) {
clearInterval(time.value) clearInterval(time.value)
time.value = null time.value = null
val.value = 0 val.value = 0
@@ -67,16 +67,16 @@ const query = () => {
item.text = '推送超时!' item.text = '推送超时!'
} }
}) })
} } else {
List.value.forEach(async (item: any) => {
List.value.forEach(async (item: any) => { getPushResult({
getPushResult({ guid: item.guid
guid: item.guid }).then((res: any) => {
}).then((res: any) => { item.result = res.data.code
item.result = res.data.code item.text = res.data.result
item.text = res.data.result })
}) })
}) }
} }
defineExpose({ open }) defineExpose({ open })

View File

@@ -225,7 +225,7 @@ const inputQuery: any = ref('')
const QueryList: any = ref([]) const QueryList: any = ref([])
const activeName: any = ref(0) const activeName: any = ref(0)
const zoomMap = ref(9.8) const zoomMap = ref(8.9)
const colorKey = ref('') const colorKey = ref('')
const showCollapse: any = ref(true) const showCollapse: any = ref(true)
const showWrap: any = ref(false) const showWrap: any = ref(false)
@@ -341,7 +341,7 @@ const polyline = ref<any>([])
const lineId = ref('') const lineId = ref('')
const center = ref({ const center = ref({
lng: 122.42588, lng: 122.42588,
lat: 41.210977 lat: 40.810977
}) })
const infoWindowPoint = ref<anyObj>({ const infoWindowPoint = ref<anyObj>({
lng: 0, lng: 0,

View File

@@ -144,7 +144,7 @@
strokeColor="#0e8780" strokeColor="#0e8780"
:strokeOpacity="1" :strokeOpacity="1"
:fillColor="item.background || ''" :fillColor="item.background || ''"
:fillOpacity="0.5" :fillOpacity="0.6"
></bm-polygon> ></bm-polygon>
</div> </div>
</div> </div>
@@ -211,6 +211,12 @@ import { getAssessOverview } from '@/api/device-boot/panorama'
import { getRunEvaluate } from '@/api/device-boot/runEvaluate' import { getRunEvaluate } from '@/api/device-boot/runEvaluate'
import { getGridDiagramAreaData } from '@/api/device-boot/panorama' import { getGridDiagramAreaData } from '@/api/device-boot/panorama'
const emit = defineEmits(['changeValue', 'drop', 'show']) const emit = defineEmits(['changeValue', 'drop', 'show'])
const props = defineProps({
params: {
type: Object,
default: () => {}
}
})
import mapJson from '@/views/pqs/panorama/components/boundary' import mapJson from '@/views/pqs/panorama/components/boundary'
const datePickerRef = ref() const datePickerRef = ref()
const height = mainHeight(90) const height = mainHeight(90)
@@ -219,8 +225,7 @@ const dictData = useDictData()
const inputQuery: any = ref('') const inputQuery: any = ref('')
const QueryList: any = ref([]) const QueryList: any = ref([])
const activeName: any = ref(0) const activeName: any = ref(0)
const zoomMap = ref(8.9)
const zoomMap = ref(9.8)
const colorKey = ref('') const colorKey = ref('')
const showCollapse: any = ref(true) const showCollapse: any = ref(true)
const showWrap: any = ref(false) const showWrap: any = ref(false)
@@ -311,7 +316,7 @@ const polyline = ref<any>([])
const lineId = ref('') const lineId = ref('')
const center = ref({ const center = ref({
lng: 122.42588, lng: 122.42588,
lat: 41.210977 lat: 40.810977
}) })
const infoWindowPoint = ref<anyObj>({ const infoWindowPoint = ref<anyObj>({
lng: 0, lng: 0,
@@ -323,7 +328,7 @@ const initMap = async ({ BMap, map }: any) => {}
// 加载点 // 加载点
const addMarkers = async (row?: any, key?: any, num?: any) => { const addMarkers = async (row?: any, key?: any, num?: any) => {
let params = { let params = {
deptIndex: deptIndex.value, deptIndex: props.params.deptIndex,
monitorFlag: 2, monitorFlag: 2,
powerFlag: 2, powerFlag: 2,
searchBeginTime: datePickerRef.value.timeValue[0], searchBeginTime: datePickerRef.value.timeValue[0],
@@ -487,7 +492,7 @@ const grids = (row: any) => {
AreaData.value = [] AreaData.value = []
// 综合评估 // 综合评估
getRunEvaluate({ ...row, deptIndex: deptIndex.value }).then((res: any) => { getRunEvaluate({ ...row, deptIndex: props.params.deptIndex }).then((res: any) => {
console.log('🚀 ~ getRunEvaluate ~ res:', res) console.log('🚀 ~ getRunEvaluate ~ res:', res)
AreaData.value = res.data AreaData.value = res.data
GridDiagramArea() GridDiagramArea()
@@ -500,35 +505,19 @@ const radiusPop = (k: any) => {
} }
const GridDiagramArea = () => { const GridDiagramArea = () => {
boundaryList.value.forEach((item: any) => { boundaryList.value.forEach((item: any) => {
// assessList.value.forEach((y: any) => {
// if (item.orgName == y.name) {
// if (y.score == 3.14159) {
// } else if (y.score > 4.5) {
// item.background = '#33996699'
// } else if (y.score > 4) {
// item.background = '#3399ff99'
// } else if (y.score > 3) {
// item.background = '#ffcc3399'
// } else if (y.score > 2) {
// item.background = '#db088799'
// } else if (y.score > 0) {
// item.background = '#ff000099'
// }
// }
// })
AreaData.value.forEach((k: any, i: any) => { AreaData.value.forEach((k: any, i: any) => {
if (item.orgName == k.name) { if (item.orgName == k.name) {
for (let kk in item) { for (let kk in item) {
k[kk] = item[kk] k[kk] = item[kk]
} }
if (k.evaluate >= 90) { if (k.evaluate >= 90) {
k.background = '#0fff04' k.background = '#00b07d'
} else if (k.evaluate >= 80) { } else if (k.evaluate >= 80) {
k.background = '#2b7fd3' k.background = '#2b7fd3'
} else if (k.evaluate >= 70) { } else if (k.evaluate >= 70) {
k.background = '#ffcc33' k.background = '#ff8c00'
} else { } else {
k.background = '#97017e' k.background = '#c00'
} }
} }
}) })

View File

@@ -2,13 +2,16 @@
<div :style="height" style="overflow-y: auto" class="pd10"> <div :style="height" style="overflow-y: auto" class="pd10">
<!-- <MyEChart :options="options" /> --> <!-- <MyEChart :options="options" /> -->
<div v-for="(item, index) in List"> <div v-for="(item, index) in List">
<div class="box"> <div class="box" @mouseenter="item.flag = false" @mouseleave="item.flag = true">
<div class="div">{{ item.name }}({{ item.count }})</div> <div class="div">{{ item.name }} <span>({{ item.count }})</span></div>
<!-- <el-progress style="flex: 1" :percentage="(item.count / total).toFixed(2) * 100"> <!-- <el-progress style="flex: 1" :percentage="(item.count / total).toFixed(2) * 100">
<span>{{ item.count }}</span> <span>{{ item.count }}</span>
</el-progress> --> </el-progress> -->
<el-progress style="flex: 1" :percentage="item.score" :color="ratingColor(item.score)"> <el-progress style="flex: 1" :percentage="item.score" :color="ratingColor(item.score)">
<span :style="`color:${ratingColor(item.score)}`">{{ item.score }}</span> <span v-if="item.flag" :style="`color:${ratingColor(item.score)}`">
{{ ratingName(item.score) }}
</span>
<span v-else :style="`color:${ratingColor(item.score)}`">{{ item.score }}</span>
</el-progress> </el-progress>
</div> </div>
<el-divider /> <el-divider />
@@ -35,6 +38,9 @@ const info = () => {
areaTerminalStatistic(props.params).then(res => { areaTerminalStatistic(props.params).then(res => {
total.value = res.data.reduce((sum, item) => sum + Number(item.count), 0) total.value = res.data.reduce((sum, item) => sum + Number(item.count), 0)
List.value = res.data List.value = res.data
List.value.forEach(item => {
item.flag = true
})
}) })
// let dataSource = [ // let dataSource = [
// { value: '90', name: '张家口' }, // { value: '90', name: '张家口' },
@@ -95,7 +101,7 @@ const info = () => {
// ? '#2b7fd3' // ? '#2b7fd3'
// : params.value >= 70 // : params.value >= 70
// ? '#ffcc33' // ? '#ffcc33'
// : '#97017e' // : '#c00'
// } // }
// }, // },
// markLine: { // markLine: {
@@ -148,13 +154,24 @@ const info = () => {
} }
const ratingColor = (num: number) => { const ratingColor = (num: number) => {
if (num >= 90) { if (num >= 90) {
return '#19A094' return '#00b07d'
} else if (num >= 80) { } else if (num >= 80) {
return '#2b7fd3' return '#2b7fd3'
} else if (num >= 70) { } else if (num >= 70) {
return '#ff8c00' return '#ff8c00'
} else { } else {
return '#97017e' return '#c00'
}
}
const ratingName = (num: number) => {
if (num >= 90) {
return '优秀'
} else if (num >= 80) {
return '良好'
} else if (num >= 70) {
return '一般'
} else {
return '较差'
} }
} }
onMounted(() => { onMounted(() => {
@@ -198,12 +215,17 @@ defineExpose({
} }
} }
.box { .box {
cursor: pointer;
// display: flex; // display: flex;
.div { .div {
// width: 100px; // width: 100px;
font-size: 16px;
span{
font-size: 14px;
}
} }
} }
:deep(.el-divider--horizontal) { :deep(.el-divider--horizontal) {
margin: 10px 0; margin: 5px 0;
} }
</style> </style>

View File

@@ -1,12 +1,22 @@
<template> <template>
<div :style="height" style="overflow-y: auto"> <div>
<div class="btnsBox"> <div class="btnsBox">
<el-radio-group v-model="radio2" @change="info"> <!-- <el-radio-group v-model="radio2" @change="info">
<el-radio-button label="电压" value="Voltage_Level" /> <el-radio-button label="电压" value="Voltage_Level" />
<el-radio-button label="厂家" value="Manufacturer" /> <el-radio-button label="厂家" value="Manufacturer" />
</el-radio-group> </el-radio-group> -->
<el-segmented v-model="radio2" size="default" @change="info" :options="segmentedList" block>
<template #default="scope">
<div>{{ scope.item.label }}</div>
</template>
</el-segmented>
</div> </div>
<div class="boxBG"> <div class="appraiseTop">
<div style="flex: 1" class="title">{{ radio2 == 'Voltage_Level' ? '电压等级' : '终端厂家' }}</div>
<div style="width: 150px">在运终端数</div>
<div style="width: 50px">评价</div>
</div>
<div class="boxBG" :style="height">
<div <div
class="appraise" class="appraise"
v-for="(item, i) in List" v-for="(item, i) in List"
@@ -15,9 +25,10 @@
> >
<!-- <div class="iconfont icon-wanzhengshuaifenxi2"></div> --> <!-- <div class="iconfont icon-wanzhengshuaifenxi2"></div> -->
<div style="flex: 1">{{ item.name }}</div> <div style="flex: 1" class="title">{{ item.name }}</div>
<div style="color: #0fff04; width: 150px">{{ Math.floor(item.evaluate * 100).toFixed(0) / 100 }}</div> <!-- <div style="color: #0fff04; width: 150px">{{ Math.floor(item.evaluate * 100).toFixed(0) / 100 }}</div> -->
<div style="width: 40px" :style="`color:${ratingColor(item.evaluate)}`"> <div style="color: #0fff04; width: 150px">{{ item.devIds.length }}</div>
<div style="width: 50px" :style="`color:${ratingColor(item.evaluate)}`">
{{ rating(item.evaluate) }} {{ rating(item.evaluate) }}
</div> </div>
</div> </div>
@@ -37,11 +48,21 @@ const props = defineProps({
default: () => {} default: () => {}
} }
}) })
const segmentedList = ref([
{
label: '电压',
value: 'Voltage_Level'
},
{
label: '厂家',
value: 'Manufacturer'
}
])
const rowColor = ref(0) const rowColor = ref(0)
const List: any = ref([]) const List: any = ref([])
const dictData = useDictData() const dictData = useDictData()
const radio2 = ref('Voltage_Level') const radio2 = ref('Voltage_Level')
const height = mainHeight(520, 1.5) const height = mainHeight(560, 1.5)
const timer: any = ref(null) const timer: any = ref(null)
const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type']) const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type'])
const info = () => { const info = () => {
@@ -79,13 +100,13 @@ const rating = (num: number) => {
} }
const ratingColor = (num: number) => { const ratingColor = (num: number) => {
if (num >= 90) { if (num >= 90) {
return '#0fff04' return '#00b07d'
} else if (num >= 80) { } else if (num >= 80) {
return '#2b7fd3' return '#2b7fd3'
} else if (num >= 70) { } else if (num >= 70) {
return '#ff8c00' return '#ff8c00'
} else { } else {
return '#97017e' return '#ff0000'
} }
} }
const clickRow = (item: any, i: number) => { const clickRow = (item: any, i: number) => {
@@ -104,7 +125,8 @@ defineExpose({
.btnsBox { .btnsBox {
position: absolute; position: absolute;
right: 5px; right: 5px;
top: 0px; // right: 40%;
top: 1px;
} }
// ::v-deep .el-radio-button__inner { // ::v-deep .el-radio-button__inner {
// padding: 8px 18px; // padding: 8px 18px;
@@ -137,18 +159,23 @@ defineExpose({
.boxBG { .boxBG {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// margin-top: 10px;
justify-content: space-around; overflow-y: auto;
overflow: hidden;
width: 100%; width: 100%;
.appraise { .appraise {
// height: 30px; // height: 30px;
width: 99%; width: 98%;
background-image: url('@/assets/imgs/bg02.png'); margin: 0 auto;
// background-image: url('@/assets/imgs/bg02.png');
// background-color: var(--el-color-primary);
background-color: var(--el-color-primary-light-3);
box-shadow: 2px 4px 4px 2px rgba(0, 0, 0, 0.5);
border-radius: 5px;
background-size: 100% 100%; background-size: 100% 100%;
display: inline-block; display: inline-block;
padding: 10px 30px 10px 10px; padding: 8px 30px 8px 10px;
margin-top: 10px;
margin-bottom: 10px;
color: #fff; color: #fff;
display: flex; display: flex;
// justify-content: space-around; // justify-content: space-around;
@@ -162,10 +189,8 @@ defineExpose({
} }
.iconfont { .iconfont {
display: flex; display: flex;
height: 60%; height: 60%;
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
background-color: var(--el-color-primary); background-color: var(--el-color-primary);
font-size: 24px; font-size: 24px;
justify-content: center; justify-content: center;
@@ -174,8 +199,30 @@ defineExpose({
} }
} }
} }
.appraiseTop {
width: 98%;
margin: 0 auto;
margin: 5px 0;
padding: 2px 30px 2px 10px;
font-size: 16px;
font-weight: 650;
display: flex;
div {
text-align: center;
}
}
.hoverBox { .hoverBox {
background-color: var(--el-color-primary-light-5); background-color: var(--el-color-primary) !important;
// background-image: none !important; // background-image: none !important;
} }
:deep(.el-segmented__item-selected, ) {
clip-path: polygon(20% 0, 100% 0, 80% 100%, 0 100%);
}
:deep(.el-segmented__item, ) {
clip-path: polygon(20% 0, 100% 0, 80% 100%, 0 100%);
position: relative;
}
:deep(.el-segmented) {
clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
}
</style> </style>

View File

@@ -1,23 +1,23 @@
<template> <template>
<div style="height: 150px" class="box1"> <div style="height: 145px" class="box1">
<div class="boxDiv"> <div class="boxDiv hexagon">
<div style="color: #07ccca">{{ props.params.allNum }}</div> <div style="color: #fff">{{ props.params.allNum }}</div>
<img src="@/assets/imgs/ditu.png" /> <!-- <div class="hexagon"></div> -->
<div class="mt10 divBot">总数</div> <div class="mt10 divBot">总数</div>
</div> </div>
<div class="boxDiv"> <div class="boxDiv hexagon hexagon1">
<div style="color: #339900">{{ props.params.runNum }}</div> <div style="color: #fff">{{ props.params.runNum }}</div>
<img src="@/assets/imgs/ditu.png" /> <!-- <div class="hexagon"></div> -->
<div class="mt10 divBot">在运</div> <div class="mt10 divBot">在运</div>
</div> </div>
<div class="boxDiv"> <div class="boxDiv hexagon hexagon2">
<div style="color: #ffbf00">{{ props.params.checkNum }}</div> <div style="color: #fff">{{ props.params.checkNum }}</div>
<img src="@/assets/imgs/ditu.png" /> <!-- <div class="hexagon"></div> -->
<div class="mt10 divBot">调试</div> <div class="mt10 divBot">调试</div>
</div> </div>
<div class="boxDiv"> <div class="boxDiv hexagon hexagon3">
<div style="color: #cc0000">{{ props.params.stopRunNum }}</div> <div style="color: #fff">{{ props.params.stopRunNum }}</div>
<img src="@/assets/imgs/ditu.png" /> <!-- <div class="hexagon"></div> -->
<div class="mt10 divBot">停运</div> <div class="mt10 divBot">停运</div>
</div> </div>
</div> </div>
@@ -49,22 +49,77 @@ onMounted(() => {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
position: relative; position: relative;
margin: 0 5px;
img {
width: 90%;
}
div:nth-child(1) { div:nth-child(1) {
position: absolute; position: absolute;
font-size: 30px; font-size: 30px;
top: -20px; top: -10px;
font-weight: 700; font-weight: 700;
} }
.divBot { .divBot {
font-size: 16px; font-size: 16px;
position: absolute; position: absolute;
top: 10px; top: 20px;
} }
color: #fff; color: #fff;
} }
} }
.hexagon {
position: relative;
width: 100%;
height: 55px;
background-color: #19a094;
margin: 50px auto;
&::before {
border-bottom: 27.5px solid #19a094;
}
&::after {
border-top: 27.5px solid #19a094;
}
}
.hexagon::before,
.hexagon::after {
content: '';
position: absolute;
width: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
}
.hexagon::before {
bottom: 100%;
}
.hexagon::after {
top: 100%;
}
.hexagon1 {
background-color: #339900;
&::before {
border-bottom: 27.5px solid #339900;
}
&::after {
border-top: 27.5px solid #339900;
}
}
.hexagon2 {
background-color: #ffbf00;
&::before {
border-bottom: 27.5px solid #ffbf00;
}
&::after {
border-top: 27.5px solid #ffbf00;
}
}
.hexagon3 {
background-color: #cc0000;
&::before {
border-bottom: 27.5px solid #cc0000;
}
&::after {
border-top: 27.5px solid #cc0000;
}
}
</style> </style>

View File

@@ -1,21 +1,31 @@
<template> <template>
<div :style="height" class="mt10"> <div :style="height" class="mt10" style="position: relative">
<vxe-table height="auto" v-bind="defaultAttribute" :data="tableData"> <vxe-table height="auto" v-bind="defaultAttribute" :data="tableData">
<vxe-column type="seq" width="70px" title="序号"></vxe-column> <vxe-column type="seq" width="70px" title="序号"></vxe-column>
<vxe-column field="name" title="终端名称"></vxe-column> <vxe-column field="name" title="终端名称" min-width="100"></vxe-column>
<vxe-column field="subName" title="所属电站"></vxe-column> <vxe-column field="subName" title="所属电站" min-width="100"></vxe-column>
<vxe-column field="ip" title="网络参数" min-width="100"></vxe-column>
<vxe-colgroup title="运行评价"> <vxe-colgroup title="运行评价">
<vxe-column field="integrityRate" title="完整率(%)"></vxe-column> <vxe-column field="integrityRate" title="完整率(%)" min-width="90"></vxe-column>
<vxe-column field="onLineRate" title="在线率(%)"></vxe-column> <vxe-column field="onLineRate" title="在线率(%)" min-width="90"></vxe-column>
<vxe-column field="passRate" title="合格率(%)"></vxe-column> <vxe-column field="passRate" title="合格率(%)" min-width="90"></vxe-column>
</vxe-colgroup> </vxe-colgroup>
<vxe-column field="evaluate" title="评分(分)"> <vxe-column field="evaluate" title="评价" min-width="90">
<template v-slot="{ row }"> <template v-slot="{ row }">
{{ Math.floor(row.evaluate * 100).toFixed(0) / 100 }} <!-- {{ Math.floor(row.evaluate * 100).toFixed(0) / 100 }} -->
<span :style="`color:${ratingColor(row.evaluate)}`">
{{ ratingName(row.evaluate) }}
</span>
</template> </template>
</vxe-column> </vxe-column>
</vxe-table> </vxe-table>
<div class="legeng">
<div v-for="item in legengList">
<span :style="`background-color: ${item.color};`"></span>
<span>{{ item.title }}</span>
</div>
</div>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@@ -31,12 +41,51 @@ const props = defineProps({
}) })
const tableData = ref([]) const tableData = ref([])
const height = mainHeight(360, 3) const height = mainHeight(360, 3)
const legengList = [
{
color: '#00b07d',
title: '优秀'
},
{
color: '#2b7fd3',
title: '良好'
},
{
color: '#ff8c00',
title: '一般'
},
{
color: '#c00',
title: '较差'
}
]
const info = () => { const info = () => {
getRunEvaluateDetail({ ...props.params, ids: [] }).then(res => { getRunEvaluateDetail({ ...props.params, ids: [] }).then(res => {
tableData.value = res.data.slice(0, 10) tableData.value = res.data.slice(0, 10)
}) })
} }
const ratingColor = (num: number) => {
if (num >= 90) {
return '#00b07d'
} else if (num >= 80) {
return '#2b7fd3'
} else if (num >= 70) {
return '#ff8c00'
} else {
return '#c00'
}
}
const ratingName = (num: number) => {
if (num >= 90) {
return '优秀'
} else if (num >= 80) {
return '良好'
} else if (num >= 70) {
return '一般'
} else {
return '较差'
}
}
defineExpose({ defineExpose({
info info
}) })
@@ -83,4 +132,33 @@ defineExpose({
:dppe(.el-select__wrapper) { :dppe(.el-select__wrapper) {
width: 26px !important; width: 26px !important;
} }
.legeng {
position: absolute;
padding: 5px;
top: -168px;
left: -7px;
width: 70px;
font-size: 12px;
height: 100px;
background: #fff;
border-radius: 5px;
display: grid;
line-height: 22px;
grid-template-rows: auto;
div {
display: flex;
align-items: center;
justify-content: center;
span:nth-child(1) {
display: inline-block;
height: 10px;
border-radius: 2px;
width: 15px;
margin-right: 5px;
}
}
}
</style> </style>

View File

@@ -1,21 +1,32 @@
<template> <template>
<div :style="height"> <div :style="height">
<el-select <!-- -->
class="selectBox" <el-popover :visible="visible" placement="left" :width="220">
v-model="value" <el-select
placeholder="请选择" v-model="value"
size="small" placeholder="请选择"
value-key="id" size="small"
multiple value-key="id"
collapse-tags multiple
collapse-tags-tooltip collapse-tags
:multiple-limit="6" collapse-tags-tooltip
filterable :multiple-limit="6"
style="width: 130px" filterable
@change="change" style="width: 130px"
> >
<el-option v-for="item in List" :key="item.id" :label="item.name" :value="item" /> <el-option v-for="item in List" :key="item.id" :label="item.name" :value="item" />
</el-select> </el-select>
<div style="text-align: right" class="mt10">
<el-button size="small" text @click="visible = false">取消</el-button>
<el-button size="small" type="primary" @click="change">确定</el-button>
</div>
<template #reference>
<div class="selectBox" @click="visible = true">
<Tools style="width: 16px" />
</div>
<!-- <el-button>Delete</el-button> -->
</template>
</el-popover>
<MyEChart :options="options" /> <MyEChart :options="options" />
</div> </div>
</template> </template>
@@ -25,12 +36,15 @@ import MyEChart from '@/components/echarts/MyEchart.vue'
import { mainHeight } from '@/utils/layout' import { mainHeight } from '@/utils/layout'
import { yMethod } from '@/utils/echartMethod' import { yMethod } from '@/utils/echartMethod'
import { lastWeekTrend } from '@/api/device-boot/runEvaluate' import { lastWeekTrend } from '@/api/device-boot/runEvaluate'
import { Tools } from '@element-plus/icons-vue'
const props = defineProps({ const props = defineProps({
params: { params: {
type: Object, type: Object,
default: () => {} default: () => {}
} }
}) })
const visible = ref(false)
const value: any = ref([]) const value: any = ref([])
const List: any = ref([]) const List: any = ref([])
const options = ref({}) const options = ref({})
@@ -119,7 +133,8 @@ const change = () => {
data: item.score data: item.score
}) })
}) })
console.log(123)
visible.value = false
} }
onMounted(() => {}) onMounted(() => {})
defineExpose({ defineExpose({
@@ -129,13 +144,22 @@ defineExpose({
<style lang="scss" scoped> <style lang="scss" scoped>
.selectBox { .selectBox {
position: absolute; position: absolute;
top: 1px; top: 2px;
right: 10px; right: 10px;
clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
width: 60px;
height: 28px;
display: flex;
line-height: 28px;
justify-content: center;
cursor: pointer;
background-color: var(--el-color-primary);
color: #fff;
} }
:deep(.el-tag) { // :deep(.el-tag) {
max-width: 110px !important; // max-width: 110px !important;
} // }
:deep(.el-select) { // :deep(.el-select) {
min-width: 190px; // min-width: 190px;
} // }
</style> </style>

View File

@@ -51,7 +51,7 @@
 80% 在线率 < 90%  80% 在线率 < 90%
</div> </div>
<div class="em2"> <div class="em2">
<span style="color: #97017e">较差</span> <span style="color: #c00">较差</span>
 在线率 < 80%  在线率 < 80%
</div> </div>
@@ -72,7 +72,7 @@
 90% 完整性 < 95%  90% 完整性 < 95%
</div> </div>
<div class="em2"> <div class="em2">
<span style="color: #97017e">较差</span> <span style="color: #c00">较差</span>
 完整性 < 90%  完整性 < 90%
</div> </div>
@@ -93,7 +93,7 @@
 90% 完整性 < 95%  90% 完整性 < 95%
</div> </div>
<div class="em2"> <div class="em2">
<span style="color: #97017e">较差</span> <span style="color: #c00">较差</span>
 完整性 < 90%  完整性 < 90%
</div> </div>
<div class="mt10">综合评价方法</div> <div class="mt10">综合评价方法</div>
@@ -116,7 +116,7 @@
 70 综合评分 < 80  70 综合评分 < 80
</div> </div>
<div class="em2"> <div class="em2">
<span style="color: #97017e">较差</span> <span style="color: #c00">较差</span>
 综合评分 < 70  综合评分 < 70
</div> </div>
</div> </div>
@@ -139,7 +139,7 @@
</el-form> </el-form>
</div> </div>
<Map ref="mapRef" /> <Map ref="mapRef" :params="tableStore.table.params" />
<transition name="slide-left"> <transition name="slide-left">
<div class="left" :style="height" v-if="leftVisible"> <div class="left" :style="height" v-if="leftVisible">
@@ -200,7 +200,10 @@
<div class="title"> <div class="title">
<span class="iconfont icon-a-ziyuan118"></span> <span class="iconfont icon-a-ziyuan118"></span>
区域终端运行评价 区域终端运行评价
<el-button link class="view" icon="el-icon-View" @click="regionEvaluation">详情</el-button> <!-- <div class="view" @click="regionEvaluation">
详情
<ArrowRight style="width: 12px" />
</div> -->
</div> </div>
<region :params="tableStore.table.params" ref="regionRef" /> <region :params="tableStore.table.params" ref="regionRef" />
</BorderBox13> </BorderBox13>
@@ -253,6 +256,7 @@ import TableStore from '@/utils/tableStore'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout' import { mainHeight } from '@/utils/layout'
import Area from '@/components/form/area/index.vue' import Area from '@/components/form/area/index.vue'
import { ArrowRight } from '@element-plus/icons-vue'
import Map from './components/map.vue' import Map from './components/map.vue'
import { BorderBox13 } from '@kjgl77/datav-vue3' import { BorderBox13 } from '@kjgl77/datav-vue3'
import { useConfig } from '@/stores/config' import { useConfig } from '@/stores/config'
@@ -378,6 +382,7 @@ onMounted(() => {
background: linear-gradient(to right, var(--el-color-primary), #ffffff00); background: linear-gradient(to right, var(--el-color-primary), #ffffff00);
font-size: 16px; font-size: 16px;
// font-weight: bold; // font-weight: bold;
height: 33px;
color: #fff; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -385,7 +390,8 @@ onMounted(() => {
font-size: 22px; font-size: 22px;
margin: 0 5px 0 10px; margin: 0 5px 0 10px;
} }
button { button,
.view {
margin-left: auto; margin-left: auto;
margin-right: 10px; margin-right: 10px;
} }
@@ -477,6 +483,14 @@ onMounted(() => {
} }
} }
:deep(.view) { :deep(.view) {
color: #000 !important; clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%);
width: 60px;
height: 28px;
display: flex;
font-size: 14px;
justify-content: center;
line-height: 28px;
cursor: pointer;
background-color: var(--el-color-primary);
} }
</style> </style>

View File

@@ -48,10 +48,10 @@
@zoomend="syncCenterAndZoom" @zoomend="syncCenterAndZoom"
:dragging="true" :dragging="true"
> >
<bm-map-type <!-- <bm-map-type
:map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
anchor="BMAP_ANCHOR_TOP_RIGHT" anchor="BMAP_ANCHOR_TOP_RIGHT"
></bm-map-type> ></bm-map-type> -->
<!-- 线--> <!-- 线-->
<div v-if="zoom > 13"> <div v-if="zoom > 13">
<bm-polyline :path="path" v-for="(path, index) in polyline" :key="index"></bm-polyline> <bm-polyline :path="path" v-for="(path, index) in polyline" :key="index"></bm-polyline>

View File

@@ -69,10 +69,10 @@
:dragging="true" :dragging="true"
@zoomend="syncCenterAndZoom" @zoomend="syncCenterAndZoom"
> >
<bm-map-type <!-- <bm-map-type
:map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"
anchor="BMAP_ANCHOR_TOP_RIGHT" anchor="BMAP_ANCHOR_TOP_RIGHT"
></bm-map-type> ></bm-map-type> -->
<!-- 线--> <!-- 线-->
<div v-if="zoom > 13"> <div v-if="zoom > 13">
<bm-polyline :path="path" v-for="(path, index) in polyline" :key="index"></bm-polyline> <bm-polyline :path="path" v-for="(path, index) in polyline" :key="index"></bm-polyline>
@@ -124,7 +124,7 @@
{{ infoWindowPoint.comFlag == 0 ? '中断' : '正常' }} {{ infoWindowPoint.comFlag == 0 ? '中断' : '正常' }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item> <el-descriptions-item>
<el-button type="primary" size="small" @click="lookPoint">查看监测点</el-button> <!-- <el-button type="primary" size="small" @click="lookPoint">查看监测点</el-button> -->
<el-button type="primary" size="small" @click="lookEvent"> <el-button type="primary" size="small" @click="lookEvent">
未处理事件({{ infoWindowPoint.noDealCount }}) 未处理事件({{ infoWindowPoint.noDealCount }})
</el-button> </el-button>

View File

@@ -6,11 +6,11 @@
</div> </div>
<div style="flex: 1; overflow: hidden"> <div style="flex: 1; overflow: hidden">
<vxe-table height="auto" auto-resize :data="tableData1" v-bind="defaultAttribute"> <vxe-table height="auto" auto-resize :data="tableData1" v-bind="defaultAttribute">
<vxe-column type="seq" title="序号" width="80px"></vxe-column> <vxe-column type="seq" title="序号" width="70px"></vxe-column>
<vxe-column field="updateTime" title="中断时间"></vxe-column> <vxe-column field="updateTime" title="中断时间" width="150px"></vxe-column>
<vxe-column field="subName" title="变电站"></vxe-column> <vxe-column field="subName" title="变电站(场站)"></vxe-column>
<vxe-column field="devName" title="终端名称"></vxe-column> <vxe-column field="devName" title="终端名称"></vxe-column>
<vxe-column field="devType" title="终端型号"></vxe-column> <!-- <vxe-column field="devType" title="终端型号"></vxe-column> -->
<vxe-column field="ip" title="网络参数"></vxe-column> <vxe-column field="ip" title="网络参数"></vxe-column>
</vxe-table> </vxe-table>
</div> </div>
@@ -22,7 +22,7 @@
</div> </div>
<div style="flex: 1; overflow: hidden"> <div style="flex: 1; overflow: hidden">
<vxe-table height="auto" auto-resize :data="tableData" v-bind="defaultAttribute"> <vxe-table height="auto" auto-resize :data="tableData" v-bind="defaultAttribute">
<vxe-column type="seq" title="序号" width="80px"></vxe-column> <vxe-column type="seq" title="序号" width="70px"></vxe-column>
<vxe-column field="startTime" title="发生时刻"></vxe-column> <vxe-column field="startTime" title="发生时刻"></vxe-column>
<vxe-column field="lineName" title="监测点"></vxe-column> <vxe-column field="lineName" title="监测点"></vxe-column>
<vxe-column field="featureAmplitude" title="暂降(骤升)幅值(%)" width="150"></vxe-column> <vxe-column field="featureAmplitude" title="暂降(骤升)幅值(%)" width="150"></vxe-column>