修改比对式检测页面

2025-08-27 11:17:13 +08:00
parent 4a6db824ba
commit 772707ac42
7 changed files with 107 additions and 81 deletions
--- a/frontend/src/stores/modules/check.ts
+++ b/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
+        },

    }
 });
--- a/frontend/src/views/home/components/RemoveableEdge.vue
+++ b/frontend/src/views/home/components/RemoveableEdge.vue
@@ -1,74 +1,77 @@
 <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: {
        type: String,
-    required: true,
+        required: true
    },
    sourceX: {
        type: Number,
-    required: true,
+        required: true
    },
    sourceY: {
        type: Number,
-    required: true,
+        required: true
    },
    targetX: {
        type: Number,
-    required: true,
+        required: true
    },
    targetY: {
        type: Number,
-    required: true,
+        required: true
    },
    sourcePosition: {
        type: String,
-    required: true,
+        required: true
    },
    targetPosition: {
        type: String,
-    required: true,
+        required: true
    },
    markerEnd: {
        type: String,
-    required: false,
+        required: false
    },
    style: {
        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>
        <div
            :style="{
                pointerEvents: 'all',
                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"
        >
-      <el-popconfirm 
-        title="确定要删除这条连线吗？" 
-        @confirm="removeEdges(id)"
-      >
+            <el-popconfirm v-if="checkStore.nodesConnectable" title="确定要删除这条连线吗？" @confirm="removeEdges(id)">
                <template #reference>
-          <el-icon class="edge-icon"><Delete/></el-icon>
+                    <el-icon class="edge-icon"><Delete /></el-icon>
                </template>
            </el-popconfirm>
        </div>
--- a/frontend/src/views/home/components/channelPairing.vue
+++ b/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', null, '设备类型：' + type)
+            h('div', { style: { textAlign: 'left' } }, ['设备名称：' + text, h('br'), '设备类型：' + 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 yPosition2 = ref(25)
+    const yPosition = ref(75)
+    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' }
            })
        }
    })
--- a/frontend/src/views/home/components/compareTest.vue
+++ b/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)
+    })
 }

 // 停止计时
--- a/frontend/src/views/home/components/compareTestPopup.vue
+++ b/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
+                v-if="stepsActiveView == 0"
+                ref="channelPairingRef"
+                :devIdList="prop.devIdList"
                :pqStandardDevList="prop.pqStandardDevList"
-        :planIdKey="prop.planIdKey" />
+                :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连接中断！')
--- a/frontend/src/views/home/components/deviceConnectionPopup.vue
+++ b/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;
 }

--- a/frontend/src/views/home/components/table.vue
+++ b/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>