App/app-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改测试问题

Browse Source
This commit is contained in:
guanj
2026-06-29 11:01:44 +08:00
parent f008bcb4b8
commit 1d73755a43
56 changed files with 2875 additions and 2702 deletions
Download Patch File Download Diff File Expand all files Collapse all files

450
pages/device/APF/comp/basic.vue
View File

@@ -1,115 +1,105 @@
<template>
<view>
<uni-load-more status="loading"
v-if="renderData.电网电流.length == 0 || renderData.电网电压.length == 0 || renderData.负载电流.length == 0 || renderData.补偿电流.length == 0"></uni-load-more>
<view class="basic" v-else>
<view class="grid-card">
<text>
<view class="grid-card-title grid-card-title-with-icon"></view>电网电流
</text>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Sys(A)'] > 0 ? item['Apf_RmsI_Sys(A)'].toFixed(2) : item['Apf_RmsI_Sys(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Sys(%)'] > 0 ? item['Apf_ThdA_Sys(%)'].toFixed(2) : item['Apf_ThdA_Sys(%)']
}}</view>
</template>
<uni-load-more status="loading" v-if="!isDataReady"></uni-load-more>
<view class="basic mt10" v-else>
<view class="params-wrap" v-for="(section, ind) in sections" :key="section.title">
<view class="section-title-row">
<view class="section-title">
<view class="grid-card-title-with-icon"></view>
<text>{{ section.title }}</text>
</view>
<view class="legend-row" v-if="ind == 0">
<view class="legend-item" v-for="phase in phaseColors" :key="phase.name">
<view class="legend-dot" :style="{ background: phase.color }" />
<text class="legend-text">{{ phase.name }}</text>
</view>
</view>
</view>
</view>
<view class="grid-card">
<text>
<view class="grid-card-title grid-card-title-with-icon"></view>电网电压
</text>
<view class="grid-card-content-4">
<view class="item item-title">名称</view>
<view class="item item-title">电压(V)</view>
<view class="item item-title">频率(Hz)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.电网电压">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_PhV_Sys(V)'] > 0 ? item['Apf_PhV_Sys(V)'].toFixed(2) : item['Apf_PhV_Sys(V)']
}}</view>
<view class="item">{{
item['Apf_Freq(Hz)'] > 0 ? item['Apf_Freq(Hz)'].toFixed(2) : item['Apf_Freq(Hz)']
}}</view>
<view class="item">{{
item['Apf_ThdU_Sys(%)'] > 0 ? item['Apf_ThdU_Sys(%)'].toFixed(2) : item['Apf_ThdU_Sys(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<text>
<view class="grid-card-title grid-card-title-with-icon"></view>负载电流
</text>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">畸变率(%)</view>
<template v-for="(item, index) in renderData.负载电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_Load(A)'] > 0
? item['Apf_RmsI_Load(A)'].toFixed(2)
: item['Apf_RmsI_Load(A)']
}}</view>
<view class="item">{{
item['Apf_ThdA_Load(%)'] > 0
? item['Apf_ThdA_Load(%)'].toFixed(2)
: item['Apf_ThdA_Load(%)']
}}</view>
</template>
</view>
</view>
<view class="grid-card">
<text>
<view class="grid-card-title grid-card-title-with-icon"></view>补偿电流
</text>
<view class="grid-card-content-3">
<view class="item item-title">名称</view>
<view class="item item-title">有效值(A)</view>
<view class="item item-title">负载率(%)</view>
<template v-for="(item, index) in renderData.补偿电流">
<view class="item">{{ item.phase }}</view>
<view class="item">{{
item['Apf_RmsI_TolOut(A)'] == 3.1415926
? '-'
: item['Apf_RmsI_TolOut(A)'] > 0
? item['Apf_RmsI_TolOut(A)'].toFixed(2)
: item['Apf_RmsI_TolOut(A)']
}}</view>
<view class="item">{{
item['load_Rate'] == 3.1415926
? '-'
: item['load_Rate'] > 0
? item['load_Rate'].toFixed(2)
: item['load_Rate']
}}</view>
</template>
<view class="params-section">
<view v-for="(rowItems, rowIdx) in chunkedChildren(getSectionCards(section))" :key="rowIdx"
class="double-row">
<view v-for="(child, childIdx) in rowItems" :key="childIdx" class="param-group">
<view class="param-title">
<text>{{ child.name }}</text>
</view>
<view class="phase-vertical">
<view class="phase-item-vertical">
<text class="phase-value-vertical" :style="{ color: phaseColors[0].color }">{{
child.A
}}</text>
</view>
<view class="phase-divider" />
<view class="phase-item-vertical">
<text class="phase-value-vertical" :style="{ color: phaseColors[1].color }">{{
child.B
}}</text>
</view>
<view class="phase-divider" />
<view class="phase-item-vertical">
<text class="phase-value-vertical" :style="{ color: phaseColors[2].color }">{{
child.C
}}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
const SECTIONS = [
{
title: '电网电流',
dataKey: '电网电流',
metrics: [
{ label: '有效值(A)', field: 'Apf_RmsI_Sys(A)' },
{ label: '畸变率(%)', field: 'Apf_ThdA_Sys(%)' },
],
},
{
title: '电网电压',
dataKey: '电网电压',
metrics: [
{ label: '电压(V)', field: 'Apf_PhV_Sys(V)' },
{ label: '频率(Hz)', field: 'Apf_Freq(Hz)' },
{ label: '畸变率(%)', field: 'Apf_ThdU_Sys(%)' },
],
},
{
title: '负载电流',
dataKey: '负载电流',
metrics: [
{ label: '有效值(A)', field: 'Apf_RmsI_Load(A)' },
{ label: '畸变率(%)', field: 'Apf_ThdA_Load(%)' },
],
},
{
title: '补偿电流',
dataKey: '补偿电流',
metrics: [
{ label: '有效值(A)', field: 'Apf_RmsI_TolOut(A)' },
{ label: '负载率(%)', field: 'load_Rate' },
],
},
]
export default {
props: {
basicData: {
type: Array,
default: () => [],
},
},
data() {
return {
sections: SECTIONS,
phaseColors: [
{ name: 'A相', color: '#F1B22E' },
{ name: 'B相', color: '#2BA471' },
{ name: 'C相', color: '#D54941' },
],
renderData: {
电网电流: [],
电网电压: [],
@@ -119,101 +109,209 @@ export default {
},
}
},
props: {
basicData: {
type: Array,
default: () => {
return []
},
computed: {
isDataReady() {
return (
this.renderData.电网电流.length > 0 &&
this.renderData.电网电压.length > 0 &&
this.renderData.负载电流.length > 0 &&
this.renderData.补偿电流.length > 0
)
},
},
watch: {
basicData: {
handler: function (newVal, oldVal) {
newVal.forEach((item) => {
if (item.phase === 'avg') {
return
}
let key = ''
switch (item.statisticalName) {
case 'Apf_RmsI_Sys(A)':
key = '电网电流'
break
case 'Apf_ThdA_Sys(%)':
key = '电网电流'
break
case 'Apf_PhV_Sys(V)':
key = '电网电压'
break
case 'Apf_Freq(Hz)':
key = '电网电压'
break
case 'Apf_ThdU_Sys(%)':
key = '电网电压'
break
case 'Apf_RmsI_Load(A)':
key = '负载电流'
break
case 'Apf_ThdA_Load(%)':
key = '负载电流'
break
case 'Apf_RmsI_TolOut(A)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'Apf_PhV_Sys(V)':
key = '补偿电流'
break
case 'load_Rate':
key = '补偿电流'
break
default:
key = '未知'
break
}
let index = this.renderData[key].findIndex((item2) => {
return item2.phase === item.phase
handler(newVal) {
this.renderData = {
电网电流: [],
电网电压: [],
负载电流: [],
补偿电流: [],
未知: [],
}
; (newVal || []).forEach((item) => {
if (item.phase === 'avg') {
return
}
const key = this.getDataKey(item.statisticalName)
const index = this.renderData[key].findIndex((item2) => item2.phase === item.phase)
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData,
})
}
})
if (index > -1) {
this.renderData[key][index][item.statisticalName] = item.statisticalData //
} else {
this.renderData[key].push({
phase: item.phase,
[item.statisticalName]: item.statisticalData, //,
})
}
})
console.log(this.renderData)
},
deep: true,
immediate: true,
},
},
methods: {},
methods: {
getDataKey(statisticalName) {
switch (statisticalName) {
case 'Apf_RmsI_Sys(A)':
case 'Apf_ThdA_Sys(%)':
return '电网电流'
case 'Apf_PhV_Sys(V)':
case 'Apf_Freq(Hz)':
case 'Apf_ThdU_Sys(%)':
return '电网电压'
case 'Apf_RmsI_Load(A)':
case 'Apf_ThdA_Load(%)':
return '负载电流'
case 'Apf_RmsI_TolOut(A)':
case 'load_Rate':
return '补偿电流'
default:
return '未知'
}
},
getSectionCards(section) {
const list = this.renderData[section.dataKey] || []
return section.metrics.map((metric) => ({
name: metric.label,
A: this.getPhaseValue(list, metric.field, 'A'),
B: this.getPhaseValue(list, metric.field, 'B'),
C: this.getPhaseValue(list, metric.field, 'C'),
}))
},
getPhaseValue(list, field, phase) {
const item = list.find(
(row) => String(row.phase || '').toUpperCase() === phase,
)
return this.formatValue(item[field])
},
formatValue(value) {
if (value == 3.1415926) return '-'
if (value === undefined || value === null || value === '') return '-'
const num = Number(value)
if (Number.isNaN(num)) return value
return num > 0 ? num.toFixed(2) : num
},
chunkedChildren(children) {
const result = []
for (let i = 0; i < children.length; i += 2) {
result.push(children.slice(i, i + 2))
}
return result
},
},
}
</script>
<style lang="scss">
<style lang="scss" scoped>
.basic {
.params-wrap {
margin-bottom: 20rpx;
background-color: #fff;
border-radius: 10rpx;
overflow: hidden;
}
.section-title-row {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12rpx;
padding: 20rpx 20rpx 0;
}
.section-title {
display: flex;
align-items: center;
font-size: 30rpx;
font-weight: 600;
color: #333;
}
.grid-card-title-with-icon {
display: inline-flex;
align-items: center;
position: relative;
padding-left: 20rpx;
width: 8rpx;
height: 28rpx;
margin-right: 12rpx;
background: $uni-theme-color;
border-radius: 3rpx;
}
&::before {
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 8rpx;
height: 28rpx;
background: $uni-theme-color;
border-radius: 3rpx;
.legend-row {
display: flex;
gap: 20rpx;
align-items: center;
}
.legend-item {
display: flex;
align-items: center;
gap: 8rpx;
}
.legend-dot {
width: 16rpx;
height: 16rpx;
border-radius: 50%;
}
.legend-text {
font-size: 24rpx;
color: #666666;
}
.params-section {
padding: 16rpx 16rpx 20rpx;
}
.double-row {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16rpx;
margin-bottom: 16rpx;
&:last-child {
margin-bottom: 0;
}
}
.param-group {
min-width: 0;
background: #f3f3f3;
border-radius: 16rpx;
padding: 16rpx 8rpx 12rpx;
}
.param-title {
font-size: 26rpx;
color: #666666;
margin-bottom: 8rpx;
padding-left: 4rpx;
}
.phase-vertical {
display: flex;
align-items: stretch;
}
.phase-item-vertical {
flex: 1;
display: flex;
justify-content: center;
align-items: center;
padding: 4rpx;
}
.phase-value-vertical {
font-size: 28rpx;
font-weight: 700;
}
.phase-divider {
width: 1px;
background: #d2d2d2;
margin: 8rpx 0;
}
}
</style>