正式检测页面修改

This commit is contained in:
caozehui
2024-12-18 18:53:55 +08:00
parent 2715871017
commit 4fd2f10ec6
3 changed files with 1278 additions and 1285 deletions

View File

@@ -1,3 +1,11 @@
export interface DataCheck{
testScriptName: string,
errorSysName: string,
dataRule: string,
deviceName: string,
monitorIdx: string,
}
/**
* 用于定义 查看(设备)通道检测结果 类型
*/

View File

@@ -1,24 +1,43 @@
<template>
<el-dialog title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig">
<el-dialog title="数据查询" :model-value='visible' @close="close" v-bind="dialogBig" draggable style="height: 100%;">
<div class="data-check-dialog">
<div class="data-check-title">
<!-- <el-form-item label='通道号:'>
<el-select v-model="monitorIdx">
<el-option
v-for="item in monitorIdxList"
:key="item.value"
:label="item.value"
:value="item.value"
/>
<div class="data-check-head">
<el-form :model='formContent' label-width="auto" class="form-three ">
<el-form-item label="检测脚本">
<el-input v-model='formContent.testScriptName' :disabled="true"/>
</el-form-item>
<el-form-item label="误差体系">
<el-input v-model='formContent.errorSysName' :disabled="true"/>
</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.monitorIdx">
<el-option v-for="item in monitorIdxList" :key="item.value" :label="item.value"
:value="item.value"/>
</el-select>
</el-form-item> -->
</el-form-item>
</el-form>
</div>
<div class="data-check-content">
<div class="data-check-body">
<div class="content-left-tree">
<div class="content-left-tree-switch">
<el-radio-group v-model="scriptSwitch">
<el-radio-button label="不合格测试项" value="0"/>
<el-radio-button label="全部测试项" value="1"/>
</el-radio-group>
</div>
<div class="content-tree">
<el-tree :default-expanded-keys="['0', '0-1', '0-2', '0-3', '1']" node-key="id" :data="treeData"
:props="defaultProps" @node-click="handleNodeClick"/>
</div>
</div>
<div class="content-right">
<div class="content-right-title">
<el-divider>当前检测项目</el-divider>
@@ -41,67 +60,53 @@
</template>
<script setup lang='ts'>
import IPAddress from '@/components/IpAddress/index.vue'
import {dialogBig, dialogMiddle} from '@/utils/elementBind'
import { type Device } from '@/api/device/interface/device'
import { ElMessage, type FormItemRule } from 'element-plus'
import { addPqDev, updatePqDev } from '@/api/device/device'
import { computed, reactive, type Ref, ref } from 'vue'
import { useDictStore } from '@/stores/modules/dict'
import { CirclePlus, Delete, EditPen } from '@element-plus/icons-vue'
// 使用 dayjs 库格式化
import dayjs from 'dayjs'
import { getPqMonList } from '@/api/device/monitor'
import { type ColumnProps } from '@/components/ProTable/interface'
import { type Monitor } from '@/api/device/interface/monitor'
import { data } from "@/api/plan/autoTest.json";
import {dialogBig} from '@/utils/elementBind'
import {reactive, ref} from 'vue'
import DataCheckResultTable from './dataCheckResultTable.vue'
import DataCheckRawDataTable from './dataCheckRawDataTable.vue'
import type {CheckResult, RawData} from "@/api/check/interface";
import type {CheckResult, DataCheck, RawData} from "@/api/check/interface";
import {data as treeData} from "@/api/plan/autoTest.json";
const activeName = ref('rawDataTab')
const formContent = reactive<DataCheck>({
testScriptName: 'Q/GDW 10650.4-2021 模拟式',
errorSysName: 'Q/GDW 10650.2-2021',
dataRule: '所有值',
deviceName: '被检设备1',
monitorIdx: '1',
})
const activeName = ref('resultTab')
const scriptSwitch = ref('0');
const deviceName = ref('被检设备1');
const monitorIdx = ref('1');
const testScriptName = ref('Q/GDW 10650.4-2021 模拟式');
const errorSysName = ref('Q/GDW 10650.2-2021');
const dataRule = ref('所有值');
const scriptSwitch = ref(true);
const currentScriptDsc = ref('电压准确度检测频率42.5Hz Ua=46.192V 0° Ub=46.192V -120° Uc=46.192V 120° Ia=1A 0° Ib=1A -120° Ic=1A 120°');
const defaultProps = {
children: "children",
label: "name",
pid: "pid",
};
// const monitorIdxList = [
// {
// value: '1',
// },
// {
// value: '2',
// },
// {
// value: '3',
// },
// {
// value: '4',
// },
// ]
const monitorIdxList = [
{
value: '1',
},
{
value: '2 (不合格)',
},
{
value: '3',
},
{
value: '4 (不合格)',
},
]
// const handleNodeClick = (data) => {
// console.log(data);
// };
// const MonIsShow = ref(false)
// const DevIsShow = ref(false)
// const IsPasswordShow = ref(false)
// const dictStore = useDictStore()
// 定义弹出组件元信息
// const dialogFormRef = ref()
// const disabledDate = (time: Date) => {
// return time.getTime() > Date.now()
// }
// 点击左侧树节点触发事件
const handleNodeClick = (data) => {
console.log(data);
};
const checkResultTableData = reactive<CheckResult[]>([
{
@@ -129,6 +134,7 @@ const checkResultTableData = reactive<CheckResult[]>([
result: '合格',
}
])
const rawTableData = reactive<RawData[]>([
{
chnNum: '1',
@@ -527,7 +533,7 @@ const open = (deviceItem:any,chnNum:number) => {
// 数据处理
// checkResultTableData=[];
//formContent.value = ...
visible.value = true;
}
@@ -536,33 +542,47 @@ defineExpose({
open
})
</script>
<style scoped>
<style lang="scss" scoped>
.data-check-dialog {
display: flex;
flex-direction: column;
width: 100%;
}
.data-check-title{
.data-check-head {
display: flex;
flex-direction: row;
margin-top: 5px;
width: 100%;
margin-top: 10px;
}
.data-check-content{
.data-check-body {
display: flex;
flex-direction: row;
width: 100%;
.content-left-tree {
width: 240px;
max-height: 445px;
padding: 10px 0;
border: 1px solid #ccc;
.content-left-tree-switch {
text-align: right;
margin-right: 10px;
}
}
.content-right {
width: 100%;
}
margin-left: 10px;
flex: 1;
.content-right-title {
margin-bottom: 10px;
/*margin-bottom: 10px;*/
div {
font-size: 16px;
font-weight: 600;
}
}
.content-right-Tabs {
@@ -571,4 +591,8 @@ defineExpose({
margin-bottom: 10px;
max-height: 400px;
}
}
}
}
</style>

View File

@@ -1,32 +1,28 @@
<template>
<div class="dialog">
<div class="dialog-title">
<el-progress
style="width: 90%"
:percentage="percentage"
:color="customColors"
/>
:color="customColors"/>
<!-- v-if="!isPause && activeIndex < activeTotalNum" -->
<el-button
type="primary"
v-if="!isPause&&activeIndex < activeTotalNum"
:disabled="activeIndex===0"
:icon="VideoPause"
@click="handlePauseTest"
>暂停检测</el-button
>
@click="handlePauseTest">暂停检测
</el-button>
<el-button type="success" v-if="activeIndex >= activeTotalNum" :icon="Check" disabled>检测完成</el-button>
<el-button
type="warning"
v-if="isPause && activeIndex < activeTotalNum"
:icon="Refresh"
@click="handlePauseTest"
>继续检测</el-button
>
<el-button type="text" :icon="InfoFilled" @click="showTestLog">检测项进度</el-button>
>继续检测
</el-button>
<!-- <el-button
type="warning"
v-if="activeIndex >= activeTotalNum"
@@ -44,7 +40,9 @@
<!-- <el-table :key="tableKey" :data="tableData" :row-class-name="tableRowClassName" row-key="id" height="545px" :header-cell-style="{ background: '#003078', color: '#eee', textAlign: 'center' } " :cell-style="{ textAlign: 'center' }" style="width: 100%" border> -->
<!-- <el-table :data="tableData" :row-class-name="tableRowClassName" row-key="id" height="545px" :header-cell-style="{ background: '#003078', color: '#eee', textAlign: 'center' } " style="width: 100%" border> -->
<div class="dialog-content ">
<el-table :data="tableData" :cell-class-name="tableCell" row-key="id" height="450px" :header-cell-style="{ background: '#003078', color: '#eee', textAlign: 'center' } " style="width: 100%" border>
<el-table :data="tableData" :cell-class-name="tableCell" row-key="id" height="450px"
:header-cell-style="{ background: '#003078', color: '#eee', textAlign: 'center' } " style="width: 100%"
border>
<el-table-column fixed prop="scriptItemName" label="检测项目" width="250px">
<!-- <template #default="scope">
<div :style="{ backgroundColor: '#003078' }">
@@ -54,7 +52,8 @@
</el-table-column>
<template v-if="chnSum<=MAX_CHN_SUM">
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth" align="center">
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth"
align="center">
<!-- <template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
@@ -67,7 +66,8 @@
</el-button>
</el-tooltip>
</template> -->
<el-table-column v-for="(chnItem, index) in item.chnNum" :key="item.deviceID+index" :label="'通道'+(index+1)" align="center">
<el-table-column v-for="(chnItem, index) in item.chnNum" :key="item.deviceID+index"
:label="'通道'+(index+1)" align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
@@ -85,7 +85,8 @@
</template>
<template v-else>
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth" align="center">
<el-table-column v-for="(item) in monitorList" :key="item.deviceID" :label="item.label" :min-width="minwidth"
align="center">
<template #default="scope">
<el-tooltip :content="scope.row.resultType1==='info' ? '暂无数据' : '点击查看详情'" placement="top">
<el-button
@@ -108,7 +109,8 @@
<el-collapse model-value="1" accordion>
<el-collapse-item title="检测项进度" name="1">
<div ref="scrollContainer" class="dialog-log">
<p v-for="(item, index) in testLogList" :key="index" :style="{color:item.type==='error'?'#F56C6C':'var(--el-text-color-regular)'}">
<p v-for="(item, index) in testLogList" :key="index"
:style="{color:item.type==='error'?'#F56C6C':'var(--el-text-color-regular)'}">
{{ item.log }} <br/>
</p>
</div>
@@ -122,18 +124,27 @@
@update:visible="resultDialogVisible = $event"
></resultPopup>
<dataCheckSingleChannelSingleTestPopup ref="dialogRef1"/>
</template>
<script lang="tsx" setup name="test">
import { VideoPause,Refresh,Close,InfoFilled,Check } from '@element-plus/icons-vue'
import {Check, Refresh, VideoPause} from '@element-plus/icons-vue'
import resultPopup from './resultPopup.vue'
import dataCheckSingleChannelSingleTestPopup from './dataCheckSingleChannelSingleTestPopup.vue'
import {reactive} from "vue";
const minwidth = ref(110)
const activeIndex = ref(0)
const activeTotalNum = ref(12)
const dialogRef1 = ref();
const currentRow = ref<{ id: number; scriptItemName: string; name: string; address: string; hasChildren?: boolean; children?: User[] } | null>(null);
const currentRow = ref<{
id: number;
scriptItemName: string;
name: string;
address: string;
hasChildren?: boolean;
children?: User[]
} | null>(null);
// const currentRow = ref(null); // 用于存储当前选中的行
const monitorList = reactive([
@@ -203,13 +214,12 @@ function getItemCheckResult(index:number):boolean{
let items = columnList?.value.filter((item) => item === index.toString())
if(items.length > 0)
{
if (items.length > 0) {
return false
}
else
} else
return true
}
//测试项开始检测时间(或继续检测时间)
const startData = ref(new Date())
//测试项检测结束时间(或暂停时的时间)
@@ -230,13 +240,9 @@ function getTimeDifference(timeDifference:number): string {
const seconds = Math.floor((timeDifference % millisecondsPerMinute) / millisecondsPerSecond);
if (days > 0) {
return `: ${days} 天, ${hours} 小时, ${minutes} 分钟, ${seconds}`
}
else if(hours > 0)
{
} else if (hours > 0) {
return `: ${hours} 小时, ${minutes} 分钟, ${seconds}`
}
else
{
} else {
return `: ${minutes} 分钟, ${seconds}`
}
@@ -245,8 +251,7 @@ function getTimeDifference(timeDifference:number): string {
const updateLog = () => {
const currentTime = ref(new Date().toLocaleString());
switch(activeIndex.value)
{
switch (activeIndex.value) {
case 1:
timeDifference.value = 0;
testLogList.value.length = 0; // 清空数组
@@ -260,15 +265,12 @@ const updateLog = () => {
endData.value = new Date();
const Freqtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += Freqtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':频率准确度检测合格,用时' + getTimeDifference(Freqtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':频率准确度检测不合格,用时' + getTimeDifference(Freqtime),
@@ -280,15 +282,12 @@ const updateLog = () => {
endData.value = new Date();
const VOLtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += VOLtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':电压准确度检测合格,用时' + getTimeDifference(VOLtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':电压准确度检测不合格,用时' + getTimeDifference(VOLtime),
@@ -300,15 +299,12 @@ const updateLog = () => {
endData.value = new Date();
const Harm_Vtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += Harm_Vtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':谐波电压准确度检测合格,用时' + getTimeDifference(Harm_Vtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':谐波电压准确度检测不合格,用时' + getTimeDifference(Harm_Vtime),
@@ -320,15 +316,12 @@ const updateLog = () => {
endData.value = new Date();
const Harm_Itime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += Harm_Itime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':谐波电流准确度检测合格,用时' + getTimeDifference(Harm_Itime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':谐波电流准确度检测不合格,用时' + getTimeDifference(Harm_Itime),
@@ -340,15 +333,12 @@ const updateLog = () => {
endData.value = new Date();
const Harm_Ptime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += Harm_Ptime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':谐波有功功率准确度检测合格,用时' + getTimeDifference(Harm_Ptime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':谐波有功功率准确度检测不合格,用时' + getTimeDifference(Harm_Ptime),
@@ -360,15 +350,12 @@ const updateLog = () => {
endData.value = new Date();
const InHarm_Vtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += InHarm_Vtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':间谐波电压准确度检测合格,用时' + getTimeDifference(InHarm_Vtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':间谐波电压准确度检测不合格,用时' + getTimeDifference(InHarm_Vtime),
@@ -380,15 +367,12 @@ const updateLog = () => {
endData.value = new Date();
const InHarm_Itime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += InHarm_Itime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':间谐波电流准确度检测合格,用时' + getTimeDifference(InHarm_Itime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':间谐波电流准确度检测不合格,用时' + getTimeDifference(InHarm_Itime),
@@ -400,15 +384,12 @@ const updateLog = () => {
endData.value = new Date();
const Diptime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += Diptime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':暂态准确度检测合格,用时' + getTimeDifference(Diptime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':暂态准确度检测不合格,用时' + getTimeDifference(Diptime),
@@ -420,15 +401,12 @@ const updateLog = () => {
endData.value = new Date();
const CURtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += CURtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':电流准确度检测合格,用时' + getTimeDifference(CURtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':电流准确度检测不合格,用时' + getTimeDifference(CURtime),
@@ -440,15 +418,12 @@ const updateLog = () => {
endData.value = new Date();
const MSQI_Utime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += MSQI_Utime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':电压不平衡度检测合格,用时' + getTimeDifference(MSQI_Utime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':电压不平衡度检测不合格,用时' + getTimeDifference(MSQI_Utime),
@@ -460,15 +435,12 @@ const updateLog = () => {
endData.value = new Date();
const MSQI_Itime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += MSQI_Itime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':电流不平衡度检测合格,用时' + getTimeDifference(MSQI_Itime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':电流不平衡度检测不合格,用时' + getTimeDifference(MSQI_Itime),
@@ -480,15 +452,12 @@ const updateLog = () => {
endData.value = new Date();
const FLKtime = endData.value.getTime() - startData.value.getTime();
timeDifference.value += FLKtime
if(getItemCheckResult(activeIndex.value - 1))
{
if (getItemCheckResult(activeIndex.value - 1)) {
testLogList.value.push({
type: 'info',
log: currentTime.value + ':闪变准确度检测合格,用时' + getTimeDifference(FLKtime),
})
}
else
{
} else {
testLogList.value.push({
type: 'error',
log: currentTime.value + ':闪变准确度检测不合格,用时' + getTimeDifference(FLKtime),
@@ -512,18 +481,17 @@ const testLogList = ref([
const columnList = ref([]);
const tableKey = ref(0);
function tableCell({row, columnIndex}) {
let items = columnList?.value.filter((item) => item === row.id)
if(columnIndex === 0 && items.length > 0)
{
if (columnIndex === 0 && items.length > 0) {
console.log(row.id, items.length, columnList?.value)
return 'warning-row'
}
if(columnIndex === 0)
{
if (columnIndex === 0) {
return 'header-row'
}
@@ -558,22 +526,17 @@ function clear() {
function traverseTableData(data: any[], id: string): void {
data.forEach(item => {
// 处理当前节点的数据
if(item.id === id)
{
for(let i = 1;i<=8;i++)
{
if (item.id === id) {
for (let i = 1; i <= 8; i++) {
let field1 = "resultType" + i
let field2 = "resultValue" + i
if(getRandomInt(10)>8 && activeIndex.value>2)
{
if (getRandomInt(10) > 8 && activeIndex.value > 2) {
item[field1] = "danger";
item[field2] = "×";
columnList.value.push(activeIndex.value.toString());
console.log(id, activeIndex.value, columnList.value)
}
else
{
} else {
item[field1] = "success";
item[field2] = "√";
}
@@ -647,6 +610,7 @@ interface User {
hasChildren?: boolean
children?: User[]
}
//resultType2: 'success',
// resultValue2:'√',
// resultType3: 'danger',
@@ -1945,14 +1909,12 @@ const startTimer = () => {
//if (timer.value !== null) return; // 如果定时器已经启动,则不再重复启动
timer.value = setInterval(() => {
if(activeIndex.value <= activeTotalNum.value)
{
if (activeIndex.value <= activeTotalNum.value) {
activeIndex.value++;
updateLog()
switch(activeIndex.value)
{
switch (activeIndex.value) {
case 1:
updateTableData("1-1-1")
updateTableData("1-1-2")
@@ -2010,9 +1972,7 @@ const startTimer = () => {
clear();
}
}
else
{
} else {
clearInterval(timer.value)
timer.value = null;
ts.value = 'success'
@@ -2038,8 +1998,7 @@ const resumeTimer = () => {
//监听goods_sn的变化
watch(testStatus, function (newValue, oldValue) {
ts.value = props.testStatus;
if(ts.value==='start')
{
if (ts.value === 'start') {
ts.value = 'process'
startTimer()
@@ -2063,6 +2022,7 @@ watch(ts, function (newValue, oldValue) {
// font-size:30px;
// --el-table-tr-bg-color: var(--el-color-warning-light-9);
}
:deep(.el-table .warning-row) {
// background-color:var(--el-color-warning-light-9);
//background-color:#bed96557;
@@ -2125,6 +2085,7 @@ watch(ts, function (newValue, oldValue) {
height: 20px !important;
width: 20px !important;
}
:deep(.el-table--default td ) {
padding: 5px 0 !important;
}