Files
pqs-9100_client/frontend/src/views/home/components/compareDataCheckResultTable.vue
caozehui 647afd9fc9 微调
2025-12-11 08:35:01 +08:00

213 lines
7.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="table-main">
<el-table
:data="prop.tableData"
stripe
border
:header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center' }"
height="368px"
style="width: 100%"
>
<el-table-column label="A相" v-if="prop.tableData.length==0|| prop.tableData[0]?.dataA">
<el-table-column prop="dataA" :label="'标准值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataA.resultData }}
</template>
</el-table-column>
<el-table-column prop="stdA" :label="'被检值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataA.data }}
</template>
</el-table-column>
<el-table-column prop="isDataA" label="检测结果">
<template #default="{ row }">
<template v-if="row.dataA.isData === 4 || row.dataA.isData === 5">
<el-tag type="warning" v-if="row.dataA.isData === 4">/</el-tag>
<el-tag type="info" v-if="row.dataA.isData === 5">-</el-tag>
</template>
<el-tooltip v-else effect="dark" placement="bottom">
<template #content>
误差范围{{ addPercentSigns(row.dataA.radius, row.dataA.unit) }}
<br/>
误差值{{ row.dataA.errorData }}{{ row.dataA.unit }}
</template>
<el-tag type="success" v-if="row.dataA.isData === 1">符合</el-tag>
<el-tag type="danger" v-if="row.dataA.isData === 2">不符合</el-tag>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
<el-table-column :label="setB" v-if="prop.tableData.length==0|| prop.tableData[0]?.dataB">
<el-table-column prop="dataB" :label="'标准值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataB.resultData }}
</template>
</el-table-column>
<el-table-column prop="stdB" :label="'被检值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataB.data }}
</template>
</el-table-column>
<el-table-column prop="isDataB" label="检测结果">
<template #default="{ row }">
<template v-if="row.dataB.isData === 4 || row.dataB.isData === 5">
<el-tag type="warning" v-if="row.dataB.isData === 4">/</el-tag>
<el-tag type="info" v-if="row.dataB.isData === 5">-</el-tag>
</template>
<el-tooltip v-else effect="dark" placement="bottom">
<template #content>
误差范围{{ addPercentSigns(row.dataB.radius, row.dataB.unit) }}
<br/>
误差值{{ row.dataB.errorData }}{{ row.dataB.unit }}
</template>
<el-tag type="success" v-if="row.dataB.isData === 1">符合</el-tag>
<el-tag type="danger" v-if="row.dataB.isData === 2">不符合</el-tag>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
<el-table-column label="C相" v-if="prop.tableData.length==0|| prop.tableData[0]?.dataC">
<el-table-column prop="dataC" :label="'标准值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataC.resultData }}
</template>
</el-table-column>
<el-table-column prop="stdC" :label="'被检值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataC.data }}
</template>
</el-table-column>
<el-table-column prop="isDataC" label="检测结果">
<template #default="{ row }">
<template v-if="row.dataC.isData === 4 || row.dataC.isData === 5">
<el-tag type="warning" v-if="row.dataC.isData === 4">/</el-tag>
<el-tag type="info" v-if="row.dataC.isData === 5">-</el-tag>
</template>
<el-tooltip v-else effect="dark" placement="bottom">
<template #content>
误差范围{{ addPercentSigns(row.dataC.radius, row.dataC.unit) }}
<br/>
误差值{{ row.dataC.errorData }}{{ row.dataC.unit }}
</template>
<el-tag type="success" v-if="row.dataC.isData === 1">符合</el-tag>
<el-tag type="danger" v-if="row.dataC.isData === 2">不符合</el-tag>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
<el-table-column :label="setT" v-if="prop.tableData[0].dataT">
<el-table-column prop="dataT" :label="'标准值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataT.resultData }}
</template>
</el-table-column>
<el-table-column prop="stdT" :label="'被检值'+(outerUnit==''?'':''+outerUnit+'')">
<template #default="{ row }">
{{ row.dataT.data }}
</template>
</el-table-column>
<el-table-column prop="isDataT" label="检测结果">
<template #default="{ row }">
<template v-if="row.dataT.isData === 4 || row.dataT.isData === 5">
<el-tag type="warning" v-if="row.dataT.isData === 4">/</el-tag>
<el-tag type="info" v-if="row.dataT.isData === 5">-</el-tag>
</template>
<el-tooltip v-else effect="dark" placement="bottom">
<template #content>
误差范围{{ addPercentSigns(row.dataT.radius, row.dataT.unit) }}
<br/>
误差值{{ row.dataT.errorData }}{{ row.dataT.unit }}
</template>
<el-tag type="success" v-if="row.dataT.isData === 1">符合</el-tag>
<el-tag type="danger" v-if="row.dataT.isData === 2">不符合</el-tag>
</el-tooltip>
</template>
</el-table-column>
</el-table-column>
</el-table>
</div>
</template>
<script lang="tsx" setup>
import {computed} from 'vue'
import {CheckData} from '@/api/check/interface'
const prop = defineProps({
tableData: {
type: Array as () => CheckData.TableRow[],
default: []
},
currentCheckItem: {
type: String,
default: ''
}
})
// 添加单位
const outerUnit = computed(() => {
return prop.tableData.length > 0 ? prop.tableData[0].unit : '';
})
const addPercentSigns = (text: string, unit: string) => {
return text
.split('~')
.map(part => `${part}${unit}`)
.join('~')
}
const setB = computed(() => {
return prop.currentCheckItem == '三相电流不平衡度'
? '三相电流不平衡度'
: prop.currentCheckItem == '三相电压不平衡度'
? '三相电压不平衡度'
: 'B相'
})
const setT = computed(() => {
return prop.currentCheckItem == '频率' ? '频率' : 'T相'
})
</script>
<style scoped>
.form-grid {
display: flex;
flex-direction: row; /* 横向排列 */
flex-wrap: wrap; /* 允许换行 */
}
.form-grid .el-form-item {
flex: 1 1 30%; /* 控件宽度 */
margin-right: 20px; /* 控件间距 */
}
.form-grid .el-form-item:last-child {
margin-right: 0; /* 最后一个控件不需要右边距 */
}
.dialog-footer {
display: flex;
justify-content: flex-start;
margin-bottom: 10px; /* 调整这里的值以增加或减少间距 */
}
.el-tabs {
margin-bottom: 20px; /* 添加底部边距 */
}
.el-table th,
.el-table td {
text-align: center; /* 所有单元格文字居中 */
}
</style>