修改比对式检测页面

frontend/src/stores/modules/check.ts

@@ -15,6 +15,7 @@ export const useCheckStore = defineStore(CHECK_STORE_KEY, {
         temperature: 0,
         humidity: 0,
         chnNumList: [],//连线数据
+        nodesConnectable: true,//设置是能可以连线
     }),
     getters: {},
     actions: {
@@ -59,6 +60,9 @@ export const useCheckStore = defineStore(CHECK_STORE_KEY, {
          setChnNum(chnNumList: string[]) {
             this.chnNumList = chnNumList
         },
+         setNodesConnectable(nodesConnectable: boolean) {
+            this.nodesConnectable = nodesConnectable
+        },
 
     }
 });

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

@@ -1,85 +1,88 @@
 <script setup>
 import { BaseEdge, EdgeLabelRenderer, getBezierPath, useVueFlow } from '@vue-flow/core'
 import { computed } from 'vue'
+import { useCheckStore } from '@/stores/modules/check'
 
+const checkStore = useCheckStore()
 const props = defineProps({
-  id: {
+    id: {
-    type: String,
+        type: String,
-    required: true,
+        required: true
-  },
+    },
-  sourceX: {
+    sourceX: {
-    type: Number,
+        type: Number,
-    required: true,
+        required: true
-  },
+    },
-  sourceY: {
+    sourceY: {
-    type: Number,
+        type: Number,
-    required: true,
+        required: true
-  },
+    },
-  targetX: {
+    targetX: {
-    type: Number,
+        type: Number,
-    required: true,
+        required: true
-  },
+    },
-  targetY: {
+    targetY: {
-    type: Number,
+        type: Number,
-    required: true,
+        required: true
-  },
+    },
-  sourcePosition: {
+    sourcePosition: {
-    type: String,
+        type: String,
-    required: true,
+        required: true
-  },
+    },
-  targetPosition: {
+    targetPosition: {
-    type: String,
+        type: String,
-    required: true,
+        required: true
-  },
+    },
-  markerEnd: {
+    markerEnd: {
-    type: String,
+        type: String,
-    required: false,
+        required: false
-  },
+    },
-  style: {
+    style: {
-    type: Object,
+        type: Object,
-    required: false,
+        required: false
-  },
+    }
 })
 
 const { removeEdges } = useVueFlow()
 
 const path = computed(() => getBezierPath(props))
+const edgeStyle = computed(() => ({
+    ...props.style,
+    strokeWidth: 3
+}))
 </script>
 
 <script>
 export default {
-  inheritAttrs: false,
+    inheritAttrs: false
 }
 </script>
 
 <template>
-  <BaseEdge :id="id" :style="style" :path="path[0]" :marker-end="markerEnd" />
+    <BaseEdge :id="id" :style="edgeStyle" :path="path[0]" :marker-end="markerEnd" />
-  <EdgeLabelRenderer>
+    <EdgeLabelRenderer>
-    <div
+        <div
-      :style="{
+            :style="{
-        pointerEvents: 'all',
+                pointerEvents: 'all',
-        position: 'absolute',
+                position: 'absolute',
-        transform: `translate(-50%, -50%) translate(${path[1]}px,${path[2]}px)`,
+                transform: `translate(-50%, -50%) translate(${path[1]}px,${path[2]}px)`
-      }"
+            }"
-      class="nodrag nopan"
+            class="nodrag nopan"
-    >
+        >
-      <el-popconfirm 
+            <el-popconfirm v-if="checkStore.nodesConnectable" title="确定要删除这条连线吗？" @confirm="removeEdges(id)">
-        title="确定要删除这条连线吗？" 
+                <template #reference>
-        @confirm="removeEdges(id)"
+                    <el-icon class="edge-icon"><Delete /></el-icon>
-      >
+                </template>
-        <template #reference>
+            </el-popconfirm>
-          <el-icon class="edge-icon"><Delete/></el-icon>
+        </div>
-        </template>
+    </EdgeLabelRenderer>
-      </el-popconfirm>
-    </div>
-  </EdgeLabelRenderer>
 </template>
 <style scoped>
 .edge-icon {
-  background: white;
+    background: white;
-  border-radius: 50%;
+    border-radius: 50%;
-  padding: 2px;
+    padding: 2px;
-  cursor: pointer;
+    cursor: pointer;
-  box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
+    box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
 }
 </style>

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

