修改正式检测样式

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 }}
-                  </el-button>
+                      style="align-self: center; "
+                      :icon="row.devices[index1].chnResult[index2].resultIcon"
+                  />
                 </el-tooltip>
               </template>
             </el-table-column>
@@ -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 }}
-                </el-button>
+                    :icon="row.devices[index1].chnResult[index2].resultIcon"
+                />
               </el-tooltip>
             </template>
           </el-table-column>
@@ -149,8 +148,6 @@ const customColors = [{color: "#5cb87a", percentage: 100}]
 const scriptData = reactive<CheckData.ScriptItem[]>([])
 // 用来保存被检设备
 const deviceList = reactive<CheckData.Device[]>([])
-// 用来保存定时器
-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;
 //}