Files
pqs-9100_client/frontend/src/views/home/components/compareDataCheckSingleChannelSingleTestPopup.vue
2025-08-08 13:18:01 +08:00

703 lines
20 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>
<el-dialog :append-to-body="appendToBody" class="dialog" title="数据查询" :model-value='visible' @close="close"
v-bind="dialogBig" :draggable="false" width="1400px">
<div class="data-check-dialog">
<div class="data-check-head">
<el-form :model='formContent' label-width="auto" class="form-three ">
<el-form-item label="误差体系">
<el-select :disabled="checkStore.showDetailType===2 || checkStore.showDetailType===0" v-model="formContent.errorSysId" placeholder="请选择误差体系" autocomplete="off"
@change="handleErrorSysChange">
<el-option
v-for="(option) in pqErrorList"
:key="option.id"
:label="option.name"
:value="option.id"/>
</el-select>
</el-form-item>
<el-form-item label="数据原则">
<el-input v-model='formContent.dataRule' :disabled="true"/>
</el-form-item>
<el-form-item label="设备名称">
<el-input v-model='formContent.deviceName' :disabled="true"/>
</el-form-item>
<el-form-item label='通道号'>
<el-select v-model="formContent.chnNum">
<el-option v-for="item in chnList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item v-if="checkStore.showDetailType===1">
<el-button type="primary" :icon="Postcard" @click="handleGenerateReport">报告生成</el-button>
</el-form-item>
<el-form-item v-if="checkStore.showDetailType===0">
<el-button type="primary" :icon="Histogram" @click="handleReCalculate">重新计算</el-button>
</el-form-item>
</el-form>
</div>
<div class="data-check-body">
<div class="content-right">
<div class="content-right-title">
<el-form-item label='测试项'>
<el-cascader
v-model="currentCheckItem"
:options="checkListLevel"
:props="{expandTrigger: 'click' as const}"
placement="bottom-end"
/>
</el-form-item>
</div>
<div class="content-right-Tabs">
<el-tabs type="border-card" v-model="activeTab">
<el-tab-pane label="检测结果" name="resultTab">
<CompareDataCheckResultTable :tableData="checkResultData" :currentScriptTypeName="currentScriptTypeName"/>
</el-tab-pane>
<el-tab-pane label="原始数据" name="rawDataTab">
<CompareDataCheckRawDataTable :tableData="rawTableData" :currentScriptTypeName="currentScriptTypeName" @exportRawDataHandler="exportRawDataHandler"/>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</div>
</el-dialog>
</template>
<script setup lang='ts'>
import {dialogBig} from '@/utils/elementBind'
import {reactive, ref, watch} from 'vue'
import CompareDataCheckResultTable from './compareDataCheckResultTable.vue'
import CompareDataCheckRawDataTable from './compareDataCheckRawDataTable.vue'
import {CheckData} from "@/api/check/interface";
import {useCheckStore} from "@/stores/modules/check";
import {changeErrorSystem, deleteTempTable, exportRawData, getFormData, getTableData, getTreeData, reCalculate} from "@/api/check/test";
import {generateDevReport, getPqErrSysList} from '@/api/plan/plan'
import {useDownload} from "@/hooks/useDownload";
import {Histogram, Postcard} from "@element-plus/icons-vue";
import {ResultEnum} from "@/enums/httpEnum";
import {ElMessage} from "element-plus";
const {appendToBody} = withDefaults(defineProps<{
appendToBody: boolean
}>(), {appendToBody: true})
const checkStore = useCheckStore()
const visible = ref(false)
const treeRef = ref()
const searchValue = ref<string>('')
const pqErrorList = reactive<{ id: string; name: string; }[]>([])
watch(searchValue, (val) => {
treeRef.value!.filter(val)
})
// 表单数据
const formContent = reactive<CheckData.DataCheck>({
scriptName: '',
errorSysId: '',
dataRule: '',
deviceName: '',
chnNum: '',
})
// 原始误差体系id
let originErrorSysId: string = ''
let planCode: string = ''
// 当前选中的检测项
const currentCheckItem = ref<any>()
// 带有层级的检测项列表
const checkListLevel = reactive<{ value: string, label: string, children: { value: string, label: string }[] }[]>([])
let deviceId: string = ''
let originScriptType: string | null = null
let scriptType: string | null = null
// 通道下拉列表
let chnList: any[] = []
// 左侧树数据
const treeDataAll = reactive<CheckData.TreeItem[]>([])
// 左侧树被选中的叶子节点id
const checkIndex = ref<string>('')
// 当前检测项目名称
const currentScriptTypeName = ref('')
// 当前检测项目描述
const currentDesc = ref('');
// 右侧Tab选中项
const activeTab = ref<string>('resultTab')
//存放相应的表格数据
const resTableData = reactive<{ resultData: Map<string, any>, rawData: Map<string, any> }>({resultData: new Map(), rawData: new Map()})
// 检测结果表格数据
const checkResultData = reactive<CheckData.CheckResult[]>([])
// 原始数据表格数据
const rawTableData = reactive<CheckData.RawDataItem[]>([])
const handleErrorSysChange = async () => {
console.log("切换误差体系", formContent.errorSysId);
changeErrorSystem({
planId: checkStore.plan.id,
scriptId: checkStore.plan.scriptId,
errorSysId: formContent.errorSysId,
deviceId: deviceId,
code: checkStore.plan.code + '',
}).then((res) => {
if (res.code === ResultEnum.SUCCESS) {
ElMessage.success('切换误差体系成功')
if (originErrorSysId != formContent.errorSysId) {
planCode = checkStore.plan.code + "_temp"
} else {
planCode = checkStore.plan.code + ''
}
if (formContent.chnNum != chnList[0].value) {
formContent.chnNum = chnList[0].value
} else {
handleChnNumChange()
}
}
})
}
watch(() => formContent.chnNum, async (newVal, oldVal) => {
// console.log("通道号", newVal);
if (newVal != '') {
handleChnNumChange()
}
})
const handleChnNumChange = async () => {
console.log("通道号", formContent.chnNum);
// 发起请求,查询该测试项的检测结果
const {data: resTreeDataTemp}: { data: CheckData.TreeItem[] } = await getTreeData({
scriptId: checkStore.plan.scriptId,
devId: deviceId,
devNum: formContent.chnNum + '',
scriptType: originScriptType,
code: planCode
})
updateTreeFly(resTreeDataTemp, 4)
updateTreeFly(resTreeDataTemp, 2)
treeDataAll.length = 0
Object.assign(treeDataAll, resTreeDataTemp)
defaultOperate()
await updateTableData()
activeTab.value = 'resultTab'
}
watch(currentCheckItem, (newVal, oldVal) => {
if (newVal !== '') {
let key = newVal[0]
if (newVal.length == 2) {
key += "_" + newVal[1]
}
console.log("当前检测项", key);
doCurrentCheckItemUpdate(key)
} else {
activeTab.value = 'resultTab'
}
})
// 默认操作
const defaultOperate = () => {
let node = getDefaultNode(treeDataAll)
if (node) {
currentScriptTypeName.value = node.scriptTypeName
currentDesc.value = node.sourceDesc
checkIndex.value = node.index
defaultExpandedKeys = [node.index]
treeRef.value?.setCurrentKey(node.index);
scriptType = node.scriptType ?? scriptType
} else {
currentScriptTypeName.value = ''
currentDesc.value = ''
checkIndex.value = ''
defaultExpandedKeys = []
}
}
const updateTableData = async () => {
console.log("左侧树被选中的叶子节点checkIndex", checkIndex.value);
if (checkIndex.value !== '') {
checkListLevel.length = 0
checkResultData.length = 0
rawTableData.length = 0
currentCheckItem.value = ''
// console.log("更新表格数据");
// 发起请求,查询该测试项的检测结果
const {data} = await getTableData({
scriptType,
scriptId: checkStore.plan.scriptId,
devId: deviceId,
devNum: formContent.chnNum + '',
code: planCode,
index: parseInt(checkIndex.value),
})
let keys1 = Object.keys(data.resultData)
let resultData = new Map()
for (let key of keys1) {
let children = []
let label = key
if ((key.includes('谐波') || key.includes('简谐波')) && key !== '谐波有功功率') {
for (let item of data.resultData[key]) {
let num = formatHarmNum(item.harmNum + '')
label = item.isData === 1 ? `${num}` : item.isData === 4 ? `${num}/` : item.isData === 5 ? `${num}-` : `${num}(不符合)`
children.push({label: label, value: num})
resultData.set(key + "_" + num, item)
}
checkListLevel.push({label: key, value: key, children: children})
} else {
label = data.resultData[key][0].isData === 1 ? `${key}` : data.resultData[key][0].isData === 4 ? `${key}/` : data.resultData[key][0].isData === 5 ? `${key}-` : `${key}(不符合)`
resultData.set(key, data.resultData[key][0])
checkListLevel.push({label: label, value: key, children: []})
let temp = checkListLevel.find(item => item.label.includes('电压幅值'))
if (temp) {
checkListLevel.splice(checkListLevel.indexOf(temp), 1)
checkListLevel.unshift(temp)
}
}
}
let keys2 = Object.keys(data.rawData)
let rawData = new Map()
for (let key of keys2) {
if ((key.includes('谐波') || key.includes('简谐波')) && key !== '谐波有功功率') {
for (let item of data.rawData[key]) {
let num = formatHarmNum(item.harmNum + '')
let value = rawData.get(key + "_" + num)
if (!value) {
rawData.set(key + "_" + num, [item])
} else {
value.push(item)
}
}
} else {
rawData.set(key, data.rawData[key])
}
}
resTableData.resultData = resultData
resTableData.rawData = rawData
toAngleLast()
if (checkListLevel.length !== 0) {
if (checkListLevel[0].children.length !== 0) {
currentCheckItem.value = [checkListLevel[0].value + '', checkListLevel[0].children[0].value + '']
} else {
currentCheckItem.value = [checkListLevel[0].value + '']
}
}
} else {
checkResultData.length = 0
rawTableData.length = 0
}
}
const doCurrentCheckItemUpdate = (newVal: string) => {
let resCheckResult: CheckData.ResCheckResult = resTableData.resultData.get(newVal)
setCheckResultData(resCheckResult)
let tempRawData = resTableData.rawData.get(newVal)
if (tempRawData) {
setRawData(tempRawData)
} else {
setRawData([])
}
activeTab.value = 'resultTab'
}
const open = async (_deviceId: string, chnNum: string, _scriptType: string | null) => {
planCode = checkStore.plan.code + ''
deviceId = _deviceId
originScriptType = _scriptType
scriptType = _scriptType
// // 发起后端请求,查询详细信息 当chnNum为-1时查询所有通道号
// const {data: resFormContent}: { data: any } = await getFormData({
// planId: checkStore.plan.id,
// deviceId,
// chnNum,
// scriptType
// })
// chnList = resFormContent.chnList.map((item: { value: string, label: string }) => ({
// value: item.value,
// label: item.value
// //label: item.label == '1' ? `${item.value}` : item.label == '2' ? `${item.value}(不符合)` : `${item.value}`
// }))
// Object.assign(formContent, {
// ...resFormContent,
// chnNum: chnList.length > 0 ? chnList[0].value : '',
// })
// originErrorSysId = formContent.errorSysId
// pqErrorList.length = 0
// let {data: resPqErrorList} = await getPqErrSysList()
// Object.assign(pqErrorList, resPqErrorList)
visible.value = true;
}
const handleGenerateReport = async () => {
await generateDevReport({'planId': checkStore.plan.id, 'devIdList': [deviceId],'scriptId':checkStore.plan.scriptId,'planCode':planCode})
ElMessage.success({message: `报告生成成功!`})
}
const handleReCalculate = async () => {
reCalculate({
planId: checkStore.plan.id,
scriptId: checkStore.plan.scriptId,
errorSysId: formContent.errorSysId,
deviceId: deviceId,
code: checkStore.plan.code + ''
}).then((res) => {
ElMessage.success('重新计算成功!')
// if (originErrorSysId != formContent.errorSysId) {
// planCode = checkStore.plan.code + "_temp"
// } else {
// planCode = checkStore.plan.code + ''
// }
if (formContent.chnNum != chnList[0].value) {
formContent.chnNum = chnList[0].value
} else {
handleChnNumChange()
}
})
}
const close = async () => {
//数据清空
Object.assign(formContent, {
scriptName: '',
errorSysName: '',
dataRule: '',
deviceName: '',
chnNum: '',
})
treeDataAll.length = 0
// harmNumList.length = 0
// currentHarmNum.value = '-1'
currentCheckItem.value = ''
checkResultData.length = 0
rawTableData.length = 0
//checkList.length = 0
defaultExpandedKeys = []
checkIndex.value = ''
activeTab.value = 'resultTab'
currentScriptTypeName.value = ''
currentDesc.value = ''
pqErrorList.length = 0
planCode = ''
visible.value = false;
if (checkStore.showDetailType === 1) {
await deleteTempTable(checkStore.plan.code + '')
}
};
const setCheckResultData = (data: CheckData.ResCheckResult | null) => {
let result: CheckData.CheckResult[] = []
if (data == null || data == undefined) {
Object.assign(checkResultData, [])
return
}
if (data.dataA != null && data.dataB != null && data.dataC != null) {
result.push({
// stdA: numberToFixed(data.dataA.resultData),
// dataA: numberToFixed(data.dataA.data),
stdA: dataToShow(data.dataA.resultData),
dataA: dataToShow(data.dataA.data),
errorA: data.dataA.errorData == null ? '/' : data.dataA.errorData + '',
maxErrorA: toMaxErrorStr(data.dataA.radius, data.dataA.unit),
unitA: data.dataA.unit,
isDataA: data.dataA.isData,
// stdB: numberToFixed(data.dataB.resultData),
// dataB: numberToFixed(data.dataB.data),
stdB: dataToShow(data.dataB.resultData),
dataB: dataToShow(data.dataB.data),
errorB: data.dataB.errorData == null ? '/' : data.dataB.errorData + '',
maxErrorB: toMaxErrorStr(data.dataB.radius, data.dataB.unit),
isDataB: data.dataB.isData,
unitB: data.dataB.unit,
// stdC: numberToFixed(data.dataC.resultData),
// dataC: numberToFixed(data.dataC.data),
stdC: dataToShow(data.dataC.resultData),
dataC: dataToShow(data.dataC.data),
errorC: data.dataC.errorData == null ? '/' : data.dataC.errorData + '',
maxErrorC: toMaxErrorStr(data.dataC.radius, data.dataC.unit),
isDataC: data.dataC.isData,
unitC: data.dataC.unit,
maxError: data.radius,
unit: data.unit,
result: data.isData,
})
}
if (data.dataT != null && data.dataA == null && data.dataB == null && data.dataC == null) {
result.push({
// stdT: numberToFixed(data.dataT.resultData),
// dataT: numberToFixed(data.dataT.data),
stdT: dataToShow(data.dataT.resultData),
dataT: dataToShow(data.dataT.data),
errorT: data.dataT.errorData == null ? '/' : data.dataT.errorData + '',
maxErrorT: toMaxErrorStr(data.dataT.radius, data.dataT.unit),
isDataT: data.dataT?.isData,
unitT: data.dataT.unit,
maxError: data.radius,
unit: data.unit,
result: data.isData,
})
}
Object.assign(checkResultData, result)
console.log("检测结果", checkResultData);
}
const exportRawDataHandler = () => {
useDownload(exportRawData, '原始数据', {
scriptType,
scriptId: checkStore.plan.scriptId,
devId: deviceId,
devNum: formContent.chnNum + '',
code: checkStore.plan.code + '',
index: parseInt(checkIndex.value),
}, false, '.xlsx')
}
const formatHarmNum = (num: string) => {
// debugger
if (num.includes('.5')) {
return num
} else {
num = num.replace('.0', '')
return num
}
}
const setRawData = (data: CheckData.RawDataItem[]) => {
data.forEach((item: CheckData.RawDataItem) => {
item.dataA = dataToShow(item.dataA)
item.dataB = dataToShow(item.dataB)
item.dataC = dataToShow(item.dataC)
item.dataT = dataToShow(item.dataT)
})
rawTableData.length = 0
Object.assign(rawTableData, data)
console.log("原始数据", rawTableData)
}
const dataToShow = (num: number): string => {
if (num == null || num == undefined) {
return '/'
}
return num+''
}
const toMaxErrorStr = (oldMaxErroe: any, unit: any) => {
let result = oldMaxErroe ?? '/'
let idx = result.indexOf('~');
if (idx > 0) {
let left = result.substring(0, idx)
let right = result.substring(idx, result.length)
result = left + unit + right + unit;
}
return result;
}
const findFirstLeafNode = (node: any): any => {
if (!node.children || node.children.length === 0) {
return node;
}
return findFirstLeafNode(node.children[0]);
}
const getDefaultNode = (data: any[]) => {
if (!data || data.length === 0) {
return null;
}
const firstElement = data[0];
return findFirstLeafNode(firstElement);
}
const toAngleLast = () => {
let angleIndex = -1
for (let i = 0; i < checkListLevel.length; i++) {
if (checkListLevel[i].value.toString().includes('相角')) {
angleIndex = i
break
}
}
if (angleIndex != -1) {
let temp = checkListLevel[angleIndex]
checkListLevel.splice(angleIndex, 1)
checkListLevel.push(temp)
}
}
const filter = (treeData: any[], fly: number) => {
for (let i = treeData.length - 1; i >= 0; i--) {
let node = treeData[i]
if (node.fly !== fly) {
if (node.children && node.children.length > 0) {
filter(node.children, fly)
// 检查 children 是否被全部移除
if (node.children.length === 0) {
treeData.splice(i, 1);
}
} else {
treeData.splice(i, 1)
}
}
}
}
const updateTreeFly = (treeData: any[], fly: number) => {
// 递归函数
function recursiveUpdate(node: any, targetFly: number) {
//if (!node) return false; // 如果节点不存在,返回 false
// 如果当前节点是叶子节点且 fly 字段等于 targetFly
if (!node.children || node.children.length === 0) {
if (node.fly === targetFly) {
node.fly = targetFly; // 确保叶子节点的 fly 字段被设置为 targetFly
return true; // 返回 true 表示找到并更新了
}
return false; // 否则返回 false
}
// 递归更新子节点
let updated = false;
for (let child of node.children) {
if (recursiveUpdate(child, targetFly)) {
updated = true;
}
}
// 如果有子节点被更新了,则更新当前节点的 fly 字段
if (updated) {
node.fly = targetFly;
}
return updated;
}
for (let i = 0; i < treeData.length; i++) {
// 调用递归函数从根节点开始更新
recursiveUpdate(treeData[i], fly);
}
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
.dialog {
display: flex;
flex-direction: column;
overflow-y: hidden;
overflow-x: hidden;
.data-check-dialog {
display: flex;
flex-direction: column;
overflow-y: hidden;
.data-check-head {
display: flex;
flex-direction: row;
width: 100%;
}
.data-check-body {
height: 500px;
width: 100%;
display: flex;
flex-direction: row;
.content-left-tree {
width: 18%;
display: flex;
flex-direction: column;
align-items: center;
max-height: 495px;
padding: 10px 0.5% 0px 0.5%;
border: 1px solid #ccc;
overflow-y: auto;
overflow-x: auto;
.content-tree {
width: 100%;
height: 100%;
margin-top: 10px;
.custom-tree-node {
overflow-x: hidden !important;
white-space: nowrap !important;
text-overflow: ellipsis !important;
}
}
}
.content-right {
width: 82%;
margin-left: 10px;
flex: 1;
.content-right-title {
display: flex;
padding: 10px 0;
margin-top: 10px;
line-height: 1.5;
.content-right-title-text {
font-size: 14px;
font-weight: bold;
}
}
}
.content-right-Tabs {
box-sizing: border-box;
margin-top: 10px;
margin-bottom: 10px;
max-height: 400px;
}
}
}
}
</style>