ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

联调正式检测

Browse Source
This commit is contained in:
guanj
2025-08-20 20:02:22 +08:00
parent 26647222e2
commit 2aee4b281d
7 changed files with 1461 additions and 1431 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/api/check/interface/index.ts
View File

@@ -103,6 +103,7 @@ export namespace CheckData {
devCurr: number; //设备电流
factorFlag: number; //是否支持系数校准
checkResult:number; //检测结果
chnNumList: object[]; //连线存储数据
}
// 用来描述检测脚本类型

5
frontend/src/stores/modules/check.ts
View File

@@ -14,6 +14,7 @@ export const useCheckStore = defineStore(CHECK_STORE_KEY, {
showDetailType: 0, // 0:数据查询 1:误差体系跟换 2：正式检测
temperature: 0,
humidity: 0,
chnNumList: [],//连线数据
}),
getters: {},
actions: {
@@ -37,6 +38,7 @@ export const useCheckStore = defineStore(CHECK_STORE_KEY, {
this.selectTestItems.test = true
},
setSelectTestItems(selectTestItems: CheckData.SelectTestItem) {
console.log("🚀 ~ setSelectTestItems ~ selectTestItems:", selectTestItems)
this.selectTestItems = selectTestItems
},
setCheckType(checkType: number) {
@@ -54,6 +56,9 @@ export const useCheckStore = defineStore(CHECK_STORE_KEY, {
setHumidity(humidity: number) {
this.humidity = humidity
},
setChnNum(chnNumList: string[]) {
this.chnNumList = chnNumList
},
}
});

3
frontend/src/utils/webSocketClient.ts
View File

@@ -190,7 +190,8 @@ export default class SocketService {
* WebSocket连接配置
*/
private config: SocketConfig = {
url: 'ws://127.0.0.1:7777/hello',
// url: 'ws://127.0.0.1:7777/hello',
url: 'ws://192.168.1.124:7777/hello',
heartbeatInterval: 9000, // 9秒心跳间隔
reconnectDelay: 5000, // 5秒重连延迟
maxReconnectAttempts: 5, // 最多重连5次

1
frontend/src/views/home/components/comparePreTest.vue
View File

@@ -201,7 +201,6 @@ interface DeviceData {
const testDataStructure = ref<Record<string, DeviceData>>({});
watch(webMsgSend, function (newValue, oldValue) {
console.log('webMsgSend', newValue)
if (testStatus.value !== 'waiting') {
if(newValue.code == 25004){
ElMessage.error('接收数据超时！')

648
frontend/src/views/home/components/compareTest.vue
View File

@@ -3,55 +3,87 @@
<div class="dialog" v-bind="dialogBig">
<div class="dialog-title">
<div class="timeView">
<el-icon style="margin: 0px 5px;">
<el-icon style="margin: 0px 5px">
<Clock />
</el-icon>
<span>检测用时：{{ timeView }}</span>
</div>
<el-progress
style="width: 82%; margin-right: 3%;"
:percentage="percentage"
:color="customColors"/>
<el-progress style="width: 82%; margin-right: 3%" :percentage="percentage" :color="customColors" />
<el-button style="width: 10%" type="text" :icon="InfoFilled" @click="showTestLog">检测项进度</el-button>
</div>
{{ checkResultView }}
<div class="dialog-content">
<el-table :data="checkResultView" row-key="scriptType" height="450px"
:header-cell-style="{ background: 'var(--el-color-primary)', color: '#eee', textAlign: 'center' } " style="width: 100%"
border>
<el-table-column fixed prop="scriptName" label="检测项目" width="150px" align="center">
</el-table-column>
<el-table
:data="checkResultView"
row-key="scriptType"
height="450px"
:header-cell-style="{ background: 'var(--el-color-primary)', color: '#eee', textAlign: 'center' }"
style="width: 100%"
border
>
<el-table-column
fixed
prop="scriptName"
label="检测项目"
width="150px"
align="center"
></el-table-column>
<template v-if="chnSum <= MAX_CHN_SUM">
<el-table-column v-for="(item,index1) in deviceList" :key="item.deviceId" :label="item.deviceName"
:min-width="110" align="center">
<el-table-column v-for="(chnItem,index2) in item.chnNum" :key="`${item.deviceId}${chnItem}`"
:label="'通道'+chnItem" align="center">
<el-table-column
v-for="(item, index1) in deviceList"
:key="item.deviceId"
:label="item.deviceName"
:min-width="110"
align="center"
>
<el-table-column
v-for="(chnItem, index2) in checkStore.chnNumList"
:key="`${item.deviceId}${chnItem}`"
:label="'通道' + chnItem.label"
align="center"
>
<template #default="{ row }">
<el-tooltip
:content="row.devices[index1].chnResult[index2].icon==='More' ? '暂无数据'
: row.devices[index1].chnResult[index2].icon==='CircleCheckFilled' ? '符合'
: row.devices[index1].chnResult[index2].icon==='Close' ? '不符合'
: row.devices[index1].chnResult[index2].icon==='WarnTriangleFilled' ? '数据异常'
: row.devices[index1].chnResult[index2].icon==='Loading'? '检测中':'连接中断'"
placement="right">
:content="
row.devices[index1].chnResult[index2].icon === 'More'
? '暂无数据'
: row.devices[index1].chnResult[index2].icon === 'CircleCheckFilled'
? '符合'
: row.devices[index1].chnResult[index2].icon === 'Close'
? '不符合'
: row.devices[index1].chnResult[index2].icon ===
'WarnTriangleFilled'
? '数据异常'
: row.devices[index1].chnResult[index2].icon === 'Loading'
? '检测中'
: '连接中断'
"
placement="right"
>
<el-button
:disabled="row.devices[index1].chnResult[index2].color===CheckData.ButtonColorEnum.INFO || row.devices[index1].chnResult[index2].color===CheckData.ButtonColorEnum.LOADING"
:disabled="
row.devices[index1].chnResult[index2].color ===
CheckData.ButtonColorEnum.INFO ||
row.devices[index1].chnResult[index2].color ===
CheckData.ButtonColorEnum.LOADING
"
:color="row.devices[index1].chnResult[index2].color"
size="small"
@click="handleClick(item, chnItem, row.scriptType)"
style="align-self: center;"
style="align-self: center"
>
<el-icon
v-if="row.devices[index1].chnResult[index2].icon === 'Loading'"
class="loading-box"
style="color: #fff"
>
<el-icon v-if="row.devices[index1].chnResult[index2].icon==='Loading'" class="loading-box"
style="color: #fff">
<component :is="Loading" />
</el-icon>
<el-icon v-else style="color: #fff">
<component :is="row.devices[index1].chnResult[index2].icon" />
</el-icon>
</el-button>
</el-tooltip>
</template>
</el-table-column>
@@ -59,15 +91,24 @@
</template>
</el-table>
</div>
</div>
<div class="drawer-container">
<el-drawer v-model="drawer" title="检测项进度" direction="btt" :size="'38%'">
<div ref="scrollContainerRef" style="height: 100%; overflow-y: auto;">
<p v-for="(item, index) in testLogList"
<div ref="scrollContainerRef" style="height: 100%; overflow-y: auto">
<p
v-for="(item, index) in testLogList"
:key="index"
:style="{color:item.type==='error'?'#F56C6C': item.type==='warning'?'#e6a23c':'var(--el-text-color-regular)'}">
{{ item.log }}<br/>
:style="{
color:
item.type === 'error'
? '#F56C6C'
: item.type === 'warning'
? '#e6a23c'
: 'var(--el-text-color-regular)'
}"
>
{{ item.log }}
<br />
</p>
</div>
</el-drawer>
@@ -79,15 +120,16 @@
<script lang="tsx" setup name="test">
import { InfoFilled, Loading } from '@element-plus/icons-vue'
import CompareDataCheckSingleChannelSingleTestPopup from './compareDataCheckSingleChannelSingleTestPopup.vue'
import {computed, ComputedRef, onBeforeMount, reactive, ref, toRef, watch} from "vue";
import {dialogBig} from "@/utils/elementBind";
import {CheckData} from "@/api/check/interface"
import {useCheckStore} from "@/stores/modules/check";
import {ElMessage, ElMessageBox} from "element-plus";
import {getBigTestItem} from "@/api/check/test";
import {getAutoGenerate} from "@/api/user/login";
import {generateDevReport} from "@/api/plan/plan";
import { computed, ComputedRef, onBeforeMount, reactive, ref, toRef, watch, onMounted } from 'vue'
import { dialogBig } from '@/utils/elementBind'
import { CheckData } from '@/api/check/interface'
import { useCheckStore } from '@/stores/modules/check'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getBigTestItem } from '@/api/check/test'
import { getAutoGenerate } from '@/api/user/login'
import { generateDevReport } from '@/api/plan/plan'
import { useModeStore } from '@/stores/modules/mode' // 引入模式 store
import { useDictStore } from '@/stores/modules/dict'
const checkStore = useCheckStore()
@@ -105,7 +147,7 @@ const props = defineProps({
default: 'waiting'
},
stepsActive: {
type: Number,
type: Number
},
webMsgSend: {
type: Object,
@@ -113,12 +155,19 @@ const props = defineProps({
}
})
const emit = defineEmits(['update:testStatus', 'update:webMsgSend', 'sendPause', 'sendResume', 'sendReCheck', 'closeWebSocket']);
const emit = defineEmits([
'update:testStatus',
'update:webMsgSend',
'sendPause',
'sendResume',
'sendReCheck',
'closeWebSocket'
])
// 用来保存测试项进度抽屉是否打开
const drawer = ref(false)
// 进度条颜色
const customColors = [{color: "#91cc75", percentage: 100}]
const customColors = [{ color: '#91cc75', percentage: 100 }]
// 检测脚本数据
let scriptData: CheckData.ScriptItem[] = []
// 用来保存被检设备
@@ -126,7 +175,7 @@ const deviceList = reactive<CheckData.Device[]>([])
// 当前进行的测试项索引
let activeIndex = 0
// 百分比
const percentage = ref(0);
const percentage = ref(0)
// 时间计数器
let timer: any = null
const timeCount = ref(0)
@@ -139,20 +188,21 @@ const timeDifference = ref(0)
// 真正的检测结果（详细到通道）
const checkResult = reactive<CheckData.ScriptChnItem[]>([])
// 用来存放检测出现失败的测试项id。只要有一个通道检测不合格，则该检测项的id会被加入该数组。
let errorCheckItem: Array<{ scriptType: string, type: CheckData.ChnCheckResultEnum }> = []
let errorCheckItem: Array<{ scriptType: string; type: CheckData.ChnCheckResultEnum }> = []
// 用来存放检测日志
const testLogList = reactive<CheckData.LogItem[]>([{ type: 'info', log: '暂无数据，等待检测开始' }])
const testStatus = toRef(props, 'testStatus')
const webMsgSend = toRef(props, 'webMsgSend')
const scrollContainerRef = ref();
const dataCheckSingleChannelSingleTestPopupRef = ref<InstanceType<typeof CompareDataCheckSingleChannelSingleTestPopup>>()
const scrollContainerRef = ref()
const dataCheckSingleChannelSingleTestPopupRef =
ref<InstanceType<typeof CompareDataCheckSingleChannelSingleTestPopup>>()
// 总通道数
const chnSum = computed(() => {
let sum = 0
deviceList.forEach((item) => {
deviceList.forEach(item => {
sum += item.chnNum
})
return sum
@@ -160,6 +210,8 @@ const chnSum = computed(() => {
// 用来展示的检测结果
const checkResultView: ComputedRef<CheckData.ScriptChnViewItem[]> = computed(() => {
console.log('🚀 ~ tem.devices:', checkResult)
let result: CheckData.ScriptChnViewItem[] = checkResult.map(item => {
let temp: CheckData.ScriptChnViewItem = {
scriptType: item.scriptType,
@@ -175,27 +227,33 @@ const checkResultView: ComputedRef<CheckData.ScriptChnViewItem[]> = computed(()
switch (device.chnResult[j]) {
case CheckData.ChnCheckResultEnum.UNKNOWN:
tempChnBtnResult.push({ color: CheckData.ButtonColorEnum.INFO, icon: 'More' })
break;
break
case CheckData.ChnCheckResultEnum.LOADING:
tempChnBtnResult.push({ color: CheckData.ButtonColorEnum.LOADING, icon: 'Loading' })
break;
break
case CheckData.ChnCheckResultEnum.SUCCESS:
tempChnBtnResult.push({color: CheckData.ButtonColorEnum.SUCCESS, icon: 'CircleCheckFilled'})
break;
tempChnBtnResult.push({
color: CheckData.ButtonColorEnum.SUCCESS,
icon: 'CircleCheckFilled'
})
break
case CheckData.ChnCheckResultEnum.FAIL:
tempChnBtnResult.push({ color: CheckData.ButtonColorEnum.DANGER, icon: 'Close' })
break;
break
case CheckData.ChnCheckResultEnum.TIMEOUT:
tempChnBtnResult.push({ color: CheckData.ButtonColorEnum.WARNING, icon: 'Link' })
break;
break
case CheckData.ChnCheckResultEnum.ERRORDATA:
tempChnBtnResult.push({color: CheckData.ButtonColorEnum.WARNING, icon: 'WarnTriangleFilled'})
break;
tempChnBtnResult.push({
color: CheckData.ButtonColorEnum.WARNING,
icon: 'WarnTriangleFilled'
})
break
case CheckData.ChnCheckResultEnum.NOT_PART_IN_ERROR:
tempChnBtnResult.push({ color: CheckData.ButtonColorEnum.INFO, icon: 'Minus' })
break;
break
default:
break;
break
}
}
}
@@ -212,23 +270,24 @@ const checkResultView: ComputedRef<CheckData.ScriptChnViewItem[]> = computed(()
})
watch(testStatus, function (newValue, oldValue) {
if (newValue == 'start') {
console.log('🚀 ~ newValue:', newValue)
if (newValue == 'start' || newValue == 'waiting') {
if (!checkStore.selectTestItems.preTest && !checkStore.selectTestItems.channelsTest) {
ElMessage.success('初始化开始!')
emit('update:testStatus', 'test_init')
if (checkStore.selectTestItems.test && checkStore.selectTestItems.preTest) {
testLogList.push({ type: 'info', log: `${new Date().toLocaleString()}：初始化开始！` })
}
} else {
emit('update:testStatus', 'process')
}
// 开始计时
startTimeCount()
showTestLog()
//startTimer() // todo 可移除
startData.value = new Date();
timeDifference.value = 0;
}
if (newValue == 'recheck' || newValue == 'error' || newValue == 'test_init_fail' || newValue == 'connect_timeout' || newValue == 'pause_timeout' || oldValue == 'error_flow_end') {
startData.value = new Date()
timeDifference.value = 0
} else if (newValue == 'error') {
stopTimeCount()
}
})
@@ -236,284 +295,68 @@ watch(testStatus, function (newValue, oldValue) {
// 次数
let count = 0
watch(webMsgSend, function (newValue, oldValue) {
console.log('webMsgSend', newValue)
if (testStatus.value !== 'waiting') {
handleStartItem('V', 'newValue.desc')
if (props.stepsActive === 4) {
switch (newValue.requestId) {
case 'server_error':
if (newValue.operateCode === 'server_error' && count === 0) {
ElMessageBox.alert('服务端主动关闭连接!', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：服务端主动关闭连接！`})
emit('update:testStatus', 'test_init_fail')
count++
}
break;
case 'device_error':
if (newValue.operateCode === 'device_error' && count === 0) {
ElMessageBox.alert('设备端主动关闭连接!', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：设备端主动关闭连接！`})
emit('update:testStatus', 'test_init_fail')
count++
}
break;
case 'formal_real': // 正式测试
switch (newValue.operateCode) {
case "stop_timeout":
ElMessageBox.alert(`暂停时间已过10分钟，本次检测已失效，请重新发起检测！`, '暂停时间过长', {
confirmButtonText: '确定',
type: 'error',
})
emit('update:testStatus', 'pause_timeout')
break;
}
break;
case 'error_flow_end':
ElMessageBox.alert(`当前流程存在异常结束！`, '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
emit('update:testStatus', 'test_init_fail')
break
case 'socket_timeout':
switch (newValue.operateCode) {
case "VOLTAGE":
// todo 超时处理 页面按钮更新
ElMessageBox.alert('连接超时！', '连接超时', {
confirmButtonText: '确定',
type: 'error',
})
emit('update:testStatus', 'connect_timeout')
break;
}
break;
case 'connect':
switch (newValue.operateCode) {
case "Source":
ElMessageBox.alert('源通讯失败，请检查源连接情况！', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：源通讯失败！`})
break;
case "Dev":
ElMessageBox.alert('设备通讯失败，请检查设备连接情况！', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：设备通讯失败！`})
break;
}
emit('update:testStatus', 'test_init_fail')
break;
case 'yjc_ytxjy':
switch (newValue.operateCode) {
case 'INIT_GATHER':
if (newValue.code == 10200) {
testLogList.push({type: 'info', log: `${new Date().toLocaleString()}：源初始化成功！`})
percentage.value = 1
}
if (newValue.code == -1) {
ElMessageBox.alert('源未知异常！', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：源未知异常！`})
emit('update:testStatus', 'test_init_fail')
}
break;
}
break;
case 'yjc_sbtxjy':
switch (newValue.operateCode) {
case 'INIT_GATHER$01':
if (newValue.code == 25001) {
testLogList.push({type: 'info', log: `${new Date().toLocaleString()}：设备通讯校验成功！`})
percentage.value = 2
}
break
}
break;
case 'yjc_xyjy':
switch (newValue.operateCode) {
case 'VERIFY_MAPPING$01':
if (newValue.code == 25001) {
ElMessage.success('初始化成功!')
testLogList.push({type: 'info', log: `${new Date().toLocaleString()}：协议校验成功！`})
timeDifference.value = +new Date().getTime() - startData.value.getTime();
testLogList.push({type: 'info', log: `${new Date().toLocaleString()}：初始化成功！`})
percentage.value = 3
activeIndex = getNextActiveIndex() + 2
//startTimer()
emit('update:testStatus', 'process')
} else if (newValue.code == 10200) {
let data = JSON.parse(newValue.data)
ElMessageBox.alert(`脚本与icd校验失败！icd名称：${data['icdType']} -> 校验项：${data['dataType']}`, '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({
type: 'error',
log: `${new Date().toLocaleString()}：脚本与icd校验失败！icd名称：${data['icdType']} -> 校验项：${data['dataType']}`
})
emit('update:testStatus', 'test_init_fail')
} else if (newValue.code == 10500) {
ElMessageBox.alert(`装置中未找到该icd！`, '初始化失败', {
confirmButtonText: '确定',
type: 'error',
})
testLogList.push({
type: 'error',
log: `${new Date().toLocaleString()}：装置中未找到该icd！`
})
emit('update:testStatus', 'test_init_fail')
}
break;
}
break;
case 'preStopTest':
if (newValue.operateCode == 'stop') {
ElMessage.success('暂停成功')
emit('update:testStatus', 'paused')
pauseSuccessCallback()
}
break;
case 'Resume_Success':
ElMessage.success('开始继续检测')
emit('update:testStatus', 'process')
handleResumeTest()
break;
case 'FREQ_Start':
handleStartItem('FREQ', newValue.desc)
break;
case 'FREQ_End':
handleEndItem('FREQ', newValue.desc, newValue.data)
break;
case 'V_Start':
handleStartItem('V', newValue.desc)
break;
case 'V_End':
handleEndItem('V', newValue.desc, newValue.data)
break;
case 'HV_Start':
handleStartItem('HV', newValue.desc)
break;
case 'HV_End':
handleEndItem('HV', newValue.desc, newValue.data)
break;
case 'HI_Start':
handleStartItem('HI', newValue.desc)
break;
case 'HI_End':
handleEndItem('HI', newValue.desc, newValue.data)
break;
case 'HP_Start':
handleStartItem('HP', newValue.desc)
break;
case 'HP_End':
handleEndItem('HP', newValue.desc, newValue.data)
break;
case 'HSV_Start':
handleStartItem('HSV', newValue.desc)
break;
case 'HSV_End':
handleEndItem('HSV', newValue.desc, newValue.data)
break;
case 'HSI_Start':
handleStartItem('HSI', newValue.desc)
break;
case 'HSI_End':
handleEndItem('HSI', newValue.desc, newValue.data)
break;
case 'VOLTAGE_Start':
handleStartItem('VOLTAGE', newValue.desc)
break;
case 'VOLTAGE_End':
handleEndItem('VOLTAGE', newValue.desc, newValue.data)
break;
case 'I_Start':
handleStartItem('I', newValue.desc)
break;
case 'I_End':
handleEndItem('I', newValue.desc, newValue.data)
break;
case 'IMBV_Start':
handleStartItem('IMBV', newValue.desc)
break;
case 'IMBV_End':
handleEndItem('IMBV', newValue.desc, newValue.data)
break;
case 'IMBA_Start':
handleStartItem('IMBA', newValue.desc)
break;
case 'IMBA_End':
handleEndItem('IMBA', newValue.desc, newValue.data)
break;
case 'F_Start':
handleStartItem('F', newValue.desc)
break;
case 'F_End':
handleEndItem('F', newValue.desc, newValue.data)
break;
case 'Quit':
console.log('检测结束')
break;
}
}
}
}, {deep: true})
const handleStartItem = (code: string, desc: string | undefined) => {
if (desc === undefined) {
console.log('开始检测项：', code)
updateCheckResultView(code, true) // 更新界面为加载状态
watch(
webMsgSend,
function (newValue, oldValue) {
if (testStatus.value == 'test_init') {
// 正式检测
} else {
// 子测试项开始
testLogList.push({ type: 'info', log: `${new Date().toLocaleString()}：${desc}准确度检测：开始` })
}
// 预监测 正式检测
if (newValue.requestId == 'formal_real') {
switch (newValue.code) {
case 25001:
let result: CheckData.ScriptChnItem[] = []
scriptData.forEach(item => {
// 处理当前节点的数据
let temp: CheckData.ScriptChnItem = {
scriptType: item.id,
scriptName: item.scriptName,
devices: []
}
let message=JSON.parse(newValue.data)
const handleEndItem = (code: string, desc: string | undefined, devices: CheckData.DeviceCheckResult[] = []) => {
if (desc === undefined) {
for (let i = 0; i < message?.length; i++) {
temp.devices.push({
deviceId: message[i].deviceId,
deviceName: message[i].deviceName,
chnResult: message[i].chnResult
})
}
result.push(temp)
})
console.log("🚀 ~ result:", result)
Object.assign(checkResult, result)
stopTimeCount()
break
default:
if (newValue.code != 10201) {
testLogList.push({
type: newValue.code == 10200 ? 'info' : 'error',
log: `${new Date().toLocaleString()}：` + newValue.data
})
if (newValue.code == 25003) {
stopTimeCount()
}
updatePercentage()
updateCheckResultView(code, false, devices)
updateLog(false)
if (testStatus.value != 'paused') {
activeIndex = getNextActiveIndex(code)
//startTimer()
}
} else {
let result = getResult(devices)
// if (desc.length > 150) {
// desc = desc.substring(0, 150) + '...'
// }
if (result === 1) {
testLogList.push({type: 'info', log: `${new Date().toLocaleString()}：${desc}检测结束：符合`})
}
if (result === 2) {
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：${desc}检测结束：不符合`})
}
if (result === 4) {
testLogList.push({type: 'warning', log: `${new Date().toLocaleString()}：${desc}检测结束：数据异常`})
break
}
}
}
},
{ deep: true }
)
// 更新进度条
const updatePercentage = async () => {
if (activeIndex < checkTotal) {
percentage.value = Math.trunc(activeIndex / checkTotal * 100);
if (testLogList.length - 1 < checkStore.chnNumList.length) {
percentage.value = Math.trunc(((testLogList.length - 1) / checkStore.chnNumList.length) * 100)
} else {
percentage.value = 100;
percentage.value = 100
emit('update:testStatus', 'success')
let { data: autoGenerate } = await getAutoGenerate()
@@ -523,27 +366,62 @@ const updatePercentage = async () => {
return item.deviceId
})
await generateDevReport({
'planId': checkStore.plan.id,
'devIdList': devIdList,
'scriptId': checkStore.plan.scriptId,
'planCode': checkStore.plan.code + ''
})
// await generateDevReport({
// planId: checkStore.plan.id,
// devIdList: devIdList,
// scriptId: checkStore.plan.scriptId,
// planCode: checkStore.plan.code + ''
// })
}
ElMessageBox.alert('检测全部结束,你可以停留在此页面查看检测结果，或返回首页进行复检、报告生成和归档等操作', '检测完成', {
confirmButtonText: '确定',
})
stopTimeCount()
ElMessageBox.alert(
'检测全部结束,你可以停留在此页面查看检测结果，或返回首页进行复检、报告生成和归档等操作',
'检测完成',
{
confirmButtonText: '确定'
}
)
// 关闭WebSocket连接
emit('closeWebSocket')
//clear();
}
}
// ========== 时间计数器管理函数 ==========
// 开始计时
const startTimeCount = () => {
if (!timer) {
timer = setInterval(() => {
timeCount.value = timeCount.value + 1
timeView.value = secondToTime(timeCount.value)
}, 1000)
}
}
// 停止计时
const stopTimeCount = () => {
if (timer) {
clearInterval(timer)
timer = null
}
}
// 将秒数转换为 HH:MM:SS 格式
const secondToTime = (second: number) => {
let h: string | number = Math.floor(second / 3600) // 小时
let m: string | number = Math.floor((second - h * 3600) / 60) // 分钟
let s: string | number = Math.floor(second % 60) // 秒
// 补齐前导零
h = h < 10 ? '0' + h : h
m = m < 10 ? '0' + m : m
s = s < 10 ? '0' + s : s
return h + ':' + m + ':' + s
}
onBeforeMount(async () => {
await initScriptData()
initDeviceList()
initCheckResult()
})
const showTestLog = () => {
@@ -552,7 +430,7 @@ const showTestLog = () => {
// 初始化检测脚本数据
const initScriptData = async () => {
const pattern = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id ?? '';
const pattern = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id ?? ''
let response: any = await getBigTestItem({
reCheckType: checkStore.reCheckType,
planId: checkStore.plan.id,
@@ -564,14 +442,13 @@ const initScriptData = async () => {
let temp = response.data.map((item: any) => {
return {
...item,
scriptName: item.scriptName,
scriptName: item.scriptName
}
})
// 保存脚本数据并设置总数
scriptData.push(...temp)
checkTotal = scriptData.length
}
// 初始化设备列表
const initDeviceList = () => {
@@ -588,9 +465,10 @@ const initCheckResult = () => {
scriptName: item.scriptName,
devices: []
}
for (let i = 0; i < deviceList?.length; i++) {
let tempChnResult: CheckData.ChnCheckResultEnum[] = []
for (let j = 0; j < deviceList[i].chnNum; j++) {
for (let j = 0; j < checkStore.chnNumList.length; j++) {
tempChnResult.push(CheckData.ChnCheckResultEnum.UNKNOWN)
}
temp.devices.push({
@@ -601,11 +479,13 @@ const initCheckResult = () => {
}
result.push(temp)
})
Object.assign(checkResult, result)
}
// 更新检测结果（详细到通道）
const updateCheckResult = (data: CheckData.ScriptChnItem) => {
console.log('🚀 ~ updateCheckResult ~ data:', data)
const { scriptType } = { ...data }
checkResult.forEach(item => {
@@ -622,16 +502,17 @@ const updateCheckResult = (data: CheckData.ScriptChnItem) => {
const scrollToBottom = () => {
if (scrollContainerRef.value) {
scrollContainerRef.value.scrollTop = scrollContainerRef.value.scrollHeight + 70;
scrollContainerRef.value.scrollTop = scrollContainerRef.value.scrollHeight + 70
}
}
};
watch(testLogList, () => {
scrollToBottom();
}, {deep: true})
watch(
testLogList,
() => {
scrollToBottom()
},
{ deep: true }
)
const setErrorCheckItem = (scriptType: string, devices: CheckData.DeviceCheckResult[]) => {
let type = 1
@@ -652,11 +533,11 @@ const setErrorCheckItem = (scriptType: string, devices: CheckData.DeviceCheckRes
if (devices[i].chnResult.some(item => item === CheckData.ChnCheckResultEnum.TIMEOUT)) {
testLogList.push({
type: 'warning',
log: `${new Date().toLocaleString()} ：${devices[i].deviceName}连接超时`,
log: `${new Date().toLocaleString()} ：${devices[i].deviceName}连接超时`
})
ElMessageBox.alert('连接超时！', '连接超时', {
confirmButtonText: '确定',
type: 'error',
type: 'error'
})
emit('update:testStatus', 'connect_timeout')
}
@@ -666,8 +547,6 @@ const setErrorCheckItem = (scriptType: string, devices: CheckData.DeviceCheckRes
errorCheckItem.push({ scriptType, type: type })
}
const updateCheckResultView = (scriptCode: string, isStart: boolean, devices: CheckData.DeviceCheckResult[] = []) => {
let scriptType = scriptData.filter(item => item.code === scriptCode)[0]?.id
let temp = null
@@ -681,14 +560,13 @@ const updateCheckResultView = (scriptCode: string, isStart: boolean, devices: Ch
}
}
updateCheckResult(temp)
};
}
// 获取loading状态的结果
const getLoadingResult = (scriptType: string) => {
let devices = []
devices = deviceList.map(item => {
let tempChnResult: CheckData.ChnCheckResultEnum[] = []
for (let i = 0; i < item.chnNum; i++) {
tempChnResult.push(CheckData.ChnCheckResultEnum.LOADING)
@@ -697,19 +575,18 @@ const getLoadingResult = (scriptType: string) => {
return {
deviceId: item.deviceId,
deviceName: item.deviceName,
chnResult: tempChnResult,
chnResult: tempChnResult
}
})
let tempScriptChnItem: CheckData.ScriptChnItem = {
scriptType,
devices,
devices
}
return tempScriptChnItem
}
const getResult = (devices: CheckData.DeviceCheckResult[] = []) => {
let type = 1
let tempChnResult: CheckData.ChnCheckResultEnum[] = []
@@ -726,7 +603,6 @@ const getResult = (devices: CheckData.DeviceCheckResult[] = []) => {
return type
}
// 点击查看（设备）通道检测详情。参数1：设备信息，参数2：通道号，-1：代表查看全部通道
const handleClick = (item: any, chnNum: number, scriptType: string) => {
// let checkResultItem = checkResult.find(obj => obj.scriptType === scriptType)
@@ -762,46 +638,56 @@ const handleClick = (item: any, chnNum: number, scriptType: string) => {
// if (flag === -1 || flag === 1) {
// checkStore.setShowDetailType(2)
console.log('handleTest', item.deviceId, chnNum, scriptType)
dataCheckSingleChannelSingleTestPopupRef.value?.open(item.deviceId, chnNum + '', scriptType);
dataCheckSingleChannelSingleTestPopupRef.value?.open(item.deviceId, chnNum + '', scriptType)
//}
};
}
const handlePause = () => {
//emit('sendPause')
testLogList.push({type: 'error', log: `${new Date().toLocaleString()}：当前测试小项正在执行中，将在该小项执行结束后暂停...`})
testLogList.push({
type: 'error',
log: `${new Date().toLocaleString()}：当前测试小项正在执行中，将在该小项执行结束后暂停...`
})
}
const initializeParameters = () => {
percentage.value = 0
testLogList.splice(0, testLogList.length, { type: 'info', log: '暂无数据，等待检测开始' })
}
const pauseSuccessCallback = () => {
endData.value = new Date();
let diffTime = endData.value.getTime() - startData.value.getTime();
endData.value = new Date()
let diffTime = endData.value.getTime() - startData.value.getTime()
timeDifference.value += diffTime
testLogList.push({
type: 'info',
log: `${new Date().toLocaleString()}：暂停检测`,
log: `${new Date().toLocaleString()}：暂停检测`
})
stopTimeCount()
console.log('暂停中')
};
console.log('暂停中')
}
const handleResumeTest = () => {
//activeIndex++
startData.value = new Date();
startData.value = new Date()
testLogList.push({ type: 'info', log: `${new Date().toLocaleString()}：开始重新检测！` })
//startTimer()
resumeTimeCount()
console.log('开始继续检测')
};
}
//
onMounted(() => {
initializeParameters()
})
defineExpose({
handlePause
initializeParameters,
handlePause,
showTestLog,
startTimeCount
})
</script>
<style scoped lang="scss">
:deep(.el-table .header-row) {
background-color: #f5f7fa;
}
@@ -810,8 +696,6 @@ defineExpose({
color: red;
}
.el-table .success-row {
--el-table-tr-bg-color: var(--el-color-success-light-9);
}
@@ -824,7 +708,6 @@ defineExpose({
}
.dialog-title {
display: flex;
justify-content: space-between;
align-items: center;
@@ -889,7 +772,6 @@ defineExpose({
transform: rotate(360deg);
}
}
</style>
<style lang="scss" scoped>
@@ -901,6 +783,4 @@ defineExpose({
:deep(.el-table--default td) {
padding: 5px 0 !important;
}
</style>

335
frontend/src/views/home/components/compareTestPopup.vue
View File

@@ -1,106 +1,172 @@
<template>
<el-dialog :title="dialogTitle" width="1550px" :model-value="dialogVisible" :before-close="beforeClose" @close="handleClose" height="1000px" draggable>
<el-dialog
:title="dialogTitle"
width="1550px"
:model-value="dialogVisible"
:before-close="beforeClose"
@close="handleClose"
height="1000px"
draggable
>
<div class="steps-container">
<el-steps v-if="showSteps" class="test-head-steps" simple :active="stepsActiveIndex" process-status="finish" finish-status="success">
<el-step v-if="preTestSelected" title="预检测" :icon="stepsActive > 1 || stepsActiveIndex > stepsTotalNum - 1? SuccessFilled : Edit" @click="handleStepClick(1)"/>
<el-steps
v-if="showSteps"
class="test-head-steps"
simple
:active="stepsActiveIndex"
process-status="finish"
finish-status="success"
>
<el-step
v-if="preTestSelected"
title="预检测"
:icon="stepsActive > 1 || stepsActiveIndex > stepsTotalNum - 1 ? SuccessFilled : Edit"
@click="handleStepClick(1)"
/>
<el-step v-if="testSelected" title="正式检测" :icon="stepsActive > 2 || stepsActiveIndex > stepsTotalNum - 1? SuccessFilled : Coin" @click="handleStepClick(2)"/>
<el-step
v-if="testSelected"
title="正式检测"
:icon="stepsActive > 2 || stepsActiveIndex > stepsTotalNum - 1 ? SuccessFilled : Coin"
@click="handleStepClick(2)"
/>
<el-step title="检测完成" :icon="stepsActiveIndex > stepsTotalNum - 1 ? SuccessFilled : Key" />
</el-steps>
</div>
<keep-alive>
<ComparePreTest v-if="preTestSelected && stepsActiveView==1" ref="preTestRef" v-model:testStatus="preTestStatus"
:webMsgSend="webMsgSend" :mapping = "channelMapping"/>
<ComparePreTest
v-if="preTestSelected && stepsActiveView == 1"
ref="preTestRef"
v-model:testStatus="preTestStatus"
:webMsgSend="webMsgSend"
:mapping="channelMapping"
/>
</keep-alive>
<keep-alive>
<CompareTest v-if="testSelected && stepsActiveView==2" ref="testRef" v-model:testStatus="TestStatus"
:stepsActive="stepsActive"/>
<CompareTest
v-if="testSelected && stepsActiveView == 2"
ref="testRef"
:webMsgSend="webMsgSend"
v-model:testStatus="TestStatus"
:stepsActive="stepsActive"
/>
</keep-alive>
<template #footer>
<div>
<el-button type="primary" :icon="VideoPlay" v-if="ActiveStatue === 'waiting'" @click="handleSubmitFast">开始检测</el-button>
<el-button
type="primary"
:icon="VideoPlay"
v-if="ActiveStatue === 'waiting' && !(testSelected && stepsActiveIndex == 2)"
@click="handleSubmitFast"
>
开始检测
</el-button>
<el-button type="primary" v-if="TestStatus === 'test_init'" disabled>
<el-icon class="loading-box" style="color: #fff;margin-right: 8px;">
<el-icon class="loading-box" style="color: #fff; margin-right: 8px">
<component :is="Refresh" />
</el-icon>
初始化中
</el-button>
<el-button
type="primary"
v-if="TestStatus=='process'"
:icon="VideoPause"
@click="handlePause()">停止检测
<el-button type="primary" v-if="TestStatus == 'process'" :icon="VideoPause" @click="handlePause()">
停止检测
</el-button>
<el-button type="warning" v-if="TestStatus === 'paused_ing'" disabled>
<el-icon class="loading-box" style="color: #fff;margin-right: 8px;">
<el-icon class="loading-box" style="color: #fff; margin-right: 8px">
<component :is="Refresh" />
</el-icon>
暂停中
</el-button>
<el-button type="warning" v-if="TestStatus == 'paused'" :icon="VideoPlay" @click="sendResume">
继续检测
</el-button>
<el-button
type="warning"
v-if="(TestStatus =='paused')"
:icon="VideoPlay"
@click="sendResume"
>继续检测
v-if="
nextStepText !== '下一步' &&
(ActiveStatue === 'success' ||
ActiveStatue === 'error' ||
ActiveStatue === 'test_init_fail' ||
ActiveStatue === 'connect_timeout' ||
ActiveStatue === 'pause_timeout' ||
ActiveStatue === 'waiting')
"
@click="handleSubmitAgain"
>
重新检测
</el-button>
<el-button type="warning" :icon="VideoPlay"
v-if="nextStepText !== '下一步' && (ActiveStatue === 'success'||ActiveStatue==='error'||ActiveStatue==='test_init_fail'||ActiveStatue==='connect_timeout'||ActiveStatue==='pause_timeout')"
@click="handleSubmitAgain">重新检测
</el-button>
<el-button :type="ActiveStatue==='success'?'primary':'danger'" :icon="Right"
v-if="nextStepText !== '下一步' && (ActiveStatue === 'success'||ActiveStatue==='error'||ActiveStatue==='test_init_fail'||ActiveStatue==='connect_timeout'||ActiveStatue==='pause_timeout')"
@click="nextStep">
<el-button
:type="ActiveStatue === 'success' ? 'primary' : 'danger'"
:icon="Right"
v-if="
nextStepText !== '下一步' &&
(ActiveStatue === 'success' ||
ActiveStatue === 'error' ||
ActiveStatue === 'test_init_fail' ||
ActiveStatue === 'connect_timeout' ||
ActiveStatue === 'pause_timeout')
"
@click="nextStep"
>
{{ nextStepText }}
</el-button>
<el-button type="primary" @click="handleQuit" v-else>
退出检测
</el-button>
<el-button type="primary" @click="handleQuit" v-else>退出检测</el-button>
</div>
</template>
</el-dialog>
</template>
<script lang="tsx" setup name="testPopup">
import {nextTick, reactive, ref, watch} from 'vue';
import { nextTick, reactive, ref, watch } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import {Coin, Edit, Key, Odometer, Refresh, Right, SuccessFilled, UploadFilled, VideoPause, VideoPlay} from '@element-plus/icons-vue'
import {
Coin,
Edit,
Key,
Odometer,
Refresh,
Right,
SuccessFilled,
UploadFilled,
VideoPause,
VideoPlay
} from '@element-plus/icons-vue'
import ComparePreTest from './comparePreTest.vue'
import CompareTest from './compareTest.vue'
import socketClient from '@/utils/webSocketClient';
import {useCheckStore} from "@/stores/modules/check";
import socketClient from '@/utils/webSocketClient'
import { useCheckStore } from '@/stores/modules/check'
import { pauseTest, resumeTest, startPreTest, contrastTest } from '@/api/socket/socket'
import {useUserStore} from "@/stores/modules/user";
import {JwtUtil} from "@/utils/jwtUtil";
import { useUserStore } from '@/stores/modules/user'
import { JwtUtil } from '@/utils/jwtUtil'
// import {JwtUtil} from "@/utils/check";
const userStore = useUserStore()
const checkStore = useCheckStore();
const nextStepText = ref('下一步');
const checkStore = useCheckStore()
const nextStepText = ref('下一步')
const dialogVisible = ref(false)
const showSteps = ref(false)
const stepsTotalNum = ref(-1);//步骤总数
const stepsActiveIndex = ref(1); //当前正在执行的步骤索引
const stepsActiveView = ref(1); //当前正在执行的步骤在（预处理、守时校验、系数校准、正式检测）中的排序，仅用于页面显示
const stepsActive = ref(-1); //当前正在执行的步骤在（预处理、守时校验、系数校准、正式检测）中的排序，实际记录步骤的状态，用于切换步骤
const ActiveStatue = ref('waiting');//当前步骤状态
const preTestStatus = ref('waiting');//预检测执行状态
const TestStatus = ref('waiting');//正式检测执行状态
const webMsgSend = ref();//webSocket推送的数据
const stepsTotalNum = ref(-1) //步骤总数
const stepsActiveIndex = ref(1) //当前正在执行的步骤索引
const stepsActiveView = ref(1) //当前正在执行的步骤在（预处理、守时校验、系数校准、正式检测）中的排序，仅用于页面显示
const stepsActive = ref(-1) //当前正在执行的步骤在（预处理、守时校验、系数校准、正式检测）中的排序，实际记录步骤的状态，用于切换步骤
const ActiveStatue = ref('waiting') //当前步骤状态
const preTestStatus = ref('waiting') //预检测执行状态
const TestStatus = ref('waiting') //正式检测执行状态
const webMsgSend = ref() //webSocket推送的数据
const dialogTitle = ref('')
const showComponent = ref(true)
const preTestRef = ref<InstanceType<typeof ComparePreTest> | null>(null)
const testRef = ref(null)
const testRef: any = ref(null)
const dataSocket = reactive({
socketServe: socketClient.Instance,
});
socketServe: socketClient.Instance
})
// 勾选的检测内容
const preTestSelected = ref(true)
@@ -146,7 +212,15 @@ const standardDevIds = ref<[]>()
const pairs = ref<any>()
const testAgain = ref(false) //重新检测按钮是否显示
const checkNumber = ref(0) //检测次数
const open = async (title: string,mapping:any,plan: string,login: string,devIdsArray: [],standardDevIdsArray: [],pair:any) => {
const open = async (
title: string,
mapping: any,
plan: string,
login: string,
devIdsArray: [],
standardDevIdsArray: [],
pair: any
) => {
if (checkStore.selectTestItems.preTest && !checkStore.selectTestItems.test) {
testAgain.value = true
}
@@ -158,21 +232,21 @@ const open = async (title: string,mapping:any,plan: string,login: string,devIdsA
pairs.value = pair
showSteps.value = true
initOperate()
dialogTitle.value = title;
dialogVisible.value = true;
dialogTitle.value = title
dialogVisible.value = true
// 等待组件渲染完成
await nextTick();
await nextTick()
if (preTestRef.value) {
preTestRef.value.initializeParameters();
preTestRef.value.initializeParameters()
}
//开始创建webSocket客户端
socketClient.Instance.connect();
dataSocket.socketServe = socketClient.Instance;
dataSocket.socketServe.registerCallBack('aaa', (res: { code: number; }) => {
console.log('Received message:', res)
socketClient.Instance.connect()
dataSocket.socketServe = socketClient.Instance
dataSocket.socketServe.registerCallBack('aaa', (res: { code: number }) => {
// console.log('Received message:', res)
// 处理来自服务器的消息
if (res.code === 20000) {
//ElMessage.error(message.message)
@@ -180,7 +254,7 @@ const open = async (title: string,mapping:any,plan: string,login: string,devIdsA
} else {
webMsgSend.value = res
}
});
})
}
//预检测-重新检测
@@ -198,12 +272,15 @@ const handleSubmitAgain = async () => {
// 通知子组件清空并重新初始化
if (preTestRef.value) {
preTestRef.value.initializeParameters();
preTestRef.value.initializeParameters()
}
testRef.value && testRef.value.initializeParameters()
// 重置状态
nextStepText.value = '下一步'
ActiveStatue.value = 'waiting'
preTestStatus.value = 'waiting'
TestStatus.value = 'waiting'
await contrastTest({
planId: planId.value,
@@ -212,11 +289,12 @@ const handleSubmitAgain = async () => {
standardDevIds: standardDevIds.value,
pairs: pairs.value,
testItemList: [checkStore.selectTestItems.preTest, false, checkStore.selectTestItems.test],
userId: userStore.userInfo.id,
userId: userStore.userInfo.id
})
preTestStatus.value = 'start'
};
}
//开始检测
const handleSubmitFast = async () => {
@@ -236,14 +314,19 @@ const handleSubmitFast = async () => {
standardDevIds: standardDevIds.value,
pairs: pairs.value,
testItemList: [checkStore.selectTestItems.preTest, false, checkStore.selectTestItems.test],
userId: userStore.userInfo.id,
userId: userStore.userInfo.id
})
preTestStatus.value = 'start'
if (checkStore.selectTestItems.test) {
testRef.value.initializeParameters()
testRef.value.showTestLog()
}
}
break;
}
break
case 2:
if (TestStatus.value == "waiting") {
if (TestStatus.value == 'waiting') {
// 如果没有预检测,直接进行正式检测需要先初始化
if (!checkStore.selectTestItems.preTest && checkStore.selectTestItems.test) {
await contrastTest({
@@ -253,7 +336,8 @@ const handleSubmitFast = async () => {
standardDevIds: standardDevIds.value,
pairs: pairs.value,
testItemList: [checkStore.selectTestItems.preTest, false, checkStore.selectTestItems.test],
userId: userStore.userInfo.id,
userId: userStore.userInfo.id
})
}
TestStatus.value = 'start'
@@ -261,37 +345,47 @@ const handleSubmitFast = async () => {
// 发送继续指令
//sendResume()
}
break;
break
default:
break;
break
}
}
const emit = defineEmits<{
(e: 'quitClicked'): void;
}>();
(e: 'quitClicked'): void
}>()
watch(preTestStatus, function (newValue, oldValue) {
console.log('预检测状态',newValue, oldValue);
console.log('预检测状态', newValue, oldValue)
ActiveStatue.value = newValue
})
watch(TestStatus, function (newValue, oldValue) {
console.log('正式检测状态',newValue, oldValue);
console.log('正式检测状态', newValue, oldValue)
ActiveStatue.value = newValue
})
watch(stepsActiveIndex, function (newValue, oldValue) {
console.log('步骤索引',newValue, oldValue);
console.log(
'🚀 ~ checkStore.selectTestItems.test && checkStore.selectTestItems.preTest && newValue == 2:',
checkStore.selectTestItems.test && checkStore.selectTestItems.preTest && newValue == 2
)
if (checkStore.selectTestItems.test && checkStore.selectTestItems.preTest && newValue == 2) {
setTimeout(() => {
testRef.value.initializeParameters()
testRef.value.showTestLog()
testRef.value.startTimeCount()
}, 500)
}
console.log('步骤索引', newValue, oldValue)
})
watch(ActiveStatue, function (newValue, oldValue) {
console.log('当前步骤状态-----',newValue);
console.log('stepsActiveIndex-----',stepsActiveIndex.value);
console.log('stepsTotalNum----',stepsTotalNum.value);
console.log('当前步骤状态-----', newValue)
console.log('stepsActiveIndex-----', stepsActiveIndex.value)
console.log('stepsTotalNum----', stepsTotalNum.value)
if (newValue === 'error') {
stepsActiveIndex.value = stepsTotalNum.value + 1
nextStepText.value = '检测失败'
@@ -299,6 +393,7 @@ watch(ActiveStatue, function (newValue, oldValue) {
if (newValue === 'success' && stepsActiveIndex.value === stepsTotalNum.value - 1) {
stepsActiveIndex.value += 2
nextStepText.value = '检测完成'
console.log('🚀 ~ nextStepText.value:', nextStepText.value)
}
if (newValue === 'test_init_fail') {
stepsActiveIndex.value += 2
@@ -317,20 +412,24 @@ watch(ActiveStatue, function (newValue, oldValue) {
nextStep() // 实现自动点击，进入下一个测试内容
//handleSubmitFast()
}
})
const handleQuit = () => {
console.log('handleQuit', ActiveStatue.value)
if (ActiveStatue.value !== 'success' && ActiveStatue.value !== 'waiting' && ActiveStatue.value !== 'paused' && ActiveStatue.value !== 'test_init_fail' && ActiveStatue.value !== 'connect_timeout' && ActiveStatue.value !== 'pause_timeout') {
beforeClose(() => {
})
if (
ActiveStatue.value !== 'success' &&
ActiveStatue.value !== 'waiting' &&
ActiveStatue.value !== 'paused' &&
ActiveStatue.value !== 'test_init_fail' &&
ActiveStatue.value !== 'connect_timeout' &&
ActiveStatue.value !== 'pause_timeout'
) {
beforeClose(() => {})
} else {
handleClose()
}
}
const handlePause = () => {
sendPause()
testRef.value?.handlePause()
@@ -345,8 +444,8 @@ const sendResume = () => {
console.log('发起继续检测请求')
resumeTest({
userPageId: "cdf",
devIds: checkStore.devices.map((item) => item.deviceId),
userPageId: 'cdf',
devIds: checkStore.devices.map(item => item.deviceId),
planId: checkStore.plan.id,
reCheckType: '2', // 0:'系数校验'，'1'为预检测、‘2‘为正式检测、'8'为不合格项复检
userId: userStore.userInfo.id,
@@ -362,19 +461,23 @@ const sendReCheck = () => {
console.log('发送重新检测指令')
startPreTest({
userPageId: JwtUtil.getLoginName(),
devIds: checkStore.devices.map((item) => item.deviceId),
devIds: checkStore.devices.map(item => item.deviceId),
planId: checkStore.plan.id,
reCheckType: '2', // 0:'系数校验'，'1'为预检测、‘2‘为正式检测、'8'为不合格项复检
userId: userStore.userInfo.id,
temperature: checkStore.temperature,
humidity: checkStore.humidity,
testItemList: [checkStore.selectTestItems.preTest, checkStore.selectTestItems.channelsTest, checkStore.selectTestItems.test]
testItemList: [
checkStore.selectTestItems.preTest,
checkStore.selectTestItems.channelsTest,
checkStore.selectTestItems.test
]
}).then(res => {
console.log(res)
if (res.code === 'A001014') {
ElMessageBox.alert('装置配置异常', '初始化失败', {
confirmButtonText: '确定',
type: 'error',
type: 'error'
})
TestStatus.value = 'test_init_fail'
}
@@ -387,7 +490,13 @@ const closeWebSocket = () => {
}
const nextStep = () => {
if (stepsActiveIndex.value == stepsTotalNum.value + 1 || ActiveStatue.value === 'error' || ActiveStatue.value === 'test_init_fail' || ActiveStatue.value === 'connect_timeout' || ActiveStatue.value === 'pause_timeout') {
if (
stepsActiveIndex.value == stepsTotalNum.value + 1 ||
ActiveStatue.value === 'error' ||
ActiveStatue.value === 'test_init_fail' ||
ActiveStatue.value === 'connect_timeout' ||
ActiveStatue.value === 'pause_timeout'
) {
handleClose()
return
}
@@ -401,7 +510,7 @@ const nextStep = () => {
console.log('selectTestItemsKey1')
stepsActiveView.value = idx
stepsActive.value = idx
console.log('stepsActiveView.value999', stepsActiveView.value)
return
}
if (checkStore.selectTestItems[selectTestItemsKey] && tempStep != 0) {
@@ -426,10 +535,10 @@ function clearData() {
stepsTotalNum.value = -1
stepsActiveIndex.value = 1
stepsActiveView.value = -1
preTestStatus.value = "waiting"
TestStatus.value = "waiting"
ActiveStatue.value = "waiting"
nextStepText.value = "下一步"
preTestStatus.value = 'waiting'
TestStatus.value = 'waiting'
ActiveStatue.value = 'waiting'
nextStepText.value = '下一步'
}
const beforeClose = (done: () => void) => {
@@ -437,9 +546,8 @@ const beforeClose = (done: () => void) => {
ElMessageBox.confirm('检测未完成，是否退出当前检测流程?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
type: 'warning'
}).then(() => {
handleClose()
})
} else {
@@ -450,11 +558,11 @@ const beforeClose = (done: () => void) => {
const handleClose = () => {
showSteps.value = false
dataSocket.socketServe.closeWs()
dialogVisible.value = false;
dialogVisible.value = false
clearData()
showComponent.value = false;
showComponent.value = false
emit('quitClicked'); // 触发事件
emit('quitClicked') // 触发事件
}
// 对外映射
@@ -462,7 +570,6 @@ defineExpose({open})
</script>
<style scoped lang="scss">
.test-head-steps {
::v-deep .el-step {
.el-step__head.is-success {
@@ -485,24 +592,31 @@ defineExpose({open})
}
.steps-container :deep(.el-step__title) {
font-size: 20px !important; /* 设置标题字体大小 */
font-size: 20px !important;
/* 设置标题字体大小 */
vertical-align: baseline !important;
display: inline-block; /* 确保文字和图标在同一行 */
line-height: 1; /* 调整行高以确保底部对齐 */
display: inline-block;
/* 确保文字和图标在同一行 */
line-height: 1;
/* 调整行高以确保底部对齐 */
}
.steps-container :deep(.el-step__icon-inner) {
font-size: 18px !important;
vertical-align: baseline !important;
display: inline-block; /* 确保文字和图标在同一行 */
line-height: 1; /* 调整行高以确保底部对齐 */
display: inline-block;
/* 确保文字和图标在同一行 */
line-height: 1;
/* 调整行高以确保底部对齐 */
}
.steps-container :deep(.el-step__icon) {
font-size: 18px !important;
vertical-align: baseline !important;
display: inline-block; /* 确保文字和图标在同一行 */
line-height: 1; /* 调整行高以确保底部对齐 */
display: inline-block;
/* 确保文字和图标在同一行 */
line-height: 1;
/* 调整行高以确保底部对齐 */
}
.loading-box {
@@ -513,6 +627,7 @@ defineExpose({open})
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}

137
frontend/src/views/home/components/deviceConnectionPopup.vue
View File

@@ -1,6 +1,10 @@
<template>
<el-dialog title="设备通道配对" v-model='dialogVisible' v-bind="dialogBig" >
<div class="flow-container" style="overflow: hidden; position: relative" :style="{ height: dialogHeight + 'px' }">
<el-dialog title="设备通道配对" v-model="dialogVisible" v-bind="dialogBig">
<div
class="flow-container"
style="overflow: hidden; position: relative"
:style="{ height: dialogHeight + 'px' }"
>
<!-- <el-button @click="logConnections">打印当前配对</el-button> -->
<VueFlow
:nodes="nodes"
@@ -22,8 +26,7 @@
@connect-end="handleConnectEnd"
@pane-ready="onPaneReady"
v-on:pane-mouse-move="false"
>
</VueFlow>
></VueFlow>
</div>
<!-- 底部操作按钮 -->
@@ -37,27 +40,24 @@
<!-- 手动检测-勾选检测项弹窗 -->
<SelectTestItemPopup ref="selectTestItemPopupRef" @openTestDialog="openTestDialog"></SelectTestItemPopup>
<CompareTestPopup ref='testPopup'></CompareTestPopup>
<CompareTestPopup ref="testPopup"></CompareTestPopup>
</template>
<script lang="ts" setup>
import { h, ref } from 'vue'
import { VueFlow, useVueFlow } from '@vue-flow/core'
import { dialogBig } from "@/utils/elementBind";
import { dialogBig } from '@/utils/elementBind'
import { Platform, Flag } from '@element-plus/icons-vue'
import { Device } from '@/api/device/interface/device';
import { StandardDevice } from '@/api/device/interface/standardDevice';
import SelectTestItemPopup from "@/views/home/components/selectTestItemPopup.vue";
import { Device } from '@/api/device/interface/device'
import { StandardDevice } from '@/api/device/interface/standardDevice'
import SelectTestItemPopup from '@/views/home/components/selectTestItemPopup.vue'
import CompareTestPopup from './compareTestPopup.vue'
import { ElMessage } from 'element-plus';
import { ElMessage } from 'element-plus'
import CustomEdge from './RemoveableEdge.vue' // 导入自定义连接线组件
import { jwtUtil } from "@/utils/jwtUtil";
import {useCheckStore} from "@/stores/modules/check";
import { jwtUtil } from '@/utils/jwtUtil'
import { useCheckStore } from '@/stores/modules/check'
const checkStore = useCheckStore();
const checkStore = useCheckStore()
const dialogVisible = ref(false)
const selectTestItemPopupRef = ref<InstanceType<typeof SelectTestItemPopup>>()
const testPopup = ref()
@@ -79,7 +79,9 @@ const onPaneReady = () => {
// 提取公共的label渲染函数
const createLabel = (text: string, type: string) => {
return h('div', {
return h(
'div',
{
style: {
display: 'flex',
flexDirection: 'column',
@@ -91,7 +93,8 @@ const createLabel = (text: string, type: string) => {
padding: '8px',
backgroundColor: '#f9f9f9'
}
}, [
},
[
h(Platform, {
style: {
width: '20px',
@@ -101,11 +104,14 @@ const createLabel = (text: string, type: string) => {
}),
h('div', null, '设备名称：' + text),
h('div', null, '设备类型：' + type)
]) as any
]
) as any
}
const createLabel3 = (text: string) => {
return h('div', {
return h(
'div',
{
style: {
display: 'flex',
alignItems: 'center',
@@ -116,7 +122,8 @@ const createLabel3 = (text: string) => {
padding: '8px',
backgroundColor: '#f9f9f9'
}
}, [
},
[
h(Flag, {
style: {
width: '20px',
@@ -125,10 +132,10 @@ const createLabel3 = (text: string) => {
}
}),
text
]) as any
]
) as any
}
const handleConnectStart = (params: any) => {
onPaneReady()
}
@@ -138,14 +145,12 @@ const handleConnectEnd = (params: any) => {
}
const handleConnect = (params: any) => {
console.log('连接信息:', params);
console.log('连接信息:', params)
const sourceNode = nodes.value.find(node => node.id === params.source)
const targetNode = nodes.value.find(node => node.id === params.target)
// 连接规则验证
const isValidConnection =
sourceNode?.type === 'input' &&
targetNode?.type === 'output'
const isValidConnection = sourceNode?.type === 'input' && targetNode?.type === 'output'
if (!isValidConnection) {
removeEdge(params)
@@ -154,47 +159,46 @@ const handleConnect = (params: any) => {
}
// 过滤掉当前连接，检查是否还有重复的
const existingEdges = edges.value.filter(edge =>
edge.source === params.source || edge.target === params.target
);
const existingEdges = edges.value.filter(edge => edge.source === params.source || edge.target === params.target)
// 如果同源或同目标的连接超过1个，说明有重复
if (existingEdges.length > 1) {
const duplicateSource = existingEdges.filter(edge => edge.source === params.source).length > 1;
const duplicateTarget = existingEdges.filter(edge => edge.target === params.target).length > 1;
const duplicateSource = existingEdges.filter(edge => edge.source === params.source).length > 1
const duplicateTarget = existingEdges.filter(edge => edge.target === params.target).length > 1
if (duplicateSource) {
removeEdge(params);
ElMessage.warning('该被检通道已经连接，不能重复连接');
return;
removeEdge(params)
ElMessage.warning('该被检通道已经连接，不能重复连接')
return
}
if (duplicateTarget) {
removeEdge(params);
ElMessage.warning('该标准通道已经连接，不能重复连接');
return;
removeEdge(params)
ElMessage.warning('该标准通道已经连接，不能重复连接')
return
}
}
}
// 删除不合法连接
const removeEdge = (params: any) => {
const edgeIndex = edges.value.findIndex(edge =>
edge.source === params.source && edge.target === params.target
)
const edgeIndex = edges.value.findIndex(edge => edge.source === params.source && edge.target === params.target)
if (edgeIndex !== -1) {
edges.value.splice(edgeIndex, 1)
}
}
const nodes = ref([])
const planId = ref('')
const devIds = ref<string[]>()
const standardDevIds = ref<string[]>()
const open = async (device: Device.ResPqDev[], standardDev: StandardDevice.ResPqStandardDevice[],fatherPlanId: string) => {
console.log('device:', device);
const open = async (
device: Device.ResPqDev[],
standardDev: StandardDevice.ResPqStandardDevice[],
fatherPlanId: string
) => {
console.log('device:', device)
edges.value = []
devIds.value = device.map(d => d.id)
standardDevIds.value = standardDev.map(d => d.id)
@@ -204,32 +208,57 @@ const open = async (device: Device.ResPqDev[], standardDev: StandardDevice.ResPq
onPaneReady()
}
const handleNext = () => {
const handleNext = async () => {
if (edges.value.length === 0) {
ElMessage.warning('请先完成通道配对')
return
}
// const sourceKey = edge.source.replace('被检通道-', '').replace('-', '_');
let chnNumList: object[] = []
await edges.value.forEach(edge => {
const match = edge.source.split('-')
if (match) {
chnNumList.push({
deviceId: match[1],
label: match[2]
})
}
})
console.log('🚀 ~ handleNext ~ edges.value:', edges.value)
await checkStore.setChnNum(chnNumList)
dialogVisible.value = false
selectTestItemPopupRef.value?.open()
}
const openTestDialog = async () => {
// 转换连接信息，只保留设备ID和通道号
const connections = edges.value.reduce((map, edge) => {
const connections = edges.value.reduce(
(map, edge) => {
// 从source中提取设备ID和通道号: 被检通道-{deviceId}-{channelNum} => {deviceId}-{channelNum}
const sourceKey = edge.source.replace('被检通道-', '').replace('-', '_');
const sourceKey = edge.source.replace('被检通道-', '').replace('-', '_')
// 从target中提取设备ID和通道号: 标准通道-{deviceId}-{channelNum} => {deviceId}-{channelNum}
const targetValue = edge.target.replace('标准通道-', '').replace('-', '_');
map[sourceKey] = targetValue;
return map;
}, {} as Record<string, string>);
const targetValue = edge.target.replace('标准通道-', '').replace('-', '_')
map[sourceKey] = targetValue
return map
},
{} as Record<string, string>
)
generateChannelMapping()
testPopup.value?.open(dialogTitle.value,channelMapping.value,planId.value,jwtUtil.getLoginName(),devIds.value,standardDevIds.value,connections)
testPopup.value?.open(
dialogTitle.value,
channelMapping.value,
planId.value,
jwtUtil.getLoginName(),
devIds.value,
standardDevIds.value,
connections
)
}
// 转换 edges.value 为 channelMapping 格式
@@ -303,7 +332,7 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
}))
const newNodes: any[] = []
const deviceChannelGroups: { deviceId: string; centerY: number; }[] = []
const deviceChannelGroups: { deviceId: string; centerY: number }[] = []
const standardChannelGroups: any[] = []
const deviceWidth = 0