预检测出错

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

@@ -24,7 +24,7 @@
 </template>
 
 <script lang="ts" setup>
-import { h, ref, onMounted, PropType } from 'vue'
+import { h, ref, onMounted, PropType, computed } from 'vue'
 import { VueFlow, useVueFlow } from '@vue-flow/core'
 import { dialogBig } from '@/utils/elementBind'
 import { Platform, Flag } from '@element-plus/icons-vue'
@@ -57,6 +57,10 @@ const prop = defineProps({
     deviceMonitor: {
         type: Map as PropType<Map<string, any[]>>,
         default: () => new Map()
+    },
+     dialogWidth: {  
+        type: Number,
+        default: 0
     }
 })
 // 计算对话框高度
@@ -336,6 +340,24 @@ const generateChannelMapping = () => {
     channelMapping.value = mapping
 }
 
+
+// 计算基于 dialogWidth 的位置参数 - 确保最小距离
+const deviceWidthVal = computed(() => {
+  return Math.max(0, 50)
+})
+
+const inputChannelXVal = computed(() => {
+  return Math.max(300, deviceWidthVal.value + 300)
+})
+
+const outputChannelXVal = computed(() => {
+  return Math.max(650, prop.dialogWidth - 470)
+})
+
+const standardWidthVal = computed(() => {
+  return Math.max(800, prop.dialogWidth - 350)
+})
+
 const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResPqStandardDevice[], deviceMonitor: Map<string, any[]>) => {
     const channelCounts: Record<string, number> = {}
     device.forEach(device => {
@@ -366,12 +388,15 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
     const deviceChannelGroups: { deviceId: string; centerY: number }[] = []
     const standardChannelGroups: any[] = []
 
-    const deviceWidth = 50
-    const inputChannelX = 350
-    const outputChannelX = 1050
-    const standardWidth = 1170
- 
- 
+    // const deviceWidth = 50
+    // const inputChannelX = 350
+    // const outputChannelX = 1050
+    // const standardWidth = 1170
+    const deviceWidth = deviceWidthVal.value
+    const inputChannelX = inputChannelXVal.value
+    const outputChannelX = outputChannelXVal.value
+    const standardWidth = standardWidthVal.value
+
     // 添加被检通道
     // let currentYPosition = 50; // 初始Y位置
     let actualChannelsTotalLength = 0;
@@ -385,7 +410,6 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
 
     let currentYPosition = (vueFlowElement.value - 60 * actualChannelsTotalLength) / 2; // 初始Y位置
     const deviceSpacing = 30; // 设备间的垂直间距
-    console.log('currentYPosition', currentYPosition)
     Object.entries(channelCounts).forEach(([deviceId, count]) => {
         // 从deviceMonitor中获取实际通道信息
         let actualChannels = []; // 存储实际的通道号