From af454e1a56046196d652c858856832bcbee6161b Mon Sep 17 00:00:00 2001 From: caozehui <2427765068@qq.com> Date: Thu, 26 Dec 2024 10:49:55 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=AD=A3=E5=BC=8F=E6=A3=80?= =?UTF-8?q?=E6=B5=8B=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/check/interface/index.ts | 11 +- frontend/src/views/home/components/test.vue | 531 ++++++++++++------ .../src/views/home/components/testPopup.vue | 5 +- 3 files changed, 380 insertions(+), 167 deletions(-) diff --git a/frontend/src/api/check/interface/index.ts b/frontend/src/api/check/interface/index.ts index 4c7c1d1..ef4ffed 100644 --- a/frontend/src/api/check/interface/index.ts +++ b/frontend/src/api/check/interface/index.ts @@ -51,8 +51,11 @@ export namespace CheckData { // 用来描述 通道检测结果 export enum ChnCheckResultEnum { UNKNOWN = -1, - FAIL = 0, - SUCCESS = 1, + LOADING = 0, + FAIL = 1, + SUCCESS = 2, + UNCONNECTED=3, + ERRORDATA = 4 } //用来描述 某个脚本测试项对所有通道的检测结果 @@ -72,8 +75,8 @@ export namespace CheckData { * 用于描述 （设备）通道检测结果展示的按钮类型 */ export interface ButtonResult { - resultType: 'info' | 'success' | 'danger', - resultValue: '-' | '√' | '×' + resultType: 'info' | 'info' | 'danger' | 'success' | 'warning' + resultIcon: 'Minus' | 'Loading' | 'Close' | 'CircleCheckFilled' | 'WarnTriangleFilled' } /** diff --git a/frontend/src/views/home/components/test.vue b/frontend/src/views/home/components/test.vue index 707aaa8..546ec68 100644 --- a/frontend/src/views/home/components/test.vue +++ b/frontend/src/views/home/components/test.vue @@ -58,9 +58,9 @@ :type="row.devices[index1].chnResult[index2].resultType" size="small" @click="handleClick(row.scriptId,item.deviceId,chnItem)" - > - {{ row.devices[index1].chnResult[index2].resultValue }} - + style="align-self: center; " + :icon="row.devices[index1].chnResult[index2].resultIcon" + /> @@ -78,9 +78,8 @@ :type="row.devices[index].chnResult[0].resultType" size="small" @click="handleClick(row.scriptId,item.deviceId,-1)" - > - {{ row.devices[index].chnResult[0].resultValue }} - + :icon="row.devices[index1].chnResult[index2].resultIcon" + /> @@ -149,8 +148,6 @@ const customColors = [{color: "#5cb87a", percentage: 100}] const scriptData = reactive([]) // 用来保存被检设备 const deviceList = reactive([]) -// 用来保存定时器 -const timer: any = ref(""); // 当前进行的测试项索引 const activeIndex = ref(0) // 百分比 @@ -199,12 +196,24 @@ const checkResultView = computed(() => { if (chnSum.value <= MAX_CHN_SUM) { for (let j = 0; j < device.chnResult.length; j++) { - if (device.chnResult[j] == CheckData.ChnCheckResultEnum.UNKNOWN) { - tempChnBtnResult.push({resultType: 'info', resultValue: '-'}) - } else if (device.chnResult[j] == CheckData.ChnCheckResultEnum.FAIL) { - tempChnBtnResult.push({resultType: 'danger', resultValue: '×'}) - } else { - tempChnBtnResult.push({resultType: 'success', resultValue: '√'}) + switch (device.chnResult[j]) { + case CheckData.ChnCheckResultEnum.UNKNOWN: + tempChnBtnResult.push({resultType: 'info', resultIcon: 'Minus'}) + break; + case CheckData.ChnCheckResultEnum.LOADING: + tempChnBtnResult.push({resultType: 'info', resultIcon: 'Loading'}) + break; + case CheckData.ChnCheckResultEnum.FAIL: + tempChnBtnResult.push({resultType: 'danger', resultIcon: 'Close'}) + break; + case CheckData.ChnCheckResultEnum.SUCCESS: + tempChnBtnResult.push({resultType: 'success', resultIcon: 'CircleCheckFilled'}) + break; + case CheckData.ChnCheckResultEnum.UNCONNECTED: + tempChnBtnResult.push({resultType: 'warning', resultIcon: 'WarnTriangleFilled'}) + break; + default: + break; } } } else { @@ -212,12 +221,24 @@ const checkResultView = computed(() => { if (device.chnResult.some(item => item == CheckData.ChnCheckResultEnum.FAIL)) { tempChnResult = CheckData.ChnCheckResultEnum.FAIL } - if (tempChnResult == CheckData.ChnCheckResultEnum.UNKNOWN) { - tempChnBtnResult.push({resultType: 'info', resultValue: '-'}) - } else if (tempChnResult == CheckData.ChnCheckResultEnum.FAIL) { - tempChnBtnResult.push({resultType: 'danger', resultValue: '×'}) - } else { - tempChnBtnResult.push({resultType: 'success', resultValue: '√'}) + switch (tempChnResult) { + case CheckData.ChnCheckResultEnum.UNKNOWN: + tempChnBtnResult.push({resultType: 'info', resultIcon: 'Minus'}) + break; + case CheckData.ChnCheckResultEnum.LOADING: + tempChnBtnResult.push({resultType: 'info', resultIcon: 'Loading'}) + break; + case CheckData.ChnCheckResultEnum.FAIL: + tempChnBtnResult.push({resultType: 'danger', resultIcon: 'Close'}) + break; + case CheckData.ChnCheckResultEnum.SUCCESS: + tempChnBtnResult.push({resultType: 'success', resultIcon: 'CircleCheckFilled'}) + break; + case CheckData.ChnCheckResultEnum.UNCONNECTED: + tempChnBtnResult.push({resultType: 'warning', resultIcon: 'WarnTriangleFilled'}) + break; + default: + break; } } @@ -235,8 +256,8 @@ const checkResultView = computed(() => { watch(testStatus, function (newValue, oldValue) { if (newValue == 'start') { + startTimer() // todo 可移除 emit('update:testStatus', 'process') - startTimer() } if (newValue == 'paused' && oldValue == 'process') { handlePauseOrContinue() @@ -249,42 +270,125 @@ watch(testStatus, function (newValue, oldValue) { watch(webMsgSend, function (newValue, oldValue) { if (activeIndex.value <= checkTotal.value) { switch (newValue.requestId) { - case 'Test_Freq': - console.log('检测开始') - updateCheckResultView("Freq") + case 'Test_Freq_Start': + updateCheckResultView("Freq", true) break; - case 'Test_VOL': - updateCheckResultView("VOL") + case 'Test_Freq_End': + updateCheckResultView("Freq", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; - case 'Test_Harm_V': - updateCheckResultView("Harm_V") + case 'Test_VOL_Start': + updateCheckResultView("VOL", true) break; - case 'Test_Harm_I': - updateCheckResultView("Harm_I") + case 'Test_VOL_End': + updateCheckResultView("VOL", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; - case 'Test_Harm_P': - updateCheckResultView("Harm_P") + case 'Test_Harm_V_Start': + updateCheckResultView("Harm_V", true) break; - case 'Test_InHarm_V': - updateCheckResultView("InHarm_V") + case 'Test_Harm_V_End': + updateCheckResultView("Harm_V", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; - case 'Test_InHarm_I': - updateCheckResultView("InHarm_I") + case 'Test_Harm_I_Start': + updateCheckResultView("Harm_I", true) break; - case 'Test_Dip': - updateCheckResultView("Dip") + case 'Test_Harm_I_End': + updateCheckResultView("Harm_I", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; - case 'Test_CUR': - updateCheckResultView("CUR") + case 'Test_Harm_P_Start': + updateCheckResultView("Harm_P", true) break; - case 'Test_MSQI_U': - updateCheckResultView("MSQI_U") + case 'Test_Harm_P_End': + updateCheckResultView("Harm_P", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; - case 'Test_MSQI_I': - updateCheckResultView("MSQI_I") + case 'Test_InHarm_V_Start': + updateCheckResultView("InHarm_V", true) break; - case 'Test_Flicker': - updateCheckResultView("Flicker") + case 'Test_InHarm_V_End': + updateCheckResultView("InHarm_V", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_InHarm_I_Start': + updateCheckResultView("InHarm_I", true) + break; + case 'Test_InHarm_I_End': + updateCheckResultView("InHarm_I", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_Dip_Start': + updateCheckResultView("Dip", true) + break; + case 'Test_Dip_End': + updateCheckResultView("Dip", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_CUR_Start': + updateCheckResultView("CUR", true) + break; + case 'Test_CUR_End': + updateCheckResultView("CUR", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_MSQI_U_Start': + updateCheckResultView("MSQI_U", true) + break; + case 'Test_MSQI_U_End': + updateCheckResultView("MSQI_U", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_MSQI_I_Start': + updateCheckResultView("MSQI_I", true) + break; + case 'Test_MSQI_I_End': + updateCheckResultView("MSQI_I", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } + break; + case 'Test_Flicker_Start': + updateCheckResultView("Flicker", true) + break; + case 'Test_Flicker_End': + updateCheckResultView("Flicker", false) + activeIndex.value++; + if (testStatus.value != 'paused') { + startTimer() + } break; case 'Test_Quit': console.log('检测结束') @@ -292,14 +396,11 @@ watch(webMsgSend, function (newValue, oldValue) { } updateLog() - activeIndex.value++; if (percentage.value < 100) { percentage.value = Math.trunc(activeIndex.value / checkTotal.value * 100); } else { percentage.value = 100; - clearInterval(timer.value) - timer.value = null; emit('update:testStatus', 'success') ElMessageBox.alert('检测全部结束,你可以停留在此页面查看检测结果，或返回首页进行复检、报告生成和归档等操作', '检测完成', { @@ -310,8 +411,6 @@ watch(webMsgSend, function (newValue, oldValue) { clear(); } } else { - clearInterval(timer.value) - timer.value = null; emit('update:testStatus', 'success') scrollToBottom(); } @@ -694,14 +793,44 @@ function tableCell({row, columnIndex}) { } } -const updateCheckResultView = (scriptCode: string) => { +const updateCheckResultView = (scriptCode: string, isStart: boolean) => { let scriptId = scriptData.filter(item => item.code === scriptCode)[0]?.id - let temp = simulateCheck(scriptId) + let temp = null + if (isStart) { + temp = getLoadingResult(scriptId) + } else { + temp = getCheckResult(scriptId) + } updateCheckResult(temp) }; +// 获取loading状态的结果 +const getLoadingResult = (scriptId: string) => { + let devices = [] + + devices = deviceList.map(item => { + + let tempChnResult: CheckData.ChnCheckResultEnum[] = [] + for (let i = 0; i < item.chnNum; i++) { + tempChnResult.push(CheckData.ChnCheckResultEnum.LOADING) + } + + return { + deviceId: item.deviceId, + deviceName: item.deviceName, + chnResult: tempChnResult, + } + }) + + let tempScriptChnItem: CheckData.ScriptChnItem = { + scriptId, + devices, + } + + return tempScriptChnItem +} // 模拟检测 todo 可移除 -const simulateCheck = (scriptId: string) => { +const getCheckResult = (scriptId: string) => { let devices = [] devices = deviceList.map(item => { @@ -712,9 +841,9 @@ const simulateCheck = (scriptId: string) => { } let randomNum = getRandomInt(item.chnNum * 2) - if (activeIndex.value >= 4 && activeIndex.value <= 6) { + if (activeIndex.value >= 2 && activeIndex.value <= 8) { if (randomNum < item.chnNum) { - tempChnResult[randomNum] = CheckData.ChnCheckResultEnum.FAIL + tempChnResult[randomNum] = (randomNum % 2 === 0 ? 1 : 3) errorCheckItem.push(scriptId) } @@ -748,7 +877,8 @@ const handlePauseOrContinue = () => { type: 'info', log: currentTime.value + '：暂停检测', }) - pauseTimer() + //pauseTimer() + console.log('暂停中') } if (testStatus.value == "process") { startData.value = new Date(); @@ -756,7 +886,9 @@ const handlePauseOrContinue = () => { type: 'info', log: currentTime.value + '：继续检测', }) - resumeTimer() + //resumeTimer() + startTimer() + console.log('开始继续检测') } }; @@ -765,111 +897,181 @@ const handleClick = (scriptId: string, deviceId: any, chnNum: number) => { dataCheckSingleChannelSingleTestPopupRef.value?.open(deviceId, chnNum, scriptId); }; +// todo 可移除 const startTimer = () => { if (activeIndex.value === 0) { + console.log('检测开始') activeIndex.value++; } - //if (timer.value !== null) return; // 如果定时器已经启动，则不再重复启动 - timer.value = setInterval(() => { - if (activeIndex.value <= checkTotal.value) { - switch (activeIndex.value) { - case 1: - emit('update:webMsgSend', { - requestId: 'Test_Freq', - params: {} - }) - break; - case 2: - emit('update:webMsgSend', { - requestId: 'Test_VOL', - params: {} - }) - break; - case 3: - emit('update:webMsgSend', { - requestId: 'Test_Harm_V', - params: {} - }) - break; - case 4: - emit('update:webMsgSend', { - requestId: 'Test_Harm_I', - params: {} - }) - break; - case 5: - emit('update:webMsgSend', { - requestId: 'Test_Harm_P', - params: {} - }) - break; - case 6: - emit('update:webMsgSend', { - requestId: 'Test_InHarm_V', - params: {} - }) - break; - case 7: - emit('update:webMsgSend', { - requestId: 'Test_InHarm_I', - params: {} - }) - break; - case 8: - emit('update:webMsgSend', { - requestId: 'Test_Dip', - params: {} - }) - break; - case 9: - emit('update:webMsgSend', { - requestId: 'Test_CUR', - params: {} - }) - break; - case 10: - emit('update:webMsgSend', { - requestId: 'Test_MSQI_U', - params: {} - }) - break; - case 11: - emit('update:webMsgSend', { - requestId: 'Test_MSQI_I', - params: {} - }) - break; - case 12: - emit('update:webMsgSend', { - requestId: 'Test_Flicker', - params: {} - }) - break; - case 13: - emit('update:webMsgSend', { - requestId: 'Test_Quit', - params: {} - }) - break; - } - } - }, 2000); + console.log('开始检测第' + activeIndex.value + '项') + switch (activeIndex.value) { + case 1: + emit('update:webMsgSend', { + requestId: 'Test_Freq_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Freq_End', + params: {} + }) + }, 2000); + break; + case 2: + emit('update:webMsgSend', { + requestId: 'Test_VOL_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_VOL_End', + params: {} + }) + }, 2000); + break; + case 3: + emit('update:webMsgSend', { + requestId: 'Test_Harm_V_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Harm_V_End', + params: {} + }) + }, 2000) + break; + case 4: + emit('update:webMsgSend', { + requestId: 'Test_Harm_I_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Harm_I_End', + params: {} + }) + }, 2000) + break; + case 5: + emit('update:webMsgSend', { + requestId: 'Test_Harm_P_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Harm_P_End', + params: {} + }) + }, 2000) + break; + case 6: + emit('update:webMsgSend', { + requestId: 'Test_InHarm_V_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_InHarm_V_End', + params: {} + }) + }, 2000) + break; + case 7: + emit('update:webMsgSend', { + requestId: 'Test_InHarm_I_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_InHarm_I_End', + params: {} + }) + }, 2000) + break; + case 8: + emit('update:webMsgSend', { + requestId: 'Test_Dip_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Dip_End', + params: {} + }) + }, 2000) + break; + case 9: + emit('update:webMsgSend', { + requestId: 'Test_CUR_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_CUR_End', + params: {} + }) + }, 2000) + break; + case 10: + emit('update:webMsgSend', { + requestId: 'Test_MSQI_U_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_MSQI_U_End', + params: {} + }) + }, 2000) + break; + case 11: + emit('update:webMsgSend', { + requestId: 'Test_MSQI_I_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_MSQI_I_End', + params: {} + }, 2000) + }) + break; + case 12: + emit('update:webMsgSend', { + requestId: 'Test_Flicker_Start', + params: {} + }) + setTimeout(() => { + emit('update:webMsgSend', { + requestId: 'Test_Flicker_End', + params: {} + }) + }, 2000) + break; + case 13: + emit('update:webMsgSend', { + requestId: 'Test_Quit', + params: {} + }) + break; + } }; -const pauseTimer = () => { - if (timer.value) { - clearInterval(timer.value); - timer.value = null; - } - console.log('暂停中') -}; +// const pauseTimer = () => { +// if (timer.value) { +// clearInterval(timer.value); +// timer.value = null; +// } +// console.log('暂停中') +// }; -const resumeTimer = () => { - if (!timer.value) { - startTimer(); - } - console.log('开始继续检测') -}; +// const resumeTimer = () => { +// if (!timer.value) { +// startTimer(); +// } +// console.log('开始继续检测') +// }; //完成检测 const handleFinishTest = () => { @@ -880,11 +1082,9 @@ const handleFinishTest = () => { const handleReCheck = () => { activeIndex.value = 0; percentage.value = 0; - // tableData.value.length = 0; testLogList.value.length = 0; errorCheckItem.length = 0; - //tableData.value = JSON.parse(JSON.stringify(operatorTableData.value)); - resumeTimer() + // resumeTimer() }; function clear() { @@ -958,8 +1158,9 @@ function clear() { font-size: 14px; } } -.drawer-container{ - :deep(header.el-drawer__header){ + +.drawer-container { + :deep(header.el-drawer__header) { color: #fff !important; background-color: #003078 !important; @@ -967,12 +1168,18 @@ function clear() { color: #ccc !important; } - .el-drawer__title{ + .el-drawer__title { color: #fff !important; } } } +.custom-icon { + width: 16px; /* 调整宽度 */ + height: 16px; /* 调整高度 */ + color: #409EFF; /* 调整颜色 */ +} + //:deep(.el-drawer .el-drawer__title){ // background-color: #003078 !important; //} diff --git a/frontend/src/views/home/components/testPopup.vue b/frontend/src/views/home/components/testPopup.vue index 35ab4df..270e8f4 100644 --- a/frontend/src/views/home/components/testPopup.vue +++ b/frontend/src/views/home/components/testPopup.vue @@ -243,7 +243,8 @@ const detectionOptions = ref([ // startTest({deviceIds}).then(res => { // console.log(res) // if (res.code === 20000) { - // TestStatus.value = 'process' + // TestStatus.value = 'start' + // webMsgSend.value = '' // } else { // ElMessage.error(res.message) // } @@ -254,6 +255,7 @@ const detectionOptions = ref([ // console.log(res) // if (res.code === 20000) { // TestStatus.value = 'paused' + // webMsgSend.value = '' // } else { // ElMessage.error(res.message) // } @@ -264,6 +266,7 @@ const detectionOptions = ref([ // console.log(res) // if (res.code === 20000) { // TestStatus.value = 'process' + // webMsgSend.value = '' // } else { // ElMessage.error(res.message) // }