ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改通道配对布局

Browse Source
This commit is contained in:
guanj
2025-09-22 15:26:13 +08:00
parent 24d83cfd39
commit dbc21cdbfa
1 changed files with 74 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
frontend/src/views/home/components/channelPairing.vue
View File

@@ -1,29 +1,14 @@
<template>
<div>
<div class="flow-container" style="overflow: hidden; position: relative" :style="{ height: 442 + 'px' }">
<div class="flow-container" style="overflow: hidden; position: relative"
:style="{ height: vueFlowElement + 'px' }">
<!-- <el-button @click="logConnections">打印当前配对</el-button> -->
<VueFlow
:nodes="nodes"
:edges="edges"
:connection-radius="30"
:nodes-draggable="false"
:dragging="false"
:zoom-on-scroll="false"
:pan-on-drag="false"
:disable-zoom-pan-on-connect="true"
:prevent-scrolling="true"
:fit-view="true"
:min-zoom="1"
:max-zoom="1"
:nodesConnectable="checkStore.nodesConnectable"
:elements-selectable="false"
auto-connect
@connect="handleConnect"
@connect-start="handleConnectStart"
@connect-end="handleConnectEnd"
@pane-ready="onPaneReady"
v-on:pane-mouse-move="false"
></VueFlow>
<VueFlow :nodes="nodes" :edges="edges" :connection-radius="30" :nodes-draggable="false" :dragging="false"
:zoom-on-scroll="false" :pan-on-drag="false" :disable-zoom-pan-on-connect="true"
:prevent-scrolling="true" :fit-view="true" :min-zoom="1" :max-zoom="1"
:nodesConnectable="checkStore.nodesConnectable" :elements-selectable="false" auto-connect
@connect="handleConnect" @connect-start="handleConnectStart" @connect-end="handleConnectEnd"
@pane-ready="onPaneReady" v-on:pane-mouse-move="false"></VueFlow>
</div>
<!-- 底部操作按钮 -->
@@ -226,7 +211,7 @@ const open = async () => {
devIds.value = prop.devIdList.map(d => d.id)
standardDevIds.value = prop.pqStandardDevList.map(d => d.id)
planId.value = prop.planIdKey
nodes.value = createNodes(prop.devIdList, prop.pqStandardDevList,prop.deviceMonitor)
nodes.value = createNodes(prop.devIdList, prop.pqStandardDevList, prop.deviceMonitor)
dialogVisible.value = true
onPaneReady()
}
@@ -387,7 +372,17 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
const standardWidth = 1170
// 添加被检通道
let currentYPosition = 50; // 初始Y位置
// let currentYPosition = 50; // 初始Y位置
let actualChannelsTotalLength = 0;
for (const [deviceId, count] of Object.entries(channelCounts)) {
// 直接计算当前设备的通道数并累加，无需完整构建数组
actualChannelsTotalLength += deviceMonitor.has(deviceId)
? (deviceMonitor.get(deviceId) || []).length
: count;
}
let currentYPosition = (vueFlowElement.value - 60 * actualChannelsTotalLength) / 2; // 初始Y位置
const deviceSpacing = 30; // 设备间的垂直间距
Object.entries(channelCounts).forEach(([deviceId, count]) => {
@@ -402,7 +397,7 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
//console.log('deviceId', deviceId, '实际通道号:', actualChannels, '监测点:', monitorPoints);
} else {
// 如果没有monitor数据，默认使用连续的通道号
actualChannels = Array.from({length: count}, (_, i) => i + 1);
actualChannels = Array.from({ length: count }, (_, i) => i + 1);
}
const yPosition = currentYPosition;
@@ -430,7 +425,14 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
});
// 添加标准通道
let currentYPosition2 = 50; // 初始Y位置
// let currentYPosition2 = 50; // 初始Y位置
let totalCount = 0;
// 遍历所有条目并累加 count 值
Object.entries(channelCounts2).forEach(([deviceId, count]) => {
totalCount += count;
});
let currentYPosition2 = (vueFlowElement.value - 60 * totalCount) / 2; // 初始Y位置; // 初始Y位置
const standardDeviceSpacing = 30; // 标准设备间的垂直间距
Object.entries(channelCounts2).forEach(([deviceId, count]) => {
@@ -457,8 +459,22 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
currentYPosition2 += count * 50 + standardDeviceSpacing;
});
// 添加被检设备
let deviceCurrentYPosition = 50; // 与通道计算保持一致的初始位置
let conditionCount = 0;
let Key;
// 提前创建设备ID集合，优化查找性能
const validDeviceIds = new Set(inspectionDevices.map(d => d.id));
for (const { deviceId } of deviceChannelGroups) {
if (validDeviceIds.has(deviceId) && Key !== deviceId) {
conditionCount++;
Key = deviceId;
}
}
// 添加被检设备
// let deviceCurrentYPosition = 50; // 与通道计算保持一致的初始位置
let deviceCurrentYPosition = (vueFlowElement.value - 125 * conditionCount) / 2;; // 与通道计算保持一致的初始位置
let lastDeviceId = ''; // 记录上一个处理的设备ID
deviceChannelGroups.forEach(({ deviceId, centerY }) => {
@@ -477,7 +493,6 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
// 计算设备高度居中位置 - 基于该设备组的实际位置
const deviceCenterY = deviceCurrentYPosition + (actualChannelCount * 50) / 2 - 50
console.log('deviceCenterY', deviceId, deviceCenterY)
newNodes.push({
id: device.id,
data: { label: createLabel(device.name, device.deviceType, 1) },
@@ -494,8 +509,24 @@ const createNodes = (device: Device.ResPqDev[], standardDev: StandardDevice.ResP
}
})
let lastStandardDeviceKey = '';
let channelCount = 0;
const validDeviceKey = new Set(standardDevices.map(d => d.id)); // 提前构建有效ID集合
standardChannelGroups.forEach(({ deviceId }) => {
if (validDeviceKey.has(deviceId) && lastStandardDeviceKey !== deviceId) {
channelCount++;
lastStandardDeviceKey = deviceId;
}
});
// 添加标准设备
let standardDeviceCurrentYPosition = 50; // 与标准通道计算保持一致的初始位置
// let standardDeviceCurrentYPosition = 50; // 与标准通道计算保持一致的初始位置
let standardDeviceCurrentYPosition = (vueFlowElement.value - 125 * channelCount) / 2;; // 与标准通道计算保持一致的初始位置
let lastStandardDeviceId = ''; // 记录上一个处理的标准设备ID
standardChannelGroups.forEach(({ deviceId, centerY }) => {