Web/admin-sjzx
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改 数据中心测试bug

Browse Source
This commit is contained in:
GGJ
2024-11-13 16:21:08 +08:00
parent 7640b53b20
commit e53a3dd8dd
11 changed files with 1721 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

462
src/views/pqs/harmonicMonitoring/area/powerAssessment/index.vue Normal file
View File

@@ -0,0 +1,462 @@
<template>
<div class="default-main">
<TableHeader datePicker ref="header">
<template v-slot:select>
</template>
</TableHeader>
<div v-loading="tableStore.table.loading" class="pr10">
<el-row>
<el-col :span="12" class="pd10">
<el-tag style="background: #339966;" class="tag" size="small">5级</el-tag>
<span style="color: #339966;" class="text">::优秀--(4.5,5]</span>
<el-tag style="background: #3399ff;" class="tag" size="small">4级</el-tag>
<span style="color: #3399ff;" class="text">:良好--(4,4.5]</span>
<el-tag style="background: #ffcc33;" class="tag" size="small">3级</el-tag>
<span style="color: #ffcc33;" class="text">:合格--(3,4]</span>
<el-tag style="background: #ff9900;" class="tag" size="small">2级</el-tag>
<span style="color: #ff9900;" class="text">:较差--(2,3]</span>
<el-tag style="background: #cc0000;" class="tag" size="small">1级</el-tag>
<span style="color: #cc0000;" class="text">:极差--[1,2]</span>
<div :style="{ height: layout.height }" style="overflow-y: auto" class="mt10">
<div class=" cardBox">
<el-card v-for="(item, index) in tableStore.table.data" :key="index">
<template #header>
<div style="cursor: pointer;">
<el-tag v-if="item.data == 3.14159 || item.data == 0"
style="background: #ccc; color: #fff" size="small">
无
</el-tag>
<el-tag v-if="4.5 < item.data && item.data <= 5 && item.data !== 3.14159"
style="background: #339966; color: #fff" size="small">
5级
</el-tag>
<el-tag v-if="4 < item.data && item.data <= 4.5 && item.data !== 3.14159"
style="background: #3399ff; color: #fff" size="small">
4级
</el-tag>
<el-tag v-if="3 < item.data && item.data <= 4 && item.data !== 3.14159"
style="background: #ffcc33; color: #fff" size="small">
3级
</el-tag>
<el-tag v-if="2 < item.data && item.data <= 3 && item.data !== 3.14159"
style="background: #ff9900; color: #fff" size="small">
4级
</el-tag>
<el-tag v-if="1 <= item.data && item.data <= 2 && item.data !== 3.14159"
style="background: #cc0000; color: #fff" size="small">
1级
</el-tag>
<span>{{ item.name }}</span>
</div>
</template>
<div class="card-content">
<div class="card-item" v-for="(item1, index1) in item.children" :key="index1">
<el-tag v-if="item1.data == 3.14159 || item1.data == 0"
style="background: #ccc; color: #fff" size="small">
无
</el-tag>
<el-tag v-if="4.5 < item1.data && item1.data <= 5 && item1.data !== 3.14159"
style="background: #339966; color: #fff" size="small">
5级
</el-tag>
<el-tag v-if="4 < item1.data && item1.data <= 4.5 && item1.data !== 3.14159"
style="background: #3399ff; color: #fff" size="small">
4级
</el-tag>
<el-tag v-if="3 < item1.data && item1.data <= 4 && item1.data !== 3.14159"
style="background: #ffcc33; color: #fff" size="small">
3级
</el-tag>
<el-tag v-if="2 < item1.data && item1.data <= 3 && item1.data !== 3.14159"
style="background: #ff9900; color: #fff" size="small">
2级
</el-tag>
<el-tag v-if="1 <= item1.data && item1.data <= 2 && item1.data !== 3.14159"
style="background: #cc0000; color: #fff" size="small">
1级
</el-tag>
<span class="xdf">
<el-tooltip :show-arrow="false" :offset="-0" :content="item1.name"
popper-class="atooltip" placement="bottom-start">
<div class="tooltipText">
{{ item1.name }}
</div>
</el-tooltip>
</span>
</div>
</div>
</el-card>
</div>
</div>
</el-col>
<el-col :span="12">
<my-echart class="tall" :options="echartList" />
<div class="tall">
<vxe-table height="auto" auto-resize :data="tableStore.table.data" v-bind="defaultAttribute">
<vxe-column field="name" title="名称"></vxe-column>
<vxe-column field="zc" title="综合评估值">
<template #default="scope">
<span v-if="scope.row.data == 3.14159" style="color: #000;">
暂无数据
</span>
<span v-if="scope.row.data !== 3.14159" style="color: #000;">
{{ scope.row.data }}
</span>
</template>
</vxe-column>
<vxe-column field="monitors" title="监测点个数(个)"></vxe-column>
<vxe-column field="level" title="评估等级">
</vxe-column>
</vxe-table>
</div>
</el-col>
</el-row>
</div>
</div>
</template>
<script setup lang="ts">
import TableHeader from '@/components/table/header/index.vue'
import { useDictData } from '@/stores/dictData'
import { defaultAttribute } from '@/components/table/defaultAttribute'
import MyEchart from '@/components/echarts/MyEchart.vue'
import TableStore from '@/utils/tableStore'
import { ref, onMounted, provide } from 'vue'
import { mainHeight } from '@/utils/layout'
import * as echarts from 'echarts/core'
defineOptions({
name: 'harmonic-boot/qydetailedAnalysis/pollutionqy'
})
const dictData = useDictData()
const echartList = ref({})
const header = ref()
const options = dictData.getBasicData('Pollution_Statis', ['I_Neg', 'V_Inharm', 'V_Dev', 'V_Unbalance', 'Plt', 'Freq_Dev'])
const tableStore = new TableStore({
url: '/harmonic-boot/comAccess/getComAccessData',
method: 'POST',
column: [],
loadCallback: () => {
histogram(tableStore.table.data)
header.value.areaRef.change()
}
})
provide('tableStore', tableStore)
tableStore.table.params.deptIndex = dictData.state.area[0].id
tableStore.table.params.monitorFlag = 2
tableStore.table.params.powerFlag = 2
tableStore.table.params.statisticalType = {}
// 柱状图数据处理
const histogram = (res: any) => {
console.log(123);
echartList.value = {
title: {
text: '区域'
},
legend: {
show: false
},
xAxis: {
name: '区域',
data: res.map((item: any) => item.name)
},
yAxis: {
name: '等级',// 给X轴加单位
min: 0,
max: 5,
splitLine: {
show: false
},
axisLabel: {
show: true,
// 这里重新定义就可以
formatter: function (value, index) {
var texts = []
if (value == 1) {
texts.push('1级')
} else if (value == 2) {
texts.push('2级')
} else if (value == 3) {
texts.push('3级')
} else if (value == 4) {
texts.push('4级')
} else if (value == 5) {
texts.push('5级')
}
return texts
}
},
},
options: {
dataZoom: null,
series: [
{
name: '评估值',
type: 'bar',
data: res.map((item: any) => {
return item.data == 3.14159 ? 0.14159 : item.data
}),
barMaxWidth: 30,
itemStyle: {
normal: {
// 随机显示
//color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);}
// 定制显示（按顺序）
color: function (params) {
if (4.5 < params.value && params.value <= 5 && params.value !== 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: '#339966',
}], false)
} else if (4 < params.value && params.value <= 4.5 && params.value !== 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: '#3399FF'
}], false)
} else if (3 < params.value && params.value <= 4 && params.value !== 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: '#FFCC33'
}], false)
} else if (2 < params.value && params.value <= 3 && params.value !== 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: '#FF9900'
}], false)
} else if (params.value >= 1 && params.value <= 2 && params.value !== 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: '#CC0000'
}], false)
} else if (params.value == 0.2) {
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 1,
color: "#999999"
}], false)
}
}
},
},
markLine: {
silent: false,
symbol: 'circle',
lineStyle: {
color: 'red',
width: 1
},
emphasis: {
lineStyle: {
width: 1
},
},
data: [
{
name: "",
yAxis: 1,
lineStyle: {
color: '#CC0000',
},
label: {
// position:"middle",
formatter: '{b}',
textStyle: {
color: '#CC0000',
}
}
},
{
name: "",
yAxis: 2,
lineStyle: {
color: '#FF9900',
},
label: {
// position:"middle",
formatter: '{b}',
textStyle: {
color: '#FF9900',
}
}
},
{
name: "",
yAxis: 3,
lineStyle: {
color: '#FFCC33',
},
label: {
// position:"middle",
formatter: '{b}',
textStyle: {
color: '#FFCC33',
}
}
},
{
name: "",
yAxis: 4,
lineStyle: {
color: '#3399FF',
},
label: {
// position:"middle",
formatter: '{b}',
textStyle: {
color: '#3399FF',
}
}
},
{
name: "",
yAxis: 5,
lineStyle: {
color: '#339966',
},
label: {
// position:"middle",
formatter: '{b}',
textStyle: {
color: '#339966',
}
}
},
]
},
}
]
}
}
}
onMounted(() => {
tableStore.index()
})
const layout = mainHeight(133) as any
const layout1 = mainHeight(93) as any
</script>
<style lang="scss" scoped>
.tall {
height: calc(v-bind('layout1.height') / 2);
}
.tag {
color: #fff;
border: #fff;
margin-left: 5px;
width: 28px;
}
.text {
font-weight: bold;
font-size: 12px;
}
:deep(.cardBox) {
box-sizing: border-box;
overflow: auto;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
grid-template-rows: max-content;
grid-gap: 10px;
justify-content: center;
.el-card {
background-image: linear-gradient(var(--el-color-primary), var(--el-color-primary-light-3));
font-weight: bold;
.el-card__header {
padding: 10px !important;
color: #fff;
div {
display: flex;
justify-content: space-between;
}
}
.el-card__body {
padding: 10px !important;
}
.card-content {
height: 200px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
overflow-y: auto;
color: #000;
.card-item {
margin-bottom: 20px;
width: 50%;
display: flex;
cursor: pointer;
}
.xdf {
width: 70%;
}
.tooltipText {
font-weight: 500;
font-size: 12px;
color: #fff;
// width: 50%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-left: 5px;
}
}
}
}
</style>