@@ -15,6 +15,8 @@
                 :fit-view="true"
                 :min-zoom="1"
                 :max-zoom="1"
+                :nodesConnectable="checkStore.nodesConnectable"
+     
                 :elements-selectable="false"
                 auto-connect
                 @connect="handleConnect"
@@ -67,10 +69,12 @@ const prop = defineProps({
     planIdKey: {
         type: String,
         default: ''
-    }
+    },
+
 })
 // 计算对话框高度
 const dialogHeight = ref(600)
+
 // 初始化 VueFlow，注册自定义连线类型
 const { edges, setViewport } = useVueFlow({
     edgeTypes: {
@@ -93,7 +97,7 @@ const createLabel = (text: string, type: string) => {
                 flexDirection: 'column',
                 alignItems: 'center',
                 fontSize: '15px',
-                textAlign: 'center',
+                // textAlign: 'center',
                 border: '1px solid #ccc',
                 borderRadius: '8px',
                 padding: '8px',
@@ -108,8 +112,9 @@ const createLabel = (text: string, type: string) => {
                     color: '#526ade'
                 }
             }),
-            h('div', null, '设备名称：' + text),
+            h('div', { style: { textAlign: 'left' } }, ['设备名称：' + text, h('br'), '设备类型：' + type])
-            h('div', null, '设备类型：' + type)
+            // h('div', null, '设备名称：' + text),
+            // h('div', null, '设备类型：' + type)
         ]
     ) as any
 }
@@ -357,13 +362,13 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
     const deviceChannelGroups: { deviceId: string; centerY: number }[] = []
     const standardChannelGroups: any[] = []
 
-    const deviceWidth = 150
+    const deviceWidth = 100
     const inputChannelX = 350
     const outputChannelX = 1020
     const standardWidth = 1170
 
-    const yPosition = ref(25)
+    const yPosition = ref(75)
-    const yPosition2 = ref(25)
+    const yPosition2 = ref(75)
 
     // 添加被检通道
     Object.entries(channelCounts).forEach(([deviceId, count]) => {
@@ -375,6 +380,7 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
                 data: { label: createLabel3(`被检通道${i}`) },
                 position: { x: inputChannelX, y: yPosition.value },
                 sourcePosition: 'right',
+
                 style: { width: '150px', border: 'none', boxShadow: 'none' }
             })
 
@@ -456,7 +462,7 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
                 data: { label: createLabel(device.name, device.deviceType) },
                 position: { x: deviceWidth, y: centerY },
                 class: 'no-handle-node',
-                style: { width: '200px', border: 'none', boxShadow: 'none' }
+                style: { width: '250px', border: 'none', boxShadow: 'none' }
             })
         }
     })
@@ -468,9 +474,9 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
             newNodes.push({
                 id: device.id,
                 data: { label: createLabel(device.name, device.deviceType) },
-                position: { x: standardWidth, y: centerY },
+                position: { x: standardWidth, y: centerY + 25 },
                 class: 'no-handle-node',
-                style: { width: '200px', border: 'none', boxShadow: 'none' }
+                style: { width: '250px', border: 'none', boxShadow: 'none' }
             })
         }
     })

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

@@ -284,9 +284,7 @@ watch(testStatus, function (newValue, oldValue) {
         // 开始计时
         startTimeCount()
         showTestLog()
-        setTimeout(() => {
+
-            initCheckResult(CheckData.ChnCheckResultEnum.LOADING)
-        }, 500)
         //startTimer() // todo 可移除
         startData.value = new Date()
         timeDifference.value = 0
@@ -476,6 +474,11 @@ const startTimeCount = () => {
             timeView.value = secondToTime(timeCount.value)
         }, 1000)
     }
+    nextTick(() => {
+       setTimeout(() => {
+           initCheckResult(CheckData.ChnCheckResultEnum.LOADING)
+       }, 500)
+    })
 }
 
 // 停止计时

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

@@ -39,9 +39,13 @@
             </el-steps>
         </div>
         <keep-alive>
-            <ChannelPairing v-if="stepsActiveView == 0" ref="channelPairingRef"   :devIdList="prop.devIdList"
+            <ChannelPairing
-        :pqStandardDevList="prop.pqStandardDevList"
+                v-if="stepsActiveView == 0"
-        :planIdKey="prop.planIdKey" />
+                ref="channelPairingRef"
+                :devIdList="prop.devIdList"
+                :pqStandardDevList="prop.pqStandardDevList"
+                :planIdKey="prop.planIdKey"
+            />
         </keep-alive>
         <keep-alive>
             <ComparePreTest
@@ -159,6 +163,7 @@ const nextStepText = ref('下一步')
 const dialogVisible = ref(false)
 const channelPairingRef = ref()
 const showSteps = ref(false)
+
 const stepsTotalNum = ref(-1) //步骤总数
 const stepsActiveIndex = ref(0) //当前正在执行的步骤索引
 const stepsActiveView = ref(1) //当前正在执行的步骤在（预处理、守时校验、系数校准、正式检测）中的排序，仅用于页面显示
@@ -247,6 +252,7 @@ const open = async (
     if (checkStore.selectTestItems.preTest && !checkStore.selectTestItems.test) {
         testAgain.value = true
     }
+    checkStore.setNodesConnectable(true)
     dialogTitle.value = title
     channelMapping.value = mapping
     planId.value = plan
@@ -331,7 +337,7 @@ const handleSubmitAgain = async () => {
 const handleSubmitFast = async () => {
     if (channelPairingRef.value) {
         const res = await channelPairingRef.value.handleNext()
-        console.log('🚀 ~ handleSubmitFast ~ res:', res)
+
         if (!res) return
         dialogTitle.value = res.title
         channelMapping.value = res.mapping
@@ -340,6 +346,8 @@ const handleSubmitFast = async () => {
         devIds.value = res.devIdsArray
         standardDevIds.value = res.standardDevIdsArray
         pairs.value = res.pair
+        checkStore.setNodesConnectable(false)
+        // nodesConnectable.value = false
     }
     if (!dataSocket.socketServe.connected) {
         ElMessage.error('webSocket连接中断！')

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

@@ -206,6 +206,7 @@ const open = async (
     standardDev: StandardDevice.ResPqStandardDevice[],
     fatherPlanId: string
 ) => {
+    CompareTestVisible.value = false
     selectTestItemPopupRef.value?.open()
     devIdList.value = device
     pqStandardDevList.value = standardDev
@@ -484,6 +485,7 @@ defineExpose({ open })
 <style>
 .flow-container {
     width: 100%;
+   
     overflow: hidden;
 }
 

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

@@ -77,13 +77,13 @@
                         <el-button type="primary" icon="Search" @click="handleSearch">查询</el-button>
                         <el-button icon="Delete" @click="handleRefresh">重置</el-button>
                         <!-- 比对模式下的通道配对功能 -->
-                        <el-button type="primary" icon="Clock" @click="handleTest2">通道配对</el-button>
+                        <el-button type="primary" icon="Clock" @click="handleTest2" v-if="modeStore.currentMode == '比对式'">手动检测</el-button>
                         <!-- 设备检测模式下的操作按钮 -->
                         <el-button
                             type="primary"
                             icon="Clock"
                             @click="handleTest('手动检测')"
-                            v-if="form.activeTabs === 0"
+                            v-if="form.activeTabs === 0 &&modeStore.currentMode == '模拟式'"
                         >
                             手动检测
                         </el-button>