查询结果左侧树颜色

frontend/src/views/home/components/compareDataCheckSingleChannelSingleTestPopup.vue

@@ -72,7 +72,17 @@
                         node-key="id"
                         ref="treeRef"
                         @node-click="handleNodeClick"
-                    ></el-tree>
+                        class="custom-tree"
+                    >
+                     <template #default="{ node, data }">
+                        <div class="custom-tree-node">
+                            <span v-if="data.resultFlag === 1">{{ node.label }}</span>
+                            <span v-else-if="data.resultFlag === 2" style="color: #ee6666;">{{ node.label }}</span>
+                            <span v-else-if="data.resultFlag === 4" style="color: #fac858;">{{ node.label }}</span>
+                        </div>
+                    </template>
+                     
+                </el-tree>
                 </div>
                 <div class="content-right">
                     <div class="content-right-title">
@@ -90,7 +100,13 @@
                                     :key="item.value"
                                     :label="item.label"
                                     :value="item.value"
-                                />
+                                >
+                                <div style="display: flex; align-items: center; justify-content: space-between">
+                                      <span v-if="item.resultFlag === 1">{{ item.label }}</span>
+                                      <span v-else-if="item.resultFlag === 2" style="color: #ee6666;">{{ item.label }}</span>
+                                      <span v-else-if="item.resultFlag === 4" style="color: #fac858;">{{ item.label }}</span>
+                                </div>
+                            </el-option>
                             </el-select>
                             <!-- 否则显示原来的文本 -->
                             <span v-else style="color: var(--el-color-primary)">{{ rowList.scriptName }}</span>
@@ -122,6 +138,7 @@
                                     :label="item.replace(/\.0$/, '')"
                                     :value="item"
                                 />
+                                
                             </el-select>
                         </el-form-item>
                     </div>
@@ -200,7 +217,7 @@ const selectedScriptName = ref('')
 const pattern = ref('')
 // 添加以下内容
 const isWaveData = ref(false)
-const scriptNameOptions = ref<{ label: string; value: string }[]>([])
+const scriptNameOptions = ref<{ label: string; value: string;resultFlag:number }[]>([])
 
 // 表单数据
 const formContent = reactive<CheckData.DataCheck>({
@@ -280,7 +297,8 @@ const initGetResult = async () => {
         // 设置录波数据相关的选项
         scriptNameOptions.value = selectScript.value.map(item => ({
             label: item.scriptName,
-            value: item.scriptName
+            value: item.scriptName,
+            resultFlag: item.resultFlag
         }))
 
         // 默认选中第一个选项
@@ -311,7 +329,7 @@ const initScriptData = async () => {
     let temp = response.data.map((item: any) => {
         return {
             ...item,
-            scriptName: item.scriptName
+            scriptName: item.scriptName 
         }
     })
 
@@ -327,7 +345,8 @@ const initScriptData = async () => {
         temp2 = luoboItem.subItems.map((item: any) => {
             return {
                 ...item,
-                scriptName: item.scriptName
+                scriptName: item.scriptName,
+                resultFlag: item.resultFlag ?? 0 // 假设默认值为 0
             }
         })
     }
@@ -502,6 +521,7 @@ const getResults = async (code: any) => {
         }
         currentCheckItem.value = list[0]
         tesList.value = list
+        console.log('checkResultData:', tesList.value)
         checkResultData.value = res.data.resultMap
         rawTableData.value = res.data.rawDataMap
     })
@@ -573,6 +593,30 @@ defineExpose({
 </script>
 
 <style lang="scss" scoped>
+
+.custom-tree {
+  :deep(.el-tree-node__content) {
+    .custom-tree-node {
+      display: flex;
+      align-items: center;
+      width: 100%;
+    }
+    
+    // 根据 resultFlag 设置不同颜色
+    &[data-result-flag="1"] {
+      color: #67c23a; // 绿色 - 符合
+    }
+    
+    &[data-result-flag="2"] {
+      color: #f56c6c; // 红色 - 不符合
+    }
+    
+    &[data-result-flag="4"] {
+      color: #e6a23c; // 橙色 - 警告
+    }
+  }
+}
+
 .dialog {
     display: flex;
     flex-direction: column;
@@ -599,7 +643,7 @@ defineExpose({
                 flex-direction: column;
                 align-items: center;
                 max-height: 495px;
-
+                
                 padding: 10px 0.5% 0px 0.5%;
                 border: 1px solid #ccc;
                 overflow-y: auto